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

/* DISEÑO Y DESARROLLO DE JORGE MIRANDA H. - Noviembre 2012 v1 */

* {padding:0; margin:0;}

img {border:0 none;}

a { text-decoration:none;}

html, body { height:100%;}

body { font-family:Helvetica, Arial, sans-serif; font-size:12px; color:#888; width:100%; }

#wrap { bottom: 0; left: 0; min-height: 100%;overflow: hidden; position: relative; right: 0; top: 0; width: 100%;}

.block {width:860px; margin:0 auto; overflow:hidden;}

#header { background:url(img_css/back_header.jpg) repeat-x; height:72px;}
#header .logo { text-indent:-9999px; width:166px; height:31px; background:url(img_css/logo.png) no-repeat; display:block; margin:17px 0 0 0; float:left; }
#header .menu { list-style: none; height:65px; line-height:65px; float:right; display:block;}
#header .menu .item_menu { float:left; margin:0 10px;}
#header .menu .item_menu a { color:#FFF; text-transform:uppercase; font-weight:bold; font-size:15px; display:block;}
#header .menu .item_menu:hover a {color:#008CC0;}
#header .menu .item_menu .on {background:url(img_css/punta_nav.jpg) no-repeat center bottom; color:#008CC0;}

.flexslider { width:960px; margin:0 auto !important; height:auto; overflow:hidden;}

#content {padding:45px; padding-bottom:245px; overflow:hidden;}
#content h1 {font-size:40px; color:#000; margin:0 0 45px 0; font-weight:lighter;}
#content h2 {font-size:25px; color:#000; margin:0 0 25px 0; font-weight:lighter;}
#content h3 {font-size:18px; color:#000; margin:0 0 45px 0; font-weight:lighter;}
#content p {font-size:14px; font-weight:lighter;}
#content ul { list-style-position:inside; margin:0 0 0 20px; font-size:14px; font-weight:lighter; color:#008CC0;}
#content ul li { line-height:180%;}
#content ul li span { color:#888;}

#content .block .clientesBlock { width:816px; margin:20px 0; overflow:hidden; border:2px dashed #f3f3f3; padding:20px;}
#content .block .clientesBlock img { width: 200px; float:left; margin:0 20px 0 0; height:auto; display:block;}
#content .block .clientesBlock span { width:580px; float:left; overflow: hidden;}
#content .block .clientesBlock span > h3 { margin:0;}


#power { padding:45px 0; background:url(img_css/back_power.jpg);}
#power .frasefuerza {font-size:40px; color:#000; margin:0 0 45px 0; font-weight:lighter;}
#power .block_power { width:31.5%; float:left; margin:0 0.9%;}
#power .block_power .icon { background:url(img_css/sprite.png) no-repeat; width:60px; height:60px; float:left; margin:0 10px 10px 0; display:block;}
#power .block_power .sistema {background-position: -10px -10px;}
#power .block_power .soporte {background-position: -80px -10px;}
#power .block_power .capacitacion {background-position: -150px -10px;}
#power .block_power h2 {color:#008CBF; font-weight:normal; text-transform:uppercase; font-size:20px;}
#power .block_power p {line-height:120%;}

#service { padding:45px 0; height:330px}
#service .block_service { width:20%; float:left; text-align:center; margin:0 1%; padding:1%; border:2px dashed #FFF;}
#service .block_service:hover { border-color:#f1f1f1;}
#service .block_service h2 {color:#000; font-weight:normal; text-transform:uppercase; font-size:16px; margin:0 0 15px 0;}
#service .block_service p { line-height:150%; margin:0 0 15px 0;}
#service .block_service .vermas { color:#008CBF; text-transform:uppercase;}

.clear:after { content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.clear { display: inline-block; }
html[xmlns] .clear { display: block;}
* html .clear { height: 1%;}
.wrapper { width:860px; margin:0 auto; padding: 50px 0px;}

#contactWrapper h1 { display:none;}
#contactWrapper label.error { display:block; float:none; font-size:12px; width:auto; font-weight: normal; margin-bottom: 0px; color: #bb3737; background: #fad6d6; border: 1px solid #bb3737; margin-top: 5px; padding: 5px 7px;}
#contactWrapper label.checked { display:none; background: none; border: 0px; margin-top: 0px; padding: 0px; text-indent: -5000px;}
#contactWrapper em { color: #008CC0;}
#contactWrapper .stage { margin-bottom: 20px;}
#contactWrapper .requiredNote { margin: 20px 0px 20px; color: #333; font-weight: bold;}
#contactWrapper .success { padding: 10px; background: #f0ffc1; border: 1px solid #819934; margin-bottom: 15px; color: #819934;}
#contactWrapper .success p { margin: 0px;}


#contactoBlock { }
#contactoBlock form {width:500px; height:470px; padding:20px; margin:0 auto; background:#FFF url(img_css/back_body.png);}
#contactoBlock form h2 { font-size:18px; font-weight:100; color:#444; margin:0 0 20px 0;}
#contactoBlock form p { width:100%; margin:0 0 10px 0; display:block;}
#contactoBlock form p label { font-size:14px; font-weight:100; display:block; margin:0 0 10px 0;}
#contactoBlock form p textarea { width:470px; height:100px; line-height:20px; padding:0 10px; border:1px solid #eee; border-top-color:#ccc; border-right-color:#CCC; border-radius:6px; font-size:13px; color:#ccc; resize:none;}
#contactoBlock form p input { width:470px; height:30px; line-height:30px; padding:0 10px; border:1px solid #eee; border-top-color:#ccc; border-right-color:#CCC; border-radius:6px; font-size:13px; color:#ccc;}
#contactoBlock form p input:focus,#contactoBlock form p textarea:focus {color:#333;}
#contactoBlock form p input[type=submit] { background:#00ADEF; border-radius:4px; color:#FFF; line-height:30px; text-align:center; margin:0 auto; width:110px; display:block; cursor:pointer; border-bottom:2px solid #0097D0;}
#contactoBlock form p input[type=submit]:hover { background-color:#F05A28;border-bottom:2px solid #B8421A;}
#contactoBlock form p input[type=submit]:active {border-bottom:1px solid #B8421A; margin:1px auto 0;}
#contactoBlock .close {text-indent:-9999px; top:-15px; right:-15px; width:30px; height:30px; cursor:pointer; background:url(img_css/close.png) no-repeat; position:absolute;}


#footer {  padding:45px 0; background:#008CC0; color:#FFF; border-bottom:3px solid #006C95; width:100%; height:110px; position:absolute; bottom:0; left:0;}
#footer .sitemap {width:25%; float:left;}
#footer .sitemap h3 { font-size:16px; font-weight:lighter; margin:0 0 10px 0;}
#footer .sitemap li { font-size:12px; font-weight:lighter; line-height:100%; margin:0 0 5px 0;}
#footer .sitemap li a {color:#FFF;}
#footer .sitemap li a:hover {border-bottom:1px dotted #fff;}
#footer .adress {width:25%; float:left;}
#footer .adress h3 {font-size:16px; font-weight:lighter; margin:0 0 10px 0;}
#footer .adress span {font-size:12px; font-weight:lighter; line-height:100%; margin:0 0 5px 0;}
#footer .email {width:25%; float:left;}
#footer .email h3 {font-size:16px; font-weight:lighter; margin:0 0 10px 0;}
#footer .rsocial {width:25%; float:left;}
#footer .rsocial h3 {font-size:16px; font-weight:lighter; margin:0 0 10px 0;}
#footer .rsocial a { background:url(img_css/sprite.png) no-repeat; display:block; width:28px; height:23px; text-indent:-9999px; float:left; margin:0 5px 0 0;}
#footer .rsocial a.fbk {background-position:-234px -10px;}
#footer .rsocial a.fbk:hover {background-position:-234px -38px;}
#footer .rsocial a.tw {background-position:-262px -10px;}
#footer .rsocial a.tw:hover {background-position:-262px -38px;}
#footer .rsocial a.lkn {background-position:-297px -10px;}
#footer .rsocial a.lkn:hover {background-position:-297px -38px;}
#footer .firma {display:block; float:right; width:271px; margin:23px 0 0 0;}
#footer .firma span { float:left; display:block; margin:0 0 0 10px; line-height:23px;}
#footer .firma .logofirma {width:103px; height:19px; background:url(img_css/sprite.png) no-repeat -351px -10px; display:block; text-indent:-9999px;}
#footer .firma .logofirma:hover {background-position:-351px -38px;}