@charset "UTF-8";
/* CSS Document */


#videobg {z-index:1;}
@media (min-aspect-ratio: 6/9) {
#videobg {width:100%;height:auto}		
}
@media (max-aspect-ratio: 6/9) {
#videobg {width:auto;height:100%}		
}


.video-background-holder {position: relative;background-image: url("../images/perla-top-video.jpg");background-size:cover;height: calc(50vh - 72px);min-height: 25rem;overflow: hidden;}
.video-background-holder video {position: absolute;top: 50%;left: 50%;min-width: 100%;min-height: 100%;width: auto;height: auto; z-index: 0;-ms-transform: translateX(-50%) translateY(-50%);-moz-transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%);transform: translateX(-50%) translateY(-50%);}
.video-background-content {position: relative;z-index: 2;}
.video-background-overlay {position: absolute;top: 0;left: 0;height: 100%;width: 100%;background-color: black;opacity: 0.5;z-index: 1;}


.ec-circle2{color:#ffffff; font-family: yrsa, serif;font-weight: 400; width:24px; height:24px;border-radius:100%;font-size:16px;line-height: 1.3em;text-align: center;  background: #002f3d;margin:0}
.ec-circle{color:#ffffff; font-family: yrsa, serif;font-weight: 400; width:24px; height:24px;border-radius:100%;font-size:16px;line-height: 1.3em;text-align: center;  background: #002f3d;margin:.25em 0 .25em 0}
.ec-table-top{height:170px}
.ec-table-bottom {height:30px}
.ec-boat-bg {background-image:url("../images/boat-plan.png"); background-size:contain; background-repeat:no-repeat; background-position:center; padding:8%; margin:8%; height:600px; }
.ec-boat-top-bg {background-image:url("../images/seating-map-top.png"); background-size:contain; background-repeat:no-repeat; background-position:center; padding:8%; margin:8%; height:600px}
.perla-container {width: 100%}	
.perla-button-margin-contact{margin-top:200px}	
.perla-box-map {background-color:#F4F6F6; border:#fffff 5px solid;font-size:13px; padding:2em; margin-bottom:1em; -moz-border-radius: 15px;-webkit-border-radius: 15px;border-radius:15px; line-height:1.40em; text-align:center;}
.perla-box-mapw {background-color:#ffffff; border:#fffff 5px solid;font-size:13px; padding:2em; margin-bottom:1em; -moz-border-radius: 15px;-webkit-border-radius: 15px;border-radius:15px; line-height:1.40em; text-align:center;}
.perla-margin {margin-top:175px}

.boat-bg {background-image:url("../images/jhefos-boat-top.jpg");background-position:bottom center;background-size:100%; background-repeat:no-repeat;}
.perla-header-box {color:#002f3d; background-color:rgba(203, 250, 237, .5); padding:15px 0}
.perla-box-border {border-color:rgba(0,47,61,0.2);border-style: double; margin:2%; padding:2%; ; -moz-border-radius: 10px;-webkit-border-radius: 10px; border-radius:10px; }

.perla-img-corner {-moz-border-radius: 25px;-webkit-border-radius: 25px; border-radius:25px; width:100%;}	
.perla-img-corner2 {-moz-border-radius: 20px;-webkit-border-radius: 20px;border-radius:20px;}	

.perla-green-box-home {color:#cbfaed; background-color:rgb(0, 47, 61, .8);padding:5px; border-radius:20px;}
.perla-header-box-home {color:#cbfaed; background-color:rgb(0, 47, 61, .8);margin:80px 10px 10px 10px; padding:5px; width:275px;border-radius:20px;}
.header-gradient{font-family:Playfair Display, Georgia, serif;font-weight: 400; font-style:italic;font-size: 7.5vw; line-height:1.35em; letter-spacing:.01em;margin:8px 0 18px 0; text-align:center;padding:1%;
background: #AD8CA7;
background: radial-gradient(circle farthest-side at top left, #AD8CA7 17%, #8EA3BF 43%, #8597A1 59%, #546F73 80%, #131829 95%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;}

.background-boat{background-image:url("../images/perla-boat-homepg.jpg");background-position:bottom center; background-size:cover; background-repeat:no-repeat;height:500px;}
.flex-container-txtmisol {display: flex;flex-direction: column; flex-wrap: wrap;align-items:center; width: 100%; padding:.25em .25em 1em .25em; justify-content: center; }
.perla-header-lt {font-family:Playfair Display, Georgia, serif;font-weight: 400; font-style:italic;font-size:36px; line-height:1em; letter-spacing:.01em; color:#cbfaed;text-align:center;margin-bottom:.5em}
.perla-header-lt-sm {font-family:Playfair Display, Georgia, serif;font-weight: 400; font-style:italic;font-size:22px; line-height:1.25em; letter-spacing:.01em; color:#cbfaed;text-align:center; padding-bottom:1% }


.ec-yrsa {font-family:Playfair Display, Georgia, serif;font-weight: 400; font-style: normal;}	
.ec-yrsa-bld {font-family:Playfair Display, Georgia, serif;font-weight: 700;font-style: normal;font-size:22px}
.ec-header {font-family:Playfair Display, Georgia, serif;font-weight: 400; font-style: normal; font-size:32px; line-height:1.25em}
.perla-yrsa-bld {font-family:Playfair Display, Georgia, serif;font-weight:700;font-size:20px; letter-spacing:.02em; text-transform:uppercase; color:#002f3d; line-height:1em}
.perla-header {font-family:Playfair Display, Georgia, serif;font-weight: 400; font-style: normal; font-size: 9vw; line-height:1em; letter-spacing:.01em}
.perla-header4 {font-family: Playfair Display, Georgia,serif; font-weight: 400; font-style: normal; font-size:30px; line-height:1.5em; letter-spacing:.01em}
.perla-header2 {font-family:Playfair Display, Georgia, serif;font-weight: 700; font-size:18px;letter-spacing:.05em; color:#002f3d; line-height:1.5em; padding:2%;text-align:center; text-transform:uppercase;}
.gold-header2 {font-family:Playfair Display, Georgia, serif;font-weight: 700; font-size:18px;letter-spacing:.05em; color:#cda349; line-height:1.5em; padding-bottom:2%;text-align:center; text-transform:uppercase;}
.perla-header1 {font-family:Playfair Display, Georgia, serif;font-weight: 700; font-size:16px;letter-spacing:.02em; color:#002f3d; line-height:1.5em; padding:2%; text-transform:uppercase;}
.perla-header3 {font-family:Playfair Display, Georgia, serif;font-weight: 400; font-size:17px;letter-spacing:.05em; color:#002f3d; line-height:1.75em;text-align:center; }
.perla-header5 {font-family:Playfair Display, Georgia, serif;font-weight: 400; font-size:20px;letter-spacing:.05em; color:#002f3d; line-height:1.5em;text-align:center;margin-top:2% }	
.perla-nav {position: fixed; top:0px; width:100%; margin:0; z-index:100;background-color:#002f3d;text-align:right}	
.perla-header6 {font-family:Playfair Display, Georgia, serif;font-weight: 400; font-size:25px;letter-spacing:.01em; color:#002f3d; line-height:1.5em;text-align:center;margin:1%; font-style:italic }
.perla-header-drk {font-family:Playfair Display, Georgia, serif;font-weight: 400; font-style:italic;font-size: 7vw; line-height:1.25em; letter-spacing:.01em; color:#002f3d;padding:1%; text-align:center  }
.perla-header-gold {font-family:Playfair Display, Georgia, serif;font-weight: 400; font-style:italic;font-size: 7vw; line-height:1.25em; letter-spacing:.01em; color:#cda349;padding:1%; text-align:center  }

.circ-icon-perla1 {width: 75px;margin:0 auto 5px auto;}
.circ-icon-perla2 {width: 100px;margin:0 auto 5px auto;}	
.circ-icon-perla {width: 55px;height: 55px; margin:2% auto 3% auto;}
.pearla-icon-box-lt {background-color:#ffffff; border:#fafafa 5px solid;font-size:13px; padding:1em; margin:1em 0; -moz-border-radius: 10px;-webkit-border-radius: 10px;border-radius:10px;line-height:1.40em; text-align:center; }
.pearla-icon-box {background-color:#ffffff; border:#F4F6F6 5px solid;font-size:13px; padding:1em; margin:1em 0; -moz-border-radius: 10px;-webkit-border-radius: 10px;border-radius:10px;line-height:1.40em; text-align:center; }
.pearla-icon-box2{background-color:#ffffff; border:#fafafa 5px solid;font-size:13px; padding:1em; margin:1em 0; -moz-border-radius: 10px;-webkit-border-radius: 10px;border-radius:10px;line-height:1.40em; }	
.pearla-icon-box1{background-color:#ffffff; border:#F4F6F6 5px solid;font-size:13px; padding:1em; margin:1em 0; -moz-border-radius: 10px;-webkit-border-radius: 10px;border-radius:10px;line-height:1.40em; height:155px; text-align:center}		
.img-curved-boarder{-moz-border-radius: 20px;-webkit-border-radius: 20px; border-radius:20px;width:100%; }
	


.misol-button-lt {color:#ffffff; width:150px; transition-duration: 0.4s;border-radius: 25px 5px;padding: 12px 28px;text-align: center;text-decoration: none;display: inline-block;background-color: #cda349; margin:1%; font-size:14px}
.misol-button-lt:hover {background: #002f3d; text-underline-position: below; border-radius: 5px 25px; line-height:1.5em; color:#ffffff; font-size:14px}
.perla-button-dk {color:#ffffff; width:150px; transition-duration: 0.4s;border-radius: 5px 25px;padding: 12px 28px;text-align: center;text-decoration: none;display: inline-block;background-color: #002f3d; margin:1%; font-size:14px}
.perla-button-dk:hover {background: #cbfaed; text-underline-position: below; border-radius: 25px 5px; line-height:1.5em; color:#002f3d; font-size:14px}
.perla-button-lt {color:#002f3d; width:150px; transition-duration: 0.4s;border-radius: 25px 5px;padding: 12px 28px;text-align: center;text-decoration: none;display: inline-block;background-color: #cbfaed; margin:1%; font-size:14px}
.perla-button-lt:hover {background: #002f3d; text-underline-position: below; border-radius: 5px 25px; line-height:1.5em; color:#ffffff; font-size:14px}
.perla-nav-items {color:#ffffff; width:150px; transition-duration: 0.4s;border-radius: 5px 25px;padding: 12px 28px;text-align: center;text-decoration: none;display: inline-block;background-color: #002f3d; margin-top:35%; font-size:14px}
.perla-nav-items:hover {background: #cbfaed; text-underline-position: below; border-radius: 25px 5px; line-height:1.5em; color:#002f3d; font-size:14px}


.perla-nav-items-a {color:#002f3d; width:150px; transition-duration: 0.4s;border-radius: 5px 25px;padding: 12px 28px;text-align: center;text-decoration: none;display: inline-block;background-color: #cbfaed; margin-top:35%}
.perla-nav-items-a:hover {background: #cbfaed; text-underline-position: below; border-radius: 25px 5px; line-height:1.5em; color:#002f3d}

.perla-footer {background-color:#002f3d;text-align:center; color:#ffffff; padding:3% 5% 5% 5%}
.perla-footer-h1{font-family:Playfair Display, Georgia, serif;font-weight: 400; font-style:italic;font-size: 33px; line-height:1.15em; letter-spacing:.01em; color:rgb(255,255,255,.6); padding:3% 1% 1% 1%;}
.perla-footer-h2{font-family:Playfair Display, Georgia, serif;font-weight: 400; font-style:italic;font-size: 24px; line-height:1.25em; letter-spacing:.01em; color:rgb(255,255,255,.6); padding:1% 2%; text-align:center}
.perla-footer-info{text-align:center;padding:1% 2%; line-height:1.5em; color:rgb(255,255,255,.6)}
.perla-footer-info a {text-decoration:none!important;color:rgb(255,255,255,.6)}

.perla-height-box-tall {height:230px}	
.perla-height-box {height:200px}

@media (min-width: 412px) {
.ec-table-top{height:190px}
.ec-circle2{margin:.1em .2em .1em .2em}
.ec-circle{margin:.5em .15em .5em .15em}
	.header-gradient{font-size: 40px;margin:0 0 5px 0}
}
@media (min-width: 416px) {
.ec-table-top{height:190px}
.perla-height-box {height:200px}
.perla-height-box-tall {height:200px}
	}

@media (min-width: 576px) {	
}


@media (min-width: 768px) {
.perla-height-box {height:225px}
.perla-height-box-tall {height:225px}
.perla-header {font-size: 50px;}
.perla-header-drk {font-size: 30px;}
.perla-header-gold {font-size: 30px;}
	.perla-footer-h1{padding-top:1%;}
}


@media (min-width: 992px) {
.perla-height-box {height:210px}
.perla-height-box-tall {height:210px}
.perla-footer-h2{font-size: 24px; border-right: solid 1px rgb(255,255,255,.6); text-align:right}
.perla-footer-info{text-align:left;padding:1% 2%; line-height:1.5em}
.perla-footer-h1{padding-top:0;}
}


@media (min-width: 1200px) {
.pearla-icon-box-lt{font-size:14px}
.pearla-icon-box{font-size:14px}
.pearla-icon-box2{font-size:14px}
.pearla-icon-box1{font-size:14px}
.perla-container {max-width:1100px}	
.perla-button-margin{margin-top:330px}
.background-boat{background-image:url("../images/perla-top-flex.jpg");background-position:bottom center; background-size:cover; background-repeat:no-repeat;height:500px;}
	
	.video-background-holder {height: calc(60vh - 72px)}
	
}


@media (min-width: 1800px) {
.background-boat{background-image:url("../images/laperla-top-flex-xl.jpg");background-position:bottom center; background-size:cover; background-repeat:no-repeat;height:500px;}
	.video-background-holder {height: calc(70vh - 72px)}
}