
body {
	font-family: 'Open Sans', sans-serif;
	color: #5f5f5f;
    font-size: 12px;
	background: #fff url(../img/bg_body.jpg) repeat;
}

.clear { clear: both; }
.hide {display: none;}
.centered {text-align: center;}
.lefted {text-align: left;}
.righted {text-align: right;}
.preloader{
	height: 85px;
	background: transparent url(../img/preloader.gif) no-repeat 50%;
	text-indent: -999px;
	overflow: hidden;
}

#wrapper{
	width: 979px;
	margin: 0 auto;
}

#header {
	font-size: 10px;
	background: transparent url(../img/bg_header.png) repeat-y;
}

#header div.col1, #header div.col2, #header div.col3 {
	float: left;
}

#header div.col1{
	margin: 48px 0 30px 33px;
}
/************ col2 ****************/
#header div.col2 {
	margin: 48px 0 0 120px;
	font-size: 11px;
	text-align: right;
}
#header div.col2 li {padding-right: 26px; position: relative; margin-bottom: 6px;}
#header div.col2 span.icon {
	text-align: left;
	display: block;
	overflow: hidden;
	text-indent: -999px;
	position: absolute;
	background-image: url(../img/icons.png);
	background-repeat: no-repeat;
	background-color: transparent;
}
#header div.col2 span.icon-direction{
	width: 14px;
	height: 25px;
	background-position: -18px -13px;
	top: 0px;
	right: 2px;
}
#header div.col2 span.icon-email{
	background-position: 0 -14px;
	width: 18px;
	height: 13px;
	top: 0px;
	right: 0px;
}
#header div.col2 span.icon-phone{
	background-position: 0 0;
	width: 18px;
	height: 14px;
	top: 0px;
	right: 0px;
}
#header div.col2 span.icon-fax{
	background-position: -18px 0px;
	width: 14px;
	height: 14px;
	top: 0px;
	right: 2px;
}
/************ col3 ****************/
#header div.col3 {
	float: right;
	margin: 20px 14px 0 0;
	text-align: center;
	font-size: 12px;
}
#header div.col3 a.btn-message{
	display: block;
	height: 45px;
	width: 201px;
	text-indent: -999px;
	overflow: hidden;
	background: transparent url(../img/btn_message.png) no-repeat 0 0;
}
#header div.col3 a.btn-message:active{
	/*background-position: 0 -45px;*/
	position: relative;
	top: 2px;
	height: 37px;
	margin-bottom: 8px;
}
#header div.col3 p {margin: 12px 0 6px 0;}
#header div.col3 li { float: left;}
#header div.col3 a {
	display: block;
	width: 23px;
	height: 23px;
	overflow: hidden;
	text-indent: -999px;
}
#header div.col3 a.twitter {
	background: transparent url(../img/icons.png) no-repeat 0 -112px;
	margin-left: 75px;
}
#header div.col3 a.facebook {
	background: transparent url(../img/icons.png) no-repeat 0 -135px;
	margin-left: 4px;
}
/************ footer ****************/
#footer {
	height: 66px;
	background: transparent url(../img/bg_footer.jpg) repeat-x;
	color: #fff;
	font-size: 10px;
	overflow: auto;
}

#footer p.copyright{
	text-transform: uppercase;
	margin: 25px 0 6px 40px;
}
#footer p.rif {
	float: left;
	font-size: 9px;
	text-transform: uppercase;
	margin-left: 50px;
}
#footer a {
	color: #fff;
	text-decoration: none;
	display: block;
	float: right;
	margin-right: 40px;
}
#footer a:hover {
	text-decoration: underline;	
}
/************ menu ****************/
#navigation {
	font-size: 12px;
	border: 1px solid #c3c3c3;
	margin: 11px 0;
	background: transparent url(../img/bg_nav.png) repeat-x;
}
#navigation a, #navigation span {
	text-decoration: none;
	color: #5f5f5f;
	text-transform: uppercase;
	height: 100%;
	display: block;
	padding: 0 16px;
}
#navigation a{
	transition: all .45s linear;
   -o-transition: all .45s linear;
   -moz-transition: all .45s linear;
   -webkit-transition: all .45s linear;
}
#navigation li.selected span, #navigation a:hover { 
	background-color: #069fe3;
	color:#fff;
}
#navigation li{
	float: left;
	border-right: 1px solid #c3c3c3;
	height: 45px;
	line-height: 45px;
}
/************ content ****************/
#content {
	border: 1px solid #c4c4c4;
}
#main-content, #sidebar { float:left; height: 100%;}
#main-content {
	width: 708px;
	border-right: 1px solid #c4c4c4;
}
#sidebar {
	width: 268px;
	margin-left: -1px;
	border-left: 1px solid #c4c4c4;
}
#content h3,#contact-dialog h3.title{
	background-color: #069fe3;
	font-size: 20px;
	font-weight: 700;
	color: #fff;
	padding: 5px 0 5px 18px;
}
#content p, #content ul {margin-bottom: 10px;}
#content div.section-placeholder{
	margin: 12px 18px 50px 18px;
}
#content a{
	color: #069fe3;
	text-decoration: none;
}
#content a:hover{text-decoration: underline;}
#content ul.list{ list-style: disc outside; margin-left: 20px;}
#content strong {color: #2b2b2b;}
#content a.btn-cotizacion{
	display: block;
	height: 46px;
	width: 204px;
	text-indent: -999px;
	overflow: hidden;
	background: transparent url(../img/btn_cotizacion.png) no-repeat 0 0;
}
#content a.btn-cotizacion:active{
	position: relative;
	top:2px;
	height: 39px;
}
#content div.btn-cotizacion-placeholder{
	margin: 30px 0 0 14px;
	height: 46px;
}
#twitter-proimpre li{
	float:left;
	border-left: 1px solid #069fe3;
	padding: 0 3px;
}
#twitter-proimpre li.first{border:none; padding-left: 0px;}
#twitter-proimpre li.last{padding-right: 0px;}
#twitter-proimpre div.tw-text {margin-bottom: 8px;}
#twitter-proimpre div.tw-links {margin-bottom: 16px;}

/*************** Page titles **********************/
#page-title{
	width: 980px;
	height: 123px;
	overflow: auto;
	background: transparent url(../img/bg_page_title.png) no-repeat;
}
#page-title h2 {
	margin-left: 115px;
	margin-top: 55px;
	color: #fff;
	overflow: hidden;
	text-indent: -999px;
	background-image: url(../img/titles.png);
	background-repeat: no-repeat;
}
#title-portafolio{ width: 110px; height: 44px; background-position: 0 -82px;}
#title-quienes-somos{ width: 188px; height: 40px; background-position: 0 -42px;}
#title-servicios{ width: 101px; height: 42px;background-position: 0 0;}
#title-tips-de-impresion{ width: 210px; height: 42px;background-position: 0 -168px;}
#title-cotizacion{ width: 116px; height: 42px;background-position: 0 -126px; }
/************* Home SlideShow ************************/
#home-slideshow{
	position: relative;
	width: 979px;
	height: 372px;
	overflow: hidden;
	color: #fff;
}
#home-slideshow div.container {
	position: absolute;
	background-image: url(../img/slideshow.png);
	width: 979px;
	height: 372px;
}
#home-slideshow div.preloader {
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -42px;
	margin-left: -42px;
	width: 85px;
}
#home-slideshow div.mask{
	position: absolute;
	top: 50%;
	margin-top: -132px;
	height: 273px;
	width: 2937px;
}
#home-slideshow div.stage{
	width: 735px;
	height: 100%;
	background-image: url(../img/slideshow.png);
	background-position: 0 -372px;
	overflow: hidden;
	position:absolute;
	left: 50%;
	margin-left: -363px;
}
#home-slideshow div.stage-wrapper{
	width: 979px;
	height: 273px;
	float: left;
	position: relative;
}
#home-slideshow div.text-wrapper{
	margin: 0 65px;
}
#home-slideshow p {margin-bottom: 10px;}
#home-slideshow h4.title {
	margin: 35px 0 10px 35px;
	height: 80px;
	overflow: hidden;
	text-indent: -999px;
	background-image: url(../img/slideshow.png);
}
#home-slideshow h4.impresion-offset-digital {
	width: 507px;
	background-position: -276px -723px;
}
#home-slideshow h4.gran-formato {
	width: 276px;
	background-position: 0 -725px;
}
#home-slideshow h4.disenio-grafico-disenio-web {
	width: 572px;
	background-position: 0 -645px;
}
#home-slideshow a.read-more{
	display: block;
	position: absolute;
	overflow: hidden;
	text-indent: -999px;
	background-image: url(../img/slideshow.png);
	background-position: -760px -386px;
	width: 77px;
	height: 27px;
	right: 44px;
	bottom: 23px;
}
#home-slideshow a.read-more:active{bottom: 21px;}
#home-slideshow a.navigator {
	position: absolute;
	display: block;
	text-indent: -999px;
	width: 50px;
	height: 50px;
	top: 50%;
	margin-top: -25px;
	z-index: 100;
	left: 75px;
}
#home-slideshow a.navigator:active{margin-top: -23px;}
#home-slideshow a.navigator span {
	display: block;
	overflow: hidden;
	background-image: url(../img/slideshow.png);
	background-position: -742px -423px;
	width: 11px;
	height: 16px;
	margin: 17px 0 0 19px;
}
#home-slideshow a.next {left: 862px;}
#home-slideshow a.next span{
	background-position: -753px -423px;
}
/******************* Contact Form ************************/
#contact-overlay {
	position: fixed;
	background: transparent url(../img/bg_contact_overlay.png) repeat;
	z-index: 99999;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
#contact-dialog{
	position: fixed;
	width: 380px;
	z-index: 999999;
}
#contact-dialog div.dialog-wrapper {
	background-color: #fff;
	border: 2px solid #cac2d1;
}
#contact-dialog div.form-wrapper {
	margin: 60px 16px 10px 16px;
	position: relative;
}
#contact-dialog label{
	display:block;
	margin-bottom: 8px;
	margin-left: 6px;
} 
#contact-dialog input, #contact-dialog textarea {
	background-color: #f4f4f4;
	border: 2px solid #fff;
	width: 340px;
	padding: 0px;
	clear: both;
}
#contact-dialog input{height: 35px; margin-bottom: 15px;}
#contact-dialog textarea{height: 160px;resize:none;padding: 5px 0px; margin-bottom: 8px;}
#contact-dialog input:focus, #contact-dialog textarea:focus{border-color: #069fe3;}
#contact-dialog h3.title {
	position: absolute;
	background-color: #069fe3;
	top: 8px;
	width: 362px;
}
#contact-dialog a.btn-enviar{
	background: transparent url(../img/btn_enviar.png) no-repeat;
	display: block;
	width: 77px;
	height: 27px;
	overflow: hidden;
	text-indent: -9999px;
	position: relative;
	left: 267px;
}
#contact-dialog a.btn-enviar:active{top: 2px;}
#contact-dialog a.btn-cerrar{
	position: absolute;
	width: 12px;
	height: 11px;
	display: block;
	background: transparent url(../img/btn_cerrar.png) no-repeat;
	overflow: hidden;
	text-indent: -9999px;
	top: 20px;
	right: 20px;
}
#contact-dialog a.btn-cerrar:active{top: 22px;}
#contact-dialog div.error-msg{float: right; color:red;}
/*#imgportafolio{margin:30px 0 50px 20px;}*/
/********************* Portafolio *****************************/
#imgportafolio li{
	width: 210px;
	height: 105px;
	overflow: hidden;
	float: left;
	margin: 0 0 10px 10px;
	position: relative;
}
#imgportafolio a{
	display: block;
	position: absolute;
	top: 0;
	left: 0;
}
#imgportafolio span{
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	background-color: #000;
	width: 210px;
	height: 105px;
	overflow: hidden;
	text-indent: -999px;
	filter: alpha(opacity = 50);
	opacity: 0.5;
	transition: opacity .45s linear;
   -o-transition: opacity .45s linear;
   -moz-transition: opacity .45s linear;
   -webkit-transition: opacity .45s linear;
}
#imgportafolio a:hover span{
	filter: alpha(opacity = 0);
	opacity: 0;
}
#close-yoxview{
	width: 12px;
	height: 11px;
	display: block;
	background: transparent url(../img/btn_cerrar.png) no-repeat;
	overflow: hidden;
	text-indent: -9999px;
}
