body {margin:0; font-family:'Dosis';}
a {text-decoration:none; color:black;}
#header {position:fixed; top:0;width:100%; height:90px; background-color:black; z-index:999;}
#diagonal {position:fixed; top:-20px; left:0; width:100%; height:280px; background-image:url(../img/sidebar_horizontal.png); background-size:2000px; background-repeat:no-repeat; z-index:99;}
#trabalhos {top:220px; position:relative;}

.menu {width:auto; height:160px; line-height:80px; }
#header ul {margin:30px 0; padding:0;}	
#header li {display: inline-block; color:white; letter-spacing:1px; font-size:16px; padding-right:10px; float:left;}
#header li:hover {color: rgb(200,200,200);}
#barra {padding:0 30px 0 20px; font-size:20px; line-height:85px; color: #666; float:left;}
.logo {width:100%; height:130px; background:url(../img/logo1.png) no-repeat left; background-size:110px; margin-left:-9px; margin-top:20px;}

h2 {text-align:center; font-size:30px;}
h4 {text-align:center; font-size:18px; margin-top:-30px; font-weight:100;}
p {color: rgb(80,80,80); text-align:justify; padding:0 15px;}

#loading {
	background: black url(../img/loading.gif) no-repeat center center;
	width: 100%;
	height: 100%;
	position: fixed;
	z-index: 9999;
	background-size: 80px;
}

.erro {border: 2px solid rgba(247,18,18,0.5) !important;}

#retorno {text-align: center; margin: 20px 0; padding-bottom: 30px;}

.validate-error {width: 100%; text-align: center;}

.conter-contato {position:relative; top:250px;}

.redes-sociais {margin: 0 auto; width:384px;}

.space-top {margin-top:30px; }
.linha { border-bottom: solid 1px rgb(204,204,204);}
.imagem_arma {text-align:center; }

#sidebar ul {margin:30px 0; padding:0;}
#sidebar li {list-style:none; font-family: Arial, Helvetica, sans-serif; letter-spacing:1px; text-align:center; line-height:25px; text-transform:uppercase; font-size: 16px; color:rgb(255,255,255); padding-bottom:10px; font-family:'Dosis'; font-weight:700;}
#sidebar li:hover {color: rgb(200,200,200); text-decoration:line-through;}

.meu-telefone {font-size: 55px; text-align: center; margin-top: -20px;}   
.meu-email {font-size: 35px; text-align: center; margin-top: -10px; margin-bottom: 40px;}   

.preto {background-color:black; left:0; position:fixed; top:0; height:100%; width:100px;}
.sidebar_bg { width:250px; height:100%; position:fixed; left:100px; top:0; background-image: url(../img/sidebar.png); background-size: 250px;}

#sidebar { width:120px; height:300px; position:fixed; left:90px; top:50px;}


.redes_sociais {width:100%; height:75px; margin-top:0px; }	
.facebook {width: 30px; height:75px; background-color:red;  background:url(../img/facebook.png) no-repeat center; background-size:10px;  float:left;}
.behance {width: 60px; height:75px; background-color:yellow; background:url(../img/behance.png) no-repeat center; background-size:30px; float:left;}


#container {width:1270px; height:auto; margin: 200px auto 40px}
#container ul {margin:0; padding:0;}
#container li {width:400px; height:300px; background-color: rgb(204,204,204); display:inline-block;list-style:none; margin:0; padding:0; border: 10px solid white;}
#container li.principal {width:1250px; height:350px;}
#container li img {width:100%; }



@media only screen 
and (max-width : 1760px) {
#container {width:960px; height:auto; margin: 35px 380px;}
#container ul {margin:0; padding:0;}
#container li {width:400px; height:300px; background-color: rgb(204,204,204); display:inline-block;list-style:none; margin:0; padding:0; border: 10px solid white;}
#container li.principal {width:900px; height:350px;}


.preto {background-color:black; left:0; position:fixed; top:0; height:100%; width:50px;}
.sidebar_bg { width:250px; height:100%; position:fixed; left:50px; top:0; background-image: url(../img/sidebar.png); background-size: 250px;}

#sidebar { width:120px; height:300px; position:fixed; left:70px; top:40px;}
}

@media only screen 
and (max-width : 1440px) {
#container {width:850px; height:auto; margin: 35px 370px;}
#container ul {margin:0; padding:0;}
#container li {width:400px; height:300px; background-color: rgb(204,204,204); display:inline-block;list-style:none; margin:0; padding:0; border: 10px solid white;}

}


@media only screen 
and (max-width : 940px) {
#container {width:460px; height:auto; margin: 35px 290px;}
#container ul {margin:0; padding:0;}
#container li {width:400px; height:300px; background-color: rgb(204,204,204); display:inline-block;list-style:none; margin:0; padding:0; border: 10px solid white;}

}

@media only screen 
and (max-width : 640px) {
    .meu-telefone {font-size: 35px; text-align: center; margin-top: 0px;}   
.meu-email {font-size: 25px; text-align: center; margin-top: -10px; margin-bottom: 40px;}   
#header {position:absolute; top:0;width:100%; height:210px; background-color:black; z-index:999;}
#diagonal {position:absolute; top:55px; left:0; width:100%; height:280px; background-image:url(../img/sidebar_horizontal.png); background-size:2000px; background-repeat:no-repeat; z-index:99;}
#trabalhos {top:300px; position:relative;}
    .conter-contato {position:relative; top:300px;}

#header ul {margin:10px 0 0 13px; height:40px; padding:0; text-align:center;}	
#header li {display: inline-block; color:white; letter-spacing:1px; font-size:16px; padding-right:10px; float:none;}
#barra {display:none;}
.redes-sociais {margin: 0 auto; width:125px;}

.logo {width:90px; height:130px; background:url(../img/logo1.png) no-repeat left; background-size:90px; margin:10px auto;}
.menu {width:272px;height:160px; line-height:80px; }
.right {float:none !important; margin:-40px auto;}

#video {position:absolute; top:100px;}
}




video#bgvid {
position: fixed; right: 0; bottom: 0;
min-width: 100%; min-height: 100%;
width: auto; height: auto; z-index: -100;
background: url(polina.jpg) no-repeat;
background-size: cover;
}