@charset "utf-8";
/* CSS Document */
.inside_menu header.style-2{ position:relative !important;}
.inside_menu header.style-2 .header-container {
    padding: 10px 50px 0;}
.section-title{ margin-bottom:30px;}
.white{color:#fff;}
#hibis_highlight{ background:url(../images/hibiscus_bg.jpg) top center; background-size:cover; }
#daffo_highlight{ background:url(../images/daffodils_bg.jpg) top center; background-size:cover; }
#carna_highlight{ background:url(../images/carnation_bg.jpg) top center; background-size:cover; }
#hibis_highlight .section-title  , #hibis_highlight p{ color:#fff; }
#hibis_highlight h2.section-title:after, #daffo_highlight h2.section-title:after, #carna_highlight h2.section-title:after, #hibis_highlight h2.section-title:after{ background-color:#fff;}

.about_sec h4{ margin:40px 0;}
.highlight{ margin:0; padding:0; list-style:none; overflow:hidden;}
.highlight li{ color:#fff; line-height:24px; font-size:16px;  margin:20px 0;}
.highlight li span{ display:table-cell; padding:0 5px;}
.points{ font-size:40px; color:#00aeef; position: relative; top: 0px; vertical-align: middle; white-space: nowrap;}
.highlight li em{ font-size:14px; color:#B1B1B1; line-height: 18px; display: block;}
.fa-map-marker{ animation: bounce 2s infinite; -webkit-animation: bounce 2s infinite; -moz-animation: bounce 2s infinite; -ms-animation: bounce 2s infinite; -o-animation: bounce 2s infinite;}

/*---------------*/
/***** Zoe *****/
/*---------------*/
/* Common style */
figure {
	position: relative;
	float: left;
	overflow: hidden;
	margin: 10px 1%;
	width: 340px;
	height: 210px;
	text-align: center;
	cursor: pointer;
}


figure figcaption {
	padding: 2em;
	color: #fff;
	text-transform: uppercase;
	font-size: 1.25em;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

figure figcaption::before,
figure figcaption::after {
	pointer-events: none;
}

figure figcaption,
figure figcaption > a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

figure p {
	letter-spacing: 1px;
	font-size: 68.5%;
}

figure.effect-zoe figcaption {
	top: auto;
	bottom: 0;
	padding: 1em;
	height: 2em;
	background: #00aeef;
	color: #fff;
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
	-webkit-transform: translate3d(0,100%,0);
	transform: translate3d(0,100%,0);
}

figure.effect-zoe h2 {
	float: left;
	font-size: 19px;
    line-height: 5px;
	color: #fff;

}
figure.effect-zoe span.icon-links
{
	    float: right;
    position: relative;
    top: -18px;
}

figure.effect-zoe span.icon-links i {
	display: inline-block;
	float: right;
	color: #fff;
	font-size: 1.4em;
}

figure.effect-zoe:hover span.icon-links i:hover,
figure.effect-zoe:hover span.icon-links i:focus {
	color: #252d31;
}


figure.effect-zoe h2,
figure.effect-zoe span.icon-links i {
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
	-webkit-transform: translate3d(0,200%,0);
	transform: translate3d(0,200%,0);
}

figure.effect-zoe h2 ,figure.effect-zoe span.icon-links {
	display: inline-block;
}


figure.effect-zoe:hover figcaption,
figure.effect-zoe:hover h2,
figure.effect-zoe:hover span.icon-links i {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}

figure.effect-zoe:hover h2 {
	-webkit-transition-delay: 0.05s;
	transition-delay: 0.05s;
}


figure.effect-zoe:hover span.icon-links i {
	-webkit-transition-delay: 0.2s;
	transition-delay: 0.2s;
}

.about_sec .button--itzel::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 92%;
    height: 93%;
    border: 2px solid #fff;
}
.padding{ padding:50px 0 30px;}

.about_main .bx-wrapper .bx-pager.bx-default-pager a:hover, .about_main .bx-wrapper .bx-pager.bx-default-pager a.active {
    background: #00aeef;
}

.about_main .bx-wrapper .bx-pager.bx-default-pager a {
    background: #666;
}


@media ( min-width: 760px) and ( max-width: 1230px){
.content-wrap .section-boxed{ width:740px !important;}
}

@media ( max-width: 759px){
.content-wrap .section-boxed{ 
	width: 340px !important;
    overflow: hidden;
    max-width: 100%;
    padding: 0;}
	

}

@media ( min-width: 759px){
	.overview{ position:absolute; background:rgba(0,0,0,0.8); top:40px; margin:auto; left:40px; padding:20px; }
	#exclusive{ color:#fff !important;}
	.overview .button--itzel::before {
    border: 2px solid #fff;}
}

@media( max-width: 690px)
{
	.highlight li{ color:#fff; line-height:30px; font-size:18px; width:100%; float:left; margin:10px 0;}
}