html, body {
    height: 100%;
}

body {
    padding-top: 0px;
    font-family: 'Open Sans',verdana,sans-serif !important;
    font-size  : 12px;
    min-height : 251px; 

    /* Fix scrollbar problem on full width
       https://github.com/twbs/bootstrap/issues/10711 
    */
    overflow-x: hidden;
}
h2 {
    font-size: 18px;
}
h3 {
    font-size: 12px;
}


/* COLORS palette 
  #fff2f2; background green
  #575756; dark grey 
  #dedede; light grey
  #92c256; dark green
  #dce9c5; light green and background

*/
.ss-bg-green {
    background-color: #dce9c5;
}

.ss-dark-grey-bg {
    background-color: #575756; /* Auto contrast WCAG checks complains about color contrast ratio in footer, but a manual check is valid (Result 7.23:1, R)*/
}
/*
.ss-light-grey-bg {
   background-color: #dedede;
}

.ss-dark-green-bg {
    background-color: #92c256;
}

.ss-light-green-bg {
    background-color: #dce9c5;
}
*/
/*
.ss-dropdown-toggle {
     background-color: #dce9c5;
     border-color    : #92c256;
     border-color    : #dce9c5;
     min-width       : 100px;
}

.ss-dropdown-menu {
     background-color: #dce9c5;
     border-color    : #92c256;
     min-width       : 100px;
}

.ss-dropdown-menu > li > a {
     border-color    : #575756;
}

.ss-dropdown-menu > li > a:hover {
    background-color: #dedede;
}

.ss-dropdown-menu .ss-divider {
   background-color: #92c256;
}
*/

.ss-menu {
     padding:10px;
     margin-left: 10px;
     position: relative;
     z-index: 102;
     position: relative;
     border-bottom-left-radius: 5px;
     border-bottom-right-radius: 5px;
 }

.ss-menu a:link {
    color:black;
    text-decoration: dotted;
}
 
.ss-menu a:visited {
    color: black;
}

.ss-menu a:hover {
    color: white;
    text-decoration: underline;
    background-color:#575756;
    transition: 0.5s;
}
.ss-menu a:focus {
    color: white !important;
    text-decoration: underline;
    background-color:#575756;
}



/* tempstyle din light for payoff2 */
@font-face {
    font-family: dinLight;
    src: url(/fonts/din_light_regular.otf);
}

.ss-btn-zoom > span:first-child {
    font-size: 11px;
}

.ss-btn-zoom > span:last-child {
    font-size: 16px;
}

.ss-table-bordered {
  border: none;
}

.ss-table-bordered > tbody > tr > td + td, .ss-table-bordered > thead > tr > th + th {
    border-left: 2px solid #e0e0e0;
}

.ss-align-center {
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ss-align-right {
    float: right;
}

.table-striped > tbody > tr:nth-child(even) > td, tr.found {
    background-color: white;
}

.table-striped > tbody > tr:nth-child(odd) > td, tr.found {
    background-color: white;
}

.table-hover tbody tr:hover td {
    background: #dce9c5;
}
.table-hover tbody tr:active td {
    background: #dce9c5;
}


/* Local wrapper styling if needed again:
   The wrapper, footer, push to get the non-fixed footer behaviour
   is fetched from:
   http://stackoverflow.com/questions/21324395/bootstrap-3-flush-footer-to-bottom-not-fixed
   the bottom margin is the negative value of the footer's height
   .ss-push must be the same height as wrapper
*/
.ss-wrapper {
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -251px;
}

.ss-footer, .ss-push {
    min-height: 251px; 
    color: white;
    padding-bottom: 10px;
    z-index: 100;
    position: relative;
}

.ss-footer {
    padding-left: 0px;
}

.ss-footer-no-left-pad {
    padding-left  : 0px;
}

.ss-footer-text {
    font-size     : 14px;
    font-weight   : normal;
    margin-bottom: 20px;
    padding-left  : 0px;
    vertical-align: middle;
}
.ss-footer-text a:focus {
    color:#575756 !important;
    background-color: white !important;

}

.ss-footer-text a:link {
    padding: 10px;
    color: white;
    text-decoration: dotted;
}
.ss-footer-text a:hover {
    color: #575756 !important;
    background-color: white;
    font-size: 14px;
    text-decoration:underline;
    transition: 0.5s;
}

.ss-footer-text a:visited {
    color: white;
}

.ss-about {
    padding-top: 20px;
    background-color: white;
    position: relative;
    z-index: 100;
}

.ss-panel-heading {
    font-weight: bold;
}

/* 
.ss-logo-ext-link {
    font-size     : 14px;
    vertical-align: middle;
}

.ss-logo-ext-link-text {
    font-family: 'Open Sans',verdana,sans-serif !important;
}
*/
/*
.ss-ingress {
    font-size  : 18px;
    font-weight: 300;
    padding-bottom: 10px;
}
*/
/*
.ss-border-top {
    border-top: 3px solid;
    border-top-color: rgb(142, 154, 204);
}

.ss-border-bottom {
    border-bottom: 3px solid;
    border-bottom-color: rgb(142, 154, 204);
}
*/

.ss-lowercase {
    text-transform: lowercase;
}

.ss-logo-header {
    text-transform: uppercase;
    padding-top   : 20px;
    padding-bottom: 15px;
    font-size     : 12px;
    font-weight   : bold;
}
a:focus .ss-logo {
    background-color: white !important;
    fill:#575756;
}
.ss-logo {
    width: 200px;
    display: block;
    margin-left: 0px;
    margin-top: -20px;
    padding: 10px;
    fill: #fff;
}
.ss-logo:hover {
    background-color: white;
    fill:#575756;
    transition: 1s;
}
svg {
    display:block;
}
/* .ss-logo:hover {
    -webkit-box-shadow:inset 0px 0px 0px 2px #92c256;
    -moz-box-shadow:inset 0px 0px 0px 2px #92c256;
    box-shadow:inset 0px 0px 0px 2px #92c256;
} */
.nrd-logo {
    margin-top: -5px;
    fill:#fff;
}
.nrd-logo:hover {
    fill:#575756;
}
.ss-thumbnail-img {
    width: 80px;
    height: auto;
    display: block;
    margin-left: 15px;
}

.ss-col {
    padding-left: 0px;
}

/* 
   Adjustments to new themes from Linn Kamilla:
   Adjust query box, search and reset button and the other buttons to palette colors,
   for hover, use the ligh color variant.
*/
.input-group:hover {
    border-color: black;
}
.ss-querybox {
    border-color: #92c256;
}
.ss-querybox:hover, .ss-querybox:focus {
     border-color: #337ab7;
    /* border-width: 3px 0 3px 3px; */
     border-width: 3px;
     transition: 0s;
}

.ss-btn-search {
    background-color: #92c256;
    border-color    : #92c256;    
    color           : white;
}
.ss-btn-search:hover {
    background-color: white;
    border-color    : #337ab7;
    border-width    : 3px;
    color           : #575756;
    transition      : 1s;
}
.ss-btn-search:focus {
    background-color: white !important;
    border-color    : #337ab7;
    border-width    : 3px;
    color           : #575756;
}
.ss-btn-reset {
    background-color: #575756;
    border-color    : #92c256;
    color           : #ffffff;
    border-radius: 0%;
}  
.ss-btn-reset:hover {
    background-color: white;
    border-color    : #337ab7;
    border-width    : 3px;
    color           : #575756;
    transition      : 1s;
}
.ss-btn-reset:focus {
    background-color: white !important;
    border-color    : #337ab7;
    border-width    : 3px;
    color           : #575756;
}

.ss-whole-header {
    min-height: 250px;
}

.ss-header {
   /*  text-align: middle; */
    padding-bottom: 15px;
}

/* Header backgrounds for themes
.ss-theme-select {
    background-color: #dedede;
    padding: 10px;
}


.ss-hd-bg-green {
    background-color: #dce9c5;
    padding: 15px;
}


.ss-btn-green {
    background-color: #93c555;
    color: #000;
}
*/

.ss-empty-pad {
    padding-top   : 2%;
}

.ss-result-pad-top {
    padding-top: 20px;
}

.ss-summary-pad-top {
    padding-top: 10px;
}

.ss-summary-pad-bottom-end {
    padding-bottom: 10px;
}

.ss-result-pad-lr {
    padding-left : 10px;
    padding-right: 10px;
}

/* btn5 with dark svg i-circle, quite readable */
.ss-btn-info5 {
    background-color: #92c256; /* dark green */
    border-color    : #92c256; /* dark green */
    background-image: url(/static/img/i_button_white_121216.svg);
    background-size : 100% 100%;
    height          : 30px;
    width           : 30px;
    background-repeat: no-repeat;
    margin-top      : 3px;
    margin-bottom   : 3px;
    padding         : 0px;
    
}

.ss-btn-info5:hover {
    background-color: white; /* dark light green */
    background-image: url(/static/img/i_button_black.svg);
    border-color    : #337ab7;
    border-width    : 3px;
    transition: 1s;
}
.ss-btn-info5:focus {
    background-color: white; /* dark light green */
    background-image: url(/static/img/i_button_black.svg);
    /* border-color: #92c256; */
    border-color    : #337ab7;
    border-width    : 3px;
}

.ss-btn-summary {
     background-color: #92c256; /* dark green */
     border-color    : #92c256; /* dark green */
     color           : #000000;
     margin-top      : 3px;
     margin-bottom   : 3px;
     margin-left     : 5px;
}

.ss-btn-summary:hover, .ss-btn-summary:focus {
    background-color: white;
    border-color    : #337ab7;
    border-width    : 3px;
}

.panel-default > .panel-heading {
    background-color: #dce9c5;   
}
.panel a {
    text-decoration: underline;
}
.panel a:hover {
    background-color: #dce9c5;
    color: black;
    text-decoration: none;
}
.panel a:focus {
    background-color: #dce9c5;
    color: black;
    text-decoration: none;
    padding: 5px;
}

/*
.ss-table {
    padding-left: 10px;
    padding-right: 10px;
}
*/

.ss-bg-summary {
    background-color: #dce9c5;
    padding-left: 5px;
    padding-bottom: 10px;
    padding-top: 10px;
    font-weight: bold;
}

.ss-fg-summary {
    font-weight: normal;
    padding-left: 2px;
}

.ss-result-hd-indent {
    padding-left: 2px;
}

.ss-mute-indent {
    margin-left: 30px;
}

.ss-bg-summary2 {
    background-color: #f2f2f2; 
}

.ss-bg-summary3 {
    background-color: #e6e6e6;
    padding-top: 5px;
    padding-bottom: 5px;
}

.ss-summary-col-2 {
    width: 66.6%;
}

.ss-summary-col-3 {
    width: 33.3%;
}

/* Summary table valign to top on small devices */
.table > thead > tr > th {
   vertical-align: top;
}

/* scale the info button */
img.ss-info {
    height: 18px;
    width:  auto;
}

/* Scale the status icons */

.ss-status {
    margin-left : 5px;
    margin-right: 2px;

}

img.ss-status {
    height: 24px;
    width:  24px;
}

/* Align the summary text */
p.ss-summary-hanging-indent {
    padding-left: 40px;
    text-indent: -40px;
    word-wrap: break-word;
}


/* Align the info text */
p.ss-info-hanging-indent {
    padding-left: 35px;
    text-indent: -30px;
}

/* Align the result text */
p.ss-result-hanging-indent {
    padding-left: 25px;
    text-indent: -32px;
    word-wrap: break-word;
}

li > p > img.ss-status {
    margin-left : 0px;
}

td > img.ss-status, td > a > img.ss-status {
    margin-left : 0px;
    padding-left: 0px;
}

td > div > img.ss-status, td > a > div > img.ss-status {
    margin-left : 0px;
}

td > a.ss-btn-summary {
    margin-left: 0px;
}

img.ss-xlink {
    height: 12px;
    width:  12px;
}

.ss-btn-block-adjust {
    text-align : left;
    word-wrap  : break-word;
    white-space: normal;
    padding    : 0px;
    border     : none;
    font-size  : 12px; /* same as body */
}

a.ss-btn-block-adjust:link, a.ss-btn-block-adjust:visited, a.ss-btn-block-adjust:active {
    color: #000;
    text-decoration: none;
    outline   : none;
}

/* Disable the clear x inside the text box for IE, since we have our
  own clear button */
::-ms-clear {
   display: none;
}

/*
.ss-border { 
    border: 3px solid #000;
}
*/

/* Background image requires media queries, default is for smallest devices */
.ss-hd-logo-img-ss {
    width: 80%;
    height: auto;
    text-align: center;
    justify-content: center;
}

.ss-hd-logo-img-ss2 {
    width: 90%;
    height: auto;
    text-align: center;
    justify-content: center;
    position: relative;
    z-index: 100;
}

.ss-img-tri-logo {
    width: auto;
    height: auto;
    margin-right: 20px;
    position: relative;
    z-index: 100;
}
/*
.ss-hd-bg-img {
    background-repeat: no-repeat;
    padding: 15px;
    background-size: 100%;
    background-size: cover;
}

.ss-iframe {
   border:1px solid #93c355;
}
*/

/*--Adjustments for devices:
    Default settings for smallest devices first
*/

/*
.ss-hd-bg-img {
    background-position: right top;
}
*/

/* Bubble stuff, generated by http://ilikepixels.co.uk/drop/bubbler/
   and then tuned locally.
*/

.bubble {
    position: relative;
}
    
.bubble:after {
    content: '';
    position: absolute;
    border-style: solid;
    display: block;
    width: 0;
    border-width: 0px 10px 14px 10px;
    border-color: #dce9c5 transparent;
    z-index: 1;
    top: -14px;
    left: 7.9%;
}
    
.bubble2:after {
    border-width: 0px 10px 14px 10px;
    border-color: #dce9c5 transparent;
    z-index: 1;
    top: -14px;
    left: 7.9%;
}
    
.bubble3:after {
    border-width: 0px 10px 14px 10px;
    border-color: #dce9c5 transparent;
    z-index: 1;
    top: -14px;
    left: 7.9%;
}

ul.ss-info {

    list-style-type: none;
    padding-left: 10px;

}

/* ton-i-ton pattern */

.ss-background {
  height: 80%;
  width : 100%;
  background-color: transparent;
  background-image: url(/static/img/bakgrunnsrapport.png);
  background-attachment: scroll;
  background-clip: border-box;
  -webkit-background-clip: border-box;
  background-origin: padding-box;
  background-position-x: 100%;
  background-position-y: 0px;
  opacity: 0.25;
  position: absolute;
  top: 0px;
  background-size: auto 30%;
}

/* tooltip tunings */
.tooltip-inner {
    background-color: #000;
    color: #fff;
    font-size: 16px;
    text-indent: 0px;
}

.ss-textsize + .tooltip > .tooltip-inner {
    font-size: 24px;
}

.info-attention {
    /* border: 2px solid #fbcc24; */
    background-color: #fff1c2;
}

.ss-link-on-grey {
    color: #000;
    text-decoration: underline;
}

/* Iphone 5 size */
@media (min-width: 320px) {

    body {
	font-size  : 11px;
    }


    .ss-btn-block-adjust {
	font-size : 11px; /* same as body */
    }

    
}

@media (min-width: 375px) {

    body {
	font-size  : 13px;
    }

    .ss-btn-block-adjust {
	font-size : 13px; /* same as body */
    }

}

@media (min-width: 768px) {

    
    body {
	font-size  : 14px;
    }

    .ss-empty-pad {
	padding-top   : 4%;
    }

    
    .ss-btn-block-adjust {
	font-size : 14px; /* same as body */
    }

    .ss-background {
	background-size: auto 40%;
    }
    
    .ss-status {
	margin-left : 10px;
	margin-right: 4px;
    }

    .ss-img-tri-logo {
	width: 300px;
    }
    

    /* Scale the status icons */
    img.ss-status {
	height: 28px;
	width:  28px;
    }

    ul.ss-info {

	list-style-type: none;
	padding-left: 25px;
    }

    /* Align the info text */
    p.ss-info-hanging-indent {
        padding-left: 30px;
        text-indent: -38px;
    }
    
    /* empty summary rows same height as ss-status */
    .ss-empty-row {
        height: 28px;
    }


    /* adjust md input box and buttons to lg size on bigger screens */
    .ss-input-md {
	font-size: 18px;
	height: 46px;
	line-height: 1.33333333;
    }
    
    td > img.ss-status, td > a > img.ss-status {
	margin-left : 5px;
    }

    td > div > img.ss-status, td > a > div > img.ss-status {
	margin-left : 5px;
    }
/*
    .ss-hd-bg-img {
	background-position: left top;
    }
*/  
    .ss-hd-logo-img-ss {
	width: auto;
	height: auto;   
    }
    
    .ss-hd-logo-img-ss2 {
	width: auto;
	height: auto;
	text-align: center;
	justify-content: center;
    }

    /* use bootstrap container default
    .ss-table {
	padding-left: 15px;
	padding-right: 15px;
    }
    */
    
    .ss-bg-summary {
	padding-left: 10px;

    }

    .ss-result-hd-indent {
	padding-left: 5px;
    }
    
    .ss-mute-indent {
	margin-left: 42px;
    }

    .ss-thumbnail-img {
	margin-left: 25px;
    }

    .ss-footer {
	padding-left: 20px;
    }

    .ss-btn-info {
	padding  : 1px 4px 0px 4px;
    }
    
    .ss-btn-summary {
	font-size       : 14px;
    }

    .ss-result-pad-lr {
	padding-left: 4px;
	padding-right: 4px;
    }
    
    .bubble:after {
	border-width: 0px 20px 24px 20px;
	top: -20px;
    }
	
    .bubble2:after {
	border-width: 0px 20px 24px 20px;
	left: 38.4%;
	top: -20px;
	
    }
    
    .bubble3:after {
	border-width: 0px 20px 24px 20px;
	left: 74.4%;
	top: -20px;
    }


    .ss-btn-info5 {
	height          : 33px;
	width           : 33px;

    }

}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {

    body {
	font-size  : 16px;
    }

    .ss-btn-block-adjust {
	font-size : 16px; /* same as body */
    }

    .ss-background {
	background-size: auto 30%;
    }
    
    .ss-thumbnail-img {
	margin-left: 10px;
    }

}


/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {

}