html * {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

*, *:after, *:before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
html, body {
    /* you need to set this to assign to the main element a min height of 100% */
    height: 100%;
}
body{
    font-family: "Roboto condensed", sans-serif;
    font-size: 16px;
    padding: 0 !important;
    background: #FFFFFF;
}
a:focus {
    outline: none;
    outline-offset: 0;
}
.btn {
    border: none;
    border-radius: 0;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 700;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open>.dropdown-toggle.btn-primary {
    color: #fff;
    background-color: #222;
    border-color: #222;
    -webkit-box-shadow: 0 0 0 0 #000000;
    -moz-box-shadow: 0 0 0 0 #000000;
    box-shadow: 0 0 0 0 #000000;
}


/*
Cookie accept
======================================= */
.cc-cookies {
    position: fixed;
    width: 100%;
    left: 0;
    bottom: 0;
    padding: 0.5em 5%;
    background: rgba(0,0,0,0.95);
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    letter-spacing:1px;
    z-index: 99999;
    text-align: left;
    color: #fff;
    padding: 30px 20px;
}
.cc-cookie-accept, .cc-cookie-decline {
	padding: 0px 6px;
	margin: 0 20px;
	text-transform:uppercase;
	border: 1px solid;	
}

/*
whatsapp link
======================================= */
.whatsapp {
    height: 40px;
    top: 50px;
    position: absolute;
    width: 100%;
    z-index: 100;
    background: #58e870;
    text-align: center;
    color: #000000;
    line-height: 40px;
    font-weight: 400;
}
.whatsapp a:link,
.whatsapp a:visited,
.whatsapp a:active,
.whatsapp a:hover{
    color: #FFFFFF;
}

/*
Home
======================================= */
.swiper-container {
    width: 100%;
    height: 100%;
}
.swiper-slide {
    text-align: center;
    font-size: 18px;
    background: rgba(0,0,0,0.3);
    border-right: 1px dashed rgba(255,255,255,0.4);
    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    padding: 30px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}
.swiper-slide:last-child{
    border: none;
}

.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{
    position: absolute;
    bottom: 100px !important;
    z-index: 10;
}
.swiper-home {
    position: relative;
    height: 100vh;
    z-index: 2;
}

.bghome, .bghome .bg-slide{
    display: block;
    width: 100%;
    height: 100vh;
    background-color: #cba307;
    position: absolute;
    z-index: 1;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    overflow: hidden;
}

.bg-slide.active{
    opacity: 1;
    -webkit-transition: opacity 1s ease;
    -moz-transition: opacity 1s ease;
    -ms-transition: opacity 1s ease;
    -o-transition: opacity 1s ease;
    transition: opacity 1s ease;
}

.bg-slide{
    opacity: 0;
    -webkit-transition: opacity 1s ease;
    -moz-transition: opacity 1s ease;
    -ms-transition: opacity 1s ease;
    -o-transition: opacity 1s ease;
    transition: opacity 1s ease;
}
.swiper-pagination-bullet {
    width: 12px !important;
    height: 12px !important;
}
.swiper-pagination-bullet-active{
    background: #f1c40f !important;
}

.swiper-slide .h1{
    color: #FFFFFF;
    text-transform: uppercase;
    font-size: 1.6em;
    display: block;
    text-align: left;
    position: absolute;
    bottom: 100px;
    left: 30px;
    width: 75%;
    -webkit-transition: bottom 0.5s ease;
    -moz-transition: bottom 0.5s ease;
    -ms-transition: bottom 0.5s ease;
    -o-transition: bottom 0.5s ease;
    transition: bottom 0.5s ease;
    font-weight: 100;
}
.swiper-slide:hover .h1,
.swiper-slide.active .h1{
    bottom: 150px;
    -webkit-transition: bottom 0.5s ease;
    -moz-transition: bottom 0.5s ease;
    -ms-transition: bottom 0.5s ease;
    -o-transition: bottom 0.5s ease;
    transition: bottom 0.5s ease;
}
.swiper-slide .h1 .btn{
    margin-top: 30px;
    display: none;
    -webkit-transition: bottom 0.5s ease;
    -moz-transition: bottom 0.5s ease;
    -ms-transition: bottom 0.5s ease;
    -o-transition: bottom 0.5s ease;
    transition: bottom 0.5s ease;

}
.swiper-slide .h1 a.seccion{
    min-height: 155px;
    display: block;
    -webkit-transition: bottom 0.5s ease;
    -moz-transition: bottom 0.5s ease;
    -ms-transition: bottom 0.5s ease;
    -o-transition: bottom 0.5s ease;
    transition: bottom 0.5s ease;
}
.swiper-slide:hover .h1 .btn,
.swiper-slide.active .h1 .btn{
    display: inline-block;
}
.swiper-pagination{
    display: none !important;
}

.swiper-slide .slogan{
    color: #ffef00;
    font-size: 1.2em;
    display: block;
    text-align: left;
    position: absolute;
    top: 20%;
    left: 30px;
    width: 75%;
    max-width: 350px;
    -webkit-transition: top 0.5s ease;
    -moz-transition: top 0.5s ease;
    -ms-transition: top 0.5s ease;
    -o-transition: top 0.5s ease;
    transition: top 0.5s ease;
    font-weight: 100;
}
.swiper-slide:hover .slogan,
.swiper-slide.active .slogan{
    top: 15%;
    -webkit-transition: top 0.5s ease;
    -moz-transition: top 0.5s ease;
    -ms-transition: top 0.5s ease;
    -o-transition: top 0.5s ease;
    transition: top 0.5s ease;
}

.swiper-slide .slogan h3{
    color: #fffaad;
}

.sloganitem{
    border-bottom: 1px dotted #000000;
    padding-bottom: 10px;
    display: block;
    float: left;
    padding-top: 20px;
    width: 100%;
    text-align: left;
}
.sloganitem h2{
    font-size: 20px;
    float: left;
    margin-top: 0;
    margin-right: 16px;
    display: inline;
    clear: none;
    max-width: 80%;
}
.sloganitem a.btn.btn-promo {
    border: 2px solid #fffaad !important;
    color: #fffaad;
    padding: 3px 6px;
    font-size: 11px;
    cursor: pointer;
    float: right;
    display: inline;
    clear: none;
}

.swiper-slide.active a.seccion.seccion-promo {
    min-height: 120px !important;
}


@media screen and (max-width: 1170px){
    .swiper-slide .h1, .swiper-slide:hover .h1, .swiper-slide.active .h1 {
        position: relative;
        width: 50%;
        text-align: center;
        bottom: 0;
        font-size: 2.5em;
        font-weight: 300;
        z-index: 3;
        border: none !important;
        left: 0;
        min-height: 120px;
    }
    .swiper-slide .h1 .btn, .swiper-slide:hover .h1 .btn, .swiper-slide.active .h1 .btn {
        display: inline-block;
        margin-top: 30px;
    }
    .swiper-slide-double .h1, .swiper-slide-double:hover .h1, .swiper-slide-double.active .h1 {
        bottom: -10%;
    }
    .swiper-slide:before{
        background: rgba(0,0,0,0.3);
        display: block;
        height: 100%;
        width: 100%;
        content: '';
        position: absolute;
        z-index: 1;
        left: 0;
        top: 0;
    }
    .swiper-pagination{
        display: block !important;
    }
    .swiper-slide .slogan{
        position: absolute;
        margin: 0 auto;
        clear: both;
        display: block;
        top: 15%;
        z-index: 1;
        left: 50%;
        width: 350px;
        margin-left: -175px;
    }
    .swiper-slide .slogan h2{
        text-align: center;
        font-size: 1em;

    }
    .swiper-slide .slogan h3{
        text-align: center;
        font-size: 0.8em;

    }
    .swiper-slide:hover .slogan,
    .swiper-slide.active .slogan{
        top: 15%;
    }
    .swiper-slide.active a.seccion.seccion-promo{
        min-height: 85px !important;
    }
}

.swiper-wrapper .h1 a{
    text-decoration: none;
    color: #ffffff;
}


.btn-outlined {
    border-radius: 0;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}
.btn-outlined.btn-white {
    background: none;
    border: 3px solid #FFFFFF;
    color: #FFFFFF;
}
.btn-outlined.btn-white:hover,
.btn-outlined.btn-white:active {
    color: #FFF;
    background: #000000;
    border-color: #000000:
}


.btn-grey {
    border-radius: 0;
}
.btn-grey {
    background: #E5E5E5;
    border: none;
    color: #000000;
}
.btn-grey:hover,
.btn-grey:active {
    color: #FFF;
    background: #777777;
    border-color: #777777;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}


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

    .swiper-slide .h1,
    .swiper-slide:hover .h1,
    .swiper-slide.active .h1{
        font-size: 1.8em;
        left: 0;
        width: 75%;
        bottom: 0;
    }

    .swiper-slide .slogan {
        left: 50%;
        width: 350px;
        margin-left: -175px;
    }
    .swiper-slide .slogan h2{
        text-align: left;
        font-size: 0.8em;

    }
    .swiper-slide .slogan h3{
        text-align: center;
        font-size: 0.6em;

    }

    .swiper-slide-double .h1, .swiper-slide-double:hover .h1, .swiper-slide-double.active .h1{
        bottom: 20px;
        height: 25px;
        min-height: initial;
    }
    .swiper-slide-double .h1 a.seccion{
        min-height: 30px;
    }
    .swiper-slide-double .sloganitem{
        text-align: left;
    }


}

@media screen and (max-width: 375px) and (orientation: portait){

    .swiper-slide .h1,
    .swiper-slide:hover .h1,
    .swiper-slide.active .h1{
        font-size: 1.8em;
        left: 0;
        width: 80%;
    }

}
@media only screen
and (min-device-width : 375px)
and (max-device-width : 667px)
and (orientation : landscape) {
    .swiper-slide .h1, .swiper-slide:hover .h1, .swiper-slide.active .h1{
        bottom: 80px;
        height: 30px;
        min-height: initial;
    }
    .swiper-slide .h1 a.seccion{
        min-height: 50px;
    }
    .swiper-slide-double .h1, .swiper-slide-double:hover .h1, .swiper-slide-double.active .h1{
        bottom: 20px;
        height: 25px;
        min-height: initial;
    }
    .swiper-slide-double .h1 a.seccion{
        min-height: 30px;
    }
    .swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{
        bottom: 50px !important;
    }
    .swiper-slide .h1 .btn, .swiper-slide:hover .h1 .btn, .swiper-slide.active .h1 .btn{
        margin-top: 0;
    }
    .swiper-slide .h1 a.seccion-promo{
        height: 35px;
    }
    .swiper-slide .slogan h3{
        margin-top: 0;
    }
}

/*
Header
======================================= */
#header .titulo{
    position: relative;
    z-index: 3;
    /* margin-top: -20px; */
}
.headerbg{
    width: 100%;
    height: 300px;
    position: fixed;
    z-index: 13;
    top: 0;
    /* padding-top: 80px; */
    /* border-bottom: 10px solid #FFFFFF; */
    background-position: center center;
    /* Force Hardware Acceleration in WebKit */
    -webkit-transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    transition-property: transform;
    -webkit-transition-duration: 0.4s;
    -moz-transition-duration: 0.4s;
    transition-duration: 0.4s
}

@media only screen and (min-width: 962px) {
    .headerbg {
        top: 10rem;
    }
}

.headerbg.lateral-menu-is-open {
    -webkit-transform: translateX(-260px);
    -moz-transform: translateX(-260px);
    -ms-transform: translateX(-260px);
    -o-transform: translateX(-260px);
    transform: translateX(-260px);
}
.headerbgoverlay{
    opacity: 0.7;
    width: 100%;
    height: 200px;
    display: block;
    position: absolute;
    top: 0px;
    z-index: 1;
}
.white .headerbgoverlay{
    height: 240px;
    -webkit-transition: height 0.5s ease;
    -moz-transition: height 0.5s ease;
    -ms-transition: height 0.5s ease;
    -o-transition: height 0.5s ease;
    transition: height 0.5s ease;
    z-index: -1;
}

@media only screen and (max-width: 1169px) {
    .headerbg{
        width: 100%;
    }
    .headerbgoverlay{
    }
}
.white #header .h1{
    color: #FFFFFF;
    font-size: 2.5em;
    line-height: 1em;
}
.white #header .titulo .h1 small {
    text-transform: uppercase;
    display: block;
    font-weight: 100;
    font-size: 55%;
    color: #fff;
    margin-top: 10px;
}

.white #header .titulo a:link, .white #header .titulo a:visited{
    color: #FFFFFF;
}
.white #header .titulo a:active, .white #header .titulo a:hover{
    text-decoration: underline;
}
.white #header .titulo {
    height: 160px;
}

#intro-img {
    height: 240px;
    -webkit-transition: -webkit-transform 0.4s, height 0.5s;
    -moz-transition: -moz-transform 0.4s, height 0.5s;
    -ms-transition: -ms-transform 0.4s, height 0.5s;
    -o-transition: -o-transform 0.4s, height 0.5s;
    transition: transform 0.4s, height 0.5s;
}

@media only screen and (max-width: 767px) {
    .headerbg {
        position: relative;
        padding-top: 50px;
        min-height: 240px !important;
    }
    #header .h1,
    .white #header .h1{
        font-size: 30px;
        line-height: 1em;
        text-shadow: 1px 0 0 #000;
    }
    #header .titulo .h1 small,
    .white #header .titulo .h1 small {
        font-size: 35%;
        margin-top: 0;
        padding-top: 0;
        display: block;
    }
    #header{
        position: absolute;
    }
    .headerbgoverlay,
    .white .headerbgoverlay{
        height: 240px !important;
    }
    #intro-img {
        height: 230px !important;
    }

    .slogan {
        min-height: 160px !important;
    }

    .categorias {
        margin-top: 45px !important;
    }

    .controls{
        margin: 0px !important;
        margin-left: -15px !important;
        border: 0px !important;
    }
    .total-cursos {
        border: 0px !important;
    }

    .introseccion {
        overflow: hidden;
    }
}


.curso .panel-title > a{
    width: 100%;
    display: block;
    font-size: 1.2em;
    font-weight: 700;
    text-decoration: none;
}
.curso .panel-group .panel{
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    border: none;
    -webkit-box-shadow: 0 0 0 0 transparent;
    -moz-box-shadow: 0 0 0 0 transparent;
    box-shadow: 0 0 0 0 transparent;
}





/*
Modal
======================================= */
.modal-content{
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}
.modal-footer {
    text-align: center;
}

ul.msgsocial{
   list-style: none;
    padding: 0;
    margin: 0;
    text-align: center;
    margin-top: 40px;
}
ul.msgsocial .fa{
    display: inline-block;
}
.msgsocial li {
    display: inline-block;
    margin-right: 30px;
}

#respuesta h2{
    font-size: 24px;
}
.modal-footer p{
    line-height: 1em;
}


/*
Contents
======================================= */
.menu-m-top {
    margin-top: 82px !important;
}

.cd-main-header {
    height: 50px !important;
}

.controls{
    margin-top: 12px;
    height: 40px;
    border: 1px solid #ccc;
    border-right: 0px;
}
.controls button{
    display: inline-block;
    vertical-align: top;
    border: 0;
    color: #CCCCCC;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    border: none;
    border-radius: 0;
    background: transparent;
    border-left: 1px solid #ccc;
    margin: 0;
    margin-right: -3px;
    padding: 9px 14px;
}

.filtros{
    margin-top: 8px;
}

.controls button:last-child{
    border-right: 1px solid #ccc;
}

.controls .separator{
    display: inline-block;
    border-left: 1px solid #ccc;
    height: 100%;
    width: 5px;
    background: #ccc;
    margin-right: -4px;
}

.controls .total-cursos{
    display: inline-block;
    height: 40px;
    vertical-align: top;
    margin: 0;
    padding: 9px 14px;
    color: #777;
}

.lista button:focus{
    outline: 0 none;
}

.lista fieldset{
    display: inline-block;
    vertical-align: top;
}

.filter-group .btn{
    padding: 2px 8px;
    letter-spacing: normal;
}


.layout.active{
    color: #000;
}

.order.active{
    color: #000;
}


.bootstrap-datetimepicker-widget table td:not(.disabled){
    font-weight: bold;
}


/**
 * Container/Target Styles
 */

.slides{
    width: 100%;
}
#cursos-lista{
    padding: 0;
    min-height: 400px;
    text-align: justify;
    position: relative;
    overflow: hidden;
}

#cursos-lista .fichacurso .nombrecurso{
    min-height: 55px;
    font-size: 24px;
}
#cursos-lista .fichacurso .nombrecurso small{
    font-size: 0.6em;
    margin-bottom: 4px;
    display: block;
    text-transform: uppercase;
}
#cursos-lista .fichacurso .nombrecurso .nombrepais{
    color: #222;
}
#cursos-lista .fichacurso .nombrecurso .plazas {
    font-size: 0.5em;
    font-weight: bold;
}
#cursos-lista .mix.one .fichacurso .nombrecurso .row {
    height: 30px;
}
#cursos-lista .fichacurso p {
    color: #222;
    line-height: 1em;
}
#cursos-lista .fichacurso .nombrepais {
    text-transform: uppercase;
    font-size: 0.9em;
}
#cursos-lista .fichacurso .edades {
    color: #98999A;
}
#cursos-lista .fichacurso .cursoalojas{
    margin-top: 10px;
    display: block;
    font-size: 0.9em;
    /* text-transform: uppercase; */
    margin-left: 22px;
    /* letter-spacing: 0.5px; */
}
#cursos-lista .fichacurso .cursoalojas::before {
    content: '\f236';
    color: #98999A;
    margin-right: 6px;
    margin-left: -22px;
    font-family: 'FontAwesome';
}

#cursos-lista .separator-ficha{
    border-bottom: 1px dashed #e5e5e5;
    height: 1px;
    width: 100%;
    display: block;
    padding-top: 10px;

}
#cursos-lista .fichacurso .especialidades {
    font-size: 0.9em;
    color: #000;
    padding-left: 20px;
    display: block;
    line-height: 1.1em;
}
#cursos-lista .fichacurso .especialidades::before {
    content: '\f005';
    margin-right: 4px;
    font-family: 'FontAwesome';
    color: #98999A;
    margin-left: -18px;
}

#cursos-lista a:link, #cursos-lista a:visited{
    text-decoration: none;
}

#cursos-lista .mix,
#cursos-lista .gap{
    width: 32%;
    height: 350px;
    display: inline-block;
    margin-bottom: 1%;
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
    -webkit-transform-origin: left top;
    -moz-transform-origin: left top;
    -ms-transform-origin: left top;
    -o-transform-origin: left top;
    transform-origin: left top;
}

#cursos-lista .mix{
    width: 32%;
    margin-bottom: 1%;
    background: #F1EFEF;
    display: none;
    overflow: hidden;
}



#cursos-lista .mix.one,
#cursos-lista .gap.one{
    width: 100%;
    height: 200px;
}

#cursos-lista .mix.two,
#cursos-lista .gap.two{
    width: 49%;
    height: 450px;
}

#cursos-lista .fotocurso {
    width: 100%;
    position: relative;
    height: 45% !important;
    display: block !important;
    z-index: 1;
    margin-left: 0;
    background-position: center center;
    background-size: cover;
}

#cursos-lista .foto{
    display: block;
    height: 100%;
    width: 100%;
}
#cursos-lista a.foto:hover, #cursos-lista a.foto.active{
    background: rgba(0,0,0,0.2);
}
#cursos-lista a.foto.active::before,
#cursos-lista a.foto:hover::before{
    content: '\f105';
    font-family: 'FontAwesome';
    font-size: 5em;
    text-align: center;
    width: 100%;
    display: block;
    padding-top: 20px;
    color: rgba(255,255,255,0.6);
}

#cursos-lista .one .fotocurso {
    position: absolute;
    left: 0;
    height: 200px !important;
    width: 32%;
    display: block;
    z-index: 1;
}

#cursos-lista .two .fotocurso {
    height: 60% !important;
}

#cursos-lista .promo-lista,
#cursos-lista .ultimas-lista,
#cursos-lista .sinplazas-lista{
    width: 80px;
    height: 80px;
    position: relative;
    z-index: 8;
    /* margin-left: -40px; */
    /* right: -14px; */
    right: -40px;
    -webkit-transform: rotate(135deg);
    -moz-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    -o-transform: rotate(135deg);
    transform: rotate(135deg);
    top: -40px;
    float: right;
}
#cursos-lista .two .promo-lista,
#cursos-lista .two .ultimas-lista,
#cursos-lista .two .sinplazas-lista{
    /*top: -466px;*/
}
#cursos-lista .one .promo-lista,
#cursos-lista .one .ultimas-lista,
#cursos-lista .one .sinplazas-lista{
    /*top: -180px;*/
}
#cursos-lista .promo-lista .fa,
#cursos-lista .ultimas-lista .fa,
#cursos-lista .sinplazas-lista .fa{
    -webkit-transform: rotate(-135deg);
    -moz-transform: rotate(-135deg);
    -ms-transform: rotate(-135deg);
    -o-transform: rotate(-135deg);
    transform: rotate(-135deg);
    float: left;
    text-align: left;
    margin-top: 30px;
    left: 58px;
    display: block;
    position: relative;
    color: #fff;
}
#cursos-lista .promo-lista {
    background: rgb(236, 224, 9);
}
#cursos-lista .ultimas-lista {
    background: orange;
}
#cursos-lista .sinplazas-lista {
    background: red;
}
#cursos-lista .one .fichacurso {
    padding-top: 10px;
}

#cursos-lista .fichacurso {
    display: block;
    padding: 0px 20px 10px 20px;
    height: 140px;
    position: relative;
    z-index: 4;
    text-align: left;

}
@media screen and (max-width: 1200px){
    #cursos-lista .mix,
    #cursos-lista .gap{
        width: 32%;
    }
}
#cursos-lista .one .fichacurso {
    margin-left: 32%;
    margin-top: 0;
}

#cursos-lista .two .fichacurso {
    /*margin-top: -480px;*/
}



#cursos-lista .gap{
    display: inline-block;
}
#cursos-lista .gap:before{
    content: '';
}


@media screen and (max-width: 767px){
    #cursos-lista .mix{
        font-size: 0.8em;
    }
    #cursos-lista .fichacurso .nombrecurso {
        min-height: 40px;
        font-size: 16px;
    }
}


#cursos-lista .frase{
    color: #158f76;
    text-align: right;
}
#sidebar .frase{
    color: #158f76;
    font-size: 1.2em;
    font-family: 'Roboto Slab', monospace;
    margin-top: 20px;
    margin-bottom: 20px;
}



/**
* Landed Slide
*/


.swiper-slide.landed{
    background: #75df25;
}
.swiper-slide.landed .h1{
    line-height: .6em;
}
.swiper-slide.landed .h1 small{
    line-height: 0.9em;
    padding-top: 12px;
    display: block;
    color: #ffffff;
}
.swiper-slide.landed .icons{
    margin-left: 0;
    padding: 0;
}
.swiper-slide.landed .icons .fa{
    color: #b3ff7a;
    margin-right: 10px;
    font-size: 1.5em;
}


/**
* Fail message styles
*/

#cursos-lista .fail-message{
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    text-align: center;
    opacity: 0;
    pointer-events: none;

    -webkit-transition: 150ms;
    -moz-transition: 150ms;
    transition: 150ms;
}

#cursos-lista .fail-message:before{
    content: '';
    display: inline-block;
    vertical-align: middle;
    height: 100%;
}

#cursos-lista .fail-message span{
    display: inline-block;
    vertical-align: middle;
    font-size: 20px;
    font-weight: 700;
}

#cursos-lista.fail .fail-message{
    opacity: 1;
    pointer-events: auto;
}

.lista #programas{
}

#sidebar.lista{
    background: #F5F5F5;
    margin-top: 28px;
    position: fixed;
    z-index: 6;
    width: 100%;
    padding: 0;
    height: 40px;
}
.lista #contenido{
    margin-top: 150px;
    position: relative;
}
.lista #contenido .categorias {
    margin-top: 0px;
}

.lista .ultimasplazas{
    background: #FFB100;
    width: auto;
    padding: 4px;
    margin-right: 10px;
    text-align: right;
    color: #000;
    margin-top: -4px;
}
.lista .grupocerrado{
    background: #ff0000;
    width: auto;
    padding: 4px;
    margin-right: 10px;
    text-align: right;
    color: #000;
    margin-top: -4px;
}

@media only screen and (max-width: 767px) {
    .controls button,
    .controls .separator,
    .filtros {
        display: none;
        visibility: hidden;
    }
    .lista #contenido{
        padding-top: 0;
        margin-top: 0;
    }
}




/*
Contents
======================================= */
#contenido{
    margin-top: 160px;
    -webkit-transition: margin-top 0.5s ease;
    -moz-transition: margin-top 0.5s ease;
    -ms-transition: margin-top 0.5s ease;
    -o-transition: margin-top 0.5s ease;
    transition: margin-top 0.5s ease;
}
.curso #contenido {
    margin-top: 112px;
    overflow: hidden;
}

.categorias .categoria,
#sidebar .categoria{
    border-bottom: 1px solid #c9cbc4;
    padding: 0;
}
.categorias a p, .categorias p {
    color: #777;
}

.categorias .categoria:before, .categorias .categoria:after,
#sidebar .categoria:before, #sidebar .categoria:after{
    background: #c9cbc4;
    right: 20px;
    -webkit-transform-origin: 9px 50%;
    -moz-transform-origin: 9px 50%;
    -ms-transform-origin: 9px 50%;
    -o-transform-origin: 9px 50%;
    transform-origin: 9px 50%;
    content: '';
    position: absolute;
    top: 50%;
    margin-top: -1px;
    display: inline-block;
    height: 2px;
    width: 10px;
    background: #464c4e;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.categorias .categoria:before,
#sidebar .categoria:before{
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}
.categorias .categoria:after,
#sidebar .categoria:after{
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.introseccion{
    margin-bottom: 30px;
    color: #000000;
}
.introseccion p{
    color: #000000;
}

.h1.slogan small{
    color: rgba(51, 51, 51, 0.7);
}

.fichacurso span.subtitulo{
    font-style: italic;
    font-size: 0.7em;
    clear: left;
    display: block;
}
.h1#slogan span.subtitulo{
    font-style: italic;
    font-size: 0.7em;
}

ul.colonies {
    list-style: none;
    padding: 0;
}
ul.colonies li {
    line-height: 1.5em;
    font-weight: 700;
    font-family: 'Amatic SC', cursive;
    font-size: 1.5em;
}
ul.colonies li span {
    background: rgb(0, 152, 0);
    padding: 0 6px;
    color: #FFF;
    margin-right: 2px;
}


#sidebar.summer-camps-ingles ul.listadocolonias{
    text-indent: -18px;
    margin-left: 20px;
    line-height: 1em;
}
#sidebar.summer-camps-ingles ul.listadocolonias li{
    margin-bottom: 12px;
}
#sidebar.summer-camps-ingles ul.listadocolonias li:before {
    content: '';
    padding-right: 6px;
    font-family: 'FontAwesome';
    color: #999999;
    font-size: 0.9em;
    margin-bottom: 4px;
}

.info-curso-list {
    z-index: 99999;
    position: absolute;
    background: grey;
    margin-top: -80px;
    width: 500px;
    right: 2em;
}
#contenido .categorias{
    margin-top: 80px;
}

@media only screen and (max-width: 767px) {
    #contenido {
        margin-top: 0;
    }
    #contenido .categorias{
        margin-top: 0;
    }

}



#cursotabs{
    position: absolute;
    top: 157px;
    width: 100%;
    border-bottom: none;
    z-index: 5;
    -webkit-transition: top 0.5s ease;
    -moz-transition: top 0.5s ease;
    -ms-transition: top 0.5s ease;
    -o-transition: top 0.5s ease;
    transition: top 0.5s ease;
}
#cursotabs > li{
    margin-right: 6px;
}
#cursotabs > li > a{
    border-radius: 0;
    font-weight: 100;
}
#cursotabs > li:not(.active) > a:link, #cursotabs > li:not(.active) > a:visited{
    border-radius: 0;
    color: #222222;
    border-top: none;
    border-left: none;
    border-right: none;
}
#cursotabs > li:not(.active) > a:active, #cursotabs > li:not(.active) > a:hover{
    border-radius: 0;
    color: #FFFFFF;
    border-top: none;
    border-left: none;
    border-right: none;
}
#cursotabs > li:not(.active) > a{
    background: rgba(255, 255, 255, 0.6);
}
#cursotabs > li:not(.active) > a:hover{
    background: rgba(0,0,0,0.6);
    border-radius: none;
    border-bottom: 1px solid rgba(0,0,0,0.6);
}

/* responsive tabs on small devices */
.responsive-tabs-container a.accordion-link {
    display: block;
    /* background: #fff; */
    border-bottom: 2px solid #222;
    color: #222;
    font-size: 1.2em;
    margin-bottom: 20px;
    width: 100%;
}
/* ---------------------- */

.white #sidebar {
    background: #FFF;
    margin-top: 80px;
    min-height: 400px;
    -webkit-transition: margin-top 0.5s ease;
    -moz-transition: margin-top 0.5s ease;
    -ms-transition: margin-top 0.5s ease;
    -o-transition: margin-top 0.5s ease;
    transition: margin-top 0.5s ease;
    position: absolute;
    right: 0;
    z-index: 5;
}
.idioma,
.internet{
    margin-top: 30px;
}
#details ul, #utils ul,
#espes ul{
    list-style: none;
    padding:0;
    margin:0;
    margin-bottom: 20px;
    letter-spacing: 1px;
}
#details ul .fa,
#espes ul .fa{
    color: #98999A;
    margin-right: 6px;
    width: 18px;
}
#espes ul li{
    line-height: 1em;
    margin-bottom: 10px;
}
#details ul{
    margin-bottom: 20px;
}
ul.downloads{
    list-style: none;
    padding:0;
    margin:0;
    margin-bottom: 20px;
    font-size:1.2em;
}
ul.downloads a:active, ul.downloads a:hover{
    color: #000;
    text-decoration: none;
}

#promocion{
    background: rgb(236, 224, 9);
    padding: 10px;
    text-align: center;
    color: #463906;
    font-weight: 700;
    font-size: 1em;
    line-height: 1.2em;
    margin-top: 15px;
    text-transform: uppercase;
}
#promocion h4{
    font-weight: 900;
    letter-spacing: 1px;
}
#promocion small{
    text-transform: none;
    color: #FFF;
    font-size: 12px;
    line-height: 12px;
    display: flex;
    letter-spacing: 1px;
    margin-top: 10px;
    font-weight:300;
}

#sidebar.campamentos-verano-ingles ul,
#sidebar.summer-camps-ingles ul{
    padding: 0;
    margin: 0;
    list-style: none;
}
#sidebar.campamentos-verano-ingles li:before,
#sidebar.summer-camps-ingles li:before {
    content: '';
    padding-right: 6px;
    font-family: 'FontAwesome';
    color: #999999;
}
#sidebar.campamentos-verano-ingles li a:link, #sidebar.campamentos-verano-ingles li a:visited,
#sidebar.summer-camps-ingles li a:link, #sidebar.summer-camps-ingles li a:visited{
    text-transform: uppercase;
    color: #000;
    font-weight: 700;
    letter-spacing: normal;
    font-size: 1.1em;
    text-decoration: none;
}
#sidebar.campamentos-verano-ingles li a:link small, #sidebar.campamentos-verano-ingles li a:active small,
#sidebar.campamentos-verano-ingles li a:visited small, #sidebar.campamentos-verano-ingles li a:hover small,
#sidebar.summer-camps-ingles li a:link small, #sidebar.summer-camps-ingles li a:active small,
#sidebar.summer-camps-ingles li a:visited small, #sidebar.summer-camps-ingles li a:hover small{
    text-transform: uppercase;
    color: #333;
    font-weight: 400;
}

ol{
    line-height: 1.2em;
    padding-left: 15px;
    font-weight: 300;
    letter-spacing: 1px;
    list-style: none;
    counter-reset: li-counter;
}
ol > li{
    margin-bottom: 6px;
    position: relative;
    padding-left: 6px;
    border-left: 1px solid #CCC;
}
ol > li:before{
    position: absolute;
    top: 0;
    left: -1.3em;
    width: 1em;

    font-size: 1.2em;
    line-height: 1;
    font-weight: bold;
    text-align: right !important;
    display:block;
    letter-spacing: normal;

    content: counter(li-counter);
    counter-increment: li-counter;
}
.tab-content{
    margin-top: 50px;
}
.tab-content h2{
    font-size: 1em;
    line-height: 1em;
    margin-bottom: 10px;
    margin-top: 20px;
}
.tab-content h4{
    font-weight: 700;
    margin-top: 60px;
}


.tab-content h3{
    margin-top: 20px;
    margin-bottom: 6px;
    font-weight: 700;
    text-transform: capitalize;
}
.tab-content h5{
    margin-top: 20px;
}
.tab-content .fechas-precios h5{
    margin-top: 10px;
    margin-bottom: 0;
    letter-spacing: 0.5px;
    line-height: 1em;
    font-size: 1.4em;
    clear: both;
}
.tab-content .fechas-precios h5 span{
    font-size: 0.8em;
    text-transform: none;
}
.tab-content .fechas-precios p.duracion{
    font-size: 1.2em;
}
.tab-content h6{
    font-size: 0.9em;
    line-height: 0.9em;
    margin-top: 40px;
    margin-bottom: 6px;
    font-weight: 700;
    letter-spacing: 1px;
}


p.financiacion{
    margin-top: 60px;
}


.tab-content .plazasdisponibles{
    display: block;
}
.tab-content .plazasdisponibles p{
    font-weight: bold;
    font-size: 0.7em;
    width: auto;
    padding: 4px;
    /*background: #e5e5e5;*/
    float: left;
    clear: both;
    text-transform: uppercase;
}

.tab-content .fechas-precios h6{
    margin-top: 40px;
    letter-spacing: 0.5px;
    font-size: 1.2em;
}

.tab-content .fechas-precios h6:first-child{
    margin-top: 0px;
}

.tab-content .fechas-precios .separator{
    border-bottom: 1px solid #CCCCCC;
    padding-bottom: 4px;
}
.tab-content .fechas-precios h6.separator{
    margin-bottom: 20px;
    letter-spacing: 1px;
}
.tab-content .fechas-precios .preciototal{
    min-height: 30px;
    background-color: #E5E5E5;
    margin-top: 30px;
    padding-bottom: 10px;
    margin-left: 0;
    margin-right: 0;
}
.tab-content #booking-total{
    color: #000000;
    font-weight: bold;
    margin-top: 10px;
    margin-bottom: 0;
    letter-spacing: 0.5px;
    line-height: 1em;
    font-size: 1.2em;
}
.tab-content #booking-total small{
    color: darkred;
    font-weight: bold;
    margin-top: 10px;
    margin-bottom: 0;
    letter-spacing: 0.5px;
    line-height: 1em;
    font-size: 14px;
}
.tab-content .fechas-precios .preciosubtotal{
    min-height: 30px;
    background-color: #E5E5E5;
    margin-top: 40px;
    padding-bottom: 10px;
    margin-left: 0;
    margin-right: 0;
}
.tab-content .fechas-precios #booking-subtotal-div h5{
    color: #000000;
    font-weight: normal;
    margin-top: 10px;
    margin-bottom: 0;
    letter-spacing: 0.5px;
    line-height: 1em;
    font-size: 1em;
    min-height: 40px;
    padding-top: 20px;
}
.tab-content .fechas-precios #booking-subtotal{
    padding-top: 10px;
}
.tab-content #booking-sub-total small{
    color: darkred;
    font-weight: bold;
    margin-top: 10px;
    margin-bottom: 0;
    letter-spacing: 0.5px;
    line-height: 1em;
    font-size: 14px;
}
.tab-content .fechas-precios h4.divisas {
    font-size: 1em;
}
.tab-content .fechas-precios ul.divisas {
    padding-left: 0;
    list-style-type: none;
    font-size: 0.9em;
}

.tab-content .fechas-precios a:link.verincluye, .tab-content .fechas-precios a:visited.verincluye{
    cursor: pointer;
    color: #B69510;
    text-decoration: none;
    padding-left: 20px;
}
.tab-content .fechas-precios a:active.verincluye, .tab-content .fechas-precios a:hover.verincluye{
    cursor: pointer;
    color: #222;
    text-decoration: none;
}
.tab-content .fechas-precios a.verincluye.collapsed:before{
    content: "\f067"; /* FontAwesome Unicode */
    font-family: FontAwesome;
    display: inline-block;
    -webkit-transition: all 500ms;
    -moz-transition: all 500ms;
    -ms-transition: all 500ms;
    -o-transition: all 500ms;
    transition: all 500ms;
}
.tab-content .fechas-precios a.verincluye:not(.collapsed):before{
    content: "\f067"; /* FontAwesome Unicode */
    font-family: FontAwesome;
    display: inline-block;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transition: all 500ms;
    -moz-transition: all 500ms;
    -ms-transition: all 500ms;
    -o-transition: all 500ms;
    transition: all 500ms;
    color: #B69510 !important;
}
.tab-content .fechas-precios h2{
    font-size: 1.5em;
    color: #222;
    margin-top: 100px;
}
.tab-content ul.incluye{
    list-style: none;
    padding: 0;
    margin-top: 10px;
}
.tab-content ul.incluye li {
    padding-left: 1.3em;
    letter-spacing: normal;
    line-height: 1em;
    font-size: 0.9em;
}
.tab-content ul.incluye li:before {
    content: "\f00c"; /* FontAwesome Unicode */
    font-family: FontAwesome;
    display: inline-block;
    margin-left: -1.3em; /* same as padding-left set on li */
    width: 1.3em; /* same as padding-left set on li */
    color: #CCC;
}
.tab-content .fechas-precios a.verincluye{
    font-size: 0.9em;
    letter-spacing: 0px;
}
.tab-content .fechas-precios .precio{
    margin-bottom: 30px;
}
.tab-content .extras{
    margin-bottom: 30px;
}
.tab-content .extras p{
    margin-bottom: 0px;
}
.tab-content .introduccion{
    font-weight: 700;
    margin-bottom: 30px;
}
.tab-content .introduccion-cic{
    color: #8e44ad;
    font-size: 1.2em;
    text-align: center;
}

.tab-content .incluye span:not(.hps){
    min-width: 14px;
    display: inline-block;
    text-align: right;
    margin-right: 2px;
    font-weight: bold;
}
.tab-content .incluyecurso{
    font-weight: bold;
}
.tab-pane > h4:first-child{
    margin-top: 0px;
}

#programa.tab-pane img{
    margin-top: 20px;
    margin-bottom: 20px;
}
.incluye ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
.incluye li {
    padding-bottom: 0.4em;
    letter-spacing: normal;
}
.incluye li:before {
    content: "\f00c";
    font-family: FontAwesome;
    margin-right: 4px;
}
.tab-content table{
    margin-top: 30px;
    width: 100%;
}
.tab-content tr {
    border-bottom: 1px solid #ccc;
}
.tab-content td {
    padding-top: 6px;
    padding-bottom: 6px;
}
.tab-content thead {
    font-weight: 400;
}
.tab-content .planb {
    margin-bottom: 40px;
}
.tab-content .planbinfo {
    cursor: help;
    color: #999;
}

.tab-content .videoslink{
    display:block;
    background: #e5e5e5;
    border-radius: 5px;
    padding: 20px;
    text-align: center;
}

.videowrapper {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
    margin-top: 60px;
}
.videowrapper iframe,
.videowrapper object,
.videowrapper embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


.info-general{
    font-size: 1.2em;
    font-family: 'Roboto Slab', monospace;
    margin-top: 20px;
    margin-bottom: 20px;
}
.info-general > p{
    font-size: 0.8em;
    color: #000;
    font-weight: 300;
    margin-top: 20px;
}
.info-general p:first-child {
    margin-bottom: 0;
}

ul.relacionados{
    list-style: none;
    padding: 0;
}
ul.relacionados li{
    padding: 4px 0px 4px 20px;
    border-bottom: 1px solid #e5e5e5;
}
ul.relacionados li:before{
    position: absolute;
    content: '\25b6';
    vertical-align: middle;
    margin-top: -2px;
    margin-left: -16px;
    font-size: 0.6em;
}

#fotos-aloja{
    margin-top: 40px;
}

#fotos-curso .fotos,
#fotos-aloja .fotos{
    padding-bottom: 25%;
    overflow: hidden;
}
#fotos-curso .fotos .foto,
#fotos-aloja .fotos .foto{
    position: absolute;
    /* width:94%; */
    /* padding: 2% 3%; */
}

@media screen and (max-width: 991px) {
    #fotos-curso .fotos,
    #fotos-aloja .fotos {
        padding-bottom: 35%;
        overflow: hidden;
    }

    #fotos-curso .fotos .foto,
    #fotos-aloja .fotos .foto {
        position: absolute;
        height: 92%;
        width: 96%;
        padding: 4% 2%;
    }
}

@media screen and (max-width: 767px) {
    #fotos-curso .fotos,
    #fotos-aloja .fotos {
        padding-bottom: 64%;
        overflow: hidden;
    }

    #fotos-curso .fotos .foto,
    #fotos-aloja .fotos .foto {
        position: absolute;
        height: 84%;
        width: 98%;
        padding: 8% 1%;
    }

    #fotos-curso .fotos img,
    #fotos-aloja .fotos img {
        width: 100%;
    }
}


#fotos-curso img,
#fotos-aloja img{
    width: 240px;
    /*margin: 5px;*/
    /* border: 1px solid #666; */
}
#fotos-curso a:hover img,
#fotos-aloja a:hover img{
    border-color: #B69510;
}
#fotos-curso a:focus,
#fotos-aloja a:focus{
    outline: none;
}

.earlybird, #fechas-precios img{
    vertical-align: bottom;
    cursor: help;
    margin-left: -4px;
}
#fechas-precios .tabla-precios{
    margin-bottom: 60px;
}

.tooltipinfo p{
    font-weight: 100;
}

.tooltipinfo span{
    font-size: 1.2em;
    margin-top: 6px;
    display: block;
    font-weight: 300;
    margin-bottom: 0;
}


.bootstrap-datetimepicker-widget{
    z-index: 8;
}


@media screen and (max-width: 767px){
    
    .curso .tabscurso{
        float: right;
        margin-top: 0px;
        position: relative;
    }
}



/*
contacto
======================================= */

.head{
    font-size: 1.5em;
    border-bottom: 1px solid #e5e5e5;
    display: block;
}
.horario{
    margin-top: 40px;
}
.obligatorio{
    line-height: 0.5em;
}

.formlist small{
    line-height: 1em;
}

.addmargintop20{
    margin-top: 20px;
}

.addmargintop30{
    margin-top: 30px;
}

.addmargintop60{
    margin-top: 60px;
}

.addmarginbottom30{
    margin-bottom: 30px;
}

.addmarginbottom60{
    margin-bottom: 60px;
}

img.catalogo{
    border: 1px solid #000000;
}

/*
Contacto
======================================= */
.validation {
    display:none;
    margin-top: 5px;
    color: red;
}

#sendmessage{
    display:none;
}

#sendmessage.show,.show  {
    display:block;
}

#mapa_info p{
    cursor: crosshair;
}

#mapa_info p strong{
    text-transform: uppercase;
}

#mapa{
    display: block;
}

.formlist{
    float: left;
    width: 100%;
    height: auto;
    margin-top: 20px;
}
.formlist .form-group{
    margin-bottom: 15px;
    float: left;
    width: 100%;
}


/*
Copyright
======================================= */
#copy{
    margin-top: 80px;
    margin-bottom: 60px;
    display: block;
    float: left;
}
#copy p{
    color: #999;
    font-size: 12px;
    width: auto;
    float: left;
    line-height: 20px;
    margin-bottom:0;
}
#copy ul.legal{
    list-style: none;
    display: inline;
    float: left;
    font-size: 12px;
    color: #222;
    padding-left: 0px;
    margin-left: 20px;
    letter-spacing: normal;
    margin-bottom: 0;
    line-height: 20px;
}
#copy ul.legal li{
    display: inline;
    border-right: 1px solid #CCC;
    padding-right: 10px;
    margin-right: 10px;
}
#copy ul.legal li:last-child{
    border-right: none;
    padding-right: 0px;
    margin-right: 0px;
}
#copy a:link, #copy a:visited{
    color: #2c2c2c;
}
#copy a:active, #copy a:hover{
    color: #000000;
}

/*
Footer
======================================= */

#main-footer ul.secondary li .destacado{
    color: #FFF;
}

#main-footer{
    display: block;
    position: fixed;
    bottom: 0px;
    background: black;
    height: 32px;
    width: 100%;
    border-top: 3px solid white;
    z-index:100;
}
#main-footer .container-fluid{
    padding-left: 0;
    padding-right: 0;
}
#main-footer a{
    text-decoration: none;
}

#main-footer ul.social{
    list-style: none;
    display: inline;
    float: right;
    font-size: 1.2em;
    color: #FFF;
    background: #ccc url(../img/pattern03.png) 2px 2px repeat;
    padding: 0;
    padding-left: 40px;
    margin: 0;
    height: 32px;
    padding-top: 4px;
    margin-right: 32px;
}
#main-footer ul.social li{
    display: inline;
    padding-right: 18px;
}
#main-footer ul.social a:link, #main-footer ul.social a:visited{
    color: #FFF;
}
#main-footer ul.social a:active, #main-footer ul.social a:hover{
    color: #000;
}

#main-footer ul.secondary{
    list-style: none;
    display: inline;
    float: left;
    font-size: 12px;
    color: #222;
    padding-top: 2px;
    padding-left: 0px;
    margin-left: 20px;
    letter-spacing: normal;
    margin-bottom: 0;
    margin-top: 2px;
}
#main-footer ul.secondary li{
    display: inline;
    margin-right: 15px;
}
#main-footer ul.secondary li:last-child{
    border-right: none;
    padding-right: 0px;
    margin-right: 0px;
}
#main-footer ul.secondary li.separator:before{
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    display: inline-block;
    width: 1px;
    height: 20px;
    background: #FFF;
    content: '';
    position: absolute;
}

#main-footer ul.secondary a:active, #main-footer ul.secondary a:hover{
    color: #FFF;
}

.btn-contact{
    background: #f1c40f;
    height: 32px;
    min-width: 120px;
    display: table-cell;
    float: right;
    text-align: center;
    padding-top: 4px;
    color: #000;
    font-weight: 400;
    letter-spacing: 1px;
    border-right: 4px solid #fff;
}
.btn-clientes{
    background:#e5e5e5;
    height: 32px;
    min-width: 180px;
    display: table-cell;
    float: right;
    text-align: center;
    padding-top: 4px;
    color: #000;
    font-weight: 400;
    letter-spacing: 1px;
    border-right: 4px solid #fff;
}
.btn-idioma{
    background:#333;
    height: 32px;
    min-width: 60px;
    display: table-cell;
    float: right;
    text-align: center;
    padding-top: 4px;
    color: #000;
    font-weight: 400;
    letter-spacing: 1px;
    border-right: 4px solid #fff;
    border-left: 4px solid #fff;
    font-size: 0.8em;
}
.btn-search{
    background: #000;
    height: 32px;
    width: 32px;
    display: block;
    float: right;
    text-align: center;
    color: #FFF;
    padding-top: 4px;
    position: absolute;
    right: 0;
    z-index: 60;
}

#search-box{
    position: absolute;
    /* bottom: 0px; */
    width: 0px;
    height: 30px;
    z-index: 50;
    background: #000;
    -webkit-transform: skewX(-45deg);
    -moz-transform: skewX(-45deg);
    -ms-transform: skewX(-45deg);
    -o-transform: skewX(-45deg);
    transform: skewX(-45deg);
    display: block;
    right: 18px;
    overflow: hidden;
}

#search-box input.searchbox-input {
    width: 190px;
    float: right;
    padding: 0;
    height: 30px;
    padding-bottom: 2px;
    border: none;
    background: #000;
    text-indent: 6px;
    -webkit-transform: skewX(45deg);
    -moz-transform: skewX(45deg);
    -ms-transform: skewX(45deg);
    -o-transform: skewX(45deg);
    transform: skewX(45deg);
    margin-right: 20px;
    color: #ccc;
}
#search-box input.searchbox-input:focus {
    border: none;
    outline: none;
}
input#search::-webkit-input-placeholder {
    color: rgb(132, 132, 132);
}
input#search::-webkit-input-placeholder { /* WebKit browsers */
    color: rgb(132, 132, 132);
}
input#search:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color: rgb(132, 132, 132);
    opacity:  1;
}
input#search::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: rgb(132, 132, 132);
    opacity:  1;
}
input#search:-ms-input-placeholder { /* Internet Explorer 10+ */
    color: rgb(132, 132, 132);
}

.btn-clientes span, .btn-contact span, .btn-idioma span{
    -webkit-transform: skewX(45deg);
    -moz-transform: skewX(45deg);
    -ms-transform: skewX(45deg);
    -o-transform: skewX(45deg);
    transform: skewX(45deg);
    display: block;
}
a.btn-contact:link, a.btn-contact:visited,
a.btn-clientes:link, a.btn-clientes:visited{
    color: #000;
    -webkit-transform: skewX(-45deg);
    -moz-transform: skewX(-45deg);
    -ms-transform: skewX(-45deg);
    -o-transform: skewX(-45deg);
    transform: skewX(-45deg);
    display:block;
}
a.btn-contact:active, a.btn-contact:hover,
a.btn-clientes:active, a.btn-clientes:hover{
    color: #FFF;
}
a.btn-idioma:link, a.btn-idioma:visited{
    color: #FFF;
    -webkit-transform: skewX(-45deg);
    -moz-transform: skewX(-45deg);
    -ms-transform: skewX(-45deg);
    -o-transform: skewX(-45deg);
    transform: skewX(-45deg);
    display:block;
}
a.btn-idioma:active, a.btn-idioma:hover{
    color: #f1c40f;
}
a.btn-contact{
    margin-right: -20px;
}
a.btn-search:link, a.btn-search:visited{
    color: #FFF;
}
a.btn-search:active, a.btn-search:hover{
    color: #f1c40f;
}


@media only screen and (max-width: 1320px) {
    .btns-div{
        clear: both;
        width: 114%;
        position: absolute;
        margin-top: -32px;
        margin-left: -20px;
    }
    .btn-clientes, .btn-contact{
        width: 45%;
        max-width: 45%;
        font-size: 1em;
        border: none;
        -webkit-transform: skewX(0deg);
        -moz-transform: skewX(0deg);
        -ms-transform: skewX(0deg);
        -o-transform: skewX(0deg);
        transform: skewX(0deg);
    }
    a.btn-contact {
        margin-right: 0px;
        padding-right: 60px;
    }
    .btn-idioma{
        width: 10%;
        max-width: 10%;
        border: none;
        -webkit-transform: skewX(0deg);
        -moz-transform: skewX(0deg);
        -ms-transform: skewX(0deg);
        -o-transform: skewX(0deg);
        transform: skewX(0deg);
        padding-left: 20px;
    }

    .copyright, .social-div{
        margin-top: 32px;
        font-size: 0.9em;
    }
    #main-footer{
        height: 64px;
    }
    #menu-close{
        margin-left: 0px;
    }
    #main-footer ul.secondary{
        margin-top: 0;
    }
    #main-footer ul.secondary .separator{
        margin-right: 14px;
    }
    #main-footer ul.secondary li{
        margin-right: 10px;
    }
    #main-footer ul.social {
        padding-left: 20px;
        padding-top: 3px;
        padding-right: 20px;
        margin-right: 10px;
        border-left: 4px #fff solid;
        -webkit-transform: skewX(-45deg);
        -moz-transform: skewX(-45deg);
        -ms-transform: skewX(-45deg);
        -o-transform: skewX(-45deg);
        transform: skewX(-45deg);
    }
    #main-footer ul.secondary li.separator:before {
        height: 16px;
        margin-top: 3px;
    }
    #main-footer ul.social li a{
        -webkit-transform: skewX(45deg);
        -moz-transform: skewX(45deg);
        -ms-transform: skewX(45deg);
        -o-transform: skewX(45deg);
        transform: skewX(45deg);
        display: inline-block;
    }
}

@media only screen and (max-width: 1024px) {
    .btn-contact{
        font-size: 0.8em;
        width:96px;
        min-width:96px;
        padding-top: 6px;
        letter-spacing: 1px;
    }
    .btn-clientes{
        font-size: 0.8em;
        width: 144px;
        min-width: 144px;
        padding-top: 6px;
        letter-spacing: 1px;
    }
    #main-footer p, #main-footer ul.legal{
        padding-top: 8px;
    }
    #main-footer ul.legal li{
        padding-right: 10px;
        margin-right: 10px;
    }
    #main-footer .fa, #main-footer ul.social{
        padding-top: 2px;
    }
}
@media only screen and (max-width: 768px) {
    .btns-div{
        clear: both;
        width: 114%;
        position: absolute;
        margin-top: -32px;
        margin-left: -20px;
    }
    .btn-clientes, .btn-contact{
        width: 45%;
        max-width: 45%;
        font-size: 1em;
        border: none;
        -webkit-transform: skewX(0deg);
        -moz-transform: skewX(0deg);
        -ms-transform: skewX(0deg);
        -o-transform: skewX(0deg);
        transform: skewX(0deg);
    }
    a.btn-contact {
        margin-right: 0px;
        padding-right: 60px;
    }
    .btn-idioma{
        width: 10%;
        max-width: 10%;
        border: none;
        -webkit-transform: skewX(0deg);
        -moz-transform: skewX(0deg);
        -ms-transform: skewX(0deg);
        -o-transform: skewX(0deg);
        transform: skewX(0deg);
        padding-left: 20px;
    }
    .btn-search{
        padding-top: 2px;
    }
    .copyright, .social-div{
        margin-top: 32px;
        font-size: 0.9em;
    }
    #main-footer{
        height: 64px;
    }
    #main-footer ul.secondary{
        font-size: 0.6em;
    }
    #main-footer ul.secondary li{
        margin-right: 10px;
    }
    #main-footer ul.social {
        padding-left: 20px;
        padding-top: 4px;
    }
    #main-footer ul.secondary li.separator:before {
        height: 12px;
        margin-top: 4px;
    }
}