@import url("reset.css");

html {
	overflow-Y: scroll;
}

body { 
	//background:#4F4F4F url('../images/background.png');
	//background:#4F4F4F;
	//background-repeat:repeat-x;
	background-color:#2675af;
	background-image:linear-gradient(to left,#cccccc,#777777);
	font: 13px Arial, sans-serif;
	overflow: hidden;
}

@media screen and (max-width: 480px) {
#container {
	width: 320px;
	margin: auto;
	color: #333;
	overflow: hidden;
	position: relative;
}
#top {
	width: 320px;
	margin: 20px 0 0 0;
}
}

@media screen and (min-width: 480px) {
#container {
	width: 1000px;
	margin: auto;
	color: #333;
	overflow: hidden;
	position: relative;
}
#top {
	width: 1000px;
	margin: 20px 0 0 0;
}
}

#logo {
	margin: 0 0 20px 0;
	float: left;
	width: 570px;
	height: 49px;
	background: url("../images/logo.png") 0 0 no-repeat;
	text-indent: -9999px;
}
        
#logo a {
	display: block;
	width: 385px;
	height: 44px;
	border-bottom: 0px;
}
        
img.border {
	border: 1px;
	border-color: #ccc;
	border-style: solid;
}

        #search { float: right; color: #999; margin: 10px 10px 0 0; }
	#searchicon {margin 0 0 0 0; float: right;}
        #login { float: left; color: #999; margin: 10px 10px 0 0; }
	#loginicon {margin 0 0 0 0; float: left;}
        
    #header { width: 1000px; padding: 0; margin: 0; clear: both; overflow: hidden; }
        
    #nav { float: left; background: #111 url("../images/nav_bg.png") bottom left repeat-x; width: 1000px; padding: 0; clear: both; z-index: 9990; }
            #nav a { border-bottom: 0px;}
    
    #content { float: left; width: 960px; padding: 20px 20px 0px 20px; background: url("../images/content_bg.png") 0 0 repeat-y; overflow: hidden; }
    
        #left { float: left; width: 608px; }
            
            .navigation { float: left; clear: both; margin: 0 0 2.5em 0; overflow: hidden; width: 606px; font-size: 14px; font-weight: bold; }
            
                .previous { float: left; width: 200px !important; text-align: left; }
                .next { float: right; width: 200px !important; text-align: right; }
                .up { float: right; text-align: right; border: none; border-bottom: 0px white; margin-top:0px; text-decoration: none: font-weight: bold; z-index: 1000; display: block; }
    
        #right { float: right; width: 320px; }
        
    #footer { float: left; width: 100%; height: 120px; color: #ccc; background: #3E3E3F; font-size: 1.2em; border: 0px solid #333; }
    #footercontent { margin: 25px 10px 10px 10px; font-size: 12px; }
	#footercontent img { padding-left: 20px; } 
    #endfooter { float: left; width: 980px; padding: 10px 20px 20px 0; }
    #endfooter a { text-decoration: none; border: none; }

    .align-left{ float: left; }
    .align-right{ float: right; }
    
/* =COMMON ELEMENTS
====================================================================================================================================== */    

h1 { float: left; font-size: 2.8em; font-weight: bold; margin: 0 0 .1em 0; color: #e74d00; line-height: 1.1em; letter-spacing: -1px; }

    h1.pagetitle { float: none; font-size: 2.8em; font-weight: bold; color: #e74d00; border-bottom: 1px solid #ddd; padding: 0 0 .2em 0; margin: 0 0 1em 0; width: 100%; }

h2 {}

    .entry h2 { float: left; font-size: 20px; font-weight: bold; margin: 0.2em 0 0.3em 0; line-height: 1.1em; }
    .ontry h2 { float: left; font-size: 20px; font-weight: bold; margin: 0.2em 0 0.3em 0; line-height: 1.1em; }
    .xntry h2 { float: left; font-size: 20px; font-weight: bold; margin: 0.2em 0 0.3em 0; line-height: 1.1em; }

h3 {}

    h3.gen { font-size: 1.4em; font-weight: bold; color: #333; margin: 2em 0 .5em 0; }
    .contents h3.gent { margin: 1em 0 .5em 0; }
    
    h3.center { text-align: center; }

    #right h3 { font-size: 1.6em; font-weight: bold; margin: 0 0 0.5em 0; }
    
    .entry h3, .entry-single h3, #next h3, #comments h3 { font-size: 1.6em; font-weight: bold; padding: 0 0 .3em 0; margin: 0 0 1em 0; line-height: 1.3em; color: #333; border-bottom: 1px solid #ddd; }

h4 {}

    #next h4 { font-size: 1.4em; font-weight: bold; color: #e74d00; margin: 0 0 1em 0; }
    .tabberlive .tabbertab h4 { font-size: 1.3em; font-weight: normal; margin: 0 0 0.3em 0; font-weight: bold; }
    
    h4.gen { color: #06c; font-weight: bold; margin: 0 0 .3em 0; font-size: 1.3em; }

h5 { margin: 10px 0 10px 0; }

p { font-size: 13px; margin: 0 0 1.0em 0; line-height: 1.4em; }

    p.center { text-align: center; }
    p.right { text-align: right; clear: both; line-height: 1.6em; }
    p.date { color: #666; text-transform: uppercase; margin: 0 0 .2em 0; letter-spacing: 0.5px; }        
    p.meta { float: left; width: 100%; font-size: 1.2em; color: #333; border-bottom: 1px solid #ccc; padding: 0 0 .5em 0; margin: 0 0 1.2em 0; height: 1%; }
    p.muta { width: 320px; font-size: 1.2em; color: #333; border-bottom: 1px solid #ccc; padding: 0 0 .5em 0; margin: 31px 0 1.2em 0; height: 1%; }
    #pop-in p.meta { font-size: 1.1em; color: #aaa; border: none; margin: 0; padding: 0; }
    p.comment_zen { color: #000; }
    .contents p { margin: 0 0 .1em 0; }
    p.single_date { font-size: 1.1em; color: #999; font-style: italic; clear: both; margin: 0 0 0 0 !important; }
    
strong { font-weight: bold; }
    strong.green { color: #e74d00; }
em { font-style: italic; }
    em.alert { display: block; padding: 5px; background: #ffc; color: #333; font-size: 1.2em;}

a, a:link { color: #144e9c; text-decoration: none;}
a:visited { color: #144e9c; }
a:hover { color: green; text-decoration: none; }

    a.more-link { font-weight: bold; font-size: 0.9em; }    
    a.fn { font-size: .8em; }
    
    #footer { color: #999; }
    #footer a {
	color: #999;
	border 0px white solid;
	border: 0px solid #ccc;
	border-bottom: none;
    }
    #footer a:hover { text-decoration: none; }
    
    a img { border: none; }

.doc { float: left; padding: 0 0 0 60px; }
ul.gen { padding: 0 25px; margin: 0 0 1.5em 0;}

ul.gen li { font-size: 1.3em; margin: .3em 0; list-style: disc; line-height: 1.4em; }

ol { padding: 0 25px; list-style: decimal; margin: 0 0 1.5em 0; font-size: 1.3em; line-height: 1.4em; }
ol li { margin: 0 0 .5em 0; }

/* ==[ Top, Header, and Nav Styles ]== */
        
#picture { float: left; width: 648px; height:230px; }
        
#blok { float: right; width: 230px; padding: 10px 10px; background: #62832F url("../images/blok_bg.png") 0 0 repeat-x; height: 213px; }
        
#book { float: right; width: 322px; padding: 20px 15px; background: #b13a00 url("../images/book_bg.png") 0 0 repeat-x; height: 190px; }
    
    #book img { float: right; padding: 0 0 0 0px; }    
    #book ul { float: left; width: 150px; padding: 0 0 10px 0; margin: 0 0 10px 10px; border-bottom: 1px solid #ff6216; }
    #book li { font-size: 12px; font-weight: bold; color: #f4f8ea; padding: 3px 0; }
    #book p { font-size: 12px; color: #fff; font-weight: bold; line-height: 1.2em; width: 150px; padding: 0 0 0 10px; }
    #book p span { display: block; margin: 7px 0; padding: 0; color: #ffb895; font-size: 0.95em; line-height: 1.1em; font-weight: normal; }

#nav {height: 37px; background: black;}

#nav ul li { float: left; font-size: 13px; font-weight: bold; padding: 0px; background: url("../images/nav_border.png") 100% 50% no-repeat; z-index: 9997; }

    #nav ul a { color: #fff; text-decoration: none; display: block; padding: 12px 15px 13px 15px; margin-left: -1px; }
    #nav ul a:hover { color: #fff; background: #9b9b9b url("../images/nav_hover_bg2.png") bottom center no-repeat; margin-left: -1px;}
    #nav ul a.here { color: #fff; background: #ff7933 url("../images/nav_hover_bg.png") bottom center no-repeat;}
    #nav ul li.last { background: none; border: none; margin-bottom: 0; }
    
#nav #subscribe { float: right; color: #f1f1f1; font-size: 13px; font-weight: bold; width: 352px; text-align: right; padding: 0 0 0 0; }

    #nav #sub_button { position: absolute; top: 300px; margin: 0 0 0 -43px; z-index: 1000; display: block; }    
    #nav #subscribe a { color: #fff; text-decoration: none; display: block; padding: 12px 60px 13px 60px;}
    #nav #subscribe a:hover { color: #fff; background: #9b9b9b url("../images/nav_hover_bg2.png") bottom center no-repeat; }
    #nav #subscribe a.here { color: #fff; background: #ff7933 url("../images/nav_hover_bg.png") bottom center no-repeat;}
    #nav #subscribe span { float: right; display: block; margin: 0 0 0 0; }
    
input.search_input { float: left; width: 200px; padding: 4px; margin: 0px; font-size: 12px; color: #aaaaaa; line-height: 16px; font-family: Arial, sans-serif; }
input.login_input { float: right; width: 200px; padding: 4px; margin: 0px; font-size: 12px; line-height: 16px; font-family: Arial, sans-serif; }
#searchsubmit {float: left; padding: 0 0 0 10px; }
#loginsubmit {float: right; padding: 0 0 0 10px; }
    
/* ==[ Post Styles ]== */

.entry, .entry-single { float: left; width: 606px; margin: 0 0 2.5em 0; display: block !important; font-size: 13px; line-height: 1.7em;}
.xntry, .xntry-single { float: left; width: 290px; margin: 0 0 2.5em 0; display: block !important; font-size: 13px; line-height: 1.7em;}
.untry, .untry-single { float: left; width: 506px; margin: 0 0 2.5em 0; display: block !important; font-size: 13px; line-height: 1.7em;}
    
    .entry-single { margin: 0 0 1em 0; }
    .xntry-single { margin: 0 0 1em 0; }
    .untry-single { margin: 0 0 1em 0; }
    
    .entry-header { float: left; width: 100%; }
    .xntry-header { float: left; width: 100%; }
    .ontry-header { float: left; width: 100%; }
    .untry-header { float: left; width: 100%; }

    .entry h2 a {
	color: #e74d00;
	border: 0px solid #ccc;
	border-bottom: none;
    }
    .ontry h2 a {
	color: #e74d00;
	border: 0px solid #ccc;
	border-bottom: none;
    }
    .untry h2 a {
	color: #ffffff;
	border: 0px solid #ccc;
	border-bottom: none;
    }
    .entry h2 a:hover { color: #f60; }
    .ontry h2 a:hover { color: #f60; }
    .untry h2 a:hover { color: #f60; }
    
    .entry h3 { font-size: 1.8em; font-weight: normal; color: #e74d00; }
    
    .entry blockquote { font-family: "Courier New"; font-size: 11px; padding: 10px; border: 1px solid #ccc; margin: 10px 0 10px 0; background: #f1f1f1; font-weight: bold; }
    .entry blockquote pre { font-family: "Courier New"; font-size: 11px; font-weight: bold; }
    
    span.byline { display: block; float: left; width: 180px; }
    span.topics { display: block; float: right; width: 316px; text-align: right; }
    
    .entry ul { margin: 1em 0 1.5em 0; padding: 0 0 0 15px; }
    .ontry ul { margin: 1em 0 1.5em 0; padding: 0 0 0 15px; }
    .entry ul li { margin: .3em 1em; list-style: disc; }
    .ontry ul li { margin: .3em 1em; list-style: disc; }
    
    .entry ol { padding: 0 0 0 15px; margin: 0 0 1.5em 0; font-size: 13px;}
    .entry ol li { margin: .3em 1em; }

    .entry img, .entry p img { margin: 0; }
    
    .entry p small, .entry small, * small, * small strong, * small em { font-size: 11px; }
    
    .entry-bottom { background: white; font-size: 12px; float: left; clear: both; border: 0px solid #ccc; margin: 0px 0 15px 0; padding: 0px; }

    .entry table { border: 1px solid #ccc; width: 100%; }
    .ontry table { border: 0px solid #ccc; width: 100%; }
    .untry table { border: 0px solid #ccc; width: 100%; }
    .entry tr td { border: 1px solid #ccc; text-align: left; padding: 2px 2px 2px 2px;}
    .ontry tr td { border: 0px solid #ccc; text-align: left; padding: 2px 2px 2px 2px;}
    .untry tr td { border: 0px solid #ccc; vertical-align: top; text-align: left; padding: 0px 10px 10px 0px; color: #fff; }

    .head { background: #DDEBF5; font-weight: bold;}
    .head2 { background: #DDEBF5; font-weight: bold; width: 200px;}
            
    .caption { float: left; background: #ddd; padding: 5px; margin: 0 0 20px 0; clear: both; width: 496px; }
    .caption img { margin: 0 auto 10px auto; }
            
/* ==[ Comment Styles ]== */

#comments { clear: both; }

ul#comment_list { margin: 0 0 2em 0; }
ul#comment_list li.comment { width: 100%; overflow: hidden; background: #f1f1f1; padding: 1em 0; border: 1px solid #ccc; border-right: none; border-left: none; }
ul#comment_list li.alt { background: #fff; border: none; }
ul#comment_list li.author { background: #f5e6df; width: 505px; color: #333; border: 1px solid #e74d00; }
ul#comment_list li.comment .comment_meta { float: left; width: 135px; padding: 0 0 0 5px; }
ul#comment_list li.comment .comment_entry { float: right; width: 360px; padding: }

    li.comment .entry blockquote { margin: 0 10px .5em 0; padding: 8px 5px 5px 33px; border: 1px solid #ccc; background: #fff url("../images/quote.png") 0 0 no-repeat; }
    
    span.comment_author { font-size: 1.2em; line-height: 1.4em; font-weight: bold; }
    li.comment span.comment_author, li.alt span.comment_author a { font-weight: bold; }
    li.author span.comment_author a, li.author span.comment_author { font-weight: bold; color: #e74d00; font-size: 1.4em; text-decoration: none; }
    span.comment_time, span.quote { float: left;  display: block; font-size: 1.1em; color: #999; clear: both; line-height: 1.4em; }
     li.author span.comment_time, li.author span.comment_time a { color: #e74d00; }
        span.comment_time a { text-decoration: none; color: #aaa; }
        
input.text_input { border: 1px solid #ccc; padding: 3px; width: 200px; font-size: 14px; font-family: "helvetica", arial, sans-serif; }
textarea.text_input { border: 1px solid #ccc; font-size: 14px; font-family: "helvetica", arial, sans-serif; padding: 3px; width: 500px; }
    
/* ==[ Sidebar Styles ]== */

#right ul#sidebar { width: 340px; margin-left: 5px; }

    // MICHEL - CHANGED THIS FOR THE COUNTER
    //#right ul li { margin: 0 0 2.5em 0; clear: both; }
    #right ul li { margin: 0 0 0 0; clear: both; }
    
    #right ul.cat_list { margin: 0; display: inline-block; }
    #right ul.cat_list li { float: left; clear: none; font-size: 12px; margin: 0 12px 6px 0; vertical-align: top !important; line-height: 1.2em; width: 165px; }

    #right ul.cat_lost { list-style: disc; list-style-position: none }
    #right ul.cat_lost li { font-size: 13px; margin: 0 0px 6px 0; line-height:1.4em; }
    #right ol.cat_lost { list-style: disc; list-style-position: none }
    #right ol.cat_lost li { font-size: 13px; margin: 0 0px 6px 0; line-height:1.2em;}

    #right ul li ul.inside { margin: 0; font-size: 1.2em; }
    #right ul li ul.inside li { margin: 0 0 .5em 0; background: url("../images/sidebar_bullet.png") 0 -3px no-repeat; padding: 0 0 0 18px; }

.formsearch { float: right; width: 350px; padding: 4px; margin: 0px; font-size: 12px; line-height: 16px; font-family: Arial, sans-serif; }
.formsearchradio { float: left; width: 20px; padding: 4px; margin: 0px; font-size: 12px; line-height: 16px; font-family: Arial, sans-serif; }
.texta { float: right; padding: 0px; margin: 0px; font-size: 12px; line-height: 16px; font-family: Arial, sans-serif; border: 1; width: 508px; }
.formentry { float: left; width: 506px; margin: 5px 0 5px 0; display: block !important; font-size: 13px; line-height: 1.4em;}
.formentrysmall { float: left; width: 140px; margin: 5px 0 5px 0; display: block !important; font-size: 13px; line-height: 1.4em;}
.formentryradio { float: left; width: 350px; margin: 5px 0 5px 0; font-size: 13px; line-height: 1.8em;}

#google1 {border: 1px solid #ccc; margin: 0 0 10px 10px; padding: 4px; display: block !important; }


/* for images that float on the right side and need some spacing on the bottom and on the left, so that the images are not too close to the surrounding text */
.imgspacer { float: right; padding: 0 0 10px 10px; }    

.imgspacerleft { float: left; padding: 0 10px 10px 0; width: 50px; height: 50px; }    

img.double-border { border: 1px solid #ccc; padding: 5px; background: #ffffff; }

img.double-border-center { border: 1px solid #ccc; padding: 5px; background: #ffffff; margin-left: auto; margin-right: auto; display: block; }

img.double-noborder-center { border: 0px solid #ccc; padding: 5px; background: #ffffff; margin-left: auto; margin-right: auto; display: block; }

img.double-border-right { border: 1px solid #ccc; padding: 5px; background: #ffffff; float: right; margin-left: 5px; }

img.double-noborder-right { border: 0px solid #ccc; padding: 5px; background: #ffffff; float: right; margin-left: 5px; }

div.figure p { text-align: center; font-style: italic; text-indent: 0; }

.Warn {
	color: #000000;
	text-align: left;
	vertical-align: middle;
	height: auto;
	padding-top: 10px;
	padding-right: 5px;
	padding-bottom: 10px;
	padding-left: 10px;
	background: #fff7c0;
	border-bottom: solid #ebad14 2px;
	border-top: solid #ebad14 2px;
	margin-top: 20px;
	margin-bottom: 10px;
}




.vl {
    box-sizing: border-box;
    border-left: 1px solid #ccc;
    float: left;
    padding: 1px;
    height: 160px;
}

/* Create three equal columns that floats next to each other */
.column1 {
    box-sizing: border-box;
    float: left;
    width: 49%;
    padding-left: 0px;
	padding-right: 20px;
    height: 160px;
	font-size: 13px;
}
.column2 {
    box-sizing: border-box;
    float: left;
    width: 49%;
    padding-right: 0px;
	padding-left: 20px;
	height: 160px;
	font-size: 13px;
}

/* Clear floats after the columns */
.row:after {
    content: "";
    display: table;
    clear: both;
}




	.modalDialog {
		position: fixed;
		font-family: Arial, Helvetica, sans-serif;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		background: rgba(0,0,0,0.5);
		z-index: 99999;
		opacity:0;
		-webkit-transition: opacity 400ms ease-in;
		-moz-transition: opacity 400ms ease-in;
		transition: opacity 400ms ease-in;
		pointer-events: none;
	}

	.modalDialog:target {
		opacity:1;
		pointer-events: auto;
	}

	.modalDialog > div {
		width: 500px;
		position: relative;
		margin: 10% auto;
		padding: 10px 10px 10px 10px;
		border-radius: 10px;
		background: #fff;
	}

	.modalHeader h2 { color: #e74d00; font-size: 20px; font-weight: bold; margin: 0.2em 0 0.3em 0; line-height: 1.1em; }
	.modalFooter p {
		color:#D4482D;
		text-align:right;
		margin:0;
		padding: 5px;
	}	
	.modalDialog .modalHeader  {	padding: 5px 20px 0px 20px;	}
	.modalDialog .modalContent {	padding: 0px 20px 5px 20px;	}
	.modalDialog .modalFooter  {	padding: 8px 20px 8px 20px;	}
	.ok, .close, .cancel {
		background: #cccccc;
		line-height: 25px;
		text-align: center;
		text-decoration: none;
		font-weight: bold;
		-webkit-border-radius: 2px;
		-moz-border-radius: 2px;
		border-radius: 2px;
		-moz-box-shadow: 1px 1px 3px #000;
		-webkit-box-shadow: 1px 1px 3px #000;
		box-shadow: 1px 1px 3px #000;
	}
	.ok, .cancel {
		width:80px;
		float:right;
		margin-left:20px;
	}
	.ok:hover { background: #189CDA; color: #ffffff; }
	.cancel:hover { background: #189CDA; color: #ffffff; }
	.clear { float:none; clear: both; }