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

/*009ea0  EF9287*/
html,body,h1,h2,h3 {margin:0;padding:0;}
html {min-height: 100%; position:relative; overflow-x:hidden;}
html.home {overflow-x:visible;}
body {/*position:relative;*/ background:#ffffff;  color:#4F4E4E; background-size: cover; margin: 0;   font-family:Verdana, Geneva, sans-serif; overflow-x:hidden;}
img {border:none;}
a {border:none; text-decoration:none; color: #38B3B5; outline:none; font-weight:normal;}
h1 {display:block; color:#777251; font-size: 67px; line-height: 62px; font-weight:normal; margin: 20px 0 20px 0; font-family: 'Fjalla One', sans-serif; }
h2 {font-size:30px; margin:25px 0 13px 0;color:#38b3b5; font-family: 'Fjalla One', sans-serif; font-weight:normal;}
h3 {font-size: 15px;  margin:17px 0 0 0; line-height: 25px; }
p {line-height:25px; margin: 15px 0; font-size: 15px;}
table { font-size: 15px;}
hr { border:none;  margin: 30px 0; border-bottom: 2px solid #38B3B5;}
input {outline:none;}

.clearfix:before { content: " "; display: table; }
.clearfix:after { content: " "; display: table; clear: both; }
.clickable, .clickable2 { cursor:pointer;}

::selection {background: #ffffff; color:#38B3B5;}
::-moz-selection {background: #ffffff; color:#38B3B5;}
::-webkit-selection {background: #ffffff; color:#38B3B5;}

h2::selection {background: #38B3B5; color:#ffffff;}
h2::-moz-selection {background: #38B3B5; color:#ffffff;}
h2::-webkit-selection {background: #38B3B5; color:#ffffff;}

.clear {clear:both;}
.right {float:right}
.left {float:left}
.tel, .tel:hover {text-decoration:none !important; cursor:default; color:white;}


/*HEADER===================================================*/
	/*home banner images*/
	.dynamic-headers {position:absolute; top:0; left:0; width:100%; height:100%;}
		.home_slides {position:absolute; top:0; left:0; width:100%; height:100%;}
		.home_slides li {background:center center no-repeat; background-size:cover; width:100%; height:100%;}

	/*interior banner images*/
	.banner {position:relative; background:center center no-repeat; background-size:cover; max-height:500px; min-height:317px; overflow:hidden;}
	.banner img {display:block; width:100%; height:auto;}
	.banner .h1-wrapper {position:absolute; bottom: -9px; left:0px; width:100%; }
	.banner .h1-wrapper h1 {margin:0 auto;  max-width:960px;padding:0 20px; box-sizing:border-box; color:#ffffff; text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5); font-family: 'Fjalla One', sans-serif; text-transform:uppercase; transition:0.2s}

header {position:absolute; z-index:10; left:0px; top:44px; width:100%; display:block;  background:#009ea0; background:rgba(0, 158, 160, 0.78);  }
.home header {position:relative; z-index:10000; top:0px; margin-top: 44px;}
	.header {position:relative;margin:0 auto;height:79px;max-width: 1197px;}

		/*.logo {display:block; position:absolute; z-index: 10; top:-6px; left:4px;  width:289px; height:87px; background:url(../images/commanders-palace-logo.png) no-repeat 9px 15px;  transition:0.3s;}*/
		.logo {display: block;position: absolute;z-index: 10;top: -6px;left: 4px;width: 289px;height: 87px;background: url(../images/commanders-palace-logo-lg.png) no-repeat 9px 14px;background-size: 94% auto;transition: 0.3s;}
		.logo div {position:absolute; left:0; top:0; background-repeat:no-repeat; background-position:left top; width:289px; height:87px; opacity:0;}
			.logoC {background-image: url(../images/logoC.png);-webkit-animation: logo 7s infinite 0s; animation: logo 7s infinite 0s;}
			.logoO {background-image: url(../images/logoO.png);-webkit-animation: logo 7s infinite 0.1s; animation: logo 7s infinite 0.1s;}
			.logoM {background-image: url(../images/logoM.png);-webkit-animation: logo 7s infinite 0.2s; animation: logo 7s infinite 0.2s;}
			.logoM2 {background-image: url(../images/logoM2.png);-webkit-animation: logo 7s infinite 0.3s; animation: logo 7s infinite 0.3s;}
			.logoA {background-image: url(../images/logoA.png);-webkit-animation: logo 7s infinite 0.4s; animation: logo 7s infinite 0.4s;}
			.logoN {background-image: url(../images/logoN.png);-webkit-animation: logo 7s infinite 0.5s; animation: logo 7s infinite 0.5s;}
			.logoD {background-image: url(../images/logoD.png);-webkit-animation: logo 7s infinite 0.6s; animation: logo 7s infinite 0.6s;}
			.logoE {background-image: url(../images/logoE.png);-webkit-animation: logo 7s infinite 0.7s; animation: logo 7s infinite 0.7s;}
			.logoR {background-image: url(../images/logoR.png);-webkit-animation: logo 7s infinite 0.8s; animation: logo 7s infinite 0.8s;}
			.logo_ {background-image: url(../images/logo_.png);-webkit-animation: logo 7s infinite 0.9s; animation: logo 7s infinite 0.9s;}
			.logoS {background-image: url(../images/logoS.png);-webkit-animation: logo 7s infinite 0.9s; animation: logo 7s infinite 0.9s;}

			.logoP {background-image: url(../images/logoP.png);-webkit-animation: logo 7s infinite 1s; animation: logo 7s infinite 1s;}
			.logoA2 {background-image: url(../images/logoA2.png);-webkit-animation: logo 7s infinite 1.1s; animation: logo 7s infinite 1.1s;}
			.logoL {background-image: url(../images/logoL.png);-webkit-animation: logo 7s infinite 1.2s; animation: logo 7s infinite 1.2s;}
			.logoA3 {background-image: url(../images/logoA3.png);-webkit-animation: logo 7s infinite 1.3s; animation: logo 7s infinite 1.3s;}
			.logoC2 {background-image: url(../images/logoC2.png);-webkit-animation: logo 7s infinite 1.4s; animation: logo 7s infinite 1.4s;}
			.logoE2 {background-image: url(../images/logoE2.png);-webkit-animation: logo 7s infinite 1.5s; animation: logo 7s infinite 1.5s;}

		.logo .trademark {display:block !important;  left: 219px; top: 64px; background-repeat:no-repeat; background-position:left top; width:11px; height:11px; opacity:1; background-image: url(../images/trademark.png);}

		/*LOGO ANIMATIONS--------------------*/
		@keyframes logo {
		  0% { opacity:0;}
		  8% { opacity:1;}
		  12% { opacity:0.8;}
		  60% { opacity:0.7;}
		  70% { opacity:0;}
		  100% { opacity:0;}
		}
		@-webkit-keyframes logo {
		  0% { opacity:0;}
		  8% { opacity:1;}
		  12% { opacity:0.8;}
		  60% { opacity:0.7;}
		  70% { opacity:0;}
		  100% { opacity:0;}
		}

	/* Nav========== */
	nav {position:relative; float: right;}
    .reservations {position: absolute;right: 17px;top: -34px;background:#009ea0;background: rgba(0, 158, 160, 0.78);border-radius: 2px;color: #FFF !important;padding: 2px 19px 4px;font-size: 16px;overflow:hidden; transition:0.25s;}
    .reservations:hover {background: rgba(0, 158, 160, 1); padding: 2px 32px 4px 19px;}
    .reservations:before {opacity:0;position:absolute; content:"\f0da"; font-family:fontAwesome; line-height: 27px; right:-8px; top:0px; transition:0.25s;}
    @media screen and (-webkit-min-device-pixel-ratio:0) {.reservations:before { top:-1px;} }
    .reservations:hover:before {opacity:1; right:12px;}
	nav .mobileMenu {display:none; position:absolute; bottom:0px; right:0px; width:90px; height:100%;}
	nav > .mobileMenu:before {position:absolute; content:"MENU";  right:45px; top:12px; display:block; cursor:pointer; font-weight:normal; line-height: 55px;  font-size: 17px; color:#ffffff; font-family: 'Fjalla One', sans-serif; letter-spacing: 1px; transition: 0.3s line-height;}
	nav > .mobileMenu:after { position:absolute;  content:"\f0c9";  right:15px;   top:11px; font-family:fontAwesome;  display:block; cursor:pointer; font-weight:bold; line-height: 55px; font-size: 21px;  color:#ffffff;  transition: 0.3s line-height; }
	nav > ul { list-style:none; margin:0; padding:0; }
	nav > ul > li {position:relative;  z-index:10;display:inline-block; font-family: 'Fjalla One', sans-serif; font-weight: bold; transition:background 0.3s; }
	nav > ul > li:before {position:absolute; z-index: -1; bottom:0px; left:0px; content:''; width:100%;  height:0px;/* background:009ea0; background:rgba(0, 158, 160, 0.78);*/ background:#ffffff; background: rgba(255, 255, 255, 0.92); transition:0.3s;}
	nav > ul > li > a {display:block;text-align:center;padding: 0 10px;font-size: 20px;line-height: 79px;color:#ffffff;text-transform:uppercase;font-weight:normal;transition: color 0.3s;}
	nav > ul > li:hover:before {height:100%; transition:0.2s;}
	nav > ul > li:hover a {color:#009ea0}

    nav > ul > li ul {
        height: 0;
        position: absolute;
        list-style: none;
        margin: 0;
        padding: 1px 0;
        width: 360px;
        left: 0;
        top: 100px;
        overflow: hidden;
        transition: .4s;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        flex-flow: row wrap;
        justify-content: space-between;
        opacity: 0;
    }
    nav > ul > li ul.ourRestaurants {left:inherit; right:0px; }
    nav > ul > li ul  li  {
        position:relative; width: 49%;float: left;box-sizing: border-box; margin:1px 1% 1px 0px;
        transition: 0.4s;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        flex-flow: row wrap;
        justify-content: space-between;
    }
    nav > ul > li ul  li  a {
        position: relative;
        display: block;
        line-height: 19px;
        padding: 0;
        letter-spacing: -3px;
        text-transform: uppercase;
        font-weight: normal !important;
        font-size: 16px;
        color: rgba(255,255,255,0);
        transition: 0.3s;
        background: white;
        background: rgba(255, 255, 255, 0.90);
        letter-spacing: 0;
        color: #009ea0 !important;
        transition: 0.3s;
        padding: 7px 9px 4px 9px;
        width: 100%;
        display: flex;
        align-items: center;

    }
        nav > ul > li ul  li  a.pdf:before {position:absolute; right:5px; content:""; top:3px; width:28px; height:23px; background:url(../images/pdf2.png) center top no-repeat;}
        nav > ul > li:hover ul  li  a  {background:white; background:rgba(255, 255, 255, 0.90);  letter-spacing: 0; color:white !important; color:#009ea0 !important; transition: 0.3s;}
        nav > ul > li ul  li:first-child:before {border:none !important}
        nav > ul > li ul  li:hover:before { background:white; background:rgba(255, 255, 255, 1); transition: 0.2s;}
        nav > ul > li:hover ul  li:before {}
        nav > ul > li ul  li:hover a {background:#009ea0;background: rgba(0, 158, 160, 0.78);  color:#ffffff !important; }
        nav > ul > li ul  li:hover  a.pdf:before {background:url(../images/pdf2.png) center -23px no-repeat;}

        nav > ul > li:hover ul {
            height: auto!important;
            height: auto!important;
            opacity: 1;
            top: 79px;
    }    
	nav > ul > li:hover ul li a { padding: 7px 9px 4px 9px;}

	

	@media (max-width:1160px) {
		.banner {min-height:270px;}
		.logo div {display:none;}
		.logo img { width: 200px; height: auto;}
		.banner .h1-wrapper {bottom: -5px;}
		.banner .h1-wrapper h1 {font-size: 47px; line-height: 43px; }
		h2 {font-size: 26px;}

		nav {float:none;}
		nav .mobileMenu {display:block;}
		nav > ul {padding: 79px 0 0 0; }
		nav > ul.selected {border-bottom: solid 1px #38B3B5;}
		nav > ul.selected > li {width:100%; }
		nav > ul.selected > li a {font-size: 17px; line-height: 40px; text-align: right; background:009ea0; background:rgba(0, 158, 160, 0.78);}
		nav > ul > li.highlight2:before {background:rgba(255, 255, 255, 1) !important;}
		nav > ul.selected > li { display:block; margin-top: 1px; }
		nav > ul > li:before {display:none;}
        
		nav > ul > li { display:none; margin-top:0px !important; border-top:1px solid white !important}
		nav > ul > li > a {position:relative; padding: 0 15px 0 0; color:#ffffff !important; background:#009ea0 !important}
		nav > ul > li > a:before {display:none; position:absolute; content:"\f0d8"; font-family:fontAwesome; right: 17px;bottom: -17px;font-size: 20px;color: #FFF;}
		nav > ul > li ul {width: 100%; display: none;  height:inherit !important; position: relative;top: 0px !important; padding: 0px; background: #ffffff;}
		nav > ul > li:first-child:hover ul {height:inherit !important;}
		nav > ul > li:hover ul, nav > ul > li.opened ul {display: block; opacity: 1; }
		nav > ul > li:hover a:before, nav > ul > li.opened a:before {display:block;}
		nav > ul > li ul  li  {width: 50%; margin:0;}
		nav > ul > li ul  li  a,
		nav > ul > li ul  li:hover a {padding: 0px 15px 0px 0 !important; letter-spacing: 0px; background: none !important;color: #38B3B5 !important;border-top: 1px solid #C7E7E7; border-right: 1px solid #C7E7E7;}
        nav > ul > li:hover ul li a,nav > ul > li.opened ul li a{ justify-content: flex-end; }	
        .reservations{
    padding: 2px 10px 4px;
    font-size: 14px;
        }
}
	@media (max-width:550px) {
		.logo {background: url(../images/commanders-palace-logo-lg.png) no-repeat 9px 15px;background-size: 200px auto; background-size: 198px auto; width: 207px;top: 4px;}
		.logo .trademark {left: 161px; top:52px;  background-size: 8px 8px; }
	}
	@media (max-width:450px) {
		nav > ul > li ul  li  {width: 100%;}
		.banner .h1-wrapper h1 {font-size: 37px;line-height: 38px;}
	}
	@media (max-width:340px) {
		nav > .mobileMenu:before {display:none;}
	}

/*Main Content=====================*/
section {position:relative;}
section:before {position: absolute;content: ''; z-index: 0; top: -40px;height: 24px;width: 100%;left: 0;border-radius: 55%;box-shadow: 0px -4px 10px -4px rgba(0, 0, 0, 0.42);-moz-box-shadow: 0px -4px 10px -4px rgba(0, 0, 0, 0.42);-webkit-box-shadow: 0px -4px 10px -4px rgba(0, 0, 0, 0.42);}
section:after {position: absolute;content: ''; z-index: 1; top: -40px; left: 0; height: 24px;width: 100%; background:white;}
	.content {margin:40px auto 200px auto; max-width:960px; padding:0 20px; box-sizing:border-box; min-height:25px;}
	.content a:hover {text-decoration:underline;}
	.content ul {list-style:none; margin: 5px 0; padding-left:10px;}
	.content ul li {position:relative; font-size: 15px; padding:3px 0 3px 20px;}
	.content ul li:before {position:absolute; content:""; left:0px; top:9px; width:8px; height:8px; border-radius:50%; background:#009ea0;}

	.highlight {border-radius:2px; background: #D7B358; padding:3px 10px; box-sizing:border-box; color:white;}
	.highlight a {color:white !important; text-decoration:underline !important; font-weight:bold;}
	.button {position:relative; margin-bottom: 17px; padding: 0 36px 0 11px;font-size: 15px; display: inline-block;border-radius: 2px;text-transform: uppercase;background: #36B2B4;color: #FFF;cursor: pointer; line-height: 34px; text-decoration:none !important;  transition: 0.3s;}
	.button:before {position:absolute; content:"\f0da"; right:-9px;  width:30px;color:white;  height:100%; top:1px; font-size:15px;  font-family: FontAwesome;}
	.mailist {position:relative;  padding: 8px 11px 8px 36px; font-size: 15px;border-radius: 2px;text-transform: uppercase;background: #36B2B4;color: #FFF;cursor: pointer; line-height: 34px; text-decoration:none !important;  transition: 0.3s;}
	.button:hover, .mailist:hover  {background: #009EA0;}
	.mailist:before {position:absolute; content:"\f0e0"; left:10px;  width:30px;color:white;  height:100%; top:0; font-size:15px;  font-family: FontAwesome;}

	.images {fmargin-right:15px;}

	/*MENU main page*/
	.menus {float:left; width:14.6%; margin:0 1%; max-width:231px; margin-bottom:45px;}
	.menus td img {width:100%; height:auto;}
	.menus td a {display:block; background:#38b3b5; color:white; font-family: 'Fjalla One', sans-serif;text-align:center; font-size: 24px; text-decoration:none !important; transition:0.3s;}
	.menus:hover a {background:#009EA0;}


	/*Page specific */
	.request-form iframe {width:100%; height:500px;}
	#tripleseat_embed_form input.button {border:none !important}
	.cocktails .content a {}
	.cocktails .content a.button {position:relative; margin-bottom: 17px; padding: 0 36px 0 11px;font-size: 15px; display: inline-block;border-radius: 2px;text-transform: uppercase;background: #36B2B4;color: #FFF;cursor: pointer; line-height: 34px; text-decoration:none !important;  transition: 0.3s;}
	.cocktails .content a.button:before {position:absolute; content:"\f0da"; right:-9px;  width:30px;color:white;  height:100%; top:1px; font-size:15px;  font-family: FontAwesome;}
	.cocktails .content a.button:hover  {background: #009EA0;}

	.video {position: relative;padding-bottom: 56.5%;width: 97.5%; margin: 0 1.5% 0 1%; }
	.video iframe {position: absolute;width: 100%;height: 100%;top: 0;left: 0;}

	.restaurant {float:left; width: 50%;box-sizing: border-box;-moz-box-sizing: border-box;text-align: center;}
	.restaurant td {padding: 0 10.5%;}
	.restaurant:before, .restaurant:after {display:none;}
	.restaurant:nth-child(1)  {border-left: 3px #fff dotted; border-right: 1px #fff dotted;}
	.restaurant:nth-child(2)  {border-left: 2px #DAF0F0 dotted; border-right: 2px #DAF0F0 dotted;}
	.restaurant:nth-child(3)  {border-left: 1px #fff dotted; border-right: 3px #fff dotted;}
	.restaurant img {width:100%;max-width:245px; height:auto;padding-bottom: 30px;}
	.restaurant a {display:block; text-transform:uppercase;margin-bottom: 20px;background: #38B3B5;color: white;line-height: 29px;border-radius: 2px; font-size: 15px; text-decoration:none !important; transition:0.3s;}
	.restaurant a:hover {background: #009EA0;}
	.restaurant .address {position:relative;margin-bottom: 20px;font-size: 12px; line-height: 16px;}
	.restaurant .address:before {content:'\f041'; font-family:fontAwesome; display: block;font-size: 30px;color: #38B3B5; margin-bottom: 12px;}
	.restaurant .phone {position:relative;}
	.restaurant .phone:before {content:'\f095'; font-family:fontAwesome; display: block;  font-size: 30px;color: #38B3B5}


	#bios-page .content  table {position:relative;}
	#bios-page .content  table td {padding:15px 0;}
	#bios-page .content  table td h2 {margin:25px 0 0px 0}
	#bios-page .content  table td h3 {margin:0}
	#bios-page .content  table  a { display: inline-block; position:absolute; top:41px ; right:10px;  border-radius: 2px; padding: 0 45px 0 11px; font-size: 15px; text-transform: uppercase; background: #36B2B4; color: #FFF; text-decoration: none !important; line-height: 27px; transition: 0.3s;}
	#bios-page .content  table  a:hover {background: #009EA0;}
	#bios-page .content  table  a:before {position: absolute;right: 5px;content: "";top: 3px;width: 28px;height: 23px;background: url(../images/pdf2.png) -3px -24px no-repeat;}

	@media (max-width:770px) {
	.content  {margin-bottom:220px}
	}

	@media (max-width:800px) {
		.menus {width:31.1%;}
	}
	@media (max-width:570px) {
		#bios-page .content  table  a {position: relative !important; top:0px; right:inherit; margin-bottom: 15px; }
		.restaurant {float:none; width:100%; margin:0 auto 0 auto; border:none !important; }
		.restaurant td {padding:20px 2%;}
		.restaurant a {max-width:175px; margin: 0 auto 20px auto; }
		.restaurant img  {max-width:175px}
		.restaurant .address:before {font-size:20px;line-height: 13px}
		.restaurant .phone:before {font-size:20px;line-height: 13px}
		.restaurant:nth-child(2)  {border-top: 2px #DAF0F0 dotted !important; border-bottom: 2px #DAF0F0 dotted !important;}
	}
	@media (max-width:450px) {
		.wineImg {float:none !important; display:block; margin: 0 auto !important;}
	}
	@media (max-width:420px) {
		.menus {width:48%;}
	.images {float:none !important; display:block; margin:0 auto !important;}
	#bios-page .content table td img {margin:0;}
	}

/* Blog============================== */
section .blogitem { border-bottom: 2px #DAF0F0 dotted; }
section .blogitem img { display:none; }
section .blogitem .date { font-style:italic; }
section .blogitem .category { }
	.pageContainer {margin-top:20px;}
	.date, .datecatText {font-weight:bold;}

/* Gallery============================ */
#gallery-categories { list-style: none !important; padding: 0; margin: 0 0 70px 0;}
#gallery-categories li {position:relative; width: 33.33%; float:left; margin: 0; padding: 15px 10px 45px 10px; box-sizing:border-box;}
#gallery-categories li:last-child {display:none;}
#gallery-categories li:before {display:none;}
#gallery-categories li a { position: relative; display:block; }
#gallery-categories li a span { position: absolute;  dispaly:block; width:100%; margin:2px 0 0 0; background:#36b2b4;  font-family: 'Fjalla One', sans-serif;  text-transform:uppercase; text-align:center;  font-size:24px; letter-spacing: 1px; padding:3px 0; color: white;  box-sizing:border-box; transition:0.3s;}
#gallery-categories li:hover a span {background: #009EA0;}
#gallery-categories li a img { display:block; width:100%; height:auto; }

#gallery-pager { position:relative; }
#gallery-pager ul { list-style: none; padding: 0 0 40px 0; margin: 0 0 -40px 0; overflow-x:scroll; overflow-y:hidden; white-space:nowrap; }
#gallery-pager ul li { display:inline-block; margin:0.2em; padding:0 0 3px 0 !important; border-bottom:1px solid transparent;  border-bottom:white 3px solid;  border-bottom:rgba(255, 255, 255, 0) 3px solid; }
#gallery-pager ul li:before {display:none !important;}
#gallery-pager ul li.rslides_here { border-bottom:#009ea0 3px solid;  }
#gallery-pager ul li a { display: block; }
#gallery-pager ul li a img { display: block; }
#gallery-pager .prev , #gallery-pager .next {position: absolute;width: 25px;height: 40px;line-height: 40px;top: 21px;margin-bottom: 0;font-size: 31px; text-align:center; z-index: 2;  text-decoration:none; font-family: FontAwesome; background:white; border-radius:2px; transition:0.2s;}
#gallery-pager .prev {left: -2%;box-shadow: 4px 0 6px -3px rgba(0, 0, 0, 0.45); -moz-box-shadow: 4px 0 6px -3px rgba(0, 0, 0, 0.45); -webkit-box-shadow: 4px 0 6px -3px rgba(0, 0, 0, 0.45);}
#gallery-pager .next {right: -2%;box-shadow: -4px 0 6px -3px rgba(0, 0, 0, 0.45); -moz-box-shadow: -4px 0 6px -3px rgba(0, 0, 0, 0.45); -webkit-box-shadow: -4px 0 6px -3px rgba(0, 0, 0, 0.45);}
#gallery-pager .prev:hover , #gallery-pager .next:hover  {width: 35px;}
#gallery-pager ul.js::-webkit-scrollbar { display: none; }

#gallery-photos { position:relative; }
#gallery-photos ul li {padding:0 !important;}
#gallery-photos ul li:active,
#gallery-photos ul li:target { display:block !important; }
#gallery-photos ul li:before {display:none !important;}
#gallery-photos .prev, #gallery-photos .next {text-shadow:2px 0 1px #FFF,0 2px 1px #FFF,-2px 0 1px #FFF,0 -2px 1px #FFF; background:white; border-radius:2px; position: absolute;width: 50px;height: 200px;line-height: 200px;top: 50%;margin-top: -100px;bottom: 0;font-size: 45px;text-align: center;z-index: 2;font-family: FontAwesome; text-decoration:none; transition:0.2s;}
#gallery-photos .prev {left:-5%; box-shadow: 4px 0 7px -3px rgba(0, 0, 0, 0.45); -moz-box-shadow: 4px 0 7px -3px rgba(0, 0, 0, 0.45); -webkit-box-shadow: 4px 0 7px -3px rgba(0, 0, 0, 0.45);}
#gallery-photos .next {right:-5%; box-shadow: -4px 0 7px -3px rgba(0, 0, 0, 0.45); -moz-box-shadow: -4px 0 7px -3px rgba(0, 0, 0, 0.45); -webkit-box-shadow: -4px 0 7px -3px rgba(0, 0, 0, 0.45);}
#gallery-photos .prev:hover {width:60px; box-shadow: 4px 0 11px -3px rgba(0, 0, 0, 0.55); -webkit-box-shadow: 4px 0 11px -3px rgba(0, 0, 0, 0.55); -moz-box-shadow: 5px 0 9px -3px rgba(0, 0, 0, 0.55);}
#gallery-photos .next:hover {width:60px; box-shadow: -4px 0 11px -3px rgba(0, 0, 0, 0.55); -webkit-box-shadow: -4px 0 11px -3px rgba(0, 0, 0, 0.55);  -moz-box-shadow: -5px 0 9px -3px rgba(0, 0, 0, 0.55);}
	#gallery-caption {display:block; margin: 2px 0 0 0;background: #36B2B4;font-family: 'Fjalla One', sans-serif;text-transform: uppercase;text-align: center;font-size: 16px;letter-spacing: 1px;padding: 3px 0;color: #FFF;box-sizing: border-box;}
	.back {position:absolute; top:-40px; left:50%; margin-left: -65px; width: 130px; z-index:10; background:#38B3B5; border-radius:0 0 2px 2px; padding:4px 0; color:white; font-size: 12px; text-align:center; text-decoration:none !important;  border: none; transition:0.3s;}
	.back:hover {background: #009EA0;}

	@media screen and (max-width: 660px) {
		#gallery-categories li {float:none; display:block; margin:0px auto 40px auto ; width: 100%; max-width:300px;}
	}

	@media screen and (max-width: 560px) {
		#gallery-photos .prev , #gallery-photos .next {height: 80px;line-height: 80px;margin-top: -40px;}
	}


/*VIDEOS===========*/
.videos {display:flex; flex-wrap: wrap;}
.videos li {    margin: 0px 0px 10px 0px !important;}
.videos li a {position:relative;}
.videos li a:after {position:absolute;content:'\f144';left:50%;top:50%;margin: -24px 0px 0px -29px;font-family:fontAwesome;color:white;font-size: 53px;opacity: 0.7;text-shadow: 1px 1px 10px rgba(0, 0, 0, 0.78); transition:0.3s;}
.videos li:hover a:after {opacity: 1;}
.videos li a span {font-size: 21px !important;letter-spacing: 0px !important;    line-height: 23px;padding: 5px 7px !important;}

	@media screen and (max-width: 660px) {
		.videos li {margin: 0px auto 20px auto !important;}
	}
	
/*MEDIA*/
#media-photos {list-style:none; padding-left: 0;}
#media-photos li {position:relative !important; padding:0 !important; float: left; margin: 0 1% 20px; width: 18%; overflow:hidden;}
#media-photos li:before {display:none !important;}
#media-photos li:after {position:absolute; content:"download"; font-family: 'Fjalla One', sans-serif; width:100%; font-size: 19px; height:30px; text-transform:uppercase; text-align:center; line-height:30px; botton:-30px; left:0; color:white; background: #009EA0; background: rgba(0, 158, 160, 0.78); transition:0.3s;}
#media-photos li:hover:after {bottom:3px;}
#media-photos li img {width:100%; height:auto;}

	@media screen and (max-width: 700px) {
		#media-photos li {width:31.3%; margin: 0 1% 10px;}
	}
	@media screen and (max-width:450px) {
		#media-photos li {width:47.9%; margin: 0 1% 5px;}
	}
/*CONTACT PAGE =============================================================== */
form, form * { box-sizing:border-box; }
form fieldset div.formfields button { background-color:#36b2b4; transition:0.4s; }
form fieldset div.formfields button:hover { background-color:black; }
form fieldset div.formfields input,
form fieldset div.formfields textarea { background-color:rgb(216, 242, 242); font-family:"Carrois Gothic", sans-serif; box-shadow:rgba(0, 0, 0, 0.11) 1px 1px 6px inset; }
	/*CONNECT PAGE*/
	#twitter-widget-0 {width: 100% !important;}

/* Footer ================================*/
footer {position:absolute; bottom:0; left:0;  width:100%; margin:0 auto;  background:#009ea0; background:rgba(0, 158, 160, 0.78); overflow:hidden;}
.home footer {position:fixed; z-index:20; bottom:0; left:0; overflow:visible; }
footer:before {position: absolute;content: ''; z-index: 0; top: -24px;height: 24px;width: 100%;left: 0;border-radius: 55%;box-shadow: 0px 4px 12px -4px rgba(0, 0, 0, 0.42);-moz-box-shadow: 0px 4px 12px -4px rgba(0, 0, 0, 0.42);-webkit-box-shadow: 0px 4px 12px -4px rgba(0, 0, 0, 0.42);}
.home footer:before {display:none;}
footer:after {position: absolute;content: ''; z-index: 0; bottom: -24px;height: 24px;width: 100%;left: 0;border-radius: 55%;box-shadow: 0px -4px 12px -4px rgba(0, 0, 0, 0.42);-moz-box-shadow: 0px -4px 12px -4px rgba(0, 0, 0, 0.42);-webkit-box-shadow: 0px -4px 12px -4px rgba(0, 0, 0, 0.42);}
	.footer {color: #FFF;line-height: 20px;font-size: 14px;padding: 26px 15px 23px;box-sizing: border-box; margin:0 auto; max-width:1137px;}
		.schema {float:left;}
		.schema .name {display:none;}
		.schema .phone, .schema a {font-weight:bold; color:white; text-decoration:none;}
		.social {float:right;position: relative;/*padding-right: 56px;*/}
		.social > a {color:white; display:inline-block; font-size: 22px; margin-left: 10px; transition:0.3s}
		.social > a:hover {color:rgba(255, 255, 255, 0.75)}



/*Jquery UI DATEPICKER Styling*/
div.ui-datepicker{ font-size:12px; }
.ui-widget-content { border: 1px solid #EFCD9B; box-shadow: 1px 1px 11px rgba(0, 0, 0, 0.22); -moz-box-shadow: 1px 1px 11px rgba(0, 0, 0, 0.22); -webkit-box-shadow: 1px 1px 11px rgba(0, 0, 0, 0.22);}
.ui-corner-all {border-radius: 0px;}
.ui-widget-header {background:#EFCD9B ; border:none;}
.ui-widget-header .ui-icon {}
.ui-widget-header .ui-icon {}
.ui-widget-header .ui-state-hover,  .ui-widget-header .ui-state-focus {border: none;background: #EFCD9B; }
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {background: #EFCD9B !important;}

/* ResponsiveSlides*/
ul.rslides { position: relative; list-style: none; overflow: hidden; width: 100%; padding: 0; margin: 0; background:#fff; }
ul.rslides li { -webkit-backface-visibility: hidden; position: absolute; display: none; width: 100%; left: 0; top: 0; text-align:center; }
ul.rslides li:first-child { position: relative; display: block; float: left; }
ul.rslides img { display: block; height: auto; max-height: 480px; width: auto; margin: 0 auto; border: 0; }

@media (max-width:770px) {
	ul.rslides img { max-height: 380px; }	
}
@media (max-width:470px) {
	ul.rslides img { max-height: 280px; }
    article.content img{ max-width:770px; width: 100%; height: auto; margin: 0 auto; }
    .mapp
}


	@media (max-width:770px) {
		.home .footer {text-align:center;}
		.schema {display:block; float:none; text-align:center; margin-bottom:20px;}
		.footer {text-align:center;}
		.social {float:none; text-align:center; display: inline-block;}
		.overlay-wrapper {margin-top: -146px;  top:40%; }
		.compucast {display:block;}
	}


/*COMPUCAST LOGO CSS start-----------------------------*/
.old-ie {display:none;}
.cc2:hover{fill:rgba(0,0,0,0.4);}

.compucast { display:none; margin: 0 auto; position: relative; width:58px; height:64px;  color:black;  border-radius:2px; overflow:hidden; text-align:left; transition:0.5s 1.4s;}
.compucast.dark {color:white;}
	.logo1, .logo2, .old-ie {position:absolute; top:50%; right:10px; margin-top: -13px; opacity:1.5; transition:0s}
.compucast:hover , .compucast_hover{width:245px; background:rgba(0, 0, 0, 0.04); transition:0.3s 0s;}
.dark:hover { background:rgba(255, 255, 255, 0.75); background:rgba(56, 179, 181, 0.85); }
	.compucast p {position:absolute; left:-200px; margin: 0 0 0 10px; line-height: 21px; padding: 11px 0; font-family:Arial,"Times New Roman", Times, serif; font-size:12px; color: #808080; opacity:0; transition:0.5s 1.4s;}
	.compucast a {font-size:14px; font-weight:bold; color: #000; text-decoration:none;}
	.compucast:hover p {left:0px; opacity:1; transition:0.4s 0.0s;}
	.compucast.dark:hover p { color: #fff;}
	.compucast.dark a {font-size:14px; color: #fff;}

	/*color classes: colored , white and black*/
	.purple {fill:#7F3F98}
	.green {fill:#00A14B}
	.black1 {fill:rgba(0,0,0,1)}
    .black2 {fill:rgba(0,0,0,0.5)}
	.white1 {fill:rgba(255,255,255,1)}
    .white2 {fill:rgba(255,255,255,0.5)}


	@media (max-width:770px) {
	.compucast {display:block;}
	}

/*COMPUCAST LOGO CSS end-------------------------------*/


/*AFFECTS ENTIRE HOMEPAGE*/
@media (max-height:550px) and (min-width:771px)  {
	.home body {min-height:506px}
	.home body footer {position:absolute; bottom:0px;}
}
@media (max-height:685px) and (max-width:770px)  {
	.home body {min-height:651px}
	.home body footer {position:absolute; bottom:0px;}

}
.disableOverflow{ overflow:visible;}

.homebutton{
	display:block !important;
	width:100%;
	background: #000;
	color: #52AAAB;
	border-radius: 2px;
	text-align: center;
	font-size: 1em !important;
	position: absolute;
	top: -75px;

	margin:0 !important;
	padding: 10px 15px;
	width: 100%;
	margin: 0;
	box-shadow: rgba(0, 0, 0, 0.2) 3px 2px 3px 0px, inset rgba(255, 255, 255, 0.35) 2px 2px 35px -4px;
	text-shadow: #000 2px 2px 2px;
	border: 1px solid #000;
	background: #252528; /* Old browsers */
	background: -moz-linear-gradient(top,  #252528 0%, #2b2d2b 50%, #0a0e0a 51%, #4f494b 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #252528 0%,#2b2d2b 50%,#0a0e0a 51%,#4f494b 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #252528 0%,#2b2d2b 50%,#0a0e0a 51%,#4f494b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#252528', endColorstr='#4f494b',GradientType=0 ); /* IE6-9 */
}
.homebutton span{
	display: block;
	font-size: 1.5em;
	text-transform: uppercase;
	font-weight: bold;
	color: #AFD8D7;
}
@media (max-width:786px) {
	.home .footer{ padding: 10px;;}
	.homebutton{
		position: relative;
		top:0; margin-top:10px !important;
		font-size: 0.8em !important;
		padding: 4px;
	}
}