/* Go crazy with your own styles here */
/* EDITOR PROPERTIES - PLEASE DON'T DELETE THIS LINE TO AVOID DUPLICATE PROPERTIES */

/*
    FARGESTRIPE
    lyscyan: 00ccff
    blå: 00b4cc
    blågrønn: 009999
    mørkblågrønn: 006666
    Mørkgrå: 333333

    LOGOFARGER
    logolys: ebebbc
    logoblå: bce3c5
    logorød: ee2143
    logomørk: 343838
*/

body {
    background-color: #eee;
    color: #333;
}

.umb-grid p {
    margin-bottom: 1rem;
}

.text-center {
    text-align: center;
}

header {
    background-color: #333;
    height: 110px;
    margin-bottom: 70px;
}
header:before{
    content: " ";
    position: absolute;
    top: 110px;
    height: 20px;
    width: 100%;
    background: url(/css/Images/Farge-strek-mini2.png) bottom repeat-x;
}

h1 {
    color: #333; 
    font-size: 36px;
}
.brand{
    height:113px; 
    width:98px;
    margin-left: 0;
    position: relative;
    margin-top: 20px;
    }
nav{
    text-align: left;
}
.dark {
    background: #333;
}
.dark p,
.light p,
.yellow p, .blue p,
.purple p,
.dark a,
.light a,
.yellow a,
.blue a,
.purple a,
.dark blockquote,
.light blockquote,
.yellow blockquote,
.blue blockquote,
.purple blockquote,
.dark li, .light li,
.yellow li,
.blue li,
.purple li {
    font-family: "Lato", sans-serif;
}
.elementheader  {
    color:#00b4cc;
    font-size:1.4rem;
    margin-bottom: 20px; 
    padding-bottom:10px;
    border-bottom: solid 2px #00b4cc;
    
}
footer.dark a, 
footer.dark a:visited, 
footer.dark a:active{
    color:#ebebbc !important;
    border-bottom:1px solid #ebebbc !important;
    padding-bottom: 3px;
}
footer.dark a:hover{
    color:#bce3c5 !important;
    border-bottom:1px solid #bce3c5 !important;
    padding-bottom: 3px;
}

/** 
    *SIDENAV 
*/

#side-menu {
        display: none;
    }

#side-menu a, #side-menu a:visited {
    white-space: normal;
}

#side-menu ul {
    list-style: none;
    margin: 0;    
}
#side-menu > ul {    
    background: #00b4cc;
    padding: 10px 0 10px 0;
    margin-bottom: 20px;
}

/* 1-LEVEL*/
#side-menu > ul > li > ul a {
    padding-left: 30px;
}

/* 2-LEVEL*/
#side-menu > ul > li > ul > li > ul a {
    padding-left: 50px;
}

/* 3-LEVEL*/
#side-menu > ul > li > ul > li > ul > li > ul a {
    padding-left: 70px;
}

/* 4-LEVEL*/
#side-menu > ul > li > ul > li > ul > li > ul > li > ul a {
    padding-left: 90px;
}

#side-menu li a {
    display: block;
    padding: 0 10px; 
    color: #fff;
}
#side-menu li a.active-trail {
    background: #009999;
}
#side-menu li a.active {
    background: #006666;
}
#side-menu li a:hover {
    background: #00ccff;
}

@media (min-width: 992px) { 
    #side-menu {
        display: block;
    }
    #side-menu > ul {       
        min-height: 300px;
    }
}

/**
    *CATEGORY-CHILDREN
*/

.category-children .col-sm-4, .category-children .col-sm-3, .category-children .col-sm-2, .category-children .col-sm-6, .category-children .col-sm-1 {
    margin-bottom: 20px;
}

.category-children a {
    white-space: normal;
}

@media (max-width: 767px) { 
    .category-children .col-sm-4, .category-children .col-sm-3, .category-children .col-sm-2, .category-children .col-sm-6, .category-children .col-sm-1 {
        margin-bottom: 40px;
        padding-bottom: 20px;
        border-bottom: solid 1px #00b4cc;
    }
}

/**
    *PAGE TITLE
*/

.page-title {
    border-bottom: solid #00b4cc;
}

.top-banner {
    margin-top: 20px;
}

/**
    *BREAD CRUMBS
*/

.breadcrumb {
    padding: 8px 15px;
    margin-bottom: 20px;
    list-style: none;
    background-color: #f5f5f5;
    border-radius: 4px;
    position: initial;
}

.breadcrumb>li+li:before {
    padding: 0 5px;
    color: #ccc;
    content: "/\00a0";
}

.breadcrumb:hover {
    background: #f5f5f5;
}

.breadcrumb>li {
    display: inline-block;
}
.breadcrumb>li a, .breadcrumb>li a:visited {
    color: #00b4cc;
    font-size: 1rem;
}

/**
    Image caption
*/

img + p.caption {
    font-style: italic;
}

/**
    *NAV - MOBILE
*/

nav {
    background: #333;
}

@media (min-width: 992px) {
    nav {
        background: none;
    }
}