@charset"utf-8";

@font-face {
  font-family: 'robotoblack';
  src: url('../fonts/roboto/roboto-black-webfont.eot');
  src: url('../fonts/roboto/roboto-black-webfont.eot?#iefix') format('embedded-opentype'),
    url('../fonts/roboto/roboto-black-webfont.woff2') format('woff2'),
    url('../fonts/roboto/roboto-black-webfont.woff') format('woff'),
    url('../fonts/roboto/roboto-black-webfont.ttf') format('truetype'),
    url('../fonts/roboto/roboto-black-webfont.svg#robotoblack') format('svg');
  font-weight: normal;
  font-style: normal;
  }

@font-face {
  font-family: 'robotoblack_italic';
  src: url('../fonts/roboto/roboto-blackitalic-webfont.eot');
  src: url('../fonts/roboto/roboto-blackitalic-webfont.eot?#iefix') format('embedded-opentype'),
    url('../fonts/roboto/roboto-blackitalic-webfont.woff2') format('woff2'),
    url('../fonts/roboto/roboto-blackitalic-webfont.woff') format('woff'),
    url('../fonts/roboto/roboto-blackitalic-webfont.ttf') format('truetype'),
    url('../fonts/roboto/roboto-blackitalic-webfont.svg#robotoblack_italic') format('svg');
  font-weight: normal;
  font-style: normal;
  }

@font-face {
  font-family: 'robotobold';
  src: url('../fonts/roboto/roboto-bold-webfont.eot');
  src: url('../fonts/roboto/roboto-bold-webfont.eot?#iefix') format('embedded-opentype'),
    url('../fonts/roboto/roboto-bold-webfont.woff2') format('woff2'),
    url('../fonts/roboto/roboto-bold-webfont.woff') format('woff'),
    url('../fonts/roboto/roboto-bold-webfont.ttf') format('truetype'),
    url('../fonts/roboto/roboto-bold-webfont.svg#robotobold') format('svg');
  font-weight: normal;
  font-style: normal;
  }

@font-face {
  font-family: 'robotobold_italic';
  src: url('../fonts/roboto/roboto-bolditalic-webfont.eot');
  src: url('../fonts/roboto/roboto-bolditalic-webfont.eot?#iefix') format('embedded-opentype'),
    url('../fonts/roboto/roboto-bolditalic-webfont.woff2') format('woff2'),
    url('../fonts/roboto/roboto-bolditalic-webfont.woff') format('woff'),
    url('../fonts/roboto/roboto-bolditalic-webfont.ttf') format('truetype'),
    url('../fonts/roboto/roboto-bolditalic-webfont.svg#robotobold_italic') format('svg');
  font-weight: normal;
  font-style: normal;
  }

@font-face {
  font-family: 'robotoitalic';
  src: url('../fonts/roboto/roboto-italic-webfont.eot');
  src: url('../fonts/roboto/roboto-italic-webfont.eot?#iefix') format('embedded-opentype'),
    url('../fonts/roboto/roboto-italic-webfont.woff2') format('woff2'),
    url('../fonts/roboto/roboto-italic-webfont.woff') format('woff'),
    url('../fonts/roboto/roboto-italic-webfont.ttf') format('truetype'),
    url('../fonts/roboto/roboto-italic-webfont.svg#robotoitalic') format('svg');
  font-weight: normal;
  font-style: normal;
  }

@font-face {
  font-family: 'robotolight';
  src: url('../fonts/roboto/roboto-light-webfont.eot');
  src: url('../fonts/roboto/roboto-light-webfont.eot?#iefix') format('embedded-opentype'),
    url('../fonts/roboto/roboto-light-webfont.woff2') format('woff2'),
    url('../fonts/roboto/roboto-light-webfont.woff') format('woff'),
    url('../fonts/roboto/roboto-light-webfont.ttf') format('truetype'),
    url('../fonts/roboto/roboto-light-webfont.svg#robotolight') format('svg');
  font-weight: normal;
  font-style: normal;
  }

@font-face {
  font-family: 'robotolight_italic';
  src: url('../fonts/roboto/roboto-lightitalic-webfont.eot');
  src: url('../fonts/roboto/roboto-lightitalic-webfont.eot?#iefix') format('embedded-opentype'),
    url('../fonts/roboto/roboto-lightitalic-webfont.woff2') format('woff2'),
    url('../fonts/roboto/roboto-lightitalic-webfont.woff') format('woff'),
    url('../fonts/roboto/roboto-lightitalic-webfont.ttf') format('truetype'),
    url('../fonts/roboto/roboto-lightitalic-webfont.svg#robotolight_italic') format('svg');
  font-weight: normal;
  font-style: normal;
  }

@font-face {
  font-family: 'robotomedium';
  src: url('../fonts/roboto/roboto-medium-webfont.eot');
  src: url('../fonts/roboto/roboto-medium-webfont.eot?#iefix') format('embedded-opentype'),
    url('../fonts/roboto/roboto-medium-webfont.woff2') format('woff2'),
    url('../fonts/roboto/roboto-medium-webfont.woff') format('woff'),
    url('../fonts/roboto/roboto-medium-webfont.ttf') format('truetype'),
    url('../fonts/roboto/roboto-medium-webfont.svg#robotomedium') format('svg');
  font-weight: normal;
  font-style: normal;
  }

@font-face {
  font-family: 'robotomedium_italic';
  src: url('../fonts/roboto/roboto-mediumitalic-webfont.eot');
  src: url('../fonts/roboto/roboto-mediumitalic-webfont.eot?#iefix') format('embedded-opentype'),
    url('../fonts/roboto/roboto-mediumitalic-webfont.woff2') format('woff2'),
    url('../fonts/roboto/roboto-mediumitalic-webfont.woff') format('woff'),
    url('../fonts/roboto/roboto-mediumitalic-webfont.ttf') format('truetype'),
    url('../fonts/roboto/roboto-mediumitalic-webfont.svg#robotomedium_italic') format('svg');
  font-weight: normal;
  font-style: normal;
  }

@font-face {
  font-family: 'robotoregular';
  src: url('../fonts/roboto/roboto-regular-webfont.eot');
  src: url('../fonts/roboto/roboto-regular-webfont.eot?#iefix') format('embedded-opentype'),
    url('../fonts/roboto/roboto-regular-webfont.woff2') format('woff2'),
    url('../fonts/roboto/roboto-regular-webfont.woff') format('woff'),
    url('../fonts/roboto/roboto-regular-webfont.ttf') format('truetype'),
    url('../fonts/roboto/roboto-regular-webfont.svg#robotoregular') format('svg');
  font-weight: normal;
  font-style: normal;
  }

@font-face {
  font-family: 'robotothin';
  src: url('../fonts/roboto/roboto-thin-webfont.eot');
  src: url('../fonts/roboto/roboto-thin-webfont.eot?#iefix') format('embedded-opentype'),
    url('../fonts/roboto/roboto-thin-webfont.woff2') format('woff2'),
    url('../fonts/roboto/roboto-thin-webfont.woff') format('woff'),
    url('../fonts/roboto/roboto-thin-webfont.ttf') format('truetype'),
    url('../fonts/roboto/roboto-thin-webfont.svg#robotothin') format('svg');
  font-weight: normal;
  font-style: normal;
  }

@font-face {
  font-family: 'robotothin_italic';
  src: url('../fonts/roboto/roboto-thinitalic-webfont.eot');
  src: url('../fonts/roboto/roboto-thinitalic-webfont.eot?#iefix') format('embedded-opentype'),
    url('../fonts/roboto/roboto-thinitalic-webfont.woff2') format('woff2'),
    url('../fonts/roboto/roboto-thinitalic-webfont.woff') format('woff'),
    url('../fonts/roboto/roboto-thinitalic-webfont.ttf') format('truetype'),
    url('../fonts/roboto/roboto-thinitalic-webfont.svg#robotothin_italic') format('svg');
  font-weight: normal;
  font-style: normal;
  }


* {
    margin: 0;
    padding: 0;
    text-align: center;
    
}

header {
   display:flex;
    font-weight: 400;
    background-color: #eb5b0e;
    flex-direction: column;
    justify-content:center;
    align-items:center;
    
} 
h1 {
    font-family: 'robotoblack';
    color:#ff6c00;
    display: flex;
    justify-content: center
    
    
}
body{background-color: #eb5b0e
        
}
#logofadu { display: flex;
    justify-content: center;
    align-items: center;
    margin: 1em;
    margin-top:4em;
    width:20%        
}
#marco {display: flex;
flex-direction: column;
justify-content: center;
align-content: center;
align-items: center}



#botondeingreso {margin-top: 1.2em;
width: 100px}

@media all and (max-width:25em) 
    
    
header {
   display:flex;
    font-family: 'latoregular';; font-weight: 400;
    background-color: #eb5b0e;
    flex-direction: column;
    justify-content:space-between;
    align-items:center;
} 
h1 {
    font-family: 'robotoblack';
    color:#ffffff    
}

h2 {
    font-family: 'robotothin_italic';
    color:black;
    font-size: 10px
}
h3 {
    font-family: 'robotoblack';
    color:#ffffff;
    font-size: 14px;
    margin-top: 1em
}
h4{
    font-family: 'robotoblack';
    color:#ffffff;
    font-size: 12px;
    margin-left: 5em
}
body{background-color: #eb5b0e
        
}
#logofadu {display: flex;
align-items: center;
    justify-content: center;
    
    margin: 1em;
    margin-top:4em;
    width:20%        
}

#botondeingreso {margin-top: 1.2em;
width: 100px}

#botondeingreso2 {margin-top: 17em}

#ingresoderegistro {margin-top: 1.2em;
margin-bottom: 0.9em}

li {display: flex;
    flex-direction: column;
    align-items: center; margin-top: 0.5em;
list-style: none;
font-family: "robotomedium";
font-size: 11px}
  
footer {

    font-family:'robotoblack';
    display: flex;
    flex-direction:row;
    align-content:center;
    align-items:center;
    justify-content:center;
    font-size: 14px;
    background-color: black;
    align-self: center;
    margin-top: 0em;
    padding: 0.9em
    
    
}


#redes {display:flex;
flex-direction: row;
align-items: center;
justify-content: center;
    margin-top:1em;
    margin-bottom: 0.9em
}
#facebook {margin-left:  0.5em}
#twitter {margin-left: 3em}
#google {margin-left:  3em}

#icono {display: flex;
flex-direction:column;
justify-content: flex-start;
align-items: flex-start;
align-self: flex-start;
width: 35px}

#avatar {margin-top: 2em;
width: 90px}

INPUT{border-radius: 1em;
display: flex;
align-items: center;
align-self: center}

#botonera{display:flex;
    background-color: black;
    margin-right: 0.6em



    
    
}

#menu {width:80% ; margin-left: 1em}
#mensajes {width:80%;margin-left: 1.5em}
#perfil {width:80% ;margin-left: 1em}

#iniciodepagina {display:flex;
flex-direction: row;
justify-content:center;
    align-items: center;
    align-content: center;
    align-self:center;
margin-top: 0.2em;
    margin-right: 2.5em
    
    
}
#iniciodepagina input{width: 100px;
    margin-left: 0.5em
}
#objetos {display:flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    align-content: center;
    margin-top: 0.3em;  }

#listado a{padding: 0.1em;
margin-bottom: 0.5em}

#productodestacado {display: flex; width: 100%;
flex-direction: column;
justify-content: center;
    align-content: center;
    align-items: center
}

h5 {display: flex; 
    width: 105%;
flex-direction: column;
justify-content:center;
align-content:center;
    align-items:center;
font-family: "robotomedium";
margin-top: 0.3em;
    margin-bottom: 0.3;
font-size:14px}

#detalle{display: flex; width: 80%;
flex-direction: column;
justify-content:center;
align-content:center;
align-items: center;
align-self: center}

#descripcion{display: flex; 
flex-direction: row;
justify-content:flex-end;
align-content: flex-end;
margin-top: 0.5em}

p{font-size: 9px;
justify-content: flex-start;
    padding-right: 1em;
    text-align: left;
    font-family: "robotomedium";
    margin-bottom: 1.4em
}

#precios{background-color: #ff8a34;
font-size: 25px;
align-content: center;
align-items: center;
margin-right: 0.2em;
margin-bottom: 1.0em}

#remitentes{display: flex}
#nombres {display: flex;
flex-direction: column;
    align-content: flex-start;
    align-items: flex-start;
    align-self: flex-start;margin-left: 1.5em   
}

#imagendetalle {width: 70%;
}

#enviar {margin: 1em}

#descr {font-family: "robotomedium";
margin-top: 0.5em}

#descrip {font-size:10px;
    font-family: "robotomedium";
margin-top: 0.5em;
background-color: #ffffff;
border-radius: 0.9em;
padding: 0.9em}

a {list-style: none;
color: #ffffff;
text-decoration: none}

#menu {
margin top: 1em
}

#imagenfondo {background-color: rgba(0, 0, 0, 0.45);
background-image:url(../img/menu.png);
 background-attachment: fixed;
    background-size: cover; }

#portada {background-image: url(../img/ingreso.png);
background-attachment: fixed;
background-size: cover}
h6{color: aliceblue;
font-family: "robotoblack";
font-size: 15px}

#agradecimiento{background-image: url(../img/agradecimiento.png);
background-attachment: fixed;
background-size: cover}

#botonventa {; margin-top: 74px;
margin-right: 100px;
}
#botoncompra {;margin-top: 230px;
margin-left: 101px; }

#engranaje {margin-left:0.5em;
padding-top: 0.2em}

#iconodelupa {margin-left:0.5em;
width: 15px;
padding-top: 0.5em}

#siguiente{ }

ul, ol {
				list-style:none;
			}
			
			.nav > li {
				float:none;
			}
			
			.nav li a {
				color:#fff;
				text-decoration:none;
				display:inline;
                padding: 0.1em
			}
			
			.nav li a hover {
				background-color:black;
			}
			
			.nav li ul {
				display:none;
				position:absolute;
                background-color: black; 
                
			}
.nav li:hover > ul {
				display:inline;
			}
			
			.nav li ul li {
				position:relative;
        
			}
			
			.nav li ul li ul {
				right:-150px;
				top:0px;
			} 

#volver{font-family: "robotoblack";
margin-top: 20em}

#mensajes2{width: 80px; margin-left: 1.5em
}

#pendiente{display: flex;
flex-direction: row;
margin-top: 1em;
margin-bottom: 1em;
align-self: center }

#sobreopen {width: 36px;
margin-left: 1.7em;
margin-top: 0.9em}

#pendiente h3{font-family: "robotothin";
font-size: 11px;
text-align: left;
margin-right: 3em;
margin-left: 0.8em;
background-color: #ffffff;
color: #eb5b0e;
border-radius: 0.6em;
padding: 0.5em;
}

#perfil2 {width: 80px; margin-left: 1em
    
}

#perfilparte1{display:flex; flex-direction: column;
padding-top: 1em;
}

#consulta {}

#iconocompra {width: 80px;
    margin-top: 15.7em;
    margin-right: 0.5em
}
#iconoventa {width: 80px;
    margin-bottom: 10.4em;
    margin-right: 1.8em
}

#siguiente3{margin-left:8em}

#fotodeperfilpestana{width: 100px;

    align-content: center;
align-items: center;
align-self: center;
margin-bottom: 0.5em;
margin-top: 0.5em;}

#perfil1 li {font-size:12px;
background-color: white;
    border-radius: 0.7em;
padding: 0.2em}

#perfil1 h6 {}