body {
  background-color: #4c4c4c;
}
#signIn {
  background-color: white;
  width: 50%;
  min-height: 619px;
  margin: 20px auto;
  text-align: center;
  padding-top: 70px;
  margin-bottom: 20px;
}
#signIn .norwegianLogin {
  position: relative;
  border-radius: 10px;
}
#signIn .norwegianLogin .topHolder {
  background: #1f4698;
  padding-bottom: 50px;
  border-top-left-radius: 9px;
  border-top-right-radius: 9px;
}
#signIn .norwegianLogin .topHolder .title {
  color: white;
  font-weight: normal;
  font-size: 30px;
  padding-top: 10px;
  padding-bottom: 15px;
  font-family: system-ui;
}
#signIn .norwegianLogin .topHolder .feideButton {
  width: 300px;
  height: 100px;
  border-radius: 10px;
  background: white;
  margin: 0 auto;
  box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.75);
  position: relative;
}
#signIn .norwegianLogin .topHolder .feideButton .feideImg {
  width: 200px;
  padding: 11px 0px;
}
#signIn .norwegianLogin .topHolder .feideButton .feideLink {
  width: 100%;
  height: 100%;
  position: absolute;
  background: none;
  left: 0px;
  cursor: pointer;
}
#signIn .norwegianLogin .topHolder .alternativeHolder {
  width: 193px;
  margin: auto;
  position: relative;
  bottom: -46px;
  cursor: pointer;
  background: none;
  border-style: none;
  padding: 0px;
}
#signIn .norwegianLogin .topHolder .alternativeHolder .stemStyleCollapsed {
  position: absolute;
  border-width: 10px;
  border-style: solid;
  border-bottom-color: transparent;
  border-top-color: transparent;
  border-left-color: white;
  border-right-color: transparent;
  top: 5px;
  cursor: pointer;
}
#signIn .norwegianLogin .topHolder .alternativeHolder .stemStyleExpanded {
  position: absolute;
  border-width: 10px;
  border-style: solid;
  border-bottom-color: transparent;
  border-top-color: white;
  border-left-color: transparent;
  border-right-color: transparent;
  top: 11px;
  cursor: pointer;
}
#signIn .norwegianLogin .topHolder .alternativeHolder .alternativeText {
  color: white;
  cursor: pointer;
}
#signIn .norwegianLogin .middle {
  margin-top: 20px;
  margin-left: 40px;
  margin-right: 40px;
  display: flex;
  margin-bottom: 30px;
}
#signIn .norwegianLogin .middle .line {
  height: 3px;
  width: 100%;
  top: 17px;
  position: relative;
  background: #bdc3c7;
}
#signIn .norwegianLogin .middle .text {
  font-size: 20px;
  font-style: italic;
  width: 200px;
  background: white;
  left: 50%;
  transform: translate(-50%);
  position: absolute;
}
#signIn .norwegianLogin .logo {
  width: 65px;
  right: 20px;
  position: absolute;
  bottom: -12px;
}
#signIn .signIn-header {
  width: 75%;
  margin: 0 auto;
  text-align: left;
}
#signIn .signIn-header .signInTitle {
  font-size: 50px;
  margin-top: 10px;
}
#signIn .signIn-header h3,
#signIn .signIn-header h4 {
  margin: 0;
}
#signIn .signIn-header h3 > img,
#signIn .signIn-header h4 > img {
  width: 100px;
  height: 100px;
}
#signIn .alert {
  width: 75%;
  margin: 0 auto;
}
#signIn .form-group {
  margin: 0 auto;
}
#signIn .form-group .signIn-label {
  width: 75%;
  text-align: left;
  color: #584e4e;
}
#signIn .form-group .signIn-input {
  width: 75%;
  margin: 0 auto;
}
#signIn .form-group .signIn-submit {
  position: relative;
  width: 75%;
  margin: 0 auto;
  text-align: left;
  margin-top: 25px;
}
#signIn .form-group .signIn-submit .alt-passwd {
  position: absolute;
  right: 0;
}
#signIn .form-group .signIn-submit .disp-inline {
  display: inline;
}
#signIn .alternatives .alt-passwd {
  width: 30%;
  margin: 0 auto;
}
#signIn .special-login {
  margin: 25px auto;
}
#signIn .special-login .ssologin {
  width: 400px;
  margin: 4px auto;
  font-size: 18px;
}
#signIn .special-login .ssologin a {
  width: 100%;
  text-align: right;
  padding-right: 10px;
  background-repeat: no-repeat;
  background-position: 2% 50%;
  color: white;
}
#signIn .special-login .ssologin .google {
  display: inline-block;
  background-image: url('../../img/google-login-icon.png');
  background-color: #000000;
}
#signIn .special-login .ssologin .google:hover {
  background-color: #464646;
}
#signIn .special-login .ssologin .microsoft365 {
  display: inline-block;
  background-image: url('../../img/microsoft365-login-icon.png');
  background-color: #0000FF;
}
#signIn .special-login .ssologin .microsoft365:hover {
  background-color: #4949FC;
}
#signIn .special-login .ssologin .feide {
  display: inline-block;
  background-image: url('../../img/feide-login-icon.png');
  background-color: red;
}
#signIn .special-login .ssologin .feide:hover {
  background-color: #FE3D42;
}
#signIn .special-login .ssologin .feide-only {
  padding-left: 50px;
  background-image: url('../../img/feide-login.png');
  background-repeat: no-repeat;
  background-position: left;
  color: black;
}
#signIn .special-login .ssologin .unilogin {
  display: inline-block;
  background-image: url('../../img/unilogin-login-icon.png');
  background-color: #CCCCCC;
}
#signIn .special-login .ssologin .unilogin:hover {
  background-color: #A1A1A1;
}
#signIn .special-login .ssologin .skolfederation-login {
  display: inline-block;
  background-image: url('../../img/skolfederation-login-icon.png');
  background-color: #EB8D40;
}
#signIn .special-login .ssologin .skolfederation-login:hover {
  background-color: #FFAC67;
}
#signIn .special-login .ssologin .sli-login {
  display: inline-block;
  background-image: url('../../img/SLIse-login-icon.png');
  background-color: #5A5A5A;
}
#signIn .special-login .ssologin .sli-login:hover {
  background-color: #8A8A8A;
}
#signIn .special-login .ssologin .digitalpedagogik-login {
  display: inline-block;
  background-image: url('../../img/digitalpedagogik-login-icon.png');
  background-color: #AB7DBB;
}
#signIn .special-login .ssologin .digitalpedagogik-login:hover {
  background-color: #CEAEDA;
}
#signIn .special-login .ssologin .skolon-login {
  display: inline-block;
  background-image: url('../../img/skolon-login-icon.png');
  background-color: #00778b;
}
#signIn .special-login .ssologin .skolon-login:hover {
  background-color: #009BB8;
}
@media (max-width: 767px) {
  #signIn {
    width: 100%;
    height: auto;
  }
}