/* farger som har funket ok:
    background-color: #00735c;
    color: #dfffd1;
*/
body { /* body på index har inline css med bakgrunnsfarge svart */
    background-image:linear-gradient(90deg, #00735c, rgba(177, 245, 6, 0.5)); /*tidligere #00735c; */
/* deg er grader og funker slik: 0deg = fra topp til bunn
90deg = fra venstre mot høyre
180deg = fra bunn til topp
135deg = diagonalt fra øverst til venstre mot nederst til høyre */
    color: #ffffff;
    Font-family: Candara, Calibri, Segoe, Segoe UI, Optima, sans-serif;
    font-size: 14pt;
    margin-left: 12pt;
    margin-top: 0%;
    overflow-x: hidden; /* dette gjør at det ikke er horisontale scrollbar */
}

pre {
    white-space: pre-wrap;
    word-break: break-word;
  }

/* Alle overskrifter */
h1 {
    Font-family: Candara, Calibri, Segoe, Segoe UI, Optima, sans-serif;
    text-shadow: rgb(0, 0, 0) 0 0 7px;  
    margin-top: 6px;
    margin-bottom: 0px;
}
h2 {
    Font-family: Candara, Calibri, Segoe, Segoe UI, Optima, sans-serif;
    text-shadow: rgb(0, 0, 0) 0 0 5px;  
    margin-top: 6px;
    margin-bottom: 0px;
}
h3 {
    Font-family: Candara, Calibri, Segoe, Segoe UI, Optima, sans-serif;
    font-size: 1.5rem;
    margin-top: 6px;
    margin-bottom: 0px;
}
h4 {
    Font-family: Candara, Calibri, Segoe, Segoe UI, Optima, sans-serif;
    font-size: 20pt;
    text-decoration: double;
    margin-top: 2px;
    margin-bottom: 0px;
}

/* klasser */
.brodtekst {
    max-width: 80%;
    text-shadow: rgb(0, 0, 0) 2px 2px 3px;  /* den 3. gir blur effekt */
}

/* lister er greit å bruke i stedet for bare br og ul uten noen class lager hul sirkel, mens circle lager fylt sirkel */
.ulsquare { /* styling av lister og tegn foran hvert li element */
    list-style-type:square;
    margin-bottom: 10px;
    margin-top: 2px;
    padding-bottom: 10px;
    padding-right: 20px;
}
.ulnone { /* denne deler inn teksten i linjer etter li, men uten markør foran */
    list-style-type:none;
}

.bilde {
    width: 60%;
    height: auto;

}
.fixed {  /* brukes med taggen: div class="fixed" */
    position: fixed;
    top: 0pt;
    left: 1pt;
    padding-right: 5px;
    width: 96%;
    border: 3px solid #73AD21;
  }

.uthevetSkrift {
    font-size: 20pt;
    margin-bottom: 0%;
}

/* ID */
/* meny er på toppen av alle sider og henter opp siden meny.html */
#meny {
    padding-top: 5px;
    padding-left: 10px;
    padding-bottom: 45px;

}

/* denne er kanskje utgått og erstattet med js meny */
#ramma { /* det er angitt som navn for iframen i index og undersidene har det som target */
    background-color: antiquewhite;
    margin:0px;
    padding-left: 0px;
    padding-top: 0px;
    overflow:visible; 
}
#bildetekst {
    width: 60%;
    color: rgb(255, 255, 255);
    font-weight: bold;
    padding-left: 10px;
    text-shadow: 3px 3px 6px #000000;

}
#linker {
    max-width: 800px;
}
#nynorsk {
    display: none;
}
#dialekt {
    display: none;
}
#bandnavn {
    display: none;
}
#meny {
    background-color: black;
    Font-family: Candara, Calibri, Segoe, Segoe UI, Optima, sans-serif;
    padding-bottom: 0px;
    word-spacing: 0.5rem; /* em rem er sikkert samme som em - relativ til fontstørrelse */
}
#bgbilde {
    background-image: linear-gradient( #00735c, rgba(177, 245, 6, 0.5)), url("../img/futuristiskSteamPunkByStreetview.jfif");
    background-repeat: no-repeat;
    background-attachment: fixed;
    margin-top: 0%;
}
/* film er for youtube i skjerm i iframe, den fungerer også til trinket for python prog. som også har iframe når de emeddes */
#film {
    width: 100%;
    height: 27em; /* em er "In CSS (Cascading Style Sheets), em is a unit of measurement which indicates size relative to the size of the font. 1em means "equal to the current font size" Blackbaud.com */
    border: 4px solid rgb(234, 207, 0); /*rgb(215, 255, 225)*/
  }


a {
    Font-family: Candara, Calibri, Segoe, Segoe UI, Optima, sans-serif;
    color: gold;
    font-weight: bold;
    text-decoration: underline;
    text-decoration: dotted;
    /*font-size: 14pt;*/
}

  a:visited{
    Font-family: Candara, Calibri, Segoe, Segoe UI, Optima, sans-serif;
    color: goldenrod;
    text-decoration: underline;
    text-decoration: wavy;
    /*font-size: 14pt;*/
}

a:hover {
    color: rgb(34, 255, 0);
    text-decoration: double;
  }


.button1 {
    background-image:url(buttext.png);
    border: 1px solid dimgray;
    border-radius: 3px;
    padding-left: 12px;
    padding-right: 12px;
    font-size: 12px;}

.button1:hover {
    background-image:url(butthov.png);
    border: 2px solid #3dcdf0;
    border: 1px solid #3c7fb1;
    border-radius: 3px;
    padding-left: 12px;
    padding-right: 12px;
    font-size: 12px;}

.button1:active {
    background-image:url(buttact.png);
    border: 2px solid #3dcdf0;
    border: 1px solid #3c7fb1;
    border-radius: 3px;
    padding-left: 12px;
    padding-right: 12px;
    font-size: 12px;}

/* Styling for alle buttons */
button {
    background-color: #00735c;
    color: #ffffe6;
    padding: 10px 20px;
    border: 2px solid #ffffe6;
    border-radius: 5px;
    font-family: Candara, Calibri, Segoe, Segoe UI, Optima, sans-serif;
    font-size: 14pt;
    cursor: pointer;
    transition: all 0.3s ease;
}

button:hover {
    background-color: #ffffe6;
    color: #00735c;
    border-color: #00735c;
}

button:active {
    transform: scale(0.98);
}


