/* Styling av forms og tabller */

/* ################ TABLLER ############################
   ## Basis design ###
   ## vis loddrett på små skjerm ##
   #####################################################
*/

th {
  display: none;
}

table, td {
  display: block;
  border: black solid 1px;
  border-collapse: collapse;
  padding-right: 0.5rem;
  text-align: center;
}

table {
  margin-bottom: 20px;
  margin-right: 2px;
  width: 90%;
}

.stemmer, .epostadresse, .navn, .stemt {
  height: 20px;
}

.epostadresse { /* fargelegg først celle for å markere ny informsjon */
  background-color: #324A51;
  color: white;
  margin-top: 1.5rem;
}
  
  /* 
  ##############################################################################################
  ########## Uniform Layout for forms ##############################
  ########## Use Classy pallett from   ############
  ######### Utviklet av Shia sist endret 25.mars 2021 ###################
  ######### Utviklet av Raymond Dowling sist endret 25.mars 2021 ###################
  ##############################################################################################
  */
  
  form {
    display: flex;
    flex-direction: column;
  }
  
  label [for="kandidat_info"] {
    font-weight: 100;
    font-size: x-small;
  }
  
  label {
    font-weight: 600;
  }
   
  input {
    width: 150px;
    padding: 15px;
    margin: 10px 0 20px 0;
    background: #324A51;
    color: white;
  }
  
  input:focus {
    background: #95B0B7;
    color: #000;
  }
  
  .registerknapp1, .registerknapp {
    background-color:#6E5A7E;
    color: white;
    padding: 15px 15px;
    margin: 8px 0;
    border: none;
    cursor: pointer;
    width: max-content;
  }
  
  .registerknapp1:focus, .registerknapp:focus, .logginnBtn:focus {
    text-transform: uppercase;
    border: #599EAF solid 5px;
  }

  .registerknapp:disabled {
    background-color: grey;
  }

  select {
    width: 200px;
  }

  select option:disabled {
    color: red;
  }

  textarea {
    max-width: 90%;
  }

   /* Avgistemme for valgene  sist endret av Arientim Sopa 20.mai 2021*/
  #avgistemme {
  display: inline; 
  }
  
  #avgistemme input[type = radio] {
    width: 20px;
    display: inline;
  }

  #avgistemme label {
    display: inline;
  }
  
   
  /* ########################################################################################
  
     Nettbrett & Desktop  utviklet av Raymond Dowling sist endret 2.juni 2020

  #########################################################################################*/
 
  /* Utnytt breden ved å dele skjeamet i kolonner */
  @media only screen and (min-width: 868px) { 

    form input {
      display: block;

    }

    form[name = reg_form] {
      display: block;
      column-count: 2;
    }

    #email {
      break-after: column;
    }

    textarea {
      max-width: 80%;
    }

    /* ################ TABLLER ############################
   ## Basis design ###
   ## vis vannrett på store skjerm ##
   #####################################################
    */

    table {
      display: table;
    }

    th, td {
      display: table-cell;
    }

    th {
      background-color: #324A51;
      color: white;
      font-weight: 600;
    }

   .mobiltekst { /* skjul ekstra tekst */
      display: none;
  }
  
  .epostadresse { /* tilbakestille til fargene i tabllen */
      background-color: initial;
      color: initial;
  }
}


  @media only screen and (min-width: 1050px) {

    form[name = reg_form] {
      display: block;
      column-count: 3;
    }

    table#default {
      width: calc(90% - 400px); /* plass til bilde på default siden */
    }
  }

  @media print {
    /* samme som nettbrett */

    table {
      display: table;
    }

    th, td {
      display: table-cell;
    }

    th {
      background-color: #324A51;
      color: white;
      font-weight: 600;
    }

   .mobiltekst { /* skjul ekstra tekst */
      display: none;
  }
  
  .epostadresse { /* tilbakestille til fargene i tabllen */
      background-color: initial;
      color: initial;
  }

}