/*
Theme Name:     uu-wp2
Theme URI:      http://www.sprakverkstaden.uu.se
Description:    Uppsala university WP2-like styling
Author:         Marco Bianchi
Author URI:     http://www.sprakverkstaden.uu.se
Template:       toolbox
Text Domain:    uu-wp2
Domain Path:    /languages/
Version:        0.1.0
*/
@import url("reset.css");
@import url("../toolbox/style.css");

@font-face {
    font-family: "BerlingRoman";
    font-style: normal;
    font-weight: normal;
    src: url("fonts/berlingroman-webfonteot.eot#iefix") format("embedded-opentype"), url("fonts/berlingroman-webfontwoff.woff") format("woff"), url("fonts/berlingroman-webfontttf.ttf") format("truetype");}

body {/*font-family: Verdana, sans-serif;*/ font-family: "Helvetica Neue",Helvetica,Arial,"Lucida Grande",sans-serif; color:#434343; font-size:100%; }
#branding hgroup, h1, h2 {font-family:Arial, Verdana, sans-serif;}
strong, b {font-weight:bold}
em, i {font-style:italic}
/*center everything. Make the design responsive, but not wider than 1280px*/
#branding hgroup, #branding .top-container, #main, #colophon-container /*#branding #searchform*/ {width:100%; margin:0 auto; max-width: 1280px;}
pre, code {font-family:Consolas, "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", Monaco, "Courier New", "monospace";background-color:#f2f2f2;}
pre a, code a {text-decoration: none; color:inherit}
pre {padding: 1em; overflow:scroll;  border-radius: .5em}
img {max-width:100%}
img.inline {display:inline;vertical-align:baseline}

@media (max-width: 1300px) {
	#branding hgroup, #branding .top-container, #main, #colophon-container /*#branding #searchform*/ {width: 98%}	
}
#main {position:relative; overflow:visible /*2014-12-11: overflow:hidden>visible for absolute positioned elements that are larger than main. Adjusts the height when floating the containing elements; 2015-05-22: overflow:visible>hidden to control the top margin of the footer; 2015-06-05: visible in order to strech the left menu over the margin*/; }
#page {margin:0; position:relative; overflow-x:hidden; /*dont overflow when dealing with negative margins*/}

#branding { background-color:#eaeaea; background-color:#f2f2f2; overflow:hidden}
	#branding .top-container {}
	#branding .top-nav-nav {overflow:hidden; padding: .3em 0 .7em 0}
	#branding #top-nav {background: none repeat scroll 0 0 #000; color:#fff; border-bottom: 1px solid #fff}
	#branding #top-nav ul {margin:0; padding:0; list-style:none; overflow:hidden}
	#branding #top-nav li {float:left; clear:none; margin:1.5em 2em 1em 2em;}
	#branding #top-nav ul.top-nav-primary>li:first-child {margin-left:0; padding-left:0}
	#branding #top-nav ul.top-nav-secondary>li:last-child{margin-right:0}
	#branding #top-nav li.separator{margin-left:0; margin-right:0; padding-left:0}
	#branding #top-nav li.separator:before {content:"|";}
	#branding #top-nav .top-nav-uu {width: 100%; padding: 1.5em 0 1.2em 0; border-bottom: 1px solid #333; font-family: "BerlingRoman", serif !important; font-size:1.25em}
	#branding #top-nav .top-nav-primary {float:left; clear:none; text-transform:uppercase}
	#branding #top-nav .top-nav-secondary {float:right}
	#branding #top-nav .top-nav-primary li {float:left; clear:none}
	#branding #top-nav .top-nav-secondary li {/*float:right;*/font-size:.8em}	
	#branding #top-stripe {background: url('images/uu-top.jpg') no-repeat scroll center top #000; height: 17px; padding-top: 7px; position: relative; z-index: 101;color:#fff; font-size:.8em}
	#branding img.top-stripe-nav-icon {width: 37px; margin-top:-8px; z-index: 102}
	#branding #top-stripe ul {margin:0; padding:0; list-style:none}
	#branding #top-stripe li {float: right; clear:none; margin-left: 2em}
	#branding #top-nav a, #branding #top-stripe a {color:#fff; text-decoration:none}
	#branding #top-stripe a:hover {text-decoration:underline}
	#branding #top-nav .top-nav-nav a {padding-bottom:7px}
	#branding #top-nav .top-nav-nav a:hover {border-bottom: 6px solid #fff}
	#branding #top-nav .top-nav-uu a {color:#aaa; padding-bottom:0}
	
	
	#branding hgroup { min-height:125px; background-repeat:no-repeat; background:  url('images/sidhuvud.png') no-repeat right center; position:relative}
	#branding hgroup {background:#f2f2f2; overflow:visible}
	#branding .logo {width: 20%;float:left; clear:none;}
	#branding .site-name {float:left; border-top-left-radius: 20px; clear:none; background-color:#fff; min-height: 35px; margin:90px -5000px 0 0; padding:15px 5000px 0 27px; color: #333; position:relative; font-size:1.3em; z-index:10 /*Skyms annars av sökformuläret*/; width: 55%}
	
	#branding #site-header {/*width: 80%;*/ float:left; clear:none; /*margin-top:-17px compensates for #top-stripes height*/ /*background: url('images/logga_sv_90.png') no-repeat right center;*/}
	
	#branding #site-title, #branding #site-description {margin:0; font-size:1em; font-weight:normal} /*reset styles defined in toolbox css*/
	
	#branding .site-name a {color: #333; text-decoration:none; font-weight:normal; font-size:1em}
	#branding #site-description {font-size: .7em; text-transform:uppercase; padding-left: 1em}
	#branding .site-name h1, #branding .site-name h2 {display:inline !important}
	

	#branding #site-meta {float:right; clear:none; margin-top:1em; right:0; position:absolute }
	#branding .logo img {clear:none; float:left; margin-top:19px }
	
	/*multisite language switcher*/
	
	
/*	#branding #searchform {clear:both; top:3em; position:absolute; }
	#branding #searchform input#s {width: 10%;transition: all 0.5s ease; background: url('images/uu-red-10.png')}
	#branding #searchform input#s:hover, #branding #searchform input#s:focus {width: 20%; text-align:left; padding-left:.5em; font-size: 1.2em; background: #fff}
	#branding #searchform input#s {float:right; clear:both; }*/

	
	#branding #searchform input#s {/*width: 10%;*/float:right; width: 100%; margin-right:/*.5em*/ 0; /*transition: all 0.5s ease;*/ background:#fff;}
/*	#branding #searchform input#s:hover, #branding #searchform input#s:focus {width: 100%; text-align:left; padding-left:.5em; font-size: 1.2em;}*/
	
	
	img.responsive-menu {display:none}
	
	#branding #site-meta .iconset {float:right; clear:none; margin-left:.2em; max-width:60%}
	#branding #site-meta .iconset a {text-decoration:none}
#breadcrumbs {font-size: .75em; margin:1.25em 0 1.75em 0; clear:both;}
	#breadcrumbs a {text-decoration:none; color:#000;}
	#breadcrumbs a:after {color: #aaa; content: "/"; padding-left: .3em;padding-right: .4em;}
	#breadcrumbs span {color: #aaa}
#access {background-color: #f2f2f2; font-size:.875em; font-weight:700; margin: 0 0 0 -2000px; padding: 1em 0 2em 2000px; z-index:1; /*border-right: 7px solid transparent*/ }/*1280*/
	/*
STYLE MAIN MENU
	*/
/*Overwrite menu-settings in toolbox>style.css*/
	#access a {padding:0}
	#access ul ul {box-shadow:none; -moz-box-shadow:none; -webkit-box-shadow:none; float:left; position:relative; top:inherit; left:inherit; z-index:inherit}
	#access ul ul ul {left:inherit; top:inherit}
	#access ul ul a {background:inherit; line-height:inherit; padding:inherit; width:inherit; height:inherit}
	#access li:hover > a, #access ul ul :hover > a {background:inherit}
	#access ul ul a:hover {background:inherit}
	#access ul li:hover > ul {display: none;} 
/*Generic*/
	#access .menu {text-align:left; font-size:1.1em; font-weight:normal; font-weight:normal; position:relative; clear:both}
	#access a {border-right: 7px solid transparent;  }
	#access a, #access ul ul a {color:#000; padding:.5em .5em .5em 0; line-height:inherit; }
	#access ul {width:100%; float:right;}
	#access ul li, #access li> ul li {clear:both; margin: 0; margin-left:-83px; padding-left:83px;  width:100%}
	#access li> ul a {box-sizing: border-box;-moz-box-sizing: border-box;-webkit-box-sizing: border-box; width:100%; padding-left:7%; display:block; } /*Border-box property puts the border inside the box*/
	#access li> ul li> ul a {padding-left:14%}
	#access li> ul {margin-left:-83px; padding-left:83px; background-color:#f2f2f2;}
/*Current page*/
	#access li.current_page_item a {border-color:#292929;}
	#access li.current_page_item {background-color:#ccc}
	#access li.current_page_item > ul li a {border-color:transparent; background-color:#f2f2f2}	
	#access ul li.current_page_item > ul, #access ul li.current-menu-ancestor > ul {display:block}
	#access li.current_page_item > ul li, #access li.current-menu-ancestor > ul li {background-color:none;}
/*Hover*/
	#access li:hover, #access li> ul li:hover {background-color:#fff ;}
	#access li.current_page_item > ul li:hover {background-color:#fff/*margin-right:90px*/}
	#access li.current_page_item > ul li a:hover {background-color:#fff; border-color:#ccc}
	#access a:hover{border-color:#ccc}

#primary {width: 77%; margin-left: 3%; }
.page-template-uu-two-cols-php #primary, .page-template-uu-start-php #primary, .page-template-uu-two-cols-left-php #primary {/*width: 77%; margin:0*/}
.page-template-uu-two-cols-left-php #primary {margin-left: 3%}
.page-template-full-width-page-php #primary {width: 100%; margin:0}
.page-template-uu-three-cols-php #primary, .tax-link_category #primary, .single-nyheter #primary, .single #primary {width: 77%; margin-left: 3%; }
.two-cols #primary {margin-left:0}


#main .widget-area, #access {width: 20%; left:3%; clear:right; }
#submenu-container {clear:left; width: 20%; float:left; /*left:3%;*/ position:relative; z-index:10 /*display:none*/}
#submenu, #main #submenu.widget-area  {width: 100%; }
img.responsive-submenu{display:none}
#content {margin:0}
.page-template-full-width-page-php #primary, #supplementary  {margin-right:0px /*For the box-shadow in #supplementary*/}

h1, h2, h3, h4, h5, h6 {color:#444}
h2, h3 {font-size: 1.5em; margin: 1.6em 0 .6em 0 }
h2 {text-transform:uppercase}
h3 {font-size:1.2em; font-weight:bold}
h4, h5, h6 {font-size: 1em; font-weight:bold; margin: 1em 0 0 0 }
h4, h5, h6 {font-size:1em; }
.entry-content h3:first-child, .entry-content h2:first-child {margin-top:0}

.entry-title, h2 {font-size: 1.5em; border-bottom:1px solid #999; padding-bottom: .3em; margin-bottom: .6em;clear:both}
.entry-title {font-family:"BerlingRoman"; font-size:2em; margin-top: 0em}
.entry-title a {text-decoration:none}
.entry-content, #comments, .search .entry-summary, .search .entry-meta, .single .entry-meta {width: 71%}
.entry-content {float:left; clear:left; margin-bottom: 1em}
.extra-area {width: 27%; margin-left: 2%; float:right; clear:right; overflow:hidden; margin-top:1em;}
.extra-area img {height:auto; }

.page-template-uu-two-cols-landing .entry-header, .page-template-uu-start-php .entry-header, .page-template-uu-two-cols-left-php .entry-header {display:none}
.page-template-uu-two-cols-landing .entry-content, .page-template-uu-start-php .entry-content, .page-template-uu-two-cols-left-php .entry-content {margin-top:0; width: 100%}
.page-template-uu-two-cols-landing .entry-content > p, .page-template-uu-two-cols-landing .entry-content > ul, .page-template-uu-two-cols-landing .entry-content > ol {width: 77%}
.page-template-uu-two-cols-landing .entry-content > h2 {font-family:"BerlingRoman"; font-size: 2em; float:left; width: 100%; text-transform:none; margin-top:.5em}

.page-template-default article.page .entry-header {margin-top: 3em}

a {color: #C1002B; }
ul, ol {list-style:square; padding-left: 1em; margin: 1em}
ol {list-style:decimal;}
p {margin-top: 1em}
p img {margin:0}
.smaller {font-size:.9em}




/*Spans*/
.copyright {font-size: .8em; font-style:italic}
span.copyright {display:block; margin-top: .5em}
span.superscript {vertical-align: super;font-size: smaller;}

/*Captions*/
.wp-caption {padding:.5em 1.5%; max-width:97%; background-color: #eee; /*border-radius:.5em;*/ border: #CBCBCB solid 1px; /*margin:1em;*/ display:block; line-height:normal; font-size:.9em}
.wp-caption:hover {background-color: #ddd;}
.wp-caption.alignleft {margin:1em 1em 1em 0}
.wp-caption.alignright {margin:1em -30% 1em 1em}
.wp-caption.aligncenter {margin-top: 1em; margin-bottom:1em}
.wp-caption img {margin:0; /*margin: 1%;*/ width: 100%}
.boxspan .comment a {color:inherit; text-decoration:none}
.boxspan .comment a:hover {text-decoration:underline}
.boxspan .comment {width: 96%; margin:1em 1%; display:none; padding: .5em 1%; color:#fff; position:absolute;z-index:1; top:0;background-color: #cbcbcb; background-color: rgba(0, 0, 0, .7);}
.boxspan:hover .comment {display:block}

img.alignnone {vertical-align:middle}


/*Some customisations on the 404-page*/
.error404 #primary .entry-title {font-size: 2.3em; border:none}
.error404 #primary p {font-size: 1.1em}
.error404 #primary p.caption {font-size: .9em}


.edit-link {float: right; background-color: #eaeaea; padding: .2em 1em; border-radius: .3em; margin-right: 3px; margin-bottom:3px}
.edit-link a {color:inherit; text-decoration:none}
.edit-link:hover {background-color: #999;}
.edit-link:hover > a {color:#fff}

blockquote {margin:0 1em; font-size: 1.1em; font-style:italic; line-height:normal; background:url('images/cit.png') no-repeat left top; min-height: 48px; }
blockquote p {padding:0 1em; }
blockquote.tip, blockquote.example {font-size:inherit; font-style:normal; background:url('images/cit-arrow.png') no-repeat left top; }
blockquote.tip{margin-left:0}
blockquote.tip p {padding-left: 55px}
blockquote.example {background:url('images/square-5px-uu-red-20.png') repeat-y left top; min-height:inherit}

#main {font-size:1em; line-height:normal; }
p {margin-bottom:.5em}
#site-generator {text-align:center; font-size:.7em; width: 98%; margin: 0; padding: 1em 1%;background-color: transparent; border-top: none; float:left; /*position:relative;*/}
#colophon{color:#fff; background-color: rgba(0, 0, 0, 0.7); font-size:1em; /*width:100%;*/ overflow:hidden; clear:both; margin-top: 2em; padding:0}
#colophon-stripe {background-color: #333; height: 2.5em}
#colophon-container {margin-top:-2.5em}
#colophon a {color:#fff; text-decoration:underline}
#colophon-bottom-stripe {background: url("images/uu-foot.jpg") no-repeat scroll center top #000;height: 88px; clear:both;}
#colophon-bottom {background-color: #000; height: 5em}

/*Widgets*/
.widget h1, .widgettitle, .widget-title {font-size:1em; margin: 0; padding: .6em .5em; background-color:#DDD; border:none; text-transform:none}
#primary .widget h1, #primary .widgettitle {padding:.6em}
.widget {margin: 0 0 1em 0; /*padding-bottom: 1em;*/ border:solid 1px #ddd; }
.widget_media_image {border:none}
.widget.widget_search, #secondary-top .widget, #submenu .widget {/*border:none;*/ padding-bottom:0}
.widget.noborder {border:none;}
.widget form, .widget ul {margin: .8em .5em .5em .5em; padding:0}
.widget ul {list-style:none; padding:.5em; /*font-size:.9em*/}
.widget li  {border-bottom: dotted 1px #6F6F6F; border-bottom: 1px solid #eee; padding:.5em; }
.widget li:hover  {background-color: #eee;}
/*.widget li:first-child {padding-top:0}*/
.widget li:last-child {border:none; /*padding-bottom:0*/}
/*.widget li>p {padding:0; margin:0}*/
.widget ul {margin:0; padding:0}
.widget li>p {margin:0; padding:0}
#submenu .widget>ul, #submenu .widget>p, #submenu .widget>form {font-size:.9em; }
#sidebar-right .widget {margin-bottom:2em}
#sidebar-right p {padding:0 .5em}
#sidebar-right form p {padding:0}
.error404 .widget {float:left; width:100%}
.error404 .widget .widgettitle, .error404 .widget ul {margin:0}
.error404 .widget_tag_cloud {clear: inherit; float: inherit; width: inherit;}


/*Tag cloud*/
.tagcloud a {text-decoration:none}
.tagcloud a:hover {text-decoration:underline}
.tagcloud {/*background:url('images/uu-red-10.png');*/ padding:.5em}
.tagcloud:hover {background:url('images/uu-red-10.png');}
.widget_tag_cloud .widget-title {display:none}


/*#secondary .widget {background:url('images/uu-red-10.png'); margin-top: 1em; padding:0 .5em .5em .5em; border-radius:.5em; border: 1px solid #C1002B;}
#secondary .widget h1 {margin-top:0; padding:.5em 0 1em 0; font-size: 1.3em; font-weight:bold }
*/
/*Widgets in footer*/
#supplementary {overflow:hidden; ;font-size:.9em; line-height:1.2em; }
#colophon .widget h1, #colophon .widgettitle {background-color:transparent; color:#fff; font-weight:bold; text-transform:uppercase}
#colophon .widget-area, .error404 #colophon .widget-area {text-align:center; width: 32%; margin:0 1%; float:left;}
#colophon .widget-area:first-child, .error404 #colophon .widget-area:first-child {margin-left:0; text-align:left}
#colophon .widget-area:last-child, .error404 #colophon .widget-area:last-child {margin-right:0; text-align:right}
#colophon .widget, .error404 #colophon .widget {padding:0; border:none}
#colophon .widget li {border-bottom: none; padding:.5em 0; background-color:inherit}
#colophon .widget-area .widget-title {margin: .7em 0 1em; padding:0; font-size:1.1em}

.error404 #colophon .widget {width:94.5%; float:left}



/* Style the search form in different contexts*/
#searchform input {font-size:1em; line-height:normal; margin-top:0; color:#242323}
.widget.widget_search {overflow:hidden}
.widget-area .widget_search input {}
#searchform input#s {/*box-shadow: 1px 1px .5px #888888;*/ clear:none; margin:0; border:1px solid #999; width: 68%; float: left; /*border-radius:.5em .5em;*/ padding-left:0; text-align:center;}
#main #searchform input#s {width: 90%; margin: 1em 4%; line-height: 2em; }
#main #searchform input#s:hover, #main #searchform input#s:focus {background-color:#eee}
.widget #searchform {margin:0}
.post .notice, .error404 #searchform {background: inherit; display: inherit; padding: inherit;}



/*
#commentform {display:none}
#respond:hover > #commentform {display:block; }
#respond #reply-title:before {content:"\2192\00a0";}
#respond:hover #reply-title:before {content:"\2193\00a0";}
*/
.single .entry-meta .byline {display:inline;} /*2014-12-01 ändrat från .single-author>.single här och nästa rad*/
.single .entry-meta { font-size:.8em; margin-top: 1.4em}
.entry-content, .entry-summary{/*margin-top:1.4em;*/ font-size: 1em; line-height:1.4em; color:#434343; clear:both}

.blog #content {overflow:hidden}

/*The blog-archive page*/
.uu-archive {margin-bottom:1.5em; padding: 0 0 0 0; overflow:hidden; clear:none; float:left;}
.search .uu-archive {clear:both}
.uu-archive.boxes .article-content {position:relative; overflow:hidden; height: 326px; float:right; width: 92%; /*float:right; width: 70%; width: calc(100% - 150px);*/} /*Compute the width with calc() but provide a fallback*/
.two-cols .uu-archive.boxes .article-content {float:left}
.search .page-title, .archive .page-title, .category .page-title {text-transform:uppercase; margin-bottom:1em; font-size:.9em}
.search .page-title span, .archive .page-title span, .category .page-title span {font-weight:bold}

/*.uu-archive:nth-child(3n+3)>.article-content {float:right}*/
.uu-archive.width33 {/*width: 31.3%; margin-right: 2% *//*fallback for browsers that dont support nth-child*/}
/*Note: there is an additional child (nav-id). Thus nth-child(3n+2+1) etc and not nth-child(3n+2) etc.*/
/*#content .uu-archive.width33:nth-child(3n+2), #content .uu-archive.width33:nth-child(3n+4) {margin-right:0}*/ /*Reset margin for 1st, 4th, 7th etc // 3th, 6th, 9th etc*/
/*#content .uu-archive.width33:nth-child(3n+3) {margin:0 3% 0 3%}*/ /*Set margin for 2nd, 5th, 8th etc.*/

.uu-archive.boxes .entry-title {margin-top:0; margin-bottom: 0; text-align:left; overflow:hidden; padding:.3em 2% .3em 2%; border:none; min-height:46px; background-color: #333; font-size:1.2em; text-transform:uppercase; font-family: "Helvetica Neue",Helvetica,Arial,"Lucida Grande",sans-serif; font-weight:bold;  }
.uu-archive.boxes .entry-title a {color:#fff; }
.uu-archive.boxes .entry-meta {clear:none; font-size:.8em; padding-left: 2%; display:none}
.uu-archive.boxes .entry-meta a {text-decoration:none}

/*Style search results*/
.search .uu-archive .entry-title a, .search .uu-archive .entry-summary a {color:#434343; text-decoration:none}
.search .uu-archive p {margin:0}
.search .uu-archive .entry-summary {margin: 1em 0}
.search .uu-archive .entry-meta {font-size:.9em} 
.search #content #nav-below {clear:both; }


/*Style the summaries on archive pages*/
.uu-archive.boxes .entry-summary {margin-top:1.4em; overflow:hidden; /*margin: 1em 0;*/ font-size:1em; color:#fff; position:absolute; bottom: 0; z-index:100; background-color: rgba(0, 0, 0, 0.7); width:100%}
.uu-archive.boxes .summary-content {padding:.5em; }
.uu-archive.boxes .entry-summary p {margin:0}
.uu-archive.boxes .entry-summary a {text-decoration:underline; font-weight:bold; color:#fff}
.uu-archive.boxes .article-image {float:left; clear:left; width: 100%/*width: 30%; width: calc(150px + 0%);*/} /*Compute the width with calc() but provide a fallback*/
.uu-archive.boxes .article-image img {vertical-align:top; min-width: 100%;  max-width:none; height:auto}


.commentlist {margin: 1.4em 0 1.4em 50px }
.commentlist li {margin-top:1em}
.commentlist img.avatar {margin-left:-50px; margin-top: -.2em; float:left; clear: left;} 
.commentlist .commentmetadata {font-size: .8em}
.commentlist .comment-content {margin-top: 1em}
.commentlist footer {background-color:#eee; padding: 0 0 .4em .4em}
.commentlist .comment-author {padding: .2em 0}

table {margin: 1em 0; border:1px #999 solid; border-bottom: 2px #999 solid; border-radius:1em 1em 1em 1em; font-size: .95em; width: 100%}
tbody {border-top: 1px solid #999}
thead {font-variant:small-caps; font-weight:bold; background-color: #999; color:#fff}
td {padding:.4em .6em; border-left: 1px dotted #999; vertical-align:middle}
td:last-child {border-right: 1px dotted #999}
thead td {border-style:dotted; border-color:#fff}
thead td:first-child {border-style:solid; border-color:#999}
tbody tr:nth-child(even) {background-color: #eee}
tbody tr:hover {background:url('images/uu-red-5.png');}

#nav-above, #nav-below {font-size:.8em; margin-bottom:4em}
#nav-below {margin-top: 2em !important}

#nav-above a, #nav-below a {color: #434343; text-decoration:none}
#content #nav-above .nav-previous, #content #nav-above .nav-next {display:none}
.clear-both{clear:both; }

/*Some WP2-styling*/
.wp2-caption {max-height: 500px; width: 100% !important; background-color:transparent; padding:0; border:none; overflow:hidden; position:relative}
.wp2-caption img {vertical-align:top; width:100%; height: auto}
.wp2-caption .logo img {width: inherit; float:right; clear:both}
.wp2-caption .mainpuff {color:#fff; position:absolute; right: .6em; bottom:.6em; font-size:1em; padding:0; margin:0; vertical-align:bottom; z-index:1; text-align:left; width: 45%; background-color: #cbcbcb; background-color: rgba(0, 0, 0, .7);}
.wp2-caption .puff-margin {padding:.5em 2%; overflow:hidden }
.wp2-caption ul.listpuff {position:absolute; top: 1.2em; left: .6em; max-width: 45%; padding:0; list-style-type: none; margin:0; font-size:1em; font-weight:bold}
.wp2-caption ul.listpuff li {padding: .3em .5em; background-color:rgba(255,255,255,0.9); margin-bottom:.6em}
.wp2-caption ul.listpuff a {text-decoration:none;}
.wp2-caption ul.listpuff a:hover {text-decoration:underline;}
.wp2-caption .mainpuff .link {}
.wp2-caption .mainpuff .link a {background-color:rgba(255,255,255,0.9); display:block; width: 96%;  text-decoration:none; margin-bottom:.6em; padding: .6em 2%; color:inherit; font-weight:bold; color:#434343; background-image:url(images/link-arrow-35.png); background-position:bottom right; background-repeat:no-repeat}
.wp2-caption a {color:inherit; text-decoration:underline; font-weight:bold}
.wp2-caption a:hover {text-decoration:underline}
.wp2-caption .entry-title {color:#fff; text-transform:uppercase; font-family: "Helvetica Neue",Helvetica,Arial,"Lucida Grande",sans-serif; font-size:1.7em; line-height:normal} 

.boxspan, .boxcontainer {clear:none; float:left; position:relative; margin-bottom: 1em}
.boxcontainer.grey {margin: 0 -2000px 1em; padding: 1em 2000px; background-color:#e5e5e5; overflow:hidden; }
.boxcontainer .grey {height: 326px}
.boxcontainer .black .widget {margin-bottom:0; border:none; background-color:#fff; position:relative}
.boxcontainer .black .widget a {text-decoration:none}
.boxcontainer .black .widget a:hover {text-decoration:underline}
.boxcontainer .black .widget ul, .boxcontainer .black .widget form {height:280px; overflow-y:scroll; margin-top:0; margin-bottom:0}
.boxcontainer .black .widget form {}
.boxcontainer .black .widget-title, .boxcontainer .black .widgettitle {background-color:#333; color:#fff; text-transform:uppercase; font-weight:bold; font-size:1.2em; height:46px; overflow:hidden}
.boxcontainer .black .boxlink {position:relative;  position:absolute; bottom:0; left:1em; right:1em }
.boxcontainer .black.leftmost .boxlink {left:0; right:1em}
.boxcontainer .black.rightmost .boxlink {left:1em; right:0}
.boxcontainer .black .boxlink .widget-text {display:none}
.boxcontainer .black .boxlink .widget-title, .boxcontainer .black .boxlink .widgettitle {background-color:#fff; color:inherit; text-transform:none; font-size:1em; height: auto; }
.boxcontainer .black .boxlink .widget-title a, .boxcontainer .black .boxlink .widgettitle a {color:#000; text-decoration:none}
.boxcontainer .black .boxlink .widget-title a:hover, .boxcontainer .black .boxlink .widgettitle a:hover{text-decoration:underline}
.boxcontainer .black .boxlink .widget-title a:after, .boxcontainer .black .boxlink .widgettitle a:after{content:"\00a0\2192";}

.boxspan {margin-bottom:0}
.widgets_on_page {padding:0 1em}
.widgets_on_page > .textwidget {overflow:hidden;/*Adjusts the height when floating the containing elements*/ }
.leftmost .widgets_on_page {padding-left:0}
.rightmost .widgets_on_page {padding-right:0}


.width100 {width: 100%;}
.width75 {width: 75%;}
.width66 {width: 66.6%;}
.width50{width: 50%;}
.width33{width: 33.3%;}
.width25{width: 25%;}


.edit-link{/*shadows*/-webkit-box-shadow:3px 3px 3px rgba(0,0,0,0.2);-moz-box-shadow:3px 3px 3px rgba(0,0,0,0.2);box-shadow:3px 3px 3px rgba(0,0,0,0.2);}

/*Folds out the element ul when hovering on the containing foldout-div
The visibility-hack for smooth transition is described here: http://stackoverflow.com/a/6943704
*/
td>.foldout {min-width: 30px}
.foldout>ul {visibility:hidden; opacity:0; transition: all .6s ease; position:absolute; z-index:1; margin-left:-7em; padding:0; float:right; list-style:none; background-color:#eee; text-align:right; border:1px solid #ddd; border-radius:.5em; box-shadow: 2px 2px 2px #888888; }
.foldout:focus > ul, .foldout:hover>ul {/*display:block*/ visibility:visible; opacity:1; transition-delay:0s}
.foldout>ul li {border-bottom:1px solid #fff; padding:.3em}
.foldout>ul li:last-child {border:none}
.foldout>ul li:focus {background-color:#ddd}

#comments {padding-bottom: 2em}


/*.fb-like-box {max-width:100%; overflow:hidden; }*/

@media (max-width: 1200px) {
/*	#branding #site-meta #msls-switcher	{margin-right:1em}
	#branding #site-meta {padding-right:5%}*/
	.entry-content, #comments, .search .entry-summary, .search .entry-meta, .single .entry-meta {width: 98%; margin-left:2%}
	.wp-caption.alignright {margin-right: 0}
	.page-template-default .has-post-thumbnail .entry-content {width:71%}
	.page-template-uu-two-cols-landing .entry-content > p {width: 100%}
	.page-template-uu-two-cols-landing .entry-content > ul, .page-template-uu-two-cols-landing .entry-content > ol {width: 91%; margin:1em 3%; padding-left: 3%}

}

@media (max-width: 1024px) {
	.uu-archive.width33 {width: 50%}
	#branding .top-container {width: 100%}
	#branding #top-nav .top-nav-uu, #branding #top-nav ul.top-nav-secondary>li:first-child, #branding #top-nav ul.top-nav-primary>li:first-child {margin-left: 1%; border:none}
	#branding #top-nav .top-nav-secondary li {margin-top:1em; margin-bottom:1em}
	#branding #top-nav .top-nav-primary, #branding #top-nav .top-nav-secondary {clear:both; float:left; width: 100%;} 
	#branding #top-nav .top-nav-secondary {background-color:#333}
	#branding #top-stripe li {margin-right: 1%}

}


@media (max-width: 768px) {
	/*#main, #colophon, #branding hgroup {width:100%}*/
	#branding #site-meta .iconset {max-width:100%}
	#branding .site-name {width: 100%}
	#breadcrumbs, #branding #top-stripe {font-size:1em}
	#branding #top-nav .top-nav-primary li, #branding #top-nav ul.top-nav-primary > li:first-child {width: 100%; clear:both; margin: 0; border-bottom: 1px solid #fff; padding:1.5em 0}
	#branding #top-nav .top-nav-primary>li:last-child {border:none}
	#branding #top-nav .top-nav-uu {font-size:1.5em}
	#branding #top-nav .top-nav-secondary {font-size:1.2em}
	
	#branding #top-nav .top-nav-primary li a {width: 100%; padding-left: 1%}
	#branding #top-nav .top-nav-primary li a:hover {border:none}
	#branding #top-nav .top-nav-primary li.separator {display:none}
	#branding .top-nav-nav {padding-bottom:0}
	#branding #searchform input#s {margin:0}
	/*#submenu {display:none}*/
	img.responsive-submenu{display:block; margin-bottom:1em}
	
	.extra-area {display:none}
	.page-template-default .has-post-thumbnail .entry-content {width:100%}
	#submenu-container {margin-left:0; left:0; width: 75%; /*z-index:100; position:absolute;*/ background-color:#fff}
	#primary {/*width: 54%; margin-left: 23%;*/ width: 75% !important; margin-left: 0 !important; margin-top:0em}
	.page-template-uu-two-cols-left-php #primary {width: 100% !important;}
	#secondary-top, #main .widget-area {width: 21%; margin-left:3% }
	#content {margin:0}
	#branding{font-size:.8em; }
	.hide800{display:none}
	.width100, .width75, .width66, .width50, .width33, .width25 {width:100%}
	.widgets_on_page {padding: 0}
	
	#branding .logo {clear:both}
	#branding .logo img {/*max-height:50px; */margin-top:0}
	#branding .site-name { border-top-left-radius:0; clear:both; background-color:#ccc; min-height: 35px; margin:1em -5000px 0 -4%; border-top: 1em #fff solid}
	#branding hgroup h1 {font-family:"BerlingRoman"; font-size: 1.1875em !important; color:#050505}
	#branding .site-name #site-description {display:none !important}
	#branding #site-title {margin-left: 0; float:left; clear:none}
	
	#submenu-container{display:none;}

	#primary, #main .widget-area { width: 100% !important; margin-left: 0 !important; left:0 !important; clear:both !important}
	/*#primary { margin-top:50px}*/
	#main .widget-area { margin-top:1em; margin-bottom:1em}
	
	
	#breadcrumbs {}
	/* Responsive menu */
	img.responsive-menu {clear:none; display:block; position:relative; top:0; left:.2em; float:left; margin-right:.9em}
	#access {padding:0; margin:0 0 1em 0; background-color:transparent; width:100%; display:none}
	#access .menu {position: relative; top:0; left: 0; width: 100%; text-align:left; font-size:1.6em; /*background:#dedede; padding:0 .5em; -moz-box-shadow:3px 3px 3px rgba(0,0,0,0.2); -webkit-box-shadow:3px 3px 3px rgba(0,0,0,0.2); box-shadow:3px 3px 3px rgba(0,0,0,0.2);*/}
	#access ul {display:block !important; top:0; z-index:999; position:relative; box-shadow:none; -moz-box-shadow:none; -webkit-box-shadow:none; }
	#access li {background-color: #f2f2f2;}
	
	/*Search form*/
	#searchform input#searchsubmit{display:none}
	#searchform input#s {/*border-radius:.5em*/}
	
	.wp2-caption .mainpuff {width: 100% !important; margin:0;  position:relative; clear:left;  right:0; padding: .5em 0; background-color:#333}
	.wp2-caption .puff-margin {padding:.5em 0}
	.wp2-caption {height: auto; max-height:none;}
	.wp2-caption .mainpuff .link {width: 75%; margin-left:2.5%}
	.wp2-caption .entry-title {width: 95%; margin:0 auto}
	.wp2-caption p {width:95%; margin: 1em auto .5em auto}
	.wp2-caption .logo {display:none}
	#colophon .widget-area{clear:both; width:100%; margin:0}
	#colophon .widget-area:first-child, #colophon .widget-area:last-child {display:none}
	
	.boxspan {margin-bottom:1em}
	
	
	
}
@media (max-width: 480px) {
	body {/*font-size:.8em;*/ }
	#main {}
	#submenu-container{width:100%; font-size: 1.3em}
	
	
	#branding #site-meta {margin-top:.5em; }
	#branding hgroup{height: 3em; max-height:3em; min-height:3em; background:none}
	#branding #searchform {margin-top: 0; font-size:1.3em; z-index: 10}
	#branding #searchform input#s {width: 50%}
	#branding #searchform input#s:hover, #branding #searchform input#s:focus {width: 75%; /*font-size: 1.6em;*/}
	#branding #site-header {}
	#branding #site-header img {display:none; }
	#branding #site-title {padding: 0; margin-left: .9em; float:left; clear:none }
	#branding #site-title a {color:#fff; }
	#branding .logo img {max-height:50px;}
	.paged #content #nav-above, .single #content #nav-above, .paged #content #nav-below, .single #content #nav-below {display:none;}
	#fb-root {display:none}
	
	.wp2-caption ul.listpuff {max-width:75%}
	.wp2-caption .mainpuff .link {margin-left:0; width: 100%}
	.wp2-caption .mainpuff .link a {width: 95%; padding:.6em 2.5%}
	
	.uu-archive.width33 {width: 100%}
	.uu-archive.boxes .article-content {width:100%}
	
	.wp-caption.alignright, .wp-caption.alignleft {float:none; margin-left:auto; margin-right:auto; clear:both}
/*	#access * ul {display:none}*/
	
/* gammalt	#branding:hover #access * ul {display:block}*/
	
/*	#access:hover * .menu, #access * ul:hover {display:block}*/
	



}