/*Carrusel*/

#Slider {
    /*background: url('../images/templatemo_carousel_bg.jpg') no-repeat center center fixed;*/
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    overflow-x: hidden;
    margin-bottom:0;
    height: 500px;
}

#Slider .carousel-caption {
    z-index: 10;
}

#Slider .item {
    height: 500px;
}

#Slider .carousel-inner > .item > img {
    position: absolute;
    min-width: 100%;
    height: 500px;
    left: 0;
    top: 0;
}

@media (min-width: 768px) {
    #Slider .carousel-inner .item:nth-child(2)>.opaco{
        position: absolute;/*La posicion y (posible) tamaño
        de la caja se especifican segun top right bottom y left
        que definen el desplazamiento respecto al bloque contenedor
        las cajas abosultas estan fuera de flujo y no chocan con otras*/
        top: 0;
        right:0;
        bottom:0;
        left: 0;
        background-color:black; 
        opacity: 0.2;
    }    

    #Slider .carousel-caption p {
        margin-bottom: 20px;
        line-height: 1.4;
        font-size: 21px;
    }

    #Slider .carousel-caption {
        padding-bottom: 140px;
        right: 20%;
        left: 20%;
    }

    #Slider .carousel-inner .item:not(:nth-child(1)) 
    > .container> .carousel-caption{
        top: 35%;
    }
}



@media (max-width: 767px) {

    #BarraIntermedia{
        margin-top:50px;
    }
    
    #Slider{
        display:none;
    }

}



@media (max-width: 1024px) {

    #Slider {
        /*background: url('../images/templatemo_carousel_bg_s.jpg') no-repeat center center;*/ 
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
        overflow-x: hidden;
        margin-bottom:0;
        height: 500px;
    }
}

/*aqui termina el carusssel*/



/*Seccion despues del slider*/

#BarraIntermedia{
    background-color:white;
}

.Barra_intermedio-welcome {
    border-bottom: 1px solid #cccccc;
}

.Barra_intermedio-slogan {
    font-family:  'Open Sans', sans-serif;
    font-weight: normal;
    font-size: 42px;
    margin: 60px 0;
    color: #333333;
}

.txt_lightblue{
    color:#1fb6de;
}

.txt_darkblue{
	color:#293f9c;
}

.txt_darkgrey {
    color: #333333;
}

.txt_orange {
    color: #e67e22;
}


.txt_slogan {
    font-size:14px;
    color:#929292;
}


#BarraIntermedia hr{
    margin:0px;
}

/*Aqui termina la seccion posterior al slider*/



/*Generico para las secciones*/

#Productos, #EmpresasAmigas{
    margin-top:10%;
}

/*Fin CSS Genérico para las secciones*/



/*Servicios*/

.ServiceGroup {
    margin-bottom: 100px;
    margin-top: 100px;
}

.ServiceGroup>.container>.row{
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
}

.service-item {
    font-family:  'Open Sans', sans-serif;
    /*font-size: 20px;*/
}

.service-item>.item-header-container {
    text-align:center;
}


.item-header-container img{
    max-width:50%;
}

.service-item-header {
    width:100%;
    margin-top: 0px;
    margin-left: -10px;
    padding: 16px 20px 0;
    display: inline-block;
    font-size: 20px;
    font-weight: bold;
}



@media(max-width:768px) and (min-resolution:2dppx){
    .service-item:not(:nth-child(1)){
        margin-top: 15%;
    }
    .service-item{
        margin-bottom: 14%;
    }
}

@media(min-width:769px) and (max-resolution:2dppx),
      (min-width:1024px) and (min-resolution:1dppx),
      (min-width:769px) and (-webkit-max-device-pixel-ratio:2),
      (min-width:1024px) and (-webkit-min-device-pixel-ratio:1){
    .service-item{
        margin-bottom: 7%;
    }
}

@media(min-width:768px){
    .ServiceGroup .row .service-item h2{
        /*min-height: 5.5vw;*/
        min-height: 3.7em;
        padding-bottom: 0;
    }

    .ServiceGroup .row .service-item p{
        margin-top:4.7%;
    }    

    .ServiceGroup .row .service-item:not(:nth-child(2)) p{
        margin-bottom: 9.4%;
    }
}


@media	only screen and (-webkit-min-device-pixel-ratio: 1.3) and (min-witdh:768px),
	only screen and (-o-min-device-pixel-ratio: 13/10) and (min-witdh:768px),
	only screen and (min-resolution: 120dpi) and (min-width:768px)
        {
            .ServiceGroup .row .service-item[class^="col"]{
                width:50%;
                float:left;
            }        

            .ServiceGroup .row .service-item[class^="col"]:not(:nth-child(2))
             .service-item p {
                margin-bottom: 7%;
            }
        }

@media	only screen and (max-resolution: 1dppx) and (min-width:1024px),
        only screen and (-webkit-max-device-pixel-ratio: 1) and (min-width:1366px),
        only screen and (-webkit-min-device-pixel-ratio: 2.1) and (min-width:1366px)
        {
            .service-item-header.sih-esp{
                line-height: 2.2;
            }
        }

@media	only screen and (min-resolution: 2dppx) and (max-resolution: 3dppx) and (max-width:1366px)
        {
            .service-item-header.sih-esp:not(.last){
                line-height: 2.2;
            }
        }

@media (max-width:991px) {
    /*.team-inner {
        margin-top: 20px;
        margin-bottom: 20px;
    }*/	

    .btn-read-more {
        margin-bottom :40px;
    }
}


.service-item p {
    font-weight: lighter;
    text-align: justify;
    margin-top: 25px;
    font-size: 17px;
    color: #929292;
}

.service-item>.text-center{
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin-bottom: -12%;
}

@media(max-width:768px) and (min-resolution:2dppx){
    .service-item>.text-center{
        margin-bottom: -20%;
    }
}

.btn-orange {
    background-color: #ff7600;
    border-bottom:2px solid #d35400;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    color:#ffffff;
}



.btn-orange:hover, .btn-orange:focus, .btn-orange:active, .btn-orange.active, .open .dropdown-toggle.btn-orange {
    background-color: #d35400;
    color:#ffffff;
}



.btn-container{
    margin-top:5%;
    text-align:center;
}



.btn-container a{

    text-decoration:none;

    color:white;

}



.btn-green {
    background-color:#2ecc71;
    border-bottom:2px solid #27ae60;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    color:#ffffff;
}


.btn-green:hover, .btn-green:focus, .btn-green:active, .btn-green.active, .open .dropdown-toggle.btn-green {

    background-color: #27ae60;
    color:#ffffff;
}


/*aqui temina servicio*/



/*Aqu� empieza la secci�n de productos*/



#Productos .product-header-container{

    text-align:center;

}

#Productos .product-header-container img{

    max-width:50%;

    height:auto;

}



#Productos .product-header{

    width: 100%;

    margin-left: -10px;

    padding: 16px 20px 20px;

    font-weight: bold;

    font-size:20px;

    display: inline-block;

}



#Productos .itemProducto p{

    margin-top:20px;

    text-align:justify;

    color:#929292;

    font-size:17px;

}

/*Aqu� termina la secci�n de productos*/



/*Aqu� empieza la secci�n de empresas amigas*/

#EmpresasAmigas{

    padding-bottom:5%;

    width:100%;

}



@media(max-width:767px){

    #sliderEmpresas{

        display:none;

    }

    #grupoEmpresasAmigasMovil{

        display:initial;

    }

}



@media(max-width:767px) and (orientation:portrait){

    #grupoEmpresasAmigasMovil .empresaAmiga{

        width:50%;

        float:left;

    }

}



@media(min-width:768px){

    #grupoEmpresasAmigasMovil{

        display:none;

    }



    #carouselEmpresas .carousel-inner>.item {

        transition: transform 5s linear;
        perspective: 1000px;

    }



    #carouselEmpresas .carousel-control.left{

        background-image: linear-gradient(to right, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, .0001) 100%);

    }



    #carouselEmpresas .carousel-control.right{

        background-image: linear-gradient(to right, rgba(0, 0, 0, .0001) 0%, rgba(0, 0, 0, 0.1) 100%);

    }

}

/*Aqu� termina la secci�n de empresas amigas*/