@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@200&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lemonada:wght@300&display=swap');
:root {
    --mainPlava:#658aa9ff;
    --tamnoPlava:#142636;
    --svijetloPlava:#abd4f5ff;
    --mainWhite:#fff;
    --plavaJakoSvijetla:#e8f5ff;
    --plavaJakoTamna:#060c11;
    --normalnoPlava:#2e475c;


}
body {
    color:var(--mainWhite);
    background:var(--svijetloPlava);
    font-family: 'Montserrat', sans-serif;
    font-size:1em;
}

.normal_text {
    font-family: 'Lato', sans-serif;
}
.bold_text {
    font-family: 'Montserrat', sans-serif;
    font-weight: 900;

}
#rollover {
    background: url("../img/mozak.png") no-repeat;
    width:70px;
    height:50px;
}
#rollover:hover {
    background: url("../img/mozak_rollover.png") no-repeat;
}
a {
    color:var(--svijetloPlava);
}
a:hover{
    color:var(--mainPlava);
}
/* banner  calc oduzima od 100% dio visine npr 101px za navbar*/
.banner {
    
    min-height:calc(100vh - 89px);
    max-width:100%;
    background:url('../img/background.png');
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
    background-repeat:no-repeat;
}
nav{   
    
    height:89px;
    background:url('../img/gore_background.png');
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
    background-repeat:no-repeat;
   
}
h1,h2 {
    color:var(--tamnoPlava);
    text-align:center;
    margin-left:0%;
    margin-right:10%;    
}

.fa-bars {background:var(--svijetloPlava)}
footer {
    background:var(--plavaJakoTamna);
    min-height:10vh;
}
.tamni {
    color:var(--plavaJakoTamna) ;
    background: rgba(248, 248, 248, 0.5);
    padding:1rem;
    border-radius: 15px;
}
.tamni-tekst {
    color:var(--plavaJakoTamna) ;
}
.tamni-tekst1 {
    color:var(--plavaJakoTamna) ;
}
.tamni-tekst:hover{
    text-decoration:none;
    color:var(--tamnoPlava) ;
   font-weight : bold;
   font-size:1.1em;

}
.rucni {
    font-family: 'Lemonada', cursive;
}
.popis {
    color:var(--plavaJakoTamna);
    font-size:1.2em;
}
.popis:hover {
    color:var(--tamnoPlava);
}
@media only screen and (max-width: 780px) {
    .container {
        background-color:var(--mainPlava);
        
       margin-left:-3% !important;
    }
    nav {
      background-color: var(--tamnoPlava);
      height:auto;
    }
    .banner {
        background:var(--svijetloPlava);
        min-height:30vh;
    }
  
    body.odgovori{margin-left:12% !important;
    font-size:1.5em;}
       
 
  }


  /*   ********************************    */
  /* kviz_rjesavanje.php  */

  hr.glavno_pitanje {
    border: 1px solid var(--tamnoPlava);
    border-radius: 2px;
  }
 
body, h4, h3{
    color:var(--plavaJakoTamna);
    background-color:var(--plavaJakoSvijetla);
    font-weight:bold;
}
.normalno_plava{
    background-color:var(--mainPlava);

}
/*
  input[type='radio']:after {
    width: 15px;
    height: 15px;
    border-radius: 15px;
    top: -2px;
    left: -1px;
    position: relative;
    background-color: white;
    content: '';
    display: inline-block;
    visibility: visible;
    border: 2px solid white;
}

input[type='radio']:checked:after {
    width: 15px;
    height: 15px;
    border-radius: 15px;
    top: -2px;
    left: -1px;
    position: relative;
    background-color: var(--tamnoPlava);
    content: '';
    display: inline-block;
    visibility: visible;
    border: 2px solid white;
}
input[type='checkbox']:after {
    width: 15px;
    height: 15px;
    
    top: -2px;
    left: -1px;
    position: relative;
    background-color: white;
    content: '';
    display: inline-block;
    visibility: visible;
    border: 2px solid white;
}

input[type='checkbox']:checked:after {
    width: 15px;
    height: 15px;
  
    top: -2px;
    left: -1px;
    position: relative;
    background-color: var(--tamnoPlava);
    content: '';
    display: inline-block;
    visibility: visible;
    border: 2px solid white;
}
.gumbek {
    color:white;
    background-color:var(--tamnoPlava) !important;
}
/* kviz index */
.linkovi a:hover{
    text-decoration:none;
    color:var(--tamnoPlava);
}



/*****************************************************/
/*vježbe*/
#lijevi {

    box-sizing: border-box;
    width:30%;
    padding:3%;
    background:var(--tamnoPlava) ;
    float:left;
    height:500%;    
    border-right:1px dotted black;
    border-left:1px dotted black;
    }
#desni {
    box-sizing: border-box;
    padding:3%;
    border-right:1px dotted black;
    color:var(--tamnoPlava);
    width:70%;
    float:left;
    background:var(--svijetloPlava) ;
    height:500%;
    }
    
    @media only screen and (max-width: 600px) {
        #lijevi {
           width:100%;
           height:auto;
         }
         #lijevo {
            width:100%;
            height:auto;
          }
         #desni {
           width:100%;
           height:auto;
         }
         .slova-kviz{
             font-size:1em !important;
         }
         body.odgovori{margin-left:12% !important;}
       }

       /* zaokruženi borderi na formi */

  button {
    border-radius: 50px 15px;
    
    background:var(--plavaJakoSvijetla);

    padding:5px;
    padding-left:20px;
    width: 200px;
    height: 30px; 
    color:var(--tamnoPlava);
    font-weight:bold;
    margin-top:5px;
    margin-right:20px;
  }
  
  

  button:hover {
    background:var(--svijetloPlava);

    text-decoration: none;
    color:var(--plavaJakoSvijetla);
  }
  /* internet izvori */
  #linkovi a:hover {
      text-decoration:none;      
          color:var(--tamnoPlava);
     }
  }