/*Geral*/
body{
    font-family: 'Oswald', 'Ubuntu','Roboto', 'Open Sans'  ,sans-serif;
    font-size:15px;
    line-height: 1.5;
    padding: 0;
    margin:0;
    background-color: #f4f4f8;

}

.container{
        margin: auto;
        overflow:hidden;
}

/*Header*/

header{
    background: #171917;
    color: white;
    padding-top:30px;
    min-height: 70px;
    border-bottom:#00FF 6px double;
}


header #branding{
    font-family: 'Oswald';

}
header img{
    height: 120px;
    float: left;
    margin-right: 20px;
}
header span{
    color:#00ff;
    
}
/*nav*/
nav a{
    color: white;
    text-decoration: none;
    text-transform: uppercase;
    font-size: 16px;

}

nav ul{
    margin: 0;
    padding: 0;
}

nav li{
    float:right;
    display: inline;
    padding: 0 20px 0 20px;
   
}

#navinsc img{
    height:40px;
    position: absolute;
    top:120px;
    right: 104px;


}

#hangout img{
    height:40px;
    position: absolute;
    top:120px;
    right: 15px; 
  

}

header .highlight, header.current a{
    color: #00ff;
    font-weight: bold;
}

header a:hover{
    color:#00ff;
    font-weight: bold;
}


/*Showcase*/
#showcase {
    min-height: 400px;
    background:url("../Media/imagens/aula.jpg" ) no-repeat;
    background-size: cover;
    background-position: initial;

}

#caixatexto1{
    padding:10px;
    margin:30px;
    min-height: 300px;
    width: 300px;
    background-color: lightblue;
    border-radius: 10px 70px 10px 70px;
    opacity: 0.8;
    margin-left: 50px;
    
}

#caixatexto1 h1{
    text-align: center;
    font-size: 36px;
}

#meio{
    height: 90px;
    background-color: #171917;
    border-top: #00ff double 6px;
    border-bottom: #00FF double 6px;
}

/*boxes*/

#boxes{
    margin-top: 20px;
}
#boxes .box{
    float: left;
    width: 30%;
    padding: 10px;
    margin: 20px;
    text-align: center;
}
#boxes .box img{
    width: 250px;
}

#cont3 img{
    height: 140px;
}

footer{
    min-height: 200px;
    padding: 20px;
    color: white;
    background-color: #171917;
  
}
#contato{
        text-align: left;
    font: 20px 'Roboto';
    list-style-type: none;

}
#contato a{
    text-decoration: none;
    color: white;
}



#contato a:hover{
    color:#00ff;
    font-weight: bold;
 }
/* Media Queries */

@media(max-width: 768px){
    header img {height: 0px;}
    header #branding,
    header nav, 
    header nav li{
        float:none;
        text-align: center;
    }
    header h1{
        font-size: 60px;
    }
    header h3{
        font-size:30px;
    }
    header a{
        font-size: 20px;
    }
    #hangout img{
        height: 0px;
    }

    #navinsc img{
        height: 0px;
    }


    #caixatexto1{
        padding:10px;
        margin:0px;
        height: 400px;
        width: 100%;
        background-color: lightblue;
        border-radius: 0px;
        opacity: 0.8;
        margin-left: 0px;
        
    }
    #caixatexto1 h1{
        font-size: 50px;
        padding: 20px;
        text-align: center;
    }
    #caixatexto1 p{
        margin: 20px;
        text-align: center;
    }

    #showcase {
        background-position: center;
    
    }
    #boxes .box{
        float:none;
        text-align: center;
        width: 100%;
    }


    footer{
        min-height: 300px;
        padding-top: 30px;
        padding-left:5px;
       
    }
    #contato{
            text-align: left;
        font: 20px 'Roboto';
    }
    #contato a{
        text-decoration: none;
        color: white; 
    }

}