@import url(pub/css/skeleton1.2.css);
@import url('https://fonts.googleapis.com/css?family=Droid+Sans:400,700|Droid+Serif');

html, body {
   width: 100%;
   min-height: 100%;
   font-size: 62.5%;
}

body {
   background: #26251f url(Images/moulin.png) center top;
   color: #333;
   font-family: 'Droid Sans', helvetica, arial, sans-serif;
   font-size: 100%;
   line-height: 1.5;
   font-size: 1.5rem;
   font-size: 1.5em;
}

h1, h2, h3, h4, h5, h6 {
   color: #999; 
   font-weight: normal;
   font-family: 'Droid Serif', georgia, serif; 
   line-height: 1.1;
   letter-spacing: -0.015em;
}

h6 {
   font-size: 1.2em; 
   font-style: italic;
}

h5 {
   font-size: 1.2em;
}

h4, #footer #ViewContactFormHolder h2 {
   font-size: 1.7rem;
}

h3 {
   font-size: 1.8rem;
   margin: .7em 0 .5em 0;
}

h2 {
   font-size: 2.4rem; 
   margin: .7em 0 .5em 0;
}

h1, 
#Gallery_AlbumTitleText, 
h2#NewsList_ViewArchiveHeader {
   font-size: 3rem; 
}

p {
   margin: 0 0 1em;
}

a, a:visited {
   color: #829aa9;
   text-decoration: none;
   transition: all ease 0.2s;
}
a:hover {text-decoration: none; color: #8da3b0;}
a:active {color: #8da3b0;}

.elem-line {
   border-top: 1px solid #999 !important;
}

ul
{
   list-style: url(https://www.testwebben.se/7999/Images/rwd3-ul.png);
   list-style-position: outside !important;
   margin-left: 20px;
}

#mobile-nav ul, #nav ul, #sub-nav ul {
   list-style: none;
}

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

#wrapper
{
   background: #fff;
   box-shadow: 0 0 15px 2px #000;
}

.super-container {
   width: 100%;
}

.container {
   margin-bottom: 20px;
   padding: 20px 0;
}

#header {
   margin-bottom: 0; 
   padding-bottom: 0;
}

#logo a {
   text-decoration: none;
}
#logo a h2 {
   color: #829aa9;
   font-size: 4rem;
   line-height: 1.1;
   margin: .5em 0 0 0;
   padding: 0;
}

#main {
   padding: 40px 0;
}

#footer {
   padding-top: 10px;
   padding-bottom: 0;
}

#footer, #footer a {
   color: #ccc;
   font-weight: 300;
}

#footer h2, #footer h4 {
   color: #fff;
   font-size: 1.9rem;
   margin: 0 0 .7em;
}

#footer a:hover {color: #fff;}

#footer p {
   margin: 0 0 .5em 0;
}

#mobile-footer, #mobile-footer a {
   color: #ccc;
   text-align: center;
}
#mobile-footer {display: none;}

#smelink_linkbox a {
   color: #888;
   font-style: italic;
}


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

#nav {
   text-align: center;
   margin-top: 1.5em;
   background: rgb(156,169,151);
   background: -moz-linear-gradient(top, rgba(156,169,151,1) 0%, rgba(122,137,117,1) 100%);
   background: -webkit-linear-gradient(top, rgba(156,169,151,1) 0%,rgba(122,137,117,1) 100%);
   background: linear-gradient(to bottom, rgba(156,169,151,1) 0%,rgba(122,137,117,1) 100%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9ca997', endColorstr='#7a8975',GradientType=0 );
   padding-left: 0;
   padding-right: 0;
   border-radius: 5px;
   box-shadow: 0 1px 2px #000;
}

#nav ul {margin: 0; clear: both;}
#nav ul li {float: left; margin: 0;}
#nav ul li a {
   color: #fff;
   display: block;
   font-family: 'Droid Sans', helvetica, sans-serif;
   margin: 0 0 0 0;
   padding: 1.5em 1.345em;
   /*width: 155px;*/
   width: auto;
   text-decoration: none;
   text-align: center;
   border-left: 1px solid #a7b2a2;
   border-right: 1px solid #6e7b69;
   text-shadow: 1px 1px rgba(0,0,0,.3);
}

#nav ul li:first-child a {border-left: 0; border-top-left-radius: 5px; border-bottom-left-radius: 5px;}
#nav ul li:last-child a {border-right: 0; border-top-right-radius: 5px; border-bottom-right-radius: 5px;}

#nav ul li a:hover {background: #919f8b;}
#nav ul li a:active {background: #919f8b;}
#nav ul li.parent.current a, #nav ul li#current a {background: #7a8975; color: #fff; box-shadow: inset 0 0 15px rgba(0,0,0,.15);}

/* Sub navigation */

#subMenuHeader {
   display: none;
}

#sub-nav {
   padding: 1em 0 0 0;

}

#sub-nav ul {
   margin: 0;
   float: left;
   clear: both; 
   width: 100%;

}

#sub-nav ul li {float: left; margin-bottom: .5em; }

#sub-nav ul li a {
   color: #333;
   font-size: 1.1em;
   font-family: 'Droid Serif', georgia, serif;   margin: 0;
   padding: .5em .6em;
}
#sub-nav ul li a:hover {color: #098786;}
#sub-nav ul li a:active {color: #098786;}
#sub-nav ul li.active a {color: #ffa200;}
#sub-nav ul li:first-child a {padding-left: 0;}

/* Mobile navigation */
#mobile-nav {
   background: #14cccb;
   background: -moz-linear-gradient(top,  #14cccb 0%, #098786 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#14cccb), color-stop(100%,#098786));
   background: -webkit-linear-gradient(top,  #14cccb 0%,#098786 100%);background: -o-linear-gradient(top,  #14cccb 0%,#098786 100%);
   background: -ms-linear-gradient(top,  #14cccb 0%,#098786 100%);
   background: linear-gradient(to bottom,  #14cccb 0%,#098786 100%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#14cccb', endColorstr='#098786',GradientType=0 );
   margin: 10px 0;
   padding: 10px 0;
   border-radius: 5px;
   box-shadow: 0 1px 2px #000;
   display: none;
}

#mobile-nav span {
   color: #fff;
   font-weight: bold;
   display: block;
   margin: 0 0 3px 16px;
   text-shadow: 1px 1px #275100;
}

#mobile-nav select {
   color: #000;
   width: 90%;
   margin: 0 auto 10px auto;
}

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


/* Mobile sidebar */

/* Lv. 1 */
#mobile-sidebar {
   display: none;
   margin: 0;
   padding: 0;
   background: #fff;
   box-shadow: none;
}

#mobile-sidebar ul {
   display: block;
   float: none;
   width: 100%;
   max-width: 100%;
   margin: 0;
   padding: 0;
   list-style: none;
}

#mobile-sidebar ul li {
   float: none;
   margin: 0;
   padding: 0;
   list-style: none;
}

#mobile-sidebar ul li a {
   display: block;
   margin: 0;
   padding: 15px 10px;
   border-top: 1px solid #ddd;
   color: #222;
   font-weight: normal;
   font-size: 1.1em;
   text-decoration: none;
   text-transform: none;
}
#mobile-sidebar ul li a:hover, #mobile-sidebar ul li a:active {}
#mobile-sidebar ul li.parent.current a, #mobile-sidebar ul li#current a {color: #222;}


/* Lv. 2 */
#mobile-sidebar ul li ul li {}
#mobile-sidebar ul li ul li a {
   padding: 10px 5px 10px 15px;
   border: 0;
   font-size: 1.1em;

}
#mobile-sidebar ul ul li.parent.current a {}
#mobile-sidebar ul li.parent.current ul li a {color: #222;}
#mobile-sidebar ul li#current a {color: #222;}

/* Lv. 3 */
#mobile-sidebar ul li ul li ul {display: none;}
#mobile-sidebar ul li ul li.parent.current ul {display: block;}
#mobile-sidebar ul li ul li ul li {}
#mobile-sidebar ul li ul li ul li a {
   padding: 10px 5px 10px 35px;
}

/* Hide/Show sub levels */
#mobile-sidebar ul li ul {display: none;}
#mobile-sidebar ul li.current ul {display: block;}
#mobile-sidebar ul li.current ul li ul {display: none;}
#mobile-sidebar ul li ul li#current ul {display: block;}

/* Current / Parent */
#mobile-sidebar ul li#current>a {color: #829aa9;}


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

#bildspel img, .image-wrapper img {border-radius: 5px;}

form {margin-bottom: 0;}
form input, form textarea {
   margin-bottom: 10px !important; 
   font-weight: normal !important; 
   font-family: helvetica, arial, sans-serif !important;
   -webkit-transition: all 0.3s ease-in-out;
   -moz-transition: all 0.3s ease-in-out;
   -o-transition: all 0.3s ease-in-out;
   transition: all 0.3s ease-in-out;
}
form textarea {min-width: 250px; max-width: 320px;}
label {font-weight: normal;}

.button, button {
   background: #829aa9;
   color: #fff;
   border: 0;
   text-shadow: none !important;
   font-size: 1.4rem;
   font-family: 'Droid Sans';
   letter-spacing: 0.15em;
   font-style: normal;
   font-weight: normal;
   transition: background .25s linear;
   padding: 10px 15px;
   text-transform: uppercase;
}

.button a {color: #fff;}

.button:hover, button:hover {
   background: #8da3b0;
   color: #fff;
   border: 0;
}

.button:active, button:active {
   background: #8da3b0;
   color: #fff;
   border: 0;
}

/*Footer contactform*/
#footer form input, #footer form textarea {opacity: .65;}
#footer form input:focus, #footer form textarea:focus {opacity: 1;}
#footer form button {margin-bottom: 0;}

/*News*/
.NewsList a {color: #333;}
.date {font-size: .9em; color: #999;}
ul.NewsList {list-style: none; margin-left: 0;}
ul.NewList {margin-left: 1.3em;}
#NewsList_ViewSidebarHeader, #NewsList_ViewSidebarArchiveLink {display: none;}

/*Misc*/
.padding {padding: 15px;}

/* ========================================================Media Queries*/
/* Tablet and larger */
@media only screen and (min-width: 768px) {
   #bildspel .nivoSlider {display: block;} 
}

/* Smaller than standard 960 (devices and browsers) */
@media only screen and (max-width: 959px) {

}

/* Tablet Portrait size to standard 960 (devices and browsers) */
@media only screen and (min-width: 768px) and (max-width: 959px) {
   #nav, #sub-nav {font-size: 90%;}
   #footer form textarea {min-width: 210px; max-width: 210px;}
   #nav ul li a {width: 156px;}
}

/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {
   .divider-column {width: 100% !important; margin: 0 0 15px 0 !important;}
   #nav, #sub-nav, #bildspel, #main-footer, #fargval {display: none;}
   #mobile-nav, #mobile-footer {display: block;}
   #footer {text-align: center;}
   #logo img {max-width: 170px;}
   .container {padding: 5px 5px;}

   #menu-toggle {
      position: relative;
      float: right;
      height: 30px;
      width: 45px;
      margin: 0;
      top: -30px;
      line-height: 68px;
   }
   #menu-toggle:before {
      content: '';
      position: absolute;
      top: 5px;
      right: 3px;
      width: 20px;
      padding-top: 4px;
      border-bottom: 9px double #222;
      border-top: 3px solid #222;
      z-index: 99;
   }
   #menu-toggle:hover {cursor: pointer;}
   #menu-toggle:hover:before {border-color: #829aa9;}


}

/* 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) {
   #logo a h2 {font-size: 3rem;}
}