/* CSS Document */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, 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, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
center, u, b, i {
margin: 0px;
padding: 0px;
border: 0px none;
font-family:'HammersmithOne';
font-style: inherit;
font-weight: inherit;
line-height: inherit;
font-size-adjust: inherit;
font-stretch: inherit;
font-feature-settings: inherit;
font-language-override: inherit;
font-kerning: inherit;
font-synthesis: inherit;
font-variant: inherit;
font-size: 100%;
vertical-align: baseline;
outline: 0;
list-style:inherit;
list-style-position: inside;
}
article,aside,details,figcaption,figure,footer,header,hgroup,nav,section{display:block;}



@font-face {
    font-family: 'HammersmithOne';
    src:url('../fonts/HammersmithOne.eot');
    src: url('../fonts/HammersmithOne.eot?#iefix') format('embedded-opentype'),
         url('../fonts/HammersmithOne.woff') format('woff'),
         url('../fonts/HammersmithOne.ttf') format('truetype'),
         url('../fonts/HammersmithOne.svg#') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'PTSans';
    src: url('../fonts/PTSans.eot');
    src: url('../fonts/PTSans.eot?#iefix') format('embedded-opentype'),
         url('../fonts/PTSans.woff') format('woff'),
         url('../fonts/PTSans.ttf') format('truetype'),
         url('../fonts/PTSans.svg#PTSans') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'PTSans-Bold';
    src: url('../fonts/PTSans-Bold.eot');
    src: url('../fonts/PTSans-Bold.eot?#iefix') format('embedded-opentype'),
         url('../fonts/PTSans-Bold.woff') format('woff'),
         url('../fonts/PTSans-Bold.ttf') format('truetype'),
         url('../fonts/PTSans-Bold.svg#PTSans-Bold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'FuturaStd-Light';
    src: url('../fonts/FuturaStd-Light.eot');
    src: url('../fonts/FuturaStd-Light.eot?#iefix') format('embedded-opentype'),
         url('../fonts/FuturaStd-Light.woff') format('woff'),
         url('../fonts/FuturaStd-Light.ttf') format('truetype'),
         url('../fonts/FuturaStd-Light.svg#FuturaStd-Light') format('svg');
    font-weight: normal;
    font-style: normal;
}

p, ul, li, div{
	font-family: 'HammersmithOne', Arial, Helvetica, sans-serif;
        text-align: inherit;
	}
i{font-style:italic;}
p{margin-top:1%; margin-bottom:1%;}
ol {display: block; list-style-type: decimal;}
strong, b{	font-family:'HammersmithOne-Bold', Arial, Helvetica, sans-serif;}
a{text-decoration:underline; color:#2CB8D1;}
::selection {
background:#84B4B9;
color:#FFF;
}

::-moz-selection {
background:#84B4B9;
color:#FFF;
}

::-webkit-selection {
background:#84B4B9;
color:#FFF;
}
figcaption{font-family: 'HammersmithOne', Arial, Helvetica, sans-serif; font-size:0.8em; line-height: 1em; color:#333; font-style:italic;}
/**end general tags**/
body{
	width:100%;
	height:100%;
	margin:0;
	padding:0;
	}
.clearing {
  width: auto;
  height: auto;
  display:block;
  clear: both;
}
.container-fluid{
	padding-left:0!important;
	padding-right: 0!important;
}
/*particles*/

canvas{
  display:block;
  vertical-align:top;
	top:0!important;
	position: absolute;
	width: 100%;
  height: 100%;
	overflow: hidden;
	
}


.js-count-particles{
  font-size: 1.1em;
}

#stats,
.count-particles{
  -webkit-user-select: none;
  margin-top: 5px;
  margin-left: 5px;
}

#stats{
  border-radius: 3px 3px 0 0;
  overflow: hidden;
}

.count-particles{
  border-radius: 0 0 3px 3px;
}


/* ---- particles.js container ---- */

#particles-js{
  width: 100%;
  height: 100%;
  background-image: url('');
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;
}
.Lyhd{
	float:left;
	display:block;
	height:auto;
	overflow:hidden;
}
.Lypheader{
	background:rgba(235, 93, 91, 0.9);
	text-transform: uppercase;
	color:#FFF;
	font-family: 'HammersmithOne', Arial, Helvetica, sans-serif;
}
.LyNav{
	display:inline-block;
	float:right!important;
	margin-right:50px!important;
}
.LyNav > li{
	color:#FFF;
	text-align: right!important;
}
.LyNav > li > a{
	color:#FFF;
	font-size:1em;
	line-height:1.1em;
	padding-top:20px!important;
	padding-bottom: 2px!important;
}
.LyNav > li > a:hover{
	color:#FFF;
	border-bottom:3px solid #FFF;
	background:none!important;
	transition: all  0.5s ease;
	-webkit-transition: all  0.5s ease;
	-moz-transition: all  0.5s ease;
}
.Lybrand{
    background-image:url('../images/lyBrandWh@2x.png');
    height:60px;
    width:80px;
    background-repeat: no-repeat;
    background-size: 100%;
    display:block;
    position: relative;
    float:left;
    margin-left:40px;
}
#LyWrpFullHm{
	width:100%;
	height:auto;
	display:block;
	padding-top:20%;
	text-align: center;
	float:left;
}
.LyFullBr{
	width:100%;
	height:auto;
	display:block;
	margin:0 auto;
	z-index:1;
	overflow: hidden;
	position: relative;
}
.LyBrnBg{
	background-image:url('../images/LybgBrand@2x.png');
    max-width:350px;
	max-height:350px;
	min-width:350px;
	min-height:250px;
	display:block;
	margin: 0 auto;
	overflow: hidden;
    background-repeat: no-repeat;
    background-size: 100%;
    display:block;
    position: relative;
	z-index: 9;
}
.icon-bar{background:#FFF;}
.desinr{
	width:100%;
	height:auto;
	display: block;
	padding:20px 10px;
	float: left;
}
.desinr h1{
	text-align:center;
	font-family:'FuturaStd-Light', Arial, Helvetica, sans-serif;
	font-size:1.7em;
	color:#1E2F38;
	letter-spacing:8px;
	font-weight:700;
}
.LygRphNaV{
	width:100%;
	height:auto;
	display: block;
	padding:20px 10px;
	float: left;
	background:rgba(255,255,255,0.8);
	overflow:hidden;
	z-index: 999;
}
.LyNaVGrp{
	list-style: none;
	z-index:2;
	width:100%;
	height:auto;
	display:block;
	float:left;
	text-align: center;
}
.LyNaVGrp li{
	display:inline-block;
	min-width:200px;
	max-width:300px;
	height:auto; 
	overflow:hidden;
	padding:20px 30px;
}
.LyNaVGrp li a{
	font-family:'FuturaStd-Light', Arial, Helvetica, sans-serif;
	font-size:1.5em;
	color:#EB5D5B;
	line-height:1.5em;
	text-align: center;
	padding:10px;
	text-transform: uppercase;
	font-weight:600;
}
.LyNaVGrp li a:hover{
	color:#1E2F38;transition: all  0.5s ease;
	-webkit-transition: all  0.5s ease;
	-moz-transition: all  0.5s ease;
}

.AboutIcn, .ProjectsIcn, .ContactIcn{
	width:40px;
	height:40px;
	float: left;
	display:block;
	overflow:hidden;
	background-image:url(../images/LySprite@2x.png);
	background-repeat: no-repeat;
}
.AboutIcn{background-position:-18px -18px;}
.ProjectsIcn{background-position:-118px -18px;}
.ContactIcn{background-position:-214px -17px;}

.LyNaVGrp li a:hover .AboutIcn{background-position:-392px -105px;}
.LyNaVGrp li a:hover .ProjectsIcn{background-position:-471px -105px;}
.LyNaVGrp li a:hover .ContactIcn{background-position:-550px -105px;}

.lineTitle{
	width:100px; height:3px; background-color:#EB5D5B; margin:0 auto; float:none; padding-top:10px; display:block;
}
.LyNavHome{display:none;}

.homeWrap{
	min-height: 100vh;
	overflow:hidden;
}
#about{
	width:100%;
	height:auto;
	min-height:90vh;
	display:block;
	background-color:rgba(255,255,255,1);
	float:left;
	margin-top:90px;
	z-index:1;
	padding-top:20px;
	position:relative;
}
.homeTitle{
	width:100%;
	height:auto; display:block;
	float:left; text-align:center;
}

.homeTitle h1{
	font-family: 'HammersmithOne', Arial, Helvetica, sans-serif;
	font-size:2.8em;
	line-height:1.5;
	color:#EB5D5B;
	text-transform: uppercase;
}

.homeTitle b{
	font-family: 'FuturaStd-Light', Arial, Helvetica, sans-serif;
	font-size:1.3em;
	line-height:1.5;
	color:#EB5D5B;
	text-transform: uppercase;
	text-align: center;
}

.AboutIcnBGh, .ProjectsIcnBGh, .ContactIcnBGh{
	width:60px;
	height:60px;
	float:none;
	margin:0 auto;
	text-align: center;
	display:block;
	overflow:hidden;
	background-image:url(../images/LySprite@2x.png);
	background-repeat: no-repeat;
	margin-top:20px;
}
.AboutIcnBGh{background-position:-303px -17px;}
.ProjectsIcnBGh{background-position:-405px -17px;}
.ContactIcnBGh{background-position:-501px -17px;}
.IntrWrap{
	width:100%;
	height:auto;
	display:block;
	float:left;
	padding:30px 0px;
	position:relative;
	margin-top:40px;
}
.backpnk{
	width:50%;
	height:40vh;
	display:block;
	float:left;
	background-color:#EB5D5B;
}
.WraptxtIntro{
	width: 85%;
	min-height:20vh;
	display:block;
	float:right;
	right:0;
	position:relative;
	margin-top:-300px;
	background-color:#FFF;
	box-shadow:1px 1px 1px 1px #CCC;
	padding:20px;
}
.TxtIntr{
	width:90%;
	height:auto;
	float:right;
}

.TxtIntr h1{
	font-family: 'HammersmithOne', Arial, Helvetica, sans-serif;
	font-size:1.6em;
	color:#333;
	letter-spacing:1px;
}
.TxtIntr p{
	font-family: 'PTSans', Arial, Helvetica, sans-serif;
	font-size:1em;
	color:#666;
	line-height:1.5em;
	text-align: left;
}
.prtaitLysp{
	width:220px;
	height:220px;
	display:block;
	float:left;
	position:absolute;
	z-index:2;
	left:-13.5%;
	background-image:url(../images/MePortait.png);
	background-repeat: no-repeat;
	background-size: 100%;
	top:70px;
}

#projects{
	width:100%;
	height:auto;
	/*min-height:90vh;*/
	display:block;
	background-color:rgba(255,255,255,1);
	float:left;
	margin-top:90px;
	z-index:1;
	padding-top:20px;
	overflow:hidden;
	position:relative;
}

.ProjWrap{
	width:100%;
	height:auto; 
	display:block;
	float:left;
	padding:50px 0px;
	position:relative;
	margin-top:40px;
}
.hmImgs{
	width:100%; height:auto; display:block; margin:0 auto; overflow:hidden;
}
.hmImgs img{width:100%;}
.TxtProRight{
	width:100%;
	height:auto;
	display:block;
	float:left;
	padding:90px 20px 20px 20px;
	overflow:hidden;
	text-align:right;
	vertical-align: middle;
}

.TxtProLeft{
	width:100%;
	height:auto;
	display:block;
	float:left;
	padding:60px 20px 20px 20px;
	overflow:hidden;
	text-align:left;
}

.TxtProLeft h2, .TxtProRight h2{
	text-align:inherit;
	font-family: 'PTSans-Bold', Arial, Helvetica, sans-serif;
	font-size:46px;
	line-height:1.3em;
	color:#333;
}
.TxtProLeft h3, .TxtProRight h3{
	text-align:inherit;
	font-family: 'HammersmithOne', Arial, Helvetica, sans-serif;
	font-size:1.25em;
	line-height:1.6em;
	color:#666;
}

.TxtProLeft h3 strong, .TxtProRight h3 strong{
	color:#000;
}

.TxtProLeft p, .TxtProRight p{
	font-family: 'PTSans', Arial, Helvetica, sans-serif;
	font-size:18px;
	color:#666;
	line-height:32px;
}
.CaseStudyBtn{
	border: 1px solid #EB5D5B;
    border-radius: 50px;
    font-size: 1.3em;
    line-height: 1em;
    color: #EB5D5B;
    padding: 17px 38px 19px 38px;
    display: inline-block;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
	margin:20px 10px;
}

.CaseStudyBtn:hover{
	background-color:#EB5D5B;
	color:#FFF;
	box-shadow:1px 1px 2px 2px #CCC;
}
.CaseDefault{
	border: 1px solid #ccc;
    border-radius: 50px;
    font-size: 1.3em;
    line-height: 1em;
    color: #ccc;
    padding: 17px 38px 19px 38px;
    display: inline-block;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
	margin:20px 10px;
}


.AnmBox{
	opacity: 0;
  -moz-transition: all 700ms ease-out;
  -webkit-transition: all 700ms ease-out;
  -o-transition: all 700ms ease-out;
  transition: all 700ms ease-out;
  -moz-transform: translate3d(0px, 200px, 0px);
  -webkit-transform: translate3d(0px, 200px, 0px);
  -o-transform: translate(0px, 200px);
  -ms-transform: translate(0px, 200px);
  transform: translate3d(0px, 200, 0px);
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;
 }

 .bounce-up  {
  opacity: 0;
  -moz-transition: all 700ms ease-out;
  -webkit-transition: all 700ms ease-out;
  -o-transition: all 700ms ease-out;
  transition: all 700ms ease-out;
  -moz-transform: translate3d(0px, 200px, 0px);
  -webkit-transform: translate3d(0px, 200px, 0px);
  -o-transform: translate(0px, 200px);
  -ms-transform: translate(0px, 200px);
  transform: translate3d(0px, 200, 0px);
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;
}

.bounce-up.in-view {
  opacity: 1;
  -moz-transform: translate3d(0px, 0px, 0px);
  -webkit-transform: translate3d(0px, 0px, 0px);
  -o-transform: translate(0px, 0px);
  -ms-transform: translate(0px, 0px);
  transform: translate3d(0px, 0px, 0px);
}
.gryBc{	background:#FBFBFB;}
#footer{
	width:100%;
	height:auto;
	display:block;
	float:left;
	background-color:#FBFBFB;
	border-top:1px solid #CCC;
}
.footerWrap{
	width:100%;
	height:auto;
	display:block;
	padding:30px 20px;
}
.footerTitle h3{
	font-family: 'HammersmithOne', Arial, Helvetica, sans-serif;
	font-size:1.25em;
	text-align: center;
	color:#575756;
	letter-spacing: 1px;
	text-transform: uppercase;
}
.footerCntnt{
	width:100%;
	height:auto;
	display:block;
	float: left;
}
.footerLysp{
	width: 180px;
	height: 80px;
	display:block;
	float:left;
	background-image:url(../images/LySprite@2x.png);
	background-repeat:no-repeat;
	background-position:-169px -80px;
}
.footerTxt{
	width:100%;
	height:auto;
	display:block;
	float: left;
	text-align: center;
}
.footerTxt h3{
	font-family: 'PTSans', Arial, Helvetica, sans-serif;
	font-size:1.2em;
	line-height: 1.2em;
	color:#555555;
	font-weight:700;
}
.footerTxt a{
	font-family: 'PTSans', Arial, Helvetica, sans-serif;
	font-size:1em;
	line-height:1em;
	color:#EB5D5B;
	text-decoration: underline;
}
.footerTxt a:hover{
	color:#1E2F38;
	-webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
.footerRrss{
	width:100%;
	height:auto;
	display:block;
	float: right;
	padding:20px;
	text-align: right;
}
.TwIcn, .LinKIcn{
	width:40px;
	height:40px;
	margin:10px 20px;
	display:inline-block;
	background-image: url('../images/LySprite@2x.png');
	background-repeat: no-repeat;
	overflow:hidden;
}
.TwIcn{background-position:-25px -111px;}
.LinKIcn{background-position:-88px -111px;}

.headerTp{
	width:100%;
	height:250px;
	display:block;
	float:left;
	margin:0;
	padding:0;
	overflow: hidden;
}
.headerTp img{width:100%;}
.topMargin{margin-top:80px;}
.imgCols img{width:100%; -webkit-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.39);
-moz-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.39);
box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.39);}

.volta {
    border: 1px solid #EB5D5B;
    border-radius:50px;
    font-size:2em;
    line-height:12px;
    color: #FFF;
	background:#EB5D5B;
    padding: 20px;
    display: inline-block;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    margin: 20px 10px;
	position:fixed;
	top:40%;
}
.textBoxCnt{
	width:80%;
	display:block;
	margin:0 auto;
	text-align: left;
}
#FullBoxImg{
	width:100%;
	display:block;
	position: relative;
	margin:10px 0px;
	padding:0px;
	float:left;
}
#FullBoxImg img{
	width:100%;
}
.BoxImg{
	width:100%;
	display:block;
	position: relative;
	margin:10px 0px;
	padding:0px;
	float:left;
}
.BoxImg img{
	width:100%;
}
.Boxvideo{
	width:100%;
	display:block;
	position: relative;
	margin:10px 0px;
	padding:0px;
	float:left;
}

.GotoProjectBtn{
	border: 1px solid #EB5D5B;
    border-radius: 50px;
    font-size: 1.3em;
    line-height: 1em;
    color: #FFFFFF;
	background:#EB5D5B;
    padding: 17px 38px 19px 38px;
    display: inline-block;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
	margin:20px 10px;
}
.GotoProjectBtn:hover{
	color:#EB5D5B;
	background:#FFFFFF;
}

/**MediaQuery**/

@media only screen and (max-width:1200px){
	.prtaitLysp{left:-20%;}
	.WraptxtIntro{width:75%;}
}
@media only screen and (max-width:980px){
	.backpnk{width:60%;}
	.prtaitLysp{width:180px; height:180px;}
	.LyNaVGrp li {max-width:160px; padding:20px 10px;}
	.ProjWrap{margin-top:20px; padding:30px 0;}
	#projects{margin-top:50px;}
	.hmImgs{float:left;}
	.footerRrss{text-align:center;}
	.footerLysp{ float: none; margin: 0 auto; margin-top: 20px; margin-bottom: 20px;}
}


@media only screen and (max-width:768px){
	.WraptxtIntro{width:90%;}
	.backpnk{width:80%; height:100px;}
	.prtaitLysp{position:relative; width:150px; height:150px; top:20px; left:35%; margin-bottom:20px;}
	.TxtIntr{width:100%;}
	.IntrWrap{margin-top:20px; padding-top:20px;}
	.LyNaVGrp li{min-width:100%; }
	.AboutIcn, .ProjectsIcn, .ContactIcn{float:none; display:inline-block; margin:0px 20px; padding-top:10px;}
	.LyNaVGrp li a {line-height:1em; display:inline-block;}
	.WraptxtIntro{position:relative; top:-4em;}
	#projects{margin-top:10px;}
	}


@media only screen and (max-width:600px){

}

@media only screen and (max-width:480px){
	.prtaitLysp{left:22.5%;}
	.LyBrnBg{ max-width: 300px; max-height: 300px; min-width: 200px; min-height:250px;}
}

@media only screen and (max-width:360px){
	.LyBrnBg{ max-width:250px; max-height: 300px; min-width: 200px; min-height:180px;}
	.prtaitLysp{left:15%;}
}