/* Estilos GENERALES ================*/

html, body {
    height: 100%;
}

body {
    padding-bottom: 20px;
    font-family: 'Alegreya Sans', sans-serif;
    background-color: #FFF;
}

#main {
    color: #444 !important;
    font-size: 15px;
    font-family: 'Alegreya Sans', sans-serif;
}

h1 {
    font-family: 'Montserrat', sans-serif;
    color: #cf182f !important;
    font-size: 30px;
    font-weight: 600;
    text-transform: uppercase;
}

h2 {
    font-family: 'Montserrat', sans-serif;
    color: #1a4e8f !important;
    font-size: 18px;
    font-weight: 600;
    text-transform: uppercase;
}

h3, h4, h5 {
    font-family: 'Montserrat', sans-serif;
    color: #444;
    font-size: 18px;
    font-weight: 400;
    text-transform: uppercase;
}

a {
    color: #1a4e8f !important;
    text-decoration: underline;
}

hr.red {
    background-color: #cf182f !important;
    border-color: #cf182f !important;
}

button, a.btn {
    background-color: #1a4e8f !important;
    border-radius: 4px !important;
    color: #FFF !important;
}

button.red, a.btn.red {
    background-color: #cf182f !important;
    border-radius: 4px !important;
    color: #FFF !important;
}

button.darkgrey, a.btn.darkgrey {
    background-color: #4D4D4D !important;
    border-radius: 4px !important;
    color: #FFF !important;
}

input:not([type='checkbox']), select, textarea, form input:not([type='checkbox']), form select, form textarea {
    background: #f8f8f8 !important;
    border: 1px solid #d2d2d2 !important;
    border-radius: 4px !important;
    font-family: 'Alegreya Sans', sans-serif !important;
    font-size: 17px !important;
    padding: 5px 8px !important;
    width: 100% !important;
    -webkit-box-sizing: border-box !important;
    -moz-box-sizing: border-box !important;
    box-sizing: border-box !important;
}

form select {
    -webkit-appearance: menulist !important;
    -moz-appearance: menulist !important;
    appearance: menulist !important;
}

form label {
    color: #444 !important;
}

.page-header {
    margin-top: 30px;
}

.panel-heading h4 {
    font-weight: bold;
}

.modal.fade {
    opacity: 1;
}

.modal.fade .modal-dialog, .modal.in .modal-dialog {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
}

/* ----- Make bootstrap flexbox -----*/

/*
 * Row with equal height columns
 * -----------------------------
 */

.row-eq-height {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

/*---- Sobreescribiendo color Primary de bootstrap -----*/

.bg-primary {
    color: #fff;
    background-color: #1a4e8f
}

a.bg-primary:hover {
    background-color: #3071a9
}

.btn-primary {
    color: #fff;
    background-color: #1a4e8f;
    border-color: #357ebd
}

.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open>.dropdown-toggle.btn-primary {
    color: #fff;
    background-color: #3071a9;
    border-color: #285e8e
}

.btn-primary:active, .btn-primary.active, .open>.dropdown-toggle.btn-primary {
    background-image: none
}

.btn-primary.disabled, .btn-primary[disabled], fieldset[disabled] .btn-primary, .btn-primary.disabled:hover, .btn-primary[disabled]:hover, fieldset[disabled] .btn-primary:hover, .btn-primary.disabled:focus, .btn-primary[disabled]:focus, fieldset[disabled] .btn-primary:focus, .btn-primary.disabled:active, .btn-primary[disabled]:active, fieldset[disabled] .btn-primary:active, .btn-primary.disabled.active, .btn-primary[disabled].active, fieldset[disabled] .btn-primary.active {
    background-color: #1a4e8f;
    border-color: #357ebd
}

.btn-primary .badge {
    color: #1a4e8f;
    background-color: #fff
}

.label-primary {
    background-color: #1a4e8f
}

.label-primary[href]:hover, .label-primary[href]:focus {
    background-color: #3071a9
}

.panel-primary {
    border-color: #1a4e8f
}

.panel-primary>.panel-heading {
    color: #fff;
    background-color: #1a4e8f;
    border-color: #1a4e8f
}

.panel-primary>.panel-heading+.panel-collapse>.panel-body {
    border-top-color: #1a4e8f
}

.panel-primary>.panel-heading .badge {
    color: #1a4e8f;
    background-color: #fff
}

.panel-primary>.panel-footer+.panel-collapse>.panel-body {
    border-bottom-color: #1a4e8f
}

/*----- Sobreescribiendo estilos de paneles alert con fondo gris ---*/

.alert.bg-ligth-grey {
    color: #444;
}

.alert.bg-ligth-grey .text-primary {
    color: #1a4e8f;
}

.alert.bg-ligth-grey .text-danger {
    color: #cf182f;
}

/*----- Sobreescribiendo estilos de boton close de paneles alert ---*/

button.close {
    float: right;
    font-size: 21px;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: none;
    filter: none;
    opacity: 1;
    text-align: center;
    width: 20px;
    height: 20px;
    background-color: transparent !important;
    background-image: url(../img/icono-cancel-grey.png);
    background-size: 20px 20px;
    z-index: 900000000;
}

/*----- Sobreescribiendo estilos sombras de paneles ---*/

body .container .jumbotron, body .container .well, body .container-fluid .jumbotron, body .container-fluid .well {
    -webkit-box-shadow: 0 1px 6px 0 rgba(0, 0, 0, .12), 0 1px 6px 0 rgba(0, 0, 0, .12);
    box-shadow: 0 1px 6px 0 rgba(0, 0, 0, .12), 0 1px 6px 0 rgba(0, 0, 0, .12);
}

/*------ Estilos para input tipo swicht */

.material-switch {
    margin: 2px 10px;
}

.material-switch>input[type="checkbox"] {
    display: none;
}

.material-switch>label {
    cursor: pointer;
    height: 0px;
    position: relative;
    width: 40px;
}

.material-switch>label::before {
    background: rgb(0, 0, 0);
    box-shadow: inset 0px 0px 10px rgba(0, 0, 0, 0.5);
    border-radius: 8px;
    content: '';
    height: 16px;
    margin-top: -8px;
    position: absolute;
    opacity: 0.3;
    transition: all 0.4s ease-in-out;
    width: 40px;
}

.material-switch>label::after {
    background: rgb(255, 255, 255);
    border-radius: 16px;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
    content: '';
    height: 24px;
    left: -4px;
    margin-top: -8px;
    position: absolute;
    top: -4px;
    transition: all 0.3s ease-in-out;
    width: 24px;
}

.material-switch>input[type="checkbox"]:checked+label::before {
    background: inherit;
    opacity: 0.5;
}

.material-switch>input[type="checkbox"]:checked+label::after {
    background: inherit;
    left: 20px;
}

/* ----- Estilos CLASES. Modificadores ----*/

.text-transform-none {
    text-transform: none;
}

.text-blue {
    color: #1a4e8f;
}

.height-100per100 {
    height: 100%;
}

.m-0 {
    margin: 0;
}

.mt-10 {
    margin-top: 10px;
}

.mt-20 {
    margin-top: 20px;
}

.mt-36 {
    margin-top: 32px;
}

.mt-40 {
    margin-top: 40px;
}

.mt-30 {
    margin-top: 30px;
}

.mt-10 {
    margin-top: 10px;
}

.ml-10 {
    margin-left: 10px;
}

.p-15 {
    padding: 15px;
}

.pt-7 {
    padding-top: 7px;
}

.pt-10 {
    padding-top: 10px;
}

.p-0 {
    padding: 0px;
}

.p-5 {
    padding: 5px;
}

.pl-0 {
    padding-left: 0;
}

.pl-20 {
    padding-left: 20px;
}

.border-red, input:not([type='checkbox']).border-red, select.border-red, textarea.border-red, form input:not([type='checkbox']).border-red, form select.border-red, form textarea.border-red {
    border-color: #cf182f !important;
}

.bg-light {
    background-color: #f5f5f5 !important;
}

.bg-ligth-grey {
    background-color: #EEEEEE !important;
}

.clickable {
    cursor: pointer;
}

.fondo-dorado {
    background-color: #AF8A17 !important;
}

.ver-mas {
    color: #444 !important;
}

.ver-mas::after {
    content: ' >';
}

.h2-envio-solicitado {
    color: #cf182f !important;
    margin-top: 5px;
    text-align: center;
    text-transform: none;
}

.p-envio-solicitado {
    text-align: center;
}

.col-envio-solicitado {
    margin-left: 38%;
    width: 315px;
}

.tooltip {
    background-color: #777777;
    color:white;
}
   
.nombre-comercial {
    color: #1a4e8f ;
}

/* Chat status colors */

.text-online {
    color: green;
}

.text-busy {
    color: orange;
}

.text-away, .text-red {
    color: #cf182f !important;
}

.panel-heading {
    min-height: 53px;
}

.panel-heading .btn {
    margin-top: 30px;
    margin-bottom: 0;
}

.modal-header .modal-title {
    width: 90%;
    float: left;
    margin-left: 5%;
    text-align: center;
    text-transform: none;
}

.w-a {
    width: auto;
}

.f-r {
    float: right;
}

.w-100 {
    width: 100px;
}


/*FIN Estilos GENERALES ================*/

/*========== HEADER */

#header-1 {
    font-size: 13px;
    background: #3c3c3c;
}

#header-1 .container {
    background: url(../../img/fondo-header-1.png) no-repeat 50px 0;
}


/** Cabecera HTG **/

#header-1 .container-fluid {  
    background-color: #C91C2F;
}

#cabecera-htg a{
    color:white !important ;
}

#cabecera-htg li a:hover{   
    border-bottom: 3px solid #ffffff; 
    padding-bottom: 10px;

}


.navbar-nav.navbar-center {
    position: absolute;
    right: 20%;
    float: right;
   /* transform: translatex(-50%);*/
}

#cabecera-social.navbar-right {
    background-color: #084894 ;
    
}

#cabecera-social {
   width: 350px;  
   margin-right: -45px !important;
}

#cabecera-social a{
    color:white !important ;
    width: 50px;
}



.menu-lang select {
    background-color: #084894 !important;
    color: #FFFFFF;
    margin:  18px 0 0 10px;

    font-size: 14px !important;
 
     width: 60px !important;

}

/** /Cabecera HTG **/

#menu-lang {
    margin-top: 5px;
}

.languageSwitcher, .companySwitcher {
    height: 26px;
    font-size: 11px !important;
    padding: 5px 15px 4px;
    margin: 0;
    width: auto !important;
}


ul.header-1-menu {
    float: right;
    margin-left: 15px;
    list-style: none;
    margin-top: 0;
    margin-bottom: 0;
    padding: 0;
}

ul.header-1-menu li {
    float: left;
    margin-left: 5px;
    padding: 8px 0;
}

ul.header-1-menu li.contacto {
    padding-left: 20px;
    padding-right: 15px;
    border-right: 1px solid #eaeaea;
    margin-right: 12px;
}

ul.header-1-menu li.contacto a {
    color: #FFF !important;
    text-decoration: underline;
    font-weight: bold;
    padding: 4px 5px 4px 22px;
    background: url(../../img/icono-contacto.png) no-repeat 0 3px;
    text-transform: uppercase;
}

ul.header-1-menu li.blog {
    margin-top: 1px;
    margin-left: 10px;
}

ul.header-1-menu li.blog a {
    color: #FFF !important;
    text-decoration: none;
    font-weight: bold;
    padding: 4px 10px 4px 29px;
    background-color: #cc1b2d !important;
    background: url(../../img/icono-blog.png) no-repeat 8px 5px;
}

#header-2 {
    background: url(../../img/fondo-header-2.png) no-repeat 0 0;
    background-size: cover;
    border-top: 1px solid #eaeaea;
    border-bottom: 1px solid #eaeaea;
    padding-top: 23px;
    padding-bottom: 0px;
}

#header-2 .slogan {
    margin-top: 13px;
}

#header-2 .slogan img {
    width: 70%;
}

#profile-menu, #menu-company {
    float: right;
    margin-left: 10px;  
   /* margin-bottom: -5px;*/
}
#menu-company {
    margin-top:-3px;
}

#profile-menu {
    margin-top: 3px;
}

#profile-menu>li, #profile-menu>li>a {
    padding: 0 !important;
    margin: 0 !important;
    color: #444444 !important;
    text-decoration: none;
}

#header-2 .navbar-collapse {
    padding-right: 0;
}

#header-2 .nav>li {
    padding: 15px 15px 0;
}

#header-2 .nav>li.home {
    padding-top: 12px;
}

#header-2 .nav>li.home a img {
    width: 94%;
}

#header-2 .nav>li:last-child {
    padding-right: 0;
}

#header-2 .nav>li>a {
    padding: 0;
}

div.span {
    margin:100px;
}

.cambiar-empresa {
    margin-right: 5px;
    font-size: 12px
}

/* Fin de HEADER =============*/

/*============= BREADCRUMBS */

.breadcrumb {
    padding: 3px 0 0;
    margin-bottom: 0;
    list-style: none;
    background-color: #FFF;
}

.breadcrumb>li {
    font-size: 12px;
    color: #000000 !important;
}

.breadcrumb-home {
    width: 12px;
}

.breadcrumb>li+li::before {
    padding: 0 5px;
    color: #000000;
    content: ">";
}

/* Fin de BREADCRUMBS =============*/

/*============= FOOTER */

footer {
    border-top: 1px solid #efefef;
    padding-top: 2%;
    margin: 20px 0;
    font-size: 90%;
}

.copyright img {
    width: 140px;
    margin-bottom: 15px;
}

footer .titulo {
    display: block;
    font-size: 13px;
    text-transform: uppercase;
    font-family: 'Montserrat', sans-serif;
    font-weight: bold;
    margin-bottom: 7px;
}

footer ul {
    padding: 0;
    list-style: none;
}

ul.footer-rs li {
    padding-bottom: 7px;
    float: left;
}

ul.footer-rs li img {
    width: 85%;
}

ul.menu-legal li {
    margin: 0 0px 4px 7px;
}

ul.menu-legal li a {
    text-decoration: none !important;
    font-weight: lighter;
    color: #444444 !important;
    display: block;
    text-align: right;
    font-size: 13px
}

a.boton-newsletter {
    color: #FFF !important;
    padding: 10px 10px 10px 36px;
    background-color: #7d7d7d !important;
    background: url(../../img/icono-sobre-newsletter.png) no-repeat 10px 9px;
    display: inline-block;
}

.certificados>div {
    float: right;
    margin-left: 12px;
    margin-bottom: 10px;
}

.certificados>.wca img {
    width: auto;
}

.certificados>.iata img {
    width: 75px;
}

.certificados>.iso-9001 a {
    text-decoration: none;
    line-height: 1.1em !important;
    display: inline-block;
    text-align: center;
    padding-top: 2px;
}

/* Fin de FOOTER =============*/

/** footer HTG WEB   **/
/*
    /** NUEVO FOOTER */

    .social-newsletter-footer-inicio {
        width: 17%;
        float: left;
    }   

#Footer-htg .footer-general .social-footer a {
    padding-left: 0px;
    margin:0 4.8px;
}

#Footer-htg {
    background-color: #ebebeb;
    float: left;
    width: 100%;
    padding: 20px 1%;
    border-top: 1px solid rgba(0,0,0,.08);
}

#Footer-htg .menu-footer-column ul li {
    margin-bottom: 0px;
}

#Footer-htg .menu-footer-column ul {
    margin: 0px;
}

#Footer-htg .menu-footer-column ul li ul li {
    line-height: initial;
padding-left: 10px;
}

#Footer-htg .footer-general .social-footer i {
    font-size: 24px;
}

#footer-candidatos-proveedores .menu-footer-column {
width: 20%;
}

#footer-candidatos-proveedores a {
color: #666 !important;
font-size: 14px;
}

#footer-candidatos-proveedores ul {
margin-left: 0;
}

#Footer-htg .newsletter-footer span.button_label, #footer-candidatos-proveedores .newsletter-footer span.button_label {
    font-size: 13px;
color: white;
padding: 11px 10px;
}


#Footer-htg .menu-footer-column h6, #footer-candidatos-proveedores .menu-footer-column h6 {
    font-weight: 700;
}

.social-footer,  #footer-candidatos-proveedores .social-footer i {
    font-size: 20px;
}

.date time::before {
    content: "\f073";
    font-family: FontAwesome;
    margin-right: 5px;
}

#Footer-htg .newsletter-footer a {
    padding-left: 0px;
}

#Footer-htg .certificaciones-footer .iata-logo-footer img {
    width: 70px;
    margin-top: 5px;
}

#Footer-htg .certificaciones-footer .wca-logo-footer img {
    width: 50px;
    margin-top: 10px;
}

.copy-menu-footer,  #footer-candidatos-proveedores .copy-menu-footer {
    margin-bottom: 28px;
    line-height: 15px;
    font-size: 13px;
}

.menu-footer, #footer-candidatos-proveedores .menu-footer  {
    width: 73%;
    float: left;
min-height: 10px;
}

#Footer-htg .menu-footer-column, #footer-candidatos-proveedores .menu-footer-column a {
    padding-left: 0px;
padding-bottom: 10px;
}

#Footer-htg .certificado-iso-footer, #footer-candidatos-proveedores .certificado-iso-footer a {
padding-left: 0px;
line-height: 15px;
text-decoration: none ;
}

.newsletter-footer h5 b {
    color: #004291;
}

#Footer-htg .social-footer, #footer-candidatos-proveedores .social-footer a {
    padding-left: 0px;
    padding-right: 10px;
}

.menu-footer-column, #footer-candidatos-proveedores .menu-footer-column ul li ul li {
    height: 17px;
}

.menu-footer-column, #footer-candidatos-proveedores .menu-footer-column ul li ul {
    margin-bottom: 15px;
    margin-top: -4px;
}

.menu-footer, #footer-candidatos-proveedores .menu-footer ul li ul li a {
    padding-left: 7% !important;
}

.menu-footer, #footer-candidatos-proveedores .menu-footer ul li a {
    padding-left: 0% !important;
}

.menu-footer p {
    margin: 0px;
}

.menu-footer a {
    line-height: 2em;
    text-decoration: none;
    color: #4C4C51;
    font-size: 16px;

}

.menu-footer-column:first-child {
    width: 18%;
}

.menu-footer-column {
    width: 14%;
    float: left;
    min-height: 10px;
    margin: 0px 1%;
}

.social-footer ul {
    margin: 0px;
}

.menu-footer h6 {
    margin: 0px;
}

.newsletter-footer h5 {
    margin: 0px;
}

.newsletter-footer p {
    line-height: 1em;
}

.social-newsletter-footer {
    width: 10%;
    float: left;
}

.social-footer a {
    float: left;
}

.social-footer {
    float: left;
    width: 100%;
}

.newsletter-footer {
    float: left;
    width: 100%;
margin-top: 30px;
}



.legales-footer, #footer-candidatos-proveedores  .legales-footer {
    width: 96%;
    text-align: right;
    margin-bottom: 20px;
}

.legales-footer a {
   text-decoration:none;
   line-height: 1.7em;
   font-size: 12px !important;
}

.legales-footer a:hover {
   text-decoration:underline;
}




.certificado-iso-footer {
    float: right;
    line-height: 1.2em;
}

.iata-logo-footer {
    float: right;
    margin: 7px 10px 0px 10px;
}

.wca-logo-footer, #footer-candidatos-proveedores .wca-logo-footer {
    float: right;
    margin: 0px;
}

.certificaciones-footer, #footer-candidatos-proveedores .certificaciones-footer {
    float: right;
}

.text-legal-footer, #footer-candidatos-proveedores .text-legal-footer  {
    width: 17%;
    float: right;
    line-height: 1.5em;
    padding-top: 0px;
}

.footer-general, #footer-candidatos-proveedores .footer-general {
float: left;
width: 100%;
text-align: left;
/*background: #ebebeb;
border-top: 0px solid rgba(0,0,0,.08);
padding: 20px 1%;*/
}

/*#Footerhtg, #footer-candidatos-proveedores {
    background-color: #ebebeb;
    border-top: 1px solid rgba(0,0,0,0.08);
}*/


/* FIN NUEVO FOOTER */


/* Fin de FOOTER   HTG WEB =============*/

/*=============HOME*/

.background-furgo {
    background: url(../../img/calculator-furgoneta-home.jpg) no-repeat top right;
    background-size: 50% auto;
}

.background-tutorial {
    background: url(../img/tutorial-home.jpg) no-repeat top right;
    background-size: 100% auto;
    height: 149px;
}

.img-tutorial {
    max-width: 100%;
    max-height: 100%;
}

.h3-tutorial {
    margin-top: 3px;
}

.background-red {
    background-color: #cf182f !important;
}

.tutorial {
    color: #FFF !important;
    font-family: 'Alegreya sans', sans-serif;
}

/* Fin de HOME =============*/

/*============= GET HELP*/

#message-tool .list-group-item .row-picture {
    float: left;
}

#message-tool .list-group .list-group-item .row-content h4 small {
    font-size: 55%;
    display: block;
}

#message-tool .list-group .list-group-item .row-content h4 {
    margin-bottom: 15px;
}

#message-tool .list-group .list-group-item .row-content {
    width: -webkit-calc(100% - 75px);
    width: calc(100% - 75px);
}

.panel-faq.panel-group .panel {
    margin-top: 0;
}

.panel-faq .panel-heading {
    min-height: 0;
}

.panel-faq .panel-heading h4 {
    text-transform: none;
    font-weight: lighter;
    font-family: 'Alegreya Sans', sans-serif;
    font-size: 17px;
}

/* Fin de GET HELP =============*/

/*============= SHIPEMENTS*/

.text-en-espera {
    color: #444;
    background: url(../img/icono-gears-grey.png) no-repeat top left;
    padding-left: 20px;
    padding-top: 3px;
}

.text-en-curso {
    color: #cf182f;
    background: url(../img/icono-delivery-red.png) no-repeat top left;
    padding-left: 20px;
    padding-top: 3px;
}

.text-entregado {
    color: #188F35;
    background: url(../img/icono-finish-flag.png) no-repeat top left;
    padding-left: 20px;
    padding-top: 3px;
}

.text-tramite {
    color: #1a4e8f;
    background: url(../img/icono-document-blue.png) no-repeat top left;
    padding-left: 20px;
    padding-top: 3px;
}

.text-facturado {
    color: #1a4e8f;
    background: url(../img/icono-document-blue.png) no-repeat top left;
}

.text-en-espera, .text-en-curso, .text-entregado, .text-facturado {
    padding-left: 20px;
    padding-top: 3px;
}

#shipments-list-table .btn-group-sm .btn i.fa, #shipments-list-table .btn-group-sm .input-group-btn .btn i.fa, #shipments-list-table .btn.btn-sm i.fa, #shipments-list-table .input-group-btn .btn.btn-sm i.fa {
    font-size: 23px;
}

.btn-envios {
    width: auto;
    margin-right: 5px !important;
}

.col-botones-envios {
    width: 150px;
}

.btn-consultas {
    background-color: #ce0a2d !important;
}

.btn-aspa-blanca {
    color: #FFFFFF !important;
}

.switch-transito {
    margin-left: 10%;
    margin-top: 6%
}

/*
.btn-envios .btn {
    padding-left: 10px;
    padding-right: 10px;
}
*/

.btn-descargar-excel {
    background-color: transparent !important;
    padding-left: 5px;
    cursor: pointer;
    text-decoration: underline;
}

.h4-salto {
    display: inline;
}

/* Fin de SHIPEMENTS =============*/

/*============= GET A QUOTE*/

.quote-title {
    margin: 0 0 10px;
    font-weight: bold;
    font-size: 100%;
}

.cargo-form [class^="col-sm-"] {
    padding-right: 5px;
    padding-left: 5px;
}

.cargo-form button {
    padding-right: 0;
    padding-left: 0;
}

.grey-box {
    background-color: #F5F5F5;
}

form.quote input.ng-invalid, form.quote select.ng-invalid, form.quote textarea.ng-invalid {
    border-color: red !important;
}

.modal-long-title {
    display: inline-block;
}

.modal-dialog.modal-vehicles {
    width: 800px;
}

.routeDistanceText, .routeTimingText, .pricesText, .stimateLoadText {
    font-weight: bold;
    font-size: 170%;
}

.quote-details-diretions i.fa {
    width: 20px;
    display: inline-block;
    text-align: center;
}

.departure-ico, .delivery-ico {
    padding-left: 60px;
    min-height: 50px;
}

.departure-ico {
    background: url(../img/icono-upload-grey.png) no-repeat 0 0;
}

.delivery-ico {
    background: url(../img/icono-download-grey.png) no-repeat 0 0;
}

hr.bold-separator {
    border-top: 4px solid #eee;
}

.ayuda-flex {
    float: left;
    margin-left: 90px;
    margin-top: -40px
}

.text-uppercase {
    text-transform: uppercase;
}

.margin-left {
    margin-left: 25%;
}

.margin-iframe {
    margin-left: 30%;
    margin-right: 30%;
}

.p-aviso {
    border-style: solid;
    border-color: #cf182f !important;
    border-width: 2px;
    color: #cf182f !important;
    padding: 3px 3px 3px 3px;
    text-align: center;
    margin-top: 15px;
}

.exclamation-icon {
    padding-left: 2px;
}

.h3-iframe {
    font-weight: bold;
    text-align: center;
    font-size: 21px;
    margin-top: 2px;
}

.iframe {
    width: 100%;
    height: 257px;
}

.precio {    
    line-height: 0.9;
}

/* .precio span {
    font-size: 10px;
    float:left
} */

.precio-borrado{
   
    text-decoration: line-through
}

.campaing_price {
    color: #cf182f;
    font-size: 30px
}

.campaing_discount {
    color: #cf182f;  
    font-size: 20px;  
}

.campaing_text {
    font-size: 15px;
    color: #cf182f;     
    margin-bottom:2px;    
}   

.campaing_text_negro{
    font-size: 15px;   
    margin-bottom:2px; 
}

/** cajas del paso 2 */
.caja { 
   
      
        color: #ffffff; 
        
        text-align: center;       
        margin:1%;
        overflow: hidden; 
        padding: 5px; 
        border-radius: 10px ; 
        -moz-border-radius: 10px ; 
        -webkit-border-radius: 10px; 
        border: 2px solid #CCCCCC;
        height: 300px;  
        width:194px   ; /* 23%*/ 
        cursor: pointer;
    }

.card-title {
        color:#cf182f;
        font-size: 22px; 
        margin-top:20px;
        font-weight: 900
}     

.card-text {
    color:#1a4e8f ;  
    line-height: 0.8;
    font-size: 12px;
} 
.card-img-top-custom{
    margin-top:40%;
    width: 60px;
}

.activeCargo {
    border: 2px solid #1a4e8f ;   
}


.activeVehicle {
    border: 2px solid#1a4e8f ;   
}
   


/* Fin de GET A QUOTE =============*/

/*============= selectores de fechas */

input[type="date"].form-control, input[type="time"].form-control, input[type="datetime-local"].form-control, input[type="month"].form-control {
    line-height: normal;
}

/*============= CARGADORES */

#confirmPremiumQuoteModal .modal-dialog {
    width: 80%;
}

#phoneModal .modal-dialog {
    width: 80%;
}

#emailModal .modal-dialog {
    width: 80%;
}

.panel-cargador-izq {
    margin: 5px;
    float: left;
    width: 47%;
}

.panel-cargador-der {
    margin: 5px;
    float: right;
    width: 47%;
}

.panel-pregunta {
    background-color: #f8f8f8 !important;
}

.panel-upper {
    text-transform: uppercase;
}

.confirmacion_titulo {
    font-size: 16px;
    font-weight: bold;
}

.border-cargador {
    border-top: 1px solid #CCCCCC;
}

#inner {
    width: 50%;
    margin: 0 auto;
}

.plus-minus {
    float: left;
    margin-right: 10px;
    color: #1a4e8f !important;
    font-size: 10px;
    margin-top: 3px;
}

/* Fin de CARGADORES =============*/

/*============= BILLING*/

.filtro-facturas {
    float: inherit;
    width: auto;
    margin-top: 0%;
}

.boton-filtro-facturas {
    margin-bottom: 5px;
    width: auto;
    text-transform: capitalize;
}

.fechas_facturas {
    padding-left: 5px;
    padding-right: 28px;
}

.btn-preparacion {
    background-color: #CCCCCC !important;
}

.scroll {
    overflow-y: auto;
    height: auto;
    max-height: 440px;
}

/* Fin de BILLING =============*/

/*============= PROFILE*/

.fs-16 {
    font-size: 16px;
}

.mb-15 {
    margin-bottom: 15px
}

;
.mb-40 {
    margin-bottom: 40px
}

;
.ml-menos-20 {
    margin-left: -20px;
}

/* Fin de PROFILE =============*/

.rated>span::before {
    margin: 5px;
    font-size: 1.25em;
    font-family: FontAwesome;
    display: inline-block;
    content: "\f005";
    color: #ddd;
    ;
}

.rated>span.active::before {
    color: #FFD700;
}

.navbar, .navbar.navbar-default {
    background-color: transparent;
    font-family: 'Montserrat';
}

.navbar, .section-colored {
    margin-top: 10px;
    margin-bottom: 0px;
}

.navbar-default {
    border: none;
    background: none;
    margin-top: 0px;
}

.dropdown {
    cursor: pointer;
}

navbar, .navbar.navbar-default a {
    color: #444 !important;
    text-decoration: none;
    font-size: 17px;
}

navbar, .navbar.navbar-default a:hover {
    color: #cc1b2d !important;
}

a.btn-fab i {
    margin-top: 9px;
    margin-left: -3px;
}

a.btn-fab i.fa-2x {
    font-size: 1.5em;
    margin-top: 0.25em;
    margin-left: 0;
}

.background-left {
    background: url(../img/my-htg-cli-izq.jpg) top left no-repeat;
    background-size: contain;
}

.background-right {
    background: url(../img/my-htg-cli-der.jpg) top right no-repeat;
    background-size: contain;
}

.loginContainer {
    padding-top: 2%;
    padding-bottom: 5%;
    min-height: 600px;
}

.img-home-portfolio, .img-customer, .portfolio-item {
    margin-bottom: 30px;
}

.tab-pane {
    margin-top: 15px;
}

/* Page Sections */

.section, .section-colored {
    padding: 50px 0;
}

/* Chat status colors */

.text-online {
    color: green;
}

.text-busy {
    color: orange;
}

.text-away {
    color: #cf182f;
}

.list-group {
    margin-bottom: 5px;
}

.panel-default .panel-heading a {
    text-decoration: none;
    color: black;
    /*   cursor: default; */
}

.panel-success .panel-heading a, .panel-warning .panel-heading a, .panel-danger .panel-heading a {
    color: white;
    text-decoration: none;
}

.panel-success .panel-heading .text-muted, .panel-warning .panel-heading .text-muted, .panel-danger .panel-heading .text-muted {
    color: rgba(255, 255, 255, .7);
}

/* Google autoComplete */

.pac-container {
    z-index: 1199;
}

/* Comment panels */

.comments .panel>.panel-heading {
    color: black;
}

.comments .panel.panel-info>.panel-heading {
    background: rgb(191, 225, 255);
}

.uploadBox {
    float: left;
    display: block;
    width: 32%;
    height: 110px;
    margin-bottom: 1%;
    margin-right: 1%;
    background: #efefef;
    overflow: hidden;
    position: relative;
}

.uploadBox a img {
    position: absolute;
    top: -12%;
}

.uploadBox:hover .options {
    display: block;
}

.uploadBox .options {
    position: absolute;
    right: 5px;
    bottom: 5px;
    color: white;
    display: none;
    font-size: 90%;
    padding: 2px 3px;
}

.uploadBox .options:hover {
    text-decoration: none;
    background: rgba(0, 0, 0, .7);
    color: white;
}

.uploadBox.document, .uploadBox.video, .uploadBox.audio {
    padding: 8% 4%;
    text-overflow: ellipsis;
}

/* FORMS */

.form-group {
    margin: 3px 0 0 0;
    overflow: auto;
}

.form-group-margin {
    margin: -2px 0 0 0;
    overflow: auto;
}

.form-group-top {
    margin-top: 8px;
}

.form-group-contacto {
    margin-top: -35px;
}

.form-group-empresa {
    margin: 8px 0 0 0;
    overflow: auto;
}

.emailInfoBox {
    margin-bottom: 20px;
    border-bottom: 1px solid #efefef;
    padding-bottom: 20px;
}

div#notifications .ng-hide-add, div#notifications .ng-hide-remove, div#notifications .ng-show-add, div#notifications .ng-show-remove {
    transition: 0.5s linear all;
}

div#notifications {
    position: fixed;
    z-index: 9999;
    opacity: .9;
    top: 1%;
    right: 3%;
    min-width: 250px;
    width: 92%;
    margin: 1%;
    max-width: 400px;
}

div#notifications div.alert {
    position: relative;
    font-size: 90%;
    font-weight: bold;
}

div#notifications div.alert a {
    position: absolute;
    top: 0%;
    right: 1%;
    color: white;
    display: block;
    width: 25px;
    height: 25px;
    text-align: right;
}

.rating {
    border: none;
    float: left;
}

.rating>input {
    display: none;
}

.rating>label:before {
    margin: 5px;
    font-size: 1.25em;
    font-family: FontAwesome;
    display: inline-block;
    content: "\f005";
}

.rating>.half:before {
    content: "\f089";
    position: absolute;
}

.rating>label {
    color: #ddd;
    float: right;
}

/***** CSS Magic to Highlight Stars on Hover *****/

.rating>input:checked~label,
/* show gold star when clicked */

.rating:not(:checked)>label:hover,
/* hover current star */

.rating:not(:checked)>label:hover~label {
    color: #FFD700;
}

/* hover previous stars in list */

.rating>input:checked+label:hover,
/* hover current star when changing rating */

.rating>input:checked~label:hover, .rating>label:hover~input:checked~label,
/* lighten current selection */

.rating>input:checked~label:hover~label {
    color: #FFED85;
}

/* HOME WIDGETS */

.status-upload form textarea {
    background: none repeat scroll 0 0 #fff;
    border: medium none;
    -webkit-border-radius: 4px 4px 0 0;
    -moz-border-radius: 4px 4px 0 0;
    -ms-border-radius: 4px 4px 0 0;
    -o-border-radius: 4px 4px 0 0;
    border-radius: 4px 4px 0 0;
    color: #777777;
    float: left;
    font-size: 14px;
    height: 102px;
    letter-spacing: 0.3px;
    padding: 20px;
    width: 100%;
    resize: vertical;
    outline: none;
    border: 1px solid #F2F2F2;
}


/* SHIPMENT TIMELINE */

.timeline {
    list-style: none;
    padding: 20px 0 20px;
    position: relative;
}

.timeline:before {
    top: 0;
    bottom: 0;
    position: absolute;
    content: " ";
    width: 3px;
    background-color: #eeeeee;
    left: 50%;
    margin-left: -1.5px;
}

.timeline>li {
    margin-bottom: 20px;
    position: relative;
}

.timeline>li:before, .timeline>li:after {
    content: " ";
    display: table;
}

.timeline>li:after {
    clear: both;
}

.timeline>li:before, .timeline>li:after {
    content: " ";
    display: table;
}

.timeline>li:after {
    clear: both;
}

.timeline>li>.timeline-panel {
    width: 43%;
    float: left;
    border: 1px solid #d4d4d4;
    border-radius: 2px;
    padding: 20px;
    position: relative;
    -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.175);
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.175);
}

.timeline>li>.timeline-panel:before {
    position: absolute;
    top: 26px;
    right: -15px;
    display: inline-block;
    border-top: 15px solid transparent;
    border-left: 15px solid #ccc;
    border-right: 0 solid #ccc;
    border-bottom: 15px solid transparent;
    content: " ";
}

.timeline>li>.timeline-panel:after {
    position: absolute;
    top: 27px;
    right: -14px;
    display: inline-block;
    border-top: 14px solid transparent;
    border-left: 14px solid #fff;
    border-right: 0 solid #fff;
    border-bottom: 14px solid transparent;
    content: " ";
}

.timeline>li>.timeline-badge {
    color: #fff;
    width: 50px;
    height: 50px;
    line-height: 50px;
    font-size: 1.4em;
    text-align: center;
    position: absolute;
    top: 16px;
    left: 50%;
    margin-left: -25px;
    background-color: #999999;
    z-index: 3;
    border-top-right-radius: 50%;
    border-top-left-radius: 50%;
    border-bottom-right-radius: 50%;
    border-bottom-left-radius: 50%;
}

.timeline>li.timeline-inverted>.timeline-panel {
    float: right;
}

.timeline>li.timeline-inverted>.timeline-panel:before {
    border-left-width: 0;
    border-right-width: 15px;
    left: -15px;
    right: auto;
}

.timeline>li.timeline-inverted>.timeline-panel:after {
    border-left-width: 0;
    border-right-width: 14px;
    left: -14px;
    right: auto;
}

.timeline-badge.primary {
    background-color: #2e6da4 !important;
}

.timeline-badge.success {
    background-color: #3f903f !important;
}

.timeline-badge.warning {
    background-color: #f0ad4e !important;
}

.timeline-badge.danger {
    background-color: #d9534f !important;
}

.timeline-badge.info {
    background-color: #5bc0de !important;
}

.timeline-title {
    margin-top: 0;
    color: inherit;
}

.timeline-body>p, .timeline-body>ul {
    margin-bottom: 0;
}

.timeline-body>p+p {
    margin-top: 5px;
}


/** Flex modal window to get a quote **/
.flex-modal-texto-1-es {
    width: 70%;
    line-height:normal;
    margin-left:13%
}

.flex-modal-texto-1 {
    width: 74%;
    line-height:normal;
    margin-left:13%;
}

.flex-modal-texto-2-es {    
    width: 87%;
    line-height:normal;
    margin-top: 10px;
    margin-left: 5%;
}

.flex-modal-texto-2 {
    width: 103%;
    line-height:normal;
    margin-top: 10px;
}

.flex-modal-texto-3 {
    margin-top: 10px;
    width:71%;
    margin-left: 13%;
}

.flex-modal-texto-3-fr {
    margin-top: 10px;
    width:72%;
    margin-left: 12%;
} 

.flex-modal-texto-4-es {
    width: 76%;
    margin-left: 10%;    
}

.flex-modal-texto-4 {
    width: 85%;
    margin-left: 7%;

}


/** Confirmacion OC **/

.confirmacionOc a {
    color:white !important;
}










/* Responsive Styles */

@media (max-width: 1263px) {

    /** Cabecera HTG **/

    #cabecera-htg a{
        padding-right : 4px;
     }
     
     #cabecera-social {
         width: 300px;  
         margin-right: -50px !important;
          
      }
 
     #cabecera-social a{
         color:white !important ;
         width: 37px;
         float: right 
     }
     
    .background-right {
        background: none;
    }
    .background-left {
        background: none;
    }
    .background-sup-right {
        background: none;
    }
    .background-sup-left {
        background: none;
    }
}

/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {
   
    
    /** Cabecera HTG **/
        
        .navbar-header {
            float: none;
        }
        .navbar-left,.navbar-right {
            float: none !important;
        }
        .navbar-toggle {
            display: block;
        }
        .navbar-collapse {
            border-top: 1px solid transparent;
            box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
        }
       
        .navbar-collapse.collapse {
            display: none !important;
        }
        .navbar-nav {
            float: none!important;
            margin-top: 7.5px;
        }
    
        .navbar-nav li img {
            display:none
        }
    
        .navbar-nav>li {
            float: none;
            width: 250px;
        }
        .navbar-nav>li>a {
            padding-top: 10px;
            padding-bottom: 10px;
        }
        .collapse.in{
            display:block !important;
        }
       
        #cabecera-social.navbar-right {
            background-color: #C91C2F ;
            
        }
    
        #cabecera-social {
            width: 350px;  
         
        }
    
        #cabecera-social a{
            color:white !important ;
            width: 20px;
        }
        .menu-lang select {
            background-color: #C91C2F !important;
            color: #FFFFFF;
        }
        
        .menu-lang select {
            background-color: #C91C2F !important;
            color: #FFFFFF;
            width: 250px !important;
            font-size: 14px !important;
            width: 60px !important;
    }
    
        .cambiar-empresa {
            visibility: hidden;
        }
    
        #navbar-my{
            float:none;
            width: 300px;        
        }
    
        #mainNavMy{
            border:none;
            width: 696px;
           
        }
    
        ul#navbar-my {
            min-width: 550px;
            list-style: none;
            padding-top: 30px;
            }
            
        ul#navbar-my li {
                display: none;
        }

        .social-footer {
            float: initial;
            width: 235px;
            margin: auto;
        }
    }
    

@media (min-width: 768px) {
    .navbar-header {
        float: right;
    }
}

@media (max-width: 767px) {
    
    #header-2 {
        padding-top: 0;
    }
    
    #branding {
            padding: 0;
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            z-index: 9;
        }
        #branding .container {
            padding: 0;
        }
        ul.timeline:before {
            left: 40px;
        }
        ul.timeline>li>.timeline-panel {
            width: calc(100% - 90px);
            width: -moz-calc(100% - 90px);
            width: -webkit-calc(100% - 90px);
        }
        ul.timeline>li>.timeline-badge {
            left: 15px;
            margin-left: 0;
            top: 16px;
        }
        ul.timeline>li>.timeline-panel {
            float: right;
        }
        ul.timeline>li>.timeline-panel:before {
            border-left-width: 0;
            border-right-width: 15px;
            left: -15px;
            right: auto;
        }
        ul.timeline>li>.timeline-panel:after {
            border-left-width: 0;
            border-right-width: 14px;
            left: -14px;
            right: auto;
        }

        /** reajustes responsive bolsa de carga **/
        .text-legal-footer {
            width: 100% !important;
          }
        
          .legales-footer, #footer-candidatos-proveedores .legales-footer {
            text-align: center !important;
            width: 100%;
          }
          
          .menu-footer{
            width: 100% !important;
            text-align:  center;
          }

                
        .menu-footer-column, #footer-candidatos-proveedores .menu-footer-column ul li ul li {
            height: 100%;
        }

        .text-legal-footer, #footer-candidatos-proveedores .text-legal-footer {
            float: left;
        }

        #footer-candidatos-proveedores .menu-footer-column{
            width: 100%;
        }

        .social-footer {
            float: initial;
            width: 135px;
            margin: auto;
        }

        #Footer-htg .social-footer, #footer-candidatos-proveedores .social-footer a {
            padding-right: 0px;
        }

        .social-newsletter-footer-inicio {
            width: 100%;
           
        }  
                



          /** //reajustes responsive bolsa de carga **/
    }
    @media (max-width: 488px) {
        .iframe {
            height: 200px;
        }
    }