.container{
    background-color: rgb(255, 255, 255);
    display: flex;
    flex-direction: column;
    font-family: Arial, Helvetica, sans-serif;
    min-height: 100dvh;
}

.header{
    display: flex;
    justify-content: space-around;
    align-items: center;
    width: 100%;
    background-color: rgb(103, 193, 245);
    border-radius: 5px;
    color: white;
    text-decoration: none;
}

.main{
    display: flex ;
    flex: 1;
    width: 100%;
    flex-direction: column;
}
.footer{
    display: flex;
    justify-content: space-around;
    align-items: center;
    width: 100%;
    background-color: rgb(103, 193, 245);
    border-radius: 5px;
    color: white;
    text-decoration: none;
    padding: 30px;
}

a:hover{
    background-color: rgb(197, 68, 148);
}

/*mali telefoni*/
@media (max-width:576px) { 
    .container{
        background-color: rgb(117, 219, 117);
    }
}

/*veći telefoni*/
@media (min-width:576px) and (max-width:768px) { 
    .container{
        background-color: rgb(217, 228, 63);
    }
}

/*Tableti*/
@media (min-width:768px) and (max-width:992px) { 
    .container{
        background-color: rgb(207, 130, 29);
    }
}

/*Desktop*/
@media (min-width:992px) and (max-width:1200px){ 
    .container{
        background-color: rgb(209, 81, 198);
    }
}

/*Veći desktop*/
@media (min-width:1200px) and (max-width:1500px) { 
    .container{
        background-color: rgb(230, 18, 18);
    }
}

/*Printeri*/
@media print {
   body {
       background: white;
       color: black;
   }
}