html, body{width: 100%}

/*FONTS*/
@font-face {
    font-family: 'Rockford Sans';
    src: url('../web/fonts/n/roboto-10.woff2') format('woff2'),
        url('../web/fonts/n/roboto-10.woff') format('woff');
}

@font-face {
    font-family: 'Vistol Sans';
    src: url('../web/fonts/VistolSans-Light.woff2') format('woff2'),
        url('../web/fonts/VistolSans-Light.woff') format('woff');
}


/*NAV*/
nav.navbar {background: #000;}
.nav-link{color:white}
.navbar-brand img{/*width: 50%;*/margin-bottom: 0}
.navbar-toggler-icon span {background: #fff;display: block;padding: 1.5px;margin: 5px;}

/*GENERAL*/
body {
    font-family: 'Rockford Sans' !important;background: #000;color:#fff;font-size: 17px

    text-decoration: none;
    display: block;
    /*height: 48px;
    line-height: 48px;*/
    /*padding-left: 8%;*/
    /*letter-spacing: 0.03m;*/
    vertical-align: middle;
    font-size: 18px;
}
.title {

    /*font-family: 'Vistol Sans' !important;font-size: 4rem;font-weight: bold;padding-bottom: 20px*/

    font-family: 'Roboto', 'Noto Sans JP', sans-serif;
    color: var( --e-global-color-secondary );
    /* font-family: "Mabry", Sans-serif; */
    font-size: 40px;
    font-weight: normal;
    text-shadow: 1px 1px 1px rgb(0 0 0 / 30%);

}

#tutoriales .card{
    background-color: transparent;
    border: 3px solid #00a2ab;
    color:#fff;
    text-align: center;
    transition: all 200ms ease-in-out;
    -webkit-transition: all 200ms ease-in-out;
    -ms-transition: all 200ms ease-in-out;
    -moz-transition: all 200ms ease-in-out;
}

.btn {
    padding:5px 18px;
    border-radius: 50rem !important;
    transition: all 200ms ease-in-out;
    -webkit-transition: all 200ms ease-in-out;
    -ms-transition: all 200ms ease-in-out;
    -moz-transition: all 200ms ease-in-out;
}
.btn:hover, #tutoriales .card:hover {
    transform: scale(1.1,1.1);
    -webkit-transform: scale(1.1,1.1);
    -ms-transform: scale(1.1,1.1);
    -moz-transform: scale(1.1,1.1);
    font-weight: normal
}
.btn-primary{background-color:#00a2ab !important;border-color:#00a2ab !important}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary:disabled{background-color:#007379 !important;border-color:#007379 !important;box-shadow: 0 0 5px rgba(0, 115, 121, 0.5) !important;}
a:hover{color:#00a2ab;text-decoration: none;font-weight: bold}
.color{color:#00a2ab}
.card-body {padding: 2.25rem;}
.shadow-s{box-shadow: 0 .5rem 1rem rgba(0,0,0,.45)!important;margin-bottom: 5px;}
.card{border-radius: 1rem}
#nota{ color: #000;   background-color: #ffffff;}

/*IMAGES*/
.circle{border-radius: 50%;width:200px;height: 200px;overflow: hidden}
img.circle{width: auto;height: 95%}
.B1{border-radius: 1rem 1rem 0 1rem}
.B2{border-radius: 0 1rem 1rem 0}
.B3{border-radius: 1rem 0 1rem 1rem}
#banner{
    /*background: linear-gradient(rgba(0,0,0,.98),rgba(0,0,0,0)),
    url("/img/banner-home2.jpg") center center no-repeat;*/
    min-height: 630px;
      background-attachment: fixed;background-position: center;background-repeat: no-repeat;background-size: cover;width: 100%;background-size: cover !important;margin-top: -85px;}
/*#corporativo img{width:60px;height: 60px}*/

/*LISTAS*/
#beneficios li {
    margin-bottom: 0;
    line-height: 2
}
#beneficios li:before {
    /*content: "\f105";*/
    content: "\f058";
    font-family: FontAwesome;
    font-size: 18px;
    padding-left: 3px !important;
    margin-right: 15px;
    color: #00a2ab;
}

.listCheck li:before {
    /*content: "\f105";*/
    content: "\f058";
    font-family: FontAwesome;
    font-size: 18px;
    padding-left: 3px !important;
    margin-right: 15px;
    color: #00a2ab;
}

.listado li {
    margin-bottom: 0;
    line-height: 2
}
.listado li:before {
    /*content: "\f105";*/
    content: "\f058";
    font-family: FontAwesome;
    font-size: 18px;
    padding-left: 3px !important;
    margin-right: 15px;
    color: #00a2ab;
}


#planes {
    background-color: #000;
    color: #fff;
}

/*FOOTER*/
.footer{
	padding: 20px;
}
.footer{
    /*background-color: #00a2ab;*/
    background-color: #fff;
    color: #000;
}
.footer a{
    color: #000;
}

.ncolor {
    color:#00a4ac;
}