body {margin: 0; font-family: 'Barlow Semi Condensed', sans-serif;}
li span {display: none}
.clear {clear: both;}

header {display: block; background-color: #00004d; height: 50px; width: 100%; margin: 0 auto; position: fixed; top: 0; z-index: 1 }
.container {max-width: 1000px; padding:0; width: 100%}
.logo {margin: 0 auto; float: left}
.redes {float: right;}
.redes ul {margin: 8px 0; padding-left: 0}
.redes li {display: inline-block; color: white; padding: 0 5px; }
.redes li:hover {color: #ff9900; cursor: pointer}
.redes a {color: white}
.redes a:hover {color: #ff9900}
nav {float: right;}
nav ul {list-style: none; padding-left: 0}
nav li {display: inline-block;}
nav a {color: white; padding: 0 10px; text-decoration: none;}
nav a:hover {color: #ff9900; cursor: pointer; text-decoration: none;}
#menu ul {margin: 10px 0; font-family: 'Open Sans', sans-serif;font-weight: 400}
.tel {float: left; color: #ff9900 ;font-family: 'Open Sans', sans-serif;font-weight: 700; font-size: 20px; padding: 0 20px; margin: 10px 0}
.tel2 {color: #00004d; margin-top: 50px; background-color: #ff9900; text-align: center; font-family: 'Open Sans'; font-weight: 700; font-size: 20px; display: none}

  /* icono mobile */
#icon-mobile {display: none; width: 60px; height: 50px; background: url(../img/nav.png) no-repeat center; position: absolute; right: 130px; top:0px; padding: 0;} 
#icon-mobile.nav-active {opacity: .6;}

/* ON SCROLL EFFECT LAYOUT */
.cbp-so-scroller {margin-top: 50px;overflow: hidden;}
.cbp-so-section {margin-bottom: 5em;position: relative;}
/* Clear floats of children */
.cbp-so-section:before,
.cbp-so-section:after {content: " ";display: table;}
.cbp-so-section:after {clear: both;}
/* Text styling */
.cbp-so-section h2 {font-size: 5em;font-weight: 300;line-height: 1;}
.cbp-so-section p {font-size: 2em;font-weight: 300;}
/* Sides */
.cbp-so-side {width: 50%;float: left;margin: 0;	padding: 3em 4%;overflow: hidden;
min-height: 12em;}
/* Clear floats of children */
.cbp-so-side:before,
.cbp-so-side:after {content: " ";display: table;}
.cbp-so-side:after {clear: both;}
.cbp-so-side-right {text-align: left;}
.cbp-so-side-left {text-align: right;}
.cbp-so-side-right img {float: left;}
.cbp-so-side-left img {float: right;}
/* Initial state (hidden or anything else) */
.cbp-so-init .cbp-so-side {opacity: 0;-webkit-transition: none;-moz-transition: none;transition: none;}
.cbp-so-init .cbp-so-side-left {-webkit-transform: translateX(-80px);-moz-transform: translateX(-80px);transform: translateX(-80px);}
.cbp-so-init .cbp-so-side-right {-webkit-transform: translateX(80px);-moz-transform: translateX(80px);transform: translateX(80px);}
/* Animated state */
/* add you final states (transition) or your effects (animations) for each side */
.cbp-so-section.cbp-so-animate .cbp-so-side-left,
.cbp-so-section.cbp-so-animate .cbp-so-side-right {
	-webkit-transition: -webkit-transform 0.5s, opacity 0.5s;
	-moz-transition: -moz-transform 0.5s, opacity 0.5s;
	transition: transform 0.5s, opacity 0.5s;
	-webkit-transform: translateX(0px);
	-moz-transform: translateX(0px);
	transform: translateX(0px);
	opacity: 1;}
/* For example, add a delay for the right side:
.cbp-so-section.cbp-so-animate .cbp-so-side-right {
	-webkit-transition-delay: 0.2s;
	-moz-transition-delay: 0.2s;
	transition-delay: 0.2s;}
*/
/* END OF ON SCROLL EFFECT LAYOUT */

.parallax-window {
    min-height: 400px;
    background: transparent;
}

/* MAPA */
iframe {border: 0;}
.mapa {width: 100%; height: 400px}

/* FORMULARIO */
.contacto {/*background-image: url(../img/fondohome.jpg); background-repeat:no-repeat; background-position: center center ;*/ padding: 50px 0;}
.contacto h1 {text-align: center; padding: 30px 0; text-transform: uppercase; color: white;margin-top: 20px;margin-bottom: 0; padding: 0;}
.contacto h2 {text-align: center; margin-top: 0; margin-bottom: 20px; color: #ff9900}
.col-izq {width: 49%; float: left;}
.col-der {width: 49%; float: right;}
.col-der form {padding: 0; font-size: 18px; font-family: 'Open Sans', sans-serif;; color: black}
.col-der form span {color: red}
#consulta {width: 100%; height: 100px}
.form-group {background-color: white; padding: 10px ; margin: 0; border: none;}
.mapa {height: 509px}

/* section clientes */
.clientes { text-align: center; margin-bottom: 30px}
.clientes h1 {text-align: center; margin-top: 30px;}
.clientes img {margin: 0 20px}

/* footer */
footer {background-color: #262626; height:; padding-top: 30px}
footer h1 {color: white; font-size: 20px; text-transform: uppercase;}
footer a {display: block; color: #ff9900}
footer a:hover {color: #ff9900}
footer p {color: gray; margin-bottom: 0}
.menu-footer {width: 200px; float: left; padding-bottom: 30px; margin-right: 30px}
.footer-info {float: right; text-align: right;}
.footer-info p {margin: 0; color: white; font-weight: 600; font-size: 13px}

.grilla-alarmas {margin: 0 auto}
.grilla-alarmas .container {text-align: center}
.grilla-alarmas h2 {margin-top: 25px; text-align: center;}
.grilla-alarmas article {display: inline-block; vertical-align: top; ; margin: 40px; padding: 15px; width: 250px; border: 1px solid black;}
.grilla-alarmas img {width: 100%}
.grilla-alarmas h3 {text-transform: uppercase; font-size: 20px; margin-top: 30px}
.grilla-alarmas p {color: #999999}

.linea-separacion {height: 2px; background-color: black; margin-top: 50px}

.planes-seguridad {margin: 80px 0 100px 0}
.planes-seguridad h3 {display: inline-block; margin: 20px 0 0 0px}
.planes-seguridad i {font-size: 30px; margin-right: 10px; color: #ff9900}

.servicios {margin: 100px 0 100px 0}
.servicios h3 {display: inline-block; font-size: 20px; margin: 10px 0 10px 0; color: white; background-color: #00004d; padding: 5px 10px; border-radius: 6px}
.servicios i {font-size: 18px; margin-right: 5px;}

.clientes {margin: 100px 0 100px 0}

.confirma {margin-top: 100px; margin-bottom: 200px; text-align: center}
.confirma a {background-color: #00004d; color: white; text-decoration: none; padding: 15px; border-radius: 6px; display: inline-block; margin-top: 10px}
.confirma a:hover {background-color: #ff9900}
.confirma p {margin: 10px 0 10px 0;}

/* media queries */
@media screen and (max-width: 63em) {
	#icon-mobile {display: block;}
	nav {width: 100%; float: none; padding-top: 40px;}
  	nav ul {max-height: 0; overflow: hidden;} 
  	nav li {display: block; border-bottom: 1px solid #fff; }
  	nav ul.open-menu {max-height: 400px; transition: max-height 0.4s; width: 100%; text-align: center; background-color: #333333; z-index: 1; position: relative; padding: 0; line-height: 3.5}
  	.container {max-width: 100%}
	.cbp-so-scroller {font-size: 65%;}
	.cbp-so-section h2 {margin: 0;}
	.cbp-so-side img {max-width: 120%;}
	.menu-footer {width: 160px}
}

@media screen and (max-width: 41.125em) {
	.cbp-so-side {float: none;width: 100%;}
	.cbp-so-side img {max-width: 100%;}
	.col-izq {width: 90%; float: none; margin: 0 auto}
	.col-der {width: 90%; float: none; margin: 20px auto;}
	.menu-footer {display: none;}
	.footer-info {float: none; text-align: center}
}

@media screen and (max-width: 35em) {
	.tel {display: none}
	.tel2 {display: inline-block; width: 100%}
	.cbp-so-scroller {margin-top: 15px}
	.servicios {margin-top: 40px}
	.planes-seguridad {margin-top: 30px}
	.clientes {margin-top: 30px}
	.contacto h1 {margin-top: 0}
}