@import  'funciones';
@import  'colores';
#columns{
    position: relative;
    margin-bottom:50px;
    margin-top: 20px;
    .mdi-lock{
        color:$primario;
    }
    .row{
        //padding: 33px 0;
    }
    .login_simple{
        text-align: center;
    }
    h3{
        padding: 0 12px 3px;
        border-bottom: $terciario;
    }
    .inicio_redes{
        text-align: center;
        height: 100%;
        border: 1px solid $gris_bordes;
        padding:20px;
        min-height: 340px;
        margin-bottom:15px;
        // overflow: hidden;
        // display: flex;
        // display: -webkit-inline-flex;
        // display: -webkit-flex;
        // align-items: center;
        // flex-wrap: wrap;
        // justify-content: center;
        // align-content: center;
        // flex-flow: row wrap;
        // -webkit-align-items: center;
        // -webkit-flex-wrap: wrap;
        // -webkit-justify-content: center;
        // -webkit-align-content: center;
        // -webkit-flex-flow: row wrap;
        h3{
            flex:1 1;
            min-width: 100%;
        }
        h4{
            display: block;
        }
        .google, .facebook{
            display: block;
            padding:10px;
            img{
                width: 70px;
                height: auto;
            }
        }
    }
    .registro{
        .loginV2{
            padding:35px;
            border: 1px solid $gris_bordes;
            h3{
                margin-top: 0px;
                margin-bottom: 18px;
            }
        }

        .registrarse{
            float:right;
        }
    }
    .separado {
        display: inline-block;
        padding: 15px;
    }
    .form-group {
        margin: 0 0 10px 0;
        position:relative;
        &.email{
            text-align: left;
            input#email{
                display: inline;
                font-size: 18px;
                max-width: 100%;
            }       
            .mdi-email-outline{
                font-size: 34px;
                position: absolute;
                right: 3px;
                top: -1px;
                color:$color_gris_oscuro;
            }
        }
        &.passwd{
            text-align: left;
            input#passwd{
                display: inline;
                font-size: 18px;
                max-width: 100%;
            }
            .mdi-lock-outline{
                font-size: 34px;
                position: absolute;
                right: 3px;
                top: -2px;
                color:$color_gris_oscuro;
            }
        }
        &.lost_password {
            display: inline-block;
            margin: 14px 11px 15px 0;
            a {
                text-decoration: underline;
                &:hover {
                    text-decoration: none;
                }   
            }
        }
        &.no_registrado{
            padding-top: 10px;
            a{
                font-size: 18px;
            }
        }
    }
    p.submit{
        display: inline-block;
        padding-top: 12px;
        .boton{
            width: 100%;
            
            
        }
    }
}

/*****************************************************************
*** acceso cuando estas en tu cuenta
********************************************************************/
.mi-cuenta{
    text-align: center;
    margin-bottom: 20px;
    .page-heading{
        color: $color_gris_oscuro;
    }
    .addresses-lists {
        margin-bottom: 30px;
        margin-top: 30px;
        .myaccount-link-list{
            margin-bottom: 9px;
            li {
                overflow: hidden;
                padding-bottom: 10px;
                display: inline-block;
                margin: 0;
                width: 340px;
                padding: 5px;
                border: 0;
                font: inherit;
                font-size: 100%;
                vertical-align: baseline;
                a{
                    font-family: $fuente;
                    color: $colorDelDemonio;
                    display: block;
                    font-size: 22px;
                    overflow: hidden;
                    position: relative;
                    text-decoration: none;
                    text-shadow: 0 1px white;
                    text-transform: uppercase;
                    border: 1px solid;
                    border-color: #cacaca #b7b7b7 #9a9a9a #b7b7b7;
                    &:hover {
                        filter: none;
                        background: $gris;
                        border-color: #9e9e9e #c2c2c2 #c8c8c8 #c2c2c2;
                        color: $colorDelDemonio !important;
                    }
                    i{
                        color: $primarioHover;
                        font-size: 25px;
                        left: 0;
                        top: 0;
                        width: 52px;
                        padding: 10px 0 0 0;
                        text-align: center;
                    }
                    span {
                        line-height: 1;
                        display: block;
                        padding: 13px 15px 15px 17px;
                        overflow: hidden;
                    }
                }
                @media (max-width: 390px){
                    width: 254px;
                }
            }

        }
    }
    .cerrar_sesion{
        a{
            .boton{
                width: 200px;
                font-size: 18px;
            }
        }
    }
}
