﻿/*

    CSS Document


    Site: Internationella Barnhjälpen i Vrigstad
    URL: http://www.barnhjalpen.se
    Author: PS Kommunikation
    Version: 1.2

    Date: 2009.02.11

*/


/*
 *      DEFAULT
 *
 */

* {
   margin:0;
}

HTML, BODY {
	text-align:center;
	background:url(../images/bgTopBar.gif) repeat-x;
    height:100%;	
}
DIV#wrapper {
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -18em;
	width:960px;
	text-align:left;    
}

/*
 *      MASTHEAD
 *
 */

DIV#masthead {
    background:url(/bilder/bgMastHead.gif) left bottom no-repeat;
    padding-bottom:15px;
}
DIV#logo {
    float:left; 
    display:inline; 
    margin:2.5em 0 3em 10px;
    height:60px;
    width:190px;
}

/* HELPNAV */

DIV#helpNav {
    display:inline;    
    float:right;
    margin-top:6px; 

}
DIV#helpNav UL {
    display:inline;
    float:left;
    list-style: none;
} 
DIV#helpNav UL LI {
    padding:0.5em 0 0 0.9em;
	float:left;
	font-size:0.9em;
	line-height:1.8em;
}
DIV#helpNav UL LI A {
    margin:0;
}

/* MAINNAV */

DIV#mainNav {
    background:url(/images/bgShadowMainNav.gif) repeat-x;
	height:2.5em;
	padding:5px 0 0 10px;
	width:955px;
}
DIV#mainNav UL {
    font-size:1.3em;
    font-weight:bold;
    list-style-type:none;
    margin:0;
}
DIV#mainNav LI {
    background:url(/images/bgMainNavLeft.gif) no-repeat;    
    padding:0 0 0 3px;
    float:left;
    line-height:2em;
}
DIV#mainNav LI A {
    background:url(/images/bgMainNavRight.gif) repeat-x;      
    display:block;
    padding:0 10px 0 10px;    
    text-decoration:none; 
    color:#fff;    
}
DIV#mainNav LI A:HOVER {
    text-decoration:underline; 
}
DIV#mainNav LI.active {
    background:url(/images/bgMainNavLeftSel.gif) no-repeat;    
    padding:0 0 0 3px;
    float:left;
    line-height:2em;
}
DIV#mainNav LI.active A {
    background:url(/images/bgMainNavRightSel.gif) repeat-x;      
    display:block;
    padding:0 10px 0 10px;    
    text-decoration:none; 
    color:#CC1500;
}

/* SUBAV */

/*** subNav ***/

DIV#subNav {
    
}
DIV#subNav UL {

    list-style: none;
    margin:0 0 30px 0;
    padding:5px 0 0 0;
}
DIV#subNav UL LI UL {
    padding:0;
    
}

/* head */

DIV#subNav UL LI A {
    border-bottom: solid 5px #1295c9;
    color:#CC1500;    
    font-family:Verdana, Sans-Serif;
    font-size:13px;
    font-weight:bold;
    margin:0;
    text-decoration:none;
    padding:5px 0;
    display:block;
    
}
/* first */
DIV#subNav UL LI UL LI {
    padding:0;
}
DIV#subNav UL LI UL LI A {
    border-bottom:none;
    color:#222;
    display:block;     
    font:normal 12px/35px Arial;
    height:35px;
    padding:0 10px 0 10px;
    margin:0;
    text-decoration:none;
}
DIV#subNav UL LI UL LI:first-child A {

}
/* second */
DIV#subNav UL LI UL LI UL {
    background:none;
    padding:5px 0;
}
DIV#subNav UL LI UL LI UL LI {
    background:none;
    padding-left:0;
}
DIV#subNav UL LI UL LI UL LI A {
    
}

/* Active */
DIV#subNav UL LI UL LI.open {
    background:none;
}
DIV#subNav UL LI UL LI a.open,
DIV#subNav UL LI UL LI A.active {
    font-weight:bold;
    background:#cc1500;
    color:#fff;
}
DIV#subNav UL LI UL LI UL LI a.active {
    font-weight:bold;
    color:#b11116;
    background:none;
}



/*
UL#subNav {
    background:url(/images/bgSubnav.gif) no-repeat;
    list-style: none;
    margin:0 0 30px 0;
    padding:5px 0 0 0;
} 
UL#subNav LI {
    border-bottom:solid 1px #fff;
    display:block;
    margin:0;  
}
UL#subNav LI A {
    color:#222;
    display:block;     
    font:normal 1em/2.5em Arial;
    height:2.5em;
    padding:0 20px 0 20px;
    margin:0;
    text-decoration:none;
}
UL#subNav LI A:HOVER {
    background:url(/images/bgSubNavHover.gif) no-repeat;
}
UL#subNav LI.current A {
    background:url(/images/bgSubNavActive.gif) no-repeat;    
    color:#fff;
    font-weight:bold;
}
*/

/*
 *      CONTENT COMMON
 *
 */

DIV#content {
    margin:0 10px 0 10px;
    width:940px;
}

/* BREADCRUMB */

UL#breadcrumbs {
    display:block;
    margin:0px 0 5px 10px;
    padding:0;
    list-style-type:none;
}
UL#breadcrumbs LI {
    display:inline;
    font-size:10px;
    padding:0 5px 0 10px;
    border-left:1px solid #ccc;
}
UL#breadcrumbs LI.noArrow {
    border-left:none;
    padding:0 5px 0 0;
}
UL#breadcrumbs LI A {
    color:#616161;
}
UL#breadcrumbs LI A:hover {
    text-decoration:underline;
}

/*
 *      CONTENT DEFAULT
 *
 */


/* PRIMARY CONTENT */

DIV#primaryContent {
    margin:20px 0 40px 0;
    width:800px;     
}

/* SECONDARY CONTENT */

DIV#secondaryContent {
    background:url(/images/bgShadowVert.gif) 600px top repeat-y;
    width:940px;        
}
DIV#placeholder {
    display:inline;
    float:left;
    margin:0 0 0 0;
    width:625px;
}
DIV#usp {
    background:url(/images/bgUSP.gif) left bottom repeat-y;
    height:36em;
}
DIV#uspImage {
}
DIV#uspLinks {
}
DIV#uspText  {
}
DIV#usp H1 {
    color:#fff;
    font-size:1.2em;
    font-weight:bold;
    margin:15px 40px 0 200px;
}
DIV#usp P {
    color:#fff;
    font-size:1.1em;
    margin:0 40px 0 200px;    
}
DIV#spotlight {
    margin:30px 0 0 0;
}
.spot {
    display:inline;
    float:left;
    margin:0 30px 0 0;
    width:180px;
}
.spot H2 {
    font-size:1.4em;
    margin:5px 0;
    
}
.spot P {
    font-size:1em;
    margin-bottom:3px;   
}
.spot STRONG {
    font-size:1em;
    font-weight:bold;
}
.spot A {
    text-decoration:none;
}
DIV#contentSubpage .spot {
    width:220px;
    background:url(/images/bgInfoBottom.gif) left bottom no-repeat;
    padding:0 0 10px 0;    
}
DIV#contentSubpage .spot H3 {
    margin-left:10px;
}
DIV#teaserContent {
    background:#efefef;
    height:100px;
    margin:20px 0 20px 0;
    width:600px;
}
DIV#teaserContent H2 {
    font-size:1.4em;
    font-weight:bold;        
    margin:0 0 10px 210px;
    padding:10px 10px 0 0;
}
DIV#teaserContent P {
    font-size:1em;
    margin:0 0 0 210px;
    padding:0 10px 0 0;    
}
DIV#teaserContent IMG {
    float:left;
}


/* sideBar */

DIV#sideBar {
    display:inline;
    float:right;
    margin:0;
    width:290px;
}
DIV#teaserSidebar {
    background:url(/images/iconHeart.gif) left top no-repeat; 
    display:inline;
    float:right;
    margin:0;
    width:290px;
}
DIV#teaserSidebar H2 {
    font-family:Verdana, Sans-Serif;
    font-size:1.3em;
    font-weight:bold;
    margin:0 0 10px 80px;
}
DIV#teaserSidebar P {
    font-size:1.1em;
    margin:0 0 0 80px;
}
DIV#teaserSidebar .box  {
    margin:10px 0 0 80px;
}
DIV#blog {
    background:url(/images/bgBlogTop.gif) repeat-y;
    margin:30px 0 0 0;    
}
DIV#blogContainer {
    background:url(/images/bgBlogBottom.gif) left bottom no-repeat;
    padding:0 0 10px 0;    
}
DIV#blog H2 {
    font-family:Verdana, Sans-Serif;
    font-size:1.3em;
    font-weight:bold;    
    margin:10px 0 10px 10px;
}
DIV#blog H3 {
    font-family:Verdana, Sans-Serif;
    font-size:1.1em;
    color:#1295C9;
    margin:0 10px 5px 10px;        
}
DIV#blog P {
    color:#222;
    font-size:1.1em;
    margin:0 10px 5px 10px;
}
DIV#blog UL {
    list-style-type:none;
    margin:10px 10px 5px 10px;
}
DIV#blog UL LI {
    background:url(/images/iconArrow.gif) left center no-repeat;
    font-size:0.9em;
    padding:0 0 0 7px;
}
DIV#blog UL LI A {
    text-decoration:none;
}
DIV#blog H3 STRONG {
    color:#CC1500;
}
.blogItem {
    border:none;
    background:url(/images/blogDivider.gif) left bottom repeat-x;
    margin:15px 0 0 0;
    padding:0 0 5px 0;
}
.blogItem SPAN {
    color:#CC1500;
    display:inline;
    margin:0 0 0 10px;
}
DIV#blog DIV.blogItem H3 {
    line-height:2em; 
}
DIV#puffFacebook {
    margin:30px 0 0 0;
}
DIV#puffFacebook H2 {
    font-family:Verdana, Sans-Serif;
    font-size:1.3em;
    font-weight:bold;
    margin:0 0 15px 0;    
}
DIV#puffFacebook P {
    font-size:1.1em;
    margin:0 0 10px 0;     
}
DIV#puffFacebook IMG {
    border:5px solid #999;
    margin:0 0 5px 0;
}
DIV#puffFacebook IMG {
    border:5px solid #999;
    margin:5px 4px 5px 0;
}
DIV#puffFacebook .box {
    float:right;
    margin:10px 0 0 0;
}
DIV#puffFriends {
    margin:30px 0 0 0;
}
DIV#puffFriends H2 {
    font-family:Verdana, Sans-Serif;
    font-size:1.3em;
    font-weight:bold;
    margin:0 0 15px 0;    
}
DIV#puffFriends P {
    font-size:1.1em;
    margin:0 0 10px 0;     
}
DIV#puffFriends IMG {
    border:none;
}
DIV#puffFriends A.hoverPS {
    background:url(/images/friends/logoPSGrey.gif) left top no-repeat;
    display:block;
    height:47px;
    width:73px;
}
DIV#puffFriends A.hoverPS:HOVER  {
    background:url(/images/friends/logoPS.gif) left top no-repeat;
    display:block;
    height:47px;
    width:73px;
}
DIV#puffFriends A.hoverPowerPictures {
    background:url(/images/friends/logoPowerPicturesGrey.gif) left top no-repeat;
    display:block;
    height:47px;
    width:104px;
}
DIV#puffFriends A.hoverPowerPictures:HOVER  {
    background:url(/images/friends/logoPowerPictures.gif) left top no-repeat;
    display:block;
    height:47px;
    width:104px;
}
.puffFriendsItem {
    display:inline;
    float:left;
    margin:0 20px 0 0;
}
DIV#puffFriends .box {
    float:right;
    margin:10px 0 0 0;
}

/*
 *      CONTENT TEXT AND IMAGE
 *
 */

DIV#contentSubpage DIV#content IMG {
    margin:0 0 20px 0;    
}
DIV#contentSubpage DIV#primaryContent {
    display:inline;
    float:left;
    margin:20px 0 40px 0px;
    width:690px;
}

/* sideBar */

DIV#contentSubpage DIV#sideBar {
    display:inline;
    float:left;    
    margin:25px 40px 0 10px;
    width:210px;
}
DIV#contentSubpage DIV#sideBar H2 {
    color:#CC1500;    
    font-family:Verdana, Sans-Serif;
    font-size:1.3em;
    font-weight:bold;
    margin:0 0 10px 0;
}
DIV#contentSubpage DIV#related {
    background:url(/images/bgInfoTop.gif) repeat-y;
    margin:30px 0 0 0; 
    padding-top:10px;   
    
}
DIV#contentSubpage DIV#relatedContainer {
    background:url(/images/bgInfoBottom.gif) left bottom no-repeat;
    padding:0 0 10px 0;    
}
DIV#contentSubpage DIV#related H2 {
    font-family:Verdana, Sans-Serif;
    font-size:1.3em;
    font-weight:bold;    
    margin:0 0 10px 10px;
}
DIV#contentSubpage DIV#related P {
    color:#222;
    font-size:1.1em;
    margin:0 10px 5px 10px;
}
DIV#contentSubpage DIV#friendsContainter {
 
}

/* Friends */

DIV#contentSubpage .friendsItem {
    display:inline;
    float:left;
    margin:20px 20px 0 0;
    width:210px;
    text-align:center;      
}
DIV#contentSubpage .friendsItem IMG 
{
    margin-bottom:15px;
}
DIV#contentSubpage .friendsItem P {
    font-size:1.1em;
    line-height:1.4em;
    text-align:left;        
}
DIV#contentSubpage .friendsItem A {
    font-weight:bold;    
    text-align:left;
}
DIV#contentSubpage H1 A, DIV#contentSubpage H3 A {
    color:#555;
    text-decoration:none;
}

/* Blog */

UL#blogLinks {
    margin:0 0 0 0;
    padding:1em 0;
}
UL#blogLinks LI {
    list-style-type:none;
    font-size:1.1em;    
}
UL#blogLinks LI {
    padding-left:30px;
    background: url(/images/iconRSS.gif) left center no-repeat;
    line-height:24px;
}


/*
*
 *      news
 *
 */
 DIV.newsItem  {
     padding:10px 0 15px 0;
     border-bottom:1px dotted #ccc;
 }
 DIV.newsItem IMG {
     float:left;
     margin-right:10px;
     margin-top:3px;
     background:#fff;
     padding:5px;
}
DIV.newsItem P {
      margin:0;
      padding:0;
}
DIV.newsItem H2 A {
    text-decoration:none;
}
DIV.newsItem P A {
    color:#555;
    text-decoration:none;
}
DIV.newsItem P SPAN {
    display:block;
    font-style:normal;
    font: 10px/11px Arial, Helvetica, sans-serif;
    margin:5px 0 2px 0;
}



/*
.newsItem  { 
    border-bottom:dotted 1px #41abdb;
    padding:0;
    margin:0 0 15px 0;
}
.newsItem  P { 
    margin:0;
}

DIV#contentSubpage .newsItem  SPAN { 
    font-family:Verdana, Sans-Serif;
    font-size:1.0em;
    font-weight:normal;
}
DIV#contentSubpage .newsItem  SPAN
DIV#contentSubpage .newsItem  H2 { 
    margin-top:5px;
}
DIV#contentSubpage .newsItem  IMG {
    margin:0;    
}
*/
/*
 *      CONTACT
 *
 */

DIV#content FIELDSET#formContactinfo {
    display:inline;
    float:left;
}
DIV#content FIELDSET#formMessage {
    display:block;
    float:right;
}

/*
 *      SITEMAP
 *
 */

UL#sitemap {
    margin-bottom:20px;   
}

UL#sitemap LI UL {
    font-size:1.0em;
    margin-top:5px;   
}

/*
 *      FOOTER
 *
 */
.push {
    height:19em;
    display:block;
    clear: both;
    
}
DIV#footer {
    background:#121212;
    height:18em;
    text-align:center;
    margin:0 0 0 0;
    width:100%;   
    clear: both;    

}
DIV#footer A, div#footer A:HOVER {
    color:#999;
}
DIV#footerContainer {
    width:960px;
    text-align:center;
    margin-left:auto; 
    margin-right:auto;     
}
DIV#about {
    display:inline;
    float:left;
    text-align:left;
    width:600px;
}
DIV#about H2 {
    background:url(/images/iconIBHLogo.gif) left center no-repeat;
    color:#fff;
    font-family:Verdana, Sans-Serif;
    font-size:1em;
    font-weight:bold;
    line-height:20px;
    margin:15px 0 10px 0;    
    padding-left:20px;
}
DIV#about P {
    color:#999;
    font-size:1em;
    margin:0 0 10px 0;
} 
DIV#contact {
    display:inline;
    float:right;
    text-align:left;    
    width:290px;
}
DIV#contact H2 {
    color:#fff;
    font-family:Verdana, Sans-Serif;
    font-size:1em;
    font-weight:bold;
    line-height:20px;
    margin:15px 0 0 0;    
}  
DIV#contact UL {
    list-style-type:none;
    margin:10px 0 0 0;
}
DIV#contact LI {
    color:#999;
    font-size:0.8em;
    line-height:1.6em;
    margin:0 0 0 0;    
}
DIV#contact LI STRONG {
    color:#666;
    font-weight:bold;
}
DIV#contact A {
    color:#999;
    text-decoration:none;
}
DIV#contact A:HOVER {
    color:#999;
    text-decoration:underline;
}

/*
 *      CLASSES
 *
 */
.noMargin {
    margin:0;
}
.noMarginRight {
    margin-right:0px;      
}
.hide {
    position: absolute;
	left: -9999px;
	z-index: 100;
}
.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
.clearfix {display: inline-block; clear:both;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
