/*hoja de Estilos*/

/*font-family: 'Roboto', sans-serif;
font-family: 'Timmana', sans-serif;
font-family: 'Vidaloka', serif;*/


.title {
    display: block;
    margin-top: 15%;
    margin: 5%;
    font-family: sans-serif;
    font-size: 12px;
    align-content: center;
    text-align: center;
    color: #eaaf3a;
    font-family: 'Roboto';
    text-transform: uppercase;
    font-weight: 800;
    line-height: 1.2rem;
    letter-spacing: 2px;
    word-spacing: 14px;
    background-color: #000000;
    padding: 2%;

}




header {
    padding: 1%;
    max-width: 87.5%;
    margin: auto;
    background-color: coral;
    margin-top: 6%;
    color: floralwhite;
}



/*Body*/

html {
    display: flex;
    flex-direction: column;
    background-color: dodgerblue;
    background-image: url(img/img%20fondo2.png);
    background-repeat: repeat;
    justify-content: space-around;
    column-width: 100%;
}



section {  display: flex;
    flex-direction: column;
    align-content: center;
    justify-content: space-around;
    color: dodgerblue;
    max-width: inherit;
    align-content: center;
    align-items: center;
    margin: auto;
}


body{
    padding: 4% 1% 0% 1%;
    text-align: center;
    font-family: 'Roboto', sans-serif;
    color: #ffffff;
    max-width: 50%;
    margin: auto;
}


h2{
    color: coral;
    padding: 7% 2% 2% 2%;
        
}



h1{  display: flex;
    flex-direction: column;
    align-content: center;
    font-family: 'Timmana', sans-serif;
    font-size: 1.7rem;
    letter-spacing: 2px;
    color: #fcfcfc;
    line-height: 2rem;
}

p{   
    display: inline-block;
    align-content: center;
    margin-top: 15%;
    font-family:sans-serif;
    text-align: justify;
    font-size: 0.9rem;
    padding: 5% 15% 5% 15%;
    font-style: normal;
    line-height: 125%;
    color: #f7f7f7;
    column-width: 400px;
    background-color:dodgerblue;
    font-kerning: 200px;
}





.descripcion{
    margin: 5%;
    padding: 5%;
    color: floralwhite;
    line-height: 150%;
        
}



.volver{  
    display: flex;
    flex-direction: column;
    align-content: center;
    margin-top: 20%;
    font-family: 'Roboto';
    font-size: 1.5rem;
    color: #ffffff;
    background-color: #000000;
    list-style-type: none;
    padding: 2%;
    text-align: center;
}


footer { display: flex;
    flex-direction: column;
    align-content: center;
    align-items: center;
    background-color:dodgerblue;
    font-family: sans-serif;
    font-size: 50rem;
    font-stretch: normal;
    color: floralwhite;
    padding: 0% 0% 0% 0%;
}

figure {
    align-content: space-around;
}

.img{
    display: flex;
    flex-direction: column;
    align-content: center;
    flex-grow: 20%;
    justify-content: space-around;
    }


/*HYPERVINCULOS*/
a{
    font-family: 'Roboto';
    text-decoration: none;
}

a:link {
    color: #f78f00;
}


a:visited {
    color: #f78f00;
}


a:hover {
    color: #ffc555;
}


a:active {
    color: #df1919;
}

.disclaimer { display: flex;
    flex-direction: column;
    align-content: center;
    font-family: 'Roboto';
    background-color:#000000;
    font-size: 10px;
    margin-top: 10%;
    align-content: space-around;
    text-align: justify;
    padding: 4%;
}


.logo{
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    margin: center;
    width: 430px;
}


.polimorfia {
    display: flex;
    flex-direction: column;
    align-content: center;
    margin-top: 15%;
}

form{
    display: flex;
    flex-direction: column;
    align-content: center;
    justify-content: space-around;
    width: 100%;
    border: 0px;
    border-color: black;
    margin: 10 %;
    padding: 10 %;

    }

.formh1{
    color: #676767;
    font-size: 2.2rem;
    
}

.formh2{
    color: #f724f7;
    font-size: 1.6rem;
}

.formh3{
    color: #f724f7;
    font-size: 1.0rem;
}

label{
    font-size: 1.2 rem;
    display: block;
    flex-direction: column;
    align-content: center;
    justify-content: space-around;
    width: 100%;
    color: aliceblue;
    }


input, text area{
    margin-bottom: 35%;
    width: auto;
    height: 8 px;
    padding: inherit;
    box-sizing: border-box;
    border: 10 px;
    border-color: firebrick;
    }

input[focus], textarea[focus]{
    border: 1 px;
    }


input[type="submit"] {
    margin-bottom: inherit;
    background-color: #eaeaea;
    color: #888888;
    border: none;
    }


.rating {
  unicode-bidi: bidi-override;
  direction: rtl;
    background-color: #fcfc9a;
}
.rating > span {
  display: inline-block;
  position: relative;
  width: 1.1em;
}
.rating > span:hover:before,
.rating > span:hover ~ span:before {
   content: "\○";
   position: absolute;
    color: #525252;
}