/*  

Theme Name: Flora Bay Divers
Theme URI: http://florabaydivers.com
Description: Custom Template For Flora Bay Divers
Version: 3.0
Author: Gary Lim Choon Jiang
Tags: HTML5, CSS3, two-columns, clean, fixed-width, custom-menu

*/

@charset "UTF-8";
/* CSS Document */
header, aside, footer, article, section, hgroup, nav, figure { /* Giving a display value to the HTML5 rendered elements: */
	display:block;
}
html, body {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
}
body {
	background: #162237;
	/*background:#E7D5B8;*/
}
#wrapper {
	width: 100%;
	height: 100%;
	margin:auto;
	position:relative;
}
.container {
	width:960px;
	margin:auto;
	position:relative;
}
#top,#content {
	width: 100%;
	margin:auto;
	position:relative;
}
#top {
	height:568px;
}
#top-02 {
	height:449px;
	border-bottom: 1px solid #FFF;
}
#main-navigation {
	width:100%;
	position:relative;
	z-index:9997;
}
#main-navigation ul {
	width:200px;
	padding-top:6px;
	position:relative;
}
#main-navigation ul li {
	width:200px;
	height:32px;
	padding-left:7px;
	margin-bottom:1px;
	position:relative;
	background:rgba(1,126,187,0.7);
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
	
	display:table;
}
#main-navigation ul li a {
	color:#FFF;
	font-weight:bold;
	font-size:1.4em;
	
	display:table-cell;
	vertical-align:middle;
	
	text-shadow: 1px 2px 1px rgba(0, 0, 0, 0.5);
}
#main-navigation ul li:hover {
	background:rgba(5,38,82,0.7);
}
#main-navigation ul li a:hover {
	color:#ff9400;
}
#main-navigation ul li.current_page_item {
	background:rgba(5,38,82,0.7);
}
#main-navigation ul li.current_page_item a{
	pointer-events:none;
	cursor: detault;
	color:#FF9400;
}
#main-navigation ul li.logo {
	height:69px;
	background:rgba(5,38,82,0.8);
}
ul#logo {
	position:absolute;
	top:5px;
	z-index:9999;
}
ul#logo li {
	width:200px;
	height:80px;
	position:relative;
}
#main-navigation div.menu {
	float:left;
	padding:0px;
	margin-top: -6px;
}
#group-navigation {
	width:100%;
	height: 75px;
	position:absolute;
	top:0px;
	background:rgba(5,38,82,1);
	z-index:9998;
}
#group-navigation ul {
	width: 100%;
	height: 75px;
	position: relative;
	padding-top:5px;
	padding-bottom:5px;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
}
#group-navigation ul li {
	float:right;
	width:150px;
	height:65px;
	margin-left:5px;
	position:relative;
	display:table;
}
#group-navigation ul li.btn-expand {
	height:15px;
	width:auto;
	position:absolute;
	bottom:-15px;
	right:0px;
	border:none;
	display:table;
}
#group-navigation ul li a.nav-group-divers {
	width:150px;
	height:65px;
	display:table-cell;
	vertical-align:middle;
	background:url(images/img-nav-group-divers.png) left top no-repeat;
}
#group-navigation ul li a.nav-group-place {
	width:150px;
	height:65px;
	display:table-cell;
	vertical-align:middle;
	background:url(images/img-nav-group-place.png) left top no-repeat;
}
#group-navigation ul li a.nav-group-resort {
	width:150px;
	height:65px;
	display:table-cell;
	vertical-align:middle;
	background:url(images/img-nav-group-resort.png) left top no-repeat;
}
#group-navigation ul li a.expand{
	padding-right:19px;
	padding-left:5px;
	display:table-cell;
	vertical-align:middle;
	color:#B8C7DB;
	font-size:0.8em;
	background:rgba(5,38,82,1) url(images/img-nav-group-arrow.png) right top no-repeat;
}
#group-navigation ul li a:hover  {
	color:#FFF;
	background-position:right top;
}
#slider-container {
	width:100%;
	height:568px;
	position:absolute;
	top:0;
}
#slider-content-container {
	width:100%;
	height:568px;
	margin:auto;
	position:relative;
}
#slider-content {
	width:100%;
	height:568px;
	position:relative;
}
#slider-container-02 {
	width:100%;
	height:449px;
	position:absolute;
	top:0;
}
#slider-content-container-02 {
	width:100%;
	height:449px;
	margin:auto;
	position:relative;
}
#slider-content-02{
	width:100%;
	height:449px;
	position:relative;
}
div#slider-content.img-01, div#slider-content-02.img-01 {
	width:100%;
	background:url(images/background/img-background-01.png) center no-repeat;
}
div#slider-content.img-02, div#slider-content-02.img-02 {
	width:100%;
	background:url(images/background/img-background-02.png) center no-repeat;
}
div#slider-content.img-03, div#slider-content-02.img-03 {
	width:100%;
	background:url(images/background/img-background-03.png) center no-repeat;
}
div#slider-content.img-04, div#slider-content-02.img-04 {
	width:100%;
	background:url(images/background/img-background-04.png) center no-repeat;
}
div#slider-content.img-05, div#slider-content-02.img-05 {
	width:100%;
	background:url(images/background/img-background-05.png) center no-repeat;
}
div#slider-content.img-06, div#slider-content-02.img-06 {
	width:100%;
	background:url(images/background/img-background-06.png) center no-repeat;
}
#quotes {
	position: absolute;
	z-index: 9999;
	bottom:390px;
	right:0;
}
#quotes-02 {
	position: absolute;
	z-index: 9999;
	bottom:190px;
	right:0;
}
#featured {
	width:100%;
	position:absolute;
	bottom:0;
	background:url(images/img-featured-background.png) left bottom repeat-x;
	z-index:9998;
}
#featured ul.main{
	width:100%;
	height:150px;
	position:relative;
}
#featured ul.main #title {
	width:240px;
	height: 30px;
	padding-top:12px;
	padding-left:11px;
	padding-right:11px;
	top:0px;
	left:0px;
	position: absolute;
	overflow: hidden;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
}
#featured ul.main h3 {
	float:left;
	height:23px;
}
#featured ul.main h4 {
	float:left;
	margin-top:-12px;
	margin-left:5px;
}
#featured ul.main h4.scuba {
	float:left;
	margin-left:5px;
}
#featured ul.main h4.location {
	float:left;
	margin-left:5px;
}
#featured ul.main h5 img {
	border: 1px solid #99BCE1;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
}
#featured ul.main li {
	position:relative;
	float:left;
	width:240px;
	height:31px;
	padding:11px;
	padding-top:12px;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
}
#featured ul.main li:hover li{
	background:rgba(5,38,82,0.7);
}
#featured ul.main li:hover h3 {
	color: #ff9400;
}
#featured ul.main li:hover li.more {
	visibility:visible;
}
#featured ul.sub-content {
	width:100%;
	height:119px;
	position:absolute;
	top:31px;
	left:0px;
}
#featured ul.sub-content li {
	position:relative;
	height:94px;
}
#featured ul.sub-content li.more {
	position:relative;
	padding:0;
	height:25px;
	display:table;
	visibility:hidden;
}
#featured ul.sub-content li.more a {
	color:#B8C7DB;
	font-size:0.9em;
	font-weight:bold;
	position:relative;
	display:table-cell;
	vertical-align:middle;
	padding-right:15px;
	text-align:right;
	background:#042551 url(images/img-featured-arrow.png) right top no-repeat;
}
#featured ul.sub-content li.more a:hover {
	color:#FF9400;
}
#featured ul.sub-content p {
	font-size: 1.1em;
	line-height: 1.8em;
}
#content {
	position: relative;
	padding-top:30px;
	padding-bottom:30px;
	background:#162438 url(images/background/img-background-bottom-02.png) top center no-repeat ;
	overflow: auto;
}
#content #content-640 {
	float: left;
	position: relative;
	height: auto;
	width: 640px;
	padding-top:10px;
	padding-right:20px;
	padding-bottom: 30px;
}
#content #content-400 {
	float: left;
	position: relative;
	height: auto;
	width: 400px;
	padding-right:0px;
	padding-bottom: 30px;
}
#content #content-240 {
	float: left;
	position: relative;
	height: auto;
	width: 240px;
	padding-right:20px;
	padding-bottom: 30px;
}
#content #content-640 p{
	padding-top:5px;
	padding-bottom:10px;
}
#content #content-240 p {
	font-size:1.1em;
	line-height: 1.6em;
}
#content #sidebar {
	float: left;
	position: relative;
	width: 300px;
}
#content #sidebar #about{
	float: left;
	position: relative;
	width: 300px;
	padding:14px;
	padding-top: 15px;
	padding-bottom: 15px;
	background-color: #2A4061;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
}
#content #sidebar #about:after {
	display: block;
	content: '';
	width: 82px;
	height:56px;
	position: absolute;
	background: url(images/img-sidebar-arrow.png) left top no-repeat;
	bottom:-56px;
	left:150px;
}
#content ul.side {
	width: 100%;
	position: relative;
	background-color: #2A3F60;
}
#content ul.side li {
	width: 300px;
	padding:14px;
	padding-top: 15px;
	padding-bottom: 0px;
	background-color: #2A3F60;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
	border-bottom: 1px solid #6A7990;
}
#content ul.side li #title {
	width:100%;
	height: 32px;
	overflow: hidden;
}
#content ul.side li #title h3, #content ul.side li #title h4{
	float:left;
	height:32px;
}
#content ul.side li #title h3 {
	display: table;
}
#content ul.side li #title h3 a{
	color:#FFCD8E;
	display: table-cell;
	vertical-align: middle;
}
#content ul.side li #title h4 {
	padding-left:5px;
}
#content ul.side li #title h5 img {
	border: 1px solid #99BCE1;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
}
#content ul.side li ul.sub-content li {
	width: 272px;
	padding: 0px;
	border: none;
}
#content ul.side li ul.sub-content li.more {
	position:relative;
	padding:0;
	height:25px;
	display:table;
	visibility:hidden;
}
#content ul.side li ul.sub-content li.more a {
	color:#B8C7DB;
	font-size:0.9em;
	font-weight:bold;
	position:relative;
	display:table-cell;
	vertical-align:middle;
	padding-right:15px;
	text-align:right;
	background:url(images/img-featured-arrow.png) right top no-repeat;
}
#content ul.side li ul.sub-content li.more  a:hover {
	color:#FF9400;
}
#content ul.side li:hover , #content ul.side li:hover li {
	background-color: #405370;
}
#content ul.side li:hover ul.sub-content li.more {
	visibility:visible;
}
#content ul.side li.widget-container ul{
	width: auto;
	padding-bottom:10px;
}
#content ul.side li.widget-container ul li {
	width:auto;
	padding:5px;
	padding-left:0px;
	padding-right:0px;
	border:none;
	display:table;
}
#content ul.side li.widget-container ul li a {
	display:table-cell;
	vertical-align:middle;
	color:#fff;
	font-size:1.1em;
	text-decoration: underline;
}
#content ul.side li.widget-container ul li a:hover {
	color:#FF9400;
}
#content ul.side li.widget-container ul li.current-menu-item a {
	font-weight: bold;
	cursor: default;
	pointer-events:none;
	color:#FF9400;
	text-decoration:none;
}

#content ul.mid {
	width: 100%;
	position: relative;	
}
#content ul.mid li {
	padding:11px;
	width: 100%;
	position:relative;
	background-color: #3E5371;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
}
#content ul.mid li.required {
	color: red;
	height:77px;
	background-color: rgba(0,0,0,0);
}
#content ul.mid li.cc {
	padding-top:0px;
	background-color: rgba(0,0,0,0);
}
#content ul.mid li p {
	color: #B1C3D1;
	padding-bottom:10px;
}
#content ul.mid li p.title {
	color:#FFCD8E;
	font-weight: bold;
}
#content ul.mid li strong {
	font-weight: bold;
	color:#fff;
}
#content ul.form {
	width: 100%;
	float: left;
	position: relative;
}
#content ul.form em{
	color:red;
}
#content ul.form li {
	float:left;
	width: 400px;
	margin-bottom: 15px;
}
#content ul.form li ul li {
	float:left;
	width: auto;
	min-width: 150px;
	margin-bottom: 0px;
}
#content ul.form li ul li {
	color:#B1C3D1;
	font-size: 1.1em;
}
#content ul.form li ul li input[type="text"]{
	color:#FF9400;
	width:240px;
	height:25px;
	padding-left: 5px;
	padding-right: 5px;
	margin: 0px;
	display:block;
	background-color:#2A3F60;
	border:none;
	font-size: 1.2em;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
}
#content ul.form li ul li textarea {
	color:#FF9400;
	width:240px;
	padding-left: 5px;
	padding-right: 5px;
	margin: 0px;
	display:block;
	background-color:#2A3F60;
	border:none;
	font-size: 1.2em;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
}
#content ul.form span.wpcf7-not-valid-tip-no-ajax {
	float:left;
	color:#FF7A7A;
	padding-top: 3px;
}
#content div.wpcf7-response-output {
	float:left;
	color:#FF7A7A;
	padding-top: 3px;
	font-size: 1.1em;
}
#content #required {
	float:left;
	width: 100%;
	height: 100px;
}
footer {
	width: 100%;
	height: 61px;
	background: url(images/img-footer-background.png) left top repeat-x;
}
footer ul {
	float:left;
	height: 30px;
	position: relative;
}
footer ul li {
	float:left;
	height: 30px;
	margin-right:28px;
	display: table;
}
footer ul li a {
	color:#3E627F;
	font-size:1em;
	font-weight: bold;
	display:table-cell;
	vertical-align: middle;
}
footer ul li a:hover {
	color:#FF9400;
}
footer ul li.current_page_item a {
	pointer-events:none;
	cursor: detault;
	color:#FF9400;
}
footer #copyright {
	float:left;
	width:100%;
	height:31px;
	display: table;
}
footer #copyright p {
	color:#3E627F;
	font-size: 1em;
	display: table-cell;
	vertical-align: middle;
}
table {
	width: 640px;
}
table tr.first td{
	padding-top:10px;
	padding-bottom: 10px;
	color:#FFCD8E;
	font-weight: bold;
}
table tr:hover td{
	background:#000;
}
table td {
	padding:5px;
	font-size: 1.2em;
	border:1px solid #6A7990;
	border-collapse:true;
}
table.diveteam {
	width:auto;
	text-align: center;
}
#content table.diveteam td img{
	padding:0px;
	padding-bottom:5px;
}
table.diveteam td{
	width:150px;
	padding:5px;
	border:0px;
}
#facebook {
	float:left;
	position:relative;
	color:#B1C3D1;
	background-color:#EDEFF4;
}	
div.clear {
	clear:both;
}