body {	color:rgb(24, 24, 24);	font:300 17px/17px Lato;
	background-color:rgb(255, 255, 255);-webkit-font-smoothing:antialiased;
font-family: Lato;}
a:hover {text-decoration:none}


.work-box:hover img {
    -webkit-transform: scale(1.05);
    transform: scale(1.05, 1.05);
	cursor: pointer;
  }
   .work-box:hover .samples-text 
   { background-color:rgb(197, 201, 202); color:rgba(38, 47, 56, 1); cursor: pointer; }

   .work-box:hover {cursor: pointer;}

  .work-img {
    display: block;
    overflow: hidden;
  }
  
  .work-img img {
    transition: all .2s;
  }

  * {
	margin: 0;
	padding: 0;
  }

  a{
	text-decoration: none;
	outline: none;
}
a:hover, a:focus {
	color: #fff;
}
.subText { color:white; opacity :0.8; text-align:center; 
	font-weight:400;  margin-bottom: 10px; 
	padding:1px;
	line-height: 1em;}
.subText_info { color:white;  opacity:0.8; text-align:center; 
		font-weight:400;  margin-bottom: 20px; 
		padding:20px; font-weight:regular;
		line-height: 1.3em; }
		.subText_infoBox {max-width:1234px; text-align:left; margin-top:25px; }

		.selectedWork { font-family: Lato; color:white; opacity:0.7}

  *,
  *:after,
  *:before {
	box-sizing: border-box;
  }
  
  /* menu button */
  .menuBtn {
	height: 30px;
	width: 30px;
	position: fixed;
	right: 20px;
	top: 10px;
	z-index: 100001;
  }
  .menuBtn > span {
	background-color:rgba(255, 255, 255, .8);
	opacity:0.8;
	border-radius: 1px;
	height: 2px;
	width: 100%;
	position: absolute;
	left: 50%;
	top: 50%;
	margin: -1px 0 0 -15px;
	-webkit-transition: height 100ms;
	transition: height 100ms;
  }
  .menuBtn > span:after,
  .menuBtn > span:before {
	content: '';
	background-color: rgba(255, 255, 255, .8);
	border-radius: 1px;
	height: 2px;
	width: 100%;
	position: absolute;
	left: 50%;
	margin-left: -15px;
	-webkit-transition: all 200ms;
	transition: all 200ms;
  }
  .menuBtn > span:after {
	top: -7px;
  }
  .menuBtn > span:before {
	bottom: -7px;
  }
  .menuBtn.act > span {
	height: 0;
  }
  .menuBtn.act > span:after,
  .menuBtn.act > span:before {
	background-color:rgba(255, 255, 255, .8);
	top: 1px;
	
  }
  .menuBtn.act > span:after {
	-webkit-transform: rotate(45deg);
			transform: rotate(45deg);
  }
  .menuBtn.act > span:before {
	-webkit-transform: rotate(-45deg);
			transform: rotate(-45deg);
  }
  
.myLogo {opacity:0.8;
	float:left; 
	position: relative;
}

  
  /* main menu block */
  .MobileMenu {
	position: absolute;
	left: 0;
	top:63px;
	color:#fff;
	display:none;

  }

  .MobileMenu.act {
	background-color: #000000;
	-webkit-transform: scale(1);
			transform: scale(1);
			height: 100vh;  
			width: 100vw;
			top:63px;
			font-size: 26px;
			color:#858585;;
			display:table;
			text-align: left;
			text-decoration: none;
			font-weight: 400;
			
  }

  .MobileMenuBtn { padding:15px; margin:5px; border-bottom: solid 1px; border-color: rgba(165, 165, 165, 0.5); width:100vw;}

  .MobileMenu.act a {
	color:#858585;;
	display: inline-block;
	text-decoration: none;
  }
  .MobileMenu a :hover {color:#fff; }
 

  .work-box:hover img {
    -webkit-transform: scale(1.05);
    transform: scale(1.05, 1.05);
	cursor: pointer;
  }
   .work-box:hover .samples-text 
   { background-color:rgb(197, 201, 202); color:rgba(38, 47, 56, 1); cursor: pointer; }

   .work-box {position:relative;}

  .work-img {
    display: block;
    overflow: hidden;
  }
  
  .work-img img {
    transition: all .2s;
  }

  .awards_img_contents {border: 1px solid rgb(255, 123, 0);}

  .work-box:hover  h4 {color:rgba(38, 47, 56, 1);cursor: pointer; }

  



.MobileMenuBtn_sm {float:right; color:#858585; font-size: 20px; padding-right:1em}

.sect { transition: all .1s ease-in-out; }
.sect:hover { transform: scale(1.01, 1.01); cursor: pointer; }

/* .container{ padding:0px; margin:0px;} */

a{color:black; text-decoration:none;}
a:hover{color:rgb(0, 0, 0);}
.btn,a,.btn:hover,a:hover {
-webkit-transition: all 0.1s ease-in-out;
-moz-transition: all 0.1s ease-in-out;
-ms-transition: all 0.1s ease-in-out;
-o-transition: all 0.1s ease-in-out;
transition: all 0.1s ease-in-out;
outline: none !important;
}
.navbar-brand {padding:0%;}

h1,h2,h3,h4{margin: 0;line-height: 1em;}
h1{font:700 4em Lato; margin:0.25em 0;text-transform: uppercase;}
h2{font:400 2.5em Lato;}
h3{font:300 2em Lato;}
h4{font:400 1.6em Lato;  margin-bottom:5px; color:rgb(243, 136, 6)}
h4 i{margin-right: 0.5em;}

i {opacity:0.8}
p{font-size:1em; font-weight:400; opacity:0.7;}

.spacer{padding: 6em 0;}

.btn{border:none;border-radius: 0;padding: 1em 3em;background:black;text-transform: uppercase;}
.btn:hover,.btn:active{color: rgb(0, 0, 0);}
.btn-default{color: rgb(255, 255, 255);border: 1px solid rgb(255, 255, 255);}
.btn-default:hover,.btn-default:active{background: rgba(0,0,0,);}
/* .btn-primary{color: rgb(0, 0, 0);background:#000000;width: 100%;outline: none;}
.btn-primary:hover,.btn-primary:active,.btn-primary:focus{background:#000000;box-shadow: none;} */

.btn-me {color: rgb(255, 255, 255);border: 1px solid rgb(255, 255, 255); border-radius:5px; background-color:#010407;  padding: 1em 3em; text-decoration:none;

    margin:10px;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.428571429;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
} 
.btn-me:hover {color: rgb(0,0,0);border: 1px solid rgb(255, 255, 255); background-color:rgb(255, 255, 255);text-decoration:none;} 
.btn-me:active{background: rgba(0,0,0,);text-decoration:none;}


.btn-uxui {color: rgb(255, 255, 255);border: 1px solid rgb(255, 255, 255); border-radius:5px; background-color:rgb(163,54,14);  padding: 1em 3em; text-decoration:none;

    margin:10px;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.428571429;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
} 
.btn-uxui:hover {color: rgb(0,0,0);border: 1px solid rgb(255, 255, 255); background-color:rgb(255, 255, 255);text-decoration:none;} 
.btn-uxui:active{background: rgba(0,0,0,);text-decoration:none;}

.btn-xr {color: rgb(255, 255, 255);border: 1px solid rgb(255, 255, 255); border-radius:5px; background-color:rgb(22, 22, 22);  padding: 1em 3em; text-decoration:none;

    margin:10px;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.428571429;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
} 
.btn-xr:hover {color: rgb(0,0,0);border: 1px solid rgb(255, 255, 255); background-color:rgb(255, 255, 255);text-decoration:none;} 

.btn-xr:active{background: rgba(0,0,0,);text-decoration:none;}

.btn-VFX {color: rgb(255, 255, 255);border: 1px solid rgb(255, 255, 255); border-radius:5px; background-color:rgb(9, 30, 107);  padding: 1em 3em; text-decoration:none;

    margin:10px;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.428571429;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
} 
.btn-VFX:hover {color: rgb(0,0,0);border: 1px solid rgb(255, 255, 255); background-color:rgb(255, 255, 255);text-decoration:none;} 

.btn-VFX:active{background: rgba(0,0,0,);text-decoration:none;}

.btn-conception {color: rgb(255, 255, 255);border: 1px solid rgb(255, 255, 255); border-radius:5px; background-color:rgb(0, 63, 0);  padding: 1em 3em; text-decoration:none;

    margin:10px;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.428571429;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
} 
.btn-conception:hover {color: rgb(0,0,0);border: 1px solid rgb(255, 255, 255); background-color:rgb(255, 255, 255);text-decoration:none;} 

.btn-conception:active{background: rgba(0,0,0,);text-decoration:none;}




.topbar {background:url(../images/lines.png);	height:5px;position: fixed;top: 0;width: 100%;z-index: 1000;}
.navbar-nav > li > a{font-size: 1.1em;line-height: 1.6em;}

.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:hover, .navbar-default .navbar-nav>.active>a:focus{background: none;color: #000000;}

#head,.carousel{margin-top: 0;}

#home{padding-top: 63px; }
.carousel-caption{ bottom:15%; left: 0; right: 0;padding: 0;}
.caption-wrapper{display: table;height: 100%; width: 100%; }
.caption-info{vertical-align: bottom;}
.caption-info .btn i{margin-right:0.75em;}
.carousel-inner > .item > img, .carousel-inner > .item > a > img{width: 100%;}

.carousel-control{z-index:900;}



.logotext {position:relative; float:right; padding-top:63px }




/*about*/
.about.spacer{padding-left: 4em; padding-right: 4em;}
.process ul li{width: 10em;height: 10em;border: 1px solid #000000;padding: 0;border-radius: 50%;margin: 0 1.25em;line-height: 13.5em;color: #000000;}
.process ul li span{line-height: 2em;display: inline-block;font-weight: 300;}
.process ul li span i{font-size: 3em;}
.process ul li span b{display: block;font-size: 1em;font-weight: 300;}




/*works*/

.samples figcaption a{border:1px solid #fff;margin-top: 1em;display: inline-block;color: #fff;padding: 0 2em;}
.samples figcaption a:hover{text-decoration: none;padding: 0 3em;}
.samples-text{width:100%; background-color:rgba(38, 47, 56, 1); padding: 10px 10px 10px 20px; text-align:left; color:rgb(197, 201, 202);}
.samples-text {
	width: 100%;
	position: relative;
  }
  .samples-text:after {
	content: '';
	position: absolute;
	bottom: 0;
	right: 0;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 0 25px 25px;
	border-color: transparent transparent #000000 transparent;
  }

/*works*/

/*team*/
.team figure{width: 100%;}
.team img{width: 100%;}
.team b{font-size: 1.2em;display: block;}
.team a i.fa{color: #fff; font-size: 2em;}
.team a i.fa:hover{color: #21abca;}


.highlight-info{ background:url(../images/lab.jpg) center fixed; background-size: cover; color:#fff;}
.highlight-info .overlay{background: rgba(33,171,202,0.5);}
.highlight-info h4{color: #fff;margin:0.5em 0 0 0;}
/*about us*/


/*contact*/
#contact{background-color: #f5f5f5;}
.contactform textarea,.contactform input{width: 100%;padding:1em;border:1px solid #ccc;margin-bottom: 1em;border-radius: 0;outline: none;}
/*contact*/


.footer{background-color: #111; color: #fff; font-size: 1em;}
.footer a{color: #aaa;margin: 0 1em; }

.gototop{position: fixed;bottom: 20px; right: 20px;background: rgba(0,0,0,0); padding: 15px 6px 7px 12px; color: rgb(104, 104, 104); width:50px; height:50px; border:1px solid rgb(104, 104, 104); 
	border-radius:25px;   transform: rotate(270deg);} 

	.dropbtn {
		background-color: rgb(0, 0, 0);
		color: rgba(255, 255, 255, .8);
		padding: 16px;
		font-size: 20px;
		border: none;
		box-shadow: none;
		outline:none !important;
		margin-top:auto; 
		margin-bottom:auto;
		height:62px;
		font-family:Lato;
		Font-weight:400;

	  }

  .dropdown {
		position: relative;
		display: inline-block;
		margin-top:auto; 
		margin-bottom:auto;
		padding-right:20px;
	  }

  .dropdown-content {
		display: none;
		position: absolute;
		background-color: rgb(0, 0, 0);
		min-width: 160px;
		box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.2);
		z-index: 10000;
		font-family:Lato;
		Font-weight:400;
	    border-left:1px solid #3E3E3E;
	    border-right:1px solid #3E3E3E;
	    border-bottom:1px solid #3E3E3E;
	    border-top:1px solid #3E3E3E;
	  }

  .dropdown-content a {
		color: rgba(255, 255, 255, 0.8);
		padding: 12px 16px;
		text-decoration: none;
		display: block;
		transition: .3s background-color;
	    font-family:Lato;

	  }
	  .column img:hover {opacity: 1; cursor: pointer; 
		-webkit-transform: scale(1);
			transform: scale(1, 1);
			
			border:1px solid white;
		border-radius:10px;
		margin:5px}

		.mySlides img  { border-radius:20px;}
		.column img { border-radius:10px; transform: scale(0.98); border:1px solid grey}
		.column img {margin:5px;}
	  

  .dropdown-content a:hover {background-color: rgb(255, 255, 255); color:rgb(0, 0, 0);}

  .dropdown:hover 
  .dropdown-content {display: block;}

  .dropdown:hover 
  .dropbtn {background-color: rgb(255, 255, 255); color:rgb(0, 0, 0);}
  .dropbtn a {transition: .3s background-color;}
  .dropdown a:focus {outline:none !important; transition: .3s background-color;}
  .dropdown a {transition: .3s background-color;}
.carusel-control.left {background-image:none;}
.carusel-control.right {background-image:none;}

.blackBG {
    background: #000;
    color: #fff
}

.blackBG_grad {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #000), color-stop(16%, #157c16), color-stop(87%, #06ae16), color-stop(100%, #01bf17));
    background: -webkit-linear-gradient(top, #000 0%, #157c16 16%, #06ae16 87%, #01bf17 100%);
    background: linear-gradient(to bottom, #000 0%,   #383838 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=step1, endColorstr=step4, GradientType=0);
}

.orangeBG {
    background: #e06100;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #842e00), color-stop(16%, #9d3100), color-stop(87%, #e06100), color-stop(100%, #ed6d08));
    background: -webkit-linear-gradient(top, #842e00 0%, #9d3100 16%, #e06100 87%, #ed6d08 100%);
    background: linear-gradient(to bottom, #842e00 0%, #9d3100 16%, #e06100 87%, #ed6d08 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=step1, endColorstr=step4, GradientType=0);
    color: #fff;
}

.blueBG {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #042c74), color-stop(16%, #0a439f), color-stop(87%, #0365af), color-stop(100%, #0071b5));
    background: -webkit-linear-gradient(top, #042c74 0%, #0a439f 16%, #0365af 87%, #0071b5 100%);
    background: linear-gradient(to bottom, #042c74 0%, #0a439f 16%, #0365af 87%, #0071b5 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=step1, endColorstr=step4, GradientType=0);
}

.greenBG {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #187315), color-stop(16%, #157c16), color-stop(87%, #06ae16), color-stop(100%, #01bf17));
    background: -webkit-linear-gradient(top, #187315 0%, #157c16 16%, #06ae16 87%, #01bf17 100%);
    background: linear-gradient(to bottom, #187315 0%, #157c16 16%, #06ae16 87%, #01bf17 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=step1, endColorstr=step4, GradientType=0);
}


 .aboutme {position:relative; padding-bottom:10px;  background-image: url("../images/Me2.jpg"); background-repeat: no-repeat;
	background-position:top center;;  background-size: cover;  }












	*{
		margin:0;
		padding:0;
		background:transparent;
	   
	  }
	  
	  
	  
	  .w1 {
		animation: w1anim 10s infinite;
	  }
	  
	  .w2 {
		animation: w2anim 10s infinite;
	  }
	  
	  .w3 {
		animation: w3anim 10s infinite;
	  }
	  
	  .w4 {
		animation: w4anim 10s infinite;
	  }
	  
	  .w5 {
		  animation: w5anim 10s infinite;
	  }
	  
	  
	  
	  @keyframes w1anim {
		0%{
		  opacity: 0;
		}
		5%{
		  opacity: 1;
		}
		15%{
		  opacity: 1;
		}
		20% {
		  opacity:0;
		}
	  }
	  
	  
	  @keyframes w2anim {
		20%{
		  opacity: 0;
		}
		25%{
		  opacity: 1;
		}
		35%{
		  opacity: 1;
		}
		40% {
		  opacity:0;
		}
	  }
	  
	  @keyframes w3anim {
		40%{
		  opacity: 0;
		}
		45%{
		  opacity: 1;
		}
		55%{
		  opacity: 1;
		}
	  
		60% {
		  opacity:0;
		}
	  }
	  
	  @keyframes w4anim {
		60%{
		  opacity: 0;
		}
		65%{
		  opacity: 1;
		}
		75%{
		  opacity: 1;
		}
		80% {
		  opacity:0;
		}
	  }
	  
	  @keyframes w5anim {
		80%{
		  opacity: 0;
		}
		85%{
		  opacity: 1;
		}
		95%{
		  opacity: 1;
		}
		100% {
		  opacity:0;
		}
	  }