*{
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-family:arial;
}

/**Boot CSS**/

html,body{
	height: 100%;
}

.menu_principal{
	max-width: 100%;
	padding:0 2%;
	margin:0 auto;
   
}

.menu_principal img{
	width: 300px;
	max-width: 400px;
	background:white;
}

.center{
	max-width: 100%;
	padding:0 2%;
	margin:0 auto;
}

.w33{
	width: 33.3%;
	padding: 0 10px;
}

.w50{
	padding:0 10px;
	width: 50%;
}

.left{
	float: left;
}

.right{
	float: right;
}

.clear{
	clear: both;
}


/**Estilização do site**/

nav.desktop li {
    font-weight: 600;
    font-size: 18px;
    padding: 11px 30px;
    /*text-transform: uppercase; */
    display: inline-block;
}

nav.desktop a {
    color: white;
    text-decoration: none;
}

.overlay-loading img{
	width: 42px;
	height: 42px;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
}

header{
	padding:10px 0;
	background: #1C1C1C;

}

header .logo{
	font-size: 20px;
	font-weight: 600;
	text-transform: uppercase;
}

.logo a{
	text-decoration: none;
	color: white;
}

.banner{
    max-width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: auto;
}

.banner img{
    width: 70%;
}


section.descricao-autor{
	padding:40px 0;
}

section.descricao-autor h2{
	font-size: 28px;
	font-weight: 300;
	color: #444;
}

section.descricao-autor p{
	font-size: 16px;
	color: #444;
	font-weight: 300;
	margin-top:10px;
}

section.especialidades{
	padding: 40px 0;
	background: #E2E2E2;
}

section.especialidades h2.title{
	font-size: 40px;
	text-align: center;
	font-weight: 600;
	color: #999;
}

.box-especialidade{
    float: left;
    width: 33.3%;
	margin:40px 0;
	padding: 0 30px;
	text-align: center;
}

.box-especialidade h3{
	color: #404580;
	font-size: 40px;
}

.box-especialidade h4{
	font-weight: 600;
	font-size: 50px;
	color: #BABABA;
}

.box-especialidade p{
	color: #444;
	font-size: 18px;
	margin-top: 10px;
}

.relato{
     width:50%;
     float:left;
}

.leao{
    width:50%;
    float:left;
}

.leao img{
    width: 100%;
}

footer{
	background: #1C1C1C;
	padding: 30px 0;
}

footer.fixed{
	
	position: fixed;
	bottom: 0;
	width: 100%;

}

footer p{
	color: white;
	text-align: center;
	font-weight:400;
	font-size: 16px;
}

/*Para arrumar scroll-x do IE e EDGE.*/

body{
	overflow-x: hidden;
}



@media screen and (min-width: 699px){
    nav.mobile {
        display: none;
    }
}

@media screen and (max-width: 700px){
    .botao-menu-mobile{
        padding-right:15px;
    }
    
    .botao-menu-mobile i{
        font-size:35px;
    }  

    nav {
        margin: 0 auto;
        text-align: center;
    }
    
    nav.mobile {
        display: block;
        
    }

    li:hover ul { 
        display: block; 
    }
    
    ul li b i {
        font-size:35px;
    }
    
    ul li a i{
        padding:10px;
    }

    ul li b:hover i{
        color:red;
    }
    
    ul li b {
       display: block;
       text-decoration: none;
       color: white;
       background: #1C1C1C;
       padding: 5px;
    }  
    
    ul li:hover b {
        color:red;
    }
        
    ul {
        font-size: 24px;
        cursor: pointer;
        color: white;
    }
    
    ul li {
    position: relative;
    list-style-type: none;
    }
    
    li ul {
    position: absolute;
    margin-top:18px;
    margin-left:-172px;
    padding: 28px;
    top: 0;
    display: none;
    }
    
    ul li a {
       display: block;
       text-decoration: none;
       border: 1px solid #ccc;
       color: white;
       background: #455a64;
       padding: 5px 50px 5px 50px;
    }
    
    ul a:hover {
        background: darkgray;
    }

    .menu_principal img{
        display:none;
    }
    
    .botao-menu-mobile {
        font-size: 24px;
        cursor: pointer;
        color: white;
    } 
    nav.desktop li{
      display: none;
    } 
    
    .banner img{
        width: 90%;
        margin-top:20px;
    }
    
    .relato{
        width:100%;
        padding:10px;
        text-align:center;
    }
    
    .leao{
        width:100%;
        

    }    

    .box-especialidade{
        float: left;
        width: 100%;
    	margin:40px 0;
    	padding: 0 30px;
    	text-align: center;
    }     
    
        
}