/* ---------------------------------------------- Global css ------------------------------------------------------------------------------ */
.requiredDot{
  color: red;
}
#alertGrønn {
  padding: 20px;
  background-color: Green; /* Grønn */
  color: white;
  margin-bottom: 15px;
  text-align: center;
}
#alertGrønn:before{
  content:"✔";
  padding: 15; 
}
#alertRød {
  padding: 20px;
  background-color: Red; /* Rød */
  color: white;
  margin-bottom: 15px;
  text-align: center;
}
#alertRød:before{
  content:"✖";
  padding:15;
}

/*
#signup-response{
  padding:20px;
  text-align: center;
  background-color: green;
  
   animation:signup-response 0.5s 1;
  -webkit-animation:signup-response 0.5s 1;
  animation-fill-mode: forwards;
  
  animation-delay:2s;
  -webkit-animation-delay:1s; /* Safari and Chrome */
  /*-webkit-animation-fill-mode: forwards;
  
  
} 

@keyframes signup-response{
  from {opacity :1;}
  to {opacity :0;}
}

@-webkit-keyframes signup-response{
  from {opacity :1;}
  to {opacity :0;}
}
*/

/* Lukkeknappen */
.closebtn {
  margin-left: 15px;
  color: white;
  font-weight: bold;
  float: right;
  font-size: 22px;
  line-height: 20px;
  cursor: pointer;
}

/* Hovrer musepeker over lukkeknappen */
.closebtn:hover {
  color: black;
}
/* ---------------------------------------------- index.php ------------------------------------------------------------------------------ */
html,body {
  width: 100%;
  margin:0;
  padding:0;
  background: #232323;
  color: #cdcdcd;
}
html{
  min-height: 100%;
  position:relative;
}
body{
  margin:65px 0 100px 0;
}
main {
  /*min-height: calc(120vh - 211px - 58px);*/
  /* min-height: calc(120vh); */
  /*min-height: calc(98vh - 210px);*/
}
html {
  font-family: "helvetica neue", sans-serif;
}
.loginsom{
  text-align: right; 
  margin: 0px 10px 10px 0; 
  color: lightgreen;
}
h1, h2 {
  text-align: center;
}

nav {
  position: fixed;
  top: 0;
  z-index: 2;
  width: 100%;
  border-bottom: 1px solid white;;
  text-align: right;
  background-color: #2B2C30;
}
.menu {
  margin: 0 30px 0 0;
  list-style-type: none;
  margin: 0px 0px;
  line-height: 70px;
  background-color: #2B2C30;
  display: none;
  clear:right;
}

.menu a{
  color: white;
  text-decoration: none;
  text-align: center;
  width: 100%;
  border-top:1px solid #EAEAEB;
  border-bottom: 1px solid #EAEAEB;
  display: block;
  margin: 0;
  background-color:#234039;
}
.menu a:hover{
  color: #959595;
}
label {
  margin: 0 20px 0 0;
  font-size: 30px;
  line-height: 50px;
  width: 26px;
  display: block;
  cursor:pointer;
  float : right;
}
#toggle {
  display: none;
}
footer {
  bottom: 0;
  position: absolute;
  width: 100%;
  overflow: hidden;
  text-align: center;
  background-color: #2B2C30;
  border-top:1px solid #EAEAEB;
  font-size: smaller;
}

/* footer p {
  width: auto auto;
} */

label:hover{
  color: #5FA69F; 
}
ul.menu {
  margin-right: 0px;
  padding: 0px 0px 0px 0px;
}
#toggle:checked + .menu {
  display: block;
}

#indexArtikkel {
  text-align: center;
  display: block;
  width: 100%;
  margin: auto;
}
#indexArtikkel p {
  padding-top: 20px;
  padding-bottom: 20px;
}
#indexArtikkel h3 {
  border: solid 3px;
  width: 95%;
  padding: 5px 0px 5px 0px;
  margin:auto;
  margin-bottom: 20px;
  font-size: medium;
}
#indexArtikkel a:visited, a:link {
  color: lightblue;
}
#indexArtikkel a:hover {
  color: blue;
}
#resFremvisning {
  width: max-content;
  margin-left: auto;
  margin-right: auto;
  border: 3px solid;
  /* Høyde på tabellen */
  /*overflow-y:auto;
  height: 200px;
  display:block;*/
}
#fremvisningTabell{
  margin: 5px 7px 7px 7px;
}
#resFremvisning h3 {
  margin: 5px 5px 5px 5px;
  color:#A7B7D9;
  text-align: center;
}
#fremvisningTabell td{
  margin: 100px;
}
.test{
  color:#A7B7D9;
}
#stemmer{
  padding-left: 20px;
}

  /*-------------------------------------nominering.css-----------------------------------------------------------*/

.nom_artikkel{
  padding:3px;
}
/*Sørger for at tabellen kan skrolles dersom tabellen blir høyere enn angitt høyde
og sørger for at scrollbaren hele tiden ligger inntil tabellen "fit-content" go sentrerer tabellen
Sentrerer tabellen med margin auto */
#registrert_kan {
  border-collapse: collapse;
  overflow-y:auto;
  height: 300px;
  display:block;
  width:max-content;
  margin-left: auto;
  margin-right: auto;
}
/* Gjør tableheading sticky slik at de synes selv når du scroller langt ned  */
#registrert_kan th {
  top: 0;
  z-index: 1;
  position: sticky;
  background-color:#2B2C30;
  border-bottom: 1px solid white;
  padding: 10px;
}
#registrert_kan td {
  border-bottom: 1px solid white;
  padding: 5px;
}
/* Sentrerer tabellen */
#ny_kandidat{
  margin-left:auto;
  margin-right:auto;
}
#ny_kandidat td{
  padding-bottom: 10px;
}
#ny_kandidat th{
  color:#A7B7D9;
}
#reg_knapp{
/*Prøver å justere knapp til å alltid ligge sentrert med feltet over */
  margin-left: 30%;
  cursor: pointer;
  width: 100px;
}
.nom_input1{
  cursor: text;
  width: 279px;
  height: 25px;
}
textarea {
  font-family: arial;
  width: 280px;
  height: 130px;
  cursor: text;
}
#navn_sok{
  width: 287px;
  height: 30px;
}
#ny_kandidat2{
  display: none;
}
#reg_knapp2{
  display: none;
  cursor: pointer;
}
.nom_artikkel_skjult{
  display:none;
}
#nom_header, h1{
  margin:0px;
}
#nom_select{
  width: 287px;
}


/*-------------------------------------registrering.css-----------------------------------------------------------*/
.tabellRegistrering, .kolonne1, .tdRegistrering {
  border-collapse: collapse;
}
.tdRegistrering {
  text-align: center;
}
.kolonne1, .tdRegistrering {
  padding: 5px;
  /* border-spacing: center; */
}
.tabellRegistrering {
  width: 100%;
  border-spacing: 15px;
  margin-left: auto;
  margin-right: auto;
}
.tdRegistrering .button {
  text-align: center;
}
.button {
  background-color: lightgreen;
  width: 30%;
  height: 35px;
  margin-top: 3px;
  text-align: center;
  cursor: pointer;
  border: 1px solid lightgreen;
  /* border-radius: 40%; */
}
.button:hover {
  border: 3px solid green;
}
.inputKnapp {
  height: 30px;
  width: 300px;
  background-color: white;
  font-size: 13px;
}

/*
.inputKnapp:hover {
border: 3px solid green;
} */

#alleredeRegistrert {
  text-align: center;
}
.tdRegistrering #alleredeRegistrert a:hover {
  color: blue;
  cursor: pointer;
}
.kolonne1 {
  text-align: center;
  color:#A7B7D9;
}
#vilkår {
  color: lightblue;
  margin-right: 10px;
}
#checkbox {
  transform: scale(2);
  margin-top: 10px;
}
input[type="checkbox"]:checked + label::before {
  background: green;
  background-color: green;
}
#checkbox:checked {
  background-color: green;
}
#vilkår:hover {
  color: blue;
  cursor: pointer;
}
#overskriftRegistrering {
  text-align: center;
  margin-top: 5px;
  margin-bottom: 5px;
}
#vis1 {
  display: none;
  margin-left:auto;
  margin-right:auto;
}
/*-------------------------------------------------minside.php------------------------------------------------------*/
#minsideMain {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  align-items: center;
}
#byttBilde {
  display: flex;
  flex-direction: column;
  align-items: center;
}
#trekkNominasjon {
  margin-top: 25px;
  margin-left: 0px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
#trekkNominasjonBekreft {
  margin-top: 10px;
  width: 100px;
}
#trekkNominasjon input[type=checkbox] {
  transform: scale(2);
}
#forlatNominasjon {
  background-color: red;
  margin-top: 35px;
  color: white;
  width: 200px;
  border-color: lightcoral;
}
#kandidatInfo {
  margin-top: 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
#endreInfoTabell tr{
  display: flex;
  justify-content: center;
  align-items: center;
}
#endre_knapp {
  width: 125px;
  margin-left: 14%;
}
.endreValgInfo{
  width: 170px;
}
#fakultetE {
  height: 25px;
  width: 280px;
}

#instituttE {
  height: 25px;
  width: 280px;
}
#infoE {
  width: 280px;
}
#byttPassordSec {
  margin-top: 0px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
#lastoppknapp {
  /* Style last opp knappen, flytte den til raden under? */
  cursor: pointer;
  float: right;
}
#fillastesopp{
  cursor: pointer;
}
#byttPassord {
  padding: 10px;
}
#byttPassord th {
  color: #A7B7D9;
}
#gammeltPassord {
  width: 250px;
  height: 25px;
  margin: 5px;
}
#nyttPassord {
  width: 250px;
  height: 25px;
  margin: 5px;
}
#ByttPWKnapp {
  width: 100px;
  margin-top: 10px;
  margin-left: 32%;
}
#utnevnBrukerType{
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 50px;
}
#brukerTypeForm{
  display: flex;
  flex-direction: column;
  align-items: center;
}
#brukerTypeForm button{
  width: 100px;
}
#velgBrukerType{
  margin:10px;
}
#endreValg {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 50px;
}
#fjerntrukket{
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 50px;
}
#submit_fjernTrukket{
  width: 100px;
  height: 50px;
}
#endreValgInfoTabell th {
  color: #A7B7D9;
}
#endreValgInfoTabell th small {
  color:  #cdcdcd;
}
#konsistensknapp{
  width:100px;
}

/*-------------------------------------------------Logginn.php-----------------------------------------------------*/
.box{
  position: relative;
  background: #2B2C30;
  max-width: 330px;
  margin: 0 auto 100px;
  padding: 30px;
  text-align: center;
  box-shadow: 0 0 20px 0 black, 0 5px 5px 0 black;
}
/* Farge på overskriften i login */
.box h3{
  color: #cdcdcd;
}
/* Farge(tekst og felt) og størrelse på inputfelt(email og passord) */
.box input[type="text"],.box input[type= "password"]{
  background: white;
  color: black;
  box-sizing: border-box;
  font-size: 14px;
  width: 100%;
  margin: 0 0 15px;
  padding: 15px;
}
/* Størrelse,farge og cursor på login-knapp */
.box input[type ="submit"]{
  text-transform: uppercase;
  background-color: lightgreen;
  width: 100%;
  border: 3px solid lightgreen;
  padding: 15px;
  color: black;
  font-size: 14px;
  cursor: pointer;
}
/* Hover for logginn-knapp og glemt passord-hyperlink */
#logginn:hover {
  border: 3px solid green;
}
#glemtpassord:hover {
  color:blue;
}
/* ---------------------------------------------- avstemming.php ------------------------------------------------------------------------------ */
#avstemKnapp{
  width:100px;
  margin: 5px ;
}
.testsentrer{
  text-align:center;
}
#sentrerbilde{
  margin-left:auto; 
  margin-right:auto; 
}
#duharstemt{
  margin-left: 10px;
}
#stemmesvar{
  margin-top:10px;
  border: 2px solid #cdcdcd;;
  margin-left:auto; 
  margin-right:auto; 
  width: 250px; 
  color: #cdcdcd;
  
}
#fjernStemmeKnapp{
  width:100px;
  background-color: red;
  color: white;
  border-color: lightcoral;
  margin: 10px 0px 10px 0px;
}
#seMer {
  width:100px;
  margin: 5px;
}
#visInfoAvstem {
  color: #cdcdcd;;
  border: 2px solid;
  width:300px;
  margin-left:auto; 
  margin-right:auto; 
}
#visInfoAvstem img{
  size:50%;
  width:170px;
  padding: 10px;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
#infoTekst{
  border-bottom: 1px solid;
  text-align: center;
}
 /*--------------------------------------------------informasjon.php-----------------------------------------------------------------*/
 /* Justering av section som inneholder info om hver kandidat */
 #visInfo{
  border: 2px solid;
  width:300px;
  margin-left:auto; 
  margin-right:auto; 
 }
 /* Bilde inni section */
 #visInfo img{
  display: block;
  margin-left: auto;
  margin-right: auto;
  padding: 10px;
 }
 /* Teksten inni section */
 #infoTekst{
   border-bottom: 1px solid;
   width: 250px;
   margin-left: auto;
   margin-right: auto;
 }
 #infoKnappForrige {
  text-decoration: none;
  display: inline-block;
  padding: 8px 16px;
  margin: 0px 15px 0px 15px;  
}

#infoKnappForrige:hover {
  background-color: #ddd;
  color: black;
} 
#infoKnappNeste {
  text-decoration: none;
  display: inline-block;
  padding: 8px 16px;
  margin: 0px 15px 0px 15px;  
}

#infoKnappNeste:hover {
  background-color: #ddd;
  color: black;
} 

#knappsection{
  margin-left: auto;
  margin-right: auto;
  width: 150px;
  padding: 10px;
}
.previous {
  background-color: #f1f1f1;
  color: black;
}
.next {
  background-color: #f1f1f1;
  color: black;
}

.round {
  border-radius: 50%;
}
#h1{
  text-align: center;
  padding-bottom: 10px;
}
/*-------------------------------------------------Konsistens.php-----------------------------------------------------*/
#konsistensMain{
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-content: center;
}
#stemmetelling{
  margin: 10px;
  width: 45%;
}
#stemmetelling h3{
  text-align: center;
}
/*Tabell */
#stemmetabell{
  border-collapse: collapse;
  margin: auto;
}
#stemmetabell th{
  border-bottom: 1px solid;
  padding: 2px 0px 2px 0px;
}
#stemmetabell td{
  text-align: center;
  border-bottom: 1px solid;
  padding: 2x 0px 2px 0px;
}
#publiserValgKnapp{
  width: 130px;
}
#epost_sjekk{
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 10px;
  width: 45%;
}
#epost_tabell{
  border-collapse: collapse;
  overflow-y:auto;
  height: 300px;
  display:block;
  width:300px;
  margin-left: auto;
  margin-right: auto;
}
#epost_tabell td {
  border-bottom: 1px solid white;
  padding: 10px;
  width: 300px;
  text-align: center;
}
#publiserValg{
  display: flex;
  justify-content: center;
  margin-top: 50px;
}
#trekkValgKnapp{
  width: 130px;
  background-color: red;
  color: white;
  border-color: lightcoral;
}



/* Small devices (portrait tablets and large phones, 600px and up) */
@media  (min-width: 600px) {
  /*-------------------------------------generell/meny(global)css-----------------------------------------------------------*/
  footer{
    font-size: initial;
  }
  body{
    margin:85px 0 100px 0;
  }
  .menu #status {
    float:left;
    width: initial;
    display:inline-block;
    background-color: #2B2C30;
    border: none;
  }
  select {
    max-width:400px;
  }
  .menu li{
    display: inline;
    padding-left: 10px;
    margin-right: 20px;
  }
  .menu{
    display: block;
  }
  .menu a{
    width: initial;
    display:inline-block;
    background-color: #2B2C30;
    border: none;
  }
  label { 
    display: none;
  }
  #indexArtikkel h3{
    width: max-content;
    padding: 5px 40px 5px 40px;
  }
  /*-------------------------------------avstemmming.php-----------------------------------------------------------*/
  #buttonAvstemming { 
    width:200px;
  }
  /*-------------------------------------nominering.css-----------------------------------------------------------*/
  .nom_artikkel_skjult{
    display:table-cell;
  }
  #registrert_kan th{
    border: 1px solid white;
  }
  #registrert_kan td{
    border: 1px solid white;
  }
  /* Justerer størrelse på inputfeltene*/
  .nom_input1{
    width: 300px;
  }
  #navn_sok{
    width: 308px;
  }
  textarea{
    width: 300px;
  }
  /* Justerer knapp på ny til tablet-visning */
  #reg_knapp{
    margin-left: 35%;
  }
  #nom_select{
    width: 308px;
  }

  /*------------------------------------------------- Registrering.php -------------------------------------------------------------------- */
  #alleredeRegistrert {
    text-align: center;
  }
  .tdRegistrering {
      text-align: center;
  }
  .tabellRegistrering {
    width: 60%;
    height: 300px;
  }
  .kolonne1 {
    text-align: right;
    font-size: Large;
    margin-left: 0px;
    margin-right: 0px;
    width: 100%;
  }
  .inputKnapp {
    height: 100%;
    width: 400px;
    background-color: white;
    font-size: 20px;
  }
  .button {
    border-radius: 0%;
  }
  #overskriftRegistrering {
    text-align: center;
    margin-top: 20px;
    margin-bottom: 20px;
  }

  .kolonne1, .tdRegistrering {
    padding: 15px;
    /* border-spacing: center; */
  }
  #vis1 {
    display: block;
  }
  #vis2 {
      display: none;
  }
  /*-------------------------------------------------Konsistens.php-----------------------------------------------------*/
  #stemmetabell{
    border: 1px solid;
    border-collapse: collapse;
    margin: auto;
  }
  #stemmetabell th{
    border: 1px solid;
    padding:7px;
  }
  #stemmetabell td{
    text-align: center;
    border: 1px solid;
    padding: 7px;
  }
  #konsistensMain{
    flex-direction: row;
  }
}
/* Large devices (laptops/desktops, 992px and up) */
@media (min-width: 992px) {
  .loginsom{
    margin: 0px 10px 0px 0; 
  }
  /*#indexArtikkel h3{
    max-width: 30%;
  }*/
  /*-------------------------------------nominering.css-----------------------------------------------------------*/
  /*Bryter siden  slik at det blir 2 kolonner i desktop-visning */
  #nom_main		{column-count: 2;
  }
  #bryt2	{break-before: column;
  } 
  /* Justerer knapp på ny til desktop-visning*/
  #reg_knapp2{
  display: block;
  margin-left: 14%;
  }
  /* Justerer størrelse på inputfeltene*/
  .nom_input2{
    width: 350px;
    height: 30px;
  }
  #navn_sok{
    width: 358px;
  }
  textarea{
    width: 351px;
  }
  /* Øker høyden på tabellvisning */
  #registrert_kan{
    height: 360px;
  }
  /*tabell til mobilvisning*/
  #ny_kandidat{
    display: none;
  }
  /*tabell for tablet og desktop*/
  #ny_kandidat2{
    display:table;
    margin-left:auto;
    margin-right:auto;
  }
  #ny_kandidat2 th{
    padding: 0px 5px 0px 0px;
    text-align: right;
    color:#A7B7D9;
  }
  #ny_kandidat2 td{
    padding: 10px;
  }
  /* Styler dropdowmenyen med navn */
  #nom_select{
    width: 350px;
  }

  #registrert_kan td{
    padding: 4px;
  }

  /*------------------------------------------------- Registrering.php -------------------------------------------------------------------- */
  
  #alleredeRegistrert {
  text-align: center;
  }
  .tabellRegistrering {
    width: 60%;
    margin-left: 15%;
    margin-right: 0%; 
    height: 300px;
  }
  .kolonne1 {
    text-align: right;
    font-size: Large;
    margin-left: 0px;
    margin-right: 0px;
    width: 100%;
  }
  .kolonne1, .tdRegistrering {
    padding: 15px;
    /* border-spacing: center; */
  }
  .inputKnapp {
  height: 100%;
  width: 500px;
  background-color: white;
  font-size: 20px;
  }
  #vis1 {
    display: block;
  } 
}

@media (min-width: 1200px) {

/*------------------------------------------------- Registrering.php -------------------------------------------------------------------- */
  #alleredeRegistrert {
  text-align: center;
  }

  .tabellRegistrering {
    width: 50%; 
    border-spacing: 50px;
    margin-left: 20%;
    margin-right: 0%; 
    height: 400px;
  }
  .kolonne1 {
    text-align: right;
    font-size: Large;
    margin-left: 0px;
    margin-right: 0px;
    width: 100%;
  }
  .inputKnapp {
  height: 100%;
  width: 600px;
  background-color: white;
  font-size: 20px;
  }
  .tdRegistrering {
    text-align: center;
  }
  .kolonne1, .tdRegistrering {
    padding: 15px;
    /* border-spacing: center; */
  }
  .button {
    border-radius: 0%;
  }
  #vis1 {
    display: block;
  }

  /*--------------------------------------------minside.php-----------------------------------------------*/
  #minsideMain{
    flex-direction: row;
  }
  .minsideFlex {
    width: 25%;
    flex-direction: row;
    justify-content: space-between;
  } 
  .trekkFlex {
    width:25%;
    text-align: center;
  }
  #byttBilde {
    order: 1;
  }
  #byttPassordSec {
    order: 3;
  }
  #kandidatInfoHide {
    order: 2;
  }
  #trekkNominasjon {
    order: 4;
  }
  #utnevnBrukerType {
    order: 5;
  }
  #endreValg {
    order: 6;
  }
  #fjernTrukket {
    order: 7;
  }
  #konsistens{
    order: 8;
  }
}