﻿@font-face {
    font-family: 'Trebuchet MS';
    src: url('../fonts/Trebuchet MS.ttf') format('ttf');
    font-weight: normal;
    font-style: normal;
}

body {
    margin: 0 auto;
    background-color: #DDD;
    font-family: 'Roboto Condensed', sans-serif;
    background-color: #ffffff;
    /*background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40'%3E%3Cg fill-rule='evenodd'%3E%3Cg fill='%23e7e7e7' fill-opacity='0.4'%3E%3Cpath d='M0 38.59l2.83-2.83 1.41 1.41L1.41 40H0v-1.41zM0 1.4l2.83 2.83 1.41-1.41L1.41 0H0v1.41zM38.59 40l-2.83-2.83 1.41-1.41L40 38.59V40h-1.41zM40 1.41l-2.83 2.83-1.41-1.41L38.59 0H40v1.41zM20 18.6l2.83-2.83 1.41 1.41L21.41 20l2.83 2.83-1.41 1.41L20 21.41l-2.83 2.83-1.41-1.41L18.59 20l-2.83-2.83 1.41-1.41L20 18.59z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");*/
}

.clear {
    clear:both;
}

#wrapper, #menu, #header {
    /* width: 93%; */
    height:auto;
    margin:0 auto;
}

#menu {
    background-color: #161c1f;
    height: 80px;
}

#header {
    background-color: #FFF;
}

#boxMenu, #boxHeader {
    margin: 0 auto;
    width: 945px;
}

#boxMenu {    
    height:70px;
}

    #boxMenu ul {
        list-style: none;
        margin: 0px;
        padding: 15px;
    }

    #boxMenu ul li {
        float: left;
        margin-right: 30px;
        font-size: 16px;
        color: #FFF;
        padding: 16px 0px;
        font-weight:bold;
    }

    #boxMenu ul a li:hover {
        color: #c42a2d;
        cursor: pointer;
    }

    #boxMenu ul a li:active {
        color: #c42a2d;
    }

#boxContacto {
    float:right;
    font-size:20px;
    color:#FFF;
}

    #boxContacto a {
        color: #FFF;
        text-decoration: none;
    }

    #boxContacto i {
        margin-left: 15px;
    }

        #boxContacto a i {
            float: left;
            margin-right: 15px;
        }

.boxMenuImg {
    float: left;
}

.boxMenuImg img {
    height: 80px;
    max-width: 100%;
}

#sliderCamera {
    height:427px !important;
}

#content {
    width:1200px;
    height: auto;
    margin:0 auto;
}

    #content h2 {
        text-align: center;
        padding: 10px;
        text-transform: uppercase;
        font-size: 25px;
        font-weight: bold;
        margin-top: 40px;
    }

.bottomTitulo {
    width: 150px;
    height: 10px;
    margin: -10px auto 20px auto;
    background-color: #ffd800;
}

#boxCursos, #boxNosotros, #boxCursosAdicionales, #boxClientes, #boxContactoContent, #boxContactoMapa {
    width: 100%;
}

.boxCurso {
    width: 260px;
    height: 360px;
    padding: 10px;
    float: left;
    margin: 20px;
}

    .boxCurso ol {
        height:160px;
    }

        .boxCurso ol li {
            margin: 5px;
            font-size: 13px;
        }

.titCurso {
    font-size: 15px;
    margin-bottom: 20px;
    text-align: center;
    height: 50px;
    font-weight:bold
}

.boxCursoCaracteristicaIcono {
    text-align:center;
    margin-bottom:10px;
}

.boxCursoCarateristicas i {
    font-size: 60px;
    color:#c42a2d;
}

.btnLeerMas {
    margin: 30px auto;
    width: 150px;
    height: 40px;
    padding: 10px;
    background-color: #000;
    text-align: center;
    cursor: pointer;
    color: #FFF;
}

.btnLeerMas:hover {
    background-color: #ffd800;
    color:#000;
}

    .btnLeerMas:hover a {
        color: #000;
        text-decoration: none;
    }

    .btnLeerMas a {
        color: #FFF;
        text-decoration: none;
    }

        .btnLeerMas a:hover {
            color: #000;
            text-decoration: none;
        }

.boxAdicional {
    width:220px;
    height:220px;
    float:left;
    cursor:pointer;
    margin:10px;
}

    .boxAdicional img {
        width:220px;
    }

.titAdicional {
    color: #FFF;
    text-align: center;
    padding: 90px 20px;
    font-size: 20px;
    font-weight: bold;
    text-shadow: 4px 3px 0 #7A7A7A;
}

.c1 {
    background: url('/img/cursos/1.jpg') no-repeat center;
}

.c1Over {
    background: url('/img/cursos/1_over.jpg') no-repeat center;
}

    .c2 {
        background: url('/img/cursos/2.jpg') no-repeat center;
    }

.c2Over {
    background: url('/img/cursos/2_over.jpg') no-repeat center;
}

.c3 {
    background: url('/img/cursos/3.jpg') no-repeat center;
}

.c3Over {
    background: url('/img/cursos/3_over.jpg') no-repeat center;
}

.c4 {
    background: url('/img/cursos/4.jpg') no-repeat center;
}

.c4Over {
    background: url('/img/cursos/4_over.jpg') no-repeat center;
}

.c5 {
    background: url('/img/cursos/5.jpg') no-repeat center;
}

.c5Over {
    background: url('/img/cursos/5_over.jpg') no-repeat center;
}

.c6 {
    background: url('/img/cursos/6.jpg') no-repeat center;
}

.c6Over {
    background: url('/img/cursos/6_over.jpg') no-repeat center;
}

.c7 {
    background: url('/img/cursos/7.jpg') no-repeat center;
}

.c7Over {
    background: url('/img/cursos/7_over.jpg') no-repeat center;
}

.c8 {
    background: url('/img/cursos/8.jpg') no-repeat center;
}

.c8Over {
    background: url('/img/cursos/8_over.jpg') no-repeat center;
}

.c9 {
    background: url('/img/cursos/9.jpg') no-repeat center;
}

.c9Over {
    background: url('/img/cursos/9_over.jpg') no-repeat center;
}

.c10 {
    background: url('/img/cursos/10.jpg') no-repeat center;
}

.c10Over {
    background: url('/img/cursos/10_over.jpg') no-repeat center;
}

.c11 {
    background: url('/img/cursos/11.jpg') no-repeat center;
}

.c11Over {
    background: url('/img/cursos/11_over.jpg') no-repeat center;
}

.c12 {
    background: url('/img/cursos/12.jpg') no-repeat center;
}

.c12Over {
    background: url('/img/cursos/12_over.jpg') no-repeat center;
}

.c13 {
    background: url('/img/cursos/13.jpg') no-repeat center;
}

.c13Over {
    background: url('/img/cursos/13_over.jpg') no-repeat center;
}

.c14 {
    background: url('/img/cursos/14.jpg') no-repeat center;
}

.c14Over {
    background: url('/img/cursos/14_over.jpg') no-repeat center;
}

.c15 {
    background: url('/img/cursos/15.jpg') no-repeat center;
}

.c15Over {
    background: url('/img/cursos/15_over.jpg') no-repeat center;
}

.c16 {
    background: url('/img/cursos/16.jpg') no-repeat center;
}

.c16Over {
    background: url('/img/cursos/16_over.jpg') no-repeat center;
}

.c17 {
    background: url('/img/cursos/17.jpg') no-repeat center;
}

.c17Over {
    background: url('/img/cursos/17_over.jpg') no-repeat center;
}

.boxClientesLogos {
    margin:0 auto;
    width:900px;
    height:150px;
}

.boxNosotrosTexto {
    width: 650px;
    float: left;
    text-align: justify;
    padding: 20px;
}

    .boxNosotrosTexto p {
        width: 400px;
        float: right;
    }

    .boxNosotrosTexto ol li {
        font-size:20px;
    }

    .boxNosotrosImg {
        width: 535px;
        height: 350px;
        float: right;
    }

.boxNosotrosImg img {
    width:100%;
    margin-top:20px;
}

#boxContactoForm {
    float: left;
    padding: 40px;
    width: 580px;
}

#boxContactoDatos {    
    float: right;
    padding: 40px;
    width: 580px;
}

    #boxContactoDatos i {
        font-size:20px;
        font-weight:bold;
    }

    #fomrct{
        width: 100%px !important;
        max-width: 100%px !important;
    }
@media screen and (max-width:1024px) {
    .boxMenuImg {
        float: none;
        width: 14%;
        display: inline-block;
        vertical-align: top;
    }
    #boxMenu, #boxHeader{
        width: 84%;
        display: inline-block;
    }
    #boxMenu ul{
        padding: 5px;
    }
    #boxMenu{
        height: 90px;
    }
    #menu{
        height: 90px;
        width: 100%;
    }
    #boxContacto{
        /* float: left; */
        /* display: block; */
    }
    #boxMenu ul li{
        font-size: 15px;
    }
    .boxNosotrosTexto,#content,.boxNosotrosTexto p,.boxClientesLogos,.boxClientesLogos img,#boxContactoForm,#boxContactoDatos{
        width:100%;
    }
    .boxNosotrosImg{
        width:90%;
        height:auto;
        margin: 0 auto;
        display:block;
        float: none;
    }
    iframe {
        width: 100%px !important;
    }
    #fomrct{
        width: 100%px !important;
        max-width: 100%px !important;
    }
    .boxCurso{
        width: 44%;
        display:inline-block;
        height:auto;
    }
    #boxContactoDatos p{
        display:inline-block;
        vertical-align:top;
        padding-right: 20px;
    }
    #boxContactoDatos{
        text-align:center;
    }
    
    .boxMenuImg img {
        height: 80px;
        width: 100%;
    }
}


@media screen and (max-width:440px) {
    .boxCurso{
        padding: 0 5%;
        width: 90%;
    }
    .boxAdicional{
        width: 90%;
        padding: 0 5%;
    }
    .boxMenuImg{
        width:auto;
        height:auto;
    }
    .boxMenuImg img{
        width:auto;
    }
    #boxMenu{
        z-index: 999999;
        width: 100%;
        height: auto;
        display: none;
    }
    #menu{
        height:auto;
        //position: fixed;
        z-index: 99;
    }
    #boxMenu ul li{
        width:100%;
        text-align:center;
        padding: 10px 0;
        float: none;
    }
    #boxContacto{
        
        width: 100%;

        float: none;

        text-align: center;

        padding-bottom: 10px;
    }
    .menuMovil{        
        background-image: url('/img/nav-icon.png');
        width: 30px;
        height: 30px;
        background-repeat: no-repeat;
        position: absolute;
        top: 21px;
        right: 10px;
        background-size: contain;
        cursor: pointer;
    }
    
    #sliderCamera{
        height:200px !important;
    }
    /*#sliderCamera{
        padding-top: 80px;
    }*/
}