@charset "utf-8";

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

body { 
    display: flex;
    flex-direction: column;
    align-content: center;
    align-items: center;
    background-color: #D5D7D8;
}

header {
    display: flex;
    flex-direction: column;
    align-content: center;
    align-items: center;
    width: 100%;
}
.reg{
    float:right;
    cursor:pointer;
}
.olvide{
    position:absolute;
    cursor:pointer;
}
header figure {
    width: 50px;
    height: auto;
    margin-bottom: 10px;
    overflow: hidden;    
}
.aceptar{
    width:98%;
    margin:auto;
    margin-top:25px;
    
    
}
.links{
    margin-top:5px;
    font-family: 'open_sansregular';
    font-size:.8em;
    color:black;
}
.aceptar div{
    margin:auto;
    background-color:#4EA793;
    width:150px;
    height:40px;
    text-align:center;
    border-radius: 3px;
    float:right;
}
.aceptar div *{
    font-family: 'open_sansextrabold';
    line-height: 40px;
    color:white;
    cursor:pointer;
    
    
}
header .logo {
    display: flex;
    flex-direction: column;
    align-content: center;
    align-items: center;
    justify-content: space-between;
    background: #4EA793;
    padding: 5px;
    width: 100%;
    height: 40px;
    position: fixed;
    top: 0;
}

header .logo .interlogo {
    display: flex;
    flex-direction: row;
    align-items: center;
    align-content: center;
    justify-content: space-between;
    width: 100%;
    max-width: 700px;
    height: 40px;
    padding-left: 5px;
    padding-right: 5px;
}

header .logo .interlogo .media1 {
    display: none;    
}

header .logo .interlogo .media5 {
    display: none;
}

.pie {
    display: flex;
    flex-direction: row;
    align-items: center;
    align-content: center;
    justify-content: space-between;
    background: #4EA793;
    padding: 5px;
    width: 100%;
    height: 40px;
    position: fixed;
    bottom: 0;
}

.pie .interpie {
    display: flex;
    flex-direction: row;
    align-items: center;
    align-content: center;
    justify-content: space-between;
    width: 100%;
    padding-left: 5px;
    padding-right: 5px;
}

.inicio {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 72px;
    padding-left: 5px;
    padding-right: 5px;
    width: 100%;
    max-width: 700px;
}

.inicio .avatar {
    display: flex;
    flex-direction: column;
    align-items: center;
    align-content: center;
    width: 75%;
    max-width: 350px;
}

.inicio .avatar img {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
    width: 100%;
    height: auto;
}

.inicio .completar {
    display: flex;
    flex-direction: column;
    align-items: center;
    align-content: center;
    width: 100%;
    margin: 5px;
}


h1 {
    font-size: 1.2em;
}

h2 {
    font-size: 0.8em;
}

h3 {
    font-size: 0.7em;
}

h4 {
    font-size: 0.6em;
}

hr { 
    width: 100%;
    max-width: 700px;
    margin-top: 10px;
    margin-bottom: 10px;
}

form {
    width: 75%;
    max-width: 350px;
}

input[type=text] {
    width: 100%;
    padding: 5px 10px;
    margin-top: 5px;
}

select {
    width: 100%;
    border: #4EA793;
    border-radius: 2px;
    background-color: white;
}

input[type=button], input[type=submit], input[type=reset] {
    background-color: #4EA793;
    border: none;
    color: white;
    margin-top: 10px;
    padding: 16px 32px;
    text-decoration: none;
    margin: 10px 0;
    cursor: pointer;
}

/*---------------------------COMIENZA @MEDIA ALL-----------------------------*/




@media all and (min-width:750px){
    
    header .logo .interlogo {
    align-items: center;
    align-content: flex-end;
    justify-content: flex-end;
    }
    
    header .logo .interlogo .media1 {
        display: flex;
        flex-direction: row;
        align-items: center;
    }
    
    header .logo .interlogo .media2 {
        display: none; 
    }
    
    header .logo .interlogo .media3 {
        justify-content: flex-start;
        position: relative;
        right: 480px;
    }
    
     header .logo .interlogo .media5 {
        display: flex;
        flex-direction: row;
    }
    
    .pie .interpie {
        display: none;
    }
    
} /*fin de media all */