/* webdesign39.fi
   Author:     Paul Wallin AT webdesign39
   
   ----------------------------------------------------*/
/* COLORS:
	   background:
*/

/* =GENERIC Styles
-------------------------------------------------------------*/

/* Reset styles
-------------------------------------------------------------*/


* { 
    margin: 0; 
    padding: 0; 
}

html, body, #bg, #bg table, #bg td, #cont {
    height:100%;
    width:100%;
    overflow:hidden;
}

img { border:0; }

dl, ol, ul, table {
	margin: 0;	font-size:1.4em;
}
li { line-height: 1.5em; }
a { outline: none; }
a abbr { text-decoration: none; border: none; }
abbr { cursor:help; }
ul { list-style: none; padding: 0; margin: 5px;}
li { padding-left: 17px; margin: 2px 0; margin: 3px 0; }
label { font-weight: bold; font-style: italic; }


/* Typography
-------------------------------------------------------------*/
body {
	font-size:62.3%;
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #1c1210;
}
h3 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size:1.5em;
	padding: 5px;
	margin:0;
	color:#000;
	font-weight: bold;
	font-style: italic;
}

#bg { 
    position: fixed; 
}

#bg div {
    height:200%;
    left:-50%;
    position:absolute;
    top:-50%;
    width:200%;
}

#bg td {
    text-align:center;
    vertical-align:middle;
}

#bg img {
    margin:0 auto;
    min-height:50%;
    min-width:50%;
}

#cont {
    position:absolute;
    top:0;left:0;
    z-index:70;
    overflow:auto;
}

.box { 
    margin: 0 auto; 
    width: 400px;
    padding: 0 50px;
    padding-bottom:100px;
}
/* Positions the contact form so it doesn't interfere with any other content, as well as a z-index above any other elements on the page */	
#contactFormContainer {
	position:absolute;
	left: 50%;
	z-index:80;
	}
	
/* Hides the whole contact form until needed */	
#contactForm {
	height:330px; width:468px;
	background: #fff; 
	padding:7px 12px; 
	color:#000;
	display:none;
	position: relative;
   -moz-border-radius-bottomleft: 10px;
   -webkit-border-bottom-left-radius: 10px;
	-moz-border-radius-bottomright: 10px;
	-webkit-border-bottom-right-radius: 10px;
	}   
.address { float: left; width: 200px; }
/* Loading bar that will appear while the ajax magic is happening */
.bar{
	display:none; 
	background:url(../images/ajax-loader.gif) no-repeat center; 
	margin-top:100px; 
	height:40px; width:230px;
	}
	
/* Hides the confirmation message until needed */	
#messageSent {display:none;}

/* This hides the form validation alert messages until needed */
#contactForm span { 
	display:none; 
	font-size:12px; 
	line-height:10px; 
	padding-left:6px; 
	color:#6d86eb;
	}
	
/* Some styling for the contact button */
#contactFormContainer .contact {
	height:60px; width:250px;
	background: url(img/spring/wd30_cloud_trab.png); 
	position:absolute; 
	left:50px; bottom:-60px; 
	cursor:pointer;
	}
			
/* Hides the darkening layer for the Modal effect. The z-index is necessary for layering purposes, and be sure to keep the positioning/height/width the same */	
#backgroundPopup{
	display:none; 
	position:fixed; 
	_position:absolute; 
	height:100%; width:100%; 
	top:0; left:0;
	background:#000; 
	z-index:11;
	}  
	
/* Form styling from here on out. There is nothing in here that you HAVE to use to get this to work */	
#contactForm textarea, #contactForm input {
	width:180px; 
	background:#6d86eb; 
	color:#fff; 
	border:1px solid #8a8a8a; 
	height:15px; 
	line-height:14px; 
	font-size:12px; 
	padding:2px 3px 3px 2px;
	}
#contactForm textarea {height:114px; font-family: Georgia, "Times New Roman", Times, serif; }
#contactForm .submit {
	border:1px solid #aba8a8; 
	background:#e5e5e5; 
	text-transform:uppercase; 
	color:#4d4d4d; 
	font-weight:bold; 
	padding:7px 16px 7px 14px; 
	height:37px; width:124px; 
	cursor:pointer; 
	float:left; 
}
#contactForm .submit:active {background:#cacaca; }
#contactForm label {padding-left:4px; font-weight:bold;}
#contactForm p {padding-bottom:14px;}
#contactForm .input_boxes {float:left; width:204px;}

#dummycontent {padding-top:100px; height:900px; position:relative;}

.clear { clear: both; }
h1.ir a { width: 350px;  height:350px; display:block; border: none; background: none;}
h1.ir{
    z-index:70;	
	width: 350px;
	height: 350px;
	position: absolute;
	top: 0;
	left: 0;
	margin: 20px 0 0 40px;
	padding: 0 0 0 0;
}
h1.ir span{	
	text-indent: -9999px;
	margin:0;
	padding:0;
	position: absolute;
}
h1#main_header { background: url(img/spring/wd39_logo_and-slogan.png) no-repeat 0 0; }
#status { 
	position: absolute; 
	top: 0; left: 50%; 
	margin: 150px 0 0 -50px; 
	text-indent: -9999px; 
	width: 450px;
	height: 300px;
	background: url(img/spring/wd_status.png) no-repeat 0 0;
	z-index: 70;
}