@charset "utf-8";
/* CSS Document */

#fondo { position:fixed; background:#FFF; top:0; left:0; z-index:-3; animation: fadein 4s; -moz-animation: fadein 4s; /* Firefox */ -webkit-animation: fadein 4s; /* Safari and Chrome */-o-animation: fadein 4s; /* Opera */ }
@keyframes fadein { from { opacity:0;} to { opacity:2; }}
@-moz-keyframes fadein { from { opacity:0;} to { opacity:2; }}
@-webkit-keyframes fadein { from { opacity:0;} to { opacity:2; }}
@-o-keyframes fadein { from { opacity:0;} to { opacity:2; }}


/*--------*/

* {outline:0; padding:0; margin:0;}

body {outline:0; padding:0; margin:0; font-family: Century Gothic, sans-serif; color:#2e378f;}
a {color:#2e378f ;text-decoration:none}
a:hover, a:focus {color:#2e378f; background:#f2d008;}
a img {border: 0; outline: 0;}
h1 {font-size: 1.8em; padding:0.5em; border-bottom: solid 1px #8a979b;}
h2 {font-size: 1.4em; line-height: 1.1;margin-bottom: 0.2em; color:#1daae2; padding:0.4em; font-weight: normal;}
h3 {font-weight: normal; line-height:1.1; color:#CFB264; margin:0 auto; padding-left:.5em; }
h4 {color:#000; padding:0.5em}
b {color:#fff;}
strong {color:#1daae2; }
p {color: #393c42;}


.btn { font-weight:bold; padding:1em; background:#1daae2; color:#FFF; border-radius:0.2em; margin:1em; display:block; text-align:center; max-width:220px;}
.btn a:hover {color:#FFF; background:#f2d008;}
.icon { color:#FFF; font-size:3em; background: #2e378f; border: solid 1px #2A3F55; padding:0.45em; text-align: center; margin:0.5em; font-weight: normal;}
  
.slogan {padding:1.6em;font-size:1.1em;color: #f2d008;font-style:italic; font-weight:bold}
.fotos { margin-top:1em; border-bottom-right-radius:1em; border-top-left-radius:1em; border:2px solid #1daae2; animation: fadein 4s; -moz-animation: fadein 4s;  -webkit-animation: fadein 4s; -o-animation: fadein 4s;}
.unidades { border:1px solid #1daae2; margin: 10px 0px 10px 0px; animation: fadein 4s; -moz-animation: fadein 4s;  -webkit-animation: fadein 4s; -o-animation: fadein 4s;}

.icon-list { list-style:none;margin:0.7em;padding:6px; color:#FFFFFF;}
.icon-list li {margin-top:0.5em; color: #393c42;  }
.icon-list li:before {margin-right:0.5em; margin-left:-1.4em; color:#e27b00;}


.icon-list-bg { list-style:none;margin:0.7em;padding:6px; color:#FFFFFF;}
.icon-list-bg li {margin-top:0.5em; color: #FFF; font-size: 13px;  }
.icon-list-bg li:before {margin-right:0.5em; margin-left:-1.4em; color:#e27b00;}

.quota-1 {text-align: center; color: #FFF; font-size: 1.6em; background: url(../images/quota-001.jpg) center no-repeat; display: block; width: 1016px; height: 360px; }
.quota-2 {text-align: center; color: #FFF; font-size: 1.6em; background: url(../images/quota-002.jpg) center no-repeat; display: block; width: 1016px; height: 360px; }
.quota-3 {text-align: center; color: #FFF; font-size: 1.6em; background: url(../images/quota-003.jpg) center no-repeat; display: block; width: 1016px; height: 360px; }
.quota-4 {text-align: center; color: #FFF; font-size: 1.6em; background: url(../images/quota-004.jpg) center no-repeat; display: block; width: 1016px; height: 360px; }

.subtext {color: #FFF;}

/*Slider*/

#slider { text-align:center; }
#slider img {width:100%;}

#slider a:hover {cursor:pointer;}
.btn-floating:hover {box-shadow:0 3px 3px 0 rgba(0,0,0,0.5),0 6px 10px 0 #000;}
.btn-floating1, .btn-floating2  {width:40px;height:40px; line-height:40px; display:inline-block; color:#2e378f; background-color:#FFF; position:relative; overflow:hidden; z-index:1; padding:0; border-radius:50%; cursor:pointer; font-size:24px; top:-50px; 
-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}

.btn-floating1 {float:left; margin-left:1em;}
.btn-floating2 {float:right; margin-right:1em;}

/* Social Footer */

.icon-button {background-color: white; border-radius: 3.6em; cursor: pointer;display: inline-block; font-size: 2.0rem; height: 3.6rem;line-height: 3.6rem; margin: 0 5px; position: relative; text-align: center;
-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none; user-select: none; width: 3.6rem; }

/* Circle */

.icon-button span {border-radius: 0; display: block; height: 0; left: 50%; margin: 0; position: absolute; top: 50%;
-webkit-transition: all 0.3s; -moz-transition: all 0.3s;  -o-transition: all 0.3s; transition: all 0.3s; width: 0; }
	
.icon-button:hover span { width: 3.6rem; height: 3.6rem; border-radius: 3.6rem; margin: -1.8rem; }
.twitter span, .facebook span, .mail span, .linkedin span { background-color: #1daae2; }


/* Icons */
.icon-button i { background: none; color: white; height: 3.6rem; left: -0.15em; line-height: 3.6rem; position: absolute; top: 0; width: 3.6rem; z-index: 10;
-webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; }
.icon-button .flaticon-twitter, .icon-button .flaticon-linkedin, .icon-button .flaticon-facebook, .icon-button .flaticon-mail { color: #1daae2;}
.icon-button:hover .flaticon-twitter, .icon-button:hover .flaticon-linkedin, .icon-button:hover .flaticon-facebook, .icon-button:hover .flaticon-mail { color:#FFF; }

/*--------*/

#top { background:#1daae2; color:#FFF; text-align:right; width:100%; text-align:right;  padding:0; font-size: 15px;   }
#top ul { padding:8px 3em; }
#top li {display:inline; padding:.6em 0; }

#top a { padding:9px; color:#fff;}
#top a:hover { color:#1daae2; background:#2e378f; }

#header { width:100%; height:150px; margin:0 auto; background: url(../images/header.jpg) no-repeat #FFF bottom center ; clear:both; } 

.menu-fixed {position:fixed; z-index:1000; width:100%; top:0; border-bottom:2px solid #2e378f;}

nav { width:100%; margin:0 auto; background-color:#FFF; border-bottom:1px solid #2e378f; border-top:1px solid #2e378f; }
nav ul { width:100%; margin:0 auto; text-align:center; color:#fff; height:76px; }
nav li { display:inline; font-style:none; }
nav a { padding:0.8em 1.4em; color:#2e378f; text-decoration:none; font-size:1em; }
nav a:hover {color:#fff; background:#2e378f; animation: fadein 1s; -moz-animation: fadein 1s; -webkit-animation: fadein 1s; -o-animation: fadein 1s;} 


/*--------*/

#contenido { width:1016px; margin:0 auto; background:rgba(0,0,0,0.1); padding-top:0px; } 

.separador {width:100%;  color:#fff; clear:both; border-bottom: 1px #808080; margin-left:-12px; margin-top:0px; text-transform:uppercase; }

.columna {width:100%;  padding:0; clear:both; }
.columna-2 {width:470px; min-height:100px; margin:15px; float:left; }
.columna-2-parque {width:470px; min-height:100px; margin:15px; float:left; background: #393c42; color: #FFF;}
.columna-3 {width:280px; min-height:100px; height: 260px; margin:18px; padding: 0.6em; float:left; text-align:center; background:#47484f; color: #FFF;  }
.columna-4 {width:230px; min-height:100px; margin-left:17px; float:left; text-align:center; }
.columna-4-parque {width:230px; min-height:100px; margin-left:17px; padding-top: 1em; float:left; background: #393c42; color: #FFF;}
.columna-5 {width:180px; min-height:50px; margin:3px; float:left; border-right: #9fdaed solid 1px; padding:0.5em; background: #2e378f; color: #FFF; height: 400px; }
.columna-5-b {width:180px; min-height:50px; margin:3px; float:left; border-right: #9fdaed solid 1px; padding:0.5em; background: #393c42; color: #FFF; height: 400px; }


/*--- secciones -----*/

#transporte, #TK, #unidades, #nosotros, #contacto  { width:100%;  min-height:400px; clear:both; padding-top:3em; }

.text-form { width:97%; padding:.5em; font-size:1em; border:none; }
.text-form2 { width:40%;  padding:.5em; font-size:1em; border:none; }
.link_extra {background-color:#4e74b9; padding:.5em; margin-top:1em;}
.button {background-color: #1daae2; border-radius: 0.5em; border:none; color: #FFF; padding: 0.5em 2em;text-align: center; text-decoration: none; display: inline-block; font-size: 16px;}
.button:hover { background-color: #ffbc00; color: #303338; cursor:pointer;}


#footer { width:100%;  min-height:100px; clear:both; text-align:center;  font-size:.9em; color:#fff;  padding-top:2em; padding-bottom:2em; z-index:-1; line-height:20px;}
#footer p {color:#fff;}
#footer a {color:#fff; }
#footer a:hover {color:#1daae2; }

#footer, #footer-m {background:#47484f; text-align:center; }


/*Social Menu*/

.social { position: fixed; right: 0px; top: 250px; z-index: 2;}
.social ul {list-style:none; text-align:right;}
.social ul li a {display: inline-block; color:#fff; background: #1daae2; padding: 20px 15px; text-decoration: none; animation-direction: normal; -webkit-transition:400ms ease;-o-transition:400ms ease; transition:400ms ease; margin-bottom:.5em; }
.social ul li a:hover {background: #2e378f; padding: 18px; font-size:large;}


/*Contenido movil*/


header { top:0; left:0; width:100%; background:#2e378f; position:fixed; z-index:2000; }

header nav { width:100%; left:-100%; margin:0; top:59px; border:none; position:absolute;  }
header nav ul { list-style:none; width:100%; height:100%; padding:0; }

header nav ul li {display:block; float:none; font-size:1.4em; text-align:left; border-bottom:1px solid #fff; width:100%;}
header nav ul li a { color:#2e378f; padding:10px; display:block; text-decoration:none; background:#1daae2; }
header nav ul li span { margin-right:7px; margin-left:10px; }
header nav ul li a:hover { background:#f1d014; color:#2e378f;}

.menu_bar { display:block; width:100%; color:#fff; cursor:pointer; border-bottom:1px solid #fff;}
.menu_bar .bt-menu { display:block; padding:16px;  color:#fff; text-decoration:none; font-weight: bold; font-size:22px; }


/*-------------*/

#contenido-m { margin-left:3%; margin-right:3%; background:rgba(0,0,0,0.7);   }

#industria-m, #admin-m, #guardias-m, #cctv-m, #especiales-m, #valor-m, #empresa-m, #contacto-m  { width:100%;  min-height:200px; clear:both; padding-top:58px; margin:0 auto; }

#nosotros-m {text-align:center;}

.columna-m {width:95%; float:left;  padding-left:2.25%; margin-bottom:.5em;}

.separador-m {width:100%; padding:2% 0; color:#fff; clear:both; text-align:center;  background: url(../images/separador.jpg) ; margin-bottom:1em; }

.separador-m h1 {font-size:1.5em;}

.columna-m-4 {max-width:42%; min-height:100px; float:left; text-align:center; font-size:.7em; margin-left:5%; margin-bottom:1em;   }
.columna-m-4 img {width:100%;}

.logo-m {width:100%; padding-top:2em; text-align:center;  }


.title-m {display:block; color:#cfb264; background:rgba(0,0,0,0.7); margin-top:4px; padding:.4em 0; text-align:center; border-radius:0.6em; width:90%; text-align:center;}
.fotos-m { margin:1em 0;  max-width:100%; }




/*-------------*/


@media (max-width:600px){.hide-small{display:none!important}}
@media (max-width:992px) and (min-width:601px){.hide-medium{display:none!important}}
@media (min-width:993px){.hide-large{display:none!important}}
.animate-fading{-webkit-animation:fading 10s infinite;animation:fading 10s infinite}
@-webkit-keyframes fading{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
@keyframes fading{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
.animate-opacity{-webkit-animation:opac 1.5s;animation:opac 1.5s}
@-webkit-keyframes opac{from{opacity:0} to{opacity:1}}
@keyframes opac{from{opacity:0} to{opacity:1}}
.animate-top{position:relative;-webkit-animation:animatetop 0.4s;animation:animatetop 0.4s}
@-webkit-keyframes animatetop{from{top:-300px;opacity:0} to{top:0;opacity:1}}
@keyframes animatetop{from{top:-300px;opacity:0} to{top:0;opacity:1}}
.animate-left{position:relative;-webkit-animation:animateleft 0.4s;animation:animateleft 0.4s}
@-webkit-keyframes animateleft{from{left:-300px;opacity:0} to{left:0;opacity:1}}
@keyframes animateleft{from{left:-300px;opacity:0} to{left:0;opacity:1}}
.animate-right{position:relative;-webkit-animation:animateright 0.4s;animation:animateright 0.4s}
@-webkit-keyframes animateright{from{right:-300px;opacity:0} to{right:0;opacity:1}}
@keyframes animateright{from{right:-300px;opacity:0} to{right:0;opacity:1}}
.animate-bottom{position:relative;-webkit-animation:animatebottom 0.4s;animation:animatebottom 0.4s}
@-webkit-keyframes animatebottom{from{bottom:-300px;opacity:0} to{bottom:0px;opacity:1}}
@keyframes animatebottom{from{bottom:-300px;opacity:0} to{bottom:0;opacity:1}}
.animate-zoom {-webkit-animation:animatezoom 0.6s;animation:animatezoom 0.6s}
@-webkit-keyframes animatezoom{from{-webkit-transform:scale(0)} to{-webkit-transform:scale(1)}}
@keyframes animatezoom{from{transform:scale(0)} to{transform:scale(1)}}
.animate-input{-webkit-transition:width 0.4s ease-in-out;transition:width 0.4s ease-in-out}.animate-input:focus{width:100%!important}