
/* basic styling and commonly used classes */
body, html, input, textarea {font-family:Arial, Helvetica, sans-serif;font-size:14px;color:#656565; overflow-x:hidden;}
p {font-size:14px;line-height:22px;padding:0 0 20px 0;}
strong {font-weight:bold;}
em {font-style:italic;font-family:"Times New Roman", Times, serif;}
.align-center {text-align:center;}
a, a:hover, a:focus {cursor:pointer;outline:none;}
blockquote {background:url(../images/blockquote.png) no-repeat left 8px;padding:0 0 0 55px;min-height:40px;}

.clear {clear:both;display:block;font-size:0;line-height:0;}
.float-left {float:left;}
.float-right {float:right;}

/* more relevant_classes *//* ================================================================= hippiechaka */
.safe_area { width: 1280px; margin: 0 auto; position: relative;}
.half_safe_area { width: 640px; margin: 0 auto; position: relative;}
.column_1_2 { width: 50% !important; overflow: hidden; }
.column_1_3 { width: 33%; overflow: hidden }
.column_1_4 { width: 25%; overflow: hidden }
.column_1_5 { width: 20%; overflow: hidden }
.column_4_5 { width: 80%; overflow: hidden }
.column_2_3 { width: 67%; overflow: hidden }
.column_3_4 { width: 75%; overflow: hidden }
.column_7_6 { width: 110%; overflow: hidden }
.column_3_5 { width: 60%; overflow: hidden }
.column_2_5 { width: 40%; overflow: hidden }
.column_1_6 { width: 16.66%; overflow: hidden }
.column_1_10 { width: 11%; overflow: hidden }
.column_5_6 { width: 83.3%; overflow: hidden }
.left, .floatL, .fLeft { float: left	}
.right, .floatR, .fRight { float: right } 
.padding { padding: 40px }
.no_border { border: 0!important }
.no_padding { padding: 0!important }
.no_margin { margin: 0!important }
.center { display: block; text-align: center }
.clear, .clearB, .cBoth { clear: both }
.bg_image { background-size: cover;	background-position: 50% 50%; background-repeat: none	}
.full_height { height: 100% }
.no_hidden { overflow: visible }
.hidden{ display: none }
.loading {	background: url(../images/loading.gif) no-repeat center;	}
.show_normal{ display:inherit}
.show_tablet{ display:none}
.show_cell  { display:none}
.text-right{ text-align: right}
.strong, .bold{ font-weight: bold;}
.whiteSpace{width:100%;min-height:20px;}
.clear.whiteSpace{min-height:80px;}
/* extra colors */
.cyan{color:#21a3ce;}
.darkBlue{color:#0a3b7e;}
.mainGreen{color:#4bc508;}
.white, .bco, .txtBco{color:#fff;}
/* colors by type */
.bordadoColor{color:#006cff;}
.personalizadosColor{color:#62106a;}
.serigrafiaColor{color:#47c007;}
.uniformesColor{color:#ff8600;}
/* background colors */
.bgCyan{background-color:#21a3ce;padding:20px 0;}
.bgCyan h4{padding:0;}
.bgDarkBlue{background-color:#0a3b7e;}
.bgMainGreen{background-color:#4bc508;}
.bgWhite, .bgBco, .bgTxtBco{background-color:#fff;}
/* MAP */
.fullMap{
    width:100%;
    max-height:355px;
    display:block;
    position:relative;
    top: 0px;
    /*margin: 20px auto;*/
}
#map_canvas{
    width:100%;
    height:325px;
    display:block;
    margin:0 auto auto 0;
}

.separadorMap{
    width:10px;
    height:110px;
    float:left;
    margin-right:10px;
    background:url(../images/mapa/separador.jpg) no-repeat;
}
.descripcionoculta{display:none;}
.imagenventanitahtml{
    width:85px;
    height:85px;
    float:left;
    margin-right:10px;
    margin-top:15px;
}
.textoventanitahtml{
    float:left;
    width:180px;
    font-size:12px;
}
.textoventanitahtml h3{
	color:#4bc508;
	text-align:left;
	margin-top:20px;
}
.textoventanitahtml p{
	text-align:left;
	padding-top:5px;
	color:#000;
	line-height:18px;
}

/* column system */
.float-left.haspadding {padding-right:20px;}
.column-160 {width:160px;}
.column-180 {width:180px;}
.column-220 {width:220px;}
.column-300 {width:300px;}
.column-380 {width:380px;}
.column-460 {width:460px;}
.column-540 {width:540px;}
.column-620 {width:620px;}
/* -- */
.set-size {width:980px;margin:0 auto;}
/* container elements */
#container .set-size {padding:120px 0 0 0;}
#container h1 {font-size:32px;padding:0 0 25px 0;line-height:32px;}
#container h2 {font-size:28px;padding:0 0 25px 0;line-height:28px;}
#container h3 {font-size:24px;padding:0 0 25px 0;line-height:24px;}
#container h4 {font-size:20px;padding:0 0 20px 0;line-height:20px;}
#container h5 {font-size:18px;padding:0 0 20px 0;line-height:18px;}
#container h6 {font-size:16px;padding:0 0 20px 0;line-height:16px;}
#container .pink {color:#e52e48;}

#container .btn {height:32px;padding:0 30px;line-height:32px;font-size:13px;display:inline-block;position:relative;cursor:pointer;}
#container .btn.rounded {border-radius:15px;-webkit-border-radius:15px;-moz-border-radius:15px;}
#container .btn.silver {background:url(../images/btn-silver.jpg) repeat-x 0 0;border:1px solid #cfcece;color:#656565;}
#container .btn.blue {background:url(../images/btn-blue.jpg) repeat-x 0 0;border:1px solid #45c4df;color:#0095c3;}
#container .btn:hover {background-position:0 -32px;}

#container .btn2 {height:32px;padding:0 12px;line-height:32px;font-size:12px;font-weight:bold;display:inline-block;position:relative;cursor:pointer; position: absolute; top:640px; left:948px;z-index:850;}
#container .btn2.rounded {border-radius:15px;-webkit-border-radius:15px;-moz-border-radius:15px;}
#container .btn2.silver {background:url(../images/btn-silver.jpg) repeat-x 0 0;border:1px solid #cfcece;color:#656565;}
#container .btn2:hover {background-position:0 -32px;}

#container #gonext {background:url(../images/gonext.png) no-repeat 0 0;width:30px;height:45px;cursor:pointer;position: absolute; top:600px; left:949px;z-index:850;}
#container #gonext:hover {background-position:0 -45px;}


/* -- */

/* top */
#top {height:100px;background:url(../images/menu_bg.gif)repeat-x;position:fixed;top:0;left:0;width:100%;z-index:800;}
#top .set-size {position:relative;}

#top h1#logo {float:left;width:180px;height:45px;position:relative;display:block;top:25px;left:0px;}
#top h1#logo a {background:url(../images/logo.png) no-repeat top left;width:180px;height:45px;display:block;text-indent:-9999px;}

#top #menu ul{float:right;padding:15px 40px 0 0;}
#top #menu ul li {padding:0 5px;float:left;display:block;width:140px;}
#top #menu ul li.disabled {display:none;}
#top #menu ul li a {width:140px;display:block;font-size:19px;font-weight:bold;height:100px;line-height:70px;padding:0px;display:block;float:left;color:#6f6f6f;cursor:pointer;text-align:center;}
#top #menu ul li a:hover, #top #menu ul li.current a {background:url(../images/hover_btn.png)no-repeat;padding:0px;height:100px;color:#fff;}
#top #menu .rounded {border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px;position:relative;}

#top #hire {background:url(../images/hire-me.png) no-repeat top left;width:31px;height:77px;position:absolute;top:0;right:0;display:block;cursor:pointer;}

.shadow {background:url(../images/top-shadow.png) repeat-x;height:35px;position:fixed;top:100px;width:100%;}
/* -- */

/* scroll navigation */
#nav {}
#nav ul {display:block;position:fixed;right:20px;width:11px;z-index:850;}
#nav ul li {display:block;padding:2px 0;line-height:11px;float:left;}
#nav ul li a {background:url(../images/nav-li-a.png) no-repeat 0 0;height:11px;width:11px;display:block;cursor:pointer;}
#nav ul li a:hover, #nav ul li.current a {background-position:0 -11px;}

/* -- */

/* section backgrounds */
.section, .px {min-height:860px;}
.section .set-size {position:relative;z-index:600;}
.overflow {position:relative;z-index:500;width:980px;margin:0 auto;min-height:860px;}
#contact .overflow, #contact .px, #contact {min-height:500px;}
#home {/*background:url(../images/bg_inicio.jpg)no-repeat top center #fe7e00;*/background-color:#f4f4f4;}
#about {background-color:#1b1b1b;}
#services {background:url(../images/services-bg.jpg) repeat top center;}/*home-bg.jpg*/
/*
#folio1 {background:url(../images/folio1-bg.jpg) no-repeat top center;}
#folio2 {background-color:#1b1b1b;}
#folio3 {background:url(../images/folio3-bg.jpg) no-repeat top center;}
#folio4 {background:url(../images/folio4-bg.jpg) no-repeat top center;}
#addons {background-color:#1b1b1b;}
*/
#gallery {background-color:#1b1b1b;}
#contact {background:url(../images/contact-bg.jpg) repeat top center;}
/* -- */

#container .section .header {padding:0 0 25px 0;}
#container .section .header h2 {color:#e52e48;padding:0 0 5px 0;}
#container .section .header em {font-size:12px;}
/* -- */

/* section media container */
.section .media {text-align:center;padding-bottom:80px ;background:url(../images/folio-media-shadow.png) no-repeat bottom center;}
/* --- */

/* welcome box on #home page */
#mainTxt{width:800px;height:276px;display:block;background:url(../images/main_txt.png)no-repeat;margin:0 auto;top:200px;position:relative;}
#home .welcome {}
#home .welcome h1 {display:block;font-size:70px;float:left;width:240px;}
#home .welcome h2 {display:block;float:left;width:720px;color:#e52e48;font-size:26px;line-height:26px;}


#home .addon {padding:450px 0 0 0;}
#home .addon p .btn {margin-top:10px;margin-left:20px;}
/* -- */

/* lists */
.list {}
.list li {line-height:26px;padding:0 0 0 15px;}
.list.blue li {background:url(../images/list-blue-li.png) no-repeat center left;}
.list.orange li {background:url(../images/list-orange-li.png) no-repeat center left;}
.list.red li {background:url(../images/list-red-li.png) no-repeat center left;}

.list-icons {}
.list-icons li {position:relative;padding:0 0 0 40px;}
.list-icons li img {float:left;position:absolute;top:0;left:0;}

.list-social {}
.list-social li {float:left;padding:0 5px 0 0;}
.list-social li a {height:33px;width:33px;display:block;float:left;}

.list-social li.twitter a {background:url(../images/redes_twitter.png)bottom center no-repeat;}
.list-social li.twitter a:hover {background-position:center center;}
.list-social li.twitter a:active {background-position:top center;}

.list-social li.gplus a {background:url(../images/redes_google_plus.png)bottom center no-repeat;}
.list-social li.gplus a:hover {background-position:center center;}
.list-social li.gplus a:active {background-position:top center;}

.list-social li.facebook a {background:url(../images/redes_facebook.png)bottom center no-repeat;}
.list-social li.facebook a:hover {background-position:center center;}
.list-social li.facebook a:active {background-position:top center;}

.list-social li.youtube a {background:url(../images/redes_youtube.png)bottom center no-repeat;}
.list-social li.youtube a:hover {background-position:center center;}
.list-social li.youtube a:active {background-position:top center;}

/* gallery */
.gallery li {float:left;margin:0 20px 25px 0;}
.gallery li:nth-child(4n), .gallery li.format {margin-right:0;}
.gallery li a {border:5px solid #fff;display:block;position:relative;float:left;}
.gallery li a span {background:url(../images/gallery-li-span.png) no-repeat top left;width:208px;height:123px;position:absolute;top:0;left:0;display:none;}
/* -- */

/* contact form */
#contact-form {position:relative;}
#contact-form .row {padding:5px 0;}
#contact-form .input-text {background:url(../images/form-contact-input-text.png) no-repeat top left;width:202px;height:37px;line-height:37px;padding:0 10px;color:#656565;}
#contact-form .input-textarea {background:url(../images/contact-form-textarea.png) no-repeat top left;width:522px;height:117px;padding:10px;resize:none;overflow:hidden;}
#contact-form .holder {position:relative;}
#contact-form .message {display:none;position:absolute;top:228px;left:115px;}
#contact-form .message .top {background:url(../images/message-top.png) no-repeat top left;width:428px;height:17px;line-height:0;}
#contact-form .message .content {background:url(../images/message-content.png) repeat-y;width:428px;padding:5px 0;}
#contact-form .message .bottom {background:url(../images/message-bottom.png) no-repeat top left;width:428px;height:14px;line-height:0;margin-left:-1px;}
#contact-form .message .arrow {background:url(../images/message-arrow.png) no-repeat top left;width:10px;height:18px;position:absolute;bottom:20px;left:-9px;z-index:2;}
#contact-form #alert {padding:0 20px;}
#contact-form #alert ul {padding:10px 0 0 0;}
#contact-form #alert ul li {line-height:18px;}
#contact-form .btn {font-weight:bold;}

#contenedorContacto{
	width:562px;
	height:520px;
	margin:auto;
	background: none;
	position: relative;
}

#contacto{
	width:460px;
	height:440px;
	min-height:320px;
	margin:0px auto;
	text-align:justify;
	z-index:99999;
}
#contacto>#enviado{display:none;}
#contacto>#enviado>div{width:100%; height:80px; display:block; clear:both;}
#contacto>#enviado>h1, #contacto>#enviado>h2{font-weight:300;}

#forma_envio{}
#forma_envio>div{height:45px; width:100%; text-align:center; padding-top:10px; margin:20px auto;}
#forma_envio>div>p{margin:0; padding:0;}
#forma_envio>form#forma_contacto>label>span.asterix{color:#ef9863;}


#activity{width:330px;margin:8px 0 7px 7px;float:right;}

.hSeparador{width:100%;height:10px;display:block;clear:both;}


#forma_contacto label{
	width:85px;
	text-align:right;
	padding:0;
	color:#600;
	font-size:13px;
	list-style:none;
	float:left;
	height: 30px;
	line-height: 30px;
}
#forma_contacto label.error{
	width: 320px;
	text-align: left;
	display:block;
	color:#94112d;
	float: right;
}
#forma_contacto input{
}
.campo-formulario, .text_input{
	width:320px;
	height:20px;
	text-align:left;
	padding:5px;
	color:#333;
	margin:0px;
	background-color:#fff;
	border:0px solid #099;
	border-radius:5px;
	float:right;
}
.campo-formulario2, .text_area{
	width:320px;
	height:110px;
	text-align:left;
	padding:5px;
	color:#333;
	margin:0px;
	background-color:#fff;
	border:0px solid #099;
	border-radius:5px;
	float: right;
}
.telefonos{
	font-size:16px;	
}
#grafico-mail{
	background:url(../images/contacto_img.png) no-repeat;
	width: 128px;
	height: 128px;
	display:block;
	position: absolute;
	top: 0px;
	left: -10px;
	z-index: 999;
}
#enviar_btn{
	background: #42b907;
	-webkit-border-radius: 5;
	-moz-border-radius: 5;
	border-radius: 5px;
	color: #ffffff;
	font-size: 17px;
	padding: 10px 20px 10px 20px;
	text-decoration: none;
	float: right;
	cursor: pointer;
	border:none !important;
}
#enviar_btn:hover{
	background: #0f588f;
	text-decoration: none;
   }
#enviar_btn:active{
   opacity: 0.7;
   }

#enviando{display:none;}
#baseData{background-color:rgba(0,0,0,0.1);width:calc(50% - 40px)!important;padding:40px 0 40px 40px;}
/* -- */

/* footer */
#footer {background:url(../images/footer_bg.jpg) repeat-x top;height:277px;position:relative;z-index:800;padding-top:40px;}
#footer #gotop {background:url(../images/ribbon-top.png) no-repeat top left;width:32px;height:68px;position:absolute;top:-64px;right:0;cursor:pointer;}
#footer .set-size {padding:30px 0;position:relative;}
#footer p {font-size:12px; color:#fff;text-align:center;}
/* -- */

/* parallax elements */
#home .pximage1 {background:url(../images/home-image1.png) no-repeat center left;width:398px;position:absolute;top:0;left:-20px;}
#home .pximage2 {background:url(../images/home-image2.png) no-repeat center left;width:372px;position:absolute;top:0;right:-20px;}
#home .pximage3 {background:url(../images/home-image3.png) no-repeat center left;width:190px;position:absolute;top:0;left:100px;z-index:3;}
#home .pximage4 {background:url(../images/home-image4.png) no-repeat center left;width:376px;position:absolute;top:0;left:210px;z-index:2;}
#home .pximage5 {background:url(../images/home-image5.png) no-repeat center left;width:460px;position:absolute;top:0;left:380px;z-index:1;}

#about .circles-holder {width:940px;}
#about .pxarrows {background:url(../images/about-arrows.png) no-repeat top left;width:562px;height:263px;position:absolute;top:0;left:217px;}
#about .circle {position:absolute;top:0px;}
#about .pxcircle1 {background:url(../images/about-circle1.png) no-repeat center left;width:256px;height:263px;left:0;}
#about .pxcircle2 {background:url(../images/about-circle2.png) no-repeat center left;width:247px;height:263px;left:256px;}
#about .pxcircle3 {background:url(../images/about-circle3.png) no-repeat center left;width:219px;height:263px;left:503px;}
#about .pxcircle4 {background:url(../images/about-circle4.png) no-repeat center left;width:231px;height:263px;left:764px;}
#about .pximage {position:absolute;top:0;right:0;background:url(../images/about-image.jpg) no-repeat top left;width:354px;height:176px;}

#gallery .pxphoto-left {background:url(../images/gallery-photo-left.png) no-repeat center left;width:368px;height:378px;position:absolute;top:0;left:-200px;}
#gallery .pxphoto-right {background:url(../images/gallery-photo-right.png) no-repeat top left;width:390px;height:417px;position:absolute;top:0;right:-100px;}

#contact .pxmyspace {background:url(../images/contact-myspace.png) no-repeat center left;width:117px;position:absolute;top:0;right:-40px;}
#contact .pxmail {background:url(../images/contact-mail.png) no-repeat center left;width:169px;position:absolute;top:0;right:-100px;}
#contact .pxbehance {background:url(../images/contact-behance.png) no-repeat center left;width:59px;position:absolute;top:0;right:20px;}
#contact .pxdribbble {background:url(../images/contact-dribbble.png) no-repeat center left;width:165px;position:absolute;top:0;right:30px;}
#contact .pxdelicious {background:url(../images/contact-delicious.png) no-repeat center left;width:64px;position:absolute;top:0;left:550px;}
#contact .pxbuzz {background:url(../images/contact-buzz.png) no-repeat center left;width:157px;position:absolute;top:0;left:450px;z-index:1;}
#contact .pxtwitter {background:url(../images/contact-twitter.png) no-repeat center left;width:244px;position:absolute;top:0;left:380px;z-index:2;}

#services .pxcircles {background:url(../images/services-circles.png) no-repeat center left;width:1234px;position:absolute;top:0;left:-450px;}
#services .pxcircle1 {background:url(../images/services-circle1.png) no-repeat center left;width:388px;position:absolute;top:0;left:0;}
#services .pxcircle2 {background:url(../images/services-circle2.png) no-repeat center left;width:288px;position:absolute;top:0;left:-10px;}
#services .pxcircle3 {background:url(../images/services-circle3.png) no-repeat center left;width:98px;position:absolute;top:0;left:200px;}
#services .pxbrush {background:url(../images/services-brush.png) no-repeat center left;width:122px;position:absolute;top:0;left:50px;}
#services .px3d {background:url(../images/services-3d.png) no-repeat center left;width:122px;position:absolute;top:0;left:150px;}
#services .pxidea {background:url(../images/services-idea.png) no-repeat center left;width:122px;position:absolute;top:0;left:100px;}
#services .pxtra {background:url(../images/services-xtra.png) no-repeat center left;width:122px;position:absolute;top:0;left:200px;}



#folio1 .pximage-left {background:url(../images/folio-ipad-b1.png) no-repeat center left;width:600px;position:absolute;top:0;left:-120px;z-index:2;}
#folio1 .pximage-right {background:url(../images/folio-iphone-w1.png) no-repeat center left;width:600px;position:absolute;top:0;left:200px;z-index:1;}

#folio2 .pximage-left {background:url(../images/folio-browsers-blur2.png) no-repeat center left;width:703px;position:absolute;top:0;right:-80px;z-index:1;}
#folio2 .pximage-right {background:url(../images/folio-browsers-blur1.png) no-repeat center left;width:703px;position:absolute;top:0;right:-80px;z-index:2;}

#folio3 .pximage-left {background:url(../images/folio-ipad-w1.png) no-repeat center left;width:600px;position:absolute;top:0;left:150px;z-index:2;}
#folio3 .pximage-right {background:url(../images/folio-iphone1.png) no-repeat center left;width:600px;position:absolute;top:0;left:-250px;z-index:1;}

#folio4 .pximage-left {background:url(../images/folio-movie2.png) no-repeat center left;width:512px;position:absolute;top:0;right:-150px;z-index:1;}
#folio4 .pximage-right {background:url(../images/folio-movie1.png) no-repeat center left;width:512px;position:absolute;top:0;right:150px;z-index:2;}
/* -- */

#clientes{
	opacity: 1;
    display: block;
    width: 100%;
    overflow: hidden;
}
#mainSlideshow{width:100%;height:auto;}
#mainSlideshow div.item{width:100%;}
/* #mainSlideshow div.item img{width:initial !important;} */
.owl-prev, .owl-next {
	content:'';
    position: absolute;
    /*top:calc(50% - 25px);*/
    top:50%;
    margin-top: -50px;
    width: 50px;
    height: 50px;
    text-align: center;
    font-size:60px;
    filter: Alpha(Opacity=50);/*IE7 fix*/
    opacity: 0.5;
}
.owl-prev:hover, .owl-next:hover {
    filter: Alpha(Opacity=100);/*IE7 fix*/
    opacity: 1;
}
.owl-next {
    right: 0px;
}
.owl-controls {
    text-align: center;
    /*background:#fff;*/
}
.owl-controls .owl-page {
    display: inline-block;
}
.owl-controls .owl-page span {
    background-color: #333;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    display: block;
    height: 12px;
    margin: 5px 7px;
    width: 12px;
    filter: Alpha(Opacity=500);/*IE7 fix*/
    opacity: 0.5;
}
.owl-controls .owl-page.active span, .owl-controls .owl-page:hover span {
    filter: Alpha(Opacity=100);/*IE7 fix*/
    opacity: 1;
}
.owl-dots{
	width: 100%;
    height: 40px;
    display: block;
    text-align:center;
    padding-top:10px;
    /*background:#fff;*/
}
.owl-dots .owl-dot{
	display:inline-block;
	width:16px;
	height:16px;
	border-radius:50%;
	background:rgba(0,0,0,0.3);
	margin:0 5px;
	border:2px solid rgba(0,0,0,0);
	opacity:0.7;
}
.owl-dots .owl-dot:hover{
	background:rgba(0,0,0,0.8);
}
.owl-dots .owl-dot.active{
	opacity:1;
	background:rgba(0,0,0,0.8);
	cursor:default;
}




