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

@import url(http://fonts.googleapis.com/css?family=Roboto:500,300,700,400);

*, html { white-space: normal; }
*, *:before, *:after { box-sizing: border-box; }
body { font-family: 'FiraSans-Light', 'arial', 'Tahoma'; overflow-x: hidden; margin: 0; padding: 0; text-rendering: optimizeLegibility; background:none;}
body.index {  }

/* Containers */

.container { width: 100%; height: 100%; position: relative; top: 0; left: 0; }
.col-6 { float: left; margin-right: 4%; width: 48%; }
article { width: 100%; max-width: 900px; display: table; margin: 0 auto; }
section { display: table; max-width: 1260px; width: 100%; height: auto; margin: 40px auto 0; } 
section p { font-size: 14px; font-weight: 400; line-height: 1.5em; color: #000; }

/* Header */

header { position: relative; display: table; max-width: 900px; width: 100%; height: 120px; margin: 0 auto; }

/* Logo */

img.logo { position: relative; top: 45px; opacity: 1; }
img.logo:hover { opacity: .5; } 

/* Language */

ul.lang { position: absolute; top: 45px; right: 13px; text-transform: uppercase; font-size: 12px; }
ul.lang li { float: left; border-right: 1px dotted #ccc; padding: 0 3px; }
ul.lang .active { color: #000; }
section.intro ul.lang { position: relative; display: table; margin: 0 auto; top: 60px; }
.langselect { margin: 120px 0 0; }

/* Navigation Main */

nav.main { position: relative; float: right; top: 47px; z-index: 99; }
nav.main ul { text-transform: none; font-size: 14px; font-family: 'FiraSans-Book'; }
nav.main ul li { float: left; padding: 0 12px; }
nav.main a { color: #000; } nav.main a:hover { color: #999; }
nav.main .active { color: #000; border-bottom: 1px dotted; }
button.toggle { display: none; position: absolute; opacity: .4; right: 0; top: 40px; background: none; border: none; max-width: 40px; width: 100%; z-index: 99; }
button.toggle img { width: 100%; }

/* Intro */

body.index .container { position: absolute; }
section.intro { position: relative; text-align: center; padding: 60px 0; margin: 0 auto; height: 100%; width: 100%; max-width: 900px; }
section.intro img { width: auto; max-width: 100%; opacity: 1; z-index: 9999; position: relative; }
section.intro img:hover { opacity: .5; }
section.intro table { display: table; width: 100%; height: 100%; margin: 0; padding: 0; border-spacing: 0; border-collapse: collapse; }
section.intro tbody { width: 100%; height: 99%; margin: 0; padding: 0; border-spacing: 0; border-collapse: collapse; }


/* About */

section.about article { margin: 30px auto 0; }
section.about article .profile { float: left; margin-right: 30px; }
section.about article p { margin: 0; font-size: 16px; }
section.about .sign { clear: both; margin: 30px 0 0; float:right}

/* Home */

section.home {  }
section.home article p { font-size: 16px; }
section.home article .destacado-home {margin-top:-10px; font-size: 22px;font-weight:300 }

.lang a, .lang{color:#ccc !important;margin-left: 5px !important; padding:0 !important}
.lang a:hover{color:black !important}
.hand-draw { width: 100%; text-align: center; margin: 0 0 60px; }
.hand-draw img { width: 100%; max-width: 338px; }
section.home article .hand-draw p.pie-foto { font-size: 13px }

/* Clients */

section.clients { max-width: 890px; }
section.clients article p, section.contact article p { font-size: 14px; }
/* Client List */
ul.clients { width: 100%; display: table; color: #000; font-size: 14px; line-height: 1.6em; font-weight: 400 }
ul.links { width: 100%}
ul.clients li { float: left; width: 31.3%; margin: 0 3% 0 0; padding: 0; height: auto; }
ul.links li { float: left; width: 45%; margin: 0 3% 0 0; padding: 0; height: auto;}
ul.clients p.title { text-transform: uppercase; font-weight: 500; margin: 30px 0 15px; }
ul.clients span.title { display: none; font-weight: 400; font-size: 85%; margin: 6px 0 -2px; }
ul.links li a { color:black}
ul.links li a:hover { color:#999}


/* Contact */

section.contact article p { line-height: 1.3em; }
section.contact { margin: 120px auto 0; }
section.contact article p {
	font-size: 18px;
}
section.contact article .img { float: right; }
section.contact .credits { float: left; margin: 60px 0 0; color: #999; font-size: 13px; text-transform: uppercase; display: none; }
section.contact .credits:hover { color: #000; }
section.contact a { border-bottom: 1px dotted #999; }

/* Projects */

section.projects { margin-top: 40px; }
section.project-mobile { display: none;  }
section.project-mobile img.lito { width: 80%; }
section.project-mobile div { margin: 0 0 50px; padding: 0 0 50px; border-bottom: 1px dotted #ccc; }
section.project-mobile div.caption {  border: none; margin: 30px 0 0; padding: 0; }
section.project-mobile div.caption p { line-height: 1.4em; font-size: 13px; } 
article.col-3 { float: left; width: 32%; margin: 40px 2% 0 0; }
article.col-3-wide { float: left; width: 60%; margin: 40px 2% 0 0; }

article.col-6 {
	float: left;
	width: 48%;
	margin: 0 3% 0 0;
	font-size: 24px;
}


/* RoyalSlider */
.rsDefault .rsArrow { display: none !important; }
body .rsOverflow { }
body .rsContent.caption p { font-size: 14px; line-height: 1.5em; margin: 40px 0 0; text-align: center; }
body .royalSlider .rsImg { max-width: 100%; max-height: 420px; width: auto; display: table; margin: 0 auto; }
body .rsContainer { padding: 60px 0 0; }
body .royalSlider.rsDefault .rsArrowIcn { background-color: rgba(0,0,0,0.1); top: auto; bottom: 0; }
body .royalSlider.rsDefault .rsArrow { width: 150px !important;  }
body .royalSlider.rsDefault.rsHor .rsArrowRight { right: 40%; }
body .royalSlider.rsDefault.rsHor .rsArrowLeft { left: 40%; }
body .royalSlider .rsHidden { opacity: 1; visibility: visible; }


body.index .royalSlider { margin: 50px 0 0; }
body.index .rsContent.caption p { font-size: 21px; line-height: 1.3em; margin: 40px 0 0; }
body.index .royalSlider, body.index .royalSlider .rsContainer { max-width: 900px; }
body.index .royalSlider .rsImg { max-width: 100% !important; width: 100% !important; }

body.index .royalSlider .rsOverflow { display: table; overflow: hidden !important; text-align: center;  width: 100% !important; } /* Hace responsive el slider */

/* Bullets */
body .rsDefault .rsNav.rsBullets { line-height: normal; opacity: 1; width: 166px; left: 50%; margin: 0 0 0 -83px; top: -60px; }
body .rsDefault .rsBullet { padding: 0; margin: 0 7px 0 0; cursor: pointer;  }
body .rsDefault .rsBullet span { background: #fff; height: 9px; width: 9px; }
body .rsDefault .rsBullet.rsNavSelected span { background: #666; }

/* Foot image text */
p.foot-img { font-style: italic; text-align: center; font-size: 11px; margin: 8px 0 0; }


/* Styles */

.strongr { font-size: 18px !important}

a { color: #999; text-decoration: none; }
a:hover { color: #000; }
a, a:hover, a:focus, a:active, a:visited, a:link, button { outline: none; background: none; border: none; cursor: pointer; }
ul { margin: 0; padding: 0; }
ul li { list-style: none; }
b, strong { font-weight: 400; font-family: 'FiraSans-Book'; }

span.black { color: #000; }

.center { text-align: center; }
.unright { margin-right: 0 !important; padding-right: 0 !important; }
.unborder { border: none !important; }

/* Transitions */
a, img { -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear; transition: all 0.2s linear;  }

/* Custom Layout */

@media (max-width: 1280px) {
	
	header, section { width: 92%; } 
	
}


@media (max-width: 1024px) {
	
	
	section {  }
	.es section { }
	section.contact { margin: 80px auto 0 !important; }
	body .rsContent.caption p { margin: 40px 0 0; font-size: 13px; }
	
	body .royalSlider.rsDefault.rsHor .rsArrowRight { right: 35%; }
	body .royalSlider.rsDefault.rsHor .rsArrowLeft { left: 35%; }
	
	section.intro { padding: 20px 0; }
	p.langselect { margin: 40px 0 0; }
	body.index .royalSlider { margin: 30px 0 0; }
	
}

@media (max-width: 900px) {
	
	button.toggle { display: block; }
	nav.main { display: none; position: absolute; float: none; width: 100%; background: rgba(255,255,255,0.97); text-align: center; top: 100px; margin: 0 0 20px; }	
	nav.main ul { width: 100%; padding:  0; font-size: 15px; border-top: 1px solid #000; border-bottom: 1px solid #999; }
	nav.main ul li { float: none; padding: 18px 0; border-bottom: 1px dotted #ddd; }
	
	section.about article .profile { float: none; display: table; max-width: 100%; width: auto; margin: 0 auto; }
	section.about article .sign { display: table; margin: 40px auto; }
	
	.contact .col-6 { float: left; clear: none; width: 48%; margin: 0 4% 0 0; }
	.col-6 { float: none; clear: both; width: 100%; margin: 0; }
	
}

@media (max-width: 768px) {
	
	
	
	img.logo { float: none; display: table;  }
	
	
	section { padding: 0 0 80px; margin: 0 auto; }
	section.contact { margin: 120px auto 0; }
	section.contact .credits {  margin: 0 auto 0; padding: 120px 0 0; display: table; float: none; }

	section.about {  }
	section.about article p { clear: both; }
	
	
	
	section.home { }
	article.col-3 { float: none; width: 100%; }
	
	section.projects { display: none; }
	section.project-mobile { display: block; }
	p.foot-img { text-align: left; }
	
	section.clients p.title { display: none; }
	ul.clients { margin: 0 0 30px; }
	ul.clients span.title { display: block; }
	ul.clients li { float: none; margin: 0; width: 100%; }
	
	.royalSlider.rsDefault .rsArrow { width: 44px !important; }
	.rsContent.caption { text-align: center; }
	.rsContent.caption p { margin: 120px auto; }
	body .rsDefault .rsBullets { position: relative; width: 100%; bottom: auto !important; right: auto !important; margin: 50px auto;  }
	.hand-draw{float:none;width:100%;margin-top:30px}
	p.pie-foto{width:100%; text-align:center}
	
}

@media (max-width: 600px) {
	
	body.index .rsContent.caption p { padding: 0 30px; }
	section.intro img {  }
	
	section.contact { margin: 30px auto 0 !important; }
}

@media (max-width: 480px) {
	
	.logo { max-width: 180px; }
	
	.langselect { margin: 60px 0 0; }
	section.intro img { max-width: 200px; width: 100%; }
	
	section.about article .profile { width: 100%; }
	section.about article { margin: 0 auto; }
	
	.contact .col-6 { float: none; clear: both; width: 100%; margin: 0; }
	.col-6 { float: none; clear: both; width: 100%; margin: 0; }
	
	article.col-6 { float: none; width: 100%; text-align: center; }
	section.contact article .img { float: none; margin:  0 0 30px; }
	.hand-draw{margin:0 auto}
	
}
#cboxContent {

  text-align: left !important;

}
#cboxTitle {
  bottom: 0 !important;
}