/*
Theme Name: Seaside Pools
Author: Sharp Hue
*/

/*Inner Template Theme Colors*/
#blog .blog-meta-info a:hover,
#blog h1 a,
#content h1,
#blog h1,
#blognav h3,
#blognav ul li a:hover { color:#555; }
#faqs .faq .icon,
#events .date,
#contact .frm_forms .frm_submit input,
#blog nav .nav-previous a,
#blog nav .nav-next a,
#information .icon { background-color:#555; }
#testimonials .testimonial { border-color:#555; }
#gallerynav a:hover,
#gallerynav a.active { border-bottom-color:#555; }
#gallerynav a.active span { border-top-color: #555; }
#gallery .video { position: relative; display: block; padding-bottom: 30px; box-shadow: 5px 5px 5px #888888; margin-bottom: 20px; }
#gallery .video:hover { box-shadow: 8px 8px 8px #888888; transition: .8; }
#gallery .video img { width: 100%; }
#gallery .video i { position: absolute; left: 50%; top: 50%; margin: -30px 0 0 -30px; width: 60px; height: 60px; line-height: 60px; font-size: 30px; color: #fff; background: rgba(255,255,255,.5); border-radius: 30px; text-align: center;}
#gallery .video span { display: block; position: absolute; left: 0; bottom: 0; right: 0; padding: 15px 5px; color: #fff; font-size: 14px; font-weight: 700; line-height: 16px; text-align: center; text-decoration: none; background: #2f2f2f; }

/*Theme Styles*/
.container { max-width: 1170px; margin: 0 auto; padding: 0 15px; }
/*Fonts*/
h1,h2,h3,h4,h5,h6, ul, ol, li, p, div { font-family: 'Source Sans Pro', sans-serif; }
a { color: #2b3e97; }
#content .white-text p {color: #fff;}

/*Header*/
#header { min-height: 140px; background: rgba(43, 62, 151, .7); z-index: 10; }
#header .wrapper { padding: 15px 0; }
#header.compact { background: rgba(43, 62, 151, .7); }
#header.transition,
#header.transition div { -webkit-transition: all 100ms; transition: all 100ms; }
#header.absolute { position: absolute; top: 0; width: 100%; }
#header.fixed { position: fixed; top: 0; width: 100%; }
#header .container { max-width: 1200px; position: relative; padding: 0 15px; }
#header .logo { line-height: 120px; }
#header.compact .logo img { width: 120px; }
#header .header-btn-mobile { display: none; }
#header .header-btn { position: absolute; top: 20px; right: 15px; }
#header.compact .header-btn { top: 5px; }
#header .header-btn p { display: inline-block; color: #ffff; font-size: 19px; font-family: 'Open Sans', sans-serif; font-style: italic; font-weight: 300; margin-right: 12px; vertical-align: middle; }
#header .header-btn a { display: inline-block; color: #ffffff; font-size: 15px; background-color: #19bdef; text-decoration: none; text-transform: uppercase; padding: 7px 30px; border-radius: 4px; }
#header .header-btn a:hover { }
#header .header-btn a:nth-of-type(1) { margin-right: 10px; }


#header .header-numbers-mobile { display: none; }
#header .header-numbers { position: absolute; top: 65px; right: 15px; }
#header.compact .header-numbers { top: 5px; }
#header .header-numbers p { display: inline-block; color: #ffff; font-size: 19px; font-family: 'Open Sans', sans-serif; font-style: italic; font-weight: 300; margin-right: 12px; vertical-align: middle; }
#header .header-numbers a { display: inline-block; color: #ffffff; font-size: 15px; text-transform: uppercase; border-radius: 4px; }
#header .header-numbers a:hover { }
#header .header-numbers a:nth-of-type(1) { margin-right: 10px; }

#header.slide { animation-name: slide; animation-duration: 300ms; }
@-webkit-keyframes slide { from {top: -200px;} to {top: 0px;} }
@keyframes slide { from {top: -200px;} to {top: 0px;} }

#header.fade { animation-name: fade; animation-duration: 300ms; }
@-webkit-keyframes fade { from {opacity: 0;} to {opacity: 1;} }
@keyframes fade { from {opacity: 0;} to {opacity: 1;} }

@media screen and (min-width: 1151px) {	
	#header.compact { min-height: 80px; }
	#header.compact .logo { line-height: 80px; }
	#header.compact #nav { top: 20px; }
	
}

@media(max-width: 850px) {
	html.menu-on,
	html.menu-on body { overflow:hidden; }
	html.menu-on #header { overflow-y: scroll; height: 100%; }
	#header { min-height: auto; }
	#header .wrapper { padding: 0;}
	#header .container { padding: 0; }
	#header .logo { line-height: 0; padding: 10px; }
	#header .logo img { width: auto !important; height: 40px !important; }
	
	#header .header-btn { position: absolute; top: 15px !important; right: 80px; }
	#header .header-btn p { display: none; }
	#header .header-btn a { display: inline-block; color: #ffffff; font-size: 15px; background-color: #19bdef; text-decoration: none; text-transform: uppercase; padding: 5px 10px; border-radius: 4px; }
	#header .header-btn a:nth-of-type(1) { margin-right: 10px; }
}

@media(max-width: 500px) {
	#header .header-btn { display: none; }
	#header .header-btn-mobile { display: block; }
	#header .header-btn-mobile .mobile-btns { display: block; color: #ffffff; text-transform: uppercase; text-decoration: none; padding: 8px 20px; }
	#header .header-btn-mobile .mobile-btns:hover { background-color: #2b3e97; }
}

/*Nav*/
#nav { position:absolute; top:95px; right: 10px;}
#nav nav > ul { display:table; width:100%; list-style:none; }
#nav ul > li { float:left; padding-left: 40px; }
#nav ul li > a { display:block; height:40px; padding:0 10px; line-height:40px; font-size:16px; color:#fff; text-transform:uppercase; text-decoration:none; }
#nav ul li:hover > a,
#nav ul li.current-menu-item > a,
#nav ul li.current-menu-parent > a,
#nav ul li.current_page_parent > a  {  }
#nav ul li.menu-item-has-children > a {  }
#nav nav ul li a .fas .fa-angle-down { font-size: 15px; margin:0 0px 0 0; display: none; }
#nav .menu { display: none; cursor:pointer; }

/*Sub Nav*/
#nav ul li .sub { position:relative; }
#nav ul li .sub .sub-menu li {padding-left:0px;}
#nav li#menu-item-4624 {padding-left:7px;margin-left:0;}
#nav li#menu-item-4624:hover {background:#2b3e97;}
#nav ul ul { display:none; position:absolute; left:0px; top:0px; min-width:200px; height:auto; background:#19bdef; }
#nav ul li:last-child ul { left:auto; right:0; }
#nav ul li:hover ul { display:block; }
#nav ul li ul li { float:none; margin:0; padding:0; }
#nav ul li ul li a { display:block; height:auto; padding:0 15px; line-height:35px; font-size:13px; color:#fff; text-transform:uppercase; text-decoration:none; white-space:nowrap; }
#nav ul li ul li:hover a { background:#2b3e97; }
#nav ul li ul li ul { display:none; }
#nav nav > ul > li .fa-angle-down { display: none; }
#nav nav > ul > li.menu-item-has-children i { display: inline-block;}
#nav nav .sub-menu .fa-angle-down { display: none; }

/*Nav Btns*/
#nav .btn { padding:0; margin:0; }
#nav .btn a { padding: 15px 18px; margin-left: 5px; line-height:16px; height:auto; color: #fff; text-decoration: none; text-transform: uppercase; white-space:nowrap; }
#nav .btn a .fa { margin-right: 5px; }
#nav .btn.primary a { margin-left:50px; }
#nav .btn.primary a { background-color: #a9a9a9; }
#nav .btn.primary a:hover { transition: : .8s; }
#nav .btn.primary a:before { content:"\f086 "; font-family:FontAwesome; display:inline-block; margin-right:5px; } 
#nav .btn.secondary a { background-color: #c0c0c0; }
#nav .btn.secondary a:hover { transition: .8s; }
#nav .btn.secondary a:before { content:"\f041 "; font-family:FontAwesome; display:inline-block; margin-right:5px; }

@media screen and (min-width: 851px) {
	#header.compact { min-height: 80px; }
	#header.compact .logo { line-height: 80px; }
	#header.compact #nav { top: 55px; }
	#header.compact #nav .btn { top: -25px; right: 0; }
	#header.compact #nav .btn a { padding: 5px 15px; font-size: 12px; }
	#header.compact #nav .btn.secondary { right: 160px; }
}

@media screen and (min-width: 1151px) {
	#header.compact #nav { top: 55px; }
	#header.compact #nav .btn a { padding: 10px 15px; }
}

@media(max-width: 1150px) {
	#nav { right: 15px; top: 95px; }
	#nav .btn { float:none; position:absolute; right:0; top:-50px; }
	#nav .btn.secondary { right:200px; }
	#nav ul > li { padding-left: 20px; }
}
@media(max-width: 950px) {
	#nav ul > li { padding-left: 0; }
  #nav ul li > a {font-size: 15px;}
	#header .header-btn p { font-size: 14px; }
}
@media(max-width: 850px) {
	#nav { width: 100%; right: auto; position: relative; top: 0; }
	#nav .nav-wrapper { background-color: #19bdef; padding: 0 !important; }
	#nav .menu { display: block; position: absolute; text-align: center; font-size: 30px; line-height: 60px; right:0; top:-60px; width:60px; height:60px; }
	#nav .menu.done { display: block; }
	#nav .menu a { color: #fff; }
	#nav nav { display: none; }
	#nav.on nav { display: block; }
	#nav.on nav ul li .sub ul { display:none; }
	#nav.on nav ul li:hover .sub ul { display:block; }
	#nav.on nav ul li.on .sub ul { display:block; }
	#nav nav > ul { display: block; }
	#nav nav > ul > li:first-child { float: none; margin: 0; }
	#nav nav ul li { float: none; }
	#nav ul > li { margin: 0; }
	#nav ul li > a { color: #fff; }
	#nav nav ul { display:none; width:100%; height:auto; max-height:none; background:#19bdef; }
	#nav.on nav ul { display:block; }
	#nav.on nav ul li .sub ul { display:none; position: relative; left:auto; top:auto; right:auto; }
	#nav.on nav ul li.on .sub ul { display:block; left: 0; }
	#nav ul li ul li a { padding-left: 40px; }
	#nav ul li.menu-item-has-children > a { padding: 8px 20px; }
	#nav nav ul li a { padding: 8px 20px; }	
	#nav .btn,
	#nav .btn.primary,
	#nav .btn.secondary { float:none; position:relative; right:auto; top:auto; }
	#nav .btn.primary a,
	#nav .btn.secondary a { margin:0; }
}

/*Promo*/
#promo { position:relative; }
#promo .prev { z-index:2; position: absolute; top:50%; left: 25px; margin-top: -13px; font-size: 26px; color: #2b3e97; cursor:pointer; }
#promo .next { z-index:2; position: absolute; top:50%; right: 25px; margin-top: -13px; font-size: 26px; color: #2b3e97; cursor:pointer; }
#promo .wrapper { }
#promo .container { padding: 350px 40px; max-width: 1170px; }
#promo h2 { margin:0 0 20px 0; padding:0; font-size:48px; line-height:42px; font-weight:bold; color:#fff; text-align:center; font-family: 'Happy Monkey', cursive; text-shadow: 0px 3px 6px rgba(0, 0, 0, 0.5); }
#promo p { margin:0; padding:0; font-size:18px; line-height:24px; color:#fff; text-align:center; }
@media(max-width: 767px) {
	#promo h2 { font-size: 35px; }
	#promo .container { padding: 300px 40px; }
}
@media(max-width: 500px) {
	#promo h2 { font-size: 28px; }
}

/*Content*/
.wrapper.content { width: 100%; overflow: hidden; }

/* Seasonal Notification */
#season-notification { position: absolute; left: 0; bottom: 0; right: 0; z-index: 3; }
#season-notification .wrapper { background-color: #ceecfb; position: relative; padding: 10px 0; }
#season-notification .waves { width: 100%; }
#season-notification .container { padding: 0 15px; }
#season-notification .season-content .fas.fa-sun,
#season-notification .season-content .far.fa-snowflake { font-size: 100px; color: #2b3e97; position: absolute; top: 10px; left: 15px; }
#season-notification .season-content { margin-left: 160px; padding-left: 50px; padding-bottom: 40px; border-left: 1px solid #2b3e97;}
#season-notification .season-content h3 { padding: 20px 0 0 0; font-size: 24px; color: #2b3e97; font-family: 'Montserrat', sans-serif; margin-bottom: 15px; font-weight: 600; }
#season-notification .season-content ul { list-style: none; }
#season-notification .season-content ul li .fa-check { padding-right: 5px; font-size: 14px; }
#season-notification .season-content ul li { display: inline-block; font-size: 18px; color: #2b3e97; font-family: 'Montserrat', sans-serif; font-weight: 300; }
#season-notification .season-content ul li:nth-of-type(1) { margin-right: 20px; }
#season-notification .season-content .season-content-btn { position: absolute; top: 45px; right: 15px; font-size: 15px; text-transform: uppercase; text-decoration: none; border: 2px solid #2b3e97; border-radius: 4px; padding: 7px 20px; color: #2b3e97; font-family: 'Montserrat', sans-serif; font-weight: 600; }
#season-notification .season-content .season-content-btn:hover {background-color: #2b3e97; color: #ffffff; }

@media(max-width:1065px) {
	#season-notification .season-content h3 { margin-bottom: 5px; padding: 5px 0 0 0;  }
	#season-notification .season-content .season-content-btn { position: relative; top: 15px; left: 0; }
}

@media(max-width: 850px) {
	#season-notification .season-content h3 { font-size: 18px; }
	#season-notification .season-content ul li { font-size: 14px; }
}

@media(max-width: 767px) {
	#season-notification .season-content ul li { display: block; }
}

@media(max-width: 600px) {
	#season-notification .season-content .fas.fa-sun,
	#season-notification .season-content .far.fa-snowflake { position: relative; display: block; margin: 0 auto; text-align: center; font-size: 60px; margin-bottom: 10px; }
	#season-notification .season-content { padding: 0 15px; padding-bottom: 30px; border: none; margin-left: 0; left: 0;  }
}
/*Footer*/
#footer .wrapper { background-color: #2b3e97; }
#footer .container { max-width: 1200px; padding: 90px 15px 80px 15px; }
#footer .footer-nav { background-color: #2b3e97; }
#footer .footer-nav:after { position: absolute; top: 0; bottom: 0; right: 100%; width: 100vw; background: #2b3e97; content: ''; }
#footer .footer-nav h5 { font-size: 16px; color: #fff; font-family: 'Open Sans', sans-serif; font-weight: bold; text-transform: uppercase; margin-bottom: 15px; }
#footer .footer-nav h5 a { color: #fff; text-decoration: none; }
#footer .footer-nav ul { list-style-type: none; }
#footer .footer-nav ul li { line-height: 13px; margin-bottom: 12px; }
#footer .footer-nav ul li a { text-decoration: none; color: #fff; font-size: 13px; font-family: 'Open Sans', sans-serif;  }
.yo { font-size: 16px; color: #fff; font-family: 'Open Sans', sans-serif; font-weight: bold; text-transform: uppercase; margin-bottom: 15px; }
#footer .footer-nav .footer1 {  }
#footer .footer-nav .footer2 {  }
#footer .footer-nav .footer2 ul {  }
#footer .footer3 {  }
#footer .footer-nav .footer3 ul { }
#footer .copyright { margin-top: 55px; }
#footer .copyright p { color: #fff; font-size: 12px; }
#footer .copyright a { color: #fff; text-decoration: underline; font-size: 12px; }
#footer .contact-info { background-color: #2b3e97; padding-left: 15px; }
#footer .contact-info .contact { position: relative; padding-left: 39px; margin-bottom: 30px; color: #fff; }
#footer .contact-info .contact .contact-body { font-size: 15px; }
#footer .contact-info .contact .contact-icon { position: absolute; top: -5px; left: 0; font-size: 21px; color: #fff; }
#footer .contact-info .footer-btn { padding: 7px 22px; margin-right: 26px; text-transform: uppercase; color:#ffffff; background-color: #19bdef; font-size: 15px; font-weight: 400; font-family: 'Open Sans', sans-serif; display: inline-block; text-decoration: none; border-radius: 4px; }
#footer .contact-info .footer-btn:hover { color: #fff; transition: .4s;}
#footer .contact-info .footer-contact-btn {  padding: 7px 22px; text-transform: uppercase; color:#ffffff; font-size: 15px; font-weight: 400; font-family: 'Open Sans', sans-serif; background-color: #19bdef; display: inline-block; text-decoration: none; border-radius: 4px; }
#footer .contact-info .footer-contact-btn:hover { color: #fff; transition: .4s; }
#footer .contact-info .icons { margin-top: 35px;} 
#footer .contact-info .icons ul { list-style: none; }
#footer .contact-info .icons ul li { display: inline-block; vertical-align: middle; }
#footer .contact-info .icons .fa-facebook-f { font-size: 60px; color: #ffffff; margin-left: 38px; }

@media( max-width: 970px ) {
	#footer .container { padding: 60px 30px;}
	#footer .contact-info .footer-btn { margin-bottom: 10px;}
}

@media( max-width: 800px ) {
	#footer .col-60 .col-333 { 
		width: 50%;
	}
}

@media (max-width: 700px) {
	#footer .col-60, #footer .col-40 { 
		width: 100%;
	}
	#footer .footer-nav {
		margin-bottom: 30px; 
	}
}

@media( max-width: 600px ) {
	#footer .col-333 { width: 50%;}
	#footer .contact-info { padding: 0;}
}

/*Pop Up*/
#subscribe-popup { position: relative; width:900px; max-width:100%; }
#subscribe-popup .opacity { height: 409px; 	
  background: -webkit-linear-gradient(top, rgba(0,0,0,0.5) 0%,rgba(0,0,0,0.47) 7%,rgba(0,0,0,0.27) 47%,rgba(0,0,0,0) 100%);
	   background: -moz-linear-gradient(top, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.47) 7%, rgba(0,0,0,0.27) 47%, rgba(0,0,0,0) 100%);
          background: linear-gradient(to bottom, rgba(0,0,0,0.5) 0%,rgba(0,0,0,0.47) 7%,rgba(0,0,0,0.27) 47%,rgba(0,0,0,0) 100%);
              filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#80000000', endColorstr='#00000000',GradientType=0 ); }
#subscribe-popup .bg { height: 458px; background: url(images/modal2.jpg) no-repeat center center; background-size:cover; }
#subscribe-popup .text-holder { text-align: center; max-width: 620px; margin: 0 auto; }
#subscribe-popup h2 { font-size: 39px !important; font-weight:bold; color: #ffffff; padding-top: 130px !important; padding-bottom: 10px !important; line-height: 45px !important; margin: 0 !important; font-family: 'Montserrat', sans-serif; text-transform:none; }
#subscribe-popup p { font-size: 22px; color: #ffffff; line-height: 30px !important; font-family: Open Sans; padding: 0 20px !important; text-transform:none;}

#subscribe-popup form { padding:20px 18px; max-width: 870px; margin: 0 auto; background-color: #2b3e97; }
#subscribe-popup input[type="text"] { width: 100%; line-height: 51px; height:51px; padding: 7px 15px; margin-bottom:5px; border: 1px solid #e1e1e1; }
#subscribe-popup input[type="email"] { width: 100%; line-height: 51px; height:51px; padding: 7px 15px; margin-bottom:5px; border: 1px solid #e1e1e1; }
#subscribe-popup input[type=submit] { font-size: 21px; line-height: 38px; height:51px; padding:7px 0; margin-bottom:5px; display: block; width: 100%; background-color: #19bdef; color: #ffffff; border-radius: 4px; border: none; font-weight: 600; font-family: 'Open Sans', sans-serif; }
#subscribe-popup input[type=submit]:hover { opacity: .8;}
@media all and (max-width: 770px) {
	#subscribe-popup .opacity { height:300px; }
	#subscribe-popup .bg { height:330px; }
}

/*Make a Payment*/
#make-a-payment { margin:30px 0 75px; }
#make-a-payment .row { clear:both; margin-bottom:45px; }
#make-a-payment .row:before, #make-a-payment .row:after { content:" "; display:table; clear:both;}
#make-a-payment label, #make-a-payment .fauxlabel { font-weight:bold; font-size:13px; margin-bottom:10px; display:block; }
#make-a-payment input, #make-a-payment select { width:100%; line-height:20px; height:30px; padding:4px 4px 4px 4px; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; color:#666; border:1px solid #ccc; 
    -webkit-box-sizing: border-box; 
       -moz-box-sizing: border-box; 
            box-sizing: border-box;                                             
}
#make-a-payment select { width:100%; height:28px; }
#make-a-payment .error { display:none; color:#ff0000; font-weight:bold; margin:0 5px; }
#make-a-payment .little { color:#333; font-weight:normal; }
#make-a-payment .text{ font-size:11px; float:left; width:285px; color:#666; margin-top:28px; }
#make-a-payment .text div{ float:left; }
#make-a-payment .text .text-left{ width:135px; margin-right:10px;}
#make-a-payment .text .text-right{ width:125px; }
#make-a-payment label, #make-a-payment .fauxlabel{ font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif; }
#make-a-payment .col-250 { width:250px; margin-right:30px; float:left; }
#make-a-payment .col-320 { width:320px; margin-right:30px; float:left; }
#make-a-payment .col-160 { width:160px; margin-right:30px; float:left; }
#make-a-payment .col-90 { width:90px; margin-right:30px; float:left; }
#make-a-payment .col-50 { width:50px; margin-right:25px; float:left; }
#make-a-payment .first-third { width:300px; margin-right:20px; margin-bottom:14px; float:left; }
#make-a-payment .mid-third { width:300px; margin-right:20px; margin-bottom:14px; float:left; }
#make-a-payment .last-third { width:300px; margin-right:0; margin-bottom:14px; float:left; }
#make-a-payment .month, #make-a-payment .year{ float:left; width:38px; text-align:center; padding-left:0; padding-right:0; }
#make-a-payment .month { margin-right:10px; }
#make-a-payment .send { width:152px; }
#make-a-payment .send input { padding:0px 15px; color:#fff; font-size:13px; line-height:35px; height:35px; text-transform:uppercase; text-decoration:none; font-weight:normal; border-radius:4px; -moz-border-radius:4px; cursor:pointer;
    background:#507CC5;
	background-image: -webkit-gradient(linear, left top, left bottom, from( #7fa5e8 ), to( #507cc5 ));
	background-image: -webkit-linear-gradient( #7fa5e8 , #507cc5 );
	background-image:    -moz-linear-gradient( #7fa5e8 , #507cc5 );
	background-image:     -ms-linear-gradient( #7fa5e8 , #507cc5 );
	background-image:      -o-linear-gradient( #7fa5e8 , #507cc5 );
	background-image:         linear-gradient( #7fa5e8 , #507cc5 );                        
}
#make-a-payment .send input:hover{
    background:#6489C4;
	background-image: -webkit-gradient(linear, left top, left bottom, from( #507cc5 ), to( #7fa5e8 ));
	background-image: -webkit-linear-gradient( #507cc5 , #7fa5e8 );
	background-image:    -moz-linear-gradient( #507cc5 , #7fa5e8 );
	background-image:     -ms-linear-gradient( #507cc5 , #7fa5e8 );
	background-image:      -o-linear-gradient( #507cc5 , #7fa5e8 );
	background-image:         linear-gradient( #507cc5 , #7fa5e8 );                          
}