body {
  margin: 0; color: var(--ink); 
  font-family: "Cormorant Garamond", Georgia, serif; font-size: 18px;
  background-image: radial-gradient(ellipse at 10% 20%, rgba(255,255,255,.5), transparent 55%),
   repeating-linear-gradient(0deg, rgba(123,88,44,.025) 0, rgba(123,88,44,.025) 1px, transparent 1px, transparent 5px);
}
.center{
	background-color:#6b4927;
	position: absolute;
	top:0px;
	margin: 0;
 	width:100%;
	align-items:center;
}
.site{
	top:0px;
	width: auto;
	height: auto;
	margin: 0 auto;
	position: relative;
}
.site .header{
	vertical-align: top;
	width: 1000px;
	height: 350px;
	margin: 0 auto;
	position: relative; 
	background-image:url("assets/header2.png");
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;   
}
.site .header div{
	vertical-align: top;
	padding:0px;
	line-height:1px;
}
.site .body{
	width: 1000px;
	margin: 0 auto;
	background-image:url("assets/backgroung.jpg");
}
.site .body .row{
	vertical-align:top;
	width: 100%;
	height:200px;
 	display: flex;
 	margin:0px;
}

.site .body .row1{
	vertical-align:top;
	width: 100%;
	height:370px;
 	display: flex;
 	margin:0px;
}
.site .body .row2{
	vertical-align:top;
	width: 100%;
	height:330px;
 	display: flex;
 	margin:0px;
}
.sign{
	padding:10px;
	align-items: center;
	justify-content: center;	
}
.obrad{
	padding-top:140px;
	margin-left:20px;
	background-image:url("assets/obrad.jpg");
	background-repeat: no-repeat;
	align-items: center;
	justify-content: center;	
	width:312px;
	height:355px;
}
.obrad div{
	margin-top:-10px;
	padding-left:20px;
}
.hostina{
	padding-top:140px;
	background-image:url("assets/hostina.jpg");
	background-repeat: no-repeat;
	align-items: center;
	justify-content: center;	
	width:312px;
	height:355px;
}
.hostina div{
	margin-top:-10px;
	padding-left:20px;
}

.ubytovani{
	padding-top:140px;
	background-image:url("assets/ubytovani.jpg");
	background-repeat: no-repeat;
	align-items: center;
	justify-content: center;	
	width:312px;
	height:355px;
	padding-bottom:20px;
}
.ubytovani div{
	margin-top:-10px;
	padding-left:20px;
}

.harmonogram{
	padding-top:120px;
	margin-left:20px;
	width:315px;
	height:314px;
	background-image:url("assets/harmonogram.jpg");
	background-repeat: no-repeat;
	align-items: center;
	justify-content: center;	
}
.harmonogram div{
	width:280px;
	margin-top:-10px;
	padding-left:30px;
}

.hudba{
	padding-top:120px;
	width:315px;
	height:314px;
	background-image:url("assets/hudba.jpg");
	background-repeat: no-repeat;
	align-items: center;
	justify-content: center;	
}
.hudba div{
	width:280px;
	margin-top:-10px;
	padding-left:30px;
}

.dary{
	padding-top:120px;
	width:315px;
	height:314px;
	background-image:url("assets/dary.jpg");
	background-repeat: no-repeat;
	align-items: center;
	justify-content: center;
	padding-bottom:20px;		
}
.dary div{
	padding-left:20px;
	width:280px;
	margin-top:-10px;
	padding-left:30px;

}

.kontakt{
	width:946px;
	height:189px;
	margin-left:20px;
	background-image:url("assets/kontakt.jpg");
	background-repeat: no-repeat;
	background-size: 940px;	
	align-items: center;
	justify-content: center;
	padding-bottom:20px;		
}
.site-header {
  position: relative; top: 0; z-index: 20; display: flex; align-items: center; justify-content: center;vertical-align:text-top;
}
.hero-subtitle { font-style: normal; font-size: 15px; margin: 0px;text-align: center; color:#75543a;}
a { color: inherit; }
.nav { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: clamp(12px, 2.5vw, 34px);vertical-align:text-top; }
.nav a { text-decoration: none; font-style: normal; font-size: 17px; padding: 7px 0; border-bottom: 1px solid transparent; }
.nav a:hover, .nav a:focus-visible { color: var(--gold); text-decoration: none;	                                            
  background-image: url('assets/undersign.png');
//  background-size: 200px 5px;
  background-repeat: no-repeat;
  background-position: center 25px; 
 }
h1 { font-family: "Great Vibes";color:#704820;text-align: center;margin-bottom:0px; line-height: 1.55;font-size: 60px; line-height: .95; font-weight: 500; margin: 50 0 12px;padding:0px; }
h2 { font-family: "Great Vibes", cursive;color:#704820; font-size: 32px; text-align: center;margin-bottom:0px;}

p{line-height:1;font-size:14px;padding:0px;} 
.eyebrow { text-transform: uppercase; letter-spacing: .19em; font-size: 12px; font-weight: 600; color: var(--gold); margin: 0 0 8px; }
.detail span { color: var(--gold); display: inline-block; width: 23px;}

/**********************POPUP****************************************************/

.schedule-modal,.accomoddation-modal,.obrad-modal ,.hostina-modal   {
  position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center;
  padding: 24px; opacity: 0; visibility: hidden; transition: opacity .25s ease, visibility .25s ease;
}
.schedule-modal.is-open,.accomoddation-modal.is-open,.obrad-modal.is-open,.hostina-modal.is-open { opacity: 1; visibility: visible; 
}
.schedule-backdrop, .accomoddation-backdrop, .obrad-backdrop, .hostina-backdrop {
  position: absolute; inset: 0; background: rgba(34, 25, 16, .70);
  backdrop-filter: blur(4px);
}
.schedule-sheet, .accomoddation-sheet, .obrad-sheet, .hostina-sheet {
  //position: relative; z-index: 1; width: min(760px, 100%); max-height: min(1200px, 1200px);
  //overflow: auto; padding: clamp(30px, 5vw, 58px) clamp(22px, 6vw, 72px);
  color: #4c321f; text-align: center; //border: 1px solid #b58b50;
  //outline: 1px solid rgba(181,139,80,.55); outline-offset: -9px;
  /*background:
    linear-gradient(rgba(250,239,215,.91), rgba(250,239,215,.94)),
    url("assets/listina-textura.jpg") center / cover;*/
  background-image: url('assets/pergamen.png');
  background-repeat: no-repeat;
	background-size: 840px;	
  }    
.schedule-modal.is-open .schedule-sheet, .accomoddation-modal.is-open .accomoddation-sheet, .hostina-modal.is-open .hostina-sheet, .obrad-modal.is-open .obrad-sheet { transform: translateY(0) scale(1); }
.schedule-close,.accomoddation-close,.obrad-close,.hostina-close {
  position: sticky; float: right; top: 0; margin: -16px 80px 0 0; z-index: 2;
  width: 40px; height: 40px; border-radius: 50%; border: 1px solid #9c713d;
  background: #f6e8c9; color: #603d1f; font: 32px/1 Georgia, serif; cursor: pointer;
}

 sheet-corner { position: absolute; color: #a77b42; font-size: 25px; opacity: .9; }
.sheet-heading { clear: both; padding-top: 80px; 

}
.sheet-heading h2 {
  font-family: "Great Vibes", cursive; font-size: clamp(42px, 7vw, 65px);
  font-weight: 400; margin: 3px 0 0; color: #75491f;
}
.sheet-ornament { color: #a77b42; letter-spacing: .18em; margin: 8px 0; }
.sheet-date { font-size: 18px; letter-spacing: .12em; margin: 0 0 22px; }
.sheet-body { position: relative; max-width: 580px; margin: 0 auto; 

.sheet-timeline { list-style: none; margin: 0; padding: 0; text-align: left; }
.sheet-timeline li {
  display: grid; grid-template-columns: 74px 42px 1fr; align-items: center; gap: 12px;
  min-height: 62px; position: relative; border-bottom: 1px solid rgba(157,116,61,.22);
}
.sheet-timeline li time { color: #93652f; font-size: 18px; font-weight: 600; text-align: right; }
.timeline-seal {
  display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid #b58b50;
  border-radius: 50%; color: #986c36; background: rgba(255,249,235,.65); font-size: 18px;
}
.sheet-timeline li div { display: grid; gap: 1px; }
.sheet-timeline strong { font-size: 18px; font-weight: 600; }
.sheet-timeline small { font-size: 14px; color: #795a42; }
.sheet-flourish { position: absolute; right: -28px; bottom: 0; color: #b18a54; font-size: 82px; opacity: .18; pointer-events: none; }
.sheet-footer { margin-top: 24px; padding-top: 13px; border-top: 1px solid rgba(157,116,61,.45); }
.sheet-footer p { font-family: "Great Vibes", cursive; color: #865b2e; font-size: 29px; margin: 0 0 12px; }