*{
margin: 0;

}

#cabecera {

position: relative;
width: 100%;
height: 80px;
background-color:#003366;
top: -100px;
left:0px;
 /* #31AAC1*/

}

@font-face {

    font-family: PoiretOne-Regular;
    src:url(font/PoiretOne-Regular.ttf);
}

h3 {
	position: absolute;
	font-family: 'PoiretOne-Regular', cursive;
	font-size:30px;
	color: white   ;
	top:-3px;


}

#logo {

position: absolute;
left:1200px;
background-color: black;
top: -14px;
width: 153px;
height: 50px;
}

.logo img {

width: 5px; 
height:5px; 

}


#menu {
position: relative;
top: -30px;
margin-left:100;
width: 250px;
height: 100%;
background-color: green; 
}



#menuderecho{
	position: absolute;
	left:250px;
	width: 1105px;
	top:80px;
	background-color: yellow;
	height: 50px;

}

#informacion {

    position: relative; 
    margin-left: 900px;
    height: 20px;
    width: 20px;
  
    color: blue;
    z-index: 1;
    margin-top: 50px;
}

.informacion p {

    margin-top:1px;
    margin-left: 7px;
    color: black;
}




    .container {
               position: absolute;
                width: 300px; 
                top: -70px;
                left:0px;
                background-color:#003366;
                overflow: scroll; height: 570px; width:400px;

               

            }
            h1 {
                font-family: Cinzel, serif; 
                font-weight: 400; 
                font-size: 60px; 
                line-height: 55px; 
                color: #373f51;
                margin-bottom: 50px; 
            }
            .container p {
                font-size: 16px; 
                color: #58a4b0; 
                margin-bottom: 100px; 
            } 
            .quote-button {
                display: block; 
                text-decoration: none;
                padding: 12px 0; 
                top:0;
                color: white; 
                background-color: #003366; 
                
                font-size: 14px; 
                 
                border-bottom: 1px solid white; 



                           }

            .quote-button:hover {

                padding-top:20px;
            transition-duration: 0.4s;
            color: #00ffff;

            }


            form {

                background-color: #B0E0E6;
            }

            .quote-container blockquote {
              	

                display: none; 
               margin: auto;
                background-color: #3366ff; 
                color: #fff; 
             	margin-left:0;
             	margin-top: 0;
                font-size: 14px; 
               
                top: 10px;
                 


            }


         
/* #77B5FE*/






.ache3{

    position: absolute;
    background-color:#003366;
	font-size:30px;
	top: 20px;

}







/**************************************/
/* 
    hago referencia a la clase del <a> y luego al span que tiene la clase del icono,
    esta regla se aplica para cualquier span que esté dentro de la clase .quote-button
*/
.quote-button span {
    font-size: 22px;
    margin-right:10px;
}

/*
    esta parte es para mover verticalmente los iconos que no esten alineados
*/
.quote-button .icon-menu {
    position: relative;
    bottom: -4px;

}