html {
	height: 100%;
}
body {
	background: #F1F1F1;
	font-family: calibri;
	height: 100%;
}
.cuerpo {
	min-height: 100%;
    position: relative;
}
.container {
	text-align:justify;
}
* {
	margin: 0;
	padding: 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
/* HEADER */
header{
    background: blanchedalmond;
    height:auto;
    position: relative;
    width: 100%;
   
}
/* El logo sera flotado a la izquierda */
#img{
  
   max-width: 100%;
  height: auto;
}

   

#img-contacto{
  max-width: 100%;
  height: auto;

}
/* Nuestro nav con id #menu lo flotaremos a la derecha*/
#menu{float: right;}   
    /* Quitamos estilos por defecto de el tag UL */
#menu ul{
    list-style: none;
    font-size: 14px;
}
/* Centramos y ponemos los textos en mayuscula */
#menu li{
	float: left;
	text-transform: uppercase;
	text-align: center;
}
/* Damos estilo a nuestros enlaces */
#menu li a{
	display: block;
	color: #337ab7;
	text-decoration: none;
	height: 70px;
	line-height: 70px;
	padding: 0 20px;
	text-decoration: none;
	-webkit-transition: all .5s;
	-o-transition: all .5s;
	transition: all .5s;
}
#menu li a:hover{
	background: #EAEAE1;
	color: #fff;
}
#nav-mobile{
	display: none;
	background: url(../images/nav.png) no-repeat center center;
	float: right;
	width: 70px;
	height: 70px;
	position: absolute;
	right: 0;
	top:0;
	opacity: .6;
}   
#nav-mobile.nav-active{
	opacity: 1;
}
#content{
	width: 80%;
	margin: 70px 10%;
	text-align: center;
	overflow: hidden;
}
/*SLIDER*/
.slider .row .carousel {
	max-width: 1366px;
	margin: auto;
	float: none;
}
.slider .row {
	text-align: center;
	margin: auto;
}
.slider {
	text-align: center;
	margin: auto;
}
.carousel-control {
	width: 10%;
}
.imagen-seccion {
	width: 50%;
	margin:10px;
}
.bloque {
	text-align: center;
	border-radius: 2%;
}
.seccion1 {
	background: black;
}
.seccion2 {
	background: #272FBF;
}
.seccion3 {
	background: #A30000;
}
.seccion4 {
	background: #7B7B7B;
}
.texto {
	text-align: center;
	margin:10%;
}
.row {
	margin: 0;
}
.carousel {
	padding:0;
}
/*CUERPO*/
.carousel-control {
  padding-top:10%;
  width:5%;
}
.thumbnail-clientes, .thumbnail-slider {
	width: 90%;
	text-align: center;
	margin: auto;
	padding-bottom: 70px;
}
.img-mensaje {
	width: 100%;
}
#secciones .contenedor {
	display: flex;
	flex-wrap: wrap;
	justify-content:center;
}
#secciones article {
	margin: 15px;
}
#secciones img {
	max-width:320px;
}
#secciones h4, #secciones h5 {
	text-align: center;
	text-decoration: none;
}
a {
	color: #000;
}
a:hover {
	text-decoration: none;
	color: #000;
}
/*NOSOTROS*/
.logo .fondo {
	background: white;
	height: 300px;
	text-align: center;
	line-height: 300px;
	margin-bottom: 20px;
}
.txtit {
	font-size:21px;
}
.txt2{
	font-size:18px;
}
.container p{
	text-align: justify;
}
#secciones .contenedor article {
	max-width:217px;
	text-align:center;
}
.logo .fondo img {
	max-width: 250px;
}
/*SERVICIOS*/
.img-mensaje {
	width: 100%;
}
#servicios .contenedor, #servicios .contenedor {
	display: flex;
	flex-wrap: wrap;
	justify-content:center;
	margin-top: 10px;
}
#servicios article, #servicios article {
	margin: 15px;
}
#servicios img, #servicio img {
	max-width:320px;
}
#servicios h4, #servicios h5{
	text-align: center;
}
#servicios .contenedor article a, #servicio .contenedor article a{
	text-decoration: none;
}
#servicios .contenedor article a .img, #servicio .contenedor article a .img{
    display:block;
    margin-left: auto;
    margin-right: auto;
    max-width: 320px;
    max-height: 156px;
    transform:scale(1);
    -ms-transform:scale(1);
    -moz-transform:scale(1);
    -webkit-transform:scale(1); 
    -o-transform:scale(1); 
    -webkit-transition: all 500ms ease-in-out; 
    -moz-transition: all 500ms ease-in-out;
    -ms-transition: all 500ms ease-in-out; 
    -o-transition: all 500ms ease-in-out;
}
#servicios .contenedor article a .textooculto, #servicio .contenedor article a .textooculto{
    padding-top: 5px;
    display:block;
    text-align: center;
    width: 100%;  
    transform:translate(0px);
    -webkit-transition: all 500ms ease-in-out;
    -moz-transition: all 500ms ease-in-out;
    -ms-transition: all 500ms ease-in-out;
    -o-transition: all 500ms ease-in-out;
    opacity: 0;
    transition: transfom opacity 1.5s;
}
#servicios .contenedor article a:hover .img, #servicio .contenedor article a:hover .img{
	transform:scale(0.8);
    -ms-transform:scale(0.8); 
    -moz-transform:scale(0.8);
    -webkit-transform:scale(0.8); 
    -o-transform:scale(0.8);
	border-radius: 10px;
}
#servicios .contenedor article a:hover .textooculto, #servicio .contenedor article a:hover .textooculto {
	transform: translate(0px,-20px);
    opacity: 1;
    color: gray;
}
/*SERVICIO*/
.container #imgprincipal {
	margin: auto;
	margin-top: 20px;
	text-align: center;
	max-height: 400px;
}
#servicio {
	padding-bottom: 60px;
}
#servicio .contenedor {
	display: flex;
	flex-wrap: wrap;
	justify-content:center;
}
#servicio article {
	margin: 15px;
}
#servicio img {
	max-width:320px;
}
/*CONTACTO*/
form {
	width: 450px;
	margin: auto;
	background: rgba(0,0,0,0.2);
	padding: 10px 20px;
	box-sizing: border-box;
	border-radius: 7px;
}
form h2 {
	margin: 0;
	font-size: 30px;
	margin-bottom: 10px;
	margin-left: 10px;
}
input, textarea {
	width: 100%;
	padding: 7px;
	border:none;
}
textarea {
	min-height: 100px;
	max-height: 200px;
	max-width: 100%;
}
#boton {
	background: #31384A;
	color: #FFF;
	padding: 20px;
}
#boton:hover {
	cursor: pointer;
	background: #252830;
}
#contacto {
	position: relative;
	width: 100%;
	min-height: 500px;
}
#contacto .contenedor {
	display: flex;
	flex-wrap:wrap;
	justify-content:center;
}
#contacto article {
	margin-top: 25px;
	float: left;
	width: 50%;
}
/*FOOTER*/
footer {
	width: 100%;
    height: 50px;
    bottom: 0;
    left: 0;
    position: absolute;
}
.menu-fin {
	background: #C4C4C4;
}
.menu-fin a{
	text-decoration: none;
	color: gray;
	-webkit-transition: all .5s;
	-o-transition: all .5s;
	transition: all .5s;
}
.menu-fin ul {
	list-style: none;
	margin: 0;
}
.menu-fin ul li {
	float: right;
}
.menu-fin ul li a  {
	padding:0 15px;
	display: block;
	line-height: 50px;
}
.menu-fin ul li a:hover {
	color: black;
}
/*REDES SOCIALES*/
.social {
	position: fixed;
	left: 0;
	top: 200px;
	z-index: 2000;
}
.social ul li a {
	display: inline-block;
	color: #fff;
	padding: 10px 15px;
	text-decoration: none;
	-webkit-transition: all .5s ease;
	-o-transition: all .5s ease;
	transition: all .5s ease;
}
.social ul li .icon-facebook2 {background: #3b5998;}
.social ul li .icon-mail3 {background: #666666;}
.social ul li .icon-whatsapp {background: green;}
.social ul li a:hover {
	padding: 10px 30px;
	background: #000;
}
/*POP-UP*/
.overlay-container {
	display: none;
	content: " ";
	height: 100%;
	width: 100%;
	position: absolute;
	left: 0;
	top: 0;
	background: -moz-radial-gradient(center, ellipse cover,  rgba(127,127,127,0) 0%, rgba(127,127,127,0.9) 100%);
	background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(127,127,127,0)), color-stop(100%,rgba(127,127,127,0.9)));
	background: -webkit-radial-gradient(center, ellipse cover,  rgba(127,127,127,0) 0%,rgba(127,127,127,0.9) 100%);
	background: -o-radial-gradient(center, ellipse cover,  rgba(127,127,127,0) 0%,rgba(127,127,127,0.9) 100%);
	background: -ms-radial-gradient(center, ellipse cover,  rgba(127,127,127,0) 0%,rgba(127,127,127,0.9) 100%);
	background: radial-gradient(center, ellipse cover,  rgba(127,127,127,0) 0%,rgba(127,127,127,0.9) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#007f7f7f', endColorstr='#e67f7f7f',GradientType=1 );
}
.window-container {
	display: block;
	background: rgba(199,199,199,.54);
	margin: 8em auto;
	width: 67%;
	padding: 12px 20px 45px;
	text-align: center;
	z-index: 3;
	border-radius: 3px;
	box-shadow: 0px 0px 30px rgba(0,0,0,0.2);
	-webkit-transition: 0.4s ease-out;
	-moz-transition: 0.4s ease-out;
	-ms-transition: 0.4s ease-out;
	-o-transition: 0.4s ease-out;
	transition: 0.4s ease-out;
	opacity: 0;
}
.zoomin {
	-webkit-transform:  scale(1.2);
	-moz-transform:  scale(1.2);
	-ms-transform:  scale(1.2);
	transform:  scale(1.2);
}
.window-container-visible {
	-webkit-transform:  scale(1);
	-moz-transform:  scale(1);
	-ms-transform:  scale(1);
	transform:  scale(1);
	opacity: 1;
}
.close {
	margin: 1em auto;
	display: block;
	width: 84px;
	background: #fafafa;
	background: -moz-linear-gradient(top,  #fafafa 0%, #f4f4f4 40%, #e5e5e5 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fafafa), color-stop(40%,#f4f4f4), color-stop(100%,#e5e5e5));
	background: -webkit-linear-gradient(top,  #fafafa 0%,#f4f4f4 40%,#e5e5e5 100%);
	background: -o-linear-gradient(top,  #fafafa 0%,#f4f4f4 40%,#e5e5e5 100%); 
	background: -ms-linear-gradient(top,  #fafafa 0%,#f4f4f4 40%,#e5e5e5 100%);
	background: linear-gradient(to bottom,  #fafafa 0%,#f4f4f4 40%,#e5e5e5 100%); 
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fafafa', endColorstr='#e5e5e5',GradientType=0 );
	border: 1px solid #aaa;
	padding: 5px 14px;
	color: #444;
	font-family: Helvetica, sans-serif;
	font-size: 12px;
	border-radius: 3px;
	box-shadow: 0 1px 3px #ddd;
	-webkit-transition: 0.2s linear;
	-moz-transition: 0.2s linear;
	-ms-transition: 0.2s linear;
	-o-transition: 0.2s linear;
	transition: 0.2s linear;
	cursor: pointer;
}
.close:hover {
	background: #fefefe;
	background: -moz-linear-gradient(top,  #fefefe 0%, #f8f8f8 40%, #e9e9e9 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fefefe), color-stop(40%,#f8f8f8), color-stop(100%,#e9e9e9));
	background: -webkit-linear-gradient(top,  #fefefe 0%,#f8f8f8 40%,#e9e9e9 100%);
	background: -o-linear-gradient(top,  #fefefe 0%,#f8f8f8 40%,#e9e9e9 100%);
	background: -ms-linear-gradient(top,  #fefefe 0%,#f8f8f8 40%,#e9e9e9 100%);
	background: linear-gradient(to bottom,  #fefefe 0%,#f8f8f8 40%,#e9e9e9 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fefefe', endColorstr='#e9e9e9',GradientType=0 );
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
	border: 1px solid #aaa;
}
.close:active {
	background: #f4f4f4;
	background: -moz-linear-gradient(top,  #f4f4f4 0%, #efefef 40%, #dcdcdc 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f4f4f4), color-stop(40%,#efefef), color-stop(100%,#dcdcdc));
	background: -webkit-linear-gradient(top,  #f4f4f4 0%,#efefef 40%,#dcdcdc 100%);
	background: -o-linear-gradient(top,  #f4f4f4 0%,#efefef 40%,#dcdcdc 100%);
	background: -ms-linear-gradient(top,  #f4f4f4 0%,#efefef 40%,#dcdcdc 100%);
	background: linear-gradient(to bottom,  #f4f4f4 0%,#efefef 40%,#dcdcdc 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4f4f4', endColorstr='#dcdcdc',GradientType=0 );
	box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2);
}
/*RESPONSIVE*/
@media only screen and (max-width: 1417px){
	#secciones .contenedor img, #servicio .contenedor article a .img, #secciones .contenedor article {
		max-width: 280px;
	}
}
@media only screen and (max-width:1257px){
	#secciones .contenedor img, #servicio .contenedor article a .img, #secciones .contenedor article {
		max-width: 247px;
	}		
}
@media only screen and (max-width:1124px) {

	#secciones .contenedor img, #servicio .contenedor article a .img, #secciones .contenedor article {

		max-width: 217px;

	}

	.cabecera .contenedor .logo {

	margin-left: 40px;

	}

}

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

	#secciones .contenedor img, #servicio .contenedor article a .img, #secciones .contenedor article {

		max-width: 190px;

	}

	.cabecera .contenedor .logo {

	margin-left: 30px;

	}

}

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

	#secciones .contenedor img {

		max-width:100%;

	}

	#servicio .contenedor article a .img, #secciones .contenedor article {

		max-width: 320px;

		margin: 20px;

	}

	.cabecera .contenedor .logo {

	margin-left: 20px;

	}
	#img-contacto {
		display: none;
	}
}

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

	#servicio .contenedor article a .img, #secciones .contenedor article{

		margin: 10px;

	}

	.TEXT {

		line-height: 60px;

	}

	.cabecera {

		height: 130px;

	}

	.cabecera .contenedor {

		width: 100%;

	}

	.cabecera .contenedor .logo {

		height: 100px;

		line-height: 100px;

		margin-left: 0px;

		width: 100%;

	}

	.cabecera .contenedor .logo .img-logo {

		height:80px;

		display: inline;

	}

	.cabecera .contenedor .menu {

		float: left;

		width: 100%;

		background: #E0E0E0;

		text-align: center;

	}

	.cabecera .menu ul {

		margin: auto;

		position: relative;

		height: 30px;

	}

	.cabecera .menu #menu {

		width: 303.7501px;

		margin: auto;

	}

	.cabecera .menu ul li a {

		padding:0 15px;

		display: block;

		line-height: 30px;

	}

	#servicios .contenedor article, #servicio .contenedor article {

		margin:0px;

	}

	#servicios .contenedor article a .img, #servicio .contenedor article a .img{

			transform:scale(0.8);

    		-ms-transform:scale(0.8); 

    		-moz-transform:scale(0.8);

    		-webkit-transform:scale(0.8); 

    		-o-transform:scale(0.8);

			border-radius: 10px;

	}

	#servicios .contenedor article a .textooculto, #servicio .contenedor article a .textooculto {

			transform: translate(0px,-20px);

    		opacity: 1;

    		color: gray;

	}

}

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

	#secciones .contenedor article, #servicio .contenedor article a .img{

		margin: 10px;

	}

}

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

        

    h2{font-size: 40px;}

    #img-contacto {
	margin-top: 0px;
	display: block;
	}

    /* mostramos #nav-mobile */

    #nav-mobile{ display: block; }



    /* Fijamos nuestro nav en 100% ancho y dejamos de flotarlo  */

    #menu{

        width: 100%;

        float: none;

        padding-top: 60px;

    }

        /* Convertimos nuestra lista de enlaces en un menú horizontal */

        #menu ul{

            -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.5);

            -moz-box-shadow: 0 1px 2px rgba(0,0,0,.5);

            box-shadow: 0 1px 2px rgba(0,0,0,.5);

            max-height: 0;

            overflow: hidden;

        }

            /* estilos para los LI del menu */

            #menu li{

                background: #FFF;

                border-bottom: 1px solid #337ab7;

                float: none;

            }



            /* Quitamos el borde del ultimo item del menú */

            #menu li:last-child{ border-bottom: 0;}

                #menu li a{

                    padding: 15px 0;

                    height: auto;

                    line-height: normal;

                }

                #menu li a:hover{background:#337ab7}



        /* Agregamos una animación al despligue del menú */

        #menu ul.open-menu{

            max-height: 400px;

            -webkit-transition: max-height .4s;

            -moz-transition: max-height .4s;

            -ms-transition: max-height .4s;

            -o-transition: max-height .4s;

            transition: max-height .4s;

        }

        #logo{

            background: url(../images/logosit-tf.png) no-repeat 0 0;

            width: 300px;

            height: 46px;

        }

        header{

            height:60px;

        }

        #nav-mobile{

            height: 60px;

        }   

}



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

	#servicio .contenedor article a .img {

		margin: 0;

	}

			#contacto article {

		width: 100%;

	}

	#contacto {

		min-height:680px;

	}

	#contacto article .otrocontacto {

	width: 90%;

	margin: auto;

}

}

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

	#secciones .contenedor img, #servicio .contenedor article a .img, #secciones .contenedor article {

		max-width: 310px;

	}



}

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

	#secciones .contenedor img, #servicio .contenedor article a .img, #secciones .contenedor article {

		max-width: 230px;

	}



}

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

	.slider h2 {

		display:none;

	}

}

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

	form {

		width: 100%;

	}

	.cabecera .contenedor .logo .img-logo{

		margin:0;

		max-width: 100%;

	}

	.cabecera .menu ul li a {

		padding: 0 10px;

	}

	.cabecera .menu #menu {

		width: 263.7501px;

		margin: auto;

	}

	.carousel-inner .carousel-caption h3{

		display:none;

	}

}

