/*
 
All rights reserved (c) Avarko 2011.

*/

/* COMMON */

*, html { /* Clearing unnecessary margins and paddings throughout the site */

margin: 0;
padding: 0;

}

body {

color: #fff;
font-family: Tahoma, arial, sans-serif;
line-height: 18px;
background: #3a3a3a; /* The color which appears after the footer div, as each section has its own background color defined */

}

.wrap {

margin: 0 auto; /* Centering the page */
width: 960px; /* Width of the page */

}

.block {

clear: both;

}

/* LINKS */

a:focus {

outline: none /* Removes dotted border around links */

}

a, a:visited {

text-decoration: none; /* Removes underlining from links */
color: red;

}

/* The following trick is used to create the feeling of physically clicking a link */

a:active { 

position: relative;
top: 1px; /* The amount by which and from where the link moves from its default position */

}

/* ###### HEADER ###### */

#header {

background: url('header_bg2.png') repeat-x;
height: 344px;

}

#logo {

background: url('logo2.png');
height: 99px;
width: 160px;
float: left;

}

#title {

height: 233px;
clear: both;
float: left;

}

#title_image {

background: url('devops4.png') no-repeat;
float: right;
position: relative;
top: -20px;
left: -45px;
height: 229px;
width: 247px;

}

#title h1 {

text-shadow: 1px 1px 0 #d81f27, 3px 3px 3px #9f040b;
font-size: 36px;
padding-top: 85px;
font-weight: 100;

}

#title p {

font-size: 12px;
color: #ff959a;

}

/* Header Navigation */

#nav ul {

float: right;
margin: 30px 0;
list-style-type: none;

}

#nav li {

display: inline;

}

#nav a {

font-size: 0.75em;
text-transform: uppercase;
color: #fff;
padding: 5px 10px;
margin-left: 15px;
border-radius: 12px;
-moz-border-radius: 12px;
-o-border-radius: 12px;
-webkit-border-radius: 12px;
transition: background 0.4s;
-moz-transition: background 0.4s;
-o-transition: background 0.4s;
-webkit-transition: background 0.4s;

}

#nav a:hover, .current {

background: #3a3a3a;
border-radius: 12px;
-moz-border-radius: 12px;
-o-border-radius: 12px;
-webkit-border-radius: 12px;

}

/* ###### CONTENT ###### */

#content, #content_sub {

font-family: Verdana, arial, sans-serif;
font-size: 11px;
clear: both;
background: #fff;
color: #000;
padding-bottom: 20px;

}

#content h1, #content_sub h1 {

font-weight: 100;
font-size: 22px;
padding-top: 30px;

}

#content a:hover {

text-decoration: underline;

}

.column {

float: left;
width: 400px;

}

.short {

width: 260px;
margin-left: 40px;
float: left;

}

.news {

float: right;
width: 220px;
text-align: right;

}

.date {

color: #999;

}

/* ###### SUB PAGES ###### */

#header_sub {

background: url('sub_page_bg2.png') repeat-x;
height: 128px;

}

.kuva {


background: url('kuva.png') no-repeat;
height: 385px;
width: 400px;
float: right;
margin-top: 65px;

}

.kuva h1 {

color: #d5d5d5;
margin: 150px 170px;
text-shadow: 0px 1px 0px #fff;

}

/* ###### FOOTER ###### */

#footer {

clear: both;
background: #3a3a3a;
color: #fff;

}

#footer h1 {

padding-top: 30px;
font-size: 22px;
font-weight: 100;

}

.infotext {

font-size: 11px;
color: #c9c9c9;
width: 200px;
float: left;
margin-right: 20px;
padding-bottom: 30px;

}

.small {

width: 100px;

}

.right {

float: right;
font-size: 11px;
color: #c9c9c9;

}