body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {margin:0;padding:0;}
table {border-collapse:collapse;border-spacing:0;}
fieldset,img {border:0;}
address,caption,cite,code,dfn,em,strong,th,var {font-style:normal;font-weight:normal;}
ol,ul {list-style:none;}
caption,th {text-align:left;}
h1,h2,h3,h4,h5,h6 {font-size:100%;font-weight:normal;}
q:before,q:after {content:'';}
abbr,acronym { border:0;}

body{ font:100% Arial, Helvetica, sans-serif; color:#000;}
h1, h2, h3, h4{ font-family: 'Ubuntu', sans-serif;}
a{ text-decoration:none;}
.container{width: 940px; margin:0 auto;}
.clear{clear: both; width:0; height:0; line-height:0; font-size:0;}

#header{ background-color: #000; overflow:hidden; padding-top:15px; max-height:504px;}
#header .container{ position:relative;}
#header .logo{position: absolute; top:10px; left:40px; z-index:1050;}
#header .social{ float:right;}
#header .social li{float: left; margin:0 0 0 10px;}
#header .social li a{ display:block; height:38px; width:38px; background:url(../images/spritesocial.png) no-repeat; text-indent:-9999px; outline:none;}
#header .social .email{ background-position:0 0;}
#header .social .email:hover{ background-position:0 -40px;}
#header .social .facebook{background-position:0 -80px;}
#header .social .facebook:hover{background-position:0 -120px;}
#header .nav{background:#0072ee url(../images/bkgnav.jpg) repeat-x; overflow:hidden;  padding:40px 0 40px 300px; box-shadow:0 3px 5px rgba(0,0,0,0.3);}
#header .nav li{ display:inline; margin:0 40px 0 0;}
#header .nav li:last-child{ margin-right:0;}
#header .nav li a{ color:#fff;font-size: 0.9em; text-transform:uppercase;font-family: 'Ubuntu', sans-serif; padding-bottom:5px;}
#header .nav li a:hover{ color:#063899; text-decoration:underline;}

.banner .next, .banner .prev{ display:block; width:61px; height:80px; background:url(../images/spritecarrusel.png) no-repeat; text-indent:-9999px; outline:none; position:absolute; top:120px; z-index:1000;}
.banner .prev{background-position:0 0; left:-2px;}
.banner .next{ background-position:0 -100px; right:0}
.bannermovil{ display:none;}
.bannermovil img{ width:100%; height:auto;}

#content{ padding:20px 0; overflow:hidden;}
#content .producto{ width:32%; float:left; margin:0 2% 0 0; position:relative;}
#content .producto:last-child{ margin-right:0;}
#content .producto .imgcontainer{ padding:10px; box-shadow:1px 1px 4px rgba(0,0,0,0.3); background: #fff; text-align:center; position:relative;}
#content .producto .imgcontainer:hover{opacity:0.5;}
#content .producto .imgcontainer .overlay{ background:rgba(0,0,0,0.3); position:absolute; top:0; left:0; width:100%; height:100%; display:none;}
#content .producto .imgcontainer:hover .overlay{ display:block;}
#content .producto h4{ color:#00aef0;  text-align:center; font-size:1.4em; margin:15px 0 0 0; border-bottom:double #00aef0;}

#videofeed{ background:#eee; padding:20px 0; overflow:hidden;}
#videofeed .video{ width:48%; float:left;}
#videofeed .video:last-child{ float:right;}
#videofeed .video img{ padding:10px; box-shadow:1px 1px 4px rgba(0,0,0,0.3); background: #fff;}
#videofeed .video .thumb{ float:left; width:40%;}
#videofeed .video .thumb img{ width:100%; height:auto;}
#videofeed .video .videoinfo{ float:right; width:50%;}
#videofeed .video .categoria{ font-size:0.7em;font-family: 'Ubuntu', sans-serif; }
#videofeed .video h3{ font-size:1.2em; margin:5px 0;}
#videofeed .video p{ font-size:0.8em;}
#videofeed .video a{ background:#ed008c; color:#fff; display:block; float:right; padding:5px 10px; font-size:0.8em;}
#videofeed .video a:hover{ background:#023d9b;}

#footer{ background:#dedede; padding:20px 0 0 0; overflow:hidden;}
#footer .col{ float:left; width:33%; font-family: 'Ubuntu', sans-serif; color:#646464;}
#footer .col h3{ margin:0 0 15px 0; color:#000;}
#footer .col.uno li{ background:url(../images/spritefooter.png) no-repeat; padding:10px 0 10px 40px; font-size:0.8em; margin:0 0 10px 0;}
#footer .col.uno li:hover{ color:#063899;}
#footer .col.uno .tel{ background-position:0 0;}
#footer .col.uno .cel{ background-position:0 -58px;}
#footer .col.uno .mail{ background-position:0 -114px;}
#footer .col.uno .tel:hover{ background-position:0 -157px;}
#footer .col.uno .cel:hover{ background-position:0 -215px;}
#footer .col.uno .mail:hover{ background-position:0 -271px;}
#footer .powered{background:#009ff0 url(../images/bkgpowered.jpg) repeat-x; text-align:right; font-size:0.8em; color:#fff; margin:30px 0 0 0; padding:5px 0;}
#footer .col.dos p:last-child{ font-size:0.9em; margin-top:10px;}
#footer .col.tres img{ margin:0 0 15px 0;}
#footer .powered p{ display:inline;}

#content .servicio{ float:left; width:48%;}
#content .infoservicio{ float:right; width:48%;}
#content h2{ font-size:1.3em;font-family: 'Ubuntu', sans-serif; margin:0 0 15px 0;}
#content p{ margin:0 0 10px 0; font-size:0.9em; color:#646464;}
#content li{ list-style:disc inside; margin:0 0 10px 0;color:#646464;font-size:0.9em;}
#content .fotos { overflow:hidden;}
#content .fotos .imgcontainer{ width:23%; margin:0 2% 2% 0; float:left;}
#content .fotos .last{ margin:0 0 2% 0;}
#content .fotos img{ padding:10px; box-shadow:1px 1px 4px rgba(0,0,0,0.3); background: #fff; width:90%; height:auto;}

/*responsive*/
@media only screen and (max-width: 940px) {
	.container{ width:98%;}
	.banner img{ width:100%; height:auto;}
	#header .logo{ position:static; width:150px; margin:10px auto -80px auto;}
	#header .logo img{ width:100%; height:auto;}
	#header .social{ position:absolute; top:10px; right:10px;}
	#header .nav{ padding:100px 20px 30px 20px; text-align:center;}
}
@media only screen and (max-width: 600px) {	
	#header .nav li{ margin-right:25px;}
	#content .producto{ width:60%; float:none; margin:0 auto 20px auto;}
	#content .producto img{ width:100%;}
	#content .producto:last-child{ margin-right:auto; }
	#videofeed .video{ width:100%; float:none;margin:0 0 20px 0; overflow:hidden;}
	#footer .col{ float:none; width:100%; text-align:center; margin:0 0 20px 0;}
	#content .servicio, #content .infoservicio{ float:none; width:100%;}
}
@media only screen and (max-width: 480px){
	#header .nav li{ display:block; text-align:center; margin:0 0 10px 0;}
	.banner{ display:none; margin:0 auto;}
	.bannermovil{ display:block;}
	#footer .col.uno li{ text-align:left;}
	#content .fotos .imgcontainer{ width:100%; margin:0 0 2% 0; float:none;}
}