html, body {
	margin: 0px;
	padding: 0px;
	font-family: Helvetica, "Trebuchet MS", Arial, sans-serif;
}
img {
	border: 0px;
}
#page {
	position: relative;

	width: 90%;
	margin: 0px auto;
	max-width: 1250px;
}
.grayscale {
         -moz-filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
         -o-filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
         -webkit-filter: grayscale(100%);
         filter: gray;
         filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
     }

#top {height: 106px; border-bottom: 2px solid #cbd300; position: relative;}
#top .logo {position: absolute; top: 18px; left: 30px;}
#top .slogan {margin: 0px; padding: 0px; position: absolute; left: 30px; top: 70px; font-weight: normal; font-size: 14px; letter-spacing: -.5px;}
#top .lang ul {position: absolute; right: 30px; top: 10px; list-style-type: none; margin: 0px; padding: 0; text-align:right; }
#top .lang li{ margin: 0px; display: inline; line-height: 2.5ex;}
#top .lang li a:after{ content:" / ";}
#top .lang li:last-child a:after{ content:"";}
#top .topmenu ul {position: absolute; right: 15px; bottom: 14px; list-style-type: none; margin: 0px; padding: 0; text-align:right; width: 100%;}
#top .topmenu li{ padding: 0px 10px; margin: 0px; display: inline; line-height: 2.5ex;}
#top .topmenu .toggle {display: none; }

#top .topmenu li .lrg{ font-size: 250%;}
#top li a{ color: #636466; text-decoration: none; text-transform: uppercase;}
#top li a:hover{ color: #cbd300;}
.main {padding: 0px 30px;}
.slidercont {margin: 23px 0px 10px 0px; border: 2px solid #0073aa;}
.slider {position: relative; height: 310px; }
.spacer {border-bottom: 1px solid #c2c2c2; width: 100%;}
.content h2 {text-transform: uppercase; color: #0073aa; font-size: 2.5ex; font-weight: normal;}
.content h2.nt {text-transform: none;}
.content h2.slogan {color: #58595b; font-size: 2.5ex; text-align: center;}
.content h2.slogan span{color: #cbd300; text-decoration: none;}
.content h2.slogan a{ text-decoration: none;}

.sq {width: 23.5%; background-size: cover; background-position: center center;  border: 6px solid #c2c2c2; float: left;margin-right: 2%; box-sizing: border-box; margin-bottom: 30px;}
.gal .sq:nth-child(4n) {margin-right: 0;}
.sq:hover { border: 6px solid #0073aa;-moz-filter: none; -o-filter: none; -webkit-filter: none; filter: none; cursor: pointer;}
.sq:before {content: "";display: block;padding-top: 100%;}
.sq span.label {position: absolute; background-color: rgba(0, 0, 0, 0.6); margin-top: -70px; display: block; color: white; padding: 5px 10px;}

.rimg .sq {width: 100%;}
.rimg {width: 23.5%;float: right; margin-left: 1.5%;}

.footer {background-color: #0073aa;color: white; padding: 6px 0px; text-align: center; clear: both;}
.footer a {color: white; text-decoration: none;}
.footer a:hover {text-decoration: underline;}
.rightbox {float: right; width: 27%; background-color: #0073aa; padding: 30px; margin: 30px 0 30px 0px; color: #c3c3c3; box-sizing: border-box;}
.content .rightbox h3 {color: white; padding: 0px; margin:0px; font-style: normal; font-size: 2.2ex;}
.content .rightbox p {padding-top: 0px; margin-top: 0px;}

.leftbox {float: left; width: 70%; padding-top: 30px;}
.content .ssq {width: 12%; background-size: cover; background-position: center center;  border: 6px solid #0073aa; float: left; margin-right: 2%; margin-top: 4ex; box-sizing: border-box; clear: left;}
.content .ssq:before {content: "";display: block;padding-top: 100%;}
.content {color: #58595b;}
.content a {color: #58595b;}
.content a:hover {text-decoration: none;}
.content table, .content td, .content th {			font-size: 12px;		}
.content h1 {			font-size: 18px;			margin:0px;			font-weight: bold;			padding: 10px 0px;		}
.content h3 {			font-size: 2.5ex;			font-weight: normal;			margin: 2ex 0px;			padding: 0px;			color: #0073aa;		}
.content h4 {			font-size: 14px;			font-weight: bold;			margin: 6px 0px;			padding: 0px;		}
.content h5 {			font-size: 14px;			font-weight: normal;			font-style: italic;			margin: 6px 0px;			padding: 0px;		}
.content h6 {			font-size: 13px;			font-weight: bold;			margin: 3px 0px;			padding: 0px;		}
.content p {text-align: justify;}
.content .rightbox p {text-align: left;}


@media all and (max-width: 1350px) {
	#top .topmenu li:nth-child(5) a:after{content:"\a";white-space: pre;}
	.rightbox {width: 32%;}
	.leftbox {width: 65%;}
}
@media all and (max-width: 1100px) {
	#top .topmenu li:nth-child(3) a:after{content:"\a";white-space: pre;}
	.rightbox {width: 40%;}
	.leftbox {width: 58%;}
	.sq {width: 49%; float: left;margin-right: 2%;}
	.gal .sq:nth-child(2n) {margin-right: 0;}
}
@media all and (max-width: 900px) {
	.rightbox {width: 48%;}
	.leftbox {width: 48%;}
}
@media all and (max-width: 780px) {
	#top .topmenu ul {display: none;}
	body.nav #top .topmenu ul { left: 0; display: block; top: 110px; z-index: 1000; width: 100%; bottom: auto; background: white; padding: 20px 0;}
	body.nav .main, body.nav .footer{display: none;}
	#top .topmenu ul li{display: block; text-align: center; width: 100%; padding: 10px 0;}
	
	#top .topmenu .toggle {display: block; position: absolute; right: 30px; top: 16px; color: #636466; font-size: 40px; text-decoration: none;}
	#top .lang ul { top: 68px; }
	.rightbox {float: none;width: 100%;}
	.leftbox {float:none;width: 100%;}
	#page {width: 100%;}
	
	.sq {width: 100%; margin-right: 0;}
	.gal .sq:nth-child(4n) {margin-right: 0;}

}