﻿@font-face {
  font-family: 'aino_head';
  src: url('font/aino_head.woff2') format('woff2'),
       url('font/aino_head.woff') format('woff')
}
@font-face {
  font-family: 'aino_regular';
  src: url('font/aino_regular.woff2') format('woff2'),
       url('font/aino_regular.woff') format('woff')
}

html, body {margin:0; padding:0; background:#ffffff; font-family:'aino_head', Segoe UI, Arial; font-size:23px; color:#222222; line-height:35px;}
a {color:#5181bc; text-decoration:none;}
a:hover {color:#0061d9; text-decoration:underline;}
.blue {color:#2169c1;}
.left {float:left;}
.clear {clear:both;}
img,table {border:0;}
form,label {padding:0; margin:0;}
table {border-collapse:collapse; width:100%;}

p {margin:20px 0;}

#main {max-width:1350px; margin:0 auto; position:relative; visibility:hidden; background:#f2f1ef;}

.mobonly {display:none;}

#line {background:#5b5b5b; border-top:1px solid #8d8d8d; height:5px;}
#lang {font-family:'aino_regular', Segoe UI, Arial; position:absolute; top:22px; right:50px; font-size:14px; color:#a7a7a7;}
#lang a.active:hover {text-decoration:none;}
#lang a.active {color:#333333;}

#top {height:50px; font-size:20px;}
#top a span { text-decoration:none }

#l1, #l2 {position:relative; padding:0 0 50px 30px; color:#000000;}
#l1:hover, #l2:hover, #l1:hover a, #l2:hover a {color:#2169c1 !important; background-position:4px 0;}

.triangle {
	position:absolute; top:7px; left:0; width:22px; height:30px;
	background:url(../img/triangle.png) no-repeat left top; background-size:16px auto; opacity:0.2;
}
a:hover .triangle {
	left:2px; opacity:0.4;
}

#l1 span, #l2 span {font-size:36px !important; line-height:36px !important; text-decoration:none;}
#l1 a, #l2 a {font-size:21px; color:#000000; text-decoration:none;}

#top1, #top2 {height:150px;}

#top1,#mainpic {float:left; width:52%; max-width:900px;}
#top2,#txt {float:right; width:48%;}
#txt {text-shadow:0 2px 0 #ffffff;
	width:41%; padding:0 5% 10px 2%;
	font-size:19px; line-height:34px;
}
#txt span {font-size:20px;}
#signatures {text-align:right; font-size:16px; line-height:33px; padding:50px 0 0 0;}
#signatures span {font-size:21px;}

#vdo1 {display:none; border: 1px solid #bbb; margin:20px 0 0 0;  width:100%;}
#vdo2 {border: 1px solid #bbb; width:100%; margin-top:20px; height:312px;}


#text.webonly {padding-top:80px;}



@media screen and (max-width: 1220px) {
	#txt {font-size:18px; line-height:29px;}
	#txt span {font-size:19px;}
	#vdo2 {margin-top:20px;}
}

@media screen and (max-width: 1160px) {
	#txt {font-size:16px; line-height:26px;}
	#txt span {font-size:17px;}
	#mainpic {position:absolute; bottom:6px; left:0;}
	#vdo2 {margin-bottom:30px;}
}


/*mob*/
@media screen and (max-width: 990px) {
	#mainpic {position:static;}
	.mobonly {display:block;}
	.webonly {display:none;}
	#vdo1 {display:block;}
	#vdo2 {display:none;}
	#text {margin:20px 0 40px 0; font-size:18px; line-height:27px; text-shadow:0 2px 0 #ffffff; color:#222222;}
	#text span {font-size:19px;}
	p {margin:14px 0;}
	#top1,#mainpic {width:100%; max-width:none;}
	#txt {width:90%; padding:0 5% 10px 5%; float:none;}
	#l1 span, #l2 span {font-size:30px !important;}
}
@media screen and (max-width:680px) {
	#vdo1 {height:360px;}
}
@media screen and (max-width:520px) {
	#text {margin-top:30px; font-size:17px; line-height:26px;}
	#text span {font-size:18px;}
	#top1 {padding:50px 0 0 0;}
}
