/*DESKTOP*/
@media only screen and (min-width : 200px){

* {color: #333; font-style: normal; font-family: 'Roboto Condensed', sans-serif; font-size: 15px; font-weight: normal; list-style: none; margin: 0; padding: 0; text-decoration: none;}
body {background-color: #999; background-image: url(../img/bg.jpg); background-attachment: fixed; background-size: 100%; min-width: 1100px;}

footer {background-color: #283360; box-shadow:  0 0 10px #999; margin-top: 40px; min-width: 1100px; text-align: right; width: 100%;}
footer div {background-color: #283360; border-bottom: 2px solid #FFF; border-top: 2px solid #FFF; text-align: right; width: 100%;}
footer div ol {display: inline-block; margin-right: 10%; padding: 10px 0; text-align: right; width: 90%;}
footer div ol li {color: #FFF; display: inline-block; margin-left: 30px; text-align: center; vertical-align: middle;}
footer div ol li a {color: #FFF;}
footer div ol li a:hover {color: #999;}
footer div ol li span {color: #999; font-weight: bold;}
footer div ol li strong {color: #FFF; font-weight: bold;}
footer p {color: #FFF; padding: 25px 0 5px 0; text-align: center; width: 100%;}
footer p img {display: inline-block; position: absolute; right: 5px; width: 100px;}
footer p strong {color: #FFF; font-weight: bold; margin-bottom: 5px; text-align: center; width: 100%;}

form input[type=submit] {background-color: #283360; border-radius: 5px; color: #FFF; display: inline-block; font-size: 15px; padding: 5px 10px; text-align: center;}
form input[type=submit]:hover {background-color: #333;}

h1, h2, h3, h4, h5, h6 {color: #283360; font-weight: bold;}
h1 {font-size: 30px;}
h2 {font-size: 22.5px;}
h3 {font-size: 20px;}
h4 {font-size: 17.5px;}
h5 {font-size: 15px;}
h6 {font-size: 12.5px;}

header {background-color: #FFF; background-image: url(../img/bg_header.jpg); background-size: 100%; background-position: top; min-height: 125px; padding: 10px 10% 10px 0; text-align: right; width: 90%;}
header figure {left: 10%; margin-top: 15px; position: absolute; text-align: left; width: 30%;}
header figure img {min-width: 225px; max-width: 250px; width: 50%;}
header h1 {color: #999; margin: 0 0 10px 0;}
header h2 {color: #333;}
header ul {display: inline-block; vertical-align: middle;}
header ul li {display: inline-block; margin-left: 15px; vertical-align: middle;}
header ul li a {font-size: 15px; font-weight: bold;}
header ul li img {width: 35px;}
header ul li span img {border: 2px solid #999;}
header ul li span {color: #999; font-size: 12.5px; font-weight: bold;}

nav {background-color: #283360; border-bottom: 2px solid #FFF; border-top: 2px solid #FFF; box-shadow: 0 0 10px #999; text-align: right; width: 100%;}
nav ul {display: inline-block; margin-right: 10%; padding: 10px 0; text-align: right; width: 90%;}
nav ul li {color: #FFF; display: inline-block; margin-left: 30px; text-align: center; vertical-align: middle;}
nav ul li a {color: #FFF;}
nav ul li span {color: #999; font-weight: bold;}
nav ul li strong {color: #FFF; font-weight: bold;}

section {width: 100%;}
section h1 {display: block; text-align: center; width: 100%;}
section p {margin: 0 15% 1em 15%; text-align: justify; width: 70%;}
section p span {color: #999; font-size: 15px;}
section p strong {color: #283360; font-weight: bold;}
section ul {margin: 0 15% 1em 15%; text-align: justify; width: 70%;}
section ul li {list-style-image: url(../img/bullets.png); margin: 0 0 1em 25px;}
section ul li strong {color: #283360; font-weight: bold;}

video {left: 50%; min-height: 100%; min-width: 100%; position: fixed; transform: translateX(-50%) translateY(-50%); top: 50%; width: 100%; z-index: -1000;}

#actualizacion {background-image: url(../img/bg_video.png); border-bottom: 3px solid #FFF; border-top: 3px solid #FFF; box-shadow: 0 0 10px #999; display: inline-block; margin: 50px 0 0 0; padding: 25px 0; text-align: center; vertical-align: top; width: 100%;}
#actualizacion h1 {margin-top: 0;}
#actualizacion video {border: 3px solid #283360; width: 50%;}

#clientes {background-color: #FFF; background-image: url(../img/bg_clientes.jpg); background-position: bottom; background-repeat: repeat-x; padding: 25px 0; width: 100%;}
#clientes img {display: inline-block; margin: 0 10px; vertical-align: middle;}
#clientes img:hover {cursor: pointer;}

#clientes-plaza {background-color: #FFF; background-image: url(../img/bg_clientes.jpg); background-position: bottom; background-repeat: repeat-x; padding: 20px 0; text-align: center; width: 100%;}
#clientes-plaza img {display: inline-block; margin: 0 10px; vertical-align: middle;}
#clientes-plaza img:hover {cursor: pointer;}

#galeria {display: inline-block; margin: 0 10%; width: 80%;}
#galeria img {border: 3px solid #283360; margin: 20px 10px;}

#intro {border: 3px solid #FFF; bottom: 20%; color: #FFF; display: inline-block; font-size: 20px; margin: 22.5% 20px 0 20px ; padding: 10px 30px;}
#intro:hover {border: 3px solid #FFF; bottom: 20%; color: #FFF; display: inline-block; font-size: 20px; margin-top: 22.5%; padding: 10px 30px;}

#footer {color: #FFF; padding: 0; padding-bottom: 5px; position: fixed; bottom: 0; text-align: center; width: 100%;}
#footer img {display: inline-block; position: absolute; right: 5px; width: 100px;}
#footer strong {color: #FFF; font-weight: bold; margin-bottom: 5px; text-align: center; width: 100%;}

#formulario {background-color: #FFF; background-image: url(../img/contact.png); background-position: bottom right; background-repeat: no-repeat; background-size: 125px; border: solid 3px #333; border-radius: 10px; box-shadow: 0 0 10px #999; margin: 50px 10%; padding: 25px 0; text-align: center; width: 80%;}
#formulario a {background-color: #283360; border-radius: 5px; color: #FFF; display: inline-block; font-size: 15px; padding: 5px 10px; text-align: center;}
#formulario a:hover {background-color: #999;}
#formulario form {margin: 25px 5%; text-align: justify; width: 90%;}
#formulario form div {display: inline-block; margin: 0 10px; vertical-align: top; width: 30%;}
#formulario form div label {display: block;}
#formulario form div label span {color: red;}
#formulario form div input {display: block; margin: 5px 0 10px 0; width: 100%;}
#formulario form div p {margin-top: 5px; text-align: center;}
#formulario form div p span{color: red;}
#formulario form div select {display: block; margin: 5px 0 10px 0; width: 100%;}
#formulario form div textarea {display: block; margin: 5px 0 10px 0; width: 100%;}

#infraestructura {background-color: #FFF; display: inline-block; margin: 0; padding: 25px 5%; text-align: left; width: 90%}
#infraestructura article#iconos {display: inline-block; text-align: center; vertical-align: top; width: 35%}
#infraestructura article#iconos div {display: inline-block; margin-bottom: 20px; vertical-align: top; width: 45%;}
#infraestructura article#iconos div h3 {color: #666; font-size: 20px;}
#infraestructura article#iconos div img {cursor: pointer; display: inline-block; margin-bottom: 20px; width: 35%;}
#infraestructura article#informacion {display: inline-block; text-align: center; vertical-align: top; width: 60%;}
#infraestructura article#informacion div {display: none;}
#infraestructura article#informacion div h2{color: #001468; display: block; font-size: 25px; margin-bottom: 20px;}
#infraestructura article#informacion div img {border: 5px solid #DDD; box-shadow: 0 0 10px #EEE; margin-bottom: 10px; width: 100%}
#infraestructura article#informacion div p {text-align: justify; margin: 0 5%; padding: 0; width: 90%;}
#infraestructura article#informacion div ul {text-align: justify; margin: 0 5%; padding: 0; width: 90%;}
#infraestructura article#informacion div ul li {margin-bottom: 5px;}

#plaza_plit {width: 100%;}

.about_us {display: block; margin: 0 25% 25px 25%; opacity: 0; width: 50%;}
.about_us div {border-left: 3px solid #283360; display: inline-block; margin-left: 2.5%; padding: 10px 0 10px 2.5%; vertical-align: middle; width: 75%;}
.about_us div h2 {display: block; margin-bottom: 10px; vertical-align: middle; width: 40%;}
.about_us div p {display: block; padding-left: 1%; text-align: justify;}
.about_us div ul {display: block; padding-left: 1%; text-align: justify;}
.about_us div ul li {display: block;}
.about_us img {display: inline-block; vertical-align: middle; width: 15%;}

.amenities  {background-color: #FFF; border: 3px solid #FFF; box-shadow: 0 0 10px #333; display: inline-block; margin: 0 25px 40px 25px ; padding-bottom: 25px; text-align: center; vertical-align: top; width: 22.5%;}
.amenities:hover {border: 3px solid #283360;}
.amenities img {display: inline-block; margin-bottom: 10px; width: 100%;}
.amenities h2 {display: block; margin-bottom: 10px; text-align: center;}
.amenities p {display: inline-block; margin: 0 5% 10px 5%; text-align: justify; width: 90%;}
.amenities ul {display: inline-block; margin: 0 5%; text-align: left; width: 90%;}
.amenities ul li {display: block; margin: 0 0 5px 0;}

.art {display: none; left: 0; margin:0; position: absolute; width: 100%; }

.amenities-content {display: inline-block; margin: 0 25px 330px 25px ; padding-bottom: 25px; position: relative; text-align: center; vertical-align: top; width: 22.5%;}
.amenities-content img {display: inline-block; margin-bottom: 10px; width: 100%;}

.amenities-icon  {left: 25%; margin-top: 25%; padding-bottom: 25px; position: absolute; text-align: center; vertical-align: top;}
.amenities-icon:hover {cursor: pointer;}
.amenities-icon img {height: 150px; width: 150px;}
.amenities-icon h2 {display: block; margin-bottom: 10px; text-align: center;}
.amenities-icon p {display: inline-block; margin: 0 5% 10px 5%; text-align: justify; width: 90%;}
.amenities-icon ul {display: inline-block; margin: 0 5%; text-align: left; width: 90%;}
.amenities-icon ul li {display: block; margin: 0 0 5px 0;}


.Disponibilidad {display:none;position:absolute;background:black;z-index:1000000;width:100%;height:100%;left:0px;top:0px;padding:0px;margin:0px;}
.servicio {background-color: #283360; border: 3px solid #FFF; border-radius: 10px; box-shadow: 0 0 10px #999; display: inline-block; margin: 10px 10px 0 10px; padding: 15px 0 0 0; vertical-align: top; width: 20%;}
.servicio:hover {border: 3px solid #FFF;}
.servicio a {background-color: #CCC; border-left: 2px solid #CCC; border-radius: 0 0 5px 0; color: #283360; display: inline-block; float: right; font-size: 12.5px; padding: 5px 25px; text-align: center;}
.servicio a:hover {background-color: #666;}
.servicio h4 {color: #FFF; display: block;}
.servicio img {margin: 10px 0; width: 100%;}
.servicio p {color:#FFF; margin: 0 5% 15px 5%; width: 90%;}
.servicio p sup {color:#FFF;}

.content_video{opacity: 0;}

.servicios {background-color: #FFF; background-image: url(../img/bg_clientes.jpg); background-position: bottom; background-repeat: repeat-x; border: 3px solid #999; border-radius: 25px 0 25px 0; box-shadow: 0 0 10px #999; display: inline-block; margin: 0 25% 25px 25%; padding: 20px 0; text-align: left; width: 50%;}
.servicios:hover {border: 3px solid #283360;}
.servicios a {display: block; text-align: right; margin-right: 35px;}
.servicios a:hover {color:red; cursor: pointer;}
.servicios a img {margin-right: 10px; height: 25px; vertical-align: middle;}
.servicios h2 {display: inline-block; margin: 0 0 10px 25px;}
.servicios hr {color: #999; margin-bottom: 10px;}
.servicios p {display: inline-block; margin-left: 50px;}
.servicios ul {display: inline-block; margin-left: 50px;}
.servicios ul li {margin: 0 0 5px 0;}

}