body header.top .logo {
    background: url("../images/sssid-logo.svg");
    height: 0;
    width: 40%;
    padding-bottom: calc(40% *61 /1061);
    background-size: cover;
   }

body header.top {
	background-color: #116A3E;
	max-width: 2000px;
}
img.info-icon-header[src=""], img.info-icon-header[src="res/images/backgrounds/transparent.png"], img.info-icon-header[src="res/images/icons/bird-pas-icon.png"], img.info-icon-header[src="authenticate/res/images/backgrounds/transparent.png"], img.info-icon-header[src='/authenticate/res/images/backgrounds/transparent.png'] {
    background: none !important;
    content: none !important;
    background-size: auto 100%; }

html, body, .container {
    height: 100%;
    min-height: 600px;
}

@media (min-width: 600px) {
    body {
        background: none;
		    }
}		
body {
   background-color:#e6e6e6;
}

/* Set header at left information page to left aligned */
h1.info-title {
  text-align: left; }

/* Change for small windows = Office login pages */
@media (max-width: 600px) {
	.info-header {
		min-height: 0px;
		height: min-content;
	}
	.info {
		height: min-content;
	}
	header.top {
		height: 50px
	}
}

.info {
	background: #116A3E;
	padding: 20px
	
}

.info-content:focus-visible {
     outline: 3px solid black;
}
.info-content:focus {
     outline: none;
}


/* Knapp på autentiseraren */
.btn-primary {
	background: #4a52b6;
	color: #FFFFFF
}
.btn.primary:hover,
.btn-primary:focus {
	background: #4a52b6;
	box-shadow:0 0 0 2px #fff,0 0 0 4px #1b1e23,0 0 0 6px #fff;
	} 

/* Tillagd for VerifyMBID knapparna sa de ser lika ut som andra */
button.button-huge.btn-primary {
    margin: 25px auto;
    font-weight: 600;
    border-radius: 16px;
    -webkit-border-radius: 16px;
    -moz-border-radius: 16px;
    line-height: 40px;
    letter-spacing: 0.33px;
    height: 40px;
    min-width: 150px;
    padding: 0 25px;
    display: flex;
    justify-content: center; }
    @media only screen and (max-width: 600px) {
      .btn.button-huge,
      *.btn.button-huge,
      button.btn.button-huge,
      *.button.button-huge,
      *.button-huge.btn-primary,
      .button.button-huge,
      .button-huge.btn-primary,
      button.button.button-huge,
      button.button-huge.btn-primary {
        min-width: 100px; } }

/* Knapp på VerifyMBID sidan */
.squarebutton {
	background: #4a52b6;
}
.squarebutton:hover,
.squarebutton:focus,
.squarebutton:focus {
	background: #4a52b6;
	box-shadow:0 0 0 2px #fff,0 0 0 4px #1b1e23,0 0 0 6px #fff;
	} 
.squarebutton:active {
    background-color: #4a52b6;
}
.cancel-button:focus{
    box-shadow:0 0 0 2px #fff,0 0 0 4px #1b1e23,0 0 0 6px #fff;
} 
	
/* Info Frame Border */

main .card {
	border: 1px solid #116a3e;
	}

/* frame around input fields */
fieldset input {
    border: 2px solid gray;
}
/* Left boarder frame when input */
fieldset input:focus {
        box-shadow:0 0 0 2px #fff,0 0 0 4px #1b1e23,0 0 0 6px #fff;
        }
fieldset input:active {
  -webkit-box-shadow: inset 2px 0px 0px 0px gray;
  box-shadow: inset 2px 0px 0px 0px gray; }

/* Selector choices */

/* Bakgrund utan nagot valt */
div.selector-container {
  border: 0px solid #4a52b6;
  background: #4a52b6;
}
/* Textfarg for allt pa selectorer */
div.selector-container * {
    color: white !important;
}
/* ram runt varje val nar man tabbar */
div.selector-container a:focus{
  border: 3px solid black;
  background: #5c64bd;
  outline-color: black;
}

/* Text och bakgrund vid hoovring */
div.selector-container a:hover {
      border-radius: 4px;
      background: #5c64bd; }

/* Avbryt knappens farg */
button#cancel-button,button#qr-cancel-button,button#sd-cancel-button {min-width: auto;background: #1b1e23;}