html
{
   background-color: black;
  background-image: url(/images/background.jpg);
  background-attachment: fixed
 }

 a:link, a:visited {
     color: #CCCCCC;
   text-decoration: none;
 }
 
 a:hover, a:active {
   color: white;
 }

.naslov
{
   grid-column: 2;
   grid-row: 1;
   color: #CCCCCC;
   font-family: 'Grenze Gotisch', cursive;
   font-size: x-large;
   display: flex;
   align-items: center;
   justify-content: center;
   margin-left: 110px;
   }

   .politika_privatnosti
   {
      grid-column: 2;
      grid-row: 3;
      margin-left: 110px;
      color: #CCCCCC;
      font-family: 'Grenze Gotisch', cursive;
   }
   
   .cookies
   {
      grid-column: 2;
      grid-row: 3;
      margin-left: 250px;
      color: #CCCCCC;
      font-family: 'Grenze Gotisch', cursive;
   }

.container
{
   display:grid;
   grid-template: 150px auto 50px / 325px 50vw 240px;
   grid-template-areas:
   "logo naslov ."
   "menu content oglas"
   ". footer .";
   height: 100vh;
   }


.oglas-vertical
{
   grid-column: 3;
   grid-row: 2;
   display: flex;
}

   ul{
      list-style-type: none;
   }
     

   .ikonica {
           width: 115px;
           padding: 10px;
           margin-left: 60px;
           margin-top: 10px;
    }

.sidenav
{
   color: #CCCCCC;
   font-size: xx-large;
   font-family: 'Grenze Gotisch', cursive;
   display: none;
}


.logo
{  
   grid-column: 1;
   grid-row: 1;
   color: #CCCCCC;
   font-size: xx-large;
   font-family: 'Grenze Gotisch', cursive;
   position:fixed
}

.logo {
   display: flex;
   align-items: center;
}
 
.naslov
{
   grid-column: 2;
   grid-row: 1;
   color: #CCCCCC;
   font-family: 'Grenze Gotisch', cursive;
   font-size: x-large;
   display: flex;
   align-items: center;
   justify-content: center;
   margin-left: 110px;
   }

.p1 {
   padding: 10px;
}

.početna_slika
{
      margin:auto;
      width: 25vw;
      display: flex;
      justify-content: center;
}

.menu
{
   grid-column: 1;
   grid-row: 2;
   margin-top: 150px;
   margin-left: 35px;
   color: #CCCCCC;
   font-size: xx-large;
   font-family: 'Grenze Gotisch', cursive;
   position:fixed
}


.content
{
   grid-column: 2;
   grid-row: 2;
   margin-left: 110px;
   margin-bottom: 150px;
   color: #CCCCCC;
   font-size: x-large;
   font-family: 'Grenze Gotisch', cursive;
}

.spanmenu
{
display: none;
}

.oglas-horizontal
{
    display: none;
}

@media screen and (max-width: 900px) {
html
{
background-image: url(/images/mobile\ background.jpg); 
background-attachment: fixed;

 }

 .logo
 {display: none;}

.oglas-vertical
{display:none;}



 .container
  {
    display:flex;
    flex-direction: column;
    margin-right: 20px;
    }
      
.menu
{
   display: none;
}

.pretplata
{
   display:none;
}

.naslov
{
   order: 2;
   margin-left: 70px;
   font-size: x-large;
}


.content
{
   order: 3;
   margin-left: 70px;
}

.politika_privatnosti
{
   margin-top: 150px;
}

.politika_privatnosti,
.cookies {
   margin-left: 70px;
   order: 4;
  color: #CCCCCC;
  font-family: 'Grenze Gotisch', cursive;
}

.oglas-horizontal
{
   display:flex;
   order: 4;
   margin-left: 70px;
}

.sidenav {
   height: 100%; /* 100% Full-height */
   width: 0; /* 0 width - change this with JavaScript */
   position: fixed; /* Stay in place */
   z-index: 1; /* Stay on top */
   top: 0; /* Stay at the top */
   left: 0;
   background-color: rgb(0, 0, 0); /* Black*/
   overflow-x: hidden; /* Disable horizontal scroll */
   padding-top: 60px; /* Place content 60px from the top */
   transition: 0.01s; /* 0.5 second transition effect to slide in the sidenav */
 }
 
 /* The navigation menu links */
 .sidenav a {
   padding: 8px 8px 8px 32px;
   text-decoration: none;
   font-size: 25px;
   color: #818181;
   display: block;
   transition: 0.3s;
 }
 
 /* When you mouse over the navigation links, change their color */
 .sidenav a:hover {
   color: #f1f1f1;
 }
 
 /* Position and style the close button (top right corner) */
 .sidenav .closebtn {
   position: absolute;
   top: 0;
   right: 25px;
   font-size: 36px;
   margin-left: 50px;
 }
 

 .sidenav
 {
    color: #CCCCCC;
    font-size: xx-large;
    font-family: 'Grenze Gotisch', cursive;
    display: flow-root;
   
 }
 
 .spanmenu
{
display: block;
}

.lista_prica ul
{
   padding: 0;
}



}

.lista_prica
{
   color: #CCCCCC;
   font-size: xx-large;
   font-family: 'Grenze Gotisch', cursive;
   }

.lista_prica a:visited {
   color: rgb(117, 117, 117);
                }

.prva
{
   text-align: right;
   font-size: xx-large;
   margin-top: 5rem;
   margin-bottom: 5rem;
}                

.standard
{
   display:flex;
   justify-content: space-between;
   font-size: xx-large;
   margin-top: 5rem;
   margin-bottom: 5rem;
}        

.zadnja
{
   text-align: left;
   font-size: xx-large;
   margin-top: 5rem;
   margin-bottom: 5rem;
}

.fcf-h3
{
   margin: 4rem 1rem;
 }


.fcf-form-group
{
  margin: 1rem;
}

.fcf-form-control
{
     margin-top: 1rem;
     background-color: black;
     border: none;
     border-radius: 0.3rem;
     
}

textarea:focus, input:focus {
   color:#CCCCCC;
}

input, select, textarea{
   color:#818181;
}

.pretplata
{
   display:none;
}