/* Transvisual Graphics */
/* Updated 24/03/14 */

/* Main layout sections */
body { background: #fff; margin: 0px auto; color:#3b3b3b; font-family: 'Roboto Condensed', Arial, Helvetica, sans-serif;}
#top { border-top: 6px solid #000; width: 100%; margin: 0px 0px 0px 0px; position: fixed!important; z-index: 50; top: 0; }
#section { margin-top: 87px; }
div.wrap { margin:0px auto; position:relative; }
div.subwrap { clear: both; width: 960px;margin:0px auto; position:relative; }
#top div.subwrap{width:1200px;}
img { border:0; display:block; }
#logo { padding: 10px 15px 12px 15px; position: relative; z-index: 99; float:left; }
#marine-logo{padding:10px 15px 12px 15px;float:left;position:relative;}
#nav { /*float:right;*/float:left; /*width:640px;*/width:auto; position: relative; z-index: 999; padding: 0px; margin: 40px 0px 0px 0px; }
#banner { float:left; width:100%; position:relative; z-index:10; max-height: 700px; overflow: hidden; }
#quoteform { width: 430px; background: #000; position:relative; z-index:10; color:#fff; padding: 20px; -webkit-border-radius: 9px; -moz-border-radius: 9px; border-radius: 9px;}
#article { clear: both; padding-top: 30px; margin: 0px auto 40px auto; position:relative; z-index: 10; }
#footer { clear: both; padding: 20px 0px 5px 0px; margin: 10px 0px 15px 0px; border-top: 1px solid #bbc1c1; }

.clearing { clear:both; }
.z1 { z-index:1; }

.white		{ background-color:#fff!important; }
.black		{ background-color:#000!important; }
.transblue	{ background-color:#00adee!important; }
.liteblue	{ background-color:#72c6e6!important; }
.darkgrey	{ background-color:#3b3b3b!important; }
.litegrey	{ background-color:#bbc1c1!important; }
.orange		{ background-color:#fa5701!important; }
.frametop	{ background-color: none!important; background-image: url(../images/frame-top.png); background-repeat: repeat-x; position: fixed; top: 85px; padding-bottom: 20px; z-index:48; width:100%; }
.framebtm	{ background-color: none!important; background-image: url(../images/frame-btm.png); background-repeat: repeat-x; height:35px; position: absolute; bottom: 0; z-index:98; width:100%; }
.left { float: left; }
.right { float: right; }
.w49 { width: 470px; }

h1 { font-weight:300; color:#00adee; margin: 10px 0px 15px 0px; font-size:36px; line-height:40px; }
h1 a { color:#00adee!important; text-decoration: none!important; }
h2 { font-weight:700; color:#00adee; margin: 10px 0px 5px 0px; font-size:26px; }
div.page-header+div.headersection h1 { margin-top: 5px; }
div.page-header h2 { margin-top: 15px; }
h3 { font-weight:700; color:#72c6e6; margin: 5px 0px 0px 0px; font-size:18px; }
h4 { font-weight:400; color:#bbc1c1; margin: 5px 0px 0px 0px; font-size:16px; }
h5 { font-weight:700; color:#3b3b3b; margin: 5px 0px 0px 0px; font-size:15px; }
p  { font-weight:400; color:#000; margin: 5px 0px 5px 0px; font-size:14px; line-height:18px; }
ul, ol { font-weight:400; color:#000; font-size:14px; line-height:18px; }
a { color: #fa5701; text-decoration:underline; }
a:hover { color: #3b3b3b; text-decoration:none; }
a:active { color: #000; text-decoration:none; }

/*** EDIT THESE CSS CODES WITH CARE: STARTS ***/
#nav .menu, .menu  *{margin:0;}
#nav li li{margin:0;}
#nav .menu {float:none;margin-bottom:0;position:relative; z-index:101}
#nav .menu  ul{padding:0;}
#nav .menu  li{float:left;list-style:none;position:relative;}
div#nav li li a, div#nav li.active li a{display:block;margin:0;text-decoration:none;float:none;width:98%;}
#nav .menu  li ul{float:none;left:-999em;position:absolute;width:240px;z-index:102;}
#nav .menu  li:hover ul,
#nav .menu  li.sfHover ul{left:0px;}
#nav .menu  li:hover li ul,
#nav .menu  li.sfHover li ul,
#nav .menu  li li:hover li ul,
#nav .menu  li li.sfHover li ul,
#nav .menu  li li li:hover li ul,
#nav .menu  li li li.sfHover li ul{top:-999em;}
#nav .menu  li li:hover ul,
#nav .menu  li li.sfHover ul,
#nav .menu  li li li:hover ul,
#nav .menu  li li li.sfHover ul,
#nav .menu  li li li li:hover ul,
#nav .menu  li li li li.sfHover ul{left:220px;top:0px;}
#nav .menu  li li{position:relative;float:none;}
#nav ul .active a { color:#fff; background: #00adee; border: 0;
  -webkit-border-radius: 4px 4px 4px 4px;
  -moz-border-radius: 4px 4px 4px 4px;
  -khtml-border-radius: 4px 4px 4px 4px;
  border-radius: 4px 4px 4px 4px;
}
#nav ul .active a:hover { color:#fff; }
#nav ul .active ul li a, #nav ul .current ul li a.current { background: #f2f3f1; border: none; color: #686868; 
  -webkit-border-radius: 0px 0px 0px 0px;
  -moz-border-radius: 0px 0px 0px 0px;
  -khtml-border-radius: 0px 0px 0px 0px;
  border-radius: 0px 0px 0px 0px; }
#nav ul .active ul li a:hover { color:#686868; }
/*** EDIT THESE CSS CODES WITH CARE: ENDS ***/

/* Navigation */
#nav ul { margin: 0px; padding: 0px 10px; text-align: left; font-size:18px; position: relative; }
#nav ul ul { top:33px; z-index: 1000; }
#nav ul ul ul { top:2px; }
#nav ul li { display: inline-block; list-style: none; position: relative; zoom:1; *display:block; white-space:nowrap; float:left; margin:0px 0px; padding: 0px 0px 3px 0px; }
#nav ul li a {color:#686868; text-decoration:none; display:inline-block; padding: 6px 8px 8px 8px; margin: 0px 0px 0px 0px; }
#nav ul li a:hover {color:#00adee; }
#nav ul ul { position: absolute; visibility: hidden; margin: 0 0 0 1px; padding: 0px!important; width:240px; display: block; white-space:normal; opacity:.93; filter: alpha(opacity=93); -moz-opacity: 0.93; }
#nav ul li:hover ul { visibility: visible; }
#nav ul li ul li { width: 202px; padding: 0px 0px; list-style:none; text-transform:none; background:none; }
#nav ul li ul li a { position: relative; display: block; margin: 0; padding: 9px 12px; width: 196px; white-space: nowrap; background: #f2f3f1; color: #686868; font: 13px 'OpenSans-Regular', Arial, sans-serif; }
#nav ul li ul li a:hover { color:#686868; background-color: #d4d7d0; }

/* Banner */
#mod_btslideshow_pro_91.box_skitter .next_button{right:8px!important;}
#mod_btslideshow_pro_91.box_skitter .prev_button{left:8px!important;}

/* Form */
fieldset, #userForm ol { border: none; padding: 0px 0px!important; margin: 0px 0px!important; }
#userForm ol li { border: none; padding: 1px 0px!important; }
legend { font-weight:400!important; color:#00adee; margin: 0 0 5px 0px; font-size:22px!important; font-style: italic; }
#userForm div.formCaption { color:#fff; width: 68px; }
#userForm div.formBody { width:215px; padding: 0px; margin: 0px 0px 0px 2px; }
#userForm input.rsform-input-box { padding: 4px 5px; width: 205px; color:#555; border:none; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;}
#userForm textarea.rsform-text-box { padding: 4px 5px; width: 205px; color:#555; border:none; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;}
#userForm img{ border:none; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; margin-bottom: 0px; }
#userForm input.rsform-captcha-box { padding: 4px 5px; width: 106px; color:#555; border:none; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;}
#userForm a { color:#888; }
#userForm a:hover { color:#00adee; text-decoration: none; }
#userForm input.rsform-submit-button { font-family: 'Roboto Condensed', Arial, Helvetica, sans-serif; font-size: 14px; font-weight: 400; padding: 3px 12px; color:#fff; border:1px solid #207cca; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;
background: #1e5799; /* Old browsers */
background: -moz-linear-gradient(top,  #1e5799 0%, #2989d8 50%, #207cca 51%, #7db9e8 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1e5799), color-stop(50%,#2989d8), color-stop(51%,#207cca), color-stop(100%,#7db9e8)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%); /* IE10+ */
background: linear-gradient(to bottom,  #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#7db9e8',GradientType=0 ); /* IE6-9 */
}
.rsform-block-pagetitle { display: none; }

/* Content */
#article img { max-width: 100%; max-height: auto!important; display: inline; }
#article div.items-leading { text-align: center; margin: 10px 0px 25px 0px; }
#article div.blog-featured h1 { text-align: center; }
#article div.items-leading p { font-size: 16px; line-height: 22px; margin-top: 10px; }
#article div.items-leading p.readmore { text-transform:uppercase; background: url(../images/bg-readmore.png) center no-repeat; }
#article div.items-leading p.readmore a { background:#fff; padding: 1px 8px; }
#article p.readmore a { color:#00adee; text-decoration: none; }
#article p.readmore a:hover { color:#72c6e6; }
#article p.readmore a:active { color:#58b3d6; }
#article .cols-2 h2, #article .cols-3 h2 { font-size:18px; text-transform:uppercase; }
#article h2 a { color: #00adee; text-decoration:none; }
#article h2 a:hover { color: #72c6e6; text-decoration:none; }
#article h2 a:active { color: #58b3d6; text-decoration:none; }
#article div.item-image img { display:inline }
#article div.contentsection div.item-image { margin-bottom: 10px; }

div.items-row { margin-bottom: 30px; }

/* 3 Column Layout */
div.cols-3 div.column-1 { float: left; width: 30%; margin-right:5%; position:relative; clear:both; }
div.cols-3 div.column-2 { float: left; width: 30%; margin-right:5%; position:relative; }
div.cols-3 div.column-3 { float: left; width: 30%; margin-right:0%; position:relative; }
div.cols-3 div.headersection, div.cols-3 div.contentsection {float: none; width: 100%; }
div.cols-3 h2 { font-size:18px!important; line-height: 22px; }
div.cols-3 p {  }

/* 2 Coloumn Layout */
div.cols-2 { width: 100%; }
div.cols-2 div.column-1 { clear:both; float: left; width: 48%; }
div.cols-2 div.column-2 { width: 48%; float: right; margin-right:0%; }
/* div.cols-2 div.headersection { float: left; width: 40%; } */
/* div.cols-2 div.contentsection {float: right; width: 56%; } */
/* div.cols-2 h2 {  } */

/* Pagination */
div.pagination { clear:both; margin-top: 20px; padding: 0px; border: 1px solid #d5d4ce; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }
div.pagination p.counter { display: inline; margin: 0px; padding: 9px 10px; border-right: 1px solid #d5d4ce; color: #95948e; }
div.pagination ul { display: inline; margin: 0px; padding: 0px 0px; }
div.pagination ul li { display: inline; margin: 0px; color: #d5d4ce; }
div.pagination span { display: inline-block; padding: 10px 10px; border-right: 1px solid #d5d4ce; }
div.pagination ul li a { display: inline-block; padding: 10px 10px; border-right: 1px solid #d5d4ce; color:#95948e;}
div.pagination ul li a:hover { color:#3cf; }
/* Page Nav */
ul.pagenav { margin: 15px 0px; padding: 0px 0px; }
ul.pagenav li { margin: 0px; padding: 0px; list-style: none; width: 40px; height: 40px; display: block; float:right; opacity: 0.1; }
ul.pagenav li:hover {  opacity: 0.3; }
ul.pagenav li.previous a { text-indent: -5000px; width: 40px; height: 40px; display: block; background: url(../images/icon_left.png) no-repeat; }
ul.pagenav li.next a { text-indent: -5000px; width: 40px; height: 40px; display: block; background: url(../images/icon_right.png) no-repeat; }

/* Breadcrubs */
ul.breadcrumb { margin: 10px 0px 5px 0px; padding: 0px; }
ul.breadcrumb li { color: #999; list-style:none; margin: 0px; padding: 0px 0px 0px 3px; display: inline; }
ul.breadcrumb li span.divider {padding: 0px 0px 0px 3px;}
ul.breadcrumb li a { color: #999; text-decoration: none; }
ul.breadcrumb li a:hover { color: #00adee; text-decoration: underline; }

/* XMAP */
div#xmap ul a { color:#000; text-decoration: none; }
div#xmap ul a:hover { color:#00adee; text-decoration: none; }

/* Footer */
#footer p { color:#595959; text-align:left; float: left; font-size: 12px; margin: 0px 0px;  }
#footer ul { margin:0px 8px; float:left; padding: 0px; font-size:12px; color:#595959; }
#footer ul li { margin:0px; padding: 0px; list-style:none; float:left; display:inline-block; }
#footer ul li a { color: #595959; text-decoration:none; border-left: 1px solid #000; padding: 0px 8px; }
#footer ul li a:hover { color:#bdb9b9; border-bottom:0px; }

/* Bottom Facebook Banners */
#facebook-transvisual, #facebook-marine-fx{position:relative;}
#facebook-transvisual{float:left;}
#facebook-marine-fx{float:right;}
.scrollup { width:40px; height:40px; opacity:0.7; position:fixed; bottom:50px; z-index:99999; right:50px; display:none; text-indent:-9999px; background: url(../images/icon_top.png) no-repeat; }