* {
margin:0;
padding:0;
}
  
   #wrap{
       width:600px;
       background:azure;
   }
   h1 {
        font-size: 50px;
    font-family: 'Alfa Slab One';
    -webkit-text-fill-color: blue;
    -webkit-text-stroke: 2px cyan;
} 

h2 {
    color:royalblue;
    padding:10px;
}
h3 {
    color:royalblue;
}
  
  button {
    margin:5px;
    box-shadow:
    inset 0 3px 6px rgba(0,0,0,0.5); 

  } 
  #content {
 display:inline-block;
 justify-content: center; /* Horizontalno centriranje */
align-items: center; 
 width:200px;   
 height:200px;
 background-color: royalblue;
 margin:10px;
 align-items: center;
 
}
#content a {
    text-decoration:none;
    
}
#content p {
    text-decoration:none;
    font-family:sans-serif;
    color:white;
    font-weight:bold;
    font-size:	19px;
}
.naslov {
  display: flex;
justify-content: center; /* Horizontalno centriranje */
align-items: center;    
 width:200px;   
 height:55px;
}

    
 .fancy {
    width:200px;
    height:auto;
}   


.fancy img {
    width:200px;
    height:auto;
}
  
  
   #ekran {
   
      display:inline-block;
      margin:20px;
      
   }
   #ekran img {
       width:150px;
       height:90px;
       border-radius:7px;
       border:2px solid white;
   }
      a {
        color:white;
        font-weight:bold;
        
      } 
      #frame {
       background:yellow;   
       color:red;
       font-weight:bold;
      }
    .button {
    color: white;
    font-weight: bold;
    font-size: 25px;
    background-color: red;
    border: 3px solid #7C1C01;
    border-radius: 5px;
    text-decoration: none;
    padding: 1px 10px 1px 10px;
} 
.button:hover {
    color:maroon;
    background:white;
}

   #installApp {
    margin-top:5px;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    width:200px;
    display:inline-block;

     
} 
#razmak {
display: grid; 
  gap: 10px;
  width:100%;
}
.opis {
  text-align:left; 
  margin:8px;
}
.opis a {
    color:gray;
    font-weight:bold;
    text-align:left;
    font-family:sans-serif;
    font-size: clamp(1rem, 2.2vw, 1.125rem);
    margin-bottom: 1rem;
   text-decoration:none;
}

#footer{
color:white;
font-size:12px;
font-weight: bold;
border-style:ridge;
border-color:blue;
border-width:5px;
background-color:blue;
}

      
  @media only screen and (max-width: 601px) {
    #wrap {
        width: 100%;
    }
      #ekran {
      margin:15px;
      
   }
.button {
  padding: 1px 5px 1px 5px;
} 


.i {
    width:60px!important;
}
}  
  @media only screen and (max-width: 405px) {
       #ekran {
   
      display:inline-block;
      margin:10px;
      
   } 
    #ekran img {
       width:130px;
       height:80px;
   }
 
.i {
    width:50px!important;
}
}  

 @media only screen and (max-width: 375px) {
    #ekran img {
       width:100px;
       height:60px;
   }
   .i {
    width:10px!important;
}
}