body{
    margin:0px auto;
    font-family: 'Roboto', sans-serif;
}

.hide_on_desktop{
    display: none !important;
}


.main{
    background: url(images/bg.jpg);
    background-position: center;
    background-size: cover;
    padding:50px 0px 0px 0px;
    overflow: hidden;
}

.mainCont, .wheelCont{
    max-width:1100px;
    position:relative;
    margin: 0px auto;
}

.header{
    position:relative;
    margin:0px auto;
    text-align:center;
    max-width:600px;
}

.header img{
    width: 100%;
}

.wheelCont #wheelOutside{
    width:100%;
    display: block;
}

.wheelCont{
    text-align: center;
}

#wheelInside, #topPointer{
    top:0px;
    width:100%;
    position: absolute;
    margin: 0px auto;
}

#wheelOutside{
    z-index:1000;
    position: relative;
}

#topPointer{
  transform: translate(-50%, 0%);
  animation: MoveUpDown 1s linear infinite !important;
  cursor: pointer;
}  
  
  @keyframes MoveUpDown {
      0%, 100% {
        top: 0px;
      }
      50% {
        top: 20px;
      }
 }

#topPointer{
   z-index:10000;
}

.wheel{
    position: relative;
    margin: 0px auto;
    max-width:1100px;
    text-align:center;
 }
 
 .declaration p{
	font-size: 0.9vw;
 }
 
 footer{
    background:#fff;
    text-align:centar;
    padding:20px 0px;
    width:100%;
 }
 
 #paymentMethods{
    position:relative;
    margin:0px auto;
    max-width:700px;
 }
 
 #paymentMethods #payments{
    width:100%;
 }
 
 .declaration{
    position: relative;
    margin: 0px auto;
    width:90%;
    text-align: center;
 }
 
 #wheelInside{
    transform: translate(-50%, 15.7%);
 }
 
 .rotate{
    animation: rotation 5s linear;
 }
 
 @keyframes rotation {
  from {
    transform: translate(-50%, 15.7%) rotate(0deg);
  }
  to {
    transform: translate(-50%, 15.7%) rotate(1080deg);
  }
}

.cta{
    background-image: linear-gradient(#00ff30, #22c870);
    padding: 15px 5vw;
    color:#fff;
    border: none;
    border-radius: 50px;
    font-weight:bold;
    font-size:2vw;
    position: absolute;
    bottom: 0px;
    z-index: 1000;
    transform: translate(-50%, -50%);
    text-shadow: 1px 1px 6px rgba(0, 0, 0, 1);
    animation: pulse 2s infinite;
    border:2px solid #fff;
    cursor: pointer;
}


@-webkit-keyframes pulse {
  0% {
    -webkit-box-shadow: 0 0 0 0 rgba(255,255,255, 0.8);
  }
  70% {
      -webkit-box-shadow: 0 0 0 40px rgba(255,255,255, 0);
  }
  100% {
      -webkit-box-shadow: 0 0 0 0 rgba(255,255,255, 0);
  }
}
@keyframes pulse {
  0% {
    -moz-box-shadow: 0 0 0 0 rgba(255,255,255, 0.8);
    box-shadow: 0 0 0 0 rgba(255,255,255, 0.8);
  }
  70% {
      -moz-box-shadow: 0 0 0 40px rgba(255,255,255, 0);
      box-shadow: 0 0 0 40px rgba(255,255,255, 0);
  }
  100% {
      -moz-box-shadow: 0 0 0 0 rgba(255,255,255, 0);
      box-shadow: 0 0 0 0 rgba(255,255,255, 0);
  }
 }
  
  /*Popup start*/
  
  .hide{
    display: none;
  }
  
  .popup{
    background: url("images/bg_popup.jpg");
    width:100%;
    background-size:cover;
    background-position: center top;
    position:relative;
  }
  
  .popupCont{
    max-width:1400px;
    margin:0px auto;
  }
  
  .popupImage{
    width:100%;
  }
  
  .piggy{
    position:absolute;
    right:0px;
    bottom:0px;
    z-index:1000;
    width: 35vw;
  }
  
  
  /*Popup end*/

  @media only screen and (min-width:1600px) {
    .mainCont, .wheelCont{
      max-width:1700px !important;
    }

    .wheel{
      max-width:1700px !important;
   }
  }
  
  @media only screen and (max-width:1025px) {
    .hide_on_mobile{
        display:none !important;
    }
    .hide_on_desktop{
        display:block !important;
    }

    .main {
      background: url(images/bg.jpg);
      padding: 20px 0px 0px 0px;
    }

    .header img {
      width: 93%;
    }
    
    #topPointer{
        transform: translate(0%, 0%);
    }
    
    #wheelInside{
        transform: translate(0%, 30%);
    }
    
    @keyframes rotation {
  from {
    transform: translate(0%, 30%) rotate(0deg);
  }
  to {
    transform: translate(0%, 30%) rotate(1080deg);
  }
}
    
    @keyframes MoveUpDown {
      0%, 100% {
        top: -20px;
      }
      50% {
        top: 0px;
      }
 }
 
 .cta {
    padding: 10px 7vw !important;
    font-size: 7vw;
    width: 70%;
  }
  
  #paymentMethods{
    padding:0px 20px;
  }
  
  .popup{
    background: url("images/mobile/popup/mobile_popup_bg.jpg");
    padding: 155px 0px 0px 0px;
  }
  
  .piggy {
    position: relative;
    bottom: 0px;
    z-index: 1000;
    width: 100%;
}

.declaration p {
    font-size: 2.9vw;
}
}