/* Video */
video {
	display:block;
}
video#reel {
	position:fixed;
	right:0;
	bottom:0;
	min-width:100%;
	min-height:100%;
	width:auto;
	height:auto;
	z-index:-100;
	background:url(loop.html) no-repeat;
	background-size:cover;
}
@media screen and (max-device-width:800px) {
	html {
			background:url(loop.html) #000 no-repeat center center fixed;
	}
	#bgvid {
			display:none;
	}
}
.logo {
	z-index:-2;
	width:470px;
	height:110px;
	position:fixed;
	top:30%;
	left:50%;
	margin-left:-235px;
	margin-top: -55px;
}
.scroller {
	z-index:-3;
	width:244px;
	height:68px;
	position:fixed;
	bottom:80px;
	left:50%;
	text-align:center;
	margin-left:-122px;
	/* background:url('../images/arrow.png') center no-repeat;*/
	border:2px solid white;
	cursor:pointer;
	transition:0.1s linear;
	line-height:66px;
	color:white;
	font-size:16px;
	letter-spacing:2px;
	text-transform:uppercase;
}
.scroller:hover {
	background-color:white;
	color: #bbb;
}
/* works */
.works {
	background-color:#fff200;
	height:auto;
	border:1px solid none;
	padding:20px;
	text-align:left;
}
.selected-work {
	
	background-color:#000000;
	height:auto;
	border:1px solid none;
	padding:20px;
	text-align:left;
}
.works-box {
	height:auto;
	width: 285px;
	margin-bottom:0px;
	-webkit-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	-o-user-select:none;
	user-select:none;
	cursor:pointer;
}
.works-box-long {
	height:285px;
	width: 570px;
	margin-bottom:0px;
	-webkit-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	-o-user-select:none;
	user-select:none;
	cursor:pointer;
}
.works-box--inner {
	background:red;
	position:relative;
	color:whitesmoke;
}
.works-box--inner2 {
	height:285px;
	width:570px;
	margin-bottom:0px;
	background:red;
	position:relative;
	color:whitesmoke;
}
.works-box--description {
	opacity:0;
	background:#e61f68;
	height:100%;
	position:absolute;
	top:0px;
	transition:0.3s cubic-bezier(0,.5,.5,1);
}
.works-box--inner:hover .works-box--description {
	opacity:1;
}
.works-box--inner2:hover .works-box--description {
	opacity:1;

}
.title {
	text-align:left;
	font-weight:700;
	text-transform:uppercase;
	font-size:26px;
	line-height:26px;
	margin-left:8%;
	margin-top:8%;
}
.subtitle {
	text-align:left;
	font-weight:400;
	font-size:14px;
	margin-left:8%;
}
.tag {
	position:absolute;
	bottom:20px;
	left:8%;
		font-weight:400;
	font-size:14px;
}
.works img {
	width:100%;
}
.works-more {
	background-color:white;
	margin:auto;
	width:245px;
	height:68px;
	line-height:70px;
	font-size:24px;
	text-align:center;
	color:#bbbbbb;
	transition:0.3s cubic-bezier(0,.5,.5,1);
	margin-top:10px;
	-webkit-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	-o-user-select:none;
	user-select:none;
	cursor:pointer;
}
.works-more:hover {
	background-color:#e61f68;
	color:white;
	cursor:pointer;
}
.works-more--opened {
	display: none;
}
/* banner */
.banner {
	height:300px;
	background:url("../assets/images/banner.jpg") no-repeat;
	background-size: cover;
}
/* about */
.about {
	background-color:#e61f68;
	height:auto;
	border:1px solid none;
	padding:20px;
	text-align:left;
	font-size:24px;
}
.about-title {
	color:#ffffff;
	font-size:40px;
	font-weight: 800;
	padding-bottom:50px;
	text-transform:uppercase;

}
.about-box {
	color:#ffffff;
	font-size:16px;
	line-height:30px;
	text-align:justify;
	padding-right: 50px;
}
/* contact */
.contact {
	background-color:#ffffff;
	height:auto;
	border:1px solid none;
	padding:20px;
	text-align:left;
	font-size:24px;
}
.contact-title {
	color:#fff;
	font-size:40px;
	font-weight: 800;
	padding-bottom:50px;
	padding-top:30px;
	text-transform:uppercase;
}
.contact-text {
	color:#fff;
	font-size:17px;
	line-height:12px;
	padding-bottom:50px;
	padding-top:10px;
}
.contact-box {
	-webkit-user-select:none;
	/* Chrome all / Safari all */
	-moz-user-select:none;
	/* Firefox all */
	-ms-user-select:none;
	/* IE 10+*/
	/* No support for these yet,use at own risk */
	-o-user-select:none;
	user-select:none;
		height:250px;
		width: 22%;
}
.contact-stamp {
	transition:0.1s linear;
	position:relative;
	top:10px;
	margin:15px;
}
.contact-stamp:hover {
	opacity:0.7;
	cursor:pointer;
}
.youtube {
	height:120px;
	width:240px;
	border-radius:0px;
	background:url("../assets/images/youtube.png") no-repeat center;
}
.mail {
	height: 120px;
	width:240px;
	border-radius:0px;
	background: url("../assets/images/mail.png") no-repeat center;
	background-size: cover;
}
.linkedin {
	height:120px;
	width:240px;
	border-radius:0px;
	background: url("../assets/images/linkedin.png") no-repeat center;
}
.tumblr {
	height:120px;
	width:240px;
	border-radius:0px;
	background: url("../assets/images/tumblr.png") no-repeat center;
}
/* social */
.social {
	background-color:#45b645;
	height:auto;
	border:1px solid none;
	padding:40px;
	text-align:left;
	font-size:24px;
}
.social-box {
	font-size:24px;
	line-height: 44px;
}
/* map */
.map {

	font-weight:400;
	background-color:#2a2a2a;
	color:#777777;
	height:auto;
	border:1px solid none;
	padding:20px;
	text-align:left;
	height:88px;
	font-size:15px;
	text-align:center;
	line-height:88px;
	
}

}
@media (max-width:768px) {
	.logo {
		z-index:-2;
		width:320px;
		height:110px;
		position:fixed;
		top:46%;
		left:50%;
		margin-left:-160px;
		margin-top:-55px;
	}
	.menu li {
		width:auto;
		float:right;
		margin-left:16px;
	}
	.about-title,.contact-title {
		text-align:center;
	}
	.about-box {
		size:50%;
		font-size:16px;
		line-height:30px;
		text-align:justify;
		padding-right:25px;
		margin-bottom:40px;
	}
	.mail {
			width:120px;
			height:120px;
			border-radius:0px;
			background-size:100%;
	}
	.youtube {
			width:120px;
			height:120px;
			border-radius:0px;
			background-size:100%;
	}
	.linkedin {
			width:120px;
			height:120px;
			border-radius:0px;
			background-size:100%;
	}
	.tumblr {
			width:120px;
			height:120px;
			border-radius:0px;
			background-size:100%;
	}

}
@media (max-width:482px) {
	.menu {
			margin-top: -35px;
			font-size: 14px;
	}
}