/*
  
 	Stilmall för Folkteatern Gävleborg
 	Copyright 2010
 	www.gavlefolkteater.se
 	
 	@package    GavleFolkteater
 	@author     Patrik Wibron, Extrude Interactive AB
 	 
 */
 
 
@font-face {
	font-family: "Luxi Sans";
	src: url('../fonts/luxisans.otf');
}

body {
	background: #FFF;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 80%;
    padding-bottom: 15px;
}

p {
	font-size: 1em;
	/*
	font-family: Garamond, Georgia, "Times New Roman", Times, Serif;
	*/
	font-family: Helvetica, Arial, sans-serif;
	line-height: 135%;
	margin: .3em 0 1em 0;
}

a {
    color: #7b7343;
    text-decoration: none;
}
a:visited 
{
	color: #5c531f;
}
a:hover 
{
	text-decoration: underline;
}
 
/* ---- Headings ---- */
h1 {
	color: #353535;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 1.5em;
	font-weight: bold;
	letter-spacing: -1px;
	line-height: 150%;
	margin: 0 0 .8em 0;
}

h1#Logo {
    float: left;
    height: 100px;
    border-right: 11px solid #d2d2ca;
    margin:0;
}

h2 {
	color: #373737;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 1.25em;
	font-weight: bold;
	letter-spacing: 0px;
	margin: .4em 0 .6em 0;
}

h3 {
    color: #353535;
   	font-family: Helvetica, Arial, sans-serif;
	font-size: 1.2em;
	margin: 0 0 .7em 0;
}


/* ---- Sections ---- */
div#Container {

}
div#TopNavigation {
    background: #D1D1C9;
    overflow: hidden;
    height: 1%;
    position: relative;
    padding: 2em 0 1em 0;
    text-align: right;
}
    div#TopNavigation ul {
        list-style-type:none;
        text-align: right;
        z-index: 100;
    }
        div#TopNavigation ul li {
            display: inline;
            position: relative;
            margin-left: 1.3em;
        }
            div#TopNavigation ul li.active a, 
            div#TopNavigation ul li a:hover {
                text-decoration: underline;
            }
            div#TopNavigation ul li a {
                color: #333;
                font-weight: bold;
                font-size: 1.1em;
                text-decoration: none;
                text-transform: uppercase;
            }
            /*
            div#TopNavigation ul li:hover ul, 
            div#TopNavigation ul li:hover ul li a { display: block; }
            div#TopNavigation ul li ul
            {
            	position: absolute;
            	margin:0;
            	right: 0;
            	padding:0;
            	z-index: 100;
            	padding-top: .5em;
            	display: none;
            }
            div#TopNavigation ul li ul li a 
            {
            	color: #555;
            	float: right;
            	display: inline;
				font-size: .9em;
				background: #AAA;
				padding: .3em;
            }
				div#TopNavigation ul li ul li
				{
					margin:0;
				}
			*/
.textresizer 
{
	width: 960px;
	margin: 0 auto 5px auto;	
}
.textresizer li a 
{
	font-size: 11px !important;
	color: #777 !important;
}
            
div#Header {
    background: #948D65;
    z-index: 1;
}

div#ImageSection {
    background: #28251c url("/images/imageRotatorBg.png") repeat 50px 24px;
    color: #E6E8B0;
    padding: 0;
    height: 1%;
    overflow: hidden;
    margin-top: .8em;
}
    div#ImageSection div.EventList {
        float:left;
        margin-top: 23px;
        width: 220px;
    }
    div#ImageSection div.EventList ul {
        list-style-type:none;
        margin:0;
        padding:0;
        line-height: 100%;
    }    
        div#ImageSection div.EventList ul li {
            font-weight: bold;            
            font-size: 12px;
            height: 24px;
            line-height: 26px;
            text-indent: .5em;
            text-transform: uppercase;
        }
            div#ImageSection div.EventList ul li.active {                
                background: #4d4d4f;
                border-top: 1px solid #929497;
                border-bottom: 1px solid #929497;
                height:23px;
            }
            div#ImageSection div.EventList ul li a {
                color: #E6E8B0;
                display: block;
                text-decoration: none;
            }
                div#ImageSection div.EventList ul li a:hover {
                    text-decoration: underline;
                }
            
div.imageset {
    overflow: hidden;
    background: #2c2a22;
    height: 220px;
    padding: 15px 0 0 20px;
    margin-bottom: 9px;
    margin: 0 auto;
    position: relative;
}
    div.imageset div.image, 
    div#ImageSwitcher div.current {
        float: left;
        height: 220px;
        width: 200px;
        text-align: center;
        overflow: hidden;
        margin-right: 10px;
    }
    div.imageset ul 
    {
    	margin:0;
    	padding:0;
    	list-style-type: none;
    }
    div.imageset ul li 
    {
    	width: 240px;
    	background: #2c2a22;
    	float: left;
    	height: 215px;
    	margin:0;
    	padding:0;
		opacity: .60;
		-moz-opacity: .60; 
		-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
		filter: alpha(opacity=60);  
    }
    div.imageset ul li img  
    {
        width: 240px;
        height: 215px;
    }
    .opacity {
        opacity: 100;
        -moz-opacity: 100; 
        filter: alpha(opacity=100);
    }

div#ImageSwitcher div.current {
    display: none;  
}

div#Content {
    margin: 2em auto 0 auto;
    overflow: hidden;
    width: 960px;
}
	div.LeftColumn 
	{
		width: 210px;
		float: left;
	}
    div.LeftSection {
        float: left;
        margin: 0 1em;
        width: 510px;
    }
        div.LeftSection ol, 
        div.LeftSection div#sitemap ul {
            line-height:160%;
            margin: 0 1.5em;
            list-style-type:disc;
        }
    div.RightSection {
        float: right;
        width: 210px;
    }

/* ---- Icons ---- */
ul.Icons {
    margin:0;
    padding:0;
    list-style-type:none;
}
ul.Icons li {
    display: inline;
}
    ul.Icons li.active a {
        font-weight: bold;
    }
    ul.Icons li a {
        background-color: #B2AB8B;
        color: #222;
        display: block;
        width: 70px;
        text-align: center;
        padding: 23px 0;
        margin-top: 23px;
        float: right;
        margin-left: 10px;
    }
        ul.Icons li a:hover {
        }

/* ---- Event calendar ---- */
table#Calendar, 
table#ArchiveListing {
    border-collapse: collapse;
    width:100%;
}

    table#Calendar thead tr th {
        border-bottom: 1px solid #CECECE;
        font-size: 1.2em;
        padding: .3em .3em .4em .3em;
        text-align: left;
    }
    table#Calendar tbody tr td{
        border-bottom: 1px solid #DDD;
        padding: .8em .3em;
    }
        table#Calendar tbody tr td a {
            color: #333;
        }
    table#Calendar tbody tr.odd td {
        background-color: #F5F5F5;
    }
    
/* ---- Archive listing table ---- */
table#ArchiveListing thead tr th {
    border-bottom: 1px solid #CECECE;
    font-size: 1.2em;
    padding: .3em .3em .4em .3em;
    text-align: left;
}
    table#ArchiveListing tbody tr td {
        padding: .4em .2em;
    }
    table#ArchiveListing tbody tr.firstrow td {
        padding-top: .5em;
    }
        table#ArchiveListing tbody tr.odd td {
            border-bottom: 1px solid #DDD;

        }

/* ---- Breadcrumbs ---- */
div#Breadcrumbs 
{
	margin-top: 5px;
    padding: 1em 0 0 0;
    background: url("../images/submenu_bg.png") repeat-y center #968f65;
}
    div#Breadcrumbs ul {
        width: 960px;
        margin: 0 auto;
    }
        div#Breadcrumbs ul li {
            display: inline;
            padding-left: .5em;
            padding-right: .5em;
        }
        div#Breadcrumbs ul li a 
        {
        	color:#333;
        }
        div#Breadcrumbs ul li a.active 
        {
        	font-weight: bold;
        }

/* ---- Stafflisting ---- */
div#Staff {
    overflow: hidden;
}
    div#Staff div.person {
        float: left;
        margin-left: 10px;
        width: 300px;
    }
    div#Staff div.person h4 
    {
    	margin-bottom: .8em;
    	font-size: 13px;
    }
    div.StaffCategory 
    {
    	margin-bottom: 1em;
    	height: 1%;
    	overflow: hidden;
    }
    div#Staff div.person p 
    {
    	margin-bottom: 0;
    }
    div#Staff h2 
    {
    	border-bottom: 1px solid #DDD;
    	padding-bottom: .4em;
    	margin-bottom: .7em;
    }

div#Footer div.center_960 {
    margin-top: 3em;
    padding-top: 1em;
    border-top: 1px solid #DDD;
    height: 60px;
    position: relative;
    text-align: center;
}
    div#Footer p {
        margin-top: 0;
    }
    div#Footer ul, div#Footer ul li {
        margin:0;
        padding:0;
    }
    div#Footer ul li {
        display: inline;
        margin-left: 1em;
    }


/* ---- A-Ö-listing ---- */
div#Index div.AZIndexItem {
    display: inline;
    padding-right: .5em;
}
    div#Index div.AZIndexItem a {
        font-weight: bold;
    }
div.Letter h5 {
    margin-bottom: .2em;
}
div.Letter {
    margin-bottom: 1em;
}
div.PageItem {
    margin: .3em 0;
}

/* ---- Eventlisting on homepage ---- */
div#Listing div {
    margin-bottom: 1.5em;
    border-bottom: 1px solid #CCC;
    padding-bottom: 15px;
}
div#Listing .Date 
{
	color: #555;
	margin-bottom: 5px;
}
div#Listing h4 
{
	margin-top: 5px;
	margin-bottom: 0;
}
div#Listing p 
{
	margin-bottom: 0;
}

/* ---- Image gallery ---- */
div.galleryImage {
    float: left;
    width: 220px;
    margin-right: 10px;
}
div.gallery div.Description {
    margin-top: .8em;
}

#videoArea { 
    display:block;
    height:306px;
    margin-bottom: 1em;
    width:512px;
}

.search { margin-top: .5em }
.search input.SearchField 
{
	background: #d2d2ca;
	border: 0;
	font-weight: bold;
	color: #222;
	padding: 4px 3px;
}
.search input.SubmitBtn
{
	border:0;
	font-weight: bold;
	color: #333;
	background: #d2d2ca;
	padding: 3px 5px;
	cursor: pointer;
}

.rightImages {
    margin-left: 0;
    padding-left: 0;
    list-style-type: none;
}
.rightImages li {
    margin-bottom: 1em;
}


/* ---- Classes ---- */
.Facebook { margin-top: 20px; }
.center_960 { width: 960px; margin:0 auto}
.clear { clear: both; }
.leftalign { float: left; }
.rightalign { float: right; }
.noborder {border:none !important}
.ucfirst { text-transform: capitalize}
.uppercase { text-transform: uppercase; }
#fancybox-title-over { line-height: 130%}

#list li {
	margin-bottom: 10px;
}
.hiddendate {
	visibility:hidden;
	display: none;
}

#Calendar h2, #Calendar h3, #Calendar h1 {
	margin: 0px;

}

.yearHeading {
	background-color: #28251C;
}
.yearHeading h1 {
	text-align: center;
	display: block;
	color: #fff;
}
.monthHeading {
	background-color: #bdb89c;
	cursor:pointer;
}
.monthHeading h3 {
	color: #222;
		text-align: center;
	display: block;
}