
/*
	Color: rgb(255,90,95)
*/

/**********************/
/*	   BAR STYLING	  */
/**********************/

.bar{
	display:none;
	
	z-index:1;
	position:fixed;
	top:0px; left:0px; right:0px;
  	pointer-events: none;
}
.bar .logo{
	float:left;
	padding:25px 30px;
}
.bar a:link,
.bar a:visited{
  	pointer-events: auto;
	
	display:block;
	float:right;
	margin:20px 25px;
	padding:12px 15px;
	
	color:#FFF;
	background:none;
	border:2px solid rgba(255,255,255,1);
	border-radius:100px;
	
	font-size:12px;
	text-decoration:none;
	text-transform:uppercase;
	
	transition:all .3s ease;
}
.bar a:hover,
.bar a:active{
	color:rgb(255,90,95);
	background:#FFF;
}


/**********************/
/*	  PAGE STYLING	  */
/**********************/


.page{
	position:relative;
	top:50%;
	margin-top:-50px;
}
.page .logo-main{
	width:80%;
	max-width:314px;
}
.page__section a:link,
.page__section a:visited{
	display:inline-block;
	
	font-size:12px;
	font-family:Gotham-Bold;
	text-transform:uppercase;
	text-decoration:none;
	
	padding:3px;
	margin-top:15px;
	
	/*color:rgba(255,255,255,0.7);
	border-bottom:1px solid rgba(255,255,255,0.3);*/
	
	padding:5px 10px;
	
	color:rgba(255,255,255,0.9);
	background:rgba(0,0,0,0.1);
	border:none;
	border-bottom:3px solid rgba(0,0,0,0.07);
	border-radius:3px;
	
	transition:all .3s ease;
}
.page__section a:hover,
.page__section a:active{
	/*color:rgba(255,255,255,1);
	border-color:rgba(255,255,255,0.7);*/
	color:rgba(255,255,255,1);
	background:rgba(0,0,0,0.3);
}


.page__section{
	position:relative;
	margin-bottom:300px;
}
.page__section:after{
	content:'';
	position:absolute;
	
	background:url("../img/split.png") no-repeat center center;
	
	bottom:-200px; left:50%;
	width:10px; height:100px;
	margin-left:-5px;
	opacity:0.3;
}
.page__section--final:after{
	background:none !important;
}

.page p{
	font-size:18px;
	line-height:30px;
	
	color:rgba(255,255,255,0.9);
	
	width:90%;
	max-width:500px;
	margin:auto;
}
.page h1{
	font-family:Gotham-Thin;
	font-size:35px;
	line-height:45px;
	padding:12px 30px;
	
	text-transform:uppercase;
	
	color:rgb(255,90,95);
	background:#FFF;
	border-radius:4px;
	
	display:inline-block;
}
.page h2{
	font-family:Gotham-Thin;
	font-weight:normal;
	font-size:100px;
	padding:12px 30px;
	margin:auto;
	margin-bottom:20px;
}
.page h1 b,
.page h2 b{
	font-family:Gotham-Black;
}

.product {
	display:inline-block;
	width:107px;
	margin:10px;
	margin-top:30px;
	
	font-family:Gotham-Bold;
	
	color:#FFF;
	font-size:11px;
	line-height:14px;
	text-transform:uppercase;
}
.product IMG{
	display:block;
	margin-bottom:5px;
}



/**********************/
/*	  REQUEST FORM 	  */
/**********************/

.form{
	width:90%;
	max-width:500px;
	margin:auto;
}
.form IMG{
	margin-bottom:20px;
}

.input{
	display:block;
	
	width:100%;
	
	padding:10px;
	padding-left:10px;
	
	margin:auto;
	margin-bottom:15px;
	
	font-size:13px;
	line-height:16px;
	box-sizing:border-box;
	height:36px;
	font-family:Gotham-Book;
	
	color:rgba(0,0,0,0.7);
	background:#FFF;
	background-repeat:no-repeat;
	background-position:-30px 3px;
	border:none;
	outline:none;
	border-radius:3px;
	
	transition:all .3s ease;
	
	
	padding-left:45px;
	background-position:3px 3px;
}
.input:hover,
.input:focus/*,
.input:valid*/{
	color:rgba(0,0,0,0.9);
	/*padding-left:45px;
	background-position:3px 3px;*/
}TEXTAREA{
	resize:none;
	height:180px !important;
	position:relative;
	line-height:20px !important;
	padding-right:20px !important;
}
.submit{
	display:block;
	padding:12px 15px;
	
	color:rgba(255,255,255,1);
	background:rgba(0,0,0,0.3);
	border:none;
	border-bottom:3px solid rgba(0,0,0,0.1);
	border-radius:3px;
	box-sizing:border-box;
	
	font-size:16px;
	font-family:Gotham-Bold;
	text-transform:uppercase;
	
	transition:all .3s ease;
	cursor:pointer;
}
.submit:hover{
	color:#FFF;
	background:rgba(0,0,0,0.5);
}

.name{
	background-image:url("../img/f_icon_user.png");
}.email{
	background-image:url("../img/f_icon_mail.png");
}.phone{
	background-image:url("../img/f_icon_phone.png");
}.company{
	background-image:url("../img/f_icon_company.png");
}.website{
	background-image:url("../img/f_icon_link.png");
}.description{
	background-image:url("../img/f_icon_info.png");
}.comments{
	background-image:url("../img/f_icon_why.png");
}


.footer{
	padding:70px 0px;
	margin-top:200px;
	
	background:rgba(0,0,0,0.15);
}

.footer,
.footer a:link,
.footer a:visited{
	font-size:23px;
	font-family:Gotham-Light;
	color:rgba(255,255,255,1);
}
.footer a:link,
.footer a:visited{
	display:inline-block;
	
	padding:3px;
	
	border-bottom:1px solid rgba(255,255,255,0.4);
	text-decoration:none;
	
	transition:all .3s ease;
}
.footer a:hover,
.footer a:active{
	color:rgba(255,255,255,1);
	border-color:rgba(255,255,255,0.7);
}

.footer .links{
	margin-top:5px;
}
.footer .links a:link,
.footer .links a:visited{
	border:none;
	text-transform:uppercase;
	font-family:Gotham-Bold;
	font-size:11px;
	color:rgba(255,255,255,0.7);
}
.footer .links a:hover,
.footer .links a:active{
	color:rgba(255,255,255,1);
}

.footer SPAN{
	display:block;
	margin-top:10px;
	
	font-size:15px;
	font-family:Gotham-Book;
	
	color:rgba(255,255,255,0.7);
	
    -webkit-touch-callout: text;
    -webkit-user-select: text;
    -khtml-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
}



/*
INPUT{
	width:80%;
	color:rgba(255,255,255,1);
	background:none;
	border-bottom:1px solid #FFF;
	border-radius:3px;
}
INPUT:hover,
INPUT:focus{
	width:100%;
	color:rgba(255,255,255,1);
	background:none;
}
INPUT::-webkit-input-placeholder {
   color: #FFF;
}

INPUT:-moz-placeholder { 
   color: #FFF;  
}

INPUT::-moz-placeholder { 
   color: #FFF;  
}

INPUT:-ms-input-placeholder {  
   color: #FFF;  
}
*/


/**********************/
/*	  SIGNUP FORM 	  */
/**********************/

.form__email{
	
	max-width:500px;
	width:90%;
	padding:15px;
	
	text-align:center;
	font-size:16px;
	color:#111;
	
	margin-top:5px;
	margin-bottom:10px;
	
	border:1px solid #CCC;
	outline:none;
	
	-moz-border-radius: 100px;
	-khtml-border-radius: 100px;
	-webkit-border-radius: 100px;
	border-radius: 100px;
	
}
.form__email:hover,.form__email:focus{
	border-color:#222;
}
.form__submit{
	
	padding:0px 60px;
	line-height:40px;
	text-align:middle;
	
	font-size:15px;
	
	color:#FFF;
	background:#111;
	border:1px solid #111;
	
	cursor:pointer;
	
}.form__submit:hover{
	
	color:#111;
	background:#FFF;
	border:1px solid #111;
	
}

.form__count{
	padding:0px 15px;
	line-height:40px;
	text-align:middle;
	
	font-size:14px;
	position:relative;
	margin-left:5px;
	display:inline-block;
	
	color:#777;
	background:#DDD;
	border:1px solid #DDD;
}
.form__count:before{
	content:'';
	width:0px;
	height:0px;
	position:absolute;
	top:14px; left:-6px;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-right: 6px solid #DDD;
}


.form__submit,.form__count{
	
	-moz-border-radius: 6px;
	-khtml-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
}

/**********************/
/*	    WINDOWS       */
/**********************/

.window{
	display:none;
	position:fixed;
	top:0px;bottom:0px;
	left:0px;right:0px;
	background:rgb(255,90,95);
	z-index:3;
	
	overflow:auto;
}
.about,
.portfolio{
	top:-100px;
	transition:all .5s ease;
}
.window--active .about,
.window--active .portfolio{
	top:0px;
}

/**********************/
/*	     ABOUT        */
/**********************/

.about__wrapper{
	width:100%;
	
	position:absolute;
	top:50%;
	margin-top:-200px;
}

.about{
	position:relative;
	background-color:rgb(218,73,77);
	
	width:90%;
	max-width:800px;
	margin:auto;
	overflow:visible;
	
	font-family:Gotham-Book;
	font-size:15px;
	line-height:23px;
	color:#FFF;
	
	box-sizing:border-box;
	padding:80px 140px;
	padding-bottom:60px;
}
.about B{
	font-weight:normal;
	font-family:Gotham-Bold;
}
.about I{
	font-family:Gotham-Bold;
	font-size:12px;
	color:rgba(255,255,255,0.7);
}
.about .logo{
	width:70px;
	height:70px;
	position:absolute;
	left:50%;
	top:-40px;
	margin-left:-40px;
		
	background:rgb(255,90,95);
	border:5px solid rgb(218,73,77);
	border-radius:100px;
}
.about .logo IMG{
	padding:20px;
}
.about .back{
	position:absolute;
	bottom:-16px;
	left:50%;
	margin-left:-70px;
	
	width:140px;
	height:34px;
	line-height:34px;
	
	font-size:13px;
	font-family:Gotham-Bold;
	
	color:rgb(218,73,77);
	background:#FFF;
	border-radius:4px;
	border-bottom:3px solid rgba(0,0,0,0.15);
	
	cursor:pointer;
	transition:all .3s ease;
}
.about .back:hover{
	background:rgba(255,255,255,0.8);
}

.about .corner{
	position:absolute;
	width:0px;height:0px;
}.about .corner:before,
.about .corner:after{
	position:absolute;
	content:'';
	background:#FFF;
}.about .corner:before{
	position:absolute;
	width:2px;
	height:40px;
}.about .corner:after{
	position:absolute;
	width:40px;
	height:2px;
}
.about .c_top{
	top:0px;
}.about .c_top:before,
.about .c_top:after{
	top:-15px;
}
.about .c_left{
	left:0px;
}.about .c_left:before,
.about .c_left:after{
	left:-15px;
}
.about .c_bottom{
	bottom:0px;
}.about .c_bottom:before,
.about .c_bottom:after{
	bottom:-15px;
}
.about .c_right{
	right:0px;
}.about .c_right:before,
.about .c_right:after{
	right:-15px;
}


/**********************/
/*	   PORTFOLIO      */
/**********************/

.portfolio__window{
	-display:block;
	transition:background-color .3s ease;
}
.portfolio__shade{
	z-index:1;
	position:absolute;
	top:0px;bottom:0px;
	left:0px;right:0px;
	background:rgba(0,0,0,0.5);
}

.portfolio__wrapper{
	z-index:2;
	width:100%;
	
	position:absolute;
	top:50%;
	margin-top:-300px;
}

.portfolio{
	position:relative;
	
	width:90%;
	max-width:1000px;
	margin:auto;
	overflow:hidden;
	
	height:600px;
	border-radius:6px;
	
	box-shadow:3px 3px 0px rgba(0,0,0,0.1);
}

.portfolio .logo{
	position:absolute;
	top:0px;bottom:0px;
	left:0px;right:0px;
	overflow:hidden;
	
	transition:all .3s ease;
}

.portfolio .logo .img{
	position:absolute;
	top:60%; margin-top:-100px;
	left:50%; margin-left:-140px;
	width:350px;
	height:200px;
	opacity:0;
	
	background-size:contain;
	background-repeat:no-repeat;
	background-position:center;
	
	transition:all .3s ease;
}
.portfolio .logo .info{
	position:absolute;
	bottom:-50px;
	left:100px;
	right:20px;
	opacity:0;
	
	font-size:14px;
	line-height:20px;
	text-align:left;

	transition:all .3s ease;
}
.portfolio .logo .info .title{
	font-family:Gotham-Bold;
	margin-bottom:3px;	
}

.portfolio .thumbs{
	z-index:1;
	position:absolute;
	top:0px;bottom:0px;
	left:0px; width:70px;
	background:rgba(0,0,0,0.7);
	
	border-right:1px solid rgba(255,255,255,0.1);
	
	border-top-left-radius:6px;
	border-bottom-left-radius:6px;
	
	overflow-y:auto;
}
.portfolio .thumb{
	width:27px;
	height:27px;
	margin:20px;
	
	background-size:80%;
	background-repeat:no-repeat;
	background-position:center;
	
	opacity:0.3;
	transition:all .2s ease;
	cursor:pointer;
}
.portfolio .thumb:hover{
	background-size:100%;
	
	opacity:1;
}

.btn--txt{
	z-index:10;
	position:absolute;
	
	color:#FFF;
	font-size:40px;
	line-height:20px;
	font-family:Gotham-Thin;
	
	opacity:0.6;
	cursor:pointer;
	transition:all .3s ease;
}
.btn--txt:hover{
	opacity:1 !important;
}
.btn__close{
	top:30px;
	right:30px;
}
.btn__next,
.btn__prev{
	top:50%;
	margin-top:-25px;
	font-family:Gotham-Bold;
	font-size:23px;
	
	width:30px;
	height:30px;
	line-height:30px;
	text-align:center;
	padding:10px;
	
	background:#FFF;
	border-radius:30px;
	opacity:0.3;
}
.btn__next{
	right:25px;
}
.btn__prev{
	left:95px;
}


/**********************/
/*	    SUCCESS       */
/**********************/

.popup {
	display:none;
	z-index:3000;
	position:fixed;
	top:0px; left:0px;
	height:100%;
	width:100%;
	text-align:center;
	background:rgb(255,90,95);
	color:#FFF;
}

.popup__content{
	position:relative;
}
.popup__content IMG{
	margin-bottom:10px;
}
.popup__text{
	line-height:30px;
	width:80%;
	max-width:370px;
	font-size:18px;
	margin:auto;
	padding-top:10px;
}


.raffle__popup .popup__text--small{
	font-size:16px;
	line-height:25px;
	max-width:450px;
}

.raffle__popup .raffle__link{
	font-family:Gotham-Bold;
	
	cursor:text;
	
    -webkit-touch-callout: auto;
    -webkit-user-select: auto;
    -khtml-user-select: auto;
    -moz-user-select: auto;
    -ms-user-select: auto;
    user-select: auto;
}








/**********************/
/*	 COMMON STYLING	  */
/**********************/

.font--thin{
	font-family:Gotham-Thin, Geneva, Arial, Helvetica, sans-serif;
}
.font--xlight{
	font-family:Gotham-XLight, Geneva, Arial, Helvetica, sans-serif;
}
.font--light{
	font-family:Gotham-Light, Geneva, Arial, Helvetica, sans-serif;
}
.font--book{
	font-family:Gotham-Book, Geneva, Arial, Helvetica, sans-serif;
}
.font--medium{
	font-family:Gotham-Medium, Geneva, Arial, Helvetica, sans-serif;
}
.font--bold{
	font-family:Gotham-Bold, Geneva, Arial, Helvetica, sans-serif;
}
.font--black{
	font-family:Gotham-Black, Geneva, Arial, Helvetica, sans-serif;
}



/**********************/
/*	GENERIC STYLING	  */
/**********************/	


::-webkit-scrollbar {
    width: 10px;
    height: 10px;
	transition:all .3s ease;
}
::-webkit-scrollbar-thumb:vertical {
    height: 10px;
	transition:all .3s ease;
}
::-webkit-scrollbar-thumb:horizontal {
    width: 10px;
	transition:all .3s ease;
}
::-webkit-scrollbar-track-piece {
    background-color: rgba(0,0,0,0.2);
}
::-webkit-scrollbar-thumb{
    background-color: rgba(255,255,255,1);
}

#request ::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}
#request ::-webkit-scrollbar-thumb:vertical {
    height: 5px;
}
#request ::-webkit-scrollbar-thumb:horizontal {
    width: 5px;
}
#request ::-webkit-scrollbar-thumb{
    background-color: rgba(0,0,0,0.3) !important;
}

.portfolio ::-webkit-scrollbar {
    width: 3px;
    height: 3px;
}
.portfolio ::-webkit-scrollbar-thumb:vertical {
    height: 3px;
}
.portfolio ::-webkit-scrollbar-thumb:horizontal {
    width: 3px;
}
.portfolio ::-webkit-scrollbar-thumb{
    background-color: rgba(255,255,255,1);
}

body{
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

html, body {
	height: 100%;
	width:100%;
	margin: 0;
	padding: 0;
	
	font-family: Gotham-Book, Geneva, Arial, Helvetica, sans-serif;
	font-size: 16px;
	color: #FFF;
	background-color:rgb(255,90,95);
	text-decoration:none;
	font-weight: normal;
	
	text-align:center;
	
	cursor:default;
}

b {
	font-weight:normal;
	font-family:Gotham-Bold;
}

.content--anim {
	-webkit-transition: background-color .2s ease, color .2s ease, border-color .2s ease;
	-moz-transition: background-color .2s ease, color .2s ease, border-color .2s ease;
	-o-transition: background-color .2s ease, color .2s ease, border-color .2s ease;
	transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
.rounded {
	-moz-border-radius: 3px;
	-khtml-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
}
