@charset "UTF-8";
/* CSS Document */
html, body {height:100%; padding:0; margin:0;}

header {width:100%; background:rgba(0,0,0,0.6); position:fixed; left:0; top:0; z-index:10; color:#fff; padding:20px 0 30px 0;}
header h1 {padding:0 0 0 50px; margin:0; font:normal 40px/60px 'texgyreadventorregular', arial, sans-serif;}
header h2 {padding:0 0 0 50px; margin:0; font:normal 16px/16px 'texgyreadventorregular', arial, sans-serif;}

section {display:block; width:100%; position:relative;}
section article {
	width:90%;
	max-width:1300px;
	min-width:300px;
	margin:0 auto;
	text-align:right;
	padding:100px 0;
	color: #600;
}
section article h1 {padding:0; margin:0; font:normal 70px/80px 'texgyreadventorregular', arial, sans-serif;}
section article h2 {padding:0; margin:0; font:normal 40px/50px 'texgyreadventorregular', arial, sans-serif;}
section article p {padding:0; margin:0; font:normal 20px/30px 'texgyreadventorregular', arial, sans-serif;}

section article .column {
	display:inline-block;
	width:40%;
	margin:50px 5%;
	vertical-align:top;
	text-align:left;
	color: #600;
}
section article .column h3 {
	padding:0;
	margin:0;
	font-size: 24px;
	font-family: 'texgyreadventorregular', arial, sans-serif;
	font-style: normal;
	line-height: 60px;
	font-weight: normal;
	font-variant: normal;
	color: #600;
}
section article .column p {padding:0; margin:0; font:normal 16px/24px 'texgyreadventorregular', arial, sans-serif; color:#f0f0f0;}

.pad {height:160px;}
.bottom {position:absolute; bottom:0; left:0;}

#a1 {min-height:100%; background:url(pic1.jpg) no-repeat center center fixed; background-size:cover; position:relative; color:#f0f0f0;}
#a2 {background:#113;}
#a3 {background:url(pic2.jpg) no-repeat center center fixed; background-size:cover; color:#f0f0f0;}
#a4 {background:#660000; color:#fff;}
#a5 {background:url(pic3.jpg) no-repeat center center fixed; background-size:cover;}
#a6 {background:#990;}
#a7 {background:url(pic5.jpg) no-repeat center center fixed; background-size:cover; color:#fff;}
#a8 {background:#4d1;}
#a9 {background:url(pic7.jpg) no-repeat center center fixed; background-size:cover; color:#fff;}
#a10 {background:#fff;}
#a11 {background:#18b; color:#fff;}

footer {
	width:100%;
	background:#990;
	padding:30px 0;
	color:#000;
	font-size: 12px;
}
footer h2 {padding:0 0 0 50px; margin:0; font:normal 15px/15px 'texgyreadventorregular', arial, sans-serif;}

.diagonal {width:100%; height:100px; background:transparent;}
.slant1w {background-image: linear-gradient(to bottom right, #113 50%, transparent 50%);}
.slant2w {background-image: linear-gradient(to top right, #113 50%, transparent 50%);}
.slant3w {background-image: linear-gradient(to bottom left, #113 50%, transparent 50%);}
.slant4w {background-image: linear-gradient(to top left, #113 50%, transparent 50%);}

.slant1b {background-image: linear-gradient(to bottom right, #660000 50%, transparent 50%);}
.slant2b {background-image: linear-gradient(to top right, #660000 50%, transparent 50%);}
.slant3b {background-image: linear-gradient(to bottom left, #660000 50%, transparent 50%);}
.slant4b {background-image: linear-gradient(to top left, #660000 50%, transparent 50%);}

.slant1y {background-image: linear-gradient(to bottom right, #990 50%, transparent 50%);}
.slant2y {background-image: linear-gradient(to top right, #990 50%, transparent 50%);}
.slant3y {background-image: linear-gradient(to bottom left, #990 50%, transparent 50%);}
.slant4y {background-image: linear-gradient(to top left, #990 50%, transparent 50%);}

.slant1g {background-image: linear-gradient(to bottom right, #4d1 50%, transparent 50%);}
.slant2g {background-image: linear-gradient(to top right, #4d1 50%, transparent 50%);}
.slant3g {background-image: linear-gradient(to bottom left, #4d1 50%, transparent 50%);}
.slant4g {background-image: linear-gradient(to top left, #4d1 50%, transparent 50%);}

header ul {padding:0; margin:0; list-style:none; width:100%; position:absolute; left:0; bottom:5px; text-align:right;}
header ul li {display:inline-block; margin:1px 2px; position:relative;
-webkit-transform:skewX(-30deg);
transform:skewX(-30deg);
}
header a {display:block; width:30px; height:12px; text-decoration:none;
-webkit-transform:skewX(30deg);
transform:skewX(30deg);
}
header li:nth-of-type(1) {background:#fff;}
header li:nth-of-type(2) {background:#113;}
header li:nth-of-type(3) {background:#fff;}
header li:nth-of-type(4) {background:#660000;}
header li:nth-of-type(5) {background:#fff;}
header li:nth-of-type(6) {background:#990;}
header li:nth-of-type(7) {background:#fff;}
header li:nth-of-type(8) {background:#4d1;}
header li:nth-of-type(9) {background:#fff;}
header li:nth-of-type(10) {background:#fff;}
header li:nth-of-type(11) {background:#18b; margin-right:20px;}

header a:hover:before {display:block; content: attr(data-title); position:absolute; left:0; bottom:20px; width:30px; height:20px; background:rgba(0,0,0,0.8); color:#fff; font:normal 12px/20px 'texgyreadventorregular', arial, sans-serif; border-radius:5px; text-align:center;}
header a:hover:after {display:block; content:""; position:absolute; left:10px; bottom:15px; width:0; height:0; border:5px solid transparent; border-top-color:rgba(0,0,0,0.8); border-bottom:0;}

@media only screen and (max-width: 768px) {
header h1 {padding:0 0 0 30px; margin:0; font:normal 30px/50px 'texgyreadventorregular', arial, sans-serif;}
header h2 {padding:0 0 0 30px; margin:0; font:normal 13px/13px 'texgyreadventorregular', arial, sans-serif;}
section article h1 {padding:0; margin:0; font:normal 50px/60px 'texgyreadventorregular', arial, sans-serif;}
section article h2 {padding:0; margin:0; font:normal 30px/40px 'texgyreadventorregular', arial, sans-serif;}
section article p {padding:0; margin:0; font:normal 15px/20px 'texgyreadventorregular', arial, sans-serif;}
.pad {height:80px;}
section article .column {width:80%; margin:20px auto 0 auto; vertical-align:top; text-align:left;}
}
@media only screen and (max-width: 480px) {
header h1 {padding:0 0 0 20px; margin:0; font:normal 25px/40px 'texgyreadventorregular', arial, sans-serif;}
header h2 {padding:0 0 0 20px; margin:0; font:normal 12px/12px 'texgyreadventorregular', arial, sans-serif;}
section article h1 {padding:0; margin:0; font:normal 40px/50px 'texgyreadventorregular', arial, sans-serif;}
section article h2 {padding:0; margin:0; font:normal 25px/30px 'texgyreadventorregular', arial, sans-serif;}
section article p {padding:0; margin:0; font:normal 13px/18px 'texgyreadventorregular', arial, sans-serif;}
.pad {height:70px;}
header a {width:20px;}
}
@media only screen and (max-width: 320px) {
header h1 {padding:0 0 0 10px; margin:0; font:normal 22px/30px 'texgyreadventorregular', arial, sans-serif;}
header h2 {padding:0 0 0 10px; margin:0; font:normal 12px/12px 'texgyreadventorregular', arial, sans-serif;}
section article h1 {padding:0; margin:0; font:normal 40px/50px 'texgyreadventorregular', arial, sans-serif;}
section article h2 {padding:0; margin:0; font:normal 25px/30px 'texgyreadventorregular', arial, sans-serif;}
section article p {padding:0; margin:0; font:normal 13px/18px 'texgyreadventorregular', arial, sans-serif;}
.pad {height:60px;}
}

@media (min-device-width:320px) and (max-device-width:768px) {
section#a1,
section#a3,
section#a5,
section#a7,
section#a9
{background-attachment:scroll;}
}
.foot {
	color: #663;
	font-size: 14px;
}