﻿body {
    font-family: Verdana, Geneva, Tahoma, sans-serif;
}



.title-section {
    font-family: Verdana,Geneva,sans-serif;
    text-align: center;
    font-weight: bold;
    font-size: 40px;
}

.title-beneficios {
    font-family: Verdana,Geneva,sans-serif;
    text-align: center;
    font-size: 21px;
    color: white;
    width: 300px;
}

.hr-title-beneficios {
    margin-bottom: 4%;
    width: 120%;
    border: 2px solid rgb(0, 160, 220);
    margin-left: -10%;
	height: 0!important;
}

.separation {
    margin-bottom: 5%;
    margin-top: 5%;
}

@media (min-width:200px) {
	.separation {
		margin-top: 55%;
	}
}
@media (min-width:300px) {
	.separation {
		margin-top: 40%;
	}
}
@media (min-width:400px) {
	.separation {
		margin-top: 30%;
	}
}
@media (min-width:500px) {
	.separation {
		margin-top: 20%;
	}
}
@media (min-width:700px) {
	.separation {
		margin-top: 10%;
	}
}
.text-p-center {
    text-align: justify;
    ,sans-serif;
    font-size: 1vw;
    font-family: Verdana,Geneva color: #1D1D1B;
    letter-spacing: 0px;
}

.img-beneficios {
    width: 103%;
}

.button-baner {
    width: 30%;
}

.text-p-beneficios {
    font-family: Verdana,Geneva,sans-serif;
    font-size: 1.3vw;
    color: white;
    letter-spacing: 2px;
}

.border-beneficios {
    /** border-right-style: solid;
            border-right-color: #00A0DC;*/
}

.image-beneficios {
    width: 140px;
    height: 140px;
}

.image-Productos {
    width: 80px;
    height: 80px;
}

.no-border-beneficios {
    /* border: none;*/
}

.beneficios-text {
    text-align: center;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    font-size: 16px;
    color: #575756;
    margin-top: 10px;
}

.contenedor {
    position: relative;
    display: inline-block;
    text-align: center;
}

.texto-encima {
    position: absolute;
    top: 10px;
    left: 10px;
}

.centrado {
    position: absolute;
    top: 70%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.text-footer {
    font-family: Verdana,Geneva,sans-serif;
    font-size: 14px;
    margin-top: 2%;
}

.text-links-footer {
    font-family: Verdana,Geneva,sans-serif;
    text-align: center;
    font-size: 14px;
    margin-top: 2%;
}

.footer-lockton {
    background: black;
    color: white;
}

.hr-title {
	font-family: Verdana,Geneva,sans-serif;
	border: 3px solid #00A0DC;
	border-radius: 5px;
	width: 23%;
	margin-top: -1%;
	margin-bottom: 4%;
	margin: 0 auto;
	height:0 !important;
}

.popover {
    top: 93px;
    left: 1143.84px;
    display: block;
    padding: 0px;
    width: 100%;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 30px;
    background: #0083C7 0% 0% no-repeat padding-box;
    box-shadow: 0px 3px 6px #00000029;
    opacity: 1;
}

.popover-content {
    padding: 9px 14px;
    background: #0083C7 0% 0% no-repeat padding-box;
    opacity: 1;
}

.popover.bottom > .arrow:after {
    border-bottom-color: #0083C7;
}

.fa {
    color: #0097C6;
}

.social-media-block {
    margin-top: 2%;
    letter-spacing: 10px;
}

#content_div_one_photo {
    height: 16rem;
    width: 11rem;
    border-radius: 10px;
    border: 5px solid black;
}

#padre {
    position: relative; /* para poder posicionar el texto de forma absoluta */
    display: inline-block; /* para que solo ocupe el ancho de la imagen */
}

.card-title {
    position: absolute; /* posición absolute con respecto al padre */
    bottom: 0; /* posicionada en la esquina inferior derecha */
    right: 1rem;
}

.row {
	margin-right: 0px;
	margin-left: 0px;
}

.input-group-prepend {
    width: 100%;
    margin-bottom: 10%;
}

.button-login {
    margin-top: 10%;
    width: 100%;
    border-radius: 20px;
    border-color: gray;
    background: transparent linear-gradient(180deg, #0083C7 0%, #002436 100%) 0% 0% no-repeat padding-box;
    border: 3px solid #9B9B9B;
    opacity: 1;
    color: white;
    font-size: 14pt;
    border:none;
}

tb1.note:before {
    content: "Enter your number";
}

#basic-addon1 {
    background: white;
    border: 0;
    box-shadow: none;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
    border-color: white;
    margin-left: -3px;
}

#basic-addon2 {
    background: white;
    border: 0;
    box-shadow: none;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
    border-color: white;
    margin-left: -3px;
}

.input-login {
    border-top-left-radius: 15px !important;
    border-bottom-left-radius: 15px !important;
    border-style: none;
    height: 45px;
}

.label-register {
    margin-top: 5%;
    margin-bottom: 10%;
}

.icon-menu {
    display: inline;
    background: transparent;
    border: 0;
}

.icon-header{
	font-size:28px;
	vertical-align:middle;
}

.call-item-link {
    /**   background: black;
            border-radius: 20px;
            color: white;
            padding: 5px;
            margin-top: 15px;
    height: 42px;
    width: 142px;*/
    background: #20191A 0% 0% no-repeat padding-box;
    border-radius: 22px !important;
    margin-top: 15px;
    padding: 10px !important;
    background: white;
    height: 34px;
    width: 150px;
    letter-spacing: 2px;
    padding-top: 5px !important;
}

.user-item-link {
    /**   background: black;
            border-radius: 20px;
            color: white;
            padding: 5px;
            margin-top: 15px;
    height: 42px;
    width: 142px;
    background: transparent linear-gradient(90deg, #0076A2 0%, #008BB8 67%, #0097C6 100%) 0% 0% no-repeat padding-box;
    border-radius: 22px !important;
    margin-top: 12px;
    padding: 10px !important;
    border: 1px solid #A3A3A3;
        */
    border-radius: 22px !important;
    margin-top: 15px;
    padding: 10px !important;
    background: transparent linear-gradient(90deg, #0076A2 0%, #008BB8 67%, #0097C6 100%) 0% 0% no-repeat padding-box;
    height: 34px;
    width: 155px;
    letter-spacing: 1px;
    padding-top: 3px !important;
}

.margin-page {
    margin-top: 8%;
    margin-left: 4%;
}

#FormEmision {
    height: inherit;
    margin-left: 2%;
    /*margin-top: 3%;*/
}

.label-name-login {
    display: inline;
}

#FormaRegister {
    margin-top: 5%;
    margin-left: 5%;
    margin-bottom: 5%;
}

.img-login-web {
    padding-right: 10px;
    width: 40px;
}

.img-login-user-web {
    padding-right: 10px;
    width: 35px;
}

.span-circle {
    background: black 0% 0% no-repeat padding-box;
    padding-top: 8px;
    padding-bottom: 8px;
    padding-left: 3px;
    padding-right: 3px;
    border-radius: 50%;
    margin-left: -5px;
    margin-right: 5px;
}

.span-img {
    height: 22px;
    width: 22px;
}

.carousel {
    /**margin-left: 15%;
            margin-right: 15%;*/
    margin-top: 7%;
}

ul.slides {
    display: block;
    position: relative;
    height: 500px;
    margin: 0;
    padding: 0;
    overflow: hidden;
    list-style: none;
}

.slides * {
    user-select: none;
    -ms-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -webkit-touch-callout: none;
}

ul.slides input {
    display: none;
}


.slide-container {
    display: block;
}

.slide-image {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    opacity: 0;
    transition: all .7s ease-in-out;
}

    .slide-image img {
        width: auto;
        min-width: 100%;
        height: 67%;
        margin-top: 5%;
    }

.carousel-controls {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 999;
    font-size: 100px;
    line-height: 600px;
    color: #fff;
}

    .carousel-controls label {
        display: none;
        position: absolute;
        padding: 0 20px;
        opacity: 0;
        transition: opacity .2s;
        cursor: pointer;
    }

.slide-image:hover + .carousel-controls label {
    opacity: 0.5;
}

.carousel-controls label:hover {
    opacity: 1;
}

.carousel-controls .prev-slide {
    text-align: left;
    left: 0;
}

.carousel-controls .next-slide {
    text-align: right;
    right: 0;
}

.carousel-dots {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 20px;
    z-index: 999;
    text-align: center;
}

    .carousel-dots .carousel-dot {
        display: inline-block;
        width: 30px;
        height: 30px;
        border-radius: 50%;
        background-color: #fff;
        opacity: 0.5;
        margin: 10px;
    }

input:checked + .slide-container .slide-image {
    opacity: 1;
    transform: scale(1);
    transition: opacity 1s ease-in-out;
}

input:checked + .slide-container .carousel-controls label {
    display: block;
}

input#img-1:checked ~ .carousel-dots label#img-dot-1,
input#img-2:checked ~ .carousel-dots label#img-dot-2,
input#img-3:checked ~ .carousel-dots label#img-dot-3,
input#img-4:checked ~ .carousel-dots label#img-dot-4,
input#img-5:checked ~ .carousel-dots label#img-dot-5,
input#img-6:checked ~ .carousel-dots label#img-dot-6 {
    opacity: 1;
}


input:checked + .slide-container .nav label {
    display: block;
}


ul.a {
    list-style-type: disc;
    font-size: 2vw;
    margin-left: 8%;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
}

ul > li {
    color: #0097C6;
}

.quote-index {
    /** font-size: 23pt;*/
    color: white;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    font-weight: 100;
}

.title-banner-2 {
    color: white;
    text-align: center;
    margin-top: 10%;
    font-size: 2vw;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
}

.title-banner-3 {
    color: white;
    text-align: center;
    font-size: 1.5vw;
    margin-top: 5%;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    margin-bottom: 8%;
}

.button-banner {
    background: transparent linear-gradient(90deg, #0076A2 0%, #008BB8 67%, #0097C6 100%) 0% 0% no-repeat padding-box;
    border: 1px solid #A3A3A3;
    padding: 9px;
    font-size: 16px;
    border-radius: 30px;
    margin-top: 5%;
    letter-spacing: 9px;
}

#navbarResponsive {
    margin-right: 3%;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
}

#navbarDropdown {
    width: auto;
}

.image-header {
    width: 80%;
    height: auto;
    margin-top: -8%;
    margin-left: 30%;
    max-height: 80px;
}

.separator-beneficios-blue {
    margin-top: 2%;
    width: 2px;
    background: #00A0DC;
    margin-left: -3px;
    height: 170px;
	padding-left:0;
	padding-right:0;
}

.separator-beneficios-blue-middle {
	margin-top: 2%;
	width: 2px;
	background: #00A0DC;
	margin-left: -3px;
	height: 170px;
	padding-left: 0;
	padding-right: 0;
}

.icon-image-menu {
    width: 28px;
    height: 28px;
}

.link-icon {
    margin-top: 3px;
}

.pasos-banner {
    min-width: 60%;
    margin-top: 4%;
    width: 600px;
}

.modal-content-login {
    height: 100%;
    background: #232322 0% 0% no-repeat padding-box;
}

.modal-login {
    height: 100%;
    margin-top: 0%;
}

.model-header-login {
    border-bottom: 1px solid black;
    border: none;
}

.banner-izq {
    /*width: 42vw !important;
    height: 28vw !important;
    width: 110% !important;*/
    margin-top: 5%;
    margin-left: -15px;
    width: 110%;
}

.banner-izqProd {
    /*width: 42vw !important;
    height: 28vw !important;
    width: 110% !important;*/
    margin-top: 0%;
    margin-left: 0px;
    width: 110%;
}

.prod-text {
    text-align: center;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    font-size: 16px;
    color: white;
    margin-top: 10px;
}

.title-icon_prod {
    font-weight: bolder;
    color: white;
    margin-top: -2px;
}

.banner-der {
    /* height: 480px;
    height: 32vw !important;*/
    background-image: url(../../img/icons/circulo2.png) !important;
    background-size: 245px !important;
    background-repeat: no-repeat !important;
    /* margin-top: 1%; */
    backdrop-filter: none;
    background-position: right !important
}

.navbar {
    box-shadow: none;
}

body {
    background: white;
}

.custom-file-control, .form-control, .is-focused .custom-file-control, .is-focused .form-control {
    background-image: linear-gradient(0deg,#0083C7 2px,rgba(0,150,136,0) 0),linear-gradient(0deg, darkgray 1px,transparent 0);
}

.modal-login2 {
    height: 100%;
    background: #232322 !important;
}

.modal-dialog-login {
    background: #232322 !important;
}

.modal-content-login {
    background: #232322 !important;
    box-shadow: none;
}

.anterior-carousel {
    width: 100px;
    height: 100px;
}

.posterior-carousel {
    width: 100px;
    height: 100px;
}

.carousel-control-next, .carousel-control-prev {
    opacity: 1 !important;
}

.anterior-button {
    margin-left: -12%;
    margin-top: -3%;
}

.posterior-button {
    margin-top: -3%;
    margin-right: -11%;
}

.title-blog {
    color: black;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    font-size: 16px;
    font-weight: bolder;
}

.description-blog {
    color: #575756;
    font-size: 12px;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
}

.date-blog {
    margin-top: 5%;
    font-size: 12px;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
}



.control-next {
    background-size: 235px;
    background-repeat: no-repeat;
    margin-top: 1%;
}

.header-login-movil {
    background-image: url("../../img/icons/circulo-movil.png");
    background-size: 200px;
    background-repeat: no-repeat;
    background-position: right;
    background-position-y: top;
}

.footer-login-movil {
    background-image: url("../../img/icons/circulo-movil-bottom.png");
    background-size: 150px;
    background-repeat: no-repeat;
    background-position: left;
    background-position-y: top;
}

.index-editar-perfil {
    margin-top: 5%;
    margin-left: 5%;
}

#FormCotizacion {
    margin-left: 3%;
    margin-top: 8%;
}

#margin-page {
    margin-top: 12%;
}

.img-logo-footer {
    margin-bottom: 1%;
    margin-top: 2%;
}

.menu-web {
    width: 280px;
    padding: 20px;
    left: auto;
    right: 0;
    font-size: 14px;
    background: #0083C7 0% 0% no-repeat padding-box;
}

.input-login {
    background: white;
    padding: 10px;
}

.text-input-web {
    width: 200px;
}

.menu-logueado {
    width: 250px;
    font-size: 14px;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    max-height:400px;
    overflow-y:auto;
}

.label-name-login {
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    color: white;
}

#navBarPrincipal {
    position: fixed !important;
}

.input-login-movil {
    margin-bottom: 20px;
    margin-left: -24%;
}

.input-login-movil-pass {
    margin-bottom: 20px;
    margin-left: -35%;
}


#background-cotizacion {
    background-image: url(../../img/welcome/medio-circulo-top.png), url(../../img/welcome/welcome_background.png);
    background-position: left, /* this positions the first image */
    top;
    height: 360px;
    background-size: auto, contain;
    margin-top: 6%;
    background-repeat: no-repeat;
}

#background-casaHabitacion {
    background-image: url(../../img/welcome/welcome_casaHabitacion.jpg);
    background-position: left, /* this positions the first image */
    top;
    height: 360px;
    background-size: auto, contain;
    margin-top: 6%;
    background-repeat: no-repeat;
}

.welcome-user {
    margin-top: 6%;
    margin-bottom: 6%;
    color: white;
	padding:0 !important;
}

.welcome-label {
    padding: 25px;
    background: black;
    font-size: 30px;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    font-weight: bolder;
    padding-right: 60px;
    border-top-right-radius: 40px;
    border-bottom-right-radius: 40px;
}

.welcome-title {
    font-weight: bolder;
    font-size: 32px;
    margin-left: 5%;
    margin-top: 1%;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
}

.zoom {
    transition: 1.5s ease;
    -moz-transition: 1.5s ease; /* Firefox */
    -webkit-transition: 1.5s ease; /* Chrome - Safari */
    -o-transition: 1.5s ease; /* Opera */
}

    .zoom:hover {
        transform: scale(1.2);
        -moz-transform: scale(1.2); /* Firefox */
        -webkit-transform: scale(1.2); /* Chrome - Safari */
        -o-transform: scale(1.2); /* Opera */
        -ms-transform: scale(1.2); /* IE9 */
    }

.title-icon {
    font-weight: bolder;
    color: black;
    margin-top: -2px;
}

.background-welcome-bottom {
    background-image: url(../../img/welcome/medio-circulo-bottom.png) !important;
    background-repeat: no-repeat;
    background-position: right;
}

.title-modal {
	font-size: 28px;
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	color: black;

	margin-bottom: 15px;
	letter-spacing: 2px;
}

.sub-title-modal {
	font-size: 14px;
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	color: #009EE2;
	vertical-align: middle;
	padding: 15px;
}

.title-contact-modal {
    font-size: 28px;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    color: black;
    padding-bottom: 15px;
    display: table;
    margin: 0 auto !important;
    letter-spacing: 2px;
}

.sub-title-contact-modal {
    font-size: 14px;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    color: #009EE2;
    padding-bottom: 15px;
    display: table;
    margin: 0 auto !important;
}

.navbar-nav .nav-link {
    margin-left: 20px;
}
.span-contact-modal {
    font-size: 18px;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    color: #575756;
    padding-bottom:15px;
    display:table;
    margin: 0 auto !important;
}
.tel-contact-modal {
    font-size: 18px;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    color: #575756;
   /* margin-left: 37%;*/
    margin-bottom: 15px;
}

.whats-contact-modal {
    font-size: 18px;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    color: #575756;
   /* margin-left: 6%;*/
    margin-bottom: 15px;
}


.mail-contact-modal {
    font-size: 18px;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    color: #575756;
   /* margin-left: 24%;*/
    margin-bottom: 15px;
}

#modalContact {
    margin-top: 15%;
}

#ModalContentConfirmaCompra {
    margin-top: 30%;
}


.button-banner-conocemas {
    margin-bottom: 5%;
}

.button-banner-cotiza {
    margin-bottom: 18%;
}


/**Nuevo Slider */

#element1 {
    display: inline-block;
    margin-right: 10px;
    width: 200px;
    background-color: red;
}

#element2 {
    display: inline-block;
    width: 200px;
    background-color: red;
}

.title-instruction {
    font-size: 14px;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    font-weight: bolder;
}

.subtitle-form-2 {
    font-size: 20px;
    margin-top: 2%;
    font-weight: bolder;
    font-family: verdana;
}


table.table-bordered {
    border: 1px solid #0090DF;
    margin-top: 20px;
}

    table.table-bordered > thead > tr > th {
        border: 1px solid #0090DF;
    }

    table.table-bordered > tbody > tr > td {
        border: 1px solid #0090DF;
    }

.border-right-td {
    border-right: solid;
    border-color: #0090DF;
}

.border-bottom-th {
    border-bottom: 1px solid #0090DF ;
    border-color: #0090DF ;
    text-align: center;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    font-size: 11px;

}

.dataTables_scroll {
    /*border-bottom: 1px solid #0090DF ;*/
    border-color: #0090DF ;
}

.dataTables_scrollBody {
    /*border-bottom: 1px solid #0090DF ;*/
    border-color: #0090DF ;
}


@media screen and (min-device-width: 375px) and (max-device-width: 667px) and (-webkit-min-device-pixel-ratio: 2) {
    ul .slides {
        display: block;
        position: relative;
        height: 900px;
        margin: 0;
        padding: 0;
        overflow: hidden;
        list-style: none;
    }
    #modaldialog-InicioSesion {
        margin-top: 50%;
    }
    #modaldialog-msBotonComprar {
        margin-top: 50%;
    }
}
@media only screen and (max-width:568px) {
    .navbar {
        height: 98px;
    }
    #modaldialog-InicioSesion {
        margin-top: 50%;
    }
    #modaldialog-msBotonComprar {
        margin-top: 50%;
    }
}
@media screen and (min-width: 1200px) and (max-width:2000px) {

    #modaldialog-InicioSesion {
        margin-top: 20%;
    }

    #modaldialog-msBotonComprar {
        margin-top: 20%;
    }
}
@media screen and (min-width: 500px) and (max-width:600px) {

    #modaldialog-InicioSesion {
        margin-top: 50%;
    }

    #modaldialog-msBotonComprar {
        margin-top: 50%;
    }
}
@media screen and (min-width: 800px) and (max-width:1200px) {

    #modaldialog-InicioSesion {
        margin-top: 50%;
    }

    #modaldialog-msBotonComprar {
        margin-top: 50%;
    }
}
@media screen and (min-width: 768px) and (max-width:1024px) {

    #modaldialog-InicioSesion {
        margin-top: 50%;
    }

    #modaldialog-msBotonComprar {
        margin-top: 50%;
    }
}
#navbarResponsive{
    background-color: inherit;    
}
.navbar-ColorCustom{
    background-color:black;
}
#navBarPrincipal {
    background-color: black;
}
/*.btn-modal {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -20px;
    margin-left: -100px;
    width: 200px;
}*/

.nav-tabs {
	border-bottom: 1px solid #dee2e6;
}

.form-control {
	display: block;
	width: 100%;
	padding: .375rem .75rem;
	font-size: 1rem;
	line-height: 1.5;
	color: #495057;
	background-color: #fff;
	background-clip: padding-box;
	border: 1px solid #ced4da;
	border-radius: .25rem;
	transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.btn-link {
	font-weight: 400;
	color: #007bff;
	background-color: transparent;
}

a {
	color: #007bff;
	text-decoration: none;
	background-color: transparent;
	-webkit-text-decoration-skip: objects;
}
