*{margin: 0; padding: 0; font-size: 100%; border: none; font-weight: 300; box-sizing: border-box;
font-family: arial, helvetica, sans-serif;
}

body{
	background-color: #f5f5f5;
}



img{max-width: 100%;}

.fixo {
 z-index: 199;
 position: fixed;
 top: 70px;
}

a:link 
{ 
text-decoration:none; 
} 


/*==========CONTAINER=============*/
.container{
	width: 100%;
	float: left;
	padding: 3% 4%;
	text-align:center;
}

.logo{
	width:180px;
	align:left;
	margin-left:-243px;
	margin-top:-10px;
}
.cabecalho h1{color:white;font-size:30px;font-family:Kelly Slab;font-weight:600;margin-left:30px;margin-top:-57px;}
.cabecalho{
	background-color:white;
	height:140px;
}
.btn-menu{
	width: 20%; 
	height:50px;
	float:center;
	text-align:center;
	margin-top:9px;
	color:white;
	border-radius:6px;
	cursor: pointer;
	background:linear-gradient(to top,#A4A4A4,#585858);
	
	/*background:linear-gradient(to right,#CDC0B0,#CDC0B0);*/
}

/*Menu*/
.menu{
	display:none;
	width:100%;
	height:100%;
	position:fixed;
	background-color: rgba(0,0,0,0.9);
	top:0;
	left:0;
	z-index: 10;
}

.btn-close{
    color:white;
	font-size: 1.5em;
	float:right;
	cursor:pointer;
	margin: 2% 3% 0 0;
}

.menu ul{
	width:100%;
	float:left;
	text-align:center;
}

.menu li{
	padding: 1.5%;
}

.menu li a{
font-size: 2em;
color:#fff;
padding: 1.5% 3%;
}

.menu li a:hover{
	border:1px solid #36648B;
}

/*RODAPE*/

.rodape{
	clear:both; 
	height:390px;
	width: 100%;
	float: left;
	padding: 3% 4%;
	text-align:center;
	background-color:blue;	
}

.social-icons a{
	font-size: 1.5em;
	color:rgba(255,255,255,0.7);
	margin-right: 3%;
}
.social-icons a:last-child{margin-right:0;}

.social-icons a:hover{
	color:rgb(255,255,255);
}

.rodape h2{color:#9FB6CD;align:left;font-size:1.7em;text-align:left;font-family: Georgia, Times,Times New Roman;margin-left:-4px; }
.rodape h3{color:#9FB6CD;align:center;font-size:2.0em;text-align:center;font-family: Georgia, Times,Times New Roman; }
.rodape h4{color:#9FB6CD;align:left;font-size:1.1em;text-align:left;margin-left:-3px;}
.rodape h1{color:white;font-size:1.0em;font-family:Kelly Slab;margin-left:120px;margin-top:-40px;}
.textoColorido{font-size:0.90em;}

.logo1{
	width:26px;
	align:left;
	margin-left:1px;
	margin-top:-5px;
}
.menu ul {list-style-type:none}

.copyright
{
	margin-top:1;
	color:white;
	font-family:Kelly Slab;
	font-size:1.0em;
	margin-left:-110px;
}

.rodape h1 a:hover{ text-decoration: none; color: white; }
.rodape h1 a:visited { text-decoration: none; color: white; } 
.rodape h1 a:focus{ text-decoration: none; color: white; }
.rodape h1 a:active{ text-decoration: none; color: white; }
.rodape h1 a:link{ text-decoration: none; color: white; }

.copyright h1 a:link{ text-decoration: none; color: white; }

/*======MOBILE FIRST=====*/
/*SMALL DEVICES - SMARTPHONES */
/*Para cada resolução de tela muda os tamanhos e letras dos icones*/
@media screen and (min-width: 480px){

.rodape h1 a:hover{ text-decoration: none; color: white; }
.rodape h1 a:visited { text-decoration: none; color: white; } 
.rodape h1 a:focus{ text-decoration: none; color: white; }
.rodape h1 a:active{ text-decoration: none; color: white; }
.rodape h1 a:link{ text-decoration: none; color: white; }

.copyright h1 a:link{ text-decoration: none; color: white; }

}
/*SMALL DEVICES - TABLETS */
@media screen and (min-width: 768px){
.btn-menu{width:9%;height:60px;margin-top:0px;}
.logo{
  width: 190px;
  float:left;
  margin-left:2%;
  margin-top:-7px;
}
.cabecalho{height:100px;}
}

/*MEDIUM DEVICES - TABLETS  & DESKTOPS*/
@media screen and (min-width: 960px){
.logo{}

	.btn-menu{display:none;}
	.btn-close{display:none;}
	.menu{
		    width:auto;
    height:56px;
    line-height:56px;
    float:right;
    background:white;
    display:block !important;
    position:static;
    border-radius:5px; 
    margin-right:0px;
    margin-top:-10px;
	}
	.menu li{
	padding:0;
	float:left;
    width:95px;
	font-size:1.0em;display:block;
	}
	.menu li a{
		width:80px;
		font-size:1em;
		padding:15px;
		position:relative;
		}
	.menu li a:hover{
		border:none;
		color:white;
		background:linear-gradient(to bottom,#A4A4A4,#848484);
		
	}	
	
.menu ul {
     list-style-type:none
 }
 
 .menu li  ul{
width:14%;/*meche no tamanho do menu debaixo*/
position:relative;
top:40px; /*Mexe na altura que o menu debaixo vai abrir*/
left:0;
background-color:transparent; 
display:none;
z-index:10;
}
.menu li:hover ul, .menu li.over ul{display:block;}

.menu li ul li{/*Parte debaixo do menu : realizadas, canceladas,contato, pagamentos efetuados e pendentes*/
display:block; 
background-color:#01B1AF; 
width:110px;
border:2px solid #A4A4A4;
}
 
 .rodape h1 a:hover{ text-decoration: none; color: white; }
.rodape h1 a:visited { text-decoration: none; color: white; } 
.rodape h1 a:focus{ text-decoration: none; color: white; }
.rodape h1 a:active{ text-decoration: none; color: white; }
.rodape h1 a:link{ text-decoration: none; color: white; }

.copyright h1 a:link{ text-decoration: none; color: white; }

}

/*LARGUE DEVICES - WIDE SCREENS*/
@media screen and (min-width: 1280px){
	.logo{	width: 50px;
	align:left;
	margin-left:-1150px;
	margin-top:-40px;}

	.btn-menu{display:none;}
	.btn-close{display:none;}
	.menu{
		width:auto;
		height:56px;
		line-height:56px;
		float:right;
		background-color:white;
		display:block !important;
		position:static;
	}
	.menu li{
	padding:0;
	float:left;
	}
	.menu li a{
		color:white;
		font-size:1em;
		padding:15px;}
	.menu li a:hover{
		border:none;
		color:white;
		background:linear-gradient(to bottom,#A4A4A4,#848484);
	}
	
	.rodape h1 a:hover{ text-decoration: none; color: white; }
.rodape h1 a:visited { text-decoration: none; color: white; } 
.rodape h1 a:focus{ text-decoration: none; color: white; }
.rodape h1 a:active{ text-decoration: none; color: white; }
.rodape h1 a:link{ text-decoration: none; color: white; }

.copyright h1 a:link{ text-decoration: none; color: white; }
}