@import url(https://fonts.googleapis.com/css?family=Oswald);
@import url(https://fonts.googleapis.com/css?family=Lora:400,700);
/* These selection declarations have to be separate
   No text-shadow: twitter.com/miketaylr/status/12228805301
   Also: hot pink! */
::-moz-selection{ background: #2164A6; color:#fff; text-shadow: none; }
::selection { background:#2164A6; color:#fff; text-shadow: none; }
/* j.mp/webkit-tap-highlight-color */
a:link { -webkit-tap-highlight-color: #2164A6; }
.videocontent {border-color: #333; border-width: 1px; border-style:solid; margin-bottom: 20px;}

.callto { width:100%; background-image: url(../img/bluesquare2.gif);
 
  background-repeat: repeat; padding-bottom:50px; padding-top:50px;    }
.callto h2{ color:#fff; font-family: "Lora", Palatino, "Times New Roman", serif; font-weight:400; padding-top:10px; font-size:140%; text-align:center;}
.callto p{  color:#fff; font-family: "Lora", Palatino, "Times New Roman", serif; font-weight:400; font-size:1.2rem; margin-top:-10px; text-align:center; }
.magrack {background-image:url(../img/graphic.jpg); width:100%; height:500px;}

.header { width:100%; background-color:#fff; padding-bottom:10px; padding-top:10px;    }
.header h2{ color:#143759; font-family: "Lora", Palatino, "Times New Roman", serif; font-weight:400; padding-top:16px; font-size:2.6rem; text-align:right;}
.header h4{ color:#00678C; font-family: "Lora", Palatino, "Times New Roman", serif; font-weight:400; margin-top:-15px; font-size:1.3rem; text-align:right; font-style:italic; }

@media only screen and (max-width: 640px) {
.header h2{ color:#143759; font-family: "Lora", Palatino, "Times New Roman", serif; font-weight:400; padding-top:16px; font-size:2.6rem; text-align:center;}
.header h4{ color:#00678C; font-family: "Lora", Palatino, "Times New Roman", serif; font-weight:400; margin-top:-15px; font-size:1.3rem; text-align:center; font-style:italic; }
}

.header p{  color:#C7494F; font-family: "Lora", Palatino, "Times New Roman", serif; font-weight:400; font-size:1.2rem; margin-top:-10px; }
.large-8 ul
{
    margin:0;
    padding-left:15px;
	padding-bottom:20px;
	
}
	
	.large-8 li {
	font-size:0.85rem;
	list-style-position: outside;
	list-style-type: square;
	text-indent: 0em;
	margin-left: 10px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	padding-left: 0px;
	list-style-image: url(../img/bull.png);
} 

.logo{
	position: absolute;
	z-index: 9999;
	width: 140px;
	height: 183px;
	margin-top:-10px;
	
}

	.btn,
	a.btn {
		display: inline-block;
		padding: 16px 10px;
		margin-bottom:20px;
		font-size: 12px;
		font-weight: 700;
		line-height: 12px;
		letter-spacing: 1px;
		color: #12365A;
		min-width: 140px;
		background:rgba(255, 255, 255, 0);
		border-width:1px;
		border:solid;
		border-color:#12365A;
		text-align: center;
		text-transform: uppercase;
		cursor:pointer;
text-decoration:none;
		transition: 0.9s cubic-bezier(0.18, 1, 0.21, 1);
		-o-transition: 0.9s cubic-bezier(0.18, 1, 0.21, 1);
		-ms-transition: 0.9s cubic-bezier(0.18, 1, 0.21, 1);
		-moz-transition: 0.9s cubic-bezier(0.18, 1, 0.21, 1);
		-webkit-transition: 0.9s cubic-bezier(0.18, 1, 0.21, 1);

		
	}
	
	.btn:hover,
	a.btn:hover {
		background: #12365A;
		border-width:1px;
		border:solid;
		border-color:#12365A;
		color: #fff;
		
	}




	.btn2,
	a.btn2 {
		display: inline-block;
		padding: 16px 10px;
		margin-bottom:20px;
		font-size: 12px;
		font-weight: 700;
		line-height: 12px;
		letter-spacing: 1px;
		color: #fff;
		min-width: 140px;
		background:rgba(255, 255, 255, 0);
		border-width:1px;
		border:solid;
		border-color:#FFF;
		text-align: center;
		text-transform: uppercase;
		cursor:pointer;
text-decoration:none;
		transition: 0.9s cubic-bezier(0.18, 1, 0.21, 1);
		-o-transition: 0.9s cubic-bezier(0.18, 1, 0.21, 1);
		-ms-transition: 0.9s cubic-bezier(0.18, 1, 0.21, 1);
		-moz-transition: 0.9s cubic-bezier(0.18, 1, 0.21, 1);
		-webkit-transition: 0.9s cubic-bezier(0.18, 1, 0.21, 1);

		
	}
	
	.btn2:hover,
	a.btn2:hover {
		background: #fff;
		border-width:1px;
		border:solid;
		border-color:#fff;
		color: #12365A;
		
	}
	
.hero {position:relative; width:100%; height:650px; background-color:#3CF;}

  .gray {
	width:100%;
	padding-top:80px; padding-bottom:60px;
	background-image: url(../img/greysquare.gif);
 
  background-repeat: repeat;
 }
 .gray1 {
	width:100%;
	padding-top:80px; padding-bottom:0px;
	background-image: url(../img/greysquare.gif);
 
  background-repeat: repeat;
 }

 .scroll {
	width:100%;
	padding-top:100px; padding-bottom:100px;
	background-image: url(../img/scroll.jpg);
 background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: cover;
  -moz-background-size: cover;
 }
  
  .whitearea {width:100%;
	padding-top:60px; padding-bottom:40px;}
  
  .subfooter h3{color:#FFF; padding-bottom:20px; font-family: "Lora", Palatino, "Times New Roman", serif; font-weight:400; font-size:1.4rem;}
  .subfooter p{color:#FFF;}
  .subfooter a{
	color:#fff;
}
.subfooter a:hover{
	color:#487D97;
}
  .subfooter {
	width:100%;
	padding-top:80px; padding-bottom:60px;
	background-image: url(../img/bluesquare.gif);
 
  background-repeat: repeat;
 }
  

	 .footer p{color:#FFF; font-size:0.75rem; line-height:1.6;}
	 
	  .footer a{
	color:#fff;
}
  .footer a:hover{
	color:#487D97;
}

    .footer {
	width:100%;
	padding-top:50px; padding-bottom:50px;
	background-image: url(../img/blacksquare.gif);
 
  background-repeat: repeat;}

#menu{
    position: relative;
}
#menu a{
    padding-left: 20px;
}
#menu a:before {
    content: "";
    position: absolute;
    top: 17%;
    left:0px;
    width:24px;
    height:20px;
    border-top: 12px double #fff;
    border-bottom: 4px solid #fff;
}



 .my-sticky-element {width:100%; z-index:9998;}
.my-sticky-element.stuck {
			position:fixed;
			top:0;
			z-index:9998;
		}
  .navbg {
	background-color:#12365A; 
}


.face {width: 34px; height:34px; background-image:url(../img/face.png); background-repeat:no-repeat; float:left; cursor:pointer;
background-position:top;}
.googleplus {width: 34px; height:34px; background-image:url(../img/googleplus.png); background-repeat:no-repeat; float:left; margin-left:8px; cursor:pointer; background-position:top;}
.twitter {width: 34px; height:34px; background-image:url(../img/twitter.png); background-repeat:no-repeat; float:left; margin-left:8px; cursor:pointer; background-position:top;}
.linkedin {width: 34px; height:34px; background-image:url(../img/linked.png); background-repeat:no-repeat; float:left; margin-left:8px; cursor:pointer; background-position:top; }

.face:hover{width: 34px; height:34px; background-image:url(../img/face.png); background-repeat:no-repeat; float:left; cursor:pointer;
background-position:bottom;}
.googleplus:hover{width: 34px; height:34px; background-image:url(../img/googleplus.png); background-repeat:no-repeat; float:left; margin-left:8px; cursor:pointer; background-position:bottom;}
.twitter:hover{width: 34px; height:34px; background-image:url(../img/twitter.png); background-repeat:no-repeat; float:left; margin-left:8px; cursor:pointer; background-position:bottom;}
.linkedin:hover{width: 34px; height:34px; background-image:url(../img/linked.png); background-repeat:no-repeat; float:left; margin-left:8px; cursor:pointer; background-position:bottom; }

.social {float:left; padding-bottom:20px;}




.iso ul, .iso li {
	margin:0;
	padding:0;
	border:0;
	font-size:0;
	font:inherit;
	vertical-align:baseline;
		line-height:1;
	font-size:0
}


.hero--work__list {
	position:absolute;
	z-index:3;
	top:0;
	left:0;
	width:100%;
	height:100%;
	overflow:hidden;
	opacity:0;
	filter:alpha(opacity=0);
	visibility:hidden
}
@media (min-width: 501px) {
.hero--work__list {
-webkit-transition:all 0.5s ease-in 0.5s;
-moz-transition:all 0.5s ease-in 0.5s;
-o-transition:all 0.5s ease-in 0.5s;
transition:all 0.5s ease-in 0.5s
}
}

.hero--work__list.open li,  {
	opacity:1;
	filter:alpha(opacity=100);
	visibility:visible
}
.hero--work__list li {
	display:inline-block;
	zoom:1;
*display:inline;
	vertical-align:top;
	width:33.3333333%;
	height:50%;
	background-repeat:no-repeat;
	background-size:cover;
	background-color:#fff;
	opacity:0;
	filter:alpha(opacity=0);
	visibility:hidden
}
@media (min-width: 501px) {
.hero--work__list li {
-webkit-transition:all 0.3s ease-in;
-moz-transition:all 0.3s ease-in;
-o-transition:all 0.3s ease-in;
transition:all 0.3s ease-in
}
}

@media (max-width: 640px) {
.hero--work__list {
position:relative;
height:auto;
overflow:visible;
overflow-x:hidden;
opacity:1;
filter:alpha(opacity=100);
visibility:visible
}
.hero--work__list li {
height:422px !important;
opacity:1;
filter:alpha(opacity=100);
visibility:visible
}
}
@media (max-width: 400px) {
.hero--work__list li {
height:338px !important
}
}
@media (max-width: 320px) {
.hero--work__list li {
height:270px !important
}
}


.show--grid_view {
	position:relative;
	z-index:3;
	top:0;
	left:0;
	width:100%;
	height:auto;
	overflow:hidden;
	opacity:0;
	filter:alpha(opacity=0);
	visibility:hidden
}
@media (min-width: 501px) {
.show--grid_view {
-webkit-transition:all 0.5s ease-in 0.5s;
-moz-transition:all 0.5s ease-in 0.5s;
-o-transition:all 0.5s ease-in 0.5s;
transition:all 0.5s ease-in 0.5s
}
}
.show--grid_view.open {
	opacity:1;
	filter:alpha(opacity=100);
	visibility:visible
}
@media (min-width: 501px) {
.show--grid_view.open {
-webkit-transition:all 0.5s ease-in;
-moz-transition:all 0.5s ease-in;
-o-transition:all 0.5s ease-in;
transition:all 0.5s ease-in
}
}
.show--grid_view.open li {
	opacity:1;
	filter:alpha(opacity=100);
	visibility:visible
}
.show--grid_view li {
	position:relative;
	display:inline-block;
	zoom:1;
*display:inline;
	vertical-align:top;
	width:33.3333333%;
	height:auto;
	background-repeat:no-repeat;
	background-size:cover;
	background-color:#fff;
	opacity:0;
	filter:alpha(opacity=0);
	visibility:hidden
}
@media (min-width: 501px) {
.show--grid_view li {
-webkit-transition:all 0.3s ease-in;
-moz-transition:all 0.3s ease-in;
-o-transition:all 0.3s ease-in;
transition:all 0.3s ease-in
}
}
.show--grid_view li:nth-child(1) {
-webkit-transition-delay:0.1s;
-moz-transition-delay:0.1s;
transition-delay:0.1s
}
.show--grid_view li:nth-child(2) {
-webkit-transition-delay:0.2s;
-moz-transition-delay:0.2s;
transition-delay:0.2s
}
.show--grid_view li:nth-child(3) {
-webkit-transition-delay:0.3s;
-moz-transition-delay:0.3s;
transition-delay:0.3s
}
.show--grid_view li:nth-child(4) {
-webkit-transition-delay:0.4s;
-moz-transition-delay:0.4s;
transition-delay:0.4s
}
.show--grid_view li:nth-child(5) {
-webkit-transition-delay:0.5s;
-moz-transition-delay:0.5s;
transition-delay:0.5s
}
.show--grid_view li:nth-child(6) {
-webkit-transition-delay:0.6s;
-moz-transition-delay:0.6s;
transition-delay:0.6s
}
.show--grid_view li img {
	position:relative;
	z-index:1;
	display:block;
	width:100%;
	height:auto
}
@media (max-width: 1024px) {
.show--grid_view li, .hero--work__list li {
width:50%;
height:33.33333%
}
}
@media (max-width: 639px) {
.show--grid_view li, .hero--work__list li {
width:100%
}
}
.show--grid_view li a, .hero--work__list li a {
	position:absolute;
	z-index:2;
	top:0;
	left:0;
	display:block;
	width:100%;
	height:100%;
	color:#fff;
	background-color:rgba(0, 163, 177, 0.7);
	font-size:24px;
	text-decoration:none;
	opacity:0;
	filter:alpha(opacity=0);
	visibility:hidden
}
.show--grid_view li a span, .hero--work__list li a span {
	font-family: "Lora", Palatino, "Times New Roman", serif; 
	position:absolute;
	bottom:60px;
	opacity:0;
	filter:alpha(opacity=0);
	visibility:hidden;
	-webkit-transform:translateX(30px);
	-moz-transform:translateX(30px);
	transform:translateX(30px);
	-webkit-transition:all 0.1s ease-in 0.3s;
	-moz-transition:all 0.1s ease-in 0.3s;
	-o-transition:all 0.1s ease-in 0.3s;
	transition:all 0.1s ease-in 0.3s
}
@media (max-width: 500px) {
.show--grid_view li a span, .hero--work__list li a span {
bottom:35px
}
}
.show--grid_view li a span.with_small, .hero--work__list li a span.with_small {
	bottom:90px
}
@media (max-width: 500px) {
.show--grid_view li a span.with_small, .hero--work__list li a span.with_small {
bottom:65px
}
}
.show--grid_view li a small, .hero--work__list li a small {
	
	position:absolute;
	bottom:60px;
	display:block;
	font-size:14px;
	opacity:0;
	filter:alpha(opacity=0);
	visibility:hidden;
	-webkit-transform:translateY(15px) translateX(60px);
	-moz-transform:translateY(15px) translateX(60px);
	transform:translateY(15px) translateX(60px);
	-webkit-transition:all 0.1s ease-in 0.3s;
	-moz-transition:all 0.1s ease-in 0.3s;
	-o-transition:all 0.1s ease-in 0.3s;
	transition:all 0.1s ease-in 0.3s
}
@media (max-width: 500px) {
.show--grid_view li a small, .hero--work__list li a small {
bottom:35px;
-webkit-transform:translateY(15px) translateX(35px);
-moz-transform:translateY(15px) translateX(35px);
transform:translateY(15px) translateX(35px)
}
}
@media (max-width: 1024px) {
.show--grid_view li a, .hero--work__list li a {
visibility:visible
}
}
.show--grid_view li:hover a, .hero--work__list li:hover a {
	opacity:1;
	filter:alpha(opacity=100);
	visibility:visible
}
.show--grid_view li:hover a span, .hero--work__list li:hover a span {
	opacity:1;
	filter:alpha(opacity=100);
	visibility:visible;
	-webkit-transform:translateX(60px);
	-moz-transform:translateX(60px);
	transform:translateX(60px);
	-webkit-transition:all 0.3s ease-in;
	-moz-transition:all 0.3s ease-in;
	-o-transition:all 0.3s ease-in;
	transition:all 0.3s ease-in
}
@media (max-width: 500px) {
.show--grid_view li:hover a span, .hero--work__list li:hover a span {
-webkit-transform:translateX(35px);
-moz-transform:translateX(35px);
transform:translateX(35px)
}
}
.show--grid_view li:hover a small, .hero--work__list li:hover a small {
	opacity:1;
	filter:alpha(opacity=100);
	visibility:visible;
	-webkit-transform:translateY(0px) translateX(60px);
	-moz-transform:translateY(0px) translateX(60px);
	transform:translateY(0px) translateX(60px);
	-webkit-transition:all 0.3s ease-in 0.3s;
	-moz-transition:all 0.3s ease-in 0.3s;
	-o-transition:all 0.3s ease-in 0.3s;
	transition:all 0.3s ease-in 0.3s
}
@media (max-width: 500px) {
.show--grid_view li:hover a small, .hero--work__list li:hover a small {
-webkit-transform:translateY(0px) translateX(35px);
-moz-transform:translateY(0px) translateX(35px);
transform:translateY(0px) translateX(35px)
}
}
.show--grid_view li.to_work, .hero--work__list li.to_work {
	background-color:#32323c
}
.show--grid_view li.to_work a, .hero--work__list li.to_work a {
	opacity:1;
	filter:alpha(opacity=100);
	visibility:visible
}
.show--grid_view li.to_work a span, .show--grid_view li.to_work a small, .hero--work__list li.to_work a span, .hero--work__list li.to_work a small {
	opacity:1;
	filter:alpha(opacity=100);
	visibility:visible;
	-webkit-transform:translateX(60px);
	-moz-transform:translateX(60px);
	transform:translateX(60px)
}
@media (max-width: 500px) {
.show--grid_view li.to_work a span, .show--grid_view li.to_work a small, .hero--work__list li.to_work a span, .hero--work__list li.to_work a small {
-webkit-transform:translateX(35px);
-moz-transform:translateX(35px);
transform:translateX(35px)
}
}
.show--grid_view li.to_work:hover a, .hero--work__list li.to_work:hover a {
	background-color:#ED6F80
}
.about .hero--work__list li a {
	background-color:rgba(50, 50, 60, 0.24)
}