﻿* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    
}
/*Contenedor*/
body {
    /*background: black;*/
    color: #6e237f;
    font-family: 'Neue Haas Grotesk Text Std'
}

.header {
    background: black;
    width: 100%;
    height: 100px;
}

.nav {
    background: black;
    width: 100%;
    height: 100%;
}

.main {
    background: rgb(88, 88, 239);
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
}

.section {
    background: black;
    width: 100%;
    height: 100%;
}


.aside {
    background: black;
    width: 25%;
    height: 100%;
    
    position:fixed;
    
    top:0px;
    right:0px;
     
}


.footer {
    background: black;
    width: 100%;
    height: 100%;
}


#container {
    background: white;
    width: 100%; /*Altura*/
    height: 100%; /*Ancho*/
    /*border-radius: 1px;*/ /*Esquinas ovaladas*/
    /*box-shadow: 0 10px 30px #000;*/ /*Sombra*/
    margin: 0px auto; /**/
    border: 1px solid #ffffff40; /**/
}

.filter {
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(5px);
    background-color: rgba(243,243,243,0.9);
}

.info {
    width: 100%;
    /*   color: white;*/
    font-family: 'carter one';
    font-size: 20px;
    text-align: center;
    margin: 10px auto;
    /*text-shadow: 0 10px 30px #000; Texto de cajas*/
    background-color: white;
}

.logo {
    width: 100%;
    height: 100%;
    max-width: 122px;
    max-height: 62px;
    margin-top: 4%;
    margin-left: 3%;
    /*
    margin-left: 8%;
    margin-top: 5%;
    margin-left: 30px;
    left: 10%;
    position: relative;
    */
    /*background-color: red;*/
    /*background: url(/images/cliente/logo_wtw.png);*/
}

.logosa {
    width: 100%;
    height: 100%;
    max-width: 379px;
    max-height: 93px;
    margin-top: 20%;
    margin-left: 3%;
    /*position: relative;*/
    /*background: url(/images/cliente/smart_auto.png);*/
    /*margin-left: 30px;
    margin-top: 40px;
        margin-left: 8%;
    */
}

.purpure {
    /*color: rgb(103, 15, 121);*/
    font-weight: bolder;
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
}

.purpuret {
    background: red;
    width: 100px;
    /*color: rgb(103, 15, 121);*/
    margin: 0;
    padding: 8px;
    text-align: left;
}

.userdata {
    margin-top: 45px;
    /*width: 200px;*/
    width: 100%;
    background-color: white;
}

.fblack {
    /*color: #000;*/
    background-color: white;
}


.boxt {
    padding: 5px;
    background-color: white;
}


.frmData {
    background: white;
    /*width: 400px;*/
    width:100%;
    margin-left: 40px;
}


.contenedor {
    background-color: white;
    width: 100%;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

    .contenedor figure {
        position: relative;
        width: 350px;
        height: 250px;
        overflow: hidden;
        border-radius: 6px;
        /*box-shadow: 0px 5px 25px rgba(0,0,0,0.50);*/
    }

        .contenedor figure img {
            width: 100%;
            height: 100%;
            transition: all 500ms ease-out;
        }

        .contenedor figure .capa {
            position: absolute;
            top: 0;
            width: 100%;
            height: 100%;
            background: rgba(11,103,123,0.6);
            transition: all 500ms ease-out;
            opacity: 0;
            visibility: hidden;
            text-align: center;
        }

        .contenedor figure:hover > .capa {
            opacity: 1;
            visibility: visible;
        }

            .contenedor figure:hover > .capa h3 {
                margin-top: 70px;
                margin-bottom: 15px;
            }

        .contenedor figure .capa h3 {
            /*color: #fff;*/
            font-weight: 400;
            margin-bottom: 12opx;
            transition: all 500ms ease-out;
            margin-top: 30px;
        }

        .contenedor figure .capa p {
            /*color: #fff;*/
            font-size: 15px;
            line-height: 1.5;
            width: 100%;
        }


/*Slide*/
.left {
    background-color: aqua;
    border: solid red;
    width: 33%;
    height: 50%;
}

.noslider {
    width: 100%;
    height: 100%;
    overflow: hidden;
}


.slider {
    width: 100%;
    height: 100%;
    background: red;
    overflow: hidden;
}

    .slider ul {
        display: flex;
        animation: cambio 15s infinite alternate linear;
        width: 400%;
    }

    .slider li {
        width: 100%;
        list-style: none;
    }

    .slider img {
        width: 100%;
        height: 100%;
    }

@keyframes cambio {
    0% {
        margin-left: 0;
    }

    20% {
        margin-left: 0;
    }

    25% {
        margin-left: -100%;
    }

    45% {
        margin-left: -100%;
    }

    50% {
        margin-left: -200%;
    }

    70% {
        margin-left: -200%;
    }

    75% {
        margin-left: -300%;
    }

    100% {
        margin-left: -300%;
    }
}


/*Formulario*/
.box {
    background-color: white;
}
.box .form .inputBx {
    position: relative;
    width: 180px;
    margin-bottom: 8px;
    /*margin-left: 40px;*/
    margin-left: -10px;
    background-color: white;
    /*color:rebeccapurple;*/
}

.box .form .chkstyle {
    text-align: center;
    margin: 20px;
    margin-left: 1px;
}






.inputBx {
    width:99%;

    text-align: left;
    padding: 10px;
    background-color: white;
    
}
.inputClass {
    width: 78%;
    height: 45px;
    margin-left: 5%;
    border: 1px solid #dddddd;
    background: white;
    font-family: 'Neue Haas Grotesk Text Std';
    color: purple;
}




.lblBx {
    background-color: white;
    color: red;
}

.remember{
    text-align: left;
    padding: 10px;
    background-color: white;
    color: grey;
    
}

.btnIntro {
    width: 100%;
    height: 100%;
    outline: none;
    border: 0px solid;
    padding: 0px 0px;
    margin: 0px;
    text-align: center;
    font-size: 23px;
    /*padding-left: 43px;*/
    background-color: #6e237f;
    font-family: 'Neue Haas Grotesk Text Std';
    color: white;
    cursor: pointer;
    margin-top: 7%;
}

/*
.btnIntro:hover {
    transform: scale(1.01);
}
*/

.btndiv {
    width: 78%;
    height: 70px;
    color: white;
    text-align: center;
    padding: 10px;
    margin-left: 5%;
    /*box-shadow: 1 0px 0.9px #000;*/ /*Sombra*/
    /*margin-left: 10px;*/
}

.mainMaster {
    background-color: #6e237f;
    width: 100%;
    height: calc(100vh - 200px);
    display: flex;
    justify-content: center;
    align-items: center;
}

#alertsOutput_login {
    margin-top: 0px;
    margin-left: 10px;
    width: 382px;
    height: 60px;
    background: white;
}

.alerta_exito {
    width: 100%;
    height: 100%;
    background: #cce5df;
    color: #007d61;
    font-size: large;
    text-align: center;
    font-weight: bold;
}

.alerta_error {
    width: 100%;
    height: 100%;
    background: #eed1d6;
    color: #a61932;
    font-size: large;
    text-align: center;
    font-weight: bold;
}

.alerta_advertencia {
    width: 100%;
    height: 100%;
    background: #cce5df;
    color: #007d61;
    font-size: large;
    text-align: center;
    font-weight: bold;
}
.alertsO {
    width: 400px;
    background: white;
    text-align: center;
}
.alert_conte {
    margin-top: 0px;
    margin-left: 0px;
    width: 100%;
    height: 100px;
    border-radius: 0px;
    padding-top: 1px;
    background: white;
    background: linear-gradient(180deg, #6e237f 50%, rgb(0 255 144) 50%);
    border: 1px solid #6e237f;
    color: white;
}

.alert_conte p{
    background-color: blueviolet;
    color: white;

}

.alertsrow {
    background-color: #6e237f;
    height: 50px;
    border-radius: 6px;
    padding-top: 5px;
    margin: 5px;
}

.alertText {
    color: white;
    background-color: #6e237f;
    opacity: 1;
    font-size: large;
    text-align: center;
}

@font-face {
    font-family: 'Graphik-Regular';
    src: url(Graphik-Regular.otf);
}

@font-face {
    font-family: 'Graphik-bold';
    src: url(GraphikBold.otf);
}

@font-face {
    font-family: 'Graphik-semibold';
    src: url(Graphik-Semibold.otf);
}

label {
    background: white;
    color: #6e237f;
    font-size: large;
    font-family: 'Graphik-bold','Sans-serif';
    /*font-family: 'Neue Haas Grotesk Text Std';*/
    font-weight: bold;
}

a {
    font-family: 'Neue Haas Grotesk Text Std'
}

.rememberme {
    background: white;
    color: #ffffff40;
    font-size: medium;
    font-family: 'Neue Haas Grotesk Text Std';
    text-align:right;
   
}

.chkstyle {
    width: 99%;
    padding: 10px;
    text-align: right;
    margin-top:3%;
}

.olvidaPass {
    /*width:380px;*/
    width: 99%;
    text-align: right;
    background-color: transparent;
    padding-left: 0%;
    padding-right: 2%;
}

.avisoPrivacidad {
    width: 97%;
    background: white;
    text-align: right;
    bottom:0;
}


.avisoPrivacidadTexto {
    color: #696969;
    font-weight: normal;
    font-size: small;
}