:root {
    --yellow: #ffc326;
    --black: #232323;
    --white: #fff;
    --light-color: #f9f9f9;
    --light-bg: #eee;
    --separator: #FFFFFF00;
    --box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1);
    --border: 0.1rem solid rgba(0, 0, 0, 0.3);
    --font-mobile: 1.3rem;
    --font-full: 1.5rem;
}
  
* {
  font-family:"Roboto", sans-serif;
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  outline: none;
  border: none;
  text-decoration: none;
}

html {
  font-size: 62.5%;
  overflow-x: hidden;
  scroll-behavior: smooth;
  scroll-padding-top: 7rem;
}

html::-webkit-scrollbar {
  width: 1rem;
}

html::-webkit-scrollbar-track {
  background: transparent;
}

html::-webkit-scrollbar-thumb {
  background: var(--yellow);
}
body{
    font-family: var(--ff-sans-normal);
    font-size: var(--fs-400);
    color: hsl(var(--clr-dark));
    line-height: 1.5;
    min-height: 100vh;

    counter-reset: number;
    overflow-x: hidden;

}
section{
    padding:0;
}
ul, li {
    list-style: none;
}
.header{
    position: relative;
}
.menu{
    position: fixed;
    z-index: 100;
    width: 100% ;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--black);
    backdrop-filter: blur(1r em);
}
.navbar {
    display: flex;
    justify-content: space-between;
    font-size: var(--font-full);
    font-weight: 500;
    text-transform: uppercase;
}

.mobile-nav-toggle{
    display: none;
}
.primary-navigation{
    list-style: none;
    padding: 0;
    margin: 0;
    z-index: 10;
}
.primary-navigation .ulList{
  display: flex;
}
.primary-navigation .ulList > li a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0px;
  width: 100%;
  height: 1.6px;
  background: var(--yellow);
  transform: scaleX(1);
  opacity: 1;
  transform-origin: left;
  transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1) 0.2s;
  z-index: 101;
}
@media (hover: hover) and (pointer: fine) {
  .primary-navigation .ulList > li a:hover::after {
    transform: scaleX(0);
    transform-origin: right;
    transition-delay: 0s;
  }
}
.primary-navigation .ulList > li a::after {
  transform: scaleX(0);
  transform-origin: right;
}
@media (hover: hover) and (pointer: fine) {
  .primary-navigation .ulList > li a:hover::after {
    transform: scaleX(1);
    transform-origin: left;
  }
}
/*navigation menu line end*/
.primary-navigation .ulList a:hover{
  color: var(--yellow);
}
.primary-navigation .ulList li:hover .main_nav{
  color: var(--yellow);
}
@supports (backdrop-filter: blur(1rem)){
    .menu{
        position: fixed;
        z-index: 100;
        width: 100% ;
        display: flex;
        align-items: center;
        justify-content: center;
        background: var(--black);
        backdrop-filter: blur(1r em);
    }
}
.primary-navigation .ulList a{
  text-decoration: none;
  color: var(--white);
  display: block;
  padding: 5px;
}
.primary-navigation .ulList a > span {
    font-weight: 700;
    margin-inline-end: .75em;
    color: var(--yellow);
}
.header ul li{
    position: relative;
    z-index: 100;
}
.dropdown{
    z-index: 100;
    visibility: hidden;
    opacity: 0;
    position: absolute;
    padding-left: 0;
    left: 0;
    display: none;
    background: var(--black);
    list-style: none;
}
ul li:hover > .dropdown,
.dropdown:hover, .dropdown.active {
    z-index: 100;
    visibility: visible;
    opacity: 1;
    display: flex;
    min-width: 200px;
    text-align: left;
    padding-top: 29px;
    box-shadow: 0px 3px 5px -1px rgb(41, 41, 41);
    list-style: none;
}
.dropdown .vertical{
    writing-mode: vertical-lr;
    font-size: 33px;
    font-weight: 700;
    letter-spacing: 0.2em;
    background-color: var(--yellow);
    color: #232323;
    cursor:default;
}
.dropdown ul{
    position: relative;
    margin-left: 10px;
}

.flex {
    display: flex;
    gap: 1rem;
}

.mobile-nav-toggle{
    background: url(/img/);
}

@media (max-width: 40.4em){
    .header{
        display: block;
    }
    .primary-navigation{
        position: fixed;
        inset: 0 0 0 35%;
        padding: min(30vh, 10rem) 2em;
        flex-direction: column;
        background: var(--black);
        backdrop-filter: blur(1r em);
        transform: translateX(100%);
        transition: transform 350ms ease-out;
    }
    .mobile-nav-toggle{
        display: block;
        position: absolute;
        z-index: 9999;
        background-image: url(/img/menu.png);
        background-repeat: no-repeat;
        background-size: contain;
        border: 0;
        width: 2.5rem;
        aspect-ratio: 1;
        top: 2rem;
        right: 2rem;
    }
    .dropdown{
        position: relative;
        z-index: 100;
        visibility: visible;
        opacity: 1;
        display: flex;
        min-width: 200px;
        text-align: left;
        padding-top: 1px;
        list-style: none;
    }
    #service::after{
        font-family: 'FontAwesome';
        content: '\f107';
        position: absolute;
        right: 1.44em;
        height: 0;
        width: 0;
        font-size: 20px;
        
    }
    .logo img{
        position: relative;
        left: 10px;
        top: 0;
        width: 115px;
        height: 100%;
    }
    .primary-navigation .ulList{
      flex-direction: column;
    }
}

@media (min-width: 35em) and (max-width: 55em){
    .primary-navigation a > span{
        display: none;
    }
    
}

@media (min-width: 35em) {
    .primary-navigation {
        padding-block: 2rem;
        padding-inline: clamp(3rem, 5vw, 10rem) ;
    }
}
.mobile-nav-toggle[aria-expanded="true"]{
    background-image: url(/img/close_menu.png);
    border: 0;
}
.primary-navigation[data-visible="true"]{
    transform: translateX(0%);
}
.flag{
    background: none;
}
.lang{
    display: flex;
    gap: 2rem;
    justify-content: center;
}
.flag img{
    width: 100%;
    height: 25px;
    filter: grayscale(100%);
}
.flag.active img{
    filter: grayscale(0%);
}

.home {
  padding: 0;
}
  
.home .slide {
  min-height: 85rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  position: relative;
  background-size: cover !important;
  background-position: center !important;
}

.home .slide .content {
  position: relative;
  max-width: 1160px;
  margin-left:auto;
  margin-right: auto;
  text-align: left;
  justify-items: center;
}

.home .slide .content h1 {
  font-size: 37px;
  color: var(--white);
  text-transform: capitalize;
  text-transform: uppercase;
}
.home .slide .content h1 span {
  font-size: 37px;
  color: var(--yellow);
  text-transform: capitalize;
  text-transform: uppercase;
}

.home .slide .content p {
  font-size: 2rem;
  color: var(--light-color);
  line-height: 2;
  padding: 1rem 0;
}
.btn {
  margin-top: 1rem;
  display: inline-block;
  padding: 0.8rem 3rem;
  font-size: 1.6rem;
  background:var(--white);
  font-weight: 500;
  color: var(--black);
  cursor: pointer;
  transition: all 0.3s ease;
}
.btn:hover {
  background: var(--yellow);
}
.banner-sec{
    background-color: var(--yellow);
}
.banner{
    padding:0;
}
.row{
    display: flex;
}
.banner-time{
    padding: 0;
    margin: 0;
    background-color: var(--yellow);
    position: relative;
    padding: 20px;
    display: flex;
    width: 33.3%;
    justify-content: center;
}
.banner-time.black{
    background-color: var(--black);
    transform: skewX( -15deg);
    z-index: 10;
}
.banner .icon{
    background-color: #2323234b;
    padding: 10px;
    border-radius: 50%;
    display: inline-block;
}
.banner i{
    font-size: 30px;
    color: var(--white);
}
.title{
  display: flex;
  vertical-align: middle;
  align-items:center;
  justify-content:center;
  margin-left: 10px;
}

.title a:hover{
  color: var(--white);
}

.us-img{
  position: relative;
  height: 300px;
  transform: skew(-2deg) rotate(2deg);
  -webkit-transform: skew(-2deg) rotate(2deg);
  -moz-transform: skew(-2deg) rotate(2deg);
  overflow: hidden;
  justify-content: center;
}
.banner h3{
    line-height: 26px;
    font-size: 22px;
    font-weight: 400;
    text-transform: uppercase;
}
.banner h3 span{
    font-weight: 700;
}
.banner a{
    line-height: 26px;
    font-size: 35px;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--yellow);
}
.section-box{
    padding: 0;
    max-width: 1160px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 150px;
    padding-bottom: 150px;
}
.section-box .img{
    max-width: 100%;
    height: auto;
}

.section-box .content{
    display: flex;
    width: 50%;
    position: relative;
}
.content h3{
    font-size: 35px;
    line-height: 1.3;
    word-break: break-word;
    font-weight: 300;
    text-transform: uppercase;
}
.content p{
    font-size: 17px;
    line-height: 24px;
}
.number{
    position: relative;
    z-index: 1;
    padding: 10px;
    padding-left: 20px;
}
.number::before{
  content: counter(number,decimal-leading-zero);
  counter-increment: number;
  position: absolute;
  top: -70px;
  width: 100%;
  font-size: 130px;
  font-weight: 400;
  opacity: 0.05;
  z-index: -1;
}
hr{
    width: 30px;
    height: 3px;
    background-color: transparent;
    background-image: -webkit-linear-gradient(135deg, transparent 10%, #ffc326 10%, #ffc326 50%, transparent 50%, transparent 60%, #ffc326 60%, #ffc326);
    background-image: linear-gradient(-45deg, transparent 10%, #ffc326 10%, #ffc326 50%, transparent 50%, transparent 60%, #ffc326 60%, #ffc326);
    background-size: 7px 7px;
}
.text-box{
    color: var(--black);
    margin-top: 25px;
    margin-bottom: 25px;
    opacity: 0.7;
}
.list-offer{
    position: relative;
    display: flex;
    padding: 9px 0 10px 30px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.list-offer .content{
    width: 100%;
}

.list-offer .content i{
    font-size: 25px;
    color: var(--yellow);
    margin-right: 10px;

}

.numbers-of-us{
    position: relative;
    margin: 0;
    padding: auto;
    background-image: url(/img/parlax.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    width: 100%;
    padding: 50px 0px 50px 0px;
    justify-content: center;
    justify-items: center;
    align-items: center;
    text-align: center;
}
  
.black-numbers{
  padding: 0%;
  position: absolute;
  background-color: black;
  opacity: 0.7;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

.contentVrednost{
  display: flex;
  justify-content: space-around;
  align-items: center;
  justify-items: center;
  text-align: center;
  max-width: 1160px;
  margin: auto;
}
.value {
  position: relative;
  font-size: 5rem;
  display: block;
  font-weight: bold;
  color: var(--white);
}
.counterBlock{
  display: flex;
  justify-content: center;
  margin-bottom: 10px;
}
.plus{
position: relative;
font-family: "Raleway", sans-serif;
font-size: 48px;
font-weight: 600;
text-size-adjust: 100%;
vertical-align: baseline;
color: var(--yellow);
left: 10px;
}
.inside_box h2{
  position: relative;
  color: var(--white);
}
.inside_box i{
  font-size: 35px;
  color: var(--yellow);
}
.counterBlock sup{
    color: var(--yellow);
}
.inside_box .st0, .text-box .st0{
  fill: var(--yellow);
}
.inside_box svg{
  position: relative;
  width: 130.1px;
  height: 76.6px;
}
.inside_box i{
    position: relative;
    font-size: 76.6px;
  }
.counterBlock sup{
    color: var(--yellow);
}

#service-img{
    margin-top: -150px;
}
.service-row{
    padding: 2px;
    justify-content: center;
    text-align: center;
}
.service-space1{
    background-image: url(/img/tiers.svg);
    background-size: 410px 200px ;
}
.service-space{
  display: flex;
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
  overflow: hidden;
  justify-content: center;
}
.grid{
  display: grid;
  grid-template-columns: repeat(4, 290px);
  grid-gap: 0;
  justify-content: center;
}


.card {
    display: block;
    position: relative;
    width: 100%;
    height: 300px;
    margin: 5rem auto;
    background-color: #ffffff;
    overflow: hidden;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
}

.image {
  display: block;
  height: 100%;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  -webkit-transition-property: -webkit-transform;
  transition-property: -webkit-transform;
  transition-property: transform;
  transition-property: transform, -webkit-transform;
  -webkit-transition-duration: 0.4s;
  transition-duration: 0.4s;
}
.imgOne {
  background-color: var(--yellow);
}
.caption {
  position: absolute;
  top: auto;
  bottom: 0;
  opacity: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  padding: 36px 0 15px;
  text-align: center;
  -webkit-transform: translateY(100%);
  transform: translateY(100%);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transition: opacity 0.1s 0.3s, -webkit-transform 0.4s;
  transition: opacity 0.1s 0.3s, -webkit-transform 0.4s;
  transition: transform 0.4s, opacity 0.1s 0.3s;
  transition: transform 0.4s, opacity 0.1s 0.3s, -webkit-transform 0.4s;
}
.Img01{
  background-image: url(/img/car-service.png);
}
.Img02{
  background-image: url(/img/bager-service.png);
}
.Img03{
  background-image: url(/img/viljuskar-service.png);
}
.Img04{
  background-image: url(/img/van-service.png);
}
.Img05{
  background-image: url(/img/truck-service.png);
}
.Img06{
  background-image: url(/img/tractor-service.png);
}
.Img07{
  background-image: url(/img/kiosk-service.png);
}
.Img08{
  background-image: url(/img/container-service.png);
}
.Img09{
  background-image: url(/img/slep-sluzba-borca.png);
}
.Img10{
  background-image: url(/img/slep-sluzba-zvezdara.png);
}
.Img11{
  background-image: url(/img/slep-sluzba-karaburma.png);
}
.Img12{
  background-image: url(/img/slep-sluzba-zemun.png);
}
.Img13{
  background-image: url(/img/slep-sluzba-novi-beograd.png);
}
.Img14{
  background-image: url(/img/slep-sluzba-mirijevo.png);
}
.Img15{
  background-image: url(/img/slep-sluzba-vracar.png);
}
.Img16{
  background-image: url(/img/slep-sluzba-vozdovac.png);
}
.Img17{
  background-image: url(/img/slep-sluzba-altina.png);
}
.Img18{
  background-image: url(/img/slep-sluzba-batajnica.png);
}
.Img19{
  background-image: url(/img/slep-sluzba-dorcol.png);
}
.Img20{
  background-image: url(/img/slep-sluzba-bezanija.png);
}
.Img21{
  background-image: url(/img/slep-sluzba-rakovica.png);
}
.Img22{
  background-image: url(/img/slep-sluzba-cukarica.png);
}
.Img23{
  background-image: url(/img/slep-sluzba-ledine.png);
}
.Img24{
  background-image: url(/img/slep-sluzba-surcin.png);
}
.Img25{
  background-image: url(/img/slep-sluzba-kaludjerica.png);
}
.Img26{
  background-image: url(/img/slep-sluzba-zarkovo.png);
}
.Img27{
  background-image: url(/img/slep-sluzba-krnjaca.png);
}
.Img28{
  background-image: url(/img/slep-sluzba-autoput-milos-veliki.png);
}
.Img29{
  background-image: url(/img/slep-sluzba-pancevo.png);
}
.Img30{
  background-image: url(/img/slep-sluzba-indjija.png);
}
.Img31{
  background-image: url(/img/slep-sluzba-stara-pazova.png);
}.Img32{
  background-image: url(/img/slep-sluzba-obrenovac.png);
}
.Img33{
  background-image: url(/img/slep-sluzba-lazarevac.png);
}
.Img34{
  background-image: url(/img/slep-sluzba-zrenjanin.png);
}
.Img35{
  background-image: url(/img/slep-sluzba-vrsac.png);
}
.Img36{
  background-image: url(/img/slep-sluzba-mladenovac.png);
}
.Img37{
  background-image: url(/img/slep-sluzba-kovin.png);
}
.Img38{
  background-image: url(/img/slep-sluzba-nova-pazova.png);
}
.Img39{
  background-image: url(/img/slep-sluzba-novi-banovci.png);
}
.Img40{
  background-image: url(/img/slep-sluzba-stari-banovci.png);
}
.Img41{
  background-image: url(/img/slep-sluzba-dobanovci.png);
}
.Img42{
  background-image: url(/img/slep-sluzba-ugrinovci.png);
}
.Img43{
  background-image: url(/img/slep-sluzba-busije.png);
}
.Img44{
  background-image: url(/img/slep-sluzba-visnjica.png);
}
.Img45{
  background-image: url(/img/slep-sluzba-stari-grad.png);
}
.Img46{
  background-image: url(/img/slep-sluzba-bavaniste.png);
}
.Img47{
  background-image: url(/img/slep-sluzba-banovo-brdo.png);
}
.Img48{
  background-image: url(/img/slep-sluzba-vidikovac.png);
}
.Img49{
  background-image: url(/img/slep-sluzba-simanovci.png);
}
.Img50{
  background-image: url(/img/slep-sluzba-umka.png);
}
.Img51{
  background-image: url(/img/slep-sluzba-baric.png);
}
.Img52{
  background-image: url(/img/slep-sluzba-ub.png);
}
.Img53{
  background-image: url(/img/slep-sluzba-opovo.png);
}
.Img54{
  background-image: url(/img/slep-sluzba-centa.png);
}
.Img55{
  background-image: url(/img/slep-sluzba-titel.png);
}
.Img56{
  background-image: url(/img/slep-sluzba-perlez.png);
}
.Img57{
  background-image: url(/img/slep-sluzba-kovacica.png);
}
.Img58{
  background-image: url(/img/slep-sluzba-debeljaca.png);
}
.Img59{
  background-image: url(/img/slep-sluzba-starcevo.png);
}
.Img60{
  background-image: url(/img/slep-sluzba-omoljica.png);
}
.Img61{
  background-image: url(/img/slep-sluzba-banatsko-novo-selo.png);
}
.Img62{
  background-image: url(/img/slep-sluzba-vladimirovac.png);
}
.Img63{
  background-image: url(/img/slep-sluzba-alibunar.png);
}
.Img64{
  background-image: url(/img/slep-sluzba-crepaja.png);
}
.Img65{
  background-image: url(/img/slep-sluzba-jabuka.png);
}
.Img66{
  background-image: url(/img/slep-sluzba-baranda.png);
}
.Img67{
  background-image: url(/img/slep-sluzba-kacarevo.png);
}
.Img68{
  background-image: url(/img/slep-sluzba-dolovo.png);
}
.Img69{
  background-image: url(/img/slep-sluzba-glogonj.png);
}
.Img70{
  background-image: url(/img/slep-sluzba-sefkerin.png);
}
.Img71{
  background-image: url(/img/slep-sluzba-sakule.png);
}
.Img72{
  background-image: url(/img/slep-sluzba-farkazdin.png);
}
.Img73{
  background-image: url(/img/slep-sluzba-stajicevo.png);
}
.Img74{
  background-image: url(/img/slep-sluzba-ecka.png);
}
.Img75{
  background-image: url(/img/slep-sluzba-ivanovo.png);
}
.Img76{
  background-image: url(/img/slep-sluzba-banatski-brestovac.png);
}
.Img77{
  background-image: url(/img/slep-sluzba-skorenovac.png);
}
.Img78{
  background-image: url(/img/slep-sluzba-plocica.png);
}
.Img79{
  background-image: url(/img/slep-sluzba-besni-fok.png);
}
.Img80{
  background-image: url(/img/slep-sluzba-padinska-skela.png);
}
.Img81{
  background-image: url(/img/slep-sluzba-kovilovo.png);
}
.Img82{
  background-image: url(/img/slep-sluzba-vrbovsko.png);
}
.Img83{
  background-image: url(/img/slep-sluzba-kotez.png);
}
.Img84{
  background-image: url(/img/slep-sluzba-ovca.png);
}
.Img85{
  background-image: url(/img/slep-sluzba-veliko-selo.png);
}
.Img86{
  background-image: url(/img/slep-sluzba-slanci.png);
}
.Img87{
  background-image: url(/img/slep-sluzba-galenika.png);
}
.Img88{
  background-image: url(/img/slep-sluzba-zemun-polje.png);
}
.Img89{
  background-image: url(/img/slep-sluzba-radiofar.png);
}
.Img90{
  background-image: url(/img/slep-sluzba-krnjesevci.png);
}
.Img91{
  background-image: url(/img/slep-sluzba-vojka.png);
}
.Img92{
  background-image: url(/img/slep-sluzba-pecinci.png);
}
.Img93{
  background-image: url(/img/slep-sluzba-ruma.png);
}
.Img94{
  background-image: url(/img/slep-sluzba-golubinci.png);
}
.Img95{
  background-image: url(/img/slep-sluzba-beska.png);
}
.Img96{
  background-image: url(/img/slep-sluzba-zeleznik.png);
}
.Img97{
  background-image: url(/img/slep-sluzba-sremcica.png);
}
.Img98{
  background-image: url(/img/slep-sluzba-miljakovac.png);
}
.Img99{
  background-image: url(/img/slep-sluzba-banjica.png);
}
.Img100{
  background-image: url(/img/slep-sluzba-brace-jerkovic.png);
}
.Img101{
  background-image: url(/img/slep-sluzba-kumodraz.png);
}
.Img102{
  background-image: url(/img/slep-sluzba-jajinci.png);
}
.Img103{
  background-image: url(/img/slep-sluzba-medakovic.png);
}
.Img104{
  background-image: url(/img/slep-sluzba-mali-mokri-lug.png);
}
.Img105{
  background-image: url(/img/slep-sluzba-veliki-mokri-lug.png);
}
.Img106{
  background-image: url(/img/slep-sluzba-petlovo-brdo.png);
}
.Img107{
  background-image: url(/img/slep-sluzba-resnik.png);
}
.Img108{
  background-image: url(/img/slep-sluzba-avala.png);
}
.Img109{
  background-image: url(/img/slep-sluzba-beli-potok.png);
}
.Img110{
  background-image: url(/img/slep-sluzba-vrcin.png);
}
.Img111{
  background-image: url(/img/slep-sluzba-mali-pozarevac.png);
}
.Img112{
  background-image: url(/img/slep-sluzba-lestane.png);
}
.Img113{
  background-image: url(/img/slep-sluzba-bolec.png);
}
.Img114{
  background-image: url(/img/slep-sluzba-vinca.png);
}
.Img115{
  background-image: url(/img/slep-sluzba-grocka.png);
}
.Img116{
  background-image: url(/img/slep-sluzba-zaklopaca.png);
}
.Img117{
  background-image: url(/img/slep-sluzba-umcari.png);
}
.Img118{
  background-image: url(/img/slep-sluzba-pozarevac.png);
}
.Img119{
  background-image: url(/img/slep-sluzba-smederevo.png);
}
.Img120{
  background-image: url(/img/slep-sluzba-ljig.png);
}
.Img121{
  background-image: url(/img/slep-sluzba-gornji-milanovac.png);
}
.Img122{
  background-image: url(/img/slep-sluzba-cacak.png);
}
.Img123{
  background-image: url(/img/slep-sluzba-takovo.png);
}
.Img124{
  background-image: url(/img/slep-sluzba-lajkovac.png);
}
.Img125{
  background-image: url(/img/slep-sluzba-barajevo.png);
}
.Img126{
  background-image: url(/img/slep-sluzba-stepojevac.png);
}
.Img127{
  background-image: url(/img/slep-sluzba-rusanj.png);
}
.Img128{
  background-image: url(/img/slep-sluzba-ripanj.png);
}
.Img129{
  background-image: url(/img/slep-sluzba-becmen.png);
}
.Img130{
  background-image: url(/img/slep-sluzba-petrovcic.png);
}
.Img131{
  background-image: url(/img/slep-sluzba-zlatibor.png);
}
.Img132{
  background-image: url(/img/slep-sluzba-uzice.png);
}
.Img133{
  background-image: url(/img/slep-sluzba-nova-varos.png);
}
.Img134{
  background-image: url(/img/slep-sluzba-prijepolje.png);
}

.caption-title {
  margin-top: 0;
  margin-bottom: 10px;
}

.caption-content {
  margin: 40% 4%;
  color: #fff;
}
.caption-content .button {
  margin-top: 15px;
}
.caption-content .button.hollow.white {
  border-color: #fff;
  color: #fff;
  display: inline-block;
}

.caption-link {
  color: #fff;
  text-decoration: none;
  opacity: 1;
  -webkit-transition-property: opacity;
  transition-property: opacity;
  -webkit-transition-duration: 0.15s;
  transition-duration: 0.15s;
  -webkit-transition-timing-function: cubic-bezier(0.39, 0.58, 0.57, 1);
  transition-timing-function: cubic-bezier(0.39, 0.58, 0.57, 1);
}

.caption-link:hover {
  opacity: 0.65;
}

.slide-up:hover .image {
  -webkit-transform: translateY(0);
  transform: translateY(0px);
}

.slide-up:hover .caption {
  text-align: center;
  opacity: 1;
  -webkit-transform: translateY(0px);
  transform: translateY(0px);
  -webkit-transition: opacity 0.1s, -webkit-transform 0.4s;
  transition: opacity 0.1s, -webkit-transform 0.4s;
  transition: transform 0.4s, opacity 0.1s;
  transition: transform 0.4s, opacity 0.1s, -webkit-transform 0.4s;
}

.card .cardTitle {
  width: 100%;
  text-align: centered;
  position: absolute;
  top: 25%;
  transition: top 0.4s ease-in-out;
  color: #fff;
}

.card:hover .cardTitle {
  top: 17%;
  -webkit-transform: translateY(0px);
  transform: translateY(0px);
  transition: top 0.4s ease-in-out;
  transition-delay: 20ms;
}
.img-on-top{
  display: none;
  position: absolute;
  top: 0;
  z-index: 99;
}
.card.slide-up:hover .img-on-top{
  display:inline;
}


.form-section{
    padding: 0;
    margin: 150px 0px 150px 0px;
}
.form-content{
    display: flex;
    position: relative;;
}
.form-content:after{
    content: '';
    position: absolute;
    display: block;
    width: 110px;
    height: 290px;
    background-image: url(/img/slep.png);
    left: 50%;
    margin-left: 10px;
    top: 0;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 5;
    margin-left: -55px;
    margin-top: -55px;
}
.formside{
    width: 50%;
    justify-content: center;
    text-align: center;
    justify-items: center;
}
.leftOne{
    background-color: var(--yellow);
}
.rightTwo{
  background-color: var(--black);
  color: var(--white);
}
.form-title {
  padding-top: 55px;
  padding-bottom: 25px;
}
.form-title h3{
  font-size: 35px;
  font-weight: 300;
  line-height: 25px;
}
.form-title h3 span{
  color: var(--yellow);
}
.form-title p, .form-descripion p{
  font-size: 16px;
  line-height: 25px;
  display: inline-block;
  margin-top: 5px;
}
.form-descripion{
  max-width: 500px;
  margin-left: auto;
  margin-right: auto;
  padding: 80px 20px 80px 20px;
  text-align: center;
  box-sizing: border-box;
}
.noselect {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-tap-highlight-color: transparent;
}
.form-call{
  padding-top: 75px;
}
.form-call a {
  display: inline-block;
	cursor: pointer;
	font-size: 20px;
	letter-spacing: 2px;
  color: var(--yellow);
	background: var(--black);
	border: 2px solid black;
	box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.4);
	transition: 500ms;
  padding: 10px;
  font-weight: 600;
}

.form-call a:after {
	content: "";
	position: absolute;
	transform: translateX(-55px) translateY(-40px);
	width: 25px;
	height: 25px;
	border-radius: 50%;
	background: transparent;
	box-shadow: 0px 0px 50px transparent;
	transition: 500ms;
  left: 70%;
}

.form-call a:hover {
	transform: translateY(5px);
	box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.4);
}

.form-call a:hover:after {
	background: white;
	box-shadow: 0px 0px 20px var(--white), 0px 0px 30px var(--white),
		inset 0px 0px 10px var(--white);
	animation: spin 1s infinite linear;
}

@keyframes spin {
	25% {
		transform: translateX(-25px) translateY(-35px);
		width: 15px;
		height: 15px;
	}
	50% {
		transform: translateX(-55px) translateY(-30px);
		width: 5px;
		height: 5px;
	}
	75% {
		transform: translateX(-85px) translateY(-35px);
		width: 15px;
		height: 15px;
	}
}

.form-call a:focus {
	outline: none;
}
.form-area{
  display: grid;
  grid-template-columns: repeat(2, 2fr);
  grid-gap: 5px;
  max-width: 80%;
  margin-left: auto;
  margin-right: auto;
  padding: 80px 0px 70px 0px; 
}
.form-area input, .form-area textarea{
  height: 50px;
  border-width: 1px;
  border-style: solid;
  border-color: #b4b4b4;
  background-color: transparent;
  border-radius: 0;
  color: #787878;
  padding-left: 20px;
  padding-right: 20px;
  padding-top: 9px;
  padding-bottom: 9px;
  font-size: 16px;
  font-weight: 600;
}
.form-area input:focus, .form-area textarea:focus, 
.form-area input:focus::placeholder,.form-area textarea:focus::placeholder{
  border-color: var(--yellow);
  color: var(--yellow);
  place-content: var(--yellow);
}
.grid-item-7{
  grid-column-start: 1;
  grid-column-end: 3;
}
.btn2{
  cursor: pointer;
  font-size: 20px;
  color: var(--white);
  background-color: var(--yellow);
  border: 2px solid var(--yellow);
  box-shadow: 0px 0px 0px rgb(0 0 0 / 40%);
  transition: 500ms;
  padding: 10px;
  margin-bottom: 80px;
  font-weight: 600;
  text-transform: uppercase;
  padding: 15px;
  letter-spacing: 2px;
  grid-column-start: 1;
  grid-column-end: 3;
  margin-top: 60px;
}
.btn2:hover{
  background-color: transparent;
  color: var(--yellow);
}
.btn4{
  cursor: pointer;
  font-size: 20px;
  color: var(--white);
  background-color: var(--yellow);
  border: 2px solid var(--yellow);
  box-shadow: 0px 0px 0px rgb(0 0 0 / 40%);
  transition: 500ms;
  padding: 10px;
  margin-bottom: 80px;
  font-weight: 600;
  text-transform: uppercase;
  padding: 15px;
  letter-spacing: 2px;
  margin-top: 60px;
}
.btn4:hover{
  background-color: transparent;
  color: var(--yellow);
}
/* testemonials */
.testimonial-section{
  margin: 150px 0px 150px 0px
}
.testimonial-inside{
  text-align: center;
}
.testimonial-inside .number::before{
  margin-left: -70px;
  width: 0;
}
figure.snip1197 {
  position: relative;
  color: #333;
  text-align: left;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
figure.snip1197 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
figure.snip1197 img {
  float: right;
  max-width: 40%;
  vertical-align: middle;
  border-radius: 0 8px 8px 0;
}
figure.snip1197 figcaption {
  top: 0;
  bottom: 0;
  left: 0;
  width: 60%;
  position: absolute;
  background-color: #ffffff;
  border-radius: 8px 0 0 8px;
}
figure.snip1197 blockquote {
  position: relative;
  padding: 65px 50px 25px 50px;
  font-size: 16px;
  font-weight: 500;
  text-align: left;
  margin: 0;
  line-height: 1.6em;
  font-style: italic;
}
figure.snip1197 blockquote:before,
figure.snip1197 blockquote:after {
  font-family: 'FontAwesome';
  content: "\201C";
  position: absolute;
  font-size: 50px;
  opacity: 1;
  font-style: normal;
  color: var(--yellow);
}
figure.snip1197 blockquote:before {
  top: 25px;
  left: 20px;
}
figure.snip1197 blockquote:after {
  content: "\201D";
  right: 20px;
  bottom: 0px;
}
figure.snip1197 .arrow {
  top: 30px;
  left: 100%;
  width: 0;
  height: 0;
  border-left: 0 solid transparent;
  border-right: 25px solid transparent;
  border-top: 25px solid #ffffff;
  margin: 0;
  position: absolute;
}
figure.snip1197 .author {
  position: absolute;
  top: 100%;
  width: 60%;
  padding: 10px 15px;
  color: #ffffff;
  margin: 0;
  text-transform: uppercase;
}
figure.snip1197 .author h5 {
  opacity: 0.8;
  margin: 0;
  font-weight: 800;
  color: var(--black);
  font-size: 12px;
}
figure.snip1197 .author h5 span {
  font-weight: 400;
  text-transform: none;
  padding-left: 5px;
  color: var(--black);
}
.testimonial-inside .swiper{
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
  overflow: hidden;
  padding: 25px 15px 25px 15px;
}


/* galery start */

.gallery-section{
  background-color: var(--black);
}

.gallery-box{
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
}

.gallery {
  display: flex;
  padding: 2px;
  transition: 0.3s;
}
.gallery:hover .gallery__image {
  filter: grayscale(1);
}
.gallery__column {
  display: flex;
  flex-direction: column;
  width: 25%;
}
.gallery__link {
  margin: 2px;
  overflow: hidden;
}
.gallery__link:hover .gallery__image {
  filter: grayscale(0);
}
.gallery__link:hover .gallery__caption {
  opacity: 1;
}
.gallery__thumb {
  position: relative;
}
.gallery__image {
  display: block;
  width: 100%;
  transition: 0.3s;
}
.gallery__image:hover {
  transform: scale(1.1);
}
.gallery__caption {
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 25px 15px 15px;
  width: 100%;
  font-family: "Raleway", sans-serif;
  font-size: 16px;
  color: white;
  opacity: 0;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
  transition: 0.3s;
}

/* galery end */


.faq-section{
  padding: 60px;
}

.faq-content{
  display: flex;
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
  overflow-x: initial !important;
}
.faq-inside{
  width: 50%;
}
.faq-box{
  justify-content: center;
  align-items: center;
}
.faq .faq-list {
  font-size: 0;
  margin: 0 auto;
  width: 100%;
  padding-left: 0;
}
.faq .faq-item {
  margin-bottom: 12px;
}
.faq .faq-question {
  padding: 12px 24px 8px 24px;
  position: relative;
  transition: 0.25s ease-in-out;
  border: 1px solid #ffc326;
}
.faq .faq-question h6 {
  font-size: 20px;
  margin: 0;
  color: var(--black);
  font-weight: 400;
}
.faq .faq-question:before {
  position: absolute;
  right: 20px;
  top: 25px;
  content: "";
  width: 24px;
  height: 2px;
  background: var(--yellow);
}
.faq .faq-question:after {
  position: absolute;
  right: 31px;
  top: 14px;
  width: 2px;
  background: var(--yellow);
  height: 24px;
  content: "";
  transition: 0.25s ease-in-out;
}
.faq .faq-question:hover {
  background: var(--yellow);
  box-shadow: none;
  cursor: pointer;
}
.faq .faq-question:hover::after, .faq .faq-question:hover::before{
  background: var(--white);
}
.question-active.faq-question::before{
  background: var(--white);
}
.faq .faq-answer {
  color: var(--black);
  background: var(--white);
  font-size: 16px;
  max-height: 0;
  visibility: hidden;
  padding-top: 0;
  padding-bottom: 0;
  transition: 0.4s ease all;
}
.faq .faq-answer p {
  line-height: 24px;
  margin: 0;
  padding: 16px 24px 16px 24px;
  opacity: 0;
  transition: 0.4s ease all;
}

.question-active.faq-question {
  background: var(--yellow);
  box-shadow: none;
}
.question-active + .faq-answer {
  max-height: 300px;
  visibility: visible;
  transition: 0.4s ease all;
}
.question-active + .faq-answer p {
  opacity: 1;
  transition: 0.4s ease all;
}
.question-active:after {
  opacity: 0;
}

.footer {
  background-color: var(--black);
  color: var(--white);
}
.footer .box-container {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (minmax(25rem, 1fr)) 4;
  grid-template-columns: repeat(4, minmax(25rem, 1fr));
  gap: 1.5rem;
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
}

.footer .box-container .box h1 {
  font-size: 2.2rem;
  color: var(--text1);
  padding: 1rem 0;
  line-height: 35px;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.footer .box-container .box .links {
  font-size: 1.5rem;
  display: block;
  color: var(--text1);
  padding: 1rem 0;
}
a.links:hover{
  margin-left: 10px;
  -moz-transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 10.5s ease;
  transition: all 0.5s ease;
}

a.links i {
  font-size: 2rem;
  color: var(--yellow);
}

.footer .box-container .box .links:hover {
  color: var(--yellow);
}

.footer .box-container .box p {
  font-size: 1.5rem;
  color: var(--text1);
  padding: 1rem 0;
  justify-content: center;
  align-items: center;
}

.footer .box-container .box p i {
  padding-right: 0.5rem;
  color: var(--yellow);
  font-size: 3rem;
}

.footer .box-container .box .share {
  padding: 1rem 0;
}

.footer .box-container .box .share a {
  height: 4.5rem;
  width: 4.5rem;
  line-height: 4.5rem;
  font-size: 1.7rem;
  color: #fff;
  background: #111;
  border-radius: 50%;
  margin-right: 0.5rem;
  text-align: center;
}

.footer .box-container .box .share a:hover {
  background: var(--yellow);
}

.footer .box-container .box form .email {
  margin-bottom: 1rem;
  width: 100%;
  background: #111;
  padding: 1.2rem;
  font-size: 1.5rem;
  color: #fff;
  text-transform: none;
}
.footer .box a {
  color: var(--text1);
}

.footer .box a:hover {
  color: var(--yellow);
}
.credit {
  font-size: 1.6rem;
  text-align: center;
  padding: 2rem;
  color: #fff;
  background: #111;
  line-height: 1.5;
}

.credit .copyright {
  font-size: 1rem;
  display: flex;
  text-align: right;
  justify-content: right;
}

.credit .copyright a {
  color: var(--yellow);
}

.credit span {
  color: var(--yellow);
}

.destination-name{
  background-color: var(--black);
  padding: 200px 100px 100px 100px;
  text-align: center;
  position: relative;
}

.destination-name h1{
  font-size: 61px;
  text-transform: uppercase;
  color: white;
}

.inside-video{
  width: 50%;
  overflow: hidden;
}
.inside-video video{
  width: 100%;
  height: 100%;
}
.row-video-section{
  background-color: var(--black);
  display: flex;
}
.inside-video.clock{
  text-align: center;
  color: var(--white);
  background-image: url(/img/video_bg.png);
  background-size:  cover;
  background-repeat: no-repeat;
}
.inside-video.clock .content {
  padding-top: 10%;
}

.inside-video.clock .content .number::before{
  width: 0;
  margin-left: -70px;
}

.container-clock{
  margin: 40px 0 40px 0;
}
.inside-video .form-call {
  padding-top: 40px;
}
.inside-video .form-call a {
  display: inline-block;
  cursor: pointer;
  font-size: 20px;
  letter-spacing: 2px;
  color: var(--yellow);
  background: var(--black);
  border: 2px solid var(--yellow);
}

.clock-ctn{
	border-radius: 60px;
	border: 3px solid #fff;
	height: 80px;
	width: 80px;
	position: relative;

	top: 28%;
	top: -webkit-calc(50% - 43px);
	top: calc(50% - 43px);
	left: 35%;
	left: -webkit-calc(50% - 43px);
	left: calc(50% - 43px);
}
.clock-ctn:after{
	content: "";
	position: absolute;
	background-color: #fff;
	top:2px;
	left: 48%;
	height: 38px;
	width: 4px;
	border-radius: 5px;
	-webkit-transform-origin: 50% 97%;
			transform-origin: 50% 97%;
	-webkit-animation: grdAiguille 2s linear infinite;
			animation: grdAiguille 2s linear infinite;
}

@-webkit-keyframes grdAiguille{
    0%{-webkit-transform:rotate(0deg);}
    100%{-webkit-transform:rotate(360deg);}
}

@keyframes grdAiguille{
    0%{transform:rotate(0deg);}
    100%{transform:rotate(360deg);}
}

.clock-ctn:before{
	content: "";
	position: absolute;
	background-color: #fff;
	top:6px;
	left: 48%;
	height: 35px;
	width: 4px;
	border-radius: 5px;
	-webkit-transform-origin: 50% 94%;
			transform-origin: 50% 94%;
	-webkit-animation: ptAiguille 12s linear infinite;
			animation: ptAiguille 12s linear infinite;
}

@-webkit-keyframes ptAiguille{
    0%{-webkit-transform:rotate(0deg);}
    100%{-webkit-transform:rotate(360deg);}
}

@keyframes ptAiguille{
    0%{transform:rotate(0deg);}
    100%{transform:rotate(360deg);}
}

.gallery-section.galeryAbout {
  background-color: var(--white);
  margin: 80px 0 80px 0;
}
.contact-row{
  display: flex;
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
}

.page-contact{
  max-width: 50%;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}
.page-contact .form-area{
  grid-gap: 25px;
  grid-template-columns: repeat(1, 2fr);
  max-width: 100%;
}
.page-contact .form-area input{
  padding-right: 115px;
}
.page-contact .number{
  margin-top: 100px;
}
.page-contact h3{
  font-size: 35px;
}
.page-contact p{
  font-size: 14px;
}
.page-contact .grid-item{
  height: 95px;
}
.info-grid{
  display: grid;
  gap: 5px;
  grid-template-columns: repeat(2,1fr);
}
.info-title{
  text-align: left;
  background-color: var( --black );
  padding: 20px 20px 20px 20px;
  border-style: solid;
  border-width: 0px 0px 0px 0px;
  border-radius: 0px 0px 0px 0px;
  color: white;
}
.top-title{
  display: flex;
  align-items: center;
}
.info-title h5{
  font-size: 20px;
  font-weight: 600;
  line-height: 24px;
}
.info-title i{
  font-size: 40px;
  margin-right: 10px;
  color: var(--yellow);
}
.info-title p{
  font-size: 16px;
  font-weight: 400;
  line-height: 22px;
}
.sep-line{
  margin-top: 20px;
}
.social-media .share{
  margin-left: 50px;
}
.social-media{
  display: flex;
  margin-top: 20px;
  align-items: center;
}
.social-media a{
  height: 4.5rem;
  width: 4.5rem;
  line-height: 4.5rem;
  font-size: 1.7rem;
  color: #fff;
  background: #111;
  border-radius: 50%;
  margin-right: 0.5rem;
  text-align: center;
}
.social-media a:hover{
  background: var(--yellow);
}
h6 {
  font-size: 16px;
  font-weight: 600;
  line-height: 22px;
}
.service-page.grid{
  display: grid;
  grid-template-columns: repeat(2, 600px);
  grid-gap: 0;
}
.service-link{
  margin-top: 100px;
}
.service-btn{
  margin-top: 120px;
}
.btn3{
  position: relative;
  cursor: pointer;
  font-size: 15px;
  color: var(--black);
  transition: 500ms;
  padding: 10px;
  font-weight: 600;
  text-transform: uppercase;
  padding: 15px;
  letter-spacing: 2px;
  margin-left: 20px;
}

.btn3::after{
  content: "";
  position: absolute;
  left: 0;
  bottom: 0px;
  width: 100%;
  height: 1.6px;
  background: var(--yellow);
  transform: scaleX(1);
  opacity: 1;
  transform-origin: left;
  transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1) 0.2s;
  z-index: 101;
}
@media (hover: hover) and (pointer: fine) {
  .btn3:hover::after {
    transform: scaleX(0);
    transform-origin: right;
    transition-delay: 0s;
  }
}
.btn3::after {
  transform: scaleX(0);
  transform-origin: right;
}
@media (hover: hover) and (pointer: fine) {
  .btn3:hover::after {
    transform: scaleX(1);
    transform-origin: left;
  }
}
.service-text {
  padding-right: 80px;
}
.numbers-of-us.paralllax-img1{
  background-image: url(/img/parllax/automobil_parallax.png);
}
.numbers-of-us.paralllax-img2{
  background-image: url(/img/parllax/kamion_parallax.png);
}
.numbers-of-us.paralllax-img3{
  background-image: url(/img/parllax/teret_parallax.png);
}
.numbers-of-us.paralllax-img4{
  background-image: url(/img/parllax/bager_parallax.png);
}
.numbers-of-us.paralllax-img5{
  background-image: url(/img/parllax/viljuskar_parallax.png);
}
.numbers-of-us.paralllax-img6{
  background-image: url(/img/parllax/trafika_parallax.png);
}
.numbers-of-us.paralllax-img7{
  background-image: url(/img/parllax/traktor_parallax.png);
}
.numbers-of-us.paralllax-img8{
  background-image: url(/img/parllax/kombi_parallax.png);
}
.lokacije-text {
  padding-right: 80px;
}
.numbers-of-us.paralllax-img9{
  background-image: url(/img/parllax/slep-sluzba-borca_parallax.png);
}
.numbers-of-us.paralllax-img10{
  background-image: url(/img/parllax/slep-sluzba-zvezdara_parallax.png);
}
.numbers-of-us.paralllax-img11{
  background-image: url(/img/parllax/slep-sluzba-karaburma_parallax.png);
}
.numbers-of-us.paralllax-img12{
  background-image: url(/img/parllax/slep-sluzba-zemun_parallax.png);
}
.numbers-of-us.paralllax-img13{
  background-image: url(/img/parllax/slep-sluzba-novi-beograd_parallax.png);
}
.numbers-of-us.paralllax-img14{
  background-image: url(/img/parllax/slep-sluzba-mirijevo_parallax.png);
}
.numbers-of-us.paralllax-img15{
  background-image: url(/img/parllax/slep-sluzba-vracar_parallax.png);
}
.numbers-of-us.paralllax-img16{
  background-image: url(/img/parllax/slep-sluzba-vozdovac_parallax.png);
}
.numbers-of-us.paralllax-img17{
  background-image: url(/img/parllax/slep-sluzba-altina_parallax.png);
}
.numbers-of-us.paralllax-img18{
  background-image: url(/img/parllax/slep-sluzba-batajnica_parallax.png);
}
.numbers-of-us.paralllax-img19{
  background-image: url(/img/parllax/slep-sluzba-dorcol_parallax.png);
}
.numbers-of-us.paralllax-img20{
  background-image: url(/img/parllax/slep-sluzba-bezanija_parallax.png);
}
.numbers-of-us.paralllax-img21{
  background-image: url(/img/parllax/slep-sluzba-rakovica_parallax.png);
}
.numbers-of-us.paralllax-img22{
  background-image: url(/img/parllax/slep-sluzba-cukarica_parallax.png);
}
.numbers-of-us.paralllax-img23{
  background-image: url(/img/parllax/slep-sluzba-ledine_parallax.png);
}
.numbers-of-us.paralllax-img24{
  background-image: url(/img/parllax/slep-sluzba-surcin_parallax.png);
}
.numbers-of-us.paralllax-img25{
  background-image: url(/img/parllax/slep-sluzba-kaludjerica_parallax.png);
}
.numbers-of-us.paralllax-img26{
  background-image: url(/img/parllax/slep-sluzba-zarkovo_parallax.png);
}
.numbers-of-us.paralllax-img27{
  background-image: url(/img/parllax/slep-sluzba-krnjaca_parallax.png);
}
.numbers-of-us.paralllax-img28{
  background-image: url(/img/parllax/slep-sluzba-autoput-milos-veliki_parallax.png);
}
.numbers-of-us.paralllax-img29{
  background-image: url(/img/parllax/slep-sluzba-pancevo_parallax.png);
}
.numbers-of-us.paralllax-img30{
  background-image: url(/img/parllax/slep-sluzba-indjija_parallax.png);
}
.numbers-of-us.paralllax-img31{
  background-image: url(/img/parllax/slep-sluzba-stara-pazova_parallax.png);
}
.numbers-of-us.paralllax-img32{
  background-image: url(/img/parllax/slep-sluzba-obrenovac_parallax.png);
}
.numbers-of-us.paralllax-img33{
  background-image: url(/img/parllax/slep-sluzba-lazarevac_parallax.png);
}
.numbers-of-us.paralllax-img34{
  background-image: url(/img/parllax/slep-sluzba-zrenjanin_parallax.png);
}
.numbers-of-us.paralllax-img35{
  background-image: url(/img/parllax/slep-sluzba-vrsac_parallax.png);
}
.numbers-of-us.paralllax-img36{
  background-image: url(/img/parllax/slep-sluzba-mladenovac_parallax.png);
}
.numbers-of-us.paralllax-img37{
  background-image: url(/img/parllax/slep-sluzba-kovin_parallax.png);
}
.numbers-of-us.paralllax-img38{
  background-image: url(/img/parllax/slep-sluzba-nova-pazova_parallax.png);
}
.numbers-of-us.paralllax-img39{
  background-image: url(/img/parllax/slep-sluzba-novi-banovci_parallax.png);
}
.numbers-of-us.paralllax-img40{
  background-image: url(/img/parllax/slep-sluzba-stari-banovci_parallax.png);
}
.numbers-of-us.paralllax-img41{
  background-image: url(/img/parllax/slep-sluzba-dobanovci_parallax.png);
}
.numbers-of-us.paralllax-img42{
  background-image: url(/img/parllax/slep-sluzba-ugrinovci_parallax.png);
}
.numbers-of-us.paralllax-img43{
  background-image: url(/img/parllax/slep-sluzba-busije_parallax.png);
}
.numbers-of-us.paralllax-img44{
  background-image: url(/img/parllax/slep-sluzba-visnjica_parallax.png);
}
.numbers-of-us.paralllax-img45{
  background-image: url(/img/parllax/slep-sluzba-stari-grad_parallax.png);
}
.numbers-of-us.paralllax-img46{
  background-image: url(/img/parllax/slep-sluzba-bavaniste_parallax.png);
}
.numbers-of-us.paralllax-img47{
  background-image: url(/img/parllax/slep-sluzba-banovo-brdo_parallax.png);
}
.numbers-of-us.paralllax-img48{
  background-image: url(/img/parllax/slep-sluzba-vidikovac_parallax.png);
}
.numbers-of-us.paralllax-img49{
  background-image: url(/img/parllax/slep-sluzba-simanovci_parallax.png);
}
.numbers-of-us.paralllax-img50{
  background-image: url(/img/parllax/slep-sluzba-umka_parallax.png);
}
.numbers-of-us.paralllax-img51{
  background-image: url(/img/parllax/slep-sluzba-baric_parallax.png);
}
.numbers-of-us.paralllax-img52{
  background-image: url(/img/parllax/slep-sluzba-ub_parallax.png);
}
.numbers-of-us.paralllax-img53{
  background-image: url(/img/parllax/slep-sluzba-opovo_parallax.png);
}
.numbers-of-us.paralllax-img54{
  background-image: url(/img/parllax/slep-sluzba-centa_parallax.png);
}
.numbers-of-us.paralllax-img55{
  background-image: url(/img/parllax/slep-sluzba-titel_parallax.png);
}
.numbers-of-us.paralllax-img56{
  background-image: url(/img/parllax/slep-sluzba-perlez_parallax.png);
}
.numbers-of-us.paralllax-img57{
  background-image: url(/img/parllax/slep-sluzba-kovacica_parallax.png);
}
.numbers-of-us.paralllax-img58{
  background-image: url(/img/parllax/slep-sluzba-debeljaca_parallax.png);
}
.numbers-of-us.paralllax-img59{
  background-image: url(/img/parllax/slep-sluzba-omoljica_parallax.png);
}
.numbers-of-us.paralllax-img60{
  background-image: url(/img/parllax/slep-sluzba-starcevo_parallax.png);
}
.title.alarm h3 {
  animation: text_move 5s linear infinite alternate;
  line-height: 26px;
  font-size: 62px;
  font-weight: 700;
  text-transform: uppercase;
  position: absolute;
  opacity: 0.6;
  color: white;
}


@keyframes text_move {
  0% {
    -webkit-transform: translateX(35%);
    transform: translateX(35%);
  }
  to {
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
  }
}
@keyframes text_move2{
  0% {
    -webkit-transform: translateX(-35%);
    transform: translateX(-35%);
  }
  to {
    -webkit-transform: translateX(50%);
    transform: translateX(50%);
  }
}
@media (max-width: 1520px){
  .inside-video video{
    width: 120%;
  }
}
@media (max-width: 1280px){
  .service-page.grid {
    grid-template-columns: repeat(2, 500px);
  }
  .inside-video video{
    width: 140%;
  }
  #service-img{
    width: 90%;
  }
  .grid {
    grid-template-columns: repeat(3, 290px);
  }
  .form-area {
    grid-template-columns: repeat(2,200px);
  }
  .footer .box-container{
    gap: 2px;
  }
  .footer .box-container .box p {
    font-size: 1.35rem;
  }
}

@media (max-width: 991px) {
  .inside-video video{
    width: 180%;
  }
  .service-page.grid {
    grid-template-columns: repeat(2, 470px);
  }
  .grid {
    grid-template-columns: repeat(2, 470px);
  }
  .form-content:after {
    height: 290px;
    background-image: none;
  }
  .form-area {
  grid-template-columns: repeat(2,150px);
  justify-content: center;
  }
  .faq-inside.map img{
    width: 95%;
  }
  .footer .box-container{
    grid-template-columns: repeat(2, minmax(50rem, 1fr));
  }
  .content img {
    width: 400px;
    height: 400px;
    margin: 0 auto 44px auto;
  }
  .service-btn {
    margin-top: 50px;
    text-align: center;
  }
  .btn3 {
    margin-left: 0;
    margin-top: 50px;
    display: block;
  }
  .service-text {
    padding-right: 0px;
  }
    .lokacije-text {
    padding-right: 0px;
  }
  .content.us-img {
    position: relative;
    height: none;
    transform: none;
    -webkit-transform: none;
    -moz-transform: none;
    overflow: hidden;
    justify-content: center;
  }
  .content.us-img img{
    width:400px;
    height: 100%;
  }
}

@media (max-width: 768px) {
  .home .slide {
    min-height: 60rem;
  }
  .home .slide .content {
    text-align: center;
    padding: 0px 20% 0px 20%;
  }
  .form-content,.row-video-section,.contact-row,.faq-content,.banner-sec .row,.row{
    flex-direction: column;
  }
  .banner-time{
    width: 100%;
    padding: 30px;
  }
  .banner-time.black {
    transform: skewX( 0deg);
  }
  .title.alarm h3{
    animation: text_move 5s linear infinite alternate;;
  }
  .title.alarm h3.sec{
    animation: text_move2 5s linear infinite alternate;;
  }
  .number::before {
    width: 0;
    margin-left: -70px;
  }
  .section-box .content {
    width: 100%;
    text-align: center;
  }
  hr{
    margin-left: auto;
    margin-right: auto;
  }
  .btn3 {
    padding: 48px;
    margin-left: 0; 
    display: block;
  }
  #service-img {
    margin-top: 0px;
    margin-left: auto;
    margin-right: auto;
  }
  .grid {
    grid-template-columns: repeat(1, 450px);
  }
  .service-page.grid {
    grid-template-columns: repeat(1, 450px);
  }
  .contentVrednost{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
  }
  .section-box {
    padding-top: 90px;
    padding-bottom: 90px;
  }
  .formside {
    width: 100%;
  }
  .form-call {
    margin-bottom: 80px;
  }
  .faq-inside {
    width: 100%;
    text-align: center;
  }
  .footer .box-container {
    grid-template-columns: repeat(1, minmax(50rem, 1fr));
  }
  .inside-video {
    width: 100%;
  }
  .inside-video video {
    width: 100%;
  }
  .page-contact {
    max-width: 80%;
  }
  .social-media, .info-grid {
    padding: 20px;
  }
  #service-img {
    width: 50%;
    height: 50%;
  }
}

@media (max-width: 450px) {
  .page-contact h3,.banner h3, .form-title h3, .content h3 {
    font-size: 22px;
  }
  .info-title h5 {
    font-size: 18px;
  }
  .faq .faq-question h6{
    font-size: 16px;
  }
  .faq .faq-answer, .form-title p, .form-descripion p, .content p,.home .slide .content p{
    font-size: 14px;
  }
  .destination-name {
    padding: 100px 50px 50px 50px;
  }
  .service-text {
    padding-right: 0;
  }
  .destination-name h1, .home .slide .content h1,.home .slide .content h1 span{
    font-size: 26px;
  }
  .service-page.grid {
    grid-template-columns: repeat(1, 300px);
  }
  .grid {
    grid-template-columns: repeat(1, 300px);
  }
  figure.snip1197 blockquote {
    padding: 10px 10px 10px 20px;
    font-size: 13px;
  }
  .faq .faq-question:before{
    right: 10px;
  }
  .faq .faq-question:after{
    right: 21px;
  }
  figure.snip1197 blockquote:after {
    right: 2px;
    bottom: -6px;
  }
  figure.snip1197 blockquote:before {
    top: -2px;
    left: 3px;
  }
  figure.snip1197 blockquote:before, figure.snip1197 blockquote:after {
    font-size: 20px;
  }
  .footer{
    text-align: center !important;
  }
  .footer .box-container {
    grid-template-columns: repeat(1, minmax(25rem, 1fr));
  }
  .page-contact .form-area input {
    padding-right: 0;
    text-align: left;
  }
  .info-grid {
    grid-template-columns: repeat(1,1fr);
  }
  .page-contact {
    text-align: center;
  }
  .content img {
    width: 350px;
    height: 350px;
    margin: 0 auto 44px auto;
  }
}