/*

Style : Blue Theme CSS
Version : 1.0
Author  : Surjith S M
URI   : http://themeforest.net/user/surjithctly

Copyright © All rights Reserved
Surjith S M / @surjithctly

*/


/* 
   COLOR PALLETTES : Blue
   ------------------------------------------------
  
   Blue 1        : #1c9cdd;
   Dark Grey      : #3b3b3b;
   Medium Grey    : #5c5c5c;
   Light Grey     : #818181;
   Lightest Grey  : #C2C2C2;
   White          : #ffffff;

   
   */


/* ================================================
   THEME SPECIFIC STYLES : VISUAL STYLES ONLY
   ================================================ */


/*White*/

body {
    background: #fff;
}

.appointment-form .form-header h4,
.appointment-form .form-header a {
    /* color: #FFF; */
}
.azuladeslas {
  color: #1c9cdd;
}
.grisadeslas {
  color: rgb(101, 102, 97);
}
/*Grey*/

.headline-support {
    float: left;
    text-align: center;
    color: #f89829;
    font-size: 34px;
}

body,
.timeline-content h2 {
    color: #5c5c5c;
}

.nav-pills>li>a {
    color: #C2C2C2;
}

.form-control:focus {
    border-color: #C2C2C2;
}

.navbar-default .navbar-nav>li>a {
    color: #818181;
}

.slick-prev:before,
.slick-next:before {
    color: #C2C2C2;
}

.header,
.sub-header {
    /* Fondo gris  claro debajo de imagen de cabecera 
    background-color: #f7f7f5; */
}

.text-dark {
    color: #3b3b3b!important;
}


/* red
 * ----- */

::-moz-selection {
    background: #1c9cdd;
    color: #FFF;
}

::selection {
    background: #1c9cdd;
    color: #FFF;
}


/* Contrast
 * -------- */

/*color*/

a,
a:hover,
a:focus,
.speaker-info p,
.highlighted-plan .price,
.highlighted-plan .plan-name,
.benefit-item .benefit-icon i,
.text-highlight,
.phone-icon,
.checklist i {
    color: #1c9cdd;
    text-decoration: none;
}

.loimportante {
    font-size: 26px;
    font-weight: bolder;
}

.tresmesesbannertext {
    padding-top: 17px;
}

.tresmeses-big{
    font-size: 42px;
    font-weight: bolder;
    margin-left: 172px;
}

.tresmeses-renovacion {
    margin-left: 270px;
}

.tresmeses-centra-vertical{
    margin-top: 21px;
}

.text-highlight-big {
    color: #1c9cdd;
    font-size: 4em;
    font-weight: bold;
}

.text-highlight-big-tresmeses {
    color: #1c9cdd;
    font-size: 6em;
    font-weight: bold;
    display: block;
    position: absolute;
    margin-left: 100px;
    margin-top: -26px;
}

.btn-centrar-solictarllamada {
    width: 100%
}

.text-highlight-big .rojo {
    color: #b32c33;
}

.text-highlight-big .morado {
    color: #c7aed0;
}

.text-highlight-big .negro {
    color: black;
}

.text-highlight-big .verde {
    color: #a3bf2a;
}

.text-highlight-big .amarillo {
    color: yellow;
}

.faldontresmesesYasesor-primero {
    background: #FAFAFA;
    /* margin-top: 45px; */
    margin-top: 35px;
    border-top-width: 2px;
    border-right-width: 2px;
    border-bottom-width: 0px;
    border-left-width: 2px;
    border-top-style: solid;
    border-right-style: solid;
    border-bottom-style: none;
    border-left-style: solid;
    border-top-color: rgb(238, 238, 238);
    border-right-color: rgb(238, 238, 238);
    border-left-color: rgb(238, 238, 238);
    -moz-border-top-colors: none;
    -moz-border-right-colors: none;
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    border-image-source: none;
    border-image-slice: 100%;
    border-image-width: 1;
    border-image-outset: 0;
    border-image-repeat: stretch stretch;
}

.faldontresmesesYasesor {
    background: #FAFAFA;
    margin-bottom: 35px;
    border-top-width: 0px;
    border-right-width: 2px;
    border-bottom-width: 2px;
    border-left-width: 2px;
    border-top-style: none;
    border-right-style: solid;
    border-bottom-style: solid;
    border-left-style: solid;
    border-right-color: rgb(238, 238, 238);
    border-bottom-color: rgb(238, 238, 238);
    border-left-color: rgb(238, 238, 238);
    -moz-border-top-colors: none;
    -moz-border-right-colors: none;
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    border-image-source: none;
    border-image-slice: 100%;
    border-image-width: 1;
    border-image-outset: 0;
    border-image-repeat: stretch stretch;
}

.faldon-n1enseguros-primero {
    background: #FAFAFA;
    border-bottom-style: none;
    border: 2px solid #eeeeee;

}

.faldon-n1enseguros-segundo {
    background: #FAFAFA;
    border: 2px solid #eeeeee;
    border-top-style: none;
}

.centratexto {
    text-align: center;
}

.textoaladerecha {
    text-align: right;
}

.textoalaizquierda {
    text-align: left;
}
.fondoblancoadeslas {
    /* background-color: #FFF; */
    color: #a3c02a;
    text-align: center;
    padding-top: 8px;
    padding-bottom: 8px;
    font-size: 22px;
}
.fondoblancoadeslasletraazul {
    background-color: #FAFAFA;
    color: #1c9cdd;
    /* text-align: center; */
    padding-top: 24px;
    font-size: 22px;
}
.fondogrisletragris {
    background-color: #FAFAFA;
    color: rgb(101, 102, 97);
    text-align: center;
    /*padding-top: 24px;
    font-size: 22px;*/
}
.fondoazuladeslas {
    background-color: #1c9cdd;
    text-align: center;
    padding-top: 8px;
    font-size: 22px;
}

.fondoazuladeslas-trasnparente {
    /* background: rgba(0, 174, 255, 0.2); */
}

.titulos-fondo-gris {
    background: rgba(128, 125, 125, 0.8);
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
    position: absolute;
    margin-top: 153px;
}

.titulos-fondo-fucsia {
    background: rgba(28,156, 221, 0.8);
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
    position: absolute;
    margin-top: 153px;
}

.titulos-fondo-verde {
    background: rgba(143, 198, 65, 0.8);
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
    position: absolute;
    margin-top: 153px;
}

.titulos-fondo-lila {
    background: rgba(221, 28, 200, 0.8);
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
    position: absolute;
    margin-top: 153px;
}

.titulos-fondo-rojo {
    background: rgba(255, 0, 0, 0.6);
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
    position: absolute;
    margin-top: 153px;
}

.titulos-fondo-azul {
    background: rgba(25, 177, 251, 0.8);
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
    position: absolute;
    margin-top: 153px;
}

.titulos-fondo-naranja {
    background: rgba(229, 175, 44, 0.8);
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
    position: absolute;
    margin-top: 153px;
}

.hogar {
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
    position: absolute;
    margin-top: 0px;
    width: 33%;
}

.hogar:after {
    content: '';
    display: block;
    height: 30px;
    margin-left: 12px;
    background: url("/images/sprite-menu.png") 0 -64px no-repeat;
}

.negocios {
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
    position: absolute;
    margin-top: 41px;
    margin-left: 74px;
    width: 40%;
}

.negocios:after {
    content: '';
    display: block;
    height: 30px;
    margin-left: 26px;
    background: url("/images/sprite-menu-pymes.png") -4px -0 no-repeat;
}

.auto {
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
    position: absolute;
    margin-top: 0px;
    margin-left: 167px;
    width: 33%;
}

.auto:after {
    content: '';
    display: block;
    height: 30px;
    margin-left: 29px;
    background: url("/images/sprite-menu.png") 0 -94px no-repeat;
}

.proteccion {
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
    position: absolute;
    margin-top: 103px;
    margin-left: 0px;
    height: 95px;
    width: 50%;
}

.proteccion:after {
    content: '';
    display: block;
    height: 30px;
    margin-left: 40px;
    background: url("/images/sprite-menu.png") 0 -126px no-repeat;
}

.decesos {
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
    position: absolute;
    margin-top: 103px;
    margin-left: 50%;
    height: 95px;
    width: 50%;
}

.decesos:after {
    content: '';
    display: block;
    height: 30px;
    margin-left: 59px;
    background: url("/images/decesos.jpg") no-repeat scroll 0 0 / 55% auto;
}

.hogarpopup {
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
    position: absolute;
    margin-top: 0px;
    width: 33%;
}

.hogarpopup:after {
    content: '';
    display: block;
    height: 30px;
    margin-left: 12px;
    background: url("/images/sprite-menu.png") 0 -64px no-repeat;
}

.negociospopup {
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
    position: absolute;
    margin-left: 54px;
    width: 40%;
}

.negociospopup:after {
    content: '';
    display: block;
    height: 30px;
    margin-left: 85px;
    background: url("/images/sprite-menu-pymes.png") -4px -0 no-repeat;
}

.autopopup {
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
    position: absolute;
    margin-top: 0px;
    margin-left: 167px;
    width: 33%;
}

.autopopup:after {
    content: '';
    display: block;
    height: 30px;
    margin-left: 77px;
    background: url("/images/sprite-menu.png") 0 -94px no-repeat;
}

.proteccionpopup {
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
    position: absolute;
    margin-top: 66px;
    margin-left: 0px;
    height: 95px;
    width: 50%;
}

.proteccionpopup:after {
    content: '';
    display: block;
    height: 30px;
    margin-left: 40px;
    background: url("/images/sprite-menu.png") 0 -126px no-repeat;
}

.decesospopup {
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
    position: absolute;
    margin-top: 66px;
    margin-left: 110px;
    height: 95px;
    width: 50%;
}

.decesospopup:after {
    content: '';
    display: block;
    height: 30px;
    margin-left: 113px;
    background: url("/images/iconodecesos.jpg") no-repeat scroll 0 0 / 50% auto;
}

.text-muted-20pc {
    font-size: 14px;
    color: #898989;
    text-align: center;
    float: left;
    text-align: center;
    width: 100%;
}

.text-muted-popup {
    font-size: 14px;
    color: #898989;
    float: left;
    text-align: justify;
    width: 100%;
    margin-top: 12px;
    margin-bottom: 12px;
    text-shadow: initial;
}

.separador {
    content: '';
    position: absolute;
    width: 100%;
    height: 1px;
    left: 0;
    background: rgba(255, 255, 255, 0);
    background: -moz-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(227, 227, 227, 1) 27%, rgba(227, 227, 227, 1) 70%, rgba(254, 254, 254, 0) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(27%, rgba(227, 227, 227, 1)), color-stop(70%, rgba(227, 227, 227, 1)), color-stop(100%, rgba(254, 254, 254, 0)));
    background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(227, 227, 227, 1) 27%, rgba(227, 227, 227, 1) 70%, rgba(254, 254, 254, 0) 100%);
    background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(227, 227, 227, 1) 27%, rgba(227, 227, 227, 1) 70%, rgba(254, 254, 254, 0) 100%);
    background: -ms-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(227, 227, 227, 1) 27%, rgba(227, 227, 227, 1) 70%, rgba(254, 254, 254, 0) 100%);
    background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(227, 227, 227, 1) 27%, rgba(227, 227, 227, 1) 70%, rgba(254, 254, 254, 0) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#fefefe', GradientType=1);
}

.text-20pc{
    color: #1c9cdd;
    font-size: 2em;
}

.text-10pc{
    color: #a3bf2a;
    font-size: 2em;
}
.text-10pc, .azul{
    color: #1c9cdd;
}
.text-ventajasfiscales {
    height: 88px;
}

.mastres {
    font-size: 3em;
    color: #1c9cdd;
    float: left;
    padding: 0px 0px 11px 56px;
}

.fucsia {
color: #ff0095;
}

.verde {
    color: #a3bf2a;
}

.verde-accidentes {
    color: #528165;
}

.rojo {
    color: #b32c33;
}

.naranja {
    color: #f89829;
}

.morado {
    color: #c7aed0;
}

.gris {
    color: #95a1aa;
}

.blanco {
    color: #fff;
}

.nopadding {
   padding: 0 !important;
   margin: 0 !important;
}

.nomargin {
   margin: 0px !important;
}

/*acordeon*/
.accordion dl,
.accordion-list {
   border:1px solid #ddd;
   &:after {
       content: "";
       display:block;
       height:1em;
       width:100%;
       background-color:darken(#38cc70, 10%);
     }
}
.accordion dd,
.accordion__panel {
   background-color: white;
   font-size:1em;
   line-height:1.5em; 
}
.accordion p {
  padding:1em 2em 1em 2em;
}

.accordion {
    position:relative;
    background-color: white;
}
/*.container {
  max-width:960px;
  margin:0 auto;
  padding:2em 0 2em 0;
}*/
.accordionTitle,
.accordion__Heading {
 /*background-color:#38cc70; */
    background-color: rgba(0, 174, 255, 0.6);
   text-align:center;
     font-weight:700; 
          padding:2em;
          display:block;
          text-decoration:none;
          color:#fff;
          transition:background-color 0.5s ease-in-out;
  border-bottom:1px solid darken(#38cc70, 5%);
  &:before {
   content: "+";
   font-size:1.5em;
   line-height:0.5em;
   float:left; 
   transition: transform 0.3s ease-in-out;
  }
  &:hover {
    background-color:darken(#38cc70, 10%);
  }
}
.accordionTitleActive, 
.accordionTitle.is-expanded {
   background-color:darken(#38cc70, 10%);
    &:before {
     
      transform:rotate(-225deg);
    }
}
.accordionItem {
    height:auto;
    overflow:hidden; 
    //SHAME: magic number to allow the accordion to animate
    
     max-height:50em;
    transition:max-height 1s;   
 
    
   /* @media screen and (min-width:48em) {
         max-height:15em;
        transition:max-height 0.5s
        
    } */
    
   
}
 
.accordionItem.is-collapsed {
    max-height:0;
}
.no-js .accordionItem.is-collapsed {
  max-height: auto;
}
.animateIn {
     animation: accordionIn 0.45s normal ease-in-out both 1; 
}
.animateOut {
     animation: accordionOut 0.45s alternate ease-in-out both 1;
}
@keyframes accordionIn {
  0% {
    opacity: 0;
    transform:scale(0.9) rotateX(-60deg);
    transform-origin: 50% 0;
  }
  100% {
    opacity:1;
    transform:scale(1);
  }
}

@keyframes accordionOut {
    0% {
       opacity: 1;
       transform:scale(1);
     }
     100% {
          opacity:0;
           transform:scale(0.9) rotateX(-60deg);
       }
}

.table div:first-child {
    border-bottom: none;
}

.table .table-section {
    border: 2px solid #A2DAF4;
    padding: 8px 0;
}

.table .table-section .info {
    padding: 0;
    border-left: 1px solid #ccc;
}

.table .table-section .info .info-text {
    border-right: 1px solid #ccc;
}

.title {
    color: #009ddd;
    font-size: 1.3em;
}

.subtitle {
    text-decoration: underline;
}

/*background*/

.pace .pace-progress {
    background: #1c9cdd;
}

.timeline::before {
    background: #1c9cdd;
}

.navbar-default .navbar-nav>.active>a,
.navbar-default .navbar-nav>.active>a:focus,
.navbar-default .navbar-nav>.active>a:hover {
    color: #FFF;
    background-color: #1c9cdd;
}


/*border*/

.phone-icon {
    border-color: #1c9cdd;
}

.section-title hr {
    border-top-color: #1c9cdd;
}


/*background color*/

.nav-pills>li.active>a,
.nav-pills>li.active>a:focus,
.nav-pills>li.active>a:hover {
    background-color: #1c9cdd;
}


/*contrast color*/

.appointment-form .form-header {
    /* background-color: rgba(0, 174, 255, 0.6); */#1c9cdd
    background-color: #1c9cdd;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
    color: #fff;
}

.appointment-form .form-header .primero {
    margin-left: 0px;
}

/* 
  BUTTONS
  ------- */

.btn-default {
    color: #1c9cdd;
    border-color: #FFF;
}

.btn-default:hover,
.btn-default:focus,
.btn-default:active,
.btn-default.active {
    background-color: transparent;
    border-color: #FFF;
    color: #FFF;
}

.btn-primary {
    background-color: #5c5c5c;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active {
    background-color: #3b3b3b;
}

.btn-success {
    background-color: #ff0095;
    border-color: #ff0095;
}

.btn-success:hover,
.btn-success:focus,
.btn-success:active,
.btn-success.active {
    background-color: #FFF;
    border-color: #1c9cdd;
    color: #1c9cdd;
}

.btn-outline {
    color: #8C8C8C;
    border-color: #CACACA;
}

.btn-outline:hover,
.btn-outline:focus,
.btn-outline:active,
.btn-outline.active {
    background-color: transparent;
    border-color: #818181;
    color: #8C8C8C;
}

.btn-success.disabled,
.btn-success.disabled.active,
.btn-success.disabled.focus,
.btn-success.disabled:active,
.btn-success.disabled:focus,
.btn-success.disabled:hover,
.btn-success[disabled],
.btn-success[disabled].active,
.btn-success[disabled].focus,
.btn-success[disabled]:active,
.btn-success[disabled]:focus,
.btn-success[disabled]:hover,
fieldset[disabled] .btn-success,
fieldset[disabled] .btn-success.active,
fieldset[disabled] .btn-success.focus,
fieldset[disabled] .btn-success:active,
fieldset[disabled] .btn-success:focus,
fieldset[disabled] .btn-success:hover {
    background-color: #1c9cdd;
    border-color: #1c9cdd;
    color: #FFF;
}

/* POPUP INFORMACION */

.overlay {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.7);
  transition: opacity 500ms;
  visibility: hidden;
  opacity: 0;
  overflow-y: scroll;
}
.overlay:target {
  visibility: visible;
  opacity: 1;
}

.noscroll { 
  overflow: hidden;
}
.popup {
  margin: 150px auto;
  padding: 20px;
  background: #fff;
  border-radius: 5px;
  width: 30%;
  max-width: 400px;
  position: relative;
  transition: all 5s ease-in-out;
  max-height: 650px;
  overflow:auto;
}

.popup h2 {
  margin-top: 0;
  color: #333;
  font-family: Tahoma, Arial, sans-serif;
}
.popup .close {
  position: absolute;
  top: 0px;
  right: 5px;
  transition: all 200ms;
  font-size: 30px;
  font-weight: bold;
  text-decoration: none;
  color: #333;
}
.popup .close:hover {
  color: #1c9cdd;
}
.popup .content {
  max-height: 30%;
  overflow: auto;
}
@media (max-width: 768px) {
    .popup {
    width: 90%;
    max-width: 350px;
    margin: 100px auto;
    padding: 35px 10px 10px 10px;
    }
    .btn-centrar-solictarllamada {
    font-size: 14px;
    }
    .mastres {
    padding: 3px 0px 11px 15px;
    }
    .text-highlight-big-tresmeses {
    margin-left: 58px;
    margin-top: -25px;
    }
    .tresmeses-big {
    font-size: 28px;
    margin-left: 124px;
    }
    .tresmeses-renovacion {
    margin-left: 126px;
    margin-bottom: 20px;
    }
    .hogar {
    margin-top: 0px;
    width: 33%;
    }
    .hogar:after {
    height: 30px;
    margin-left: 12px;
    }
    .negocios {
    margin-left: 82px;
    }
    .negocios:after {
    margin-left: 60px;
    }
    .auto {
    width: 50%;
    }
    .auto:after {
    margin-left: 114px;
    }
    .decesos:after {
    margin-left: 104px;
    background: url("/images/decesos.jpg") no-repeat scroll 0 0 / 50% auto;
    }

    .hogarpopup {
    margin-left:37px;
    width: 33%;
    }

    .autopopup  {
    margin-left: 141px;
    width: 33%;
    }

    .proteccionpopup {
    margin-left: 37px;
    width: 33%;
    }

    .decesospopup {
    margin-left: 141px;
    width: 33%;
    }

}