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;}

.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;}

.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;}

}




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;
}