@import url(https://fonts.googleapis.com/css?family=Jockey+One);
@import url(https://fonts.googleapis.com/css?family=Open+Sans);
h1, h2, h3 { font-family: 'Jockey One', sans-serif; font-weight:normal;}
h1 { font-size: 300%;}
h2 { font-size: 170%;}
h3 { font-size: 150%;}
#title ul.lang { dispaly: block; margin: 0; margin-bottom: 2%; padding: 0; width:100%; background: none; border: 0; text-align: right;}
#title ul.lang h3 { padding: 0; margin: 0; font-size: 140%;}
#title ul.lang > li.lang { display: inline; text-decoration: none; cursor: pointer; color:#999999; padding: 0; margin: 0; padding-left: 0.55%; padding-right: 0.55%; background: none; border: 0; float: right; }
#title ul.lang > li.lang:hover { display: inline; text-decoration: none; color:#f0f0f0; padding: 0; margin: 0; padding-left: 0.55%; padding-right: 0.55%; background: none; border: 0; float: right; }
#title ul.lang > li.lang-selected { display: inline; text-decoration: none; cursor: pointer; color:#d0d0d0; padding: 0; margin: 0; padding-left: 0.55%; padding-right: 0.55%; background: none; border: 0; float: right; }
#title div.image { width: 18.33%; padding: 0; margin: 0; margin-left: 12%; float: left; clear: left; text-align: left; }
#title div.name { width: 57.67%; padding: 0; padding-top: 0%; margin: 0; margin-right: 12%; float: right; clear: right; text-align: right; }
#title div.name > h1 { padding:0; margin:0; padding-top: 2%; color: #f0f0f0; }
#title ul.menu { display: block; text-decoration: none; margin: 0; clear: both; float: none; 
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#333333), to(#111111));
	background: -webkit-linear-gradient(top, #333333, #111111);
	background: -moz-linear-gradient(top, #333333, #111111);
	background: -ms-linear-gradient(top, #333333, #111111);
	background: -o-linear-gradient(top, #333333, #111111);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#333333', endColorstr='#111111');
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#333333', endColorstr='#111111')";
}
#title ul.menu li { display: block; text-decoration: none; color: #f0f0f0; float: left; cursor: pointer;
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#333333), to(#111111));
	background: -webkit-linear-gradient(top, #333333, #111111);
	background: -moz-linear-gradient(top, #333333, #111111);
	background: -ms-linear-gradient(top, #333333, #111111);
	background: -o-linear-gradient(top, #333333, #111111);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#333333', endColorstr='#111111');
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#333333', endColorstr='#111111')";
}
#title ul.menu li > h2 { margin: 0; padding: 0; cursor: pointer; }
#title ul.menu li.selected { display: block; text-decoration: none; color: #f0f0f0; float: left; 
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#006600), to(#009900));
	background: -webkit-linear-gradient(top, #006600, #009900);
	background: -moz-linear-gradient(top, #006600, #009900);
	background: -ms-linear-gradient(top, #006600, #009900);
	background: -o-linear-gradient(top, #006600, #009900);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#006600', endColorstr='#009900');
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#006600', endColorstr='#009900')";
}
#title ul.menu li:hover { display: block; text-decoration: none; color: #f0f0f0; float: left; 
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#006600), to(#009900));
	background: -webkit-linear-gradient(top, #006600, #009900);
	background: -moz-linear-gradient(top, #006600, #009900);
	background: -ms-linear-gradient(top, #006600, #009900);
	background: -o-linear-gradient(top, #006600, #009900);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#006600', endColorstr='#009900');
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#006600', endColorstr='#009900')";
}
#separador { width: 100%; height: 10px; margin: 0; padding: 0; float: none; clear: both;
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#545352), to(#f6f7f8));
	background: -webkit-linear-gradient(top, #545352, #f6f7f8);
	background: -moz-linear-gradient(top, #545352, #f6f7f8);
	background: -ms-linear-gradient(top, #545352, #f6f7f8);
	background: -o-linear-gradient(top, #545352, #f6f7f8);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#545352', endColorstr='#f6f7f8');
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#545352', endColorstr='#f6f7f8')";
}
#slide-container { width: 100%; margin 0; padding: 0; float: none; clear: both; }
#slide-container > div.page { background-color: #111111; }
#slide-container .page > div.slide { display: none; width: 100%; height: 16em; background-color: #111111; font-family: 'Open Sans', sans-serif; font-size: 120%; color: #dedede; text-align: justify; }
#slide-container .page > div.slide:first-child { display: block; width: 100%; height: 16em; background-color: #111111; font-family: 'Open Sans', sans-serif; font-size: 120%; color: #dedede; text-align: justify; }
#slide-container .page > div.slide > img { margin: 0; padding: 0; height: 15.8em; float: left; }
#slide-container .page > div.slide > div { margin: 0; padding: 0; height: 15.8em; width: 20em; float: left; }
#slide-container .page > div.slide > div > h1 { padding: 0.4em; padding-bottom: 0; padding-top: 0.1em; margin: 0; font-size: 250%; }
#slide-container .page > div.slide > div > p { padding: 1em; padding-top: 0; margin: 0; text-align: justify; }
#slide-container .page > ul.slide { display: block; text-decoration: none; margin: 0; margin-bottom: 2em; padding: 0; float: none; clear: both; width: 100%; height: 2em; background-color: #111111; 
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#111111), to(#333333));
	background: -webkit-linear-gradient(top, #111111, #333333);
	background: -moz-linear-gradient(top, #111111, #333333);
	background: -ms-linear-gradient(top, #111111, #333333);
	background: -o-linear-gradient(top, #111111, #333333);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#111111', endColorstr='#333333');
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#111111', endColorstr='#333333')";
}
#slide-container .page > ul.slide li { display: block; text-decoration: none; padding: 0; height: 2em; color: #f0f0f0; float: right; cursor: pointer; padding-left: 1.9em; padding-right: 1.9em;
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#111111), to(#333333));
	background: -webkit-linear-gradient(top, #111111, #333333);
	background: -moz-linear-gradient(top, #111111, #333333);
	background: -ms-linear-gradient(top, #111111, #333333);
	background: -o-linear-gradient(top, #111111, #333333);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#111111', endColorstr='#333333');
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#111111', endColorstr='#333333')";
}
#slide-container .page > ul.slide li > h3 { margin: 0; padding: 0; cursor: pointer; }
#slide-container .page > ul.slide li.selected { display: block; text-decoration: none; padding: 0; height: 2em; color: #f0f0f0; float: right; padding-left: 1.9em; padding-right: 1.9em;
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#993300), to(#660000));
	background: -webkit-linear-gradient(top, #993300, #660000);
	background: -moz-linear-gradient(top, #993300, #660000);
	background: -ms-linear-gradient(top, #993300, #660000);
	background: -o-linear-gradient(top, #993300, #660000);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#993300', endColorstr='#660000');
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#993300', endColorstr='#660000')";
}
#slide-container .page > ul.slide li:hover { display: block; text-decoration: none; padding: 0; height: 2em; color: #f0f0f0; float: right; padding-left: 1.9em; padding-right: 1.9em;
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#993300), to(#660000));
	background: -webkit-linear-gradient(top, #993300, #660000);
	background: -moz-linear-gradient(top, #993300, #660000);
	background: -ms-linear-gradient(top, #993300, #660000);
	background: -o-linear-gradient(top, #993300, #660000);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#993300', endColorstr='#660000');
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#993300', endColorstr='#660000')";
}
#content { width: 100%; margin 0; padding: 0; float: none; clear: both; font-family: 'Open Sans', sans-serif; font-size: 100%;  }
#content .page h1 { margin:0; margin-bottom: 0.5em; padding: 0; color: #606060; }
#content .page h3 { margin:0; margin-bottom: 0.5em; padding: 0; color: #111111; text-align: justify; }
#content .page .line { margin: 0; padding: 0; float: none; clear: both; }
#content .page p { margin:0; margin-bottom: 0.5em; padding: 0; color: #111111; font-family: 'Open Sans', sans-serif; font-size: 140%; text-align: justify; }
#content .page .punt { width: 4em; height: 4em; float: left; clear: left; background-color: #006600;
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#660000), to(#993300));
	background: -webkit-linear-gradient(top, #660000, #993300);
	background: -moz-linear-gradient(top, #660000, #993300);
	background: -ms-linear-gradient(top, #660000, #993300);
	background: -o-linear-gradient(top, #660000, #993300);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#660000', endColorstr='#993300');
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#660000', endColorstr='#993300')";
}
#content .page .punt > h1 { color: #f0f0f0; text-align: center; margin: 0; padding: 0; }
#content .page .punt-text { width: 34em; padding: 0; margin: 0; padding-left: 2em; float: left; clear: right; }
#content .page .punt-text > h1 { color: #505050; font-family: 'Open Sans', sans-serif; font-size: 200%; }
#content .page > div.line > h3 { padding-left: 4em; }
#content .page > div.line > p { padding-bottom: 0.5em; }
#content .page > div.line > p:first-child { padding-bottom: 2em; }
#content .page > div.col:first-child > div.line > div.punt-text { width: 32em; padding: 0; margin: 0; padding-left: 2em; float: left; clear: right; }
#content .page > div.col:first-child > div.line > h3 { padding-left: 4em; }
#content .page > div.col:first-child > div.line > p { padding-bottom: 0.5em; }
#content .page > div.col:first-child > div.line > p:first-child { padding-bottom: 2em; }
#content .page > div.col { margin: 0; padding: 0; float: left; }
#content .page > div.col .punt-text { width: 18em; padding: 0; margin: 0; padding-left: 2em; float: left; clear: right; }
#content .page > div.col:last-child .punt {  
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#006600), to(#009900));
	background: -webkit-linear-gradient(top, #006600, #009900);
	background: -moz-linear-gradient(top, #006600, #009900);
	background: -ms-linear-gradient(top, #006600, #009900);
	background: -o-linear-gradient(top, #006600, #009900);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#006600', endColorstr='#009900');
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#006600', endColorstr='#009900')";
}
#content .page > div.col:last-child > div.line > p {margin-bottom: 1em;}
@media screen and (max-width: 700px) {
	body { margin: 0; padding: 0; background-color: #f6f7f8; max-width: 100%; min-width: 40em; height: 100%; font-size: 8px;}
	.page { width: 40em; margin: 0; padding: 0; margin-left:auto; margin-right:auto; float: none; clear: both; }
	#title > .page > ul.lang h3 { font-size: 170%; }
	#title { margin 0; padding: 0; width: 100%; height: 29em; border-top: solid 1px #434241; border-bottom: solid 1px #434241; background-color: #545352;}
	#title div.image { width: 40em; height: 15em; float: none; clear: both; text-align: center; margin: 0; padding: 0; }
	#title div.image > img { width: 30em; height: 15em; float: none; }
	#title div.name { width: 40em; margin: 0; padding: 0; height: 15em; float: none; clear: both; text-align: center; }
	#title div.name > h1 { margin 0; padding: 0; text-align: center; }
	#title ul.menu  { height: 5em;  border-bottom: solid 2px #009900; width: 100%; margin: 0; padding: 0; padding-left: 0px; background: none; background-color: #333333; margin-top: -10em; }
	#title ul.menu li { height: 2.5em; border-left: solid 2px #333333; margin: 0; padding: 0; padding-left: 1.3em; padding-right: 1.3em; }
	#title ul.menu li:first-child {  margin-left: 0em; }
	#title ul.menu li.selected:first-child {  margin-left: 0em; }
	#title ul.menu li:hover:first-child {  margin-left: 0em; }
	#title ul.menu li:nth-child(5) {  margin-left: 0em; }
	#title ul.menu li.selected:nth-child(5) {  margin-left: 0em; }
	#title ul.menu li:hover:nth-child(5) {  margin-left: 0em; }
	#title ul.menu li.selected { margin: 0; padding: 0; padding-left: 1.3em; padding-right: 1.3em; }
	#title ul.menu li:hover { margin: 0; padding: 0; padding-left: 1.3em; padding-right: 1.3em; }
	#separador { height: 7.77px; }
	#slide-container .page > div.slide { width: 100%; display: none; height: 27em; padding: 0; margin: 0; }
	#slide-container .page > div.slide:first-child { width: 100%; display: block; height: 27em; padding: 0; margin: 0; }
	#slide-container .page > div.slide > img { width: 50%; }
	#slide-container .page > div.slide > div { width: 100%; float: none; clear: both; }
	#slide-container .page > ul.slide { margin: 0; padding: 0; width: 100%; border-top: solid 2px #993300; }
	#slide-container .page > ul.slide li { margin: 0; border-left: solid 2px #333333; }
	#slide-container .page > ul.slide li:hover { margin: 0; border-left: solid 2px #333333; }
	#slide-container .page > ul.slide li:first-child { margin-left: 0em; }
	#slide-container .page > ul.slide li:last-child { border-right: solid 2px #333333; }
	#slide-container .page > ul.slide li.selected { margin: 0; border-left: solid 2px #333333; }
	#content .page > div.col { margin: 0; padding: 0; padding-left: 1em; padding-right: 1em; float: none; clear: both; width: 38em; margin-top: 1.5em; }
}
@media screen and (min-width: 700px) and (max-width: 900px) {
	body { margin: 0; padding: 0; background-color: #f6f7f8; width: 100%; height: 100%; font-size: 9.33px;}
	.page { width: 700px; margin: 0; padding: 0; margin-left:auto; margin-right:auto; float: none; clear: both; }
	#title { margin 0; padding: 0; width: 100%; height: 140px; border-top: solid 1px #434241; border-bottom: solid 1px #434241; background-color: #545352;}
	#title div.image > img { width: 128px; height: 64.4px; }
	#title ul.menu  { height: 23.33px;  border-bottom: solid 2px #009900; width: 700px; padding: 0; padding-left: 0px; }
	#title ul.menu li { height: 23.33px; border-left: solid 2px #333333; margin: 0; padding: 0; padding-left: 1.3em; padding-right: 1.3em; }
	#title ul.menu li:last-child { border-right: solid 2px #333333; }
	#title ul.menu li.selected { padding: 0; padding-left: 1.3em; padding-right: 1.3em; }
	#title ul.menu li:hover { padding: 0; padding-left: 1.3em; padding-right: 1.3em; }
	#separador { height: 7.77px; }
	#slide-container .page > ul.slide { border-top: solid 2px #993300; }
	#slide-container .page > ul.slide li { margin: 0; border-left: solid 2px #333333; }
	#slide-container .page > ul.slide li:hover { margin: 0; border-left: solid 2px #333333; }
	#slide-container .page > ul.slide li:first-child { border-right: solid 2px #333333; }
	#slide-container .page > ul.slide li.selected { margin: 0; border-left: solid 2px #333333; }
	#content .page > div.col:first-child { width: 47.5em; margin-right: 1em; }
	#content .page > div.col:last-child { width: 24em; margin-left: 2em; }
	#content .page > div.col:last-child > h1 { text-align: center; }
	#content .page > div.col:last-child > h3 { text-align: center; }
}
@media screen and (min-width: 900px) {
	body { margin: 0; padding: 0; background-color: #f6f7f8; width: 100%; height: 100%; font-size: 12px;}
	.page { width: 900px; margin: 0; padding: 0; margin-left:auto; margin-right:auto; float: none; clear: both; text-align: left; }
	#title { margin 0; padding: 0; width: 100%; height: 180px; border-top: solid 1px #434241; border-bottom: solid 1px #434241; background-color: #545352;}
	#title div.image > img { width: 165px; height: 82.8px; }
	#title ul.menu  { height: 30px;  border-bottom: solid 3px #009900; width: 900px; padding: 0; padding-left: 0px; }
	#title ul.menu li { height: 30px; border-left: solid 2px #333333; margin: 0; padding: 0; padding-left: 1.5em; padding-right: 1.5em; }
	#title ul.menu li:last-child { border-right: solid 2px #333333; }
	#title ul.menu li.selected { padding: 0; padding-left: 1.5em; padding-right: 1.5em; }
	#title ul.menu li:hover { padding: 0; padding-left: 1.5em; padding-right: 1.5em; }
	#separador { height: 10px; }
	#slide-container .page > ul.slide { border-top: solid 3px #993300; }
	#slide-container .page > ul.slide li { margin: 0; border-left: solid 2px #333333; }
	#slide-container .page > ul.slide li:hover { margin: 0; border-left: solid 2px #333333; }
	#slide-container .page > ul.slide li:first-child { border-right: solid 2px #333333; }
	#slide-container .page > ul.slide li.selected { margin: 0; border-left: solid 2px #333333; }
	#content .page > div.col:first-child { width: 47.5em; margin-right: 1em; }
	#content .page > div.col:last-child { width: 24em; margin-left: 2em; }
	#content .page > div.col:last-child > h1 { text-align: center; }
	#content .page > div.col:last-child > h3 { text-align: center; }
}