.GamesmodalPic{
  width: 100%;
}


/* Aditional Styles */
* {
  font-family: "Roboto", sans-serif;
  font-weight: normal;
}

p {
  line-height: 1.4em;
}

body {
  /*background: #eaeded;*/
  background: #dbdddd;

}

body h1{
  font-size: 60px;

}



button {
  border: 1px solid #333333;
  outline: none;
  color: #333333;
}



.pure-g{
  letter-spacing: 0;
}
.slikaUgao{    margin-top: -85px;
    position: absolute;
    margin-left: -55px;
    z-index:10;
  }

  #LogoText{
    color: #d09d25;
  }


  /*menu*/

  .custom-wrapper {
          background-color: #262324;
          margin-bottom: 1em;
          -webkit-font-smoothing: antialiased;
          height: 30px;
          overflow: hidden;
          -webkit-transition: height 0.5s;
          -moz-transition: height 0.5s;
          -ms-transition: height 0.5s;
          transition: height 0.5s;

      }
    .custom-wrapper text{
      color: white;
    }
      
      .custom-wrapper.open {
          height: 14em;
      }
      
      .custom-menu-3 {
          text-align: right;
      }
      
      .custom-toggle {
          width: 34px;
          height: 34px;
          position: absolute;
          top: 0;
          right: 0;
          display: none;
      }
      
      .custom-toggle .bar {
          background-color: #777;
          display: block;
          width: 20px;
          height: 2px;
          border-radius: 100px;
          position: absolute;
          top: 18px;
          right: 7px;
          -webkit-transition: all 0.5s;
          -moz-transition: all 0.5s;
          -ms-transition: all 0.5s;
          transition: all 0.5s;
      }
      
      .custom-toggle .bar:first-child {
          -webkit-transform: translateY(-6px);
          -moz-transform: translateY(-6px);
          -ms-transform: translateY(-6px);
          transform: translateY(-6px);
      }
      
      .custom-toggle.x .bar {
          -webkit-transform: rotate(45deg);
          -moz-transform: rotate(45deg);
          -ms-transform: rotate(45deg);
          transform: rotate(45deg);
      }
      
      .custom-toggle.x .bar:first-child {
          -webkit-transform: rotate(-45deg);
          -moz-transform: rotate(-45deg);
          -ms-transform: rotate(-45deg);
          transform: rotate(-45deg);
      }
      
      @media (max-width: 47.999em) {
      
          .custom-menu-3 {
              text-align: left;
          }
      
          .custom-toggle {
              display: block;
          }
      
      }

      #meni{
          width: 200px;
         
      }

         #meni a{
         color:#d09d25;
      }

      .midle{
        
        display: -webkit-flex;
        display: flex;
        -webkit-flex-direction: column;
         flex-direction: column;
      }

      .Gamesmid{
         display: -webkit-flex;
        display: flex;
        -webkit-justify-content: space-around;
    justify-content: space-around;
    flex-wrap: wrap;
    z-index: 5;
    margin: auto;
      
      }


      .gamesslikaDv{
          flex:1;
         

   
        }

       .gamesslikaDv img{
         width: 350px;
       } 

      .resimg{
        max-width: 85%;
        height: auto;
       /* margin-top: 100px;
      margin-top: 20%;*/
    



      }


      .resimg2{
        max-width: 100%;
        height: auto;
      
     
      }
 @media only screen and (max-width: 1280px) {
  .resimg2{
        max-width: 40%;
        height: auto;
      
}
}



    .horizontal {
    display: flex;
    justify-content: center;
    min-height: 60%;
  }

  .vertical {
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

      #cont{
        margin-top: 20px;
        margin-bottom: 20px;
   /*background: url('http://dazboggames.com/images/NS/POZ_1.png');
   background-size:   cover;                      /* <------ 
    background-repeat:   no-repeat;
    background-position: center center; */
}

      }

      .modalOkvir{

        position: absolute;
       width: 105%;
      height: 101%;
         margin-left: -15px;
        margin-top: -21px;
        
      }

  

      .krugOkvir{
        background-image: "Okv.png";
      }

      .modal-box{
        max-width: 30% !important;
        margin-top: 15%;
      }



      #Mkau{
        width: 250px;

        height: auto;
      /* margin-left: 14%;*/
      
      
      }

          #Pkau{
         width: 250px;;
        height: auto;
       
      
      }

          #Dkau{
         width: 250px;
        height: auto;
      
       
      }

          #Vkau{
         width: 250px;
        height: auto;
       /* margin-left: 14%;*/
       
      }


      .AutxC{
          text-align: justify;
        margin-top: 50px;
      }

         .AutxC2{
          text-align: justify;
       
      }


      .nasau{
          margin-bottom: -50px;
          margin-top: 20px;
  } 
      #AUtx{
      
      }

      #slikaUgaoP{
         margin-top: -85px;
    position: absolute;
    margin-left: -55px;
    z-index:10;
      }

      #slikaUgaoV{
         margin-top: -85px;
    position: absolute;
    margin-left: -55px;
    z-index:10;
      }

      #slikaUgaoM{
         margin-top: 345px;
    position: absolute;
    margin-left: -55px;
    z-index:10;
      }

      #slikaUgaoD{
         margin-top: -130px;
    position: absolute;
    margin-left: 420px;
    z-index:10;
      }

      .mesto{
        
        display: block;
        position: absolute;
        top:68%;
        z-index: 2;
       
      }

        .mestoCent{
        
        
        position: absolute;
        
        top: 17%;
        left: 32%;
        max-width: 35.5%;
        

      }

      .Overpic{

         -webkit-filter: grayscale(90%);

      }

      .centOp{
          z-index: 0;
          opacity: 0.3;
          filter: alpha(opacity=25);

      }

      .md1{
        z-index: 10;
      }

      #forma{
        margin-top: 20%;
      }

      .rightText{
        text-align: justify;
        margin-left: 10px;
        padding-left: 10px;
        padding-right: 10px;
        margin-top: 60%;
      }

      
      .hdn{
        display: none;
      }

  
  
      @font-face {
          font-family: 'DazbogFont';
          src: url('percolator_expert_1-webfont.eot');
          src: url('percolator_expert_1-webfont.eot?#iefix') format('embedded-opentype'),
               url('percolator_expert_1-webfont.woff2') format('woff2'),
               url('percolator_expert_1-webfont.woff') format('woff');
          font-weight: normal;
          font-style: normal;

      }

      .NasFont{
        font-family: 'DazbogFont';

      }

      .Logoz{
         font-family: 'DazbogFont';
         font-size: 11px;
      }

      .IndexSlikeL{
        max-width: 53%;
        height: auto;
      }


      .IndexSlikeR{
        margin-top: 35% !important;

      }

      .Imgcenter{
          display: block;
         margin: 0 auto;
      }

      .IndexText{
        
        font-family: 'DazbogFont';
        font-size: 60px;
     /*    display: block;
         margin: 0 auto;*/
      }

      #GamesTx{
       max-width: 40%;
        opacity: 0;
      }


      #AboutTx{
         max-width: 65%;
          opacity: 0;
      }

      #NewsTx{
        max-width: 35%;
         opacity: 0;
      }

      #ContactTx{
        max-width: 55%;
         opacity: 0;
      }

      #Games:hover + #GamesTx{
        animation: pulse 2s ;
      }

        #About:hover + #AboutTx{
          animation: pulse 2s ;
      }
      

        #News:hover + #NewsTx{
          animation: pulse 2s ;
      }
      

        #Contact:hover + #ContactTx{
          animation: pulse 2s ;
      }
      
      @keyframes pulse {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.NaslovNas1{
   font-family: 'DazbogFont';
   text-align: center;
   font-size: 50px;
   margin: 0;
}

.NaslovNas2{
   font-family: 'DazbogFont';
   text-align: center;
   font-size: 30px;
   margin: 0;
  margin-top: -4%;

}


.NaslovNas2{
   font-family: 'DazbogFont';
   text-align: center;
   font-size: 30px;
   margin: 0;
   margin-top: -2%;

}

.NaslovNas3{
   font-family: 'DazbogFont';
   text-align: center;
   font-size: 35px;
   margin: 0;
}

.indexTx
{
  margin: 0;
  margin-top: 5%;
  text-align: justify;
  font-size: 14px;
}

.slid{
  float: left;
  margin:5px;
}



.gamesslika{
  width: 80%;
  height: auto;
  padding: 10px;
}

body:after{
 display:none;
 content: url('http://dazboggames.com/images/NS/ABOUT_CVOR_GLOW.png') url('http://dazboggames.com/images/NS/GAMES_CVOR_GLOW.png') url('http://dazboggames.com/images/NS/NEWS_CVOR_GLOW.png') url('http://dazboggames.com/images/NS/CONTACT_CVOR_GLOW.png');
}

#GamesCvor{
   background: url('http://dazboggames.com/images/NS/games_cvor.png');
 /* min-height: 45%;
    width: 77%;*/ 
    width: 350px;
    height: 350px;
   background-size: 100% 100%;
}

#GamesCvor:hover{
   background: url('http://dazboggames.com/images/NS/GAMES_CVOR_GLOW.png');
   background-size: 100% 100%;
   transition: 0.5s ease-in;
}


#AboutCvor{
   background: url('http://dazboggames.com/images/NS/about_cvor.png');
   /*min-height: 45%;
    width: 77%;*/
    width: 350px;
    height: 350px;
   background-size: 100% 100%;
}

#AboutCvor:hover{
   background: url('http://dazboggames.com/images/NS/ABOUT_CVOR_GLOW.png');
   background-size: 100% 100%;
   transition: 0.5s ease-in;
}


#NewsCvor{
   background: url('http://dazboggames.com/images/NS/news_cvor.png');
  /*min-height: 45%;
    width: 77%;*/
     width: 350px;
    height: 350px;
   background-size: 100% 100%;
}

#NewsCvor:hover{
   background: url('http://dazboggames.com/images/NS/NEWS_CVOR_GLOW.png');
   background-size: 100% 100%;
   transition: 0.5s ease-in;
}


#ContactCvor{
   background: url('http://dazboggames.com/images/NS/contact_cvor.png');
  /*min-height: 45%;
    width: 77%;*/
     width: 350px;
    height: 350px;
   background-size: 100% 100%;
}

#ContactCvor:hover{
   background: url('http://dazboggames.com/images/NS/CONTACT_CVOR_GLOW.png');
   background-size: 100% 100%;
   transition: 0.5s ease-in;
}


#AuCent{
  width: 500px;
  height: 500px;
  margin:auto;


}

.side{
    display: -webkit-flex;
    display: flex;
     -webkit-align-items: center;
     -webkit-flex-direction: column;
    flex-direction: column;
    height: 600px;
     -webkit-justify-content: space-around;
    justify-content: space-around;
}

.sideSlike{
  

}


.vest{
  display: -webkit-flex;
    display: flex;
    border: 10px solid ;
    padding: 2px;

    min-height: 200px;
    height: 100%;
    border-image: url("http://dazboggames.com/images/NS/linija.png") 50 stretch ;

    -webkit-border-image: url("http://dazboggames.com/images/NS/linija.png") 50 stretch ; /* Safari 3.1-5 */
    -o-border-image: url("http://dazboggames.com/images/NS/linija.png") 50 stretch ; /* Opera 11-12.1 */
    margin-top: 10px;
    margin-bottom: 10px;
    background-color: rgba(255, 255, 255,0.8);;
    overflow: hidden;

 
    
   
}
.vestLevo{
    display: -webkit-flex;
    display: flex;
     -webkit-flex-direction: column;
    flex-direction: column;
    flex:4;
}
.vestNaslov{
  flex:1;
  margin: auto;
font-family: 'DazbogFont';
font-size: 25pt;
  padding: 2px;
}

.vestTekst p{
font-family: 11pt;
line-height: 1.2em;

}
.vestTekst{
  flex:6;
  
  
  margin-top: 2px;
  padding: 2px;
}







.vestDesno{
  flex:2;
   display: -webkit-flex;
    display: flex;
    


}

.vestDesno img{
  width: 100%;
  height: auto;
  margin: auto;
}

.VideoOsnova{
  display: -webkit-flex;
    display: flex;
      -webkit-justify-content: space-between;
    justify-content: space-between;
    
    z-index: 5;
    


}

.Video{
  margin:auto;
  
  height: 400px;
  width: 400px;
  
  border: 2px solid;
}







.Naslov{
  display: -webkit-flex;
    display: flex;


}



.AuNorm{
background: url('http://dazboggames.com/images/LogoTrans.png');
background-size: 100% 100%;

}

#midpic{
    background: url('http://dazboggames.com/images/logo50.png');
    min-height: 800px;
    background-size: 500px 500px;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position-y: 27%;
    background-position-x: center;
    max-height: 300px;
}




/*Modal Settings */

/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-content {
    background-color: #fefefe;
    margin: 15% auto; /* 15% from the top and centered */
    padding: 20px;
    border: 1px solid #888;
    width: 80%; /* Could be more or less, depending on screen size */
}

/* The Close Button */
.close {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.close:hover,
.close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}


.carousel{
        margin:auto;
        margin-top: 75px;

      }

      .leftside{
        position: absolute;
        opacity: 0.3;
        margin-left: 0%;
         -webkit-transition: margin-left 2s, opacity 2s, margin-top 2s; /* For Safari 3.1 to 6.0 */
          transition: margin-left 2s, opacity 2s, margin-top 2s;
      }

      .rightside{
        position: absolute;
        opacity: 0.3;
        margin-left: 44.5%;
         -webkit-transition: margin-left 2s, opacity 2s, margin-top 2s; /* For Safari 3.1 to 6.0 */
          transition: margin-left 2s, opacity 2s, margin-top 2s;
      }
      .centerside{
        position: absolute;
        z-index: 10;
          margin-left: 22.3%;
          margin-top: -2%;
           -webkit-transition: margin-left 2s, opacity 2s, margin-top 2s; /* For Safari 3.1 to 6.0 */
          transition: margin-left 2s, opacity 2s, margin-top 2s;
      }

      .arrow{
        
      

        position: absolute;
        margin-top: 9%;
        z-index: 20;

      }

      .arrow img{
        width: 70px;
        height: auto;
      }



      
      .shadow{
    
    


    -webkit-box-shadow: 0px -4px 3px rgba(50, 50, 50, 0.75);
    -moz-box-shadow:    0px -4px 3px rgba(50, 50, 50, 0.75);
    box-shadow:         0px -4px 3px rgba(50, 50, 50, 0.75);
      }


           .mdl{
        
        display: -webkit-flex;
        display: flex;
        width: 100%;
 
      }


.flipped{
  -moz-transform: scaleX(-1);
        -o-transform: scaleX(-1);
        -webkit-transform: scaleX(-1);
        transform: scaleX(-1);
        filter: FlipH;
        -ms-filter: "FlipH";
}


.AuLinija{
  
  margin-top:20px;
}

.NaslovNas1s{
  font-size:34px !important;
}

    /* Podesavanja za mobilni */
@media only screen and (max-width: 500px) {
  #AuCent{
  width: 120px;
  height: 120px;
  margin:auto;


}

#midpic{
 background-size: 150px 150px;
}

 #Mkau{
        width: 80px;

        height: auto;
      /* margin-left: 14%;*/
       margin-top: 26%;
      
      }

          #Pkau{
         width: 80px;;
        height: auto;
       margin-top: 26%;
      
      }

          #Dkau{
         width: 80px;
        height: auto;
      
       
      }

          #Vkau{
         width: 80px;
        height: auto;
       /* margin-left: 14%;*/
       
      }


.side{
  height: 200px;
}



 .resimg2{
            max-width: 90%;
            height: auto;
          
         }

         .leftside{
            position: absolute;
            margin-left: 0%;
            opacity: 0
            -webkit-transition: opacity 2s; /* For Safari 3.1 to 6.0 */
            transition: opacity 2s;
      }
                  .rightside{
            position: absolute;
            margin-left: 0%;
            opacity: 0;
              -webkit-transition: opacity 2s; /* For Safari 3.1 to 6.0 */
            transition: opacity 2s;
         }

         .arrow{
          margin-top: 50%;
         }

         .arrow img{
        width: 30px;
        height: auto;
      }

         .centerside{
            position: absolute;
            margin-left: 0%;
            opacity: 1;
              -webkit-transition: opacity 2s; /* For Safari 3.1 to 6.0 */
            transition: opacity 2s;
         }



           .modalOkvir {
        width: 109%;
    }


    body h1{
      font-size: 30px;
    }


    #GamesCvor{
   background: url('http://dazboggames.com/images/NS/GAMES_CVOR_GLOW.png');
 /* min-height: 45%;
    width: 77%;*/ 
    width: 80px;
    height: 80px;
   background-size: 100% 100%;
}


#AboutCvor{
   background: url('http://dazboggames.com/images/NS/ABOUT_CVOR_GLOW.png');
   /*min-height: 45%;
    width: 77%;*/
    width: 80px;
    height: 80px;
   background-size: 100% 100%;
}


#NewsCvor{
   background: url('http://dazboggames.com/images/NS/NEWS_CVOR_GLOW.png');
  /*min-height: 45%;
    width: 77%;*/
    width: 80px;
    height: 80px;
   background-size: 100% 100%;
}


#ContactCvor{
   background: url('http://dazboggames.com/images/NS/CONTACT_CVOR_GLOW.png');
  /*min-height: 45%;
    width: 77%;*/
    width: 80px;
    height: 80px;
   background-size: 100% 100%;
}

.NaslovNas1{
  font-size: 30px;
}
.NaslovNas1s{
  font-size: 21px !important;
}
.NaslovNas2{
  font-size: 20px;
}
.NaslovNas3{
  font-size: 30px;
}

.Prozir{
  font-size: 5px;
}

.AuLinija{
  
  margin-top:35px;
}



}