/*
 * http://github.com/peteboere/css-crush (v2.4.0)
 */
/*
 * HTML5 Boilerplate
 *
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */
/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */
html, button, input, select, textarea { color: #222; }
body { margin: 0; font-size: 1em; line-height: 1.2; }

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */
::-moz-selection { background: #b3d4fc; text-shadow: none; }
::selection { background: #b3d4fc; text-shadow: none; }

/*
 * A better looking default horizontal rule
 */
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }

/*
 * Remove the gap between images and the bottom of their containers: h5bp.com/i/440
 */
img { vertical-align: middle; border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }

/*
 * Remove default fieldset styles.
 */
fieldset { border: 0; margin: 0; padding: 0; }

/*
 * Allow only vertical resizing of textareas.
 */
textarea { resize: vertical; }

/* ==========================================================================
   Chrome Frame prompt
   ========================================================================== */
.chromeframe { margin: .2em 0; background: #ccc; color: #000; padding: .2em 0; }
nav ul, nav ol { list-style: none outside none; margin: 0; padding: 0; }

/* ==|== primary styles =====================================================
   Author: Maria Althoff/Mainloop
   ========================================================================== */
html { background: url(/images/sverigeshandelskamrar/bg/checkedgrey.png) #ccc repeat top left; }
body { width: 80%; margin: 0 auto; background: #fff; -webkit-box-shadow: 0 0 .5em #444; box-shadow: 0 0 .5em #444; font-family: 'Noticia Text',serif; }
h1, h2, h3 { font-family: 'Oswald',sans-serif; text-transform: uppercase; color: #555; font-weight: normal; }
a { color: #a83a3a; text-decoration: none; }
a:hover { text-decoration: underline; }
h1 a, h3 a, .teaserlist a { color: #555; }
h1 a:hover, h3 a:hover, .teaserlist a:hover { text-decoration: none; }
div.cookiebox { background: rgba(11,112,116,.8) none repeat scroll 0 0; background: rgba(0,0,0,.7) none repeat scroll 0 0; font-size: 12px; color: #fff; max-width: 100%; padding: 1% 1%; width: 100%; z-index: 9999; border-top: 1px solid #009ED2; bottom: 0; position: fixed; right: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
div.cookiebox p { margin: 0 auto; max-width: 1100px; }
div.cookiebox a.submit { background: #009ED2; color: white; border: 1px solid #009ED2; font-size: 90%; padding: 1%; float: right; }
#content { padding: 1%; }
div#content img, div#content video { max-width: 100%; height: auto; }
img[usemap] { border: none; height: auto; max-width: 100%; width: auto; }
#mapChoosed div { width: 60%; padding: 2%; font-size: 95%; font-family: arial; background: #fff; border: 2px solid #039; }

/*elastic videos */
.video-container { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; }
.video-container iframe, .video-container object, .video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
header { margin-top: 2%; padding: 1% 1% 1% 1%; }
footer { text-align: center; padding: 1%; background: #555; }
footer h1, footer h1 a { color: #fff; font-size: 80%; }
nav ul li ul { margin-left: 10px; font-size: 140%; }
nav p { margin: 4% 0; }
nav a { color: #555; text-transform: uppercase; font-family: 'Oswald',sans-serif; font-size: 110%; }
nav a.active { color: #fff; background-color: #ccc; padding: 0 .5em; }
div.login { font-family: 'Noticia Text',serif; font-size: .8em; //border: 4px solid red; padding: 1em; }
p { margin: 1% 0; }
a.admin { color: white; background-color: red; font-size: .8em; margin-right: 1px; padding: 1px; }
div.menubar ul { background-color: #039; background-color: #555; background-color: #009ed2; list-style: none; margin: 1%; padding: 0; }
div.menubar ul li { background-color: #039; background-color: #555; background-color: #009ed2; float: left; font-family: 'Oswald',sans-serif; padding: 1%; font-size: 80%; }
div.menubar ul li:hover { background-color: #ccc; }
div.menubar a { color: white; text-transform: uppercase; }
div.submenubar ul { background-color: #318ccc; background-color: #009ed2; background-color: #555; list-style: none; margin: 1%; padding: 0; }
div.submenubar ul li { background-color: #318ccc; background-color: #009ed2; background-color: #555; float: left; font-family: 'Oswald',sans-serif; font-size: 80%; padding: 1%; position: relative; min-width: 14%; text-align: center; }
div.submenubar ul li:hover { background-color: #ccc; }
div.submenubar a { color: #fff; text-transform: uppercase; }
div.submenubar ul li div { position: absolute; left: 0; top: inherit; z-index: 50; width: 100%; background: inherit; text-align: center; }
div.submenubar ul li div a { display: block; padding: 5% 0 0 0; }
div.submenubar ul li div a:hover { color: #318ccc; text-decoration: none; }
div.submenubar ul li div a:last-of-type { padding-bottom: 5%; }
div.exportteaser { border-bottom: 1px solid #ccc; padding: 1% 0; }
div.exportteaser img { float: left; width: 16%; padding: 0 2% 0 0; }
div.exportteaser a { color: #555; }
div.exportteaser h3 { line-height: 1em; padding: 0 0 1% 0; margin: 0; }
div.teaserlist { float: left; width: 48%; }
div.teaserlist img { float: left; padding: 0 1em 2em 1em; }
div.teaserlist h3 { margin: 0; padding: 0; }
section h3 { margin: 1.5% 0; padding: 0; }
@media only screen and (max-width: 70em) {
body { width: 90%; font-size: 80%; }
div.menubar ul { background-color: #fff; margin: .5%; }
div.menubar ul li { width: 30.4%; margin: .2%; }
div.menubar ul li:last-of-type { float: right; background: none; text-align: right; }
div.menubar ul li:last-of-type a { color: #ccc; }
header h1 { border-left: 4px solid #039; padding-left: .5%; margin: 0; }
header h2 { font-size: 180%; margin: 0; width: 70%; }
nav a { color: #555; text-transform: uppercase; font-family: 'Oswald',sans-serif; }
#content div.text { width: 65%; float: left; }
div.extra-art { float: left; width: 30%; padding-left: 5%; }
section { float: left; width: 63.5%; padding: 1% 2% 0 0; }
nav { float: left; width: 30.8%; padding: 1% 2% 0 1%; }
}

@media only screen and (max-width: 35em) {
body { width: 100%; font-size: 70%; }
div.teaserlist { width: 100%; margin-bottom: 1em; }
div.menubar ul { background-color: #fff; }
div.menubar ul li { width: 46%; margin: .5%; padding: 1.3%; }
div.submenubar { display: none; }
header h1 { border-left: 3px solid #039; padding-left: 1%; margin: 0; }
header h2 { font-size: 140%; margin: 0; padding-bottom: 1%; }
nav a { color: #555; text-transform: uppercase; font-family: 'Oswald',sans-serif; }
nav p { padding-bottom: 3%; }
#content div.text { width: 100%; }
section { float: left; width: 62.473%; padding: 1% 2% 0 0; }
nav { float: left; width: 28.526%; padding: 1% 1% 0 1%; font-size: 80%; }
div.extra-art { display: none; }
}

@media only screen and (min-width: 70em) {
/* Style adjustments for viewports that meet the condition */
#content div.text { font-size: 90%; width: 65%; float: left; }
div.extra-art { float: left; width: 30%; padding-left: 5%; }
section { float: left; width: 66.473%; padding: 1% 2% 0 0; }
nav { float: left; width: 26.526%; padding: 1% 2% 0 1%; }
div.pagenav { position: absolute; right: 1%; top: 2.5%; margin-right: 10%; }
div.pagenav h3 { font-size: .8em; }
header h1 { font-size: 120%; border-left: 4px solid #039; padding-left: .5%; margin: 0; }
header h2 { font-size: 240%; margin: 0; padding-bottom: 1%; }
nav a { color: #555; text-transform: uppercase; font-family: 'Oswald',sans-serif; font-size: 100%; }
}

/* ==|== non-semantic helper classes ========================================
   Please define your styles before this section.
   ========================================================================== */
/* For image replacement */
.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; *line-height: 0; }
.ir br { display: none; }

/* Hide from both screenreaders and browsers: h5bp.com/u */
.hidden { display: none !important; visibility: hidden; }

/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }

/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }

/* Contain floats: h5bp.com/q */
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }

/* ==|== print styles =======================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */
@media print {
* { background: transparent !important; color: black !important; -webkit-box-shadow: none !important; box-shadow: none !important; text-shadow: none !important; -webkit-filter: none !important; filter: none !important; -ms-filter: none !important; }

/* Black prints faster: h5bp.com/s */
a, a:visited { text-decoration: underline; }
a[href]:after { content: " (" attr(href) ")"; }
abbr[title]:after { content: " (" attr(title) ")"; }
.ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }

/* Don't show links for images, or javascript/internal links */
pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
thead { display: table-header-group; }

/* h5bp.com/t */
tr, img { page-break-inside: avoid; }
img { max-width: 100% !important; }
@page { margin: .5cm; }
p, h2, h3 { orphans: 3; widows: 3; }
h2, h3 { page-break-after: avoid; }
}

/* ==|== non-semantic helper classes ========================================
   Please define your styles before this section.
   ========================================================================== */
/* For image replacement */
.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; *line-height: 0; }
.ir br { display: none; }

/* Hide from both screenreaders and browsers: h5bp.com/u */
.hidden { display: none !important; visibility: hidden; }

/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }

/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }

/* Contain floats: h5bp.com/q */
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }

/* ==|== print styles =======================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */
@media print {
* { background: transparent !important; color: black !important; -webkit-box-shadow: none !important; box-shadow: none !important; text-shadow: none !important; -webkit-filter: none !important; filter: none !important; -ms-filter: none !important; }

/* Black prints faster: h5bp.com/s */
a, a:visited { text-decoration: underline; }
a[href]:after { content: " (" attr(href) ")"; }
abbr[title]:after { content: " (" attr(title) ")"; }
.ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }

/* Don't show links for images, or javascript/internal links */
pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
thead { display: table-header-group; }

/* h5bp.com/t */
tr, img { page-break-inside: avoid; }
img { max-width: 100% !important; }
@page { margin: .5cm; }
p, h2, h3 { orphans: 3; widows: 3; }
h2, h3 { page-break-after: avoid; }
}