/* GLOBAL STYLES
-------------------------------------------------- */
/* 
Process Cyan	0	166	214	#00aeef
Reflex Blue	#5A84DC
Pantone 361				#69af40

*/

body {
  padding-bottom: 0px;
  font-size:12px;
}

.row {
 margin-right: 0; 
margin-left: 0; 
}

.left{float:left}
.bbotton {  border-bottom:1px gray;}
.botpadding {padding-bottom:10px;}
.bgblu {background:#003399	}

h1, .h1 {font-size: 30px;}
h2, .h2 {font-size: 26px;}
h3, .h3 {font-size: 24px;}
h4, .h4 {font-size: 21px;}
h5, .h5 {font-size: 16px;}
h6, .h6 {font-size: 14px;}

.jumbotron {
  text-align: center;
  background-color: transparent;
}
.jumbotron .btn {
  padding: 14px 24px;
  font-size: 21px;
}

.nav-justified .btn-areareservada {
  background: #538adb;
  background-image: -webkit-linear-gradient(top, #538adb, #3a61b4);
  background-image: -moz-linear-gradient(top, #538adb, #3a61b4);
  background-image: -ms-linear-gradient(top, #538adb, #3a61b4);
  background-image: -o-linear-gradient(top, #538adb, #3a61b4);
  background-image: linear-gradient(to bottom, #538adb, #3a61b4);
  -webkit-border-radius: 7;
  -moz-border-radius: 7;
  border-radius: 7px;
  font-family: Arial;
  color: #ffffff;
  font-size: 13px;
  padding: 10px;
  text-decoration: none;
}

.nav-justified .btn-areareservada:hover {
  background: #3a61b4;
  background-image: -webkit-linear-gradient(top, #3a61b4, #538adb);
  background-image: -moz-linear-gradient(top, #3a61b4, #538adb);
  background-image: -ms-linear-gradient(top, #3a61b4, #538adb);
  background-image: -o-linear-gradient(top, #3a61b4, #538adb);
  background-image: linear-gradient(to bottom, #3a61b4, #538adb);
  color: #ffffff;
  text-decoration: none;
}
/* NAVBAR
-------------------------------------------------- */
.menu1 {
font-size: 11px;
text-transform: uppercase;
color: blue;
}
.menu1 > li > a {
padding: 10px;
font-weight: 700;
font-size: 12px;
color: #5A84DC !important;
text-align: center;
text-transform: uppercase;
background-color: #FFF;
border-bottom: 0px solid #d5d5d5;}

.navbar-default {
background-color: #FFF;
border-color: #FFF;
}

.navbar-nav {
float: left;
margin: 0;
margin-top: 25px;
}


.navbar-default .navbar-nav > .active > a, 
.navbar-default .navbar-nav > .active > a:hover, 
.navbar-default .navbar-nav > .active > a:focus 
.menu1 li a.active{
color: #66ccff;
background-color: #FFF;
}

.navbar-default .btn-areareservada {
background: #538adb;
background-image: -webkit-linear-gradient(top, #538adb, #3a61b4);
background-image: -moz-linear-gradient(top, #538adb, #3a61b4);
background-image: -ms-linear-gradient(top, #538adb, #3a61b4);
background-image: -o-linear-gradient(top, #538adb, #3a61b4);
background-image: linear-gradient(to bottom, #538adb, #3a61b4);
-webkit-border-radius: 7;
-moz-border-radius: 7;
border-radius: 7px;
font-family: Arial;
color: #ffffff !important;
font-size: 12px;
padding: 10px;
text-decoration: none;
}

.navbar-default .btn-areareservada:hover {
  background: #3a61b4;
  background-image: -webkit-linear-gradient(top, #3a61b4, #538adb);
  background-image: -moz-linear-gradient(top, #3a61b4, #538adb);
  background-image: -ms-linear-gradient(top, #3a61b4, #538adb);
  background-image: -o-linear-gradient(top, #3a61b4, #538adb);
  background-image: linear-gradient(to bottom, #3a61b4, #538adb);
  color: #ffffff;
  text-decoration: none;
}

.navbar-default .navbar-brand {
color: #777;
padding: 5px 0 5px 5px;
}
.navbar-default .navbar-collapse, .navbar-default .navbar-form {
border-color: #FFFFFF;
}

.nav .open > a, .nav .open > a:hover, .nav .open > a:focus {
background-color: #FFF;
/*border-color: #428bca;*/
}

.nav>li>a:hover, .nav>li>a:focus {
  text-decoration: none;
  color:#66ccff;
  background-color: #FFF;
}
.menu1 li a.active{color: #66ccff !important;}

.caret { /* quita triangulito de dropdown*/
		display: none;
}

/* MODAL */
.gysModal  {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
color: #FFF;
line-height: 1;
}
.gysModal h4 {
font-size: 21px;
color: #FFF;
background-color: #009;
line-height: 1;
}
.gysModal .modal-body, .gysModal .modal-header {
background-color: #009;
color:#FFF;
}

/* CAROUSEL
-------------------------------------------------- */
.carousel {
  height: 325px;
  margin-bottom: 0;
}
.carousel-indicators {
bottom: -50px;
}
.carousel-indicators .active {
  width: 12px;
  height: 12px;
  margin: 0;
  background-color: #003399;
}
.carousel-indicators li {
  background-color: #999 \9;
  background-color: rgba(153, 153, 153, 0.7);
}

/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  z-index: 10;
  right: 60%;
  bottom: 20px;
  left: 13%;
  top: 3%;
  text-shadow: 0 0px 0px rgba(0, 0, 0, .6);
  text-align: left;
}

.carousel-caption h1{
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size:60px; color:#FFF; background-color:#009;
  width: 395px;
  margin:1px;
  float:left;
  padding: 10px 10px 10px 20px;
  line-height: 1;
}
.carousel-caption p{
  font-family: Arial, Helvetica, sans-serif;
  font-size:12px !important; font-color:white; background-color:#009;
  line-height:15px;
  width: 395px;
  margin:1px;
  float:left;
  padding: 20px 10px 30px 20px;
}
.carousel-caption .btn {
  border: 0;
text-shadow: none;
margin-top: -20px;
margin-left: 20px;
background-image: url(../imag/plus_green.png);
width: 150px;
height: 60px;
}
/* Declare heights because of positioning of img element */
.carousel .item {
  height: 325px;
  /*background-color: #777;*/
}
.carousel-inner > .item > img {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%;
  height: 325px;
}
.carousel-control.right{
right: 0;
left: auto;
background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, .0001) 0%, rgba(18, 184, 188, .5) 100%);
background-image: -o-linear-gradient(left, rgba(0, 0, 0, .0001) 0%, rgba(18, 184, 188, .5) 100%);
background-image: -webkit-gradient(linear, left top, right top, from(rgba(18, 184, 188, .0001)), to(rgba(0, 0, 0, .5)));
background-image: linear-gradient(to right, rgba(0, 0, 0, .0001) 0%, rgba(18, 184, 188, 0.5) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#80000000', GradientType=1);
background-repeat: repeat-x;}
.carousel-control.left {
background-image: -webkit-linear-gradient(left, rgba(18, 184, 188, .5) 0%, rgba(0, 0, 0, .0001) 100%);
background-image: -o-linear-gradient(left, rgba(18, 184, 188, .5) 0%, rgba(0, 0, 0, .0001) 100%);
background-image: -webkit-gradient(linear, left top, right top, from(rgba(18, 184, 188, .5)), to(rgba(0, 0, 0, .0001)));
background-image: linear-gradient(to right, rgba(18, 184, 188, .5) 0%, rgba(0, 0, 0, .0001) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1);
background-repeat: repeat-x;
}
.vd:hover {
-webkit-box-shadow: inset 0 10px 10px rgba(231, 242, 38, 0.28);
box-shadow: inset 0 10px 10px rgba(231, 242, 38, 0.28);
}

/* MARKETING CONTENT
-------------------------------------------------- */
.bg-cyan {
  background-color:#00aeef;
}

/* Center align the text within the columns below the carousel */
.marketing .col-lg-4 {
  margin-bottom: 20px;
  text-align: center;
}
.marketing h2 {
  font-weight: normal;
}
.marketing .col-lg-4 p {
  margin-right: 10px;
  margin-left: 10px;
}


/* Features
------------------------- */
.servicios {
  background:#00aeef url(../imag/fo_4cols.png)repeat-x;
 /* height: 325px;*/
  margin-top:50px;
}
.nopadding { 
	padding: 0
 margin: 0
}
.feature-divider {
  margin: 80px 0; /* Space out the Bootstrap <hr> more */
}

/* Thin out the marketing headings */
.feature-heading {
  font-weight: 40;
  line-height: 1;
  letter-spacing: -1px;
}
.transparent {filter: alpha(opacity=0);       /* IE8 and lower */}

.box {
 border-radius: 5%;
 border: 0px solid;
 overflow:hidden;
  background: #66ccff;
  background-image: -webkit-linear-gradient(top, #66ccff, #0263a3);
  background-image: -moz-linear-gradient(top, #66ccff, #0263a3);
  background-image: -ms-linear-gradient(top, #66ccff, #0263a3);
  background-image: -o-linear-gradient(top, #66ccff, #0263a3);
  background-image: linear-gradient(to bottom, #66ccff, #0263a3);
}
.box:hover {
  box-shadow: 0 2px 20px rgba(0,0,0,.05);
}
.box h2{
 font-size:16px;
 text-transform:uppercase;
 text-align:center
}
.box h2 a{
 color:#FFF
}

.servimage {
    position:relative;
    overflow:hidden;
    display: block;
    padding: 0;
    margin-bottom: 0px;
    line-height: 1.42857143;
    border: 0px;
    border-radius: 4px;
    -webkit-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}

.servimage img { margin: 0 auto;}
.caption {
    position:absolute;
    top:0;
    right:0;
    background:rgba(0, 51, 153, 0.75);
    width:100%;
    height:100%;
    padding:2%;
    display: none;
    text-align:center;
    color:#fff !important;
    z-index:2;
}
.servimage .caption p {padding-top: 20px;}
a.label-plus{
  font-size: 14px; color:#FFF; 
}

/* PAGE ELEMENTS */
h1.title { font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 30px; color:#5A84DC;}
h1, h2, h3, h4, h5, h6{ font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#66ccff;}
hr.titlehr{
 margin-top: 5px;
 margin-bottom: 5px;
 border: 0;
 border-top: 1px solid #eee;
 }
hr.gysen-divider{margin-top:0; margin-bottom:0;}
.row.degrade {background: url(imag/degrade.jpg) no-repeat center top;}

/* SERVICIOS PAGE */
.accordion-group .accordion + .accordion {margin-top: 5px;}
.accordion-group {margin-top: 5px; margin-bottom:20px;}
a.accordion-toggle {width:100%}
.accordion-title{text-transform: uppercase; margin: 0;}
.accordion-title a{ 
color:#5A84DC;
margin-top: 0;
margin-bottom: 0;
font-size: 16px;
}
.accordion-title > a {
color: #5A84DC;
}

.accordion-heading {
color: #5A84DC;
background-color: #fff;
background: url(../imag/collap_ico.png) no-repeat right center;
border-color: #ddd;
padding: 10px 15px;
border-top: 1px solid #ccc;
border-bottom: 0px solid #ccc;
}

.accordion-heading:hover, .accordion-heading-active {
  background-color: #f5f5f5;
}

.accordion-heading a.collapsed {}

.accordion-body{padding: 10px 15px;}

.panel-default > .panel-heading {
  background-color: #3b62b5;
  border-color: #3b62b5;
  color: #fff;
  text-align: center;
  font-size: 1.5em;
}

.panel, .panel-default {
  border: none;
}

.panel > .list-group .list-group-item, .panel > .list-group:last-child .list-group-item:last-child , .list-group-item {
  border-bottom: 1px solid #b8c4e2 !important;
  border-radius: 0px;
  padding: 0;
}

.panel > .list-group .list-group-item a {
  display: block;
  width: 100%;
  padding: 10px 5px 10px 10px ;
}

.panel > .list-group .list-group-item a:hover {
  background-color: #e2e8f4;
  text-decoration: none;
}

.nopadding {
   padding: 0 !important;
   margin: 0 !important;
}

/* Multi level menu
-------------------------------------------------- */s

.dropdown-submenu {
    position: relative;
}

.dropdown-submenu>.dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -6px;
    margin-left: -1px;
    -webkit-border-radius: 0 6px 6px 6px;
    -moz-border-radius: 0 6px 6px;
    border-radius: 0 6px 6px 6px;
}

.dropdown-submenu:hover>.dropdown-menu {
    display: block;
}

.dropdown-submenu>a:after {
    display: block;
    content: " ";
    float: right;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    border-left-color: #ccc;
    margin-top: 5px;
    margin-right: -10px;
}

.dropdown-submenu:hover>a:after {
    border-left-color: #fff;
}

.dropdown-submenu.pull-left {
    float: none;
}

.dropdown-submenu.pull-left>.dropdown-menu {
    left: -100%;
    margin-left: 10px;
    -webkit-border-radius: 6px 0 6px 6px;
    -moz-border-radius: 6px 0 6px 6px;
    border-radius: 6px 0 6px 6px;
}


/* Sticky footer styles
-------------------------------------------------- */
html {
  position: relative;
  min-height: 100%;
}
body {
  /* Margin bottom by footer height */
  margin-bottom: 60px;
}
.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  /* Set the fixed height of the footer here */
  height: 60px;
  background-color: #003399;
}

footer {
  padding-top: 20px;
  padding-bottom: 20px;
  border-top: 0px;
}
footer a, footer p, footer a:hover{
  font-size:13px;
  color: #a4add2;
}

/* Forms */
.form-group { margin-bottom: 10px }
.form-control { height: 45px }

textarea.form-control { height: 155px; }

input.form-control, textarea.form-control {  background-color: #3b62b5; color: #fff;}

.form-control::-webkit-input-placeholder { color: #fff; }
.form-control:-moz-placeholder { /* Firefox 18- */ color: #fff; }
.form-control::-moz-placeholder {  /* Firefox 19+ */ color: #fff; }
.form-control:-ms-input-placeholder { color: #fff; }
.form-control input[placeholder] { color: #fff; }

.btn-contacto, .btn-contacto:hover, .btn-contacto:visited, .btn-contacto:active {
  color: #fff;
  height: 45px;
  width: 150px;
  text-align: left;
  background: url(../imag/clientes_ico.png) #00acec no-repeat right 10px center;
  font-size: 1em;
  margin-right: 15px;
}

a.btn-contacto , a.btn-contacto:hover, a.btn-contacto:visited, a.btn-contacto:active {
  width: 170px;
  padding: 15px;
}
.contacto-obligatorio { color: #535353;}
span.glyphicon-large {
    font-size: 1.8em;
    color: #00acec;
    vertical-align: middle;
}
.contact-info { margin-left: 30px; }
.contact-info-container, .contact-info a { color: #656565; }
.contact-center{ margin-top: 3px; }

label.error { margin: 5px 0; color: red; font-style: italic; font-weight: normal; }
input.error { border: 1px dotted red; }

.atras {
background: #538adb;
background-image: -webkit-linear-gradient(top, #538adb, #3a61b4);
background-image: -moz-linear-gradient(top, #538adb, #3a61b4);
background-image: -ms-linear-gradient(top, #538adb, #3a61b4);
background-image: -o-linear-gradient(top, #538adb, #3a61b4);
background-image: linear-gradient(to bottom, #538adb, #3a61b4);
-webkit-border-radius: 7;
-moz-border-radius: 7;
border-radius: 7px;
font-family: Arial;
color: #ffffff !important;
font-size: 12px;
padding: 5px;
text-decoration: none;
margin-top: 20px;
}
li{padding-bottom:0.65em;}

.container {padding-right: 0px;padding-left: 0px;}
.principal-menu {padding-right: 15px;padding-left: 15px;}
.fin a {color:#FFF; font-size:16px}

/* RESPONSIVE CSS
-------------------------------------------------- */
/* Extra small devices (phones, less than 768px) */
/* No media query since this is the default in Bootstrap */

/* smartphones */
@media (max-width: 768px) {
 .servimage .caption p {
		padding-top: 10px;
}
.carousel-control.right, .carousel-control.left {
		display:none;
    }
.carousel-caption {
  right: 60%;
  bottom: 20px;
  left: 12%;
  top: auto;
  margin: 0 auto;
}
.carousel-caption h1 {
font-size: 41px;
width: 300px;
}
.carousel-caption p {
width: 300px;
}
.atras {
margin-top: 5px;
margin-bottom: 5px;
}
.box h2 a{
 letter-spacing: 0.02em;
}
}



/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {

  /* Navbar positioning foo */
  .navbar-wrapper {
    margin-top: 20px;
  }
  .navbar-wrapper .container {
    padding-right: 15px;
    padding-left: 15px;
  }
  .navbar-wrapper .navbar {
    padding-right: 0;
    padding-left: 0;
  }

  /* The navbar becomes detached from the top, so we round the corners */
  .navbar-wrapper .navbar {
    border-radius: 4px;
  }
  .navbar-nav.menu1{
   /* padding-top: 20px;*/
  }

  /* Bump up size of carousel content */
  .carousel-caption p {
    margin-bottom: 20px;
    font-size: 21px;
    line-height: 1.4;
  }

  .feature-heading {
    font-size: 30px;
  }
  
   .navbar-nav {
     float: right;
     margin: 0;}
     
   .carousel-caption .btn {
     margin-top: -40px;
     }
   .gysModal .modal-dialog {
     width: 430px;
    } 
   }
/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
  .feature-heading {
    margin-top: 0px;
  }
   .navbar-nav {
     float: right;
     margin: 0;
     margin-top:20px;
   }
   .servicios {
  background:#00aeef url(../imag/fo_4cols.png)repeat-x;
  /* height: 195px; */ min-height: 250px;
   }
   .carousel-caption .btn {
     margin-top: -40px;
     }
  .gysModal .modal-dialog {
  width: 430px;
  }
  .gysModal .modal-dialog.modal-630 {
  width: 630px;
  }
}

/* Five column layout */
.col-xs-5ths,
.col-sm-5ths,
.col-md-5ths,
.col-lg-5ths {
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}

.col-xs-5ths {
    width: 20%;
    float: left;
}
@media (min-width: 768px) {
.col-sm-5ths {
        width: 20%;
        float: left;
    }
}
@media (min-width: 992px) {
    .col-md-5ths {
        width: 20%;
        float: left;
    }
}
@media (min-width: 1200px) {
    .col-lg-5ths {
        width: 20%;
        float: left;
    }
}