/* global resets */

/* värit:
vihreä AEBF33
vaaleabeige #f7ffd2
tummabeige #e1dca1 (contentpane-tausta)
pathway 7a6f6f
top-nav musta
*/


* { margin:0; padding:0; }

h1,h3,h4,h5,h6,p,blockquote,form,label,ul,ol,dl,fieldset,address { margin: 0.5em 0; } 

li,dd { margin-left:1em;} 

fieldset { padding:.5em; } 

img {border: 0;}

a img {border: 0;}

table {

    font-size: 1em;
    color: #000000;

}


table.liittyminen {

    font-size: 1em;
    color: #ffffff;

}



h2 {

margin-left: 150px;



}

/*end global resets*/





body {

/*
background-color: #f7ffd2;
*/
background-color: #4f4f4f;

background-image: url(http://www.retkikunta.net/www/images/site/tausta.jpg);
background-repeat: repeat-x;
color: #cccccc;
/*
background-image: url(http://www.retkikunta.net/site/tassu/tausta.gif);
background-repeat: repeat-x;
*/

font: 76.1%/1.3em Arial, Verdana, Helvetica, sans-serif;

text-align: center;

}



#top_a {

background: #000000;

}



#top_a_left {

position: absolute;
top: 88px;
right: 110px;
font-size: 14px;
text-indent: 25px;
color: #eef2d0;
width: 120px;
height: 27px;
background-image: url(http://www.retkikunta.net/site/tassu/search_tausta.jpg);
z-index: 5;

}





#top_a_right {

position: relative;
top: 20px;
left: 600px;

font-size: 10px;

color: #eef2d0;

}





#top_a_right a {

font-size: 10px;

padding: 3px;

color: #eef2d0;



}


#pathway {
position: relative;
float:left;
line-height: 22px;
vertical-align: middle;
/*text-indent: 167px;*/
text-indent: 40px;
width: 750px;

/*
background-image: url(http://www.retkikunta.net/site/tassu/pathway_tausta.jpg);
*/

height: 25px;
color: #AEBF33;
}


#content_wrap {
position: relative;
float:left;
width: 828px;
/*
background-color: #f7ffd2;
background-image: url(http://www.retkikunta.net/site/tassu/content_tausta.jpg);
background-repeat: no-repeat;
*/
padding-bottom: 15px;
padding-top: 10px;
padding-left: 10px;
padding-right: 10px;
background-color: #000000;
border: 1px solid #a2c048;
}




/*Typography -->

These control the general, asthetic, typographical/text

elements of the css*/



h1 {

color: #AEBF33; 

font-size: 1.4em; 

font-weight: bold;

}



h2 {

color: #AEBF33; 

font-size: 1.3em; 

font-weight: bold;

}



h3 {

color: #AEBF33; 

font-size: 1.2em; 

font-weight: bold;

}



h4 {

color: #AEBF33; 

font-size: 1.1em; 

font-weight: bold;

}



h5 {

color: #AEBF33; 

font-size: 1em; 

font-weight: bold;

}







h6 {

color: #AEBF33; 

font-size: 0.9em;

font-weight: bold;

}



blockquote {

background: #EEF2D0;

border: 2px solid #DFE7A9;

border-left: 4px solid #DFE7A9;

margin: 10px;

padding: 0.5em;

color: #666;

line-height: 140%;

}







pre {

background: #fff;

color: #333;

padding: 10px;

border: 1px solid #EEF2D0;

border-left: 5px solid #EEF2D0;

}



/*General link Styling*/

a:link, a:visited {

color: #707030; 

text-decoration: none;

}



a:hover, a:active {

color: #798F2C;	

text-decoration: underline;

}





/*List item Styling*/

li {

list-style-type:none;



background: url(http://retkikunta.net/www/templates/jj_serenity/images/bullet.gif) no-repeat 0px 5px;

padding-left: 10px;

margin-left: 0px;

}



.main_content ul {



background-color: #e1dca1;
padding: 10px;
border: 1px solid #222222;
font-size: 1em;

margin: 3px;


}





/*Graphical Elements

These styles provide management 

of content's appearences.

*/



hr { 

background: transparent; 

height:1px; 

border: 1px solid #ccc;

}



.pagenav {

/* this is for formatting texts where you

see "<< Start < Previous 1 Next > End >>" links

within content*/



font-weight: normal;





font-size: 1em;



}



a.pagenav, a.pagenav:visited {

/* as above but specifically if they are links */

font-weight: bold;

color: #AEBF33;

}



a.pagenav:hover {

/* as above but specifically when the links are hovered over */color: #FF9900;

color: #666;

}



.pagenav_prev a {

float: left;

width: 430px;

font-weight: bold;

color: #AEBF33;

}



.pagenav_next a {

float: right;

width: 40px;

font-weight: bold;

color: #AEBF33;

} 





.back_button  {
float: left;
background: #97C932;
background-image: url("http://retkikunta.net/templates/jj_serenity/images/button_bg.gif" );
background-repeat: repeat-x;
padding: 1px 0 2px 7px;

width: 70px;

margin: 10px 0px 5px 0px;

color: #fff;

font-weight: bold;

} 



.back_button a  {

color: #fff;

}



.small {

/* a symantic style to allow you to add text with this class, that

is used for small text, like date/written by etc */

font-family: Arial, Verdana, Helvetica, sans-serif;

font-size: 9px;

color: #999;

letter-spacing: 0.1em;

margin: 0;

padding: 0;

text-decoration: none;

font-weight: normal;

}



.button {

/* button style for Joomla component, form and module buttons*/

background: #339933;
background: url(http://retkikunta.net/templates/jj_serenity/images/button_bg.gif) repeat-x;

border: 1px solid #B8DB6F;

color: #FFFFFF;

margin: 4px;

font-weight: normal;

text-align: center;

padding: 1px 0 3px 0;

}



.inputbox {

/* the look of input boxes in forms */

font-size: 12px;

color: #666;

background: #dfe7a9;

border: 1px solid #f9fbce;

padding: 1px 0px;

margin: 0;

width: 130px;

}



/**

Joomla General styling

*/



.createdate {

/* styling the date the content was created on*/

background:url(http://retkikunta.net/templates/jj_serenity/images/date.png) no-repeat 0 5px;

font-size: 11px;

color:  #666;

text-indent:21px;

font-weight: normal;

margin:0;

margin: 7px 0 5px 4px;

padding: 5px 0 5px 0;

}





.modifydate {

/*Styles the "Last updated on" text

at the end of articles/contents */

background: url(http://retkikunta.net/templates/jj_serenity/images/bullet.gif) no-repeat 0px 4px;

text-indent: 12px;

font-size: 10px;

color: #666;

text-decoration: none;

font-weight: normal;

}


.blog_more {
background-color: #e1dca1;
padding: 10px;
border: 1px solid #222222;
}


.readon {

float: right;
background: url(http://www.retkikunta.net/www/images/site/luelisaa.gif) no-repeat;
background-position: right;
background-color: #333333;
text-align: left;
width:130px;
padding: 5px;
border-right: 5px solid #333333;


margin: 15px;

}





a.readon:link, a.readon:visited, a.readon:hover {

/* formatting the "Read on..." link on blog layout pages */


color: #fff; 

text-decoration: none; 

font-size: 11px;

}



/*Default styling for the pathway 

displayed by the mosPathWay()*/





a.mainlevel {

color: #AEBF33;
  
  font-size: 11pt;
  text-decoration: none;
  text-style: strong;
font-weight: 500;
font-variant: small-caps;

padding-left: 10px;
padding-right: 10px;

}


a.mainlevel:active {
background-color: #f1d738;
}

a.mainlevel:hover {

background-color: #869d31;

color: #ffffff;

}



a.pathway:link, a.pathway:visited {

color: #AEBF33;

}



a.pathway:hover {

color: #666;

}







/* 



Joomla Styling for Contents



These are all the styles for content



*/







.contentpane {


/* This is used mainly for Table that holds all non-article information (components, category lists, contact forms, etc).
all contained within a single table*/

width: 100%;
background-color: #e1dca1;

padding: 10px;
font-size: 1em;
border: 1px solid #222222;
margin-top: 5px;
color: #111111;


}







.contentpaneopen {	

width: 100%;
background-color: #e1dca1;
padding-left: 10px;
padding-right: 10px;
padding-top: 5px;
padding-bottom: 5px;
color: #111111;
font-size: 1em;
border: 1px solid #222222;
margin-bottom: 5px;


}








.moduletable .contentpaneopen {	


background-color: #e1dca1;


font-size: 1em;



margin-bottom: 10px;



}


.moduletable .latestnews ul {

/* muokattava */

background-color: #e1dca1;
padding: 0px;
margin 3px;
border: 0;
}




.contentheading {



/* Used as the Title of the content, article, etc. being displayed,
it is also used for Section's heading*/

width: 100%;

background: #333333;

margin-bottom: 15px;




padding: 5px;
color: #AEBF33; 

font-size: 1.3em; 

font-weight: bold;


}




.td .contentheading {
margin-left: 100px;
width: 100%;
}


.contentpagetitle {



/*Title of articles*/


width: 100%;

font-size: 16px;


font-weight: bold;

text-align:left;



}







.componentheading {



/* Used to format a components heading or title */



font-size: 1.3em;



margin-bottom: 0.7em;




border-bottom: 2px solid #AEBF33;



font-weight: bold;



color: #AEBF33;



}

.mod_login {

padding: 0px;
margin: 0px;

}





table.contenttoc {



margin: 10px;



padding: 0px;



float:right;



}







/*



Joomla Sections Styles



Styling of sections tables 





*/







.sectiontableheader {



/* This is for styling the section table headers on a SECTION's page.*/




background-color: #e1dca1;



padding: 2px 0 5px 2x;



color : #AEBF33;



font-weight : bold;



}







.sectiontableentry1 {



/* this is used when there's a whole list of data to provide and

you need to create alternate colors for each row of data. This is

the first color */


background-color : #f7ffd2;

padding: 1px 0 1px 10px;



}







.sectiontableentry2 {



/* this is the second color for the row*/



background-color : #f7ffd2;

background-color: #e1dca1;


padding: 1px 0 1px 10px;



}







/*  Polls  */







.poll {



/* polls texts */



font-size: 1em;



line-height: 14px



}







/*this helps make the poll



look better as it removes the



section and table entry lines*/



.poll .sectiontableentry1, .poll .sectiontableentry2 {



background: none;



}







.pollstableborder {



/* set the border properties of the polls voting table */



border: none;



/*width: 18%;*/



border: none;



}







.poll td {



/* set the table data properties of the polls voting table */



font-size: 0.95em;



color: #AEBF33;



font-weight: normal;



padding: 4px;



}







/*



MODULE STYLING



These stylings are to format the way modules are



displayed. 



*/







.moduletable {/*generic for all modules*/



/* well.. for formatting the table cells of the module table */







font-size: 1em;


/* SIVUMENUN TYYLIMÄÄRITTELY */



background-color: #e1dca1;
/*background-image: url(http://www.retkikunta.net/site/tassu/tassutausta.jpg);*/
background-repeat: repeat-y;
/*
background: #ffffff;
*/
/*
background: #ebf8bb;
*/
margin-top: 10px;

/*
border-top: 1px solid #97C932;

border-bottom: 1px solid #97C932;

border-left: 1px solid #97C932;

border-right: 1px solid #97C932;
*/
border: 1px solid #222222;
padding-left: 4px;

padding-right: 4px;

}















/*all sidebar modules*/







#sidebar .moduletable h3, .moduletable-leftnav h3 {


background: #96b831 url(../images/mod_header_bullet.gif) no-repeat;



font-size: 12px;



height: 22px;



margin-top: 0px;



font-weight: bold;



margin-left: -4px;

margin-right: -4px;



color: #fff;



line-height: 22px;



/*width: 20%;*/



text-indent: 10px;



}







#sidebar .moduletable-leftnav h3 {



margin-bottom: 0;



}







#sidebar .moduletable-leftnav { 



padding: 0px;



margin: 0;



}







/*SIDEBAR MENU STYLING STARTS*/







#sidebar #mainlevel{




padding: 0;



}







#sidebar ul#mainlevel {



list-style-type: none;





width: 100%; 





padding: 0px; 



}







#sidebar #mainlevel li {



text-indent: 0;



padding: 0;



background: none;



list-style-type: none;



border-bottom: 1px solid #eef2d0;



margin: 0;



 }







#sidebar #mainlevel a {



display: block;



height: 22px;



line-height: 22px;



text-indent: 8px;



background-color:#dfe7a9;



color: #798F2C;







text-decoration: none;



}







* html body #mainlevel a { 

width: auto; 

color: #eef2d0;

font-size: 14px;



}







#sidebar #mainlevel li a:hover, 



a#active_menu:link, 



a#active_menu:visited { 



background-color: #bdce48; 



color: #fff;



border-right: 3px solid #bdce48; 



}







/*TOPMENU STYLING STARTS*/
















/*search box styling top left*/




.search input {
background: none;
border: 1px solid #a2c048;
width: 80px;
color: #eef2d0;



}









.search input:hover {







color: #eef2d0;



}


























#wrapper {
position: relative;
width: 850px;
margin-left: auto;
margin-right: auto;
margin-bottom: 15px;
margin-top: 0px;
padding: 0px;
text-align:left;


}





















#top_a {





height: 15px;





width: 100%;





padding: 0px;





margin: 0px;





line-height: 15px;






}
























#ylakotelo {

position: relative;

line-height: 22px;
vertical-align: middle;

height: 25px;
color: #AEBF33;
float:right;


width: 90px;

text-align: right;


}




#branding_header {


float:left;


width: 850px;

/*
background-image: url(http://www.retkikunta.net/site/tassu/branding_tausta.jpg);
*/
background-image: url(http://www.retkikunta.net/www/images/site/ylapalkki.jpg);
background-repeat: no-repeat;

height: 104px;



}

#top_nav {
float: left;
width: 848px;
border-left: 1px solid #a2c048;
border-bottom: 1px solid #a2c048;
border-right: 1px solid #a2c048;

text-align: center;
vertical-align: middle;


background-image: url(http://www.retkikunta.net/www/images/site/path_tausta.jpg);

line-height: 33px;
height: 37px;



}











#sidebar {
float: left;
width: 20%;

/*
background-image: url(http://www.retkikunta.net/site/tassu/leo.jpg);
background-repeat: no-repeat;
background-position: bottom;
*/
color: #111111;
}


.allvideos {
padding: 10px;


}



#main_content {

float: right;


min-height:400px;

  height:auto !important;

  height:400px;



width: 78%;

margin-top: 5px;



}


























#footer  {
position: relative;
float: left;
width: 850px;

margin-top: 15px;


text-align: center;

color: #AEBF33;






}




.jomauthor {
background-image: url(http://www.retkikunta.net/site/authorcomment.jpg);
background-position: bottom right;
background-repeat: no-repeat;
background-color: #f7ffd2;
}



.jomentry1{
background-color : #f3fec2;
border: 1px solid #222222;
margin-bottom: 3px;
}


.jomentry2 {
background-color : #f7ffd2;
border: 1px solid #222222;
margin-bottom: 3px;
}


.contentdescription {

color: #fff;

}

.adminform {

color: #fff;
}




 body.mceContentBody {

background-color: #FFFFFF !important;
color: #000000;
background-image: none;

}