/* RESETEO UNIVERSAL */
*{border: 0; margin: 0; padding: 0;}

article, figcaption, figure, footer, header, hgroup, nav, section{ 
	display: block;
}

body{color: #282828; font-family: 'Roboto Condensed', sans-serif; font-size: 14px;}
/*background-position: center top; background-repeat: no-repeat; background-attachment: fixed; background-image: url(../img/wild_turkey_skin_up.jpg);*/

img, video{ max-width: 100%; }

/*header{ background: #f5f5f5; height:120px; border-bottom: 1px solid #e6e6e6; position: fixed; top: 0; left: 0; width: 100%; text-align: center; z-index: 1000;}*/
header{background-image: url(../img/back_header.png); background-repeat: repeat-x; height:108px; position: fixed; top: 0; left: 0; width: 100%; text-align: center; z-index: 1000; }

#header_movil{visibility: hidden;}

section#base_carrusel,section#contenido, section#contenido_proyectos, section#clientes, article#descripcion, div#titulo, div#subtitulo, article#trabajos_recientes, 
article#base_servicios, article#base_projects,div#descripcion_galeria, div#titulo_galeria,div#back, footer{ margin: 0 auto; /*max-width: 90%;*/ /*width: 1830px;*/ text-align: center; }

header h1, nav, .icon_menu_movil{display: inline-block; max-width: 65%; margin-top: 25px; vertical-align: middle; /* Posicion dependiendo en el objeto ke esta */ }
header nav ul{text-align: right; width: 100%;}
nav{ width: 705px; }
nav ul{list-style: none;}
nav li{display: inline-block; font-size: 14px; font-weight: lighter; margin-left: 30px; vertical-align: top;}
nav a{color: #fff; text-decoration: none;}
nav a:hover{ color: #02aef0; text-decoration: underline;}

section#base_carrusel{ margin-top: 108px; }
section#contenido_proyectos{ margin-top: 58px;  }
section#contenido, section#contenido_proyectos{ padding: 50px 0px 50px 0px; width: 100%; }
section#clientes{ background-color: #2d5f92; width: 100%; padding: 50px 0 20px 0;  }
footer#pie_pagina1{ background-color: #f0f0f0; padding: 40px 0px 40px 0px; width: 100%; }
footer#pie_pagina2{ background-color: #233a57; padding: 20px 0 20px 0; width: 100%; }

.cover-photo1, .cover-photo2 {
	background-position:50% 50%;
	background-repeat:no-repeat;
	background-size:cover;
	height: 445px;
	width:100%;
}

.cover-photo1{ background-image: url('../img/large/1.jpg'); }
.cover-photo2{ background-image: url('../img/large/2.jpg'); }

article#descripcion{ font-size: 20px; font-weight: lighter; line-height: 30px; text-align: left; text-indent: 40px; width: 840px; }

article#facebook{ margin-top: 50px; }
div#texto_f_li, div#texto_f_ld, div#boton_facebook{ vertical-align: middle; display: inline-block; }
div#texto_f_li{ font-size: 24px; font-weight: lighter; margin-right: 40px; width: 125px; }
div#boton_facebook{  }
div#texto_f_ld{ font-size: 24px; font-weight: lighter; margin-left: 40px; width: 185px; }

div#titulo{ color: #1c5c9d; font-size: 28px; font-weight: lighter; margin-top: 40px; text-align: left; width: 960px; }
div#subtitulo{ color: #ed008c; font-size: 20px; font-weight: lighter; margin-top: 3px; text-align: left; width: 960px; }

article#trabajos_recientes{ margin-bottom: 20px; margin-top: 30px; width: 960px; }
div#box_work{ display: inline-block; margin: 0px 5px 10px 5px; width: 227px; vertical-align: middle; }
img.img_work{
	opacity:1.0; filter:alpha(opacity=100); /* For IE8 and earlier */
	transition: .3s ease-in-out;
}
img.img_work:hover{
	opacity:0.8;filter:alpha(opacity=80); /* For IE8 and earlier */
}
.img_album{opacity:1.0; filter:alpha(opacity=100); /* For IE8 and earlier */ }
.img_album:hover{opacity:0.8;filter:alpha(opacity=80); /* For IE8 and earlier */}

div#box_work p.work_title{ color: #1c5c9d; font-size: 24px; font-weight: lighter; margin-top: 10px; text-align: left; }
div#box_work p.work_title:hover{ color: #02aef0; }
div#box_work p.work_description{ color: #828282; font-size: 14px; font-weight: lighter; margin-top: 3px; text-align: left; }


/* SERVICIOS */
article#base_servicios{ border-bottom: 1px solid #e6e6e6; margin-top: 60px; width: 960px; }
div#box_services{ display: inline-block; margin: 0px 20px 50px 20px; width: 275px; vertical-align: top; }
p.title_services{ color: #282828; font-size: 18px; }
p.description_services{ color: #828282; font-size: 15px; font-weight: lighter; line-height: 22px; margin-top: 15px; }
div.btn_ver{ background-color: #2d5f92; color: #fff; font-weight: lighter; display: inline-block; margin-top: 10px; padding: 4px 9px;}
/* SERVICIOS END */


/* PROYECTOS */
article#filtro_projects{ margin-top: 50px; }
article#filtro_projects div{ 
    background-color: #2d5f92;
    border-radius: 5px;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-size: 15px;
    font-weight: lighter;
    margin: 0px 5px 10px 5px;
    padding: 5px 8px;
    vertical-align: top;
}
article#filtro_projects div:hover{ 
    background-color: #4072a5;

}
article#base_projects{ border-bottom: 1px solid #e6e6e6; margin-top: 40px; width: 960px; }

#btn_filter{  }

div#box_projects{ display: inline-block; margin: 0px 5px 50px 5px; width: 227px; vertical-align: top; }
div#box_projects p.work_title{ color: #1c5c9d; font-size: 24px; font-weight: lighter; margin-top: 10px; text-align: left; }
div#box_projects p.work_title:hover{ color: #02aef0; }
div#box_projects p.work_description{ color: #828282; font-size: 14px; font-weight: lighter; margin-top: 3px; text-align: left; }
/* PROYECOS END */



/* CONTACTANOS */
.form {
    margin: 0 auto;
    width: 500px;
}
.base_lbs {
	color: #646464;
	font-weight: lighter;
    text-align: center;
    width: 100%;
}
.form_lbl {
    display: block;
    margin-bottom: 25px;
}
form input, form textarea {
    background-color: #ffffff;
    border: 1px solid #bebebe;
    display: block;
    font-family: Helvetica,Arial,Verdana;
    font-size: 13px;
    line-height: 23px;
    padding: 6px 20px;
    width: 100%;
}
div#btnSubmit{ background-color: #2d5f92; border-radius: 5px; color: #fff; cursor: pointer; font-size: 16px; font-weight: lighter; display: inline-block; margin-top: 10px; padding: 10px 18px; }
article#facebook_contacto{ margin-top: 80px; }
#mensaje{background: #c8c8c8; color: #000; display: none; text-align: center; margin: 5px auto; padding: 4px 0px; width: 500px;}
/* CONTACTANOS END */



/* GALERIA */
.cover-photo {
	background-position:50% 50%;
	background-repeat:no-repeat;
	background-size:cover;
	/*padding:140px 0px;*/
	height: 445px;
	margin-top: 108px;
	width:100%;
}

.wrapper {
  margin:0 auto;
  max-width:960px;
  min-width:280px;
  padding:0 10px;
  position:relative;
  z-index:2;
}

.cover-photo .content-title {
  color:#FFFFFF;
  font-family:Lato, sans-serif;
  font-weight:400;
  font-size: 26px;
  margin-bottom:0;
  text-align:left;
  text-shadow:#000000 0 1px 2px;
}

.content-title small {
  display:block;
  font-size:16px;
  line-height:26px;
}
div#back{ font-size: 14px; font-weight: lighter; margin-top: 20px; text-align: left; width: 960px; }
div#back a{ color: #a0a0a0; }
div#back a:hover{ color: #000; }
div#titulo_galeria{ color: #1c5c9d; font-size: 34px; font-weight: lighter; margin-top: 20px; text-align: left; width: 960px; }
div#descripcion_galeria{
	background-color: #1c5c9d;
	color: #fff;
	font-size: 18px;
	font-weight: lighter;
	margin-top: 10px;
	margin-bottom: 60px;
	padding: 15px 30px; 
	text-align: left;
	width: 960px;
}
.img_galeria{ margin: 0 auto 30px auto; }

/* GALERIA END */




div#title_clientes{ color: #fff; font-size: 28px; font-weight: lighter; margin-bottom: 40px; }
article#logos_clientes{ margin: 0 auto;  width: 960px; }
article#logos_clientes img{ display: inline-block; vertical-align: middle; margin: 0 40px 40px 40px;}

article#redes_sociales, article#contactanos, article#ubicacion{ display: inline-block; vertical-align: top; margin: 0px 10px 0px 10px; }
article#redes_sociales{ width: 200px; }
article#contactanos{ width: 225px; }
article#ubicacion{ width: 450px; }
div.title_pie{ color: #233a57; font-size: 24px; font-weight: lighter; text-align: left;}

article#redes_sociales li{ margin-top: 20px; text-align: left; }
article#contactanos li{ margin-top: 20px; text-align: left; }

.icon_facebook{ width:25px;height:25px;background-image: url(../img/iconos.png); background-repeat: no-repeat; background-position: -1px -1px; margin-right: 6px; }
.icon_instagram{ width:25px;height:25px;background-image: url(../img/iconos.png); background-repeat: no-repeat; background-position: -1px -27px; margin-right: 6px; }
.icon_pinterest{ width:25px;height:25px;background-image: url(../img/iconos.png); background-repeat: no-repeat; background-position: -1px -53px; margin-right: 6px; }

.name_f_pie, .name_i_pie, .name_p_pie{ color: #6e6e6e; font-size: 15px; font-weight: lighter; }
.name_f_pie:hover{ color: #000; }
.name_i_pie:hover{ color: #000; }
.name_p_pie:hover{ color: #000; }

.icon_facebook, .name_f_pie{ display: inline-block; vertical-align: middle; }
.icon_instagram, .name_i_pie{ display: inline-block; vertical-align: middle; }
.icon_pinterest, .name_p_pie{ display: inline-block; vertical-align: top; }

.icon_ubicacion{ width:12px;height:14px;background-image: url(../img/iconos.png); background-repeat: no-repeat; background-position: -33px -2px; margin-right: 6px; }
.icon_tel{ width:14px;height:14px;background-image: url(../img/iconos.png); background-repeat: no-repeat; background-position: -33px -22px; margin-right: 6px; }
.icon_mail{ width:14px;height:10px;background-image: url(../img/iconos.png); background-repeat: no-repeat; background-position: -33px -42px; margin-right: 6px; }

.name_info_pie{ color: #6e6e6e; font-size: 15px; font-weight: lighter; }

.icon_ubicacion, .name_info_pie{ display: inline-block; vertical-align: top; }
.icon_tel, .name_info_pie{ display: inline-block; vertical-align: middle; }
.icon_mail, .name_info_pie{ display: inline-block; vertical-align: middle; }

footer#pie_pagina2 p{ color: #fff; font-size: 14px; font-weight: lighter;}





@media(max-width: 959px){

  header h1, nav{ max-width: 60%; }

  .cover-photo1, .cover-photo2 { height: 325px; }
  
  article#descripcion{ width: 600px; }
  article#trabajos_recientes{ width: 540px; }
  div#titulo{ text-align: center; width: 600px; }
  div#subtitulo{ text-align: center; width: 600px; }
  div#box_work{ margin: 0px 15px 10px 15px; }
  article#logos_clientes{ width: 600px; }
  div.title_pie{ text-align: center;}
  article#contactanos li{ text-align: center; }
  article#redes_sociales li{ text-align: center; }
  article#ubicacion{ margin-top: 50px; }

  .cover-photo { height: 325px; }

  div#back{ width: 600px; }
  div#titulo_galeria{ font-size: 30px; width: 600px; }
  div#descripcion_galeria{ width: 600px; }

  div#img_galeria{ height: 375px; width: 600px; }

  article#base_servicios{ width: 640px; }
  article#base_projects{ width: 580px; }
  div#box_projects{ margin: 0px 25px 50px 25px; width: 227px; }

}

@media(max-width: 670px){

  header h1, nav{ max-width: 85%; }
  header nav ul{ text-align: center; }
  nav li{ margin: 0px; padding: 0px 20px; }

  header{
      background-color: #233a57;
      background-image: none;
      height:160px;
  }

  section#base_carrusel{ margin-top: 160px; }
  section#contenido_proyectos{ margin-top: 110px;  }
  .cover-photo { margin-top: 160px; }

  article#base_servicios{ width: 310px; }

}

@media(max-width: 600px){

    header h1, nav{ max-width: 35%; }
    header h1, nav, .icon_menu_movil{max-width: 40%; margin-top: 15px; }
    header{ height:60px; }

    .cover-photo1, .cover-photo2 { height: 255px; }
    article#descripcion{ font-size: 18px; width: 370px; }
    section#base_carrusel{ margin-top: 60px; }
    section#contenido_proyectos{ margin-top: 25px;  }
    div#titulo{ text-align: center; width: 370px; }
    div#subtitulo{ text-align: center; width: 370px; }
    article#logos_clientes{ width: 470px; }
    .cover-photo { height: 225px; margin-top: 60px; }

    div#back{ width: 370px; }
    div#titulo_galeria{ font-size: 26px; width: 370px; }
    div#descripcion_galeria{ width: 370px; }

    div#img_galeria{ height: 231px; width: 370px; }

    article#base_projects{ width: 310px; }

    #cbp-spmenu-s1{visibility: visible;}
    #header_main{visibility: hidden;}
    #header_movil{visibility: visible;}
    .icon_menu_movil{color: white; cursor: pointer; font-size: 22px; text-align: right; width: 50%;}

    .img_galeria{ margin: 0 auto 15px auto; }

}

@media(max-width: 550px){

    article#descripcion{ font-size: 16px; line-height: 26px; width: 280px; }
    article#facebook{ width: 195px; margin-left: auto; margin-right: auto; }
    article#facebook_contacto{ width: 195px; margin-left: auto; margin-right: auto; }
    div#texto_f_li{ font-size: 20px; margin-right: 10px; margin-bottom: 10px; width: 110px; }
    div#texto_f_ld{ font-size: 20px; margin-left: 10px; margin-top: 10px; width: 161px; }
    div#titulo{ font-size: 24px; margin-top: 25px; text-align: center; width: 290px; }
    div#subtitulo{ font-size: 18px; text-align: center; width: 290px; }
    article#trabajos_recientes{ width: 310px; }
    div#box_work{ margin: 0px 15px 40px 15px; }
    article#logos_clientes{ width: 310px; }

    article#ubicacion{ display: none; }

    div#title_clientes{ font-size: 24px; }

    .form { width: 280px; }

    div#back{ width: 280px; }
    div#titulo_galeria{ font-size: 24px; width: 280px; }
    div#descripcion_galeria{ font-size: 16px; width: 280px; }

    div#img_galeria{ height: 188px; width: 300px; }
    #mensaje{width: 280px;}

}

@media(max-width: 470px){

    article#contactanos{ margin-top: 60px; }


}