/*============================================

MetroTab by SONHLAB.com - version 2.2
Website: http://sonhlab.com
Documentation: http://docs.sonhlab.com/metrotab-responsive-metro-ui-tabs/

============================================*/


/* START GLOBAL */
html,body,div,span,applet,object,iframe,input,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dl,dt,dd,ol,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{
	margin:0;
	padding:0;
	border: 0px;
}

body {
	font-family:'Roboto', sans-serif;
	/*ackground:#016C38;*/
	color:#1e1e1e;
}
a {
	text-decoration:none;
	color:#fff;	
}

#mainform {
	width:960px;
	margin:0 auto;
	display:block;
}

h1 {
	font-size:80px;
	padding:0px;
	margin:100px 0;
	line-height:1;
	font-family:"Wire One",sans-serif;
	font-weight:normal;
	text-transform:uppercase;
	
}
h1 a {
	color:#1e1e1e;
}




@media screen and (max-width:959px) {
	h1 {
		width:100%;
		margin-left:10px;
	}
}


.thumbnails { float:left; width:192px; height:144px; margin-bottom:10px; margin-right:10px; }
.thumbnails img { max-width:192px;} 

@media screen and (max-width:799px) {
	.thumbnails { float:left; width:90px; height:68px; margin:5px;}
	.thumbnails img { max-width:90px;} 
}
@media screen and (max-width:960px) {
	#mainform {
		width:100%;
	}	
}

h3 {
	font-size:32px;
	line-height:1;
	padding:20px 0 0 0;
	margin:0px;
	font-family:"Economica",sans-serif;
	font-weight:normal;
	text-transform:uppercase;
	border-top:2px solid #00CE9B;
}
p {
	padding-top: 20px;
	line-height:1.6;
	font-size:18px;
}
.mt-content p > .resimg img {
	width: 100%;
	margin:20px 0;
}


.readmore a {
	display:block;
	font-size:20px;
	height:48px;
	margin-top:20px;
	font-family:"Economica",sans-serif;

}

.demoitem {
	padding: 0 14px;
	line-height:48px;
	font-size:20px;
	margin-right:5px;
	display:block;
}

/* END GLOBAL */




/* START METROTAB 2.x */
.metrotabs {
	width:100%;
}

.mt-active {
	
	box-shadow:0px 0px 10px 2px #999;
	-webkit-box-shadow:0px 0px 10px 2px #999;
	-moz-box-shadow:0px 0px 10px 2px #999;
	-o-box-shadow:0px 0px 10px 2px #999;
	-ms-box-shadow:0px 0px 10px 2px #999;
	
}
.mt-tab:hover > a {
	background: -moz-linear-gradient(-45deg,  rgba(255,255,255,0.4) 0%, rgba(255,255,255,0.4) 27%, rgba(255,255,255,0.6) 50%, rgba(255,255,255,0.4) 80%, rgba(255,255,255,0.4) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,rgba(255,255,255,0.4)), color-stop(27%,rgba(255,255,255,0.4)), color-stop(50%,rgba(255,255,255,0.6)), color-stop(80%,rgba(255,255,255,0.4)), color-stop(100%,rgba(255,255,255,0.4))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(-45deg,  rgba(255,255,255,0.4) 0%,rgba(255,255,255,0.4) 27%,rgba(255,255,255,0.6) 50%,rgba(255,255,255,0.4) 80%,rgba(255,255,255,0.4) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(-45deg,  rgba(255,255,255,0.4) 0%,rgba(255,255,255,0.4) 27%,rgba(255,255,255,0.6) 50%,rgba(255,255,255,0.4) 80%,rgba(255,255,255,0.4) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(-45deg,  rgba(255,255,255,0.4) 0%,rgba(255,255,255,0.4) 27%,rgba(255,255,255,0.6) 50%,rgba(255,255,255,0.4) 80%,rgba(255,255,255,0.4) 100%); /* IE10+ */
	background: linear-gradient(135deg,  rgba(255,255,255,0.4) 0%,rgba(255,255,255,0.4) 27%,rgba(255,255,255,0.6) 50%,rgba(255,255,255,0.4) 80%,rgba(255,255,255,0.4) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#66ffffff', endColorstr='#66ffffff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

.mt-contentblockstyle {
	padding:5px;
	overflow:hidden;
}
.mt-content {
	width:100%;
	position:relative;
}
.mt-minibar {
	width:100%;
	height:48px;
	cursor:pointer;
	position:relative;
}
.mt-minibar > img {
	display:block;
	float:left;
}
.mt-minibar > span {
	color:#fff;
	display:block;
	font-size:16px;
	line-height:48px;
	float:left;
}


.mt-tab {
	margin:5px;
	float:left;
}

#mt-station {
	display:none;
}

.mt-content p {
	text-align:justify;
}

/* END METROTAB 2.x */




/* TILE BUTTONS */

/* Standard Buttons */
.tile-bt {
	text-align:center;
	cursor:pointer;
	width:90px;
	height:90px;
}
.tile-bt a {
	display:block;
	padding-top:12px;
	text-decoration: none !important;
}
.tile-bt img {
	margin:0 auto 0 auto;
	padding-bottom:5px;
	height:48px;
	width:48px;
	position:relative;
	display:block;
}
.tile-bt span {
	padding-bottom:10px;
	display:block;
}
.tile-bt:active {
	/*opacity:0.5;*/
}
/* End Standard Buttons */



/* Long Buttons */
.tile-bt-long {
	width:190px;
	height:90px;
	line-height:90px;
	text-align:center;
	cursor:pointer;
}
.tile-bt-long a {
	display:block;
	text-decoration: none !important;
}
.tile-bt-long img {
	vertical-align: middle;
	margin:auto;
	padding:0px;
	position:relative;
	width:48px;
	height:48px;
}
.tile-bt-long span {
	vertical-align: middle;
	display:inline;
}
.tile-bt-long:active {
	/*opacity:0.5;*/
}
/* End Long Buttons */


/* Tall Buttons */
.tile-bt-tall {
	width:90px;
	height:190px;
	text-align:center;
	cursor:pointer;
}
.tile-bt-tall a {
	display:block;
	padding-top:52px;
	text-decoration: none !important;
}
.tile-bt-tall img {
	margin:0 auto 0 auto;
	padding-bottom:54px;
	height:48px;
	width:48px;
	position:relative;
	display:block;
}
.tile-bt-tall span {
	padding-bottom:20px;
	display:block;
}
.tile-bt-tall:active {
	/*opacity:0.5;*/
}
/* End Tall Buttons */


/* Large Buttons */
.tile-bt-large {
	text-align:center;
	cursor:pointer;
	width:190px;
	height:190px;
}
.tile-bt-large a {
	display:block;
	padding-top:52px;
	text-decoration: none !important;
}
.tile-bt-large img {
	margin:0 auto 0 auto;
	padding-bottom:22px;
	height:80px;
	width:80px;
	position:relative;
	display:block;
}
.tile-bt-large span {
	font-size:16px;
	padding-bottom:20px;
	display:block;
}
.tile-bt-large:active {
	/*opacity:0.5;*/
}

/* End Large Buttons */

/* END TILE BUTTONS */






/* RESPONSIVE MEDIA */
.video-holder {
	width:100%;
	display:block;
	margin-bottom:10px;
}
.responsive-video {
	width:100%;
	height:100%;
	margin:auto;
	display:block;
	position:relative;
}
/* END RESPONSIVE MEDIA */



/* MASONRY TRANSITION */
.masonry,
.masonry .masonry-brick {
  -webkit-transition-duration: 0.7s;
     -moz-transition-duration: 0.7s;
      -ms-transition-duration: 0.7s;
       -o-transition-duration: 0.7s;
          transition-duration: 0.7s;
}

.masonry {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
      -ms-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}

.masonry .masonry-brick {
  -webkit-transition-property: left, right, top;
     -moz-transition-property: left, right, top;
      -ms-transition-property: left, right, top;
       -o-transition-property: left, right, top;
          transition-property: left, right, top;
}
/* END MASONRY TRANSITION */




/* JSCROLLPANE */
.jspContainer {
	overflow: hidden;
	position: relative;
}

.jspPane {
	position: absolute;
}

.jspVerticalBar {
	position: absolute;
	top: 0;
	right: 0;
	width: 10px; /* Scrollbar Width */
	height: 100%;
	background:transparent;
}

.jspHorizontalBar {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 14px;
	background: transparent;
}

.jspVerticalBar *,
.jspHorizontalBar *
{
	margin: 0;
	padding: 0;
}

.jspCap {
	display: none;
}
.jspHorizontalBar .jspCap
{
	float: left;
}

.jspTrack
{
	background: transparent;
	position: relative;
}

.jspDrag
{
	position: relative;
	top: 0;
	left: 0;
	cursor: pointer;
	/*background:#00BBE2;   Scrollbar Color */
}

.jspHorizontalBar .jspTrack,
.jspHorizontalBar .jspDrag
{
	float: left;
	height: 100%;
}

.jspArrow
{
	background: #50506d;
	text-indent: -20000px;
	display: block;
	cursor: pointer;
}

.jspArrow.jspDisabled
{
	cursor: default;
	background: #80808d;
}

.jspVerticalBar .jspArrow
{
	height: 16px;
}

.jspHorizontalBar .jspArrow
{
	width: 16px;
	float: left;
	height: 100%;
}

.jspVerticalBar .jspArrow:focus
{
	outline: none;
}

.jspCorner
{
	background: #eeeef4;
	float: left;
	height: 100%;
}

/* Yuk! CSS Hack for IE6 3 pixel bug :( */
* html .jspCorner
{
	margin: 0 -3px 0 0;
}
/* END JSCROLLPANE */




/* MISC */
.clearspace { clear: both; }
.floatleft { float:left !important; }
.floatright { float:right !important; }

.light-text {
	color:#fff;
}
.dark-text {
	color:#1e1e1e;
}
.gradient {
	background: -moz-linear-gradient(-45deg,  rgba(255,255,255,0) 0%, rgba(255,255,255,0.3) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,rgba(255,255,255,0)), color-stop(100%,rgba(255,255,255,0.3))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(-45deg,  rgba(255,255,255,0) 00%,rgba(255,255,255,0.3) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(-45deg,  rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(-45deg,  rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 100%); /* IE10+ */
	background: linear-gradient(-45deg,  rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 100%); /* W3C */
}