@import url('https://fonts.googleapis.com/css?family=Oswald:400,500,600&display=swap');
@import url('https://fonts.googleapis.com/css?family=Barlow:400,500&display=swap');

@charset "utf-8";
/* Create By: Mery DurCam */
/* CSS Document */

html,body,div,span,
applet,object,iframe,
h1,h2,h3,h4,h5,h6,p,blockquote,pre,
a,abbr,acronym,address,big,cite,code,
del,dfn,em,font,img,ins,kbd,q,s,samp,
small,strike,strong,sub,sup,tt,var,
dd,dl,dt,li,ol,ul,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td {
margin: 0;
padding: 0;
border: 0;
font-weight: normal;
font-style: normal;
text-align: left;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
ol,ul {
list-style: none;
}
q:before,q:after,
blockquote:before,blockquote:after {
content: "";
}

*{
margin: 0;
padding: 0;
}

html {
height:100%;
}

/* ------------------------------------------------------------
	 Stylos Globales
------------------------------------------------------------ */


body {
	margin: 0;
	padding: 0;
	font-family: 'Barlow', sans-serif;
	font-size:14px; 
	color:#7c7c7c;
	text-align:justify;
	line-height:20px;
	background:#f6f6f6;
	letter-spacing: 0.04em;
}

a{text-decoration: none; color:#3faad5}
a:hover {text-decoration:none}
a:focus {outline: none;}
.clear{clear:both;}


/* ------------------------------------------------------------
	                 Estilos del Home
------------------------------------------------------------ */


#containerbody{width:100%; height:auto; margin:0 auto;}

.center{ margin:0 auto; width:1020px; text-align: center}
.seccion{margin:0 auto;width:100%; background:#fff; padding:80px 0;}
.seccion_min{padding:60px 0 80px;}
.seccion_max{padding:100px 0;}
.seccion_grey{ background:#f1f8fc !important;}
.seccion_contactanos{background: url(images/banner/contactanos.jpg); background-size:cover; background-position: center center; color:#fff; text-align: center }
.seccion_contactanos .title H1{font-size: 55px; margin-bottom: 5px }


.no-padding{ padding:0px !important}
.no-margin{ margin:0px !important}

/* botones */
a.btn{ display:inline-block; background:#3faad5; font-family: 'Oswald', sans-serif; line-height:normal; font-size:13px; padding:10px 32px; letter-spacing:0.12em; text-transform:uppercase; color:#FFF; text-align:center; box-sizing:border-box; border-radius:5px; font-weight:400; border:2px solid transparent}
a.btn:hover{background:#000;}

a.btn-line{ background:#fff; border-color:#3faad5; color:#3faad5}
a.btn-line:hover{ background:#3faad5; color:#fff}
a.btn-social{ width: 48px;padding:9px 0px;}


H1, H2, H3{ text-transform:uppercase; font-family: 'Oswald', sans-serif; line-height:normal;}
H2, H3{font-weight: 400;}

p{margin-bottom: 30px; }
ul{ margin-left: 18px; list-style:disc;}
ul li{ margin-bottom: 5px}

/* cabecera home */
#cabecera{width:100%; position:fixed; top: 0; height:auto; z-index: 1; background: #fff;  border-bottom:1px solid #efefef;  }

#cabecera .content_cabecera{ padding:16px 0px 15px 0px;}

#cabecera .content_cabecera .cont_l{ width:auto; height:auto; float:left; margin-top: 11px}
#cabecera .content_cabecera .cont_r{ width:auto; height:auto; float:right; text-align:right}

/*banner*/
#banner_home{height: 640px}
.banner .box_banner { margin: 0 auto; width: 1020px; font-family: 'Oswald', sans-serif; font-weight: 600; text-transform: uppercase; color:#fff; margin-bottom:100px; display: -webkit-flex; display: flex; flex-direction: row; justify-content: space-between; }
.banner .box_banner_text{ margin-top: 70px}
H1{ display: inline-block; font-size:70px; font-weight: 600;}
.banner .box_banner H2{ font-size: 22px; margin-bottom: 50px;}
.nivo-caption a.btn{  line-height: normal; padding:13px 35px;}
.theme-default .nivoSlider{ background: url("images/banner/fondo.png") repeat #2b363d; background-size:auto !important ; max-height: 700px; min-height: 250px}
.theme-default .nivoSlider .nivo-caption img{ display: inline; position: relative}
.theme-default .nivo-controlNav a{width: 30px !important;}

/*responsive*/
.box_img_responsive, .box_2img_responsive{ text-align: center; display: none}

/*contenedores box */
.box{display: -webkit-flex; display: flex; flex-direction: row; justify-content: space-between;}
.box .box-l, .box .box-r{ width: 100%}
.box-r_line{ border-left:2px solid #eef8fb; padding-left:60px; margin-left: 50px; box-sizing: border-box}


/*estilos de titulos y textos*/
.box_text{ width: 430px; }
.mb-50{ margin-bottom: 50px}
.pb-20{ padding-bottom: 20px}

/*box: 2 filas*/
.box_2{width: 100%}
.box_2img_nosotros{background: url(images/home/nosotros.jpg);}
.box_2img_ofrecemos{background: url(images/home/ofrecemos.jpg);}
.box_2img{ background-size:cover; background-position: center center}
.box_2 .box_content{ width: 510px; padding: 100px 60px; box-sizing: border-box}
.box_2 .box_contentl{ float: right; padding: 100px 60px 100px 0;}

/*title*/
.title{ margin-bottom: 35px }
.title_center, .title_center H2{ text-align: center}

.title H3{ font-size: 30px; color:#000; letter-spacing:0.06em;}

/*items*/

.content_item, .flex{ display: -webkit-flex; display: flex; flex-direction: row; /*justify-content: space-between;*/ }
.content_item_between{ justify-content: space-between}

/*clientes*/
.content_item_images{ margin: 0 auto; display: -webkit-flex; display: flex; flex-direction: row;  justify-content: space-between; margin-bottom:50px; flex-wrap: wrap; }
.content_item_images:last-child{ margin-bottom:0px }
.content_item_images div{ text-align: center; }
.content_item_images_resp div{ width: 150px;margin-bottom: 50px}
.content_item_images img{ width: auto}


.content_item .item{ -webkit-transition: width 0.7s ease-out; transition: width 0.7s ease-out; }


/*items: 3 filas*/
.content_item .item_3{width:315px; margin-left:1%; margin-bottom: 40px}
.content_item .item_3:first-child{margin-left: 0px}
.content_item .item_3 i{color:#000; margin:4px 10px 0 0}
.content_item .item_3 p{margin-bottom: 0}


.content_item .item_3_style2{ background:#fff; border:1px solid #e4edf0; border-radius:5px; padding: 70px 60px; box-sizing: border-box; text-align: center; margin-bottom: 50px}
.content_item .item_3_style2 span{display: block; width: 100%; text-align: center; text-transform: uppercase; font-size: 16px; font-family: 'Oswald', sans-serif; font-weight: 500; color:#000;}
.content_item .item_3_style2 img{ margin-bottom: 25px}

.content_item .item_3_style3{width:auto; margin-left:8%;}
.content_item .item_3_style3 i{ display: block; color:#3faad5;font-size:30px; margin-bottom: 10px }
.content_item .item_3_style3 span{font-family: 'Oswald', sans-serif; font-weight: 500; display:block; line-height:1.6em; letter-spacing:0.05em; text-transform:uppercase; font-size: 16px; color:#000; margin-bottom:12px;}

.flex_list i{color:#000; margin:4px 10px 0 0}
.flex_list b{ display: block}

/* pie de página */

#footer{ margin:0 auto; width:100%; background: url("images/banner/fondo.png") repeat #2b363d; color:#fff; font-size: 15px}
#footer .center{ display: -webkit-flex; display: flex;  justify-content: space-between; padding: 80px 0 70px;}

#footer .cont_menu, #footer .cont_info{ margin-top: 35px}

#footer .logo_img{ margin-bottom: 15px; }

#footer p{margin-bottom: 10px}
#footer p i{font-size: 12px; color:#3faad5; width: 20px; }
#footer p.p_title{font-family: 'Oswald', sans-serif; font-weight:400; text-transform: uppercase; color:#3faad5; display: block; margin-bottom: 12px }
#footer .copy{ display: block; background: #000; color:#fff;  font-style: oblique;  padding: 30px 0; font-style: oblique; }
#footer .copy span{ margin: 0 auto; display: block; text-align: center;}
#footer .copy b{font-weight: bold; text-transform: uppercase; font-size: 13px}


/* páginas internas */

/*banner*/
.banner_small{ background: url("images/banner/fondo.png") repeat #2b363d; height:300px}
.banner_small .title{ padding-top: 120px; color:#fff}

/*items: 2 filas*/

.item_2{width:500px; margin-left:2%;  border:1px solid #f3f3f3; background: #fff; border-radius: 5px}
.item_2:first-child{margin-left: 0px}
.item_2  img{ width: 100%; display: block; border-radius: 5px 5px 0 0}
.item_2 .desc{ padding: 20px 40px 12px; box-sizing: border-box; width: 90%; margin-top:20px;}
.item span.p_title{ font-family: 'Oswald', sans-serif; font-weight: 500; display:block; line-height:1.6em; letter-spacing:0.05em; text-transform:uppercase; font-size: 16px; color:#000; margin-bottom:12px; }

/*contenido de parrafo*/
.content_p{margin-top:40px}

/*cajas*/
.item_box{ width: 100%; display: -webkit-flex; display: flex; flex-direction: row; justify-content: space-between; margin-bottom: 30px; border-radius: 5px }
.item_box:last-child{ margin-bottom:0 }
.item_box .imagen{border-radius: 5px 0 0 5px}
.item_box .imagen, .item_box .info_box{width: 50%}
.item_box .info_box{ padding: 35px 52px; box-sizing: border-box; border:1px solid #f3f3f3; background: #fff}
.item_box .desc img{ margin-bottom: 12px}
.item_box .desc span.p_title{ margin-bottom: 24px}

/*cajas personalizadas*/

.item_box .outsourcing-ti{background: url("images/servicios/outsourcing-ti.jpg");}
.item_box .infraestructura{background: url("images/servicios/infraestructura.jpg"); }
.item_box .planes-continuidad{background: url("images/servicios/planes-continuidad.jpg");}
.item_box .evaluacion{background: url("images/servicios/evaluacion.jpg");}
.item_box .consultoria{background: url("images/servicios/consultoria.jpg");}

.item_box .imagen{background-size: cover; background-position: center center}


/* Hamburger */
/*nav:not(.mm-menu) {display: none;}*/
.mm-navbar a{text-align: center;}
a#mmenu_hamburger {display: none; box-sizing: border-box; width: 50px;height: 50px;position: fixed; top:24px;	right:25px;	z-index: 999;}
#mmenu i{ color:#3faad5; margin-right:5px}
.mm-menu a{font-family: 'Oswald', sans-serif; font-weight: 700;}

/* Hamburger span */
a#mmenu_hamburger span{background:#3faad5;display: block; width: 30px;height: 5px;position: absolute; right:5px;}
a#mmenu_hamburger span:first-child{top: 10px;}
a#mmenu_hamburger span{top: 20px; }
a#mmenu_hamburger span:last-child{top: 30px;}

/* Hamburger animation */
a#mmenu_hamburger span:first-child,
a#mmenu_hamburger span:last-child,
a#mmenu_hamburger span{-webkit-transition: none 0.5s ease 0.5s;transition: none 0.5s ease 0.5s;-webkit-transition-property: transform, top, bottom, left, opacity;	transition-property: transform, top, bottom, left, opacity;}

html.mm-wrapper_opening a#mmenu_hamburger span:first-child,
html.mm-wrapper_opening a#mmenu_hamburger span:last-child{top: 20px;}

html.mm-wrapper_opening a#mmenu_hamburger span:nth-child(2){opacity: 0;}
html.mm-wrapper_opening a#mmenu_hamburger span:first-child{transform: rotate( 45deg );}
html.mm-wrapper_opening a#mmenu_hamburger span:last-child{transform: rotate( -45deg );}


