@import url('https://fonts.googleapis.com/css?family=Raleway+Sans:400,700|Simonetta');

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, 
a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, 
strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, 
label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, 
details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, 
section, summary, time, mark, audio, video {
   font: inherit;
   margin: 0;
   padding: 0;
   border: 0 none;
   vertical-align: baseline;
   outline: none;
}

html, body {
   height: 100%;
}

html {
   background: #d7a240 url(Images/rwd15-htmlbg.png) center top;
   background: #eceff4 url(Images/bg-ptrn.png);
   font-size: 62.5%;
}

body {
   background: url(Images/kompass.png) no-repeat 95% 95% fixed;
   color: #333;
   font-family: 'Raleway', helvetica, arial, sans-serif;
   font-size: 1.4rem;
   font-size: 1.4em;
   line-height: 1.5;
}

h1, h2, h3, h4, h5, h6 {
   color: #212227;
   font-family: 'Simonetta', serif;
   font-weight: 700;
   line-height: 1.1;
   margin-bottom: 10px;
}

h6 {font-size: 1em;}
h5 {font-size: 1em;}
h4 {font-size: 1.2em;}
h3 {font-size: 1.4em;}
h2 {font-size: 1.6em;}
h1, h2#Gallery_AlbumTitleText, h2#NewsList_ViewArchiveHeader, h2#NewsList_ViewNewsItemHeader, #Catalog_Container h2, #Catalog_Container h3 {
   font-size: 2.2em;
   font-variant: small-caps;
   letter-spacing: .06em;
}

p {
   margin: 0 0 20px 0;
}

strong {font-weight: bold;}
em {font-style: italic;}

a, a:visited {
   color: #8f0190; 
   font-weight: normal;
   text-decoration: none;
   transition: all ease-in-out 0.2s;
}
a:hover, a:active {text-decoration: none; color: #a32fa4;}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {text-decoration: none;}

ul, ol {
   margin: 0 0 20px 15px;
   list-style-position: outside !important;
}
ul {list-style: square;}

#nav ul, ul.NewList, ul.NewsList {
   margin: 0;
   list-style-image: none;
   list-style: none;
}

.elem-line {
   margin: 1em 0 !important;
}

/* ========================================================Grund*/

#wrapper {

}

#main-left > div, #main-right > div {margin: 30px;}

#main-left {
   background: #fff;
}

#main-left #logo {
   display: block;
   text-align: center;
   margin-left: 0;
   margin-right: 0;
}
#logo img {max-width: 300px; width: 100%;} 

#main-right {

}
#main-content {max-width: 900px;}

#footer {
   padding-top: 30px;
   border-top: 1px dashed #30588c;
}

#mobile-footer {
   display: none;
   text-align: center;
}

#smelink_linkbox a {
   opacity: 0.5;
   font-style: italic;
   line-height: 2;
   text-decoration: none;
}



/* ========================================================Nav*/

#nav {

}

#nav ul {
   clear: both;
   margin: 0;
   padding: 0;
   list-style: none;
}

#nav ul li {margin: 0; padding: 0;}

#nav li a {
   display: block;
   color: #212227;
   font-family: 'Simonetta', serif;
   font-size: 1.6rem;
   font-weight: normal;
   line-height: 1; 
   letter-spacing: .06em;
   text-align: left;
   text-decoration: none;
   text-transform: none;
   font-variant: small-caps;
   padding: 1em 0;
   border-bottom: 1px dashed #30588c;
   transition: all 0.2s ease-in-out;
}

/*Sista knappen i första nivån*/
#nav > ul > li:last-child a {
   background: #30588c;
   color: #fff !important;
   letter-spacing: .15em;
   text-align: center;
   font-variant: normal;
   text-transform: uppercase;
   margin-top: 20px;
   border-bottom: 0;
   border-radius: 3px;
}
#nav > ul > li:last-child a:hover, #nav > ul > li:last-child a:active {background: #426796;}

#nav ul li.parent.current > a {border-bottom: 0;}

/* Nivå 2-3 <----------------*/

#nav ul ul {
   padding: 0 0 15px 15px;
   border: 0;
   border-bottom: 1px dashed #30588c;
}

#nav ul ul li a {
   font-size: 1em;
   padding: 0.5em 0;
   border-bottom: 0;
}


/* Nivå 3 <--*/

#nav ul ul ul {  
   border: 0; 
}

#nav ul ul ul li a {  
   font-size: .9em;
   padding: 0.5em 0;
}


/**/

#nav ul li ul,
#nav ul li ul li ul,
#nav ul li.current ul li ul {
   display: none;
}

#nav ul li.current ul,
#nav ul li.current ul li.current ul {
   display: block;
}

/* Hover <----------------------*/

#nav li a:hover, #nav li a:active,
#nav ul li#current ul li a:hover, #nav ul li#current ul li a:active {
   color: #666;
}

/* Aktuell sida <----------------------*/

#nav ul li#current a {
   color: #8f0190;
   font-weight: bold;
}

#nav ul li#current ul li a {
   color: #8f0190;
   font-weight: 300;
}

/* Mobil dölj/visa <----------------------*/

#menu-toggle {
   background: #30588c;
   display: none;
   clear: both;
   color: #fff;
   font-family: 'Simonetta', sans-serif;
   font-size: 1.5rem;
   text-align: center;
   text-transform: uppercase;
   letter-spacing: .15em;
   margin: 0;
   padding: 1em 0;
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}
#menu-toggle:hover, #menu-toggle:active {cursor: pointer;}
#main-left #menu-toggle {margin: 0;}

/* ========================================================Misc*/

/* Formulär <----------------------*/

form {
   max-width: 100%;
}

fieldset {

}

input[type="text"], input[type="password"], input[type="email"], textarea, select {
   background: #fff;
   display: block;
   width: 210px;
   min-width: 0; 
   max-width: 90%;
   color: #000;
   font-family: helvetica, arial, sans-serif;
   font-size: 1em;
   margin: 0 0 10px 0;
   padding: 6px 4px;
   border: 1px solid #ccc;
   border-radius: 2px;
   outline: none;  
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}

select {padding: 0;}

input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus, textarea:focus {
   border: 1px solid #aaa;
}

textarea {
   width: 270px;
   min-height: 100px;
}

label, legend {
   display: block;
   font-size: 1em;
   font-weight: normal;
}

select {
   width: 220px;
}

input[type="checkbox"] {
   display: inline;
}

.button, button, input[type="submit"], input[type="reset"], input[type="button"] {
   background: #30588c;
   margin: 0 0 10px 0;
   padding: 0.6em 1em;
   color: #fff;
   cursor: pointer;
   font-family: 'Simonetta', sans-serif;
   font-variant: normal;
   text-transform: uppercase;
   letter-spacing: .15em;
   font-size: 1.6rem;
   font-weight: normal;
   line-height: 1;
   border: 0;
   border-radius: 3px;
   box-shadow: none;
   transition: all 0.2s ease-in-out;
}

.button:hover, button:hover, input[type="submit"]:hover, input[type="reset"]:hover, input[type="button"]:hover, 
.button:active, button:active, input[type="submit"]:active, input[type="reset"]:active, input[type="button"]:active {
   background: #426796;
   color: #fff;
}

.button, .button a {
   color: #fff !important;
   display: inline-block;
   font-weight: normal;
}

.button.full-width {
   text-align: center !important;
   text-transform: uppercase;
   padding: 1em 0;
   display: block;
}

/* Grid <----------------------*/

.table, .table100 {
   width: 100%; 
   display: table; 
   table-layout: fixed;
}
.table100 {height: 100%;}

.table100 > div, .table > div {
   display: table-cell;
   vertical-align: top;
}

.proc20 {width: 20%;}
.proc25 {width: 25%;}
.proc33 {width: 33.33%;}
.proc50 {width: 50%;}
.proc66 {width: 66.66%;}
.proc75 {width: 75%;}
.proc80 {width: 80%;}
.proc100 {width: 100%;}

/* Misc <----------------------*/

.ram {
   background: #fff;
   box-sizing: border-box;
   padding: 7px;
}

.nomargintop {margin-bottom: 0;}
.nomarginbottom {margin-bottom: 0;}
.margintop1 {margin-top: 1em;}
.marginbottom1 {margin-bottom: 1em;}
.large {font-size: 3.2em;}
.padding {padding: 30px;}

.image-wrapper {max-width: 100%;}

.image-subtext {font-size: 0.8em; margin: .1em 0 .5em 0;}

.clearfix:before, .clearfix:after {
   display: block;
   visibility: hidden;
   width: 0;
   height: 0;
   content: " ";
   overflow: hidden;
   clear: both;
}

/* ========================================================Media Queries*/

/* Full size 1200 */
@media only screen and (min-width: 1200px) {

}

/* 960 to 1199 */
@media only screen and (min-width: 960px) and (max-width: 1199px) {

}

/* Larger than standard 960 (devices and browsers) */
@media only screen and (min-width: 960px) {
   #nav {display: block !important;}
}

/* Smaller than standard 960 (devices and browsers) */
@media only screen and (max-width: 959px) {
   #nav {display: none;}
   #menu-toggle, #wrapper, #main-left, #main-right {display: block;}
   #main-left div#nav {margin-bottom: 0;}
   .table100 > div {width: 100%;}
   .padding {padding: 15px;}
   #main-left > div, #main-right > div {margin: 15px;}
   #main-left #logo {margin-top: 0; padding-top: 15px;}
   #nav {padding-bottom: 15px;}
   #footer {padding-top: 15px;}
   .nivoSlider .nivo-caption {top: 15px; left: 15px;}
}

/* Tablet Portrait size to standard 960 (devices and browsers) */
@media only screen and (min-width: 768px) and (max-width: 959px) {

}

/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {
   #main-footer {display: none;}
   .hide {display: none !important;}
   #mobile-footer {display: block; padding-bottom: 15px;}
   .divider-column {width: 100% !important;}
}

/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {

}

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) {

}