@charset "UTF-8";

@font-face {
    font-family: 'diavlolight';
    src: url('fonts/diavlo-webfont.eot');
    src: url('fonts/diavlo-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/diavlo-webfont.woff') format('woff'),
         url('fonts/diavlo-webfont.ttf') format('truetype'),
         url('fonts/diavlo-webfont.svg#diavlolight') format('svg');
    font-weight: normal;
    font-style: normal;
}

body { font-family:'diavlolight',Arial,Tahoma,Verdana,Helvetica,sans-serif; }

a, input, textarea, select {outline: none;}

html { 
font-size:100%; 
}
body {
width:100%;
margin:0;
padding:0;
text-align:center;
background-color:#000;
color:#404040;
font-size:100%;
line-height:1.5em;
}
a:link, a:visited {
color:#404040;
text-decoration:none;
}
a:hover {
color:#AFCA0B;
text-decoration:none;
}
body a img {
border:0 solid #FFF;
}
h1 {
line-height:110%;
font-size:230%;
font-weight:normal;
color:#000;
text-transform:uppercase;
margin-top:0;
margin-bottom:20px;
padding-bottom:20px;
border-bottom:1px solid #000;
}
h2 {
line-height:110%;
font-size:130%;
font-weight:normal;
color:#A2BD00;
/*text-transform:uppercase;*/
margin-top:0;
margin-bottom:5px;
padding-bottom:5px;
border-bottom:0px solid #000;
}
h1 span, h2 span {
color:#AFCA0B;
}
.imgleft {
float:left;
margin-right:25px;
}
.imgright {
float:right;
margin-left:25px;
}
.cleaner {
_display:none;
clear:both;
line-height:1px;
}

/* Background.............................................................. */

img.bg {
min-height:100%;
min-width:1024px;
width:100%;
height:auto;
position:fixed;
top:0;
left:0;
}
		
@media screen and (max-width: 1024px){
	img.bg {
	left: 50%;
	margin-left: -512px; }
}

#back {
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:url("back.png") top left;
}

/* Content.............................................................. */

#content {
position:relative;
width:100%;
min-width:960px; 
max-width:1680px; 
margin-left:auto;
margin-right:auto;
}

/* Content_left.............................................................. */

#content_left_back {
position:fixed;
top:0;
left:0;
width:15%;
height:100%;
background-color:#FFF;
}
#content_right_back {
position:fixed;
top:0;
left:15%;
width:34%;
height:100%;
background-color:#E9E9E9;
}

#content_left {
position:relative;
float:left;
width:15%;
text-align:left;
margin-top:3%;
z-index:100;
}
#main_logo {
width:100%;
}

/* Nav.............................................................. */

#nav {
width:100%;
margin-top:30%;
margin-bottom:20%;
}
#nav ul {
list-style-type:none;
margin:0;
padding:0;
}
#nav li {
text-align:left;
}
#nav ul li a {
display:block;
line-height:70px;
font-size:135%;
color:#000;
letter-spacing:-1px;
text-decoration:none;
margin-left:20px;
}
#nav ul li a em {
font-style:normal;
border-bottom:1px solid #AFCA0B;
}
#nav ul li a:hover {
color:#000;
text-decoration:none;
}
#nav ul li a:hover span {
border-bottom:1px solid #AFCA0B;
}
#nav ul li a.hi span {
border-bottom:1px solid #AFCA0B;
}

#nav2 {
width:80%;
color:#6A6A6A;
margin-left:auto;
margin-right:auto;
padding-top:30%;
}
#nav2 ul {
list-style-type:none;
margin:0;
padding:0;
}
#nav2 li {
text-align:left;
padding-left:20px;
}
#nav2 li#nav2_01 {
background:url("back_nav2_01.jpg") left 50% no-repeat;
}
#nav2 li#nav2_02 {
background:url("back_nav2_02.jpg") left 50% no-repeat;
}
#nav2 ul li a {
display:block;
color:#6A6A6A;
}
#nav2 ul li a:hover {
color:#000;
text-decoration:none;
}

#index_logo {
float:right;
text-align:center;
width:85%;
padding-top:10%;
}
#index_logo img {
width:56%;
margin-left:auto;
margin-right:auto;
}

#box {
position:absolute;
top:0;
left:15%;
width:30%;
font-size:90%;
padding:2%;
padding-top:5%;
}

/* Mainbox.............................................................. */

#mainbox {
width:100%;
margin:0;
}
#mainbox_inside {
text-align:justify;
margin-top:0;
}

/* Footer.............................................................. */

#footer {
width:80%;
color:#6A6A6A;
text-align:left;
margin-top:10%;
margin-left:auto;
margin-right:auto;
margin-bottom:5%;
border-top:1px solid #888;
}
#footer a img {
position:relative;
top:5px;
}
#footer a:hover img {
opacity:0.6;
filter:alpha(opacity=60);
}

#back_right_corner {
position:fixed;
bottom:0;
right:0;
width:370px;
height:90px;
border-top:1px solid #FFF;
}


/* RESPONSIVE STRUCTURE
--------------------------------------- */

.imgleft, .imgright, #main_logo img, #index_logo img, #slider img { max-width:100%; height:auto; }

@media screen and (min-width: 1681px) {

  #content_left_back { width:19%; }
  #content_right_back { left:19%; width:30%; }
}

@media screen and (max-width: 1366px) {

  #nav ul li a { line-height:50px; font-size:110%; }
}

@media screen and (max-width: 1280px) {

  body { font-size:85%; }
  #nav ul li a { line-height:45px; }
  h1 { font-size:250%; }
}

@media screen and (max-width: 1024px) {

  body { font-size:75%; }
  #nav ul li a { line-height:40px; }
}

@media screen and (max-width: 960px) {
  
  body, html { height:100%; }
  #content { width:960px; min-height:100%; background:url("back_container.jpg") top left repeat-y; }
  body#indexpage #content {background:url("back_container_index.png") top left repeat-y; } 
  #content_left_back { display:none; }
  #content_right_back { display:none; }
  #box { position:relative; top:0; left:0; margin-left:15%; }
}