/*
	###############################################################################
	
	Tilipiste Oy Helsinki
	www.tilipiste.com
	
	Styles affecting defined groups of elements i.e. widgets that display content common to each other
	
	Widgets:
	--------
	HEADER
	FOOTER
	NAVICONTAINER
	LIST_PALVELUT_CONTAINER
	LIST_NEWS_CONTAINER
	LIST_PAGE_LINKS
	GOOGLE_CONTENT
	NETVISOR_AD
	LIST_WIDGETS_RIGHT
	LINKEDIN_COMPANY_WIDGET	
	
	Created: Tomi Sarpola / 30.4.2008
	
	###############################################################################
*/




/*  HEADER FORMATTING
    Style definitions for the layout structure element FOOTER.
   
    Gives the text styles and link styles to the elements in FOOTER.
 
    Created: Tomi Sarpola / 24.5.2008
    Last Modified: Tomi Sarpola / 31.5.2008	 */

	
	#header h3 {
		padding: 0 0 0 0px;
		margin-top: 18px; /* aligned to logo with pixel sizes*/
		margin-left: auto; 
		margin-right: auto;
	}	
	
	#header img.logo_liitto{
		float: right;
		width: 190px;
		border: none;
		margin: 70px 0px 0px 0px; /* aligned to logo with pixel sizes, 12px from right_container's left side*/
	}
	

/*  END OF HEADER FORMATTING */


/*  FOOTER FORMATTING
    Style definitions for the layout structure element FOOTER.
   
    Gives the text styles and link styles to the elements in FOOTER.
 
    Created: Tomi Sarpola / 24.5.2008
    Last Modified: Tomi Sarpola / 31.5.2008	 */

	
	#footer { 
		text-align: center;
		font-size: 9px;
		text-transform: uppercase;
		letter-spacing: 1px;
		color: #333;
		margin-top: 25px;
	}
	
		
	#footer a {
	   color: #333;
	   text-decoration: underline;
	}
	

/*  END OF FOOTER FORMATTING */


/*  NAVICONTAINER
    Style definitions for box with a list of navigation items.
   
    Gives a green right divider to the container with green header.
    List items use center aligned text, white background, no border and green underlined text effect on hover.
 
    Created: Tomi Sarpola / 24.5.2008
    Last Modified: Tomi Sarpola / 25.5.2008	 */

	#navicontainer {
	   margin: 0 0 0 0;
	   width: auto; 
	   border-top: 26px solid #AD6;
	   border-right: 3px solid #AD6;
	   border-bottom: 1px solid #AD6;
	   border-left: 1px solid #AD6;
	   padding: 0 0 0 0;
	}
				
	#navicontainer ul {
	   width: auto;
	   margin: 0 0 0 0;
	   padding: 0px 0px 8px 0px;
	   list-style-type: none;
	}

	#navicontainer  li {
		width: auto;
		border-bottom: 1px dotted #AD6;
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
		background-color: #FFF;
	}
	
	#navicontainer a {
		display: block;
		padding: 3px 5px 3px 5px;
		text-align: center;
		border: solid 2px #AD6;
		font-weight: bold;
		text-decoration: none;
		text-transform: uppercase;
		letter-spacing: 2px;
	}
			
	#navicontainer a:link, #navicontainer a:visited {
		color: #999;
		border-color: #fff;
	}
	
	#navicontainer a:hover {
		color: #AD6;
	}

/*  END OF NAVICONTAINER */


/*  LIST_PALVELUT_CONTAINER
    Style definitions for box with a list of news items.
   
    Gives a grey box to the container with grey header.
    List items use left aligned text, ligh grey background, dark grey border and white background effect on hover.
 
    Created: Tomi Sarpola / 24.5.2008
    Last Modified: Tomi Sarpola / 25.5.2008	 */
   
	#list_palvelut_container {
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 0px 0px;	   
		width: 100%;
		float: left;
		font-size: 11px;		
		background-color: #3A3;
		color: #FFF;
		border: 1px solid #3A3;
	}
		
	#list_palvelut_container h5 {
		width: auto;
		background-color: #3A3;
		margin: 0px 0px 0px 0px;
		padding: 5px 12px 5px 12px;
		font-weight: bold;
		text-transform: none;
		letter-spacing: 1.5px;
	}
	
	#list_palvelut_container h5 a {
		width: 100%;
		color: #FFF;
		text-decoration: none;

	} 
	
	#list_palvelut_container ul {
		width: auto;
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 8px 0px;
		list-style: none;
		background-color: #FFF;
	}
	
	#list_palvelut_container li {
		width: auto;
		border-bottom: 1px dotted #3A3;
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
	}

	#list_palvelut_container li a {
		display: block;
		font-weight: normal;
		text-transform: uppercase;
		letter-spacing: 1px;
		padding: 3px 12px 3px 12px; 
		border-style: solid;
		border-width: 0px;
	}
	
	#list_palvelut_container li a:link, #list_palvelut_container li a:visited {
		color: #666;
		text-decoration: none;
	}
	
	#list_palvelut_container li a:hover {
		background-color: #AD6;
		color: #666;
	}
   
/*  END OF LIST_PALVELUT_CONTAINER */


/*  LIST_NEWS_CONTAINER
    Style definitions for box with a list of news items.
   
    Gives a grey box to the container with grey header.
    List items use left aligned text, ligh grey background, dark grey border and white background effect on hover.
 
    Created: Tomi Sarpola / 24.5.2008
    Last Modified: Tomi Sarpola / 25.5.2008	 */
	
	#list_news_container {
		margin: 18px 0 0 0;
		padding: 0 0 0 0;
		width: 100%;
		float: left;
		font-size: 11px;
		border: solid 1px #999;
	}
	
	#list_news_container h5 { 
		width: auto;
		background-color: #AAA;
		color: #FFF;
		margin: 0 0 0 0;
		padding: 5px 5px 5px 12px;
		font-weight: bold;
		text-transform: none;
		letter-spacing: 1.5px;
	}	
	
	#list_news_container ul {
		width: auto;
		margin: 0px 0px 0px 0px;
		padding: 2px 0 8px 0;
		list-style-type: none;
		background-color: #FFF;
	}

	#list_news_container li {
		width: auto;
		border-bottom: 1px dotted #999;
		margin: 0 0 0 0;
		padding: 2px 0px 2px 0px;
	}
	
	#list_news_container a {
		width: auto;
		display: block;
		font-weight: normal;
		text-transform: none;
		letter-spacing: 0.75px;
		padding: 3px 12px 3px 35px; 
		border-style: solid;
		border-width: 0px;
		background-image: url(../img/bullet_lgr.gif);
		background-repeat: no-repeat;
		background-position: 12px;
	}

	#list_news_container a.more {
		background-image: none;
		padding: 3px 12px 3px 12px;
	}
	
	#list_news_container a:link, #list_news_container a:visited {
		color: #666;
		text-decoration: none;
		border-color: #EEE;
	}
	
	#list_news_container a:hover {
		color: #666;
		background-color: #EEE;
		border-color: #FFF;
	}

/*  END OF LIST_NEWS_CONTAINER */


/*  LIST_PAGE_LINKS
    Style definitions for box with a list of links to partner web pages.
   
    Gives a left margined area for the content.
    List items use left aligned text, ligh green bullet image,light green background effect on hover.
 
    Created: Tomi Sarpola / 24.5.2008
    Last Modified: Tomi Sarpola / 26.5.2008	 */

	#list_page_links {
		width: 100%;
		float:left;
		margin-top: 0px;
		margin-left: auto; 
		margin-right: auto;
		padding: 0 0 0 0;
	}
	
	#list_page_links ul {
		margin: 0 48px 0 12px;
		padding: 0 0 0 0;
		list-style-type: none;
		border-bottom: 1px dotted #999;
	}
				
	#list_page_links a {
		display: block;
		width: auto;
		padding: 5px 0px 5px 25px;
		font-weight: normal;
		text-transform: none;
		letter-spacing: 1.5px;
		border-top: 1px dotted #999;
		background-image: url(../img/bullet_lgr.gif);
		background-repeat: no-repeat;
		background-position: 5px;
	}
			
	#list_page_links a:link, #list_page_links a:visited {
	   color: #999;
	   text-decoration: none;
	}
			
	#list_page_links a:hover {
	   background-color: #AD6;
	   color: #666;
	}
	
/*  END OF LIST_PAGE_LINKS */


/*  GOOGLE_CONTENT
    Style definitions for a page with Google search results.
   
    Created: Tomi Sarpola / 29.5.2008
    Last Modified: Tomi Sarpola / 30.5.2008	 */
	
	body.google_content {
		background-color: white;
	}
	
	#google_content { 
		padding: 0 0 0 0;
		padding: 0 0 0 0;
		width: 600px;
		border: solid 1px #999;
		background-color: white;
	}
	
	#google_content html, #google_content body, #google_content table {
		width: 600px;
	}

/*  END OF GOOGLE_CONTENT */

/*  NETVISOR_AD
    Style definitions for box with a list of news items.
   
    Gives a green right divider to the container with green header.
 
    Created: Tomi Sarpola / 18.9.2010
    Last Modified: Tomi Sarpola / 18.9.2010	 */

	#netvisor_ad {
	   margin: 0 0 0 0;
	   width: auto; 
	   border-top: 26px solid #AD6;
	   border-right: 3px solid #AD6;
	   border-bottom: 1px solid #AD6;
	   border-left: 1px solid #AD6;
	   padding: 0 0 0 0;
	}

/*  END OF NAVICONTAINER */

/*  list_widgets_right
    Style definitions for box with a list of widget items.
   
    Gives a white box to the container with grey header.
 
    Created: Tomi Sarpola / 2011
    Last Modified: Tomi Sarpola / 25.4.2011	 */
	
	#list_widgets_right {
		margin: 18px 0 0 0;
		padding: 18px 0 18px 0;
		width: 100%;
		float: left;
		border: solid 1px #AAA;
		border-top: 7px solid #AAA;
		background-color: #FFF;
	}

/*  END OF list_widgets_right */

/*  LinkedIn_Company_widget
    Style definitions for box with LinkedIn Company profile link.
   
    Gives a light grey box to the container.
 
    Created: Tomi Sarpola / 2011
    Last Modified: Tomi Sarpola / 25.4.2011	 */
	
	#LinkedIn_Company_widget {
		margin-left: 12px;
		padding: 3px 6px 1px 4px;
		width: auto;
		float: left;
		border: outset 1px #EEE;
		-moz-border-radius: 5px;
		border-radius: 7px;
		background-color: #F3F3F3;
	}
	
	#LinkedIn_Company_widget a {
		width: auto;
		color: #666;
		font-size: 10px;
		font-weight: bold;
	}
	

/*  END OF LinkedIn_Company_widget */

/*  AddThis_Simple
    Style definitions for positioning the AddThis-link.
    
    Created: Tomi Sarpola / 2011
    Last Modified: Tomi Sarpola / 26.4.2011	 */

	#AddThis_Simple {
		margin-top: 7px;
		margin-left: 12px;
		float: left;
	}

/*  END OF AddThis_Simple */