@import url("mixins.less");

@font-face {
	font-family: 'tt29';
	src: url('fonts/TitilliumMaps29L001.eot');
	src: local('☺'), url('fonts/TitilliumMaps29L001.woff') format('woff'), url('fonts/TitilliumMaps29L001.ttf') format('truetype'), url('fonts/TitilliumMaps29L001.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'tt';
	src: url('fonts/TitilliumText25100.eot');
	src: local('☺'), url('fonts/TitilliumText25100.woff') format('woff'), url('fonts/TitilliumText25100.ttf') format('truetype'), url('fonts/TitilliumText25100.svg') format('svg');
	font-weight: 100;
	font-style: normal;
}

@font-face {
	font-family: 'tt';
	src: url('fonts/TitilliumText25200.eot');
	src: local('☺'), url('fonts/TitilliumText25200.woff') format('woff'), url('fonts/TitilliumText25200.ttf') format('truetype'), url('fonts/TitilliumText25200.svg') format('svg');
	font-weight: 200;
	font-style: normal;
}

@font-face {
	font-family: 'tt';
	src: url('fonts/TitilliumText25400.eot');
	src: local('☺'), url('fonts/TitilliumText25400.woff') format('woff'), url('fonts/TitilliumText25400.ttf') format('truetype'), url('fonts/TitilliumText25400.svg') format('svg');
	font-weight: 400;
	font-style: normal;
}

@font-face {
	font-family: 'tt';
	src: url('fonts/TitilliumText25600.eot');
	src: local('☺'), url('fonts/TitilliumText25600.woff') format('woff'), url('fonts/TitilliumText25600.ttf') format('truetype'), url('fonts/TitilliumText25600.svg') format('svg');
	font-weight: 600;
	font-style: normal;
}

@font-face {
	font-family: 'tt';
	src: url('fonts/TitilliumText25800.eot');
	src: local('☺'), url('fonts/TitilliumText25800.woff') format('woff'), url('fonts/TitilliumText25800.ttf') format('truetype'), url('fonts/TitilliumText25800.svg') format('svg');
	font-weight: 800;
	font-style: normal;
}

@font-face {
    font-family: 'tt';
    src: url('fonts/titillium-regular-webfont.eot');
    src: url('fonts/titillium-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/titillium-regular-webfont.woff') format('woff'),
         url('fonts/titillium-regular-webfont.ttf') format('truetype'),
         url('fonts/titillium-regular-webfont.svg#titilliumregular') format('svg');
    font-weight: 300;
    font-style: normal;

}

.pull-left
{
	float:left;
}

.pull-right
{
	float:right;
}
.break
{
	clear:both;
	display:block;
}
body
{
	margin:0px;
	padding:0px;
	font-family:'tt';
	font-weight:200;
}

h1
{
	color:#3c3c3c;
	font-weight:600;
	font-size:87px;
	line-height:74px;
	text-transform:uppercase;
	letter-spacing:-0.06em;
	margin:0px;
	
	small
	{
		line-height:40px;
		font-weight:100;
		font-size:42px;
		text-transform:none;
		letter-spacing:0em;
	}
}

#SkypeButton_Chat_barbarogrouplandtransport_1
{
	display:block;
	margin-top:-35px;
	margin-bottom:16px;
	.opacity(0);
	
	p
	{
		margin:0px;
		a
		{
			display:block;
			
			img
			{
				display:block;
				margin:0px !important;
			}
		}
	}
}

h2
{
	color:#3c3c3c;
	font-weight:800;
	font-size:61px;
	line-height:56px;
	text-transform:uppercase;
	letter-spacing:-0.06em;
	margin:0px;
	
	small
	{
		display:block;
		line-height:40px;
		font-weight:100;
		font-size:42px;
		text-transform:none;
		letter-spacing:0em;
	}
}

a
{
	font:inherit;
	color:inherit;
	
	&:hover
	{
		color:#479ebc;
	}
}

h3
{
	margin:0px;
	margin-bottom:12px;
	
	large
	{
		font-size:26px;
		line-height:27px;
	}
}

hr
{
	display:block;
	height:0px;
	border:none;
	border-top:1px dotted #303030;
}

p
{
	font-size:15px;
	line-height:21px;
	color:#2e2e2e;
	font-family:Arial, Helvetica, sans-serif;
	margin:0px;
	margin-bottom:14px;
}

p.lead
{
	color:#3c3c3c;
	font-size:22px;
	line-height:26px;
	font-family:'tt';
	font-weight:400;
	
	strong
	{
		color:#479ebc;
		font-weight:800;
	}
}

p 
{
	large
	{
		font-size:17px;
		line-height:21px;
	}
}

.well 
{
	background:#f4f4f4;
	padding:16px;
	
	.blue
	{
		color:#59a5c1;
	}
}

.blue
{
	color:#479ebc;
}

fieldset
{
	display:block;
	border:none;
	margin:0px;
	padding:0px;
	
	label
	{
		display:block;
		font-family:Arial, Helvetica, sans-serif;
		line-height:18px;
		font-size:17px;
		color:#5a5a5a;
		padding:4px 0;
	}
}

#contact-rollover
{
	position:fixed;
	top:50%;
	z-index:100;
	margin-top:-190px;
	.transition(all ease-in-out 1s);
	
	*
	{		
		.transition(all ease-in-out 1s);
	}
	
	.trigger
	{
		position:absolute;
		padding-left:18px;
		top:145px;
		left:0px;
		font-size:19px;
		line-height:21px;
		color:#000000;
		font-family:'tt';
		font-weight:600;
		cursor:pointer;
		
		span
		{
			color:#da3839;
			font-size:inherit;
			line-height:inherit;
		}
	}
	
	.box-white
	{
		width:340px;
		height:340px;
		.rotate(-49deg);
		background:#ffffff;
		position:absolute;
		top:53px;
		left:-231px;
		.box-shadow(0px 0px 9px rgba(0,0,0,0.3));
	}
	
	.box-blue
	{
		width:0px;
		height:0px;
		border-top: 180px solid transparent;
		border-bottom: 180px solid transparent;	
		border-left:180px solid rgba(115,179,201,0.60);
		position:absolute;
		top:0px;
		left:0px;
		.rotate(-19.5deg);
	}
	
	.sliding-details
	{
		position: absolute;
		top:250px;
		left:-1000px;
		.transition(all 1s);
		
		p
		{
			display:block;
			padding-left:0px; 
			
			img
			{
				display:block;
			}
			
			large
			{
				display:block;
				margin-left:5px;
			}
		}
	}
}

#contact-rollover.active
{
	top:40%;
	
	.box-blue
	{
		.rotate(-235deg);
	}
	.box-white
	{
		.rotate(-230deg);
		width:680px;
		height:900px;
		left:-234px;
		top:93px;
	}
	
	.sliding-details
	{
		left:20px;
	}
}


#contact-popup
{
	padding:30px;
	
	.padder 
	{
		padding-right:90px;
	}
	
	h2
	{
		font-size:42px;
		font-weight:400;
	}
	
	p
	{
		a
		{
			color:inherit;
			text-decoration:none;
		}
		
		large strong, strong
		{
			font-size:19px;
			line-height:23px;
		}
	}
}

input[type="color"], input[type="email"], input[type="number"], input[type="password"], input[type="tel"], input[type="url"], input[type="text"], textarea, select
{
	.box-sizing(border-box);
	font-size:15px;
	display: block;
	color:#333;
	border:1px solid #dfdfdf;
	background:#f4f4f4;
	.border-radius(4px);
	padding:8px;
	width:100%;
	outline:none;
	resize:none;
	margin:0px;
	margin-bottom:10px;
	.box-shadow(inset 0px 1px 2px rgba(0,0,0,0.3));
	height:39px;
	font-family:Arial, Helvetica, sans-serif;
	.transition(all 0.2s);
	
	&:hover
	{
		border:1px solid #afafaf;
		.box-shadow(inset 0px 1px 2px rgba(0,0,0,0.45));
	}
	
	&:focus
	{
		border:1px solid #999999;
		.box-shadow(inset 0px 1px 6px rgba(0,0,0,0.4));
		background:#f8fdff;
	}
	
}

input[type='submit'], input[type='btn']
{
	text-transform:uppercase;
}

select
{
	cursor:pointer;
}

textarea
{
	height:95px;
}

ul
{
	display:block;
	margin:0px;
	margin-bottom:16px;
	padding:0px;
	list-style:none;
	
	li
	{
		margin-bottom:4px;
		line-height:20px;
		color:#2e2e2e;
		font-family:Arial, Helvetica, sans-serif;
		font-size:15px;
		padding-left:22px;
		background:url(../images/dot-blue.png) no-repeat 3px 5px;
		
		p
		{
			margin:0px;				
			line-height:20px;
			color:#2e2e2e;
			font-size:15px;
		}
		
		p.lead
		{
			margin-bottom:8px;
			font-weight:800;
			font-size:22px;
			line-height:26px;
		}
	}
}

ul.featured-list
{
	margin-bottom:20px;
	li
	{
		padding-left:26px;
		background:url(../images/check-blue.png) no-repeat 4px 9px;
	}
}

ul.nav.nav-inline
{
	display:block;
	margin-bottom:10px;
	
	&:after
	{
		display:block;
		clear:both;
		content:"";
	}
	
	> li
	{
		display:block;
		float:left;
		margin:0px;
		padding:0px;
		float:left;
		background:none;
		margin-left:18px;
		
		&:first-child
		{
			margin-left:0px;
		}
		
		a 
		{
			display:block;
			font-size:15px;
			font-weight:200;
			line-height:17px;
			padding:4px 10px;
			background:#959595;
			color:#fff;
			position:relative;
			font-family:'tt';
			.transition(all 0.2s);
			
			&:after
			{
				display:block;
				content:"";
				position:absolute;
				width:10px;
				top:0px;
				bottom:0px;
				right:-10px;
				background:url(../images/inline-nav-arrow.png) no-repeat;
				background-size:100% 100%;
			}
			
			&:hover
			{
				background:#777777;
			}
			
			&:hover::after
			{
				background-image:url(../images/inline-nav-arrow-hover.png);
			}
		}
		
		a.active
		{
			background-color:#56a7c0;
			
			&:after
			{
				background-image:url(../images/inline-nav-arrow-active.png);
			}
		}
	}
}

.tabs
{
	> div
	{
		display:none;
		
		.content-detail
		{
			display:none;
		}
	}
	
	> div.tab-0
	{
		display:block;
	}
	
	> ul
	{
		display:block;
		padding:0px;
		margin:0px;
		margin-bottom:32px;
		
		&:after 
		{
			display:block;
			clear:both;
			content:'';
		}
		
		li
		{
			float:left;
			padding:0px;
			margin:0px;
			background:none;
			
			a
			{
				color:#36a4d4;
				line-height:16px;
				display:block;
				padding:0 11px;
				font-size:21px;
				font-family:'tt';
				font-weight:200;
				border-left:1px solid #a8a8a8;
				cursor:pointer; 
			}
			
			a.active
			{
				color:#3c3c3c;
			}
			
			&:first-child
			{
				a
				{
					padding-left:0px;
					border-left:0px;
				}
			}
		}
	}
}

.btn
{
	display:inline-block;
	font-size:15px;
	line-height:20px;
	padding:5px 13px;
	background:#56b8db;
	.border-radius(4px);
	cursor:pointer;
	color:#fff;
	border:1px solid #53a7cc;
	text-shadow:1px 1px 0px rgba(0,0,0,0.3);
	.btn-gradient;
	.box-shadow(inset 0px 2px 0px rgba(255,255,255,0.3));
	.transition(all 0.3s);
	font-family:'tt29';
	
	&:hover
	{
		border:1px solid #4397bc;
		.btn-hover-gradient;
		.transition(all 0s);
	}
	
	&:active
	{
		border:1px solid #4397bc;
		.btn-gradient;
		.box-shadow(inset 1px 3px 6px rgba(0,0,0,0.3));		
	}
}

.btn-large
{
	.btn;
	padding:10px 26px;
	font-size:22px;
	line-height:21px;
}

a
{
	text-decoration:none;
	
	img
	{
		border:none;
	}
}

.header
{
	display:block;
	position:relative;
	
	background: #ffffff;
	background: -moz-linear-gradient(top,  #ffffff 0%, #ffffff 71%, #d5d5d5 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(71%,#ffffff), color-stop(100%,#d5d5d5));
	background: -webkit-linear-gradient(top,  #ffffff 0%,#ffffff 71%,#d5d5d5 100%);
	background: -o-linear-gradient(top,  #ffffff 0%,#ffffff 71%,#d5d5d5 100%);
	background: -ms-linear-gradient(top,  #ffffff 0%,#ffffff 71%,#d5d5d5 100%);
	background: linear-gradient(to bottom,  #ffffff 0%,#ffffff 71%,#d5d5d5 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#d5d5d5',GradientType=0 );
	
	&:after
	{
		display:block;
		clear:both;
		content:"";
	}
	
	.container 
	{
		position:relative;
	}
	
	.brand
	{
		display:block;
		font-size:0px;
		float:left;
	}
	
	.phone
	{
		position: absolute;
		font-size:25px;
		line-height:48px;
		display:block;
		bottom:12px;
		right:0px;
		color:#56a7c0;		
		
		img
		{
			display:inline-block;
			vertical-align:middle;
		}
	}
}

.navbar-outer.sticky
{
	position:fixed;
	top:0px;
	left:0px;
	right:0px;
	z-index:500;
}

.navbar-outer
{
	position:relative;
	z-index:1;
	background: #8b8b8b;
	background: -moz-linear-gradient(top,  #8b8b8b 0%, #969696 9%, #858585 51%, #6b6b6b 97%, #686868 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#8b8b8b), color-stop(9%,#969696), color-stop(51%,#858585), color-stop(97%,#6b6b6b), color-stop(100%,#686868));
	background: -webkit-linear-gradient(top,  #8b8b8b 0%,#969696 9%,#858585 51%,#6b6b6b 97%,#686868 100%);
	background: -o-linear-gradient(top,  #8b8b8b 0%,#969696 9%,#858585 51%,#6b6b6b 97%,#686868 100%);
	background: -ms-linear-gradient(top,  #8b8b8b 0%,#969696 9%,#858585 51%,#6b6b6b 97%,#686868 100%);
	background: linear-gradient(to bottom,  #8b8b8b 0%,#969696 9%,#858585 51%,#6b6b6b 97%,#686868 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8b8b8b', endColorstr='#686868',GradientType=0 );
	.box-shadow(0px 2px 5px rgba(0,0,0,0.4));
	
	.navbar
	{
		ul.nav
		{
			margin:0px;
			padding:0px;
			display:block;
			
			&:after
			{
				display:block;
				clear:both;
				content:"";
			}
			
			> li
			{
				padding:0px;
				background:none;
				margin:0px;
				display:block;
				float:left;
				
				> a
				{
					display:block;
					padding:6px 22px;
					line-height:16px;
					font-size:14px;
					color:#fff;
					text-shadow:0px -1px 0px #202020;
					text-transform:uppercase;
					font-weight:bold;
					.transition(all 0.2s);
					font-family:Arial, Helvetica, sans-serif;
					
					img
					{
						display:block;
					}
					
					.single-line
					{
						display:block;
						padding:8px 0;
					}
				}
			}
			
			> li.active, > li:hover
			{				
				> a
				{
					background:#da3839;
					.box-shadow(0px 0px 5px rgba(0,0,0,0.3));
					padding:9px 23px;
					margin:-3px 0;
				}
			}
			
			> li:hover
			{				
				> a
				{
					background:#56a9c1;
				}
			}
						
		}
	}
}

.container 
{
	width:1000px;
	margin:0 auto;
	
	&:after
	{
		display:block;
		clear:both;
		content:"";
	}
}

.sub-header
{
	&:after 
	{
		display:block;
		clear:both;
		content:"";
	}
	
	.go-back
	{
		display:block;
		float:right;
		color:#da3839;
		font-size:17px;
		font-weight:600;
		line-height:25px;
		padding-right:12px;
		background:url(../images/arrow-red-right.png) no-repeat right center;
	}
}

.inner-page
{
	p
	{
		font-size:15px;
		line-height:21px;
	}
	
	.content
	{
		padding-top:75px;
		padding-bottom:30px;
		
		> .container
		{
			padding-bottom:100px;
		}
	}
	
	h2
	{
		font-size:50px;
		font-weight:600;
		margin-bottom:25px;
		margin-top:25px;
	}
}


h1.well,h2.well,h3.well,h4.well,h5.well,h6.well
{
	margin:0px;
	margin-bottom:16px;
	line-height:17px;
	font-size:16px;
	padding:6px 8px;
	.heading-grey-gradient; 
}

ul.accordion
{
	display:block;
	background:none;
	
	> li
	{
		display:block;
		margin:0px;
		background:none;
		padding:0px;
		border-top:1px dotted #989898;
		
		&:first-child
		{
			border-top:none;
		}
		
		&:nth-child(even)
		{
			background:#fbfbfb;
		}
	}
	
	a.trigger
	{
		display:block;
		color:#56a7c0;
		font-size:22px;
		line-height:25px;
		padding:17px 0;
		font-family:'tt';
		font-weight:600;
		
		.icon
		{
			display:block;
			float:right;
			font-size:14px;
			font-family:Arial, Helvetica, sans-serif;
			font-weight:normal;
			background:url(../images/plus-icon.png) no-repeat right center;
			padding-right:27px;
		}
	}
	
	a.trigger.active
	{
		.icon
		{
			background-image:url(../images/less-icon.png);
		}
	}
	
	div.data
	{
		padding-bottom:20px;
	}
}

.thumbnail
{
	display:block;
	padding:2px;
	background:#f3f3f3;
	border:1px solid #e6e6e6;
	.border-radius(2px);
	
	img
	{
		display:block;
		width:100%;
		height:auto;
	}
}

.content
{
	.section
	{
		display:block;
		padding-top:30px;
		padding-bottom:150px;
		margin-top:1px;
		width:100%;
		background:no-repeat 0px center;
		position:relative;
		
		> .container
		{
			padding:60px 0;
			position:relative;
			z-index:15;
		
			> div.expandable
			{
				display:block;
				padding-top:30px;
				width:auto !important;
				float:none !important;
				clear:both;
				text-align:center;
				
				> a
				{
					display:block;
					padding:6px 18px;
					padding-right:50px;
					line-height:20px;
					font-size:18px;
					background:#3a3a3a;
					color:#61c4ef;
					display:inline-block;
					position:relative;
					.border-radius(4px);
					.transition(all 0.2s);
					
					&:after 
					{
						display:block;
						content:"";
						position:absolute;
						top:32px;
						right:0px;
						left:0px;
						background:url(../images/arrow-down.png) no-repeat top center;
						height:12px;
					}
					
					.icon
					{
						display:block;
						margin:0;
						background:#242424 url(../images/expand-icon.png) no-repeat center center;
						position:absolute;
						right:0;
						top:0px;
						bottom:0px;
						width:32px;
						height:32px;
						border-left:1px solid #131715;
						.border-radius(0 4px 4px 0);
					}
					
					&:hover
					{
						background:#444444;
						color:#71d4ff;
						.box-shadow(1px 2px 4px rgba(0,0,0,0.4));
						
						.icon
						{
							background-color:#161616;
						}
					}
				}
			}
		}
	}
			
	> .separator
	{
		display:block;
		width:100%;
		height:100px;
		position:relative;
		background: no-repeat center center;
		z-index:13;
		
	}
			
	> .separator.separator-1-2
	{
		background-image:url(../images/separator-1-2.png);
		height:188px;
		margin-top:-120px;
		margin-bottom:-68px;
	}
			
	> .separator.separator-2-3
	{
		background-image:url(../images/separator-2-3.png);
		height:185px;
		margin-top:-72px;
		margin-bottom:-113px;
	}
			
	> .separator.separator-3-4
	{
		background-image:url(../images/separator-3-4.png);
		height:180px;
		margin-top:-89px;
		margin-bottom:-91px;
	}
			
	> .separator.separator-4-5
	{
		background-image:url(../images/separator-4-5.png);
		height:180px;
		margin-top:-115px;
		margin-bottom:-65px;
	}
			
	> .separator.separator-5-6
	{
		background-image:url(../images/separator-5-6.png);
		height:180px;
		margin-top:-107px;
		margin-bottom:-73px;
	}
			
	> .separator.separator-6-7
	{
		background-image:url(../images/separator-6-7.png);
		height:67px;
		margin-top:-67px;
	}
	
	.section.section-home
	{
		background-image:url(../images/background-home.jpg);
		background-position:50% 100px;
		background-color:#ffffff;
		
		.container
		{
			> div
			{
				float:left;
			}
		}
	}
	
	.section.section-ltrc
	{
		background-image:url(../images/background-ltrc.jpg);
		background-position:50% 100px;
		background-color:#ffffff;
		
		.container
		{
			> div
			{
				float:right;
				width:555px;
			}
		}
	}
	
	.section.section-ivms
	{
		background-image:url(../images/background-ivms.jpg);
		background-position:50% 100px;
		background-color:#dcdcdc;
		
		.container
		{
			> div
			{
				float:left;
				width:555px;
			}
		}
	}
	
	.section.section-ds
	{
		background-image:url(../images/background-ds.jpg);
		background-position:50% 100px;
		background-color:#d5d5d5;
		
		.container
		{
			> div
			{
				float:right;
				width:555px;
			}
		}
	}
	
	.section.section-od
	{
		background-image:url(../images/background-od.jpg);
		background-position:50% 100px;
		background-color:#ffffff;
		
		.container
		{
			> div
			{
				float:left;
				width:555px;
			}
		}
	}
	
	.section.section-bcs
	{
		background-image:url(../images/background-bcs.jpg);
		background-position:50% 100px;
		background-color:#d7d7d7;
		
		.container
		{
			> div
			{
				float:right;
				width:555px;
			}
		}
	}
}

.row
{
	display:block;
	
	&:after
	{
		display:block;
		clear:both;
		content:"";
	}
	
	> div
	{
		width:47%;
		float:right;
	}
	
	> div:first-child
	{
		width:47%;
		float:left;
	}
}

.overlay
{
	display:block;
	position:fixed;
	left:0px;
	top:0px;
	bottom:0px;
	right:0px;
	background:rgba(0,0,0,0.82);
	z-index:999;
}

.overlay-content
{
	position:absolute;
	z-index:1000;
	left:0px;
	top:0px;
	bottom:0px;
	right:0px;	
	
	> div
	{
		display:block;
		width:900px;
		margin:0 auto;
		margin-top:200px;
		background:#fff;
		padding:38px;
	}
}

.accordion
{
	> li
	{
		> a.trigger
		{
			cursor:pointer;
		}
		
		> div.data
		{
			display: none;
		}
	}
}

.footer
{
	.pull-left
	{
		&:after
		{
			display:block;
			content:"";
			clear:both;
		}
		
		
		.navigation
		{
			float:left;
			width:460px;			
			
			ul
			{
				display:block;
				border-right:1px dotted #6e6e6e;
				padding-right:33px;
				
				&:after
				{
					display:block;
					content:"";
					clear:both;
				}
				
				li
				{
					display:block;
					float:left;
					margin:0px;
					margin-bottom:3px;
					width:50%;
					padding:0px;
					background:none;
					
					&:nth-child(odd)
					{
						width:55%;
					}
					
					&:nth-child(even)
					{
						width:45%;
					}
					
					a
					{
						display:block;
						font-size:14px; 
						line-height:18px;
						color:#6e6e6e;
						text-transform:none;
					}
				}
			}
		}
		
		.address
		{
			float:left;
			padding-left:33px;
		}
	}
	
	p
	{
		margin-bottom:0px;
		large
		{
			font-size:14px; 
			line-height:18px;
			color:#6e6e6e;
			text-transform:none;
		}
	}
	
	p.copyright
	{
		display:block;
		clear:left;
		font-size:12px;
		line-height:28px;
		color:#9c9c9c;
		padding-top:8px;
	}
	
	.brand
	{
		img
		{
			display:block;
			height:145px;
			width:auto;
		}
	}
}

/* Form overrides */


/* Photo landing page */

.landing-page
{
	background:url(../images/main-bg.png) center top no-repeat;
	background-size:100% auto;
	.header
	{
		background:none;
		
		.phone
		{
			font-family:Arial, Helvetica, sans-serif;
			font-weight:bold;
			color:#56a7c0;
			font-size:25px;
		}
	}
	
	.banner
	{
		h1
		{
			font-family:'tt';
			font-weight:800;
			font-size:52px;
			color:#45a3c6;
			line-height:49px;
			display:block;
		}
		
		p.lead
		{
			font-size:41px;
			line-height:35px;
			color:#3d3c3c;
			letter-spacing:-0.04em;
			font-weight:100;
			padding-top:4px;	
		}
		
		.left-side
		{
			width:456px;
			float:left;
			padding-top:36px;
			
			.list
			{
				margin-top:17px;
				margin-bottom:28px;
				
				li
				{
					font-size:23px;
					font-family:'tt';
					font-weight:800;
					color:#3c3c3c;
					line-height:34px;
					margin:0;
					padding-left:22px;
				}
			}
			.btn-col
			{
				position:relative;
				
				&:after
				{
					content: " ";
					position: absolute;
					left: -8px;
					right: 17px;
					bottom:-4px;
					background:url(../images/button-shadow.png) no-repeat;
					width:231px;
					height:8px;
					z-index:1;

				}				
			
				.btn
				{
					text-transform:uppercase;
					position:relative;
					z-index:2;
					font-size:32px;
					line-height:31px;
					padding:12px 25px;
					position:relative;
					
					&:hover
					{
						top:-2px;
						color:#fff;
					}
					
				}
			}
		}
		
		.right-side
		{
			float:left;
			width:544px;
			padding-top:36px;
			
			.banner-img
			{
				float:right;
				background:#fff;
				border:1px solid #dfe0e0;
				padding:7px;
				margin-top:10px;
				position:relative;
				
				img
				{
					display:block;
				}
				
				.patch-top
				{
					position:absolute;
					top:-33px;
					right:-41px;
					background:url(../images/banner-img-patch.png) no-repeat;
					width:118px;
					height:97px;
				}
				
				.patch-bottom
				{					
					position:absolute;
					bottom:-33px;
					left:-41px;
					background:url(../images/banner-img-patch-bottom.png) no-repeat;
					width:118px;
					height:97px;
				}
			}
		}
	}
	
	.content
	{
		padding-top:66px;
		
		h2
		{
			font-family:'tt';
			font-weight:800;
			font-size:41px;
			line-height:35px;
			color:#2e2e2e;
			padding-bottom:28px;
			
			small
			{
				font-weight:100;
				display:inline;
			}
		}
		
		.photo-list
		{
			list-style:none;
			display:block;
			float:left;
			padding-bottom:20px;
			margin:0;
			font-size:0px;
			
			li
			{
				float:none;
				display:inline-block;
				padding:0;
				background:0;
				width:25%;
				margin:0px;
				margin-bottom:20px;
				
				
				a
				{
					display:block;
					width:95%;
					height:auto;
					transition:all 0.3s;
					cursor:pointer;
					margin:0 auto;
					position:relative;
					
					span
					{
						padding:73px 0px 77px 0px;
						display:block;
						position:absolute;
						.opacity(0);
						margin-left:14px;
						top:10px;
						left:0px;
						right:21px;
						bottom:3px;
						font-family:'tt';
						font-size:31px;
						text-align:center;
						color:#fff;
						line-height:28px;
						font-weight:100;
						background:rgba(73, 162, 197, 0.9);
						transition:all 0.3s;
					}
					
					&:hover
					{
						
						span
						{
							display:block;
							.opacity(100);
						}
					}
				}
				
				h3
				{
					font-family:'tt';
					font-weight:300;
					font-size:18px;
					line-height:16px;
					color:#3b81a1;
					padding-bottom:8px;
					margin:0;
				}
			}
		}
		.separator
		{
			display: block;
			width: 100%;
			height: 100px;
			position: relative;
			background: no-repeat center center;
			z-index: 13;
		}
		
		.separator.separator-6-7
		{
			background-image:url(../images/separator-6-7.png);
			height:180px;
			margin-top:-30px;
			margin-bottom:-47px;
		}
		
	}
}

/* video page */

.video-page
{
	background:none;
	
	.main-bg
	{
		background:url(../images/video-page-bg.jpg) center top no-repeat;
	}
		
	.banner
	{
		.right-side
		{
			.banner-img
			{
				border:none;
				background:none;
			}
			.mac
			{
				background:url(../images/mac.png) right top no-repeat;
				height:403px;
				padding:20px;
				
				.thumbnail
				{
					padding:0;
					box-shadow:none;
					border:none;
					position:relative;
					background:#000;
					
					img
					{
						opacity:1;
  						filter:alpha(opacity=100); /* For IE8 and earlier */
						transition:all 0.3s;
					}
					.play
					{
						position:absolute;
						background:url(../images/play.png) center center no-repeat;
						width:100%;
						height:100%;
						left:0;
						top:0;
						display:block;
					}
					
					&:hover
					{
						img
						{
							
						opacity:0.6;
  						filter:alpha(opacity=60); /* For IE8 and earlier */
						}
						.play
						{
							background:url(../images/play-hover.png) center center no-repeat;
						}
					}
				}
			}
		}
	}
	
	.content
	{
		margin-top:-83px;
		padding-top:149px;
		.white();
		
		.video-list
		{
			list-style:none;
			margin:0;
			margin-bottom:21px;
			
			li
			{
				display:inline-block;
				vertical-align:top;
				margin-right:20px;
				padding:0;
				background:none;
				
				.thumbnail
				{
					padding:0;
					border:none;
					position:relative;
					background:#000;
					transition:all 0.3s;
					
					
					img
					{
						opacity:1;
  						filter:alpha(opacity=100); /* For IE8 and earlier */
						transition:all 0.3s;
					}
					
					.caption
					{
						background:#000;
						display:block;
						padding:11px 12px 9px 10px;
						
						.heading
						{
							font-family:'tt';
							font-size:17px;
							line-height:16px;
							font-weight:300;
							color:#68a6c3;
							
							small
							{
								display:block;
								font-size:14px;
								line-height:16px;
								color:#9b9b9b;
							}
						}
						
						.time
						{
							font-family:'tt';
							font-size:14px;
							line-height:16px;
							font-weight:300;
							color:#9b9b9b;
						}
					}
					
					.play
					{
						position:absolute;
						background:url(../images/play.png) center center no-repeat;
						width:100%;
						height:100%;
						left:0;
						top:0;
						display:block;
					}
					
					&:hover
					{
						img
						{
							opacity:0.6;
  							filter:alpha(opacity=60); /* For IE8 and earlier */
						}
						.play
						{
							background:url(../images/play-hover.png) center center no-repeat;
						}
					}
				}
			}
			
			li:last-child
			{
				margin:0;
			}
		}
	}
}


/* Gradients */

.btn-gradient
{
	background: #5ec6ec;
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzVlYzZlYyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM0ZWE5Y2EiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(top,  #5ec6ec 0%, #4ea9ca 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5ec6ec), color-stop(100%,#4ea9ca));
	background: -webkit-linear-gradient(top,  #5ec6ec 0%,#4ea9ca 100%);
	background: -o-linear-gradient(top,  #5ec6ec 0%,#4ea9ca 100%);
	background: -ms-linear-gradient(top,  #5ec6ec 0%,#4ea9ca 100%);
	background: linear-gradient(to bottom,  #5ec6ec 0%,#4ea9ca 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5ec6ec', endColorstr='#4ea9ca',GradientType=0 );
}

.btn-hover-gradient
{
	background: #74ceee;
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzc0Y2VlZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM2NWI0ZDEiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(top,  #74ceee 0%, #65b4d1 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#74ceee), color-stop(100%,#65b4d1));
	background: -webkit-linear-gradient(top,  #74ceee 0%,#65b4d1 100%);
	background: -o-linear-gradient(top,  #74ceee 0%,#65b4d1 100%);
	background: -ms-linear-gradient(top,  #74ceee 0%,#65b4d1 100%);
	background: linear-gradient(to bottom,  #74ceee 0%,#65b4d1 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#74ceee', endColorstr='#65b4d1',GradientType=0 );
}

.heading-grey-gradient
{
	background: #f0f0f0;
	background: -moz-linear-gradient(left,  #f0f0f0 0%, #ffffff 63%, #ffffff 100%);
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,#f0f0f0), color-stop(63%,#ffffff), color-stop(100%,#ffffff));
	background: -webkit-linear-gradient(left,  #f0f0f0 0%,#ffffff 63%,#ffffff 100%);
	background: -o-linear-gradient(left,  #f0f0f0 0%,#ffffff 63%,#ffffff 100%);
	background: -ms-linear-gradient(left,  #f0f0f0 0%,#ffffff 63%,#ffffff 100%);
	background: linear-gradient(to right,  #f0f0f0 0%,#ffffff 63%,#ffffff 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f0f0f0', endColorstr='#ffffff',GradientType=1 );
}
a.safe
{
display: block;
margin-top: 30px;

}

.white
{
	background: rgb(221,221,221);
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2RkZGRkZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjE5JSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
background: -moz-linear-gradient(top, rgba(221,221,221,1) 0%, rgba(255,255,255,1) 19%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(221,221,221,1)), color-stop(19%,rgba(255,255,255,1)));
background: -webkit-linear-gradient(top, rgba(221,221,221,1) 0%,rgba(255,255,255,1) 19%);
background: -o-linear-gradient(top, rgba(221,221,221,1) 0%,rgba(255,255,255,1) 19%);
background: -ms-linear-gradient(top, rgba(221,221,221,1) 0%,rgba(255,255,255,1) 19%);
background: linear-gradient(to bottom, rgba(221,221,221,1) 0%,rgba(255,255,255,1) 19%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dddddd', endColorstr='#ffffff',GradientType=0 );
}


