/*-----------------------------------------------
# [Master Stylesheet] 
#  
# Project:				Rantapallo.fi 
# Version:				0.1 
# Last change:			10.01.2009 
# Last assigned to:		Joni Jalkanen 
		http://www.jeyz.us
		 
-----------------------------------------------*/


/*-----------------------------------------------
Colors
-----------------------------------------------*/
/*	
#	paragraph:		#2a4454; 
#	headings:		#003e64;
#	date:			#bcbcbc;
#	links:			#1495e5;
*/



/*-----------------------------------------------
General
-----------------------------------------------*/

body
{
background: url(../i/sample_body_bg.jpg) #fff no-repeat fixed;
color: #333; 
font: 75% Verdana, 'Trebuchet MS', Arial, sans-serif; 
}

html>body {
font-size:12px;
}



/*-----------------------------------------------
Typography - General
-----------------------------------------------*/

h1, h2, h3, h4, h5, h1 a, h2 a, h3 a, h4 a, h5 a {
color: #ff6600;
font-family: 'Trebuchet MS', Verdana, Arial, sans-serif;
}

h1, div#main_article h2 {
line-height: 1em; /* 24px / 24px = 1em */
font-size: 2em; /*  = 24px / 12px */
font-weight:normal;
margin:0.6em 0 0.8em 0;
color: #e75200; /* Sivun pääotsikko */
}

h2 {
line-height:1.2em; /* 24px / 24px = 1em */
font-size: 1.667em; /*  = 24px / 12px */
font-weight:normal;
margin:1.25em 0 0.8em 0;
}
h3 {
line-height:1.333em; /* 24px / 16px = 1.2em */
font-size:1.5em; /*  = 16px / 12px = 1.333em */
font-weight: normal;
margin:2.2em 0 1.25em 0;
}
h4 {
line-height:1.714em; /* 24px / 14px = 1.2em */
font-size:1.166em; /*  = 14px / 12px = 1.333em */
font-weight:normal;
margin: 2.2em 0 1em 0;
}

h5 {
line-height:1em; /* 24px / 14px = 1.2em */
font-size:1em; /*  = 14px / 12px = 1.333em */
font-weight:bold;
margin:2.2em 0 1.8em 0;
}

p {
font-size:1em;
line-height:1.5em; 
margin:0 0 1.5em 0;
}

li {
font-size:1em;
line-height:1.5em; 
}

blockquote p{
font: 1.15em Times, serif;
font-style: italic;
line-height: 1.3em;
}

blockquote p.quote_owner {
color:#6f8b9d;
display:block;
font-size: 1.1em;
}

address {
font-style: normal;
}

span.bullet {
color: #ccc;
padding: 0 5px;
}

strong {
font-weight: bold;
}

.sidebar_box h3 {
position: relative;
float: left;
color: #6d9a01;
line-height: 1em;
margin: 1.3em 0 1em;
}

.sidebar_box h3 span {
font-size: 0.8em;
color: #333;
display: block;
}




/*-----------------------------------------------
Links - General
-----------------------------------------------*/

a {
color: #e75200; 
text-decoration: none;
}

a:hover 
{
text-decoration: underline;
}

ul li a, ul li {
color: #5e5e5e; 
text-decoration: none;
}

ul li a:hover {
color: #FF6600; 
text-decoration: underline;
}


/*-----------------------------------------------
Form
-----------------------------------------------*/
input, textarea, label {
position: relative;
float: left;
font: 1em Verdana, 'Trebuchet MS', Arial, sans-serif;
}

label {
display: block;
}





/*-----------------------------------------------
Layout
-----------------------------------------------*/

div.container {
position: relative;
background: url(../i/bg_transparent_white_20percent.png) 0 0 repeat-y;
margin: 0 auto;
width: 980px;
}

/* Tämä fixi ei voi olla erillisessä css-tiedostossa. Älä kysy miksi. I <3 IE6 */
* html div.container { 
background: none;
}

div#header {
position: relative;
float: left;
clear: both;
display: inline;
width: 980px;
}

div#toolbox {
float: left;
background: #fff url(../i/icon_functions.gif) 10px 12px no-repeat;
margin: 30px 0 10px;
padding: 15px 0 15px 10px;
width: 145px;
}

ul#infobar {
position:relative;
float:left;
clear: both;
background: #ffcc00 url(../i/bg_infobar.gif) repeat-x;
height: 70px;
width:980px;
}

div#image_carousel {
position: relative;
float: left;
clear: both;
display: inline;
background: #fff;
height: 380px;
width: 970px;
}

* html div#image_carousel {
position: relative;
float: left;
background: #fff;
height: 380px;
width: 970px;
}

div#wrapper {
position: relative;
float: left;
clear: both;
display: inline;
margin: -90px 5px 0;
width: 970px;
}

div#column_main_content {
position: relative;
float: left;
clear: left;
display: inline;
margin-left: 10px;
width: 530px;
}

div.article_box {
position: relative;
float: left;
clear: left;
background: #fff url(../i/hr_30percent.gif) 0 top repeat-x;
display: inline;
padding: 0 20px 0px;
width: 490px;
}

div.article_box_first {
position: relative;
float: left;
clear: left;
background: #fff;
display: inline;
margin-bottom: 10px;
padding: 20px 20px 0;
width: 490px;
}

div.box_without_bottom {
position: relative;
float: left;
clear: left;
background: #fff;
display: inline;
padding: 0 20px;
width: 490px;
}

div.content {
position: relative;
float: left;
clear: left;
display: inline;
width: 810px;
z-index:100;
}

div#comments, ul#akkilahdot_info {
position: relative;
float: left;
clear: left;
background: #fff;
display: inline;
padding-bottom: 18px;
width: 530px;
}

div#related_posts {
position: relative;
float: left;
clear: left;
background: #fff;
display: inline;
margin: 10px 0 0 10px;
width: 530px;
}

.sidebar_box {
position: relative;
float: right;
clear: right;
background: #fff;
color: #666;
margin: 0 0 10px 10px;
padding: 0 20px 26px;
width: 220px;
}

.sidebar_box_related_to_main {
position: relative;
float: right;
clear: right;
background: #fff url(../i/vertical_hr_30percent.gif) repeat-y;
color: #666;
margin-bottom: 10px;
padding: 0 10px 26px 30px;
width: 230px;
}

#akkilahdot .sidebar_box_related_to_main {
margin-top: 33px;
}

div#sidebar_banners {
position: relative;
float: right;
clear: right;
right: 10px;
width: 140px;
z-index:100;
}

div#footer {
position: relative;
float: left;
clear: both;
background: #fff url(../i/bg_footer_dots.gif) 700px 0 repeat-y;
display: inline;
margin: 10px 0 10px 10px;
padding-bottom: 20px;
width: 950px;
}




/*-----------------------------------------------
Navigation
-----------------------------------------------*/

ul#navigation {
position: absolute;
background: transparent url(../i/bg_navigation.png) no-repeat;
bottom: 180px;
color: yellow;
cursor: pointer;
height: 140px;
padding: 40px 0 0 10px;
width: 330px;
z-index:100;
} 

ul#navigation li {
position: relative;
float: left;
display: block;
}

ul#navigation li a{
position: relative;
float: left;
background: transparent url(../i/navigation_links.jpg) -0px 0px no-repeat;
color: #000;
height: 33px;
text-indent: -9999px;
width: 145px;
}
ul#navigation li a#navigation_matkajutut:hover {
background-position: -290px 0px;
}
ul#navigation li.active a#navigation_matkajutut,
ul#navigation li.active a#navigation_matkajutut:hover {
background-position: -290px 0px;
}
ul#navigation li a#navigation_akkilahdot {
background-position: -140px 0;
}
ul#navigation li a#navigation_akkilahdot:hover {
background-position: -430px 0;
}
ul#navigation li.active a#navigation_akkilahdot,
ul#navigation li.active a#navigation_akkilahdot:hover {
background-position: -430px 0;
}
ul#navigation li a#navigation_matkakuvat {
background-position: 0 -33px;
height: 31px;
}
ul#navigation li a#navigation_matkakuvat:hover {
background-position: -290px -33px;
}
ul#navigation li.active a#navigation_matkakuvat,
ul#navigation li.active a#navigation_matkakuvat:hover {
background-position: -290px -33px;
}
ul#navigation li a#navigation_keskustelut {
background-position: -143px -33px;
height: 31px;
}
ul#navigation li a#navigation_keskustelut:hover {
background-position: -433px -33px;
}
ul#navigation li.active a#navigation_keskustelut,
ul#navigation li.active a#navigation_keskustelut:hover {
background-position: -433px -33px;
}
ul#navigation li a#navigation_matkavideot {
background-position: 0 -65px;
}
ul#navigation li a#navigation_matkavideot:hover {
background-position: -290px -65px;
}
ul#navigation li.active a#navigation_matkavideot,
ul#navigation li.active a#navigation_matkavideot:hover {
background-position: -290px -65px;
}
ul#navigation li a#navigation_reissublogit {
background-position: -145px -65px;

}
ul#navigation li a#navigation_reissublogit:hover {
background-position: -435px -65px;
}
ul#navigation li.active a#navigation_reissublogit,
ul#navigation li.active a#navigation_reissublogit:hover {
background-position: -430px -60px;
}



/*-----------------------------------------------
hr's
-----------------------------------------------*/

div.hr100 {
position: relative;
float: left;
clear: both;
left: -20px;
height: 40px;
background:url(../i/hr_100percent.png) repeat-x 0 top;
width: 530px;
z-index: 100;
}

div.hr30 {
display: block;
clear: both;
height: 40px;
background:url(../i/hr_100percent.png) repeat-x 0 top;
opacity: 0.3;
}

div.clear {
display: block;
clear: both;
height: 1px;
}





/*-----------------------------------------------
Toolbox
-----------------------------------------------*/

div#toolbox a {
position: relative;
float: left;
color: #ff6600;
font-size: 0.9em;
padding: 0px 0 10px 30px;
}

* html div#toolbox a {
padding: 6px 0 0 25px;
}




/*-----------------------------------------------
Search
-----------------------------------------------*/
form.search_form {
position: relative;
float: left;
background: transparent url(../i/bg_search.gif) 5px 20px no-repeat;
height: 34px;
padding: 20px 0 0 5px;
width: 172px;
}

* html form.search_form {
padding-top: 4px;
}

form.search_form input#search_field{
border: 0;
background: #ffab32;
color: #fff;
margin: 10px 0 0 10px;
width: 130px;
}




/*-----------------------------------------------
Infobar
-----------------------------------------------*/ 

ul#infobar li {
position: relative;
float: left;
}

#etusivu ul#infobar li h1#logo {
position:relative;
margin: 0;
}

#etusivu ul#infobar li h1#logo a {
position:relative;
background: transparent url(../i/icon_logo.gif) -3px 0 no-repeat;
display:block;
font-size:0.7em;
height: 70px;
left:0;
text-indent:-9999px;
top:0;
width:280px;
}

#etusivu ul#infobar li h1#logo a:hover {
background: transparent url(../i/icon_logo.gif) -297px 0 no-repeat;
}

ul#infobar li a#logo {
position:relative;
background: transparent url(../i/icon_logo.gif) -3px 0 no-repeat;
display:block;
font-size:0.7em;
height: 70px;
left:0;
text-indent:-9999px;
top:0;
width:280px;
}

ul#infobar li a#logo:hover {
background: transparent url(../i/icon_logo.gif) -297px 0 no-repeat;
}

ul#infobar li.steps {
width: 195px;
}
ul#infobar li#step_2 {
width: 180px;
}

ul#infobar li#step_3  {
width: 140px;
}

ul#infobar li strong {
position:relative;
display:block;
font-size:0.7em;
height: 22px;
margin-top: 20px;
text-indent:-9999px;
top:0;
width: 200px;
}

ul#infobar li#step_1 strong {
background: transparent url(../i/bg_infobar_headers.gif) 0 0 no-repeat;
}

ul#infobar li#step_2 strong {
background: transparent url(../i/bg_infobar_headers.gif) -200px 0 no-repeat;
}

ul#infobar li#step_3 strong {
background: transparent url(../i/bg_infobar_headers.gif) -380px 0 no-repeat;
width:140px;
}

ul#infobar li p{
position: relative;
color: #333;
display: inline;
font-family: Tahoma, 'Trebuchet MS', Verdana, Arial, sans-serif;
font-size: 1em;
top: -3px;
}

ul#infobar li#step_1 p {
margin-left: 19px;
}

ul#infobar li#step_2 p {
margin-left: 21px;
}

ul#infobar li#step_3 p {
margin-left: 22px;
}


ul#infobar li a{
color: #333;
}




/*-----------------------------------------------
Bannerit
-----------------------------------------------*/

a#upper_banner_wide {
position: relative;
float: left;
height: 120px;
margin: 5px 0;
width: 980px;
}

div#sidebar_banners img{
position: relative;
float: left;
border: 0;
padding-bottom: 10px;
}




/*-----------------------------------------------
Palstat
-----------------------------------------------*/
.column_260px {
position: relative;
float: left;
margin-right: 10px;
padding: 0 20px 20px;
width: 220px;
}

#column_without_margin {
margin-right: 0px !important;
}


.sidebar_box_related_to_main ul li {
margin-left: 20px;
list-style-image: url(../i/icon_list_arrow_blue.gif);
}





/*-----------------------------------------------
Jutut
-----------------------------------------------*/
div#main_article {
color: #000;
}

#etusivu div#main_article img, #etusivu div.article_box img{
position: relative;
float: left;
padding: 4px 10px 32px 0;
height: 130px;
width: 130px;
}

#matkajutut div#main_article {
padding: 0 20px 36px;
}

#matkajutut div#main_article h1,
#matkajutut div#main_article h2,
#matkajutut div#main_article h3,
#matkajutut div#main_article h4,
#matkajutut div#main_article h5{
display: block;
}

#matkajutut div#article_header{
background: #fff url(../i/hr_30percent.gif)  0 bottom repeat-x;
margin-bottom: 0px;
padding-bottom: 60px;
}

#matkajutut div#article_info{
position: relative;
float: left;
display: inline;
font-size: 0.9em;
padding-top: 8px;
width: 490px;
}

#matkajutut div#article_header h1 {
position: absolute;
background: transparent url(../i/bg_transparent_white_article_header.png)  0 0 no-repeat;
padding: 18px 0 18px 6px;
top: 18px;
left: 20px;
width: 484px;
z-index: 100;
}

* html #matkajutut div#article_header h1 {
top: 0px;
}


#matkajutut div#main_article #main_image {
position: relative;
float: left;
margin-bottom: 72px;
}

#matkajutut span#article_date {
position: relative;
float:left;
display: inline;
}

#matkajutut div.post-ratings {
position: relative;
float:right;
display: inline;
margin-left: 20px;
vertical-align: bottom;
}

#matkajutut div.post-ratings strong {
vertical-align: top;
}

#matkajutut a.speech_bubble {
position: relative;
float:right;
background: #fff url(../i/icon_speech_bubble.gif) no-repeat;
color: #fff;
display: inline;
font-weight: bold;
height: 22px;
margin-left: 20px;
padding-top: 2px;
text-align: center;
width: 24px;
}

#matkajutut a.share_this {
position: relative;
float:right;
background: transparent url(http://w.sharethis.com/images/share-icon-16x16.png?CXNID=1000014.0NXC) no-repeat scroll 0 0 !important;
color: #999;
display: inline;
height: 20px;
margin-left: 5px;
padding-left: 20px;
}




/*-----------------------------------------------
Kommentit
-----------------------------------------------*/
div#comments ul li{
position: relative;
float: left;
clear: left;
background: #fff url(../i/hr_30percent.gif) 0 top repeat-x;
padding: 30px 20px 10px;
width: 490px;
}

div#comments h3#main_comments_header {
font-size: 1.8em;
background: #fff url(../i/icon_conversation.gif) 20px 0 no-repeat;
color: #6D9A01;
height: 65px;
line-height: 1em;
margin: 1.8em 0 0.8em;
padding-left: 120px;
}

div#comments h3 span{
font-size: 0.7em;
font-weight: normal;
color: #000;
display: block;
}

div#comments span.comment_author {
position: relative;
float: left;
clear: both;
color: #6D9A01;
font-size: 1.2em;
font-weight: bold;
padding-bottom: 0.5em;
width: 490px;
}

div#comments span.comment_time {
position: relative;
float: right;
font-size: 0.8em;
font-weight: normal;
color: #333;
}

div#comments a.comment_author_website {
font-size: 0.8em;
font-weight: normal;
color: #ff6600;
}

form#comments_form {
position: relative;
float: left;
background: #fff url(../i/hr_30percent.gif)  0 0 repeat-x;
padding: 18px 20px;
}

form#comments_form label {
color: #FF6600;
padding: 15px 0 3px;
width: 490px;
}

form#comments_form label span{
color: #999;
font-size: 0.8em;
}

form#comments_form input, form#comments_form textarea {
color: #666;
padding: 5px 0 5px 2px;
width: 350px;
}

form#comments_form textarea {
display: block;
}

form#comments_form input#btn_form_submit {
clear: both;
display: block;
padding: 18px 0 0;
width: auto;
}



/*-----------------------------------------------
Juttujen listaus
-----------------------------------------------*/
div#related_posts h3 {
color: #2986b0;
margin: 0;
height: 50px;
}

div#related_posts ul {
background: #fff url(../i/bg_posts_header.gif) repeat-x;
margin-right: 10px;
}


/*-----------------------------------------------
Äkkilähdöt - teaserit
-----------------------------------------------*/

table.cheap_flights {
position: relative;
float: left;
margin-bottom: 15px;
} 

table.cheap_flights caption {
background: #fff; 
}

table.cheap_flights td{
font-size: 1em;
height: 1.5em;
vertical-align: middle;
padding-left: 3px;
} 

.alt{
background: #f5f5f5;
}   

table.cheap_flights td.destination {
width: 167px;
}

table.cheap_flights td.price {
width: 37px;
}

table.cheap_flights td.price_euro_mark {
width: 7px;
}




/*-----------------------------------------------
Äkkilähdöt
-----------------------------------------------*/
#akkilahdot h1 {
position: absolute;
display: inline;
left: 20px;
margin: 0;
top: 1.4em;
}

#akkilahdot p.description {
position: absolute;
display: inline;
left: 160px;
line-height: 1em;
top: 31px;
width: 300px;
}

#akkilahdot div#sidebar_banners {
top: 50px;
}

form#akkilahto-selects {
position: relative;
float: left;
display: inline;
background: #fff url(../i/bg_form_akkilahdot.gif) 3px 60px no-repeat;
height: 400px;
margin: 0 0 10px 10px;
width: 800px;
}

table#akkilahdot_form {
position: absolute;
float: left;
background: none;
left: 95px;
text-align: left;
top: 95px;
width: 690px;
}

table#akkilahdot_form td{
height: 55px;
vertical-align: top;
}

form#akkilahto-selects label{
position: relative;
float: left;
clear: both;
padding-bottom: 2px;
width: auto;
}

form#akkilahto-selects select{
position: relative;
float: left;
clear: both;
width: 205px;
}

form#akkilahto-selects input{
width: 200px;
}

form#akkilahto-selects label.time_selections{
color: #d33232;
}

form#akkilahto-selects label.price_selections{
color: #6D9A01;
}

form#akkilahto-selects label.destination_selections{
color: #FF6600;
}

form#akkilahto-selects label.other_selections{
color: #2986B0;
}

div#ajaxUpdate {
position: relative;
float: left;
background: #fff url(../i/bg_akkilahdot_table.gif) 0px 10px no-repeat;
display: inline;
margin: 0 0 10px 10px;
width: 950px;
}

table.rantapallo-table {
border-collapse: collapse;
width: 910px;
margin: 28px 20px 32px;
}

table.rantapallo-table th {
/*background: #80b94f;*/
color: #fff;
font-weight: bold;
text-align: left;
border-right: 1px solid #fff;
line-height: 1.2;
}

table.rantapallo-table td {
padding: 5px 0 5px 12px;
border-bottom: 1px solid #ccc;
vertical-align: top;
}

table.rantapallo-table td * {
padding: 6px 11px;
}

table.rantapallo-table tr.alt td {
background: #ecf6fc;

}
table.rantapallo-table tr.over td, table.rantapallo-table tr:hover td {
background: #fecb00;
}

table.rantapallo-table a,table.rantapallo-table a:hover {
color: #6D9A01;
}

table.rantapallo-table a {

text-decoration: underline;
}

table.rantapallo-table th a {
position: relative;
float: left;
padding: 18px 0 29px 10px;
height: 20px;
color: #6D9A01;
background: transparent;
width: 90%;
}

table.rantapallo-table th a:hover {
color: #fff;
background: transparent url(../i/bg_akkilahdot_table_hover_arrow_2.gif) 0 0 no-repeat;
}

table.rantapallo-table th.ordered a{
color: #fff;
background: transparent url(../i/bg_akkilahdot_table_hover_arrow_2.gif) 0 0 no-repeat;
}

div#pagination {
position: relative;
float: left;
margin: 0 20px 18px 20px;
}

div#pagination strong{
color: #6D9A01;
}

div#pagination a:hover{
background: #f5f5f5:
}

div#pagination a:hover{
background: #f5f5f5:
}

ul#akkilahdot_info {
margin-left: 10px;
}


ul#akkilahdot_info li{
position: relative;
float: left;
clear: left;
background: #fff url(../i/hr_30percent.gif) 0 top repeat-x;
padding: 30px 20px 10px;
width: 490px;
}

ul#akkilahdot_info li h3{
margin-top: 0;
}




/*-----------------------------------------------
Matkablogit
-----------------------------------------------*/
div#matkablogit_main_area {
position: relative;
float: left;
background: #fff url(../i/bg_matkablogit.gif) 0 60px no-repeat;
display: inline;
height: 450px;
margin: 0 0 10px 10px;
padding-left: 20px;
width: 780px;
}

#matkablogit h1 {
position: absolute;
display: inline;
left: 20px;
margin: 0;
top: 1.4em;
}

#matkablogit p.description {
position: absolute;
display: inline;
left: 160px;
line-height: 1em;
top: 31px;
width: 300px;
}

div#matkablogit_main_area .column_260px {
margin: 70px 0 0 0px;
padding-bottom: 0;
}

div#matkablogit_main_area .column_260px h2 {
color: #2986B0;
font-size: 1.5em;
margin-bottom: 30px;
}

#matkablogit div#matkablogit_info {
color: #5E5E5E;
margin: 73px 0 0 10px;
width: 200px;
}

#matkablogit div#matkablogit_info h4{
background: transparent url(../i/icon_palm_tree.gif) 0 0 no-repeat;
color: #6D9A01;
font-size: 1.3em;
margin-top: 0;
padding: 10px 0 0 55px;
}

#matkablogit a#perusta_oma_blogi_nuoli {
position:relative;
background: #fff url(../i/btn_perusta_oma_blogi_nuoli.gif) 0 0 no-repeat;
display:block;
font-size:0.7em;
height: 55px;
text-indent:-9999px;
width:205px;
}

#matkablogit a#perusta_oma_blogi_nuoli:hover {
background: #fff url(../i/btn_perusta_oma_blogi_nuoli.gif) -205px 0 no-repeat;
}

#matkablogit div#akkilahdot {
position: relative;
float: left;
display: inline;
margin: 0 0 10px 10px;
width: 800px;
}

#matkablogit div#akkilahdot .column_260px{
background: #fff
}

#matkablogit div#akkilahdot .column_260px h3 {
line-height: 1em;
}

#matkablogit div#akkilahdot .column_260px h3 span{
color:#333333;
display:block;
font-size:0.8em;
}




/*-----------------------------------------------
Sidebar
-----------------------------------------------*/
div.sidebar_box ul {
position: relative;
float: left;
width: 220px;
}

div.sidebar_box li {
padding-left: 5px;
}




/*-----------------------------------------------
Footer
-----------------------------------------------*/

ul.column_260px li.list_without_bullet {
margin: 18px 0 0 0;
list-style-image: none;
} 

ul.column_260px li {
margin-left: 20px;
list-style-image: url(../i/icon_list_arrow_blue.gif);
} 

.column_260px h4 {
font-size: 1.5em;
line-height: 1em;
}

.column_260px h4 span {
font-size: 0.9em;
color: #000;
display: block;
}

div#boarding_pass_line {
position: relative;
float: left;
background: transparent url(../i/bg_footer_line.gif);
height: 62px;
margin: 20px 0 0;
width:  950px;
}