/********************* AQUI COMIENZAN ESTILOS GENERALES *******************/


body{
    font-size: 14px!important;
    color: #123c5d!important;
    font-family: "LatoWeb"!important;
    background: #fff!important;
}


/* Webfont: Lato-Black */@font-face {
    font-family: 'LatoWebBlack';
    src: url('../../fonts/Lato-Black.eot'); /* IE9 Compat Modes */
    src: url('../../fonts/Lato-Black.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../../fonts/Lato-Black.woff2') format('woff2'), /* Modern Browsers */
         url('../../fonts/Lato-Black.woff') format('woff'), /* Modern Browsers */
         url('../../fonts/Lato-Black.ttf') format('truetype');
    font-style: normal;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}

/* Webfont: Lato-BlackItalic */@font-face {
    font-family: 'LatoWebBlack';
    src: url('../fonts/Lato-BlackItalic.eot'); /* IE9 Compat Modes */
    src: url('../fonts/Lato-BlackItalic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/Lato-BlackItalic.woff2') format('woff2'), /* Modern Browsers */
         url('../fonts/Lato-BlackItalic.woff') format('woff'), /* Modern Browsers */
         url('../fonts/Lato-BlackItalic.ttf') format('truetype');
    font-style: italic;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}

/* Webfont: Lato-Bold */@font-face {
    font-family: 'LatoWebBold';
    src: url('../fonts/Lato-Bold.eot'); /* IE9 Compat Modes */
    src: url('../fonts/Lato-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/Lato-Bold.woff2') format('woff2'), /* Modern Browsers */
         url('../fonts/Lato-Bold.woff') format('woff'), /* Modern Browsers */
         url('../fonts/Lato-Bold.ttf') format('truetype');
    font-style: normal;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}

/* Webfont: Lato-BoldItalic */@font-face {
    font-family: 'LatoWebBold';
    src: url('../fonts/Lato-BoldItalic.eot'); /* IE9 Compat Modes */
    src: url('../fonts/Lato-BoldItalic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/Lato-BoldItalic.woff2') format('woff2'), /* Modern Browsers */
         url('../fonts/Lato-BoldItalic.woff') format('woff'), /* Modern Browsers */
         url('../fonts/Lato-BoldItalic.ttf') format('truetype');
    font-style: italic;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}

/* Webfont: Lato-Hairline */@font-face {
    font-family: 'LatoWebHairline';
    src: url('../fonts/Lato-Hairline.eot'); /* IE9 Compat Modes */
    src: url('../fonts/Lato-Hairline.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/Lato-Hairline.woff2') format('woff2'), /* Modern Browsers */
         url('../fonts/Lato-Hairline.woff') format('woff'), /* Modern Browsers */
         url('../fonts/Lato-Hairline.ttf') format('truetype');
    font-style: normal;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}

/* Webfont: Lato-HairlineItalic */@font-face {
    font-family: 'LatoWebHairline';
    src: url('../fonts/Lato-HairlineItalic.eot'); /* IE9 Compat Modes */
    src: url('../fonts/Lato-HairlineItalic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/Lato-HairlineItalic.woff2') format('woff2'), /* Modern Browsers */
         url('../fonts/Lato-HairlineItalic.woff') format('woff'), /* Modern Browsers */
         url('../fonts/Lato-HairlineItalic.ttf') format('truetype');
    font-style: italic;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}

/* Webfont: Lato-Heavy */@font-face {
    font-family: 'LatoWebHeavy';
    src: url('../fonts/Lato-Heavy.eot'); /* IE9 Compat Modes */
    src: url('../fonts/Lato-Heavy.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/Lato-Heavy.woff2') format('woff2'), /* Modern Browsers */
         url('../fonts/Lato-Heavy.woff') format('woff'), /* Modern Browsers */
         url('../fonts/Lato-Heavy.ttf') format('truetype');
    font-style: normal;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}

/* Webfont: Lato-HeavyItalic */@font-face {
    font-family: 'LatoWebHeavy';
    src: url('../fonts/Lato-HeavyItalic.eot'); /* IE9 Compat Modes */
    src: url('../fonts/Lato-HeavyItalic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/Lato-HeavyItalic.woff2') format('woff2'), /* Modern Browsers */
         url('../fonts/Lato-HeavyItalic.woff') format('woff'), /* Modern Browsers */
         url('../fonts/Lato-HeavyItalic.ttf') format('truetype');
    font-style: italic;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}

/* Webfont: Lato-Italic */@font-face {
    font-family: 'LatoWeb';
    src: url('../fonts/Lato-Italic.eot'); /* IE9 Compat Modes */
    src: url('../fonts/Lato-Italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/Lato-Italic.woff2') format('woff2'), /* Modern Browsers */
         url('../fonts/Lato-Italic.woff') format('woff'), /* Modern Browsers */
         url('../fonts/Lato-Italic.ttf') format('truetype');
    font-style: italic;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}

/* Webfont: Lato-Light */@font-face {
    font-family: 'LatoWebLight';
    src: url('../fonts/Lato-Light.eot'); /* IE9 Compat Modes */
    src: url('../fonts/Lato-Light.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/Lato-Light.woff2') format('woff2'), /* Modern Browsers */
         url('../fonts/Lato-Light.woff') format('woff'), /* Modern Browsers */
         url('../fonts/Lato-Light.ttf') format('truetype');
    font-style: normal;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}

/* Webfont: Lato-LightItalic */@font-face {
    font-family: 'LatoWebLight';
    src: url('../fonts/Lato-LightItalic.eot'); /* IE9 Compat Modes */
    src: url('../fonts/Lato-LightItalic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/Lato-LightItalic.woff2') format('woff2'), /* Modern Browsers */
         url('../fonts/Lato-LightItalic.woff') format('woff'), /* Modern Browsers */
         url('../fonts/Lato-LightItalic.ttf') format('truetype');
    font-style: italic;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}

/* Webfont: Lato-Medium */@font-face {
    font-family: 'LatoWebMedium';
    src: url('../fonts/Lato-Medium.eot'); /* IE9 Compat Modes */
    src: url('../fonts/Lato-Medium.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/Lato-Medium.woff2') format('woff2'), /* Modern Browsers */
         url('../fonts/Lato-Medium.woff') format('woff'), /* Modern Browsers */
         url('../fonts/Lato-Medium.ttf') format('truetype');
    font-style: normal;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}

/* Webfont: Lato-MediumItalic */@font-face {
    font-family: 'LatoWebMedium';
    src: url('../fonts/Lato-MediumItalic.eot'); /* IE9 Compat Modes */
    src: url('../fonts/Lato-MediumItalic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/Lato-MediumItalic.woff2') format('woff2'), /* Modern Browsers */
         url('../fonts/Lato-MediumItalic.woff') format('woff'), /* Modern Browsers */
         url('../fonts/Lato-MediumItalic.ttf') format('truetype');
    font-style: italic;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}

/* Webfont: Lato-Regular */@font-face {
    font-family: 'LatoWeb';
    src: url('../fonts/Lato-Regular.eot'); /* IE9 Compat Modes */
    src: url('../fonts/Lato-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/Lato-Regular.woff2') format('woff2'), /* Modern Browsers */
         url('../fonts/Lato-Regular.woff') format('woff'), /* Modern Browsers */
         url('../fonts/Lato-Regular.ttf') format('truetype');
    font-style: normal;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}

/* Webfont: Lato-Semibold */@font-face {
    font-family: 'LatoWebSemibold';
    src: url('../fonts/Lato-Semibold.eot'); /* IE9 Compat Modes */
    src: url('../fonts/Lato-Semibold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/Lato-Semibold.woff2') format('woff2'), /* Modern Browsers */
         url('../fonts/Lato-Semibold.woff') format('woff'), /* Modern Browsers */
         url('../fonts/Lato-Semibold.ttf') format('truetype');
    font-style: normal;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}

/* Webfont: Lato-SemiboldItalic */@font-face {
    font-family: 'LatoWebSemibold';
    src: url('../fonts/Lato-SemiboldItalic.eot'); /* IE9 Compat Modes */
    src: url('../fonts/Lato-SemiboldItalic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/Lato-SemiboldItalic.woff2') format('woff2'), /* Modern Browsers */
         url('../fonts/Lato-SemiboldItalic.woff') format('woff'), /* Modern Browsers */
         url('../fonts/Lato-SemiboldItalic.ttf') format('truetype');
    font-style: italic;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}

/* Webfont: Lato-Thin */@font-face {
    font-family: 'LatoWebThin';
    src: url('../fonts/Lato-Thin.eot'); /* IE9 Compat Modes */
    src: url('../fonts/Lato-Thin.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/Lato-Thin.woff2') format('woff2'), /* Modern Browsers */
         url('../fonts/Lato-Thin.woff') format('woff'), /* Modern Browsers */
         url('../fonts/Lato-Thin.ttf') format('truetype');
    font-style: normal;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}

/* Webfont: Lato-ThinItalic */@font-face {
    font-family: 'LatoWebThin';
    src: url('../fonts/Lato-ThinItalic.eot'); /* IE9 Compat Modes */
    src: url('../fonts/Lato-ThinItalic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/Lato-ThinItalic.woff2') format('woff2'), /* Modern Browsers */
         url('../fonts/Lato-ThinItalic.woff') format('woff'), /* Modern Browsers */
         url('../fonts/Lato-ThinItalic.ttf') format('truetype');
    font-style: italic;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}



/********************* AQUI TERMINAN ESTILOS GENERALES *******************/




/********************* AQUI COMIENZAN ESTILOS MENU Y FOOTER *******************/

.encabezado{
    background:#6bc0ac;
}
.btn-home-regreso{
    color:#fff!important;
    font-size:20px
}
#menu{
    margin:0 auto!important;
    padding:0!important
}
.primer-menu nav a img{
    width:250px
}
.navbar-brand{
    padding-top:0!important
}
a.nav-link{
    color:#fff!important;
    font-weight:700!important
}
.bg-light{
    background-color:transparent!important
}
.navbar-expand-lg .navbar-nav .nav-link{
    padding-right:5rem!important;
    padding-left:1rem!important
}
a.nav-link img.icon{
    width:18px;
    margin-top:-3px
}
.dropdown-menu{
    background:#0087ca;
    font-size:14px;
    z-index:1100
}

.dropdown-item{
    color: #fff !important;
}

.dropdown-item:hover{
    color: #003B73 !important;
}


.despliegue-menub a.submenu{
    color:#fff!important
}
.btn {
    display: inline-block;
    font-weight: 400;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid transparent;
    padding: .375rem .75rem;
    font-size: 1.2rem;
    line-height: 1.5;
    border-radius: .25rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

@media screen and (min-width: 2561px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 2.5rem!important;
    padding-left: 8rem!important;
    font-size: 18px;
}
}

@media screen and (max-width: 2560px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 2.5rem!important;
    padding-left: 7rem!important;
    font-size: 18px;
}
}

@media screen and (max-width: 2500px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 2.5rem!important;
    padding-left: 6rem!important;
    font-size: 18px;
}
}

@media screen and (max-width: 2427px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 2.5rem!important;
    padding-left: 6rem!important;
    font-size: 18px;
}
}

@media screen and (max-width: 2388px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 2.5rem!important;
    padding-left: 6rem!important;
    font-size: 18px;
}
}

@media screen and (max-width: 2353px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 3rem!important;
    padding-left: 5rem!important;
    font-size: 18px;
}
}

@media screen and (max-width: 2315px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 3rem!important;
    padding-left: 5rem!important;
    font-size: 18px;
}
}


@media screen and (max-width: 2276px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 3rem!important;
    padding-left: 4.5rem!important;
    font-size: 18px;
}
}

@media screen and (max-width: 2208px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 3rem!important;
    padding-left: 4.2rem!important;
    font-size: 18px;
}
}

@media screen and (max-width: 2190px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 3rem!important;
    padding-left: 4rem!important;
    font-size: 17px;
}
}

@media screen and (max-width: 2149px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 2.5rem!important;
    padding-left: 5rem!important;
    font-size: 17px;
}
}
@media screen and (max-width: 2111px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 2.5rem!important;
    padding-left: 4.6rem!important;
    font-size: 17px;
}
}

@media screen and (max-width: 2072px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 2.5rem!important;
    padding-left: 4.5rem!important;
    font-size: 16px;
}
}

@media screen and (max-width: 2026px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 2.5rem!important;
    padding-left: 4rem!important;
    font-size: 16px;
}
}

@media screen and (max-width: 1968px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 2.5rem!important;
    padding-left: 3.7rem!important;
    font-size: 16px;
}
}

@media screen and (max-width: 1922px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 2.4rem!important;
    padding-left: 3.6rem!important;
    font-size: 15px;
}
}

@media screen and (max-width: 1853px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 2.4rem!important;
    padding-left: 3.5rem!important;
    font-size: 14px;
}
}

@media screen and (max-width: 1801px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 2rem!important;
    padding-left: 3.5rem!important;
    font-size: 14px;
}
}

@media screen and (max-width: 1742px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 2.5rem!important;
    padding-left: 3rem!important;
    font-size: 14px;
}
}

@media screen and (max-width: 1686px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 2.4rem!important;
    padding-left: 2.4rem!important;
    font-size: 14px;
}
}


@media screen and (max-width: 1605px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 2.4rem!important;
    padding-left: 2rem!important;
}
}

@media screen and (max-width: 1559px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 2rem!important;
    padding-left: 2rem!important;
}
}

@media screen and (max-width: 1524px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 2rem!important;
    padding-left: 1.6rem!important;
}
}



@media screen and (max-width: 1467px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 2rem!important;
    padding-left: 1.5rem!important;
}
}




@media screen and (max-width: 1462px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 2rem!important;
    padding-left: 1.5rem!important;
    font-size: 12px;
}
}


@media screen and (max-width: 1367px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    font-size: 12px!important;
    padding-right: 2rem!important;
    padding-left: 1.2rem!important;
}
}

@media screen and (max-width: 1356px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    font-size: 12px!important;
    padding-right: 2.1rem!important;
    padding-left: 1.2rem!important;
}
}

@media screen and (max-width: 1347px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 2.5rem!important;
    padding-left: .6rem!important;
}
}

@media screen and (max-width: 1315px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 2rem!important;
    padding-left: .6rem!important;
}
}

@media screen and (max-width: 1288px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 2rem!important;
    padding-left: .5rem!important;
}
}

@media screen and (max-width: 1264px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 1.6rem!important;
    padding-left: .5rem!important;
}
}

@media screen and (max-width: 1255px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 1.8rem!important;
    padding-left: .5rem!important;
    font-size: 11px!important;
}
}

@media screen and (max-width: 1216px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 1.7rem!important;
    padding-left: .5rem!important;
    font-size: 11px!important;
}
}

@media screen and (max-width: 1206px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 1.8rem!important;
    padding-left: .5rem!important;
    font-size: 10px!important;
}
}

@media screen and (max-width: 1168px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 1.7rem!important;
    padding-left: .5rem!important;
    font-size: 10px!important;
}
}

@media screen and (max-width: 1160px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    font-size: 10px!important;
    padding-right: 1rem!important;
    padding-left: .5rem!important;
}
}

@media screen and (max-width: 1110px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    font-size: 10px!important;
    padding-right: .8rem!important;
    padding-left: .4rem!important;
}
}

a.nav-link img.icon{
    width: 16px;
}

@media screen and (max-width: 1095px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    font-size: 10px!important;
    padding-right: .5rem!important;
    padding-left: .5rem!important;
}
    
    a.nav-link img.icon{
    width: 12px;
}
}

@media screen and (max-width: 1077px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    font-size: 11px!important;
    padding-right: .5rem!important;
    padding-left: .5rem!important;
}
    
    .primer-menu nav a img{
    width: 200px;
}
    
    a.nav-link img.icon{
    width: 14px;
}
}

@media screen and (min-width: 992px) and (max-width: 1076px) {
    .navbar-expand-lg .navbar-nav .nav-link {
    font-size: 10px!important;
    padding-right: .8rem!important;
    padding-left: .5rem!important;
}
    
    .primer-menu nav a img{
    width: 180px;
}
    
    a.nav-link img.icon{
    width: 14px;
}
}

@media screen and (min-width: 992px) {

    .menu-servicios{
    display:none!important;
}
    
    .opcion-oculta{
        display: none!important;
    }
    
}


@media screen and (max-width: 991px) {
    .navbar-expand-lg .navbar-nav .nav-link {
        padding: .5rem 1rem!important;

    font-size: 14px!important;
}
    
    .menu-servicios{
    display:block!important;
}
    
    .segundo-menu, .idioma{
        display: none!important;
    }
    
}

.segundo-menu {
    text-align: right!important;
    padding: .6rem 0rem;
    margin: 0 auto!important;
    float: left;
}

.btn-segundo-menu {
    cursor: pointer!important;
    border: 0px;
    background: transparent;
    
}


.btn-segundo-menu:focus {
    outline:0px;
    
}

.despliegue{
  background: #6bc0ac;
    text-align: right!important;
    margin-top: 55px;
    left: 0;
    position: absolute;
    text-align: left!important;
    right: 0!important;
    z-index: 3000;
}

.despliegue-menub{
    background: #2B87C8!important;
    color: #fff!important;
}


.despliegue-menub a.dropdown-item{
    color: #fff!important;
}

.opciones-menub {
    display: block;
    width: 100%;
    padding: .25rem 1.5rem;
    clear: both;
    font-weight: 400;
    color: #212529;
    text-align: inherit;
    white-space: nowrap;
    background-color: transparent;
    border: 0;
}

.despliegue ul.navbar-nav li.opciones-menub a{
    color: #003a5d;
    font-weight: bold!important;
    font-size: 12px;
}

.despliegue-menub a.dropdown-item:hover {
    color: #000!important;
}

.dropdown-item.active, .dropdown-item:active {
    background-color: transparent;
}


.btn-secondary {
    color: #495057;
    background-color: transparent;
    border-color: #495057;
}

.cambio-idioma{
    text-align: center!important;
    margin-top: 10px;
}

.cambio-idioma img{
    width: 50px!important;
}

.idioma {
    text-align: center;
    margin: 0 auto!important;
    float: right;
    padding: .6rem 0rem;
    margin-right: 30px!important;
    font-size: 20PX;
}

.navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 4rem;
    padding-left: .5rem;
}


nav.active ul li.a a {
    opacity: 1;
    cursor: pointer;
}


footer{
    background: #003B73;
    margin-top: 10px;
}
.menu-footer{
    text-align: center!important;
    margin: 0 auto!important;
    margin-top: 30px!important;
}

.menu-footer ul.navbar-nav li.nav-item a.nav-link{
    color: #003a5d;
    font-weight: bold;
}


.redes-sociales{
    margin: 0 auto;
    text-align: center;
}


.redes-sociales ul{
    display: inline-flex;
    list-style: none!important;
    padding: 0;
}


.redes-sociales ul li{
    padding: 0 10px;
}

.redes-sociales ul li a{
    font-size: 40px;
    color: #fff!important;
}



.imagen-chat{
    position: fixed;
    display: block;
    top: 700px;
    z-index: 100;
}

.imagen-chat img{
    width: 60px;
}


.contenedor-social{
    text-align: center;
}

.aviso-privacidad{
    font-size: 18px!important;
}
.contenedor-phone{
    text-align: left;
}

.home{
    font-size: 10px!important;
}

.acerca-cervicio{
    font-size: 10px!important;
}

.compra-boletos{
    font-size: 10px!important;
}

.cobertura{
    font-size: 10px!important;

}

.guias-prepagadas{
    font-size: 10px!important;
}

.contactos{
    font-size: 10px!important;
}


.logo-costaline{
    width: 20%;
}


@media screen and (max-width: 830px){
.logo-costaline {
    width: 165px;
}
}

.boton-menu-costa{
    border-color: #fff;
}

/************************************************************************** AQUI TERMINAN ESTILOS MENU Y FOOTER ******************************************/


/***************estilos contenido home*******/


.boton-flotante{
    position: fixed;
    display: block;
    top: 170px;
    z-index: 2200;
    width: 120px;
}


.evalua-viaje {
    position: fixed;
    display: block;
    top: 544px;
    z-index: 2100;
    border: none;
    background: 0 0;
    padding: 0;
    -webkit-box-shadow: 2px -1px 2px 1px rgba(230,230,230,.34);
    -moz-box-shadow: 2px -1px 2px 1px rgba(230,230,230,.34);
    box-shadow: 2px -1px 2px 1px rgba(230,230,230,.34);
}


.boton-float-evalua {
    width: 40px;
}


.imagenes-carrusel{
    width: 100%;
}


.paqueteria-home li{
    height: 17px;
    max-width: 17px;
    background-color: #fff;
    border-radius: 8px;
    border: 3px solid #6bc0ac;
}


.boton-rastreo-guia{
    font-size: 20px;
}





h3.titulo-rastreo-paquete-home{
    font-weight: bold;
    text-align: center;
    font-size: 20px;
}


.rastreo-paquete-home{
    background-color: #0087ca99;
    text-align: center;
    padding: 325px 55px;
    position: absolute;
    margin-top: -487px;
    bottom: -174px;
}



.boton-guia{
    color: #fff;
    background-color: #6298a1;
    border-color: #6298a1;
}


@media screen and (min-width: 2250px) {
   .rastreo-paquete-home{
    bottom: -12px;
   }
}


@media screen and (max-width: 2250px) {
   .botones-horizontal{
    display: none;
   }
}







@media screen and (max-width: 1350px) {
   .rastreo-paquete-home{
   bottom: -180px;
}    
}


@media screen and (max-width: 1250px) {
   .rastreo-paquete-home{
   bottom: -195px;
}    
}

@media screen and (max-width: 1150px) {
   .rastreo-paquete-home{
   bottom: -208px;
}    
}







@media screen and (max-width: 1050px) {
   .rastreo-paquete-home{
   bottom: -219px;
}    
}

@media screen and (max-width: 1040px) {
   .rastreo-paquete-home{
   padding: 325px 35px;
}    
}



@media screen and (max-width: 950px) {
   .rastreo-paquete-home{
    padding: 289px 21px;
   bottom: -242px;
}    
}



@media screen and (max-width: 850px) {
   .rastreo-paquete-home{
    padding: 289px 21px;
   bottom: -242px;
}    

h3.titulo-rastreo-paquete-home{
    
    font-size: 15px;
}

.boton-rastreo-guia {
    font-size: 17px;
}
}


@media screen and (max-width: 831px) {
   .rastreo-paquete-home{
   padding: 290px 11px;
}    
}


@media screen and (max-width: 831px) {
   .rastreo-paquete-home{
   padding: 290px 11px;
}    
}




@media screen and (max-width: 750px) {

   .paqueteria-home li{
    display: none;
}
   .rastreo-paquete-home{
    display: none;
   }


   .botones-horizontal{
    display: block;
    background: #0087caa3;
    text-align: center;
    padding: 5px;
    border-radius: 8px;
}    

h3.titulo-rastreo-paquete-home{
    
    font-size: 15px;
}

.boton-rastreo-guia {
    font-size: 17px;
}
}


@media screen and (max-width: 706px){

    .boton-guia{
        font-size: 14px;
    }

}



@media screen and (max-width: 689px){

    .boton-guia{
        font-size: 14px;
    }

}


@media screen and (max-width: 561px){

    .boton-guia{
        font-size: 11px;
    }

}



@media screen and (max-width: 544px){

    .boton-guia{
        font-size: 11px;
    }

}

@media screen and (max-width: 477px){

    .boton-guia{
        font-size: 11px;
    }

}

@media screen and (max-width: 460px){

    .boton-guia{
        font-size: 10px;
    }

}



@media screen and (max-width: 432px){

    .boton-guia{
        font-size: 8px;
    }

}



@media screen and (max-width: 376px){

    .boton-guia{
        font-size: 6px;
    }

}


@media screen and (max-width: 321px){



.botones.horizontal{
    padding: 5px;
}
    .boton-guia{
        font-size: 6px;
    }

}






@media screen and (max-width: 376px){

    .boton-guia{
        font-size: 6px;
    }

}



/***************  fin estilos contenido home*******/


#contactanos-costa{
    text-align: center;
    font-size: 18px;
    font-weight: bold;
    color: #003b73;
 /*********************Sistema Prepago ************************/
}

h1.información-cuentas-prepagadas{
    background: #fff;
    color: #003B73;
    text-align: center;
    font-size: 26px;
    padding-bottom: 10px;
    padding-top: 10px;
    margin: auto 0px;
    top: 50px!important;
    font-weight: bold;


 }


 .datos-vista2{

    display: inline-block;
    margin-bottom: .5rem;

    margin-top: 8px;
    
}



.principal{
    background: #fff;
    border-radius: 8px;

}


.turipack{
    width: 150px!important;
    height: 50px;
}



.calificacion{
    background: #fff;
 
}

.siempre-tiempo{
    
    background: #fff;
    width: 90%;
    margin-top: 20px;
    height: 80%!important;
    margin-bottom: 20px;
    

}



.img-siempreatiempo{
    width: 42%;
    position: relative;
   
    float: left;

}

.contacto{
    width: 54%;
    position: relative;
  
    float: right;
}

.contente{
    width: 100%;
    overflow: hidden;
}


@media screen and (max-width: 700px) {
    .img-siempreatiempo{
        width: 100%;

       
        float: left;
    
    }
    
    .contacto{
        width: 100%;
    
      
        float: right;
    }
    
    .contente{
        width: 100%;
        overflow: hidden;
    }
}


@media screen and (max-width: 400px) {
    
.btn-continuar1{
   
    width: 100%;
    margin-top: 5%;
    margin-bottom: 5%;
    font-size: 18px;
    
    
}
    
    }

 /*********************Sistema Prepago ************************/



/********************* Estilos Carrusel ****************************/



a.pack-atras span.pack-atras-flecha{
    background-color: #0087ca;
    border-radius: 35px;
    border: 4px solid #6bc09c;
    padding: 10%;
    background-size: 15px!important;
}



a.pack-siguente span.pack-siguente-flecha{
    background-color: #0087ca;
    border-radius: 35px;
    border: 4px solid #6bc09c;
    padding: 10%;
    background-size: 15px!important;
}


/********************* Fin Estilos Carrusel ************************/


.boton-rastreo-guia{
    color: #fff;
    background-color: #6298a1;
    border-color:#6298a1;
    font-size: 15px;
    width: 180px;
}



/*********************  Estilos Acerca del Servicio ************************/

h1.titulo-servicio{
    color: #003B73;
    font-size: 26px;
    font-weight: bold;
    text-align: center;
    padding: 10px;
}

.imagen-servicio-principal{
    width: 100%;

}



.acerca-servicio-paqueteria{
    margin-top: 25px;

}



.paqueteria-pack{
    background: #fff;
    border-radius: 8px;
    padding: 35px;
    height: 100%;
    border: 2px solid #123c5d;
}



.texto-servicio{
    background: #123c5d;
    position: absolute;
    padding: 63px;
    padding-bottom: 59px;
    padding-top: 83px;
    margin-left: 85px;
    margin-right: 953px;
    margin-top: -414px;

    
}



h3.texto-leer{
   color: #fff;
    font-size: 19px;
    font-weight: bold;
    text-align: left;  
}


.nuevo-pack-costa{
    margin-top: 25px;
}

.nuevo-pack-costa{
    text-align: center;
    margin-top: 100px;
    margin-bottom: 65px;
    
}



/***************estilos contenido nuevo*******/

img.imagen-pack{
    width: 100%;
}



p.texto-paqueteria{
    font-weight: bold;
    text-align: left;
    font-size: 18px;
}

.cuadro-pack{
    background: #0087caa6;
    padding: 12px 28px;
    bottom: -1px;
    border-radius: 8px;
}

@media screen and (max-width: 1000px) {
   p.texto-paqueteria{
    font-size: 19px;
}    
}


@media screen and (max-width: 845px) {
   p.texto-paqueteria{
    font-size: 18px;
}    
}


@media screen and (max-width: 800px) {
   p.texto-paqueteria{
    font-size: 17px;
}    
}


@media screen and (max-width: 713px) {
   p.texto-paqueteria{
    font-size: 16px;
}    
}



@media screen and (max-width: 690px) {
   p.texto-paqueteria{
    font-size: 12px;
 } 

 .cuadro-pack{
left: 10px;
    right: 350px;
    bottom: 2px;
    padding: 27px 33px;
 }

img.imagen-pack{
    width: 100%;
    height: 218px;
}
}

@media screen and (max-width: 686px) {
   .cuadro-pack{
    bottom: -10px;
    margin-bottom: -5px;
}    
}



@media screen and (max-width: 660px) {
   p.texto-paqueteria{
    font-size: 12px;
}    
}



@media screen and (max-width: 600px) {
   p.texto-paqueteria{
    font-size: 10px;
}    
}



@media screen and (max-width: 637px) {
   p.texto-paqueteria{
    font-size: 10px;
}    
}


@media screen and (max-width: 581px) {
   p.texto-paqueteria{
    font-size: 9px;
}    
}


@media screen and (max-width: 571px) {
   p.texto-paqueteria{
    font-size: 9px;
} 


.cuadro-pack {
    bottom: -10px;
    margin-bottom: 6px;
}   
}



@media screen and (max-width: 565px) {
   p.texto-paqueteria{
    font-size: 9px;
} 

   .cuadro-pack {
    left: 10px;
    right: 335px;
    bottom: -12px;
}   
}


@media screen and (max-width: 550px) {
   .cuadro-pack {
    left: 10px;
    right: 310px;
    bottom: -4px;
}   
}




@media screen and (max-width: 530px) {
   .cuadro-pack {
    left: 10px;
    right: 292px;
    bottom: -3px;
}   
}


@media screen and (max-width: 510px) {
   p.texto-paqueteria{
    font-size: 9px;
 } 

 .cuadro-pack{
left: 10px;
    right: 259px;
    bottom: -5px;
 }

img.imagen-pack{
    width: 100%;
    height: 200px;
}
}


@media screen and (max-width: 488px) {
   p.texto-paqueteria{
    font-size: 9px;
 } 


 .cuadro-pack{
    left: 10px;
    right: 224px;
    bottom: -8px;
 }

img.imagen-pack{
    width: 100%;
    height: 182px;
}
}




@media screen and (max-width: 473px) {
   p.texto-paqueteria{
    font-size: 9px;
 } 


 .cuadro-pack{
    left: 10px;
    right: 209px;
    bottom: -7px;
 }

img.imagen-pack{
    width: 100%;
    height: 182px;
}
}



@media screen and (max-width: 452px) {
   
 .cuadro-pack{
    left: 10px;
    right: 165px;
    bottom: -12px;
 }

p.texto-paqueteria{
    font-size: 10px;
 } 

}



@media screen and (max-width: 435px) {
   
 .cuadro-pack{
    left: 10px;
    right: 171px;
    bottom: -7px;
 }

 p.texto-paqueteria{
    font-size: 9px;
 } 
}


@media screen and (max-width: 425px) {
   
 .cuadro-pack{
    left: 10px;
    right: 173px;
    bottom: -7px;
 }

 p.texto-paqueteria{
    font-size: 8px;
 } 
}



@media screen and (max-width: 400px) {
   
 .cuadro-pack{
    left: 10px;
    right: 106px;
    bottom: -12px;
 }

 p.texto-paqueteria{
    font-size: 8px;
 } 

img.imagen-pack{
    width: 100%;
    height: 136px;
}

}


@media screen and (max-width: 376px) {
   
 .cuadro-pack{
    left: 10px;
    right: 121px;
    bottom: -7px;
    padding: 19px;
 }

 p.texto-paqueteria{
    font-size: 8px;
 } 
}

@media screen and (max-width: 364px) {
   
 .cuadro-pack{
   right: 116px;
    bottom: -7px;
    padding: 18px;
 }

 p.texto-paqueteria{
    font-size: 8px;
 } 
}



@media screen and (max-width: 354px) {
   
 .cuadro-pack{
    left: 0px;
    right: 115px;
    bottom: -1px;
    padding: 21px 20px;
 }

 p.texto-paqueteria{
    font-size: 9px;
 } 
}


@media screen and (max-width: 346px) {
   
 .cuadro-pack{
    left: 0px;
    right: 112px;
    bottom: -11px;
    padding: 27px 10px;
 }

 p.texto-paqueteria{
    font-size: 9px;
    margin-bottom: -3px;
 } 
}



@media screen and (max-width: 340px) {
   
 .cuadro-pack{
    left: 0px;
    right: 108px;
    bottom: -11px;
    padding: 21px 11px;
 }

 p.texto-paqueteria{
    font-size: 9px;
 } 
}



@media screen and (max-width: 321px) {
   
 .cuadro-pack{
    left: 0px;
    right: 111px;
    bottom: -9px;
    padding: 21px 5px;
 }

 p.texto-paqueteria{
    font-size: 9px;
 } 
}




/***************  fin estilos contenido nuevo*******/


/***************estilos guias **********************/

img.imagen-pack-guias{
    width: 100%;
}



p.texto-paqueteria-guias{
    font-weight: bold;
    text-align: left;
    font-size: 18px;
}


.información-cuentas-prepagadas{
    color: #003B73;
    font-size: 26px;
    font-weight: bold;
    text-align: center;
    padding: 10px;
}

.cuadro-pack-guias{
    background: #0087caa6;
    padding: 12px 28px;
    bottom: 5px;
    border-radius: 8px;
}

@media screen and (max-width: 1000px) {
   p.texto-paqueteria-guias{
    font-size: 17px;
}    
}


@media screen and (max-width: 845px) {
   p.texto-paqueteria-guias{
    font-size: 16px;
}    
}


@media screen and (max-width: 800px) {
   p.texto-paqueteria-guias{
    font-size: 15px;
}    
}


@media screen and (max-width: 713px) {
   p.texto-paqueteria-guias{
    font-size: 14px;
}    
}



@media screen and (max-width: 690px) {
   p.texto-paqueteria-guias{
    font-size: 13px;
 } 

 .cuadro-pack-guias{
left: 10px;
    right: 350px;
    bottom: 0;
 }

img.imagen-pack-guias{
    width: 100%;
    height: 218px;
}


}



@media screen and (max-width: 674px) {
   p.texto-paqueteria-guias{
    font-size: 12px;
}    
}



@media screen and (max-width: 660px) {
   p.texto-paqueteria-guias{
    font-size: 11px;
}    
}

@media screen and (max-width: 629px) {
   p.texto-paqueteria-guias{
    font-size: 11px;
}    
}

@media screen and (max-width: 610px) {
   p.texto-paqueteria-guias{
    font-size: 10px;
}    
}


@media screen and (max-width: 576px) {
   p.texto-paqueteria-guias{
    font-size: 10px;
} 


.cuadro-pack-guias {
    left: 10px;
    right: 330px;
    bottom: 0;
}   
}




@media screen and (max-width: 554px) {
   .cuadro-pack-guias {
    left: 10px;
    right: 310px;
    bottom: 0;
}   
}




@media screen and (max-width: 534px) {
   .cuadro-pack-guias {
    left: 10px;
    right: 248px;
    bottom: 0px;
}  

p.texto-paqueteria-guias {
    font-size: 11px;
}


}




@media screen and (max-width: 500px) {
   p.texto-paqueteria-guias{
    font-size: 10px;
 } 

 .cuadro-pack-guias{
left: 10px;
    right: 243px;
    bottom: 1px;
    padding: 22px;
 }

img.imagen-pack-guias{
    width: 100%;
    height: 200px;
}
}


@media screen and (max-width: 498px) {
   p.texto-paqueteria-guias{
    font-size: 11px;
 } 


 .cuadro-pack-guias{
    left: 10px;
    right: 196px;
    bottom: -1px;
 }

img.imagen-pack-guias{
    width: 100%;
    height: 182px;
}
}




@media screen and (max-width: 485px) {
   p.texto-paqueteria-guias{
    font-size: 11px;
 } 


 .cuadro-pack-guias{
    left: 10px;
    right: 174px;
    bottom: -1px;
 }

img.imagen-pack-guias{
    width: 100%;
    height: 182px;
}
}



@media screen and (max-width: 462px) {
   
 .cuadro-pack-guias{
    left: 10px;
    right: 165px;
    bottom: -1px;
 }

p.texto-paqueteria-guias{
    font-size: 10px;
 } 

}



@media screen and (max-width: 438px) {
   
 .cuadro-pack-guias{
    left: 10px;
    right: 165px;
    bottom: -1px;
 }

 p.texto-paqueteria-guias{
    font-size: 10px;
 } 
}


@media screen and (max-width: 420px) {
   
 .cuadro-pack-guias{
        left: 10px;
    right: 180px;
    bottom: -1px;
 }

 p.texto-paqueteria-guias{
    font-size: 9px;
 } 
}

@media screen and (max-width: 400px) {
   
 p.texto-paqueteria-guias{
    font-size: 9px;
 } 
}


@media screen and (max-width: 391px) {
   
 .cuadro-pack-guias{
    left: 10px;
    right: 124px;
    bottom: -1px;
 }

 p.texto-paqueteria-guias{
    font-size: 8px;
 } 

img.imagen-pack-guias{
    width: 100%;
    height: 136px;
}

}


@media screen and (max-width: 385px) {
   
 .cuadro-pack-guias{
    left: 10px;
    right: 133px;
    bottom: -1px;
    padding: 25px 13px;
 }

 p.texto-paqueteria-guias{
    font-size: 8px;
 } 
}

@media screen and (max-width: 373px) {
   
 .cuadro-pack-guias{
    right: 125px;
    bottom: -1px;
    padding: 19px 12px;
 }

 p.texto-paqueteria-guias{
    font-size: 8px;
 } 
}



@media screen and (max-width: 354px) {
   
 .cuadro-pack-guias{
    left: 0px;
    right: 115px;
    bottom: -1px;
    padding: 17px;
 }

 p.texto-paqueteria-guias{
    font-size: 8px;
 } 
}


@media screen and (max-width: 346px) {
   
 .cuadro-pack-guias{
    left: 0px;
    right: 115px;
    bottom: -1px;
    padding: 20px 10px;
 }

 p.texto-paqueteria-guias{
    font-size: 8px;
 } 
}



@media screen and (max-width: 340px) {
   
 .cuadro-pack-guias{
    left: 0px;
    right: 115px;
    bottom: -1px;
    padding: 14px ;
 }

 p.texto-paqueteria-guias{
    font-size: 8px;
 } 
}



@media screen and (max-width: 327px) {
   
 .cuadro-pack-guias{
    left: 0px;
    right: 100px;
    bottom: -1px;
    padding: 20px ;
 }

 p.texto-paqueteria-guias{
    font-size: 8px;
 } 
}


@media screen and (max-width: 327px) {
   
 
 p.texto-paqueteria-guias{
    font-size: 8px;
    margin-bottom: 3px;
 } 
}



/***************  fin estilos guias *************/




.imagen-centado{
    text-align: center;
    margin-top: 25px;

}


p.transporte-envio{
    color: #003B73;
    font-size: 18px;
    text-align: left; 
}


h3.parte-uno{
    color: #117a8b;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
}

h3.ocurre-paqueteria{
    color: #123c5d;
    font-size: 18px;
    font-weight: bold;
    text-align: left;
}


.puntos-ver li{
  color: #123c5d;
    font-size: 16px;
    font-weight: bold;
    text-align: left;  
}

.servicio-pack-costa{
    color: #003B73;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    margin-top: 15px;
}


p.ocurre-paqueteria-costa{
    color: #003B73;
    font-size: 18px;
    text-align: left;
}


p.transporte-envio-costa{
    color: #003B73;
    font-size: 18px;
    text-align: left;
}

.puntos-ver-costa li{
    color: #003B73;
    font-size: 17px;
    text-align: left;
}


.texto-costa{
    margin-top: 10px
}

.costa-pack-servicio-ocurre{
    margin-top: 30px;
}

.costa-pack-servicio{
    margin-top: 32px;
}


.costa-pack-envio{
    margin-top: 27px;
}



.boton-mostrar-pack-costa{
    background-color: transparent!important;
    border-color: #eee;
    color: #123c5d!important;
    
}


.verticalLine {
   border-left: outset;
}


/********************* Fin  Estilos Acerca del Servicio ************************/





 /********************* COBERTURA ************************/
/**
 .cont-sistema-prepago{
    background: #eee;
    margin-bottom: 10px;
    margin-top: 10px;
    width: 100%;
   
}
**/




.content-1{
    background: #fff;
    border-radius: 8px;
}

.content-2{
    background: #fff;
    border-radius: 8px; 
}

#estado{
    font-size: 18px;
    margin-left: 10px;
}


.mes-años{
    color: #fff;
    background-color: #123c5d!important;
    border-color: #4e555b;
    width: 100%;
    text-align: left;   

}

.btn-estados{

    margin-left: 10px;
    margin-right: 10px;
}

.maps{
    margin-left: 10px;
    margin-top: 10px;
    
}

.contente{
    width: 100%;
    overflow: hidden;
}


@media screen and (max-width: 700px) {
    .img-siempreatiempo{
        width: 100%;

       
        float: left;
    
    }
    
    .contacto{
        width: 100%;
    
      
        float: right;
    }
    
    .contente{
        width: 100%;
        overflow: hidden;
    }
}


@media screen and (max-width: 400px) {
    
.btn-continuar1{
   
    width: 100%;
    margin-top: 5%;
    margin-bottom: 5%;
    font-size: 18px;
    
    
}
    
    }


    .img-siempreatiempo{
        width: 42%;
        position: relative;
       
        float: left;
    
    }



    .siempre-tiempo{
    
        background: #fff;
        width: 90%;
        margin-top: 20px;
        height: 80%!important;
        margin-bottom: 20px;
        
    
    }

    .contacto{
        width: 54%;
        position: relative;
      
        float: right;
    }


    
/********************* FIN COBERTURA ************************/

.cabecera{
    margin-top: 10px;
}




.principal{
    padding: 20px;
    border-radius: 8px;
    position: relative;
    bottom: 10px;
    margin-top: 30px;
}

.principal-cel {
    color: #fff;
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    padding: 15px;
    margin-top: 10px;
}

.content-formulario{
    
}

.formulario{
    margin-left: 10px;
}
.img-celular{
    width: 100%;
}


.btn-enviar-prepagas{
   color: #fff;
    background-color: #003B73!important;
    border-color: #6298a1;
    width: 300px;


}

@media screen and (max-width: 410px) {
    
.btn-enviar-prepagas{
   
    width: 90%;
        
}
    
    }

@media screen and (max-width: 375px) {
    
.btn-enviar-prepagas{
   
    width: 100%;
    
    
    
}
    
    }

.apartado-btn{
    text-align: center;
}

#nombre, #materno, #paterno, #correo-elec, #telefo, #mesagge{
 
    color: #003b73;
    font-weight: bold;
    font-size: 16px;
    
}


#campo-obligatorio{

    color: #d61010;
    text-align: right;
    margin-top: 4px;
    font-size: 16px;

}

.name, .ape-paterno, .ape-materno, .email, .tele, .mesa{
    background: #eee;

}

.mesa{
    height: 120px;
}


/************************ESTILOS CONTACTOS****************/

.principal-contacto{
    padding: 20px;
    border-radius: 8px;
    position: relative;
    bottom: 10px;
    margin-top: 30px;
}



.principal-contacto {
    color: #fff;
    background-image: url(../img/imagen-principal/guias-cel.webp);
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    
}

h1.información-contacto{
    background: #fff;
    color: #123c5d;
    text-align: center;
    font-size: 26px;
    padding-bottom: 10px;
    padding-top: 10px;
    font-weight: bold;

 }


 #contactano-costa {
    color: #123c5d;
    font-size: 22px;
    font-weight: 700;
    margin-left: 10px;
    margin-top: 20px;

   }

   #nombre-formulario, #materno-formulario, #paterno-formulario, #correo-elec-formulario, #telefo-formulario, #mesagge-formulario{
    margin-top: 20px;
    color: #123c5d;
    font-weight: bold;
    font-size: 16px;
    
}

.name-formulario, .ape-paterno-formulario, .ape-materno-formulario, .email-formulario, .tele-formulario, .mesa-formulario{
    background: #eee;
}

.mesa-formulario{
    height: 120px;
}


.apartado-btn-contacto {
    text-align: center;
}


.btn-enviar-prepagos-contacto {
    color: #fff;
    background-color: #6298a1!important;
    border-color: #123c5d;
    width: 300px;
}

@media screen and (max-width: 410px){
.btn-enviar-prepagos-contacto {
    width: 90%;
}
}

/**************FIN ESTILOS CONTACTOS**********************************/


/*************** COTIZADOR ENVIO*********************/
.cotizador{
    background: #fff;
    margin-top: 10px;
    border-radius: 8px;
    padding: 15px;
}


h3.titulo-cotizador{
    text-align: center;
    color: #123c5d;
    font-size: 18px;
    font-weight: bold;
}



p.peso-maximo{
   color: #123c5d;
    text-align: center;
    margin-left: 15px;
    font-size: 18px;
}


.boton-centrado-costa{
	text-align: center;
}

.enviar-cotizacion{
    background-color: #123c5d;
    border: 2px solid #fff;
    border-radius: 7px;
    color: #fff;
    width: 33%;
   
}


@media screen and (max-width: 767px){
.enviar-cotizacion {
    width: 100%;
}
}


.boton-centrado-costa-pack{
    text-align: center;
}

/*************** FIN COTIZADOR ENVIO*********************/












/*******************************************YOCELIN*****************************************/


.cabecera{
    margin-top: 10px;
    text-align: center;
}

.principal{
    background: #fff;
    border-radius: 8px;
    position: relative;
    bottom: 10px;
    margin-top: 20px!important;

}




.formulario{
    margin-left: 10px;
}
.img-celular{
    width: 100%;
}

.btn-enviar-prepagas{
    background: #003B73;
    

}

.apartado-btn{
    text-align: center;
}

#nombre, #materno, #paterno, #correo-elec, #telefo, #mesagge{

}

#campo-obligatorio{

    color: #d61010;
    text-align: right;
    margin-top: 10px;
    font-size: 16px;

}

.name, .ape-paterno, .ape-materno, .email, .tele, .mesa{
    background: #eee;

}




/**************** mapa ubicacion********************/

.contedor-destinos {
    background: #eee;
    margin-top: 10px!important;
    text-align: center;
}


.boletos-autobus{
    text-align: center;
    font-size: 30px;
    padding-top: 30px;
    font-weight: bold;
    color: #123c5d;
}


.icon-boleto{
    width: 100px;
}

.imagen-mapa{
    text-align: center;
    margin: 0 auto;
}
.venta-exclusiva{
    text-align: center;
    font-size: 25px;
    font-weight: 500;
    margin-top: 25px;
    margin-bottom: 100px;
}
.negritas{
    font-weight: bold;
}

.flecha-web{
    color: #fff!important;
}

.bloque02{
    color: #123c5d;
    text-align: center;
}

.estado{
    color: #123c5d;
    font-size: 26px;
}

#text-estados{
    color: #123c5d;
    font-size: 16px;
}

#razon-social{
    font-size: 18px;
    font-weight: bold;
}

h1.informacion-cuentas{
    font-size: 26px;
	text-align: center;
	margin-top: 20px;
    color: #003b73;
	font-weight: bold;
}

h2.seleccion-estado{
	font-size: 22px
}

h2.seleccion-estado-costa{
    text-align: center;
    font-size: 22px;
    color:#003b73;
}

.selectores-estados-costa{
    text-align: center;
}





/**************** fin  mapa ubicacion********************/


/****************   Inicio de formulario 2 ********************/

.btn-enviar{
    width: 300px;
    background: #003B73;
    color: #fff;
    border-radius: 8px;
    cursor: pointer;
    text-align: center;
}



@media screen and (max-width: 410px) {
   .btn-enviar{
    width: 100%;
   }
 
}

/**************** Fin de formulrio 2********************/



/************************rastreo web********************************/


.costa-imagen {
    background: #123c5d;
    text-align: center;
}


.imagen-principal-costa {
    width: 25%;
    padding: 10px;
}

#rastreo-web{
    color: #003B73;
    text-align: center;
    font-size: 25px;
    padding-top: 20px;
}


h2.informacion-cuenta-web{
    background: #003B73;
    color: #fff;
    text-align: center;
    font-size: 18px;
    padding-bottom: 10px;
    padding-top: 10px;
    border-radius: 8px 8px 0 0;
}

.principal-web{
    background: #fff;
    border-radius: 8px;
}


.folio-web{
    display: inline-block;
    margin-bottom: .5rem;
    margin-left: 30px;
    margin-top: 8px;
    font-size: 15px;
    font-weight: bold;
    border-radius: 8px;
    color:#003B73;
}


.letras-en-rojo{
    font-size: 12px;
    margin-right: 40px;
    color: rgb(220, 53, 69) !important;
    text-align: right !important;
}


.boton-web-continuar{
    text-align: center!important;
}


.btn-continuar-web1{
    color: #ffff;
    background: #003B73;
    border: #003B73;
    text-align: center;
    width: 300px;
    margin-top: 5%;
    margin-bottom: 5%;
    font-size: 19px;
}

.flecha-web{
font-size: 30px;
    float: right;
    width: 25px;
}

h3.privacidad{
    padding: 10px;
    text-align: center!important;
    font-size: 20px;
    font-weight: bold;
}

/************************fin rastreo web****************************/




/*********************Sistema Prepago ************************/

.cont-sistema-prepago{
    background: #fff;
    margin-bottom: 10px;
    margin-top: 10px;
    width: 100%;
   
}

#titu-prepago{
    color: #003B73;
    text-align: center;
    font-size: 25px;
    padding-top: 20px;
}
.información-cuentas{
    background: #003B73;
    color: #fff;
    text-align: center;
    font-size: 18px;
    padding-bottom: 10px;
    padding-top: 10px;
    border-radius: 8px 8px 0 0;

 }


 .datos-vista2{
    color:#003B73 ;

    display: inline-block;
    margin-bottom: .5rem;

    margin-top: 8px;
    
}



.principal{
    background: #fff;
    border-radius: 8px;

}



.costapack{
    width: 150px!important;
    height: 5s5px;
}

.logo-costa{
    background: #0087ca;
   
    text-align: center;
}

.calificacion{
    background: #fff;
 
}

.btn-continuar1{
    color: #ffff;
    background: #003B73;
    border: #003B73;
    text-align: center;
    width: 300px;
    margin-top: 5%;
    margin-bottom: 5%;
    font-size: 18px;
    
    
}

.content-continuar{
    text-align: center!important;
}



.ejemplo {
    background: #eee;
    font-size: 14px;
   
    display: block;
    margin: 0 auto!important;
    width: 100%;
    padding: 0.375rem 1.75rem;
    border: 2px solid #ced4da;
    border-radius: 0.25rem;
    text-align-last: left;
}

.flecha{
  
    font-size: 30px;
    float: right;
    width: 25px;
}



.siempre-tiempo{
    background: #fff;
    width: 90%;
    margin-top: 20px;
    height: 80%!important;
    margin-bottom: 20px;
    

}

img.oferta-promociones-costa{
    background: #fff;
    width: 100%;
    margin-top: 20px;
    height: 80%!important;
    margin-bottom: 20px;
}


img.terminos-condiciones-costa{
     
    background: #fff;
    width: 100%;
    margin-top: 20px;
    height: 80%;
    margin-left: 4px;
    

}

.img-siempreatiempo{
    width: 42%;
    position: relative;
   
    float: left;

}

.contacto{
    width: 54%;
    position: relative;
  
    float: right;
}

.contente{
    width: 100%;
    overflow: hidden;
}


@media screen and (max-width: 700px) {
    .img-siempreatiempo{
        width: 100%;

       
        float: left;
    
    }
    
    .contacto{
        width: 100%;
    
      
        float: right;
    }
    
    .contente{
        width: 100%;
        overflow: hidden;
    }
}


@media screen and (max-width: 400px) {
    
.btn-continuar1{
   
    width: 100%;
    margin-top: 5%;
    margin-bottom: 5%;
    font-size: 18px;
    
    
}
    
    }


img.siempre-tiempo-banner-costa{
    background: #fff;
    width: 100%;
    margin-top: 20px;
    height: 80%!important;
    margin-bottom: 20px;
}

.banners-costa{
    margin-top: 15px;
}


.casa-pack-costa{
    font-size: 20px;
    margin-top: -3px;
}

.esquema-de-prepago{
    font-size: 45px;
}



 /*********************Sistema Prepago ************************/




/********************* tabla uno pack ************************/

.tabla-precios-costa-pack{
    margin-top: 10px;
    padding: 30px;
}
.precios-paqueteria-costapack{
    width: 100%;
}


h2.precios-mensajeria-paqueteria{
    font-size: 22px;
    text-align: center;
}

.bonificacion-costa{
    margin-top: 50px;
    padding: 12px;
}

p.texto-bonificacion-importe-costa{
    font-size: 18px;
    color: #003B73;
    text-align: center;
    font-weight: bold;
}

td{
    color: #003B73;
}

.contenido-bonificacion-pack{

}


ul.listado-bonificacion {
    font-size: 15px;
     margin-left: 10px;
     color: #003B73;
    padding: 40px;

}



   table.tabla-beneficio-costa,table.rwd_auto {border:1px solid #ccc;width:100%;margin:0 0 50px 0; border-radius: 8px;}
        .tabla-beneficio-costa th,.rwd_auto th {background:#0087ca;padding:5px;text-align:center; color:#fff;}
        .tabla-beneficio-costa td,.rwd_auto td {border-bottom:1px solid #ccc;padding:5px;text-align:center}
        .tabla-beneficio-costa tr:last-child td, .rwd_auto tr:last-child td{border:0}
        
    
    
   

.contenido-bonificacion-pack{
   
    margin-top: -43px;
}

   .fondo-tabla{
    background: #123c5d;
   }


.transferencia-costa{
    margin-top: 50px;
    padding: 12px;
}

p.texto-transferencia-importe-costa{
    font-size: 18px;
    color: #123c5d;
    text-align: left;
}



ul.listado-transferencia-cuenta-costa{
    font-size: 15px;

    padding: 15px;
}
  


  hr.divisiones-pack{
    height: 5px;
    background-color: #6bc0ac;
    border-radius: 300px;
  }  

.texto-bonificacion-importe-costa
  {
    font-size: 18px;
    color: #003B73;
    text-align: center;
  }    
/********************* fin tabla uno pack ************************/






/************************************************************************** AQUI inicia ESTILOS BOLETOS DE AUTOBUS ******************************************/


.contenedor-boleto{
    background: #fff;
    margin-bottom: 10px;
    border-radius: 8px;
    display: block;
    position: relative;
    bottom: 10px;
}

.bol-space{
    padding-top: 10px;
}

.boletos-autobus{
    text-align: center;
    font-size: 26px;
    padding-top: 30px;
    font-weight: bold;
}


.icon-boleto{
    width: 100px;
   
}

hr.linea {
    margin-top: 2rem;
    margin-bottom: 1rem;
    border: 0;
    border-top: 2px solid #eee;
    margin: 20px;
    border-radius: 300px;
}

.titulos-boletos{
    text-align: center;
    font-size: 22px;
    color: #123c5d;
    font-weight: bold;
}



.boleto-confirmado{
        padding-left: 17%;
}





.t-boleto{
    font-size: 18px;
    color: #123c5d!important;
    text-align: justify;
}

.box-t-boleto{
    padding: 20px 18px;
    margin-bottom: 7px;
    border-bottom: 2px solid #eee;
    background: #fff;

    }

 .bol-ico{
    font-size: 12px;
 }   

.svg-inline--fa.fa-w-10.icon-t-boleto {
    float: right;
    font-size: 30px;
}



#localidades{
    text-align: center!important;
}

.seccion-formulario-costa-pack{
    padding: 25px;
}



.boton-pack-costa-empresa{
    width: 100%;
    margin-top: 29px;
    background: #6bc0ac;
    color: #fff;
}

/************************************************************************** AQUI TERMINA ESTILOS BOLETOS DE AUTOBUS ******************************************/


/********************* estilos telefonos costa-pack ************************/

.telfonos-pack{
    margin-top: -100px;
}

a.phone-pack{
    font-size: 26px;
    color: #fff!important;
    font-weight: bold;
    line-height: 2.2;
}

@media screen and (max-width: 767px) {
    .telfonos-pack{
    margin-top: -24px;
}
}

/********************* estilos telefonos costa-pack ************************/


/******** nuevos estilos costapack**********************/
.texto-tarifas-pack{

    margin-top: 20px;
    color: #123c5d;

}


.cuadro-tarifas{

}
/******** fin  nuevos estilos costapack**********************/
/*************** nuevo estilos paqueteria botones ***********/
.columnas-centradas{
    text-align: center;
    padding: 10px;
}

h3.titulos-packenlaces{
    color: #07326b;
    font-size: 18px;
    font-weight: bold;
}

.botones-enlacespack{
    width: 100%;
    background: #64c8af;
    color: #003B73;
    font-size: 15px;
    font-weight: bold;
}

.border-botones{
    border: 2px solid #07326b!important;
    padding: 10px;
    border-radius: 8px;
}


.iconografia-pack{
    color: #07326b;
    font-size: 20px;
}

h1.titulos-packenlaces {
    color: #07326b;
    font-size: 18px;
    font-weight: bold;
  }
/*********** fin nuevo estilos paqueteria botones ***********/