

/*HERO*/
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');


:root {
  --playfair:"Playfair Display", serif;
  --manrope:  "Manrope", sans-serif;

  --primary:#2A2A2A;
  --siva:#4B4948;
  --clight:#F6F1EB;
  --textwhite:#F6F8EB;
  --landing-width:61.88vw;
  --landing-width-mobile:86.67vw;
  --boxshadow:0px 3px 4.4px 0px #00000017;
  --dilatacija-a:#6DB3B5;
  --dilatacija-b:#7DA36B;

  --dvojka: -0.02em;
  --sestica: -0.06em;
  --slobodno:#9AA16F;
  --rezervisano:#E6A15A;
  --prodano:#DE7550;




    --d10:0.52vw;
   --d11:0.57vw;
 
   --d12:0.63vw;
   --d13:0.68vw;
    --d14:0.73vw;
    --d15:0.78vw;
    --d16:0.83vw;
    --d18:0.94vw;
    --d20:1.04vw;
    --d22:1.15vw;
    --d23:1.20vw;
    --d24:1.25vw;
    --d25:1.3vw;
    --d28:1.46vw;
    --d30:1.56vw;
    --d34:1.77vw;
    --d44:2.29vw;
    --d40:2.08vw;
    --d48:2.5vw;
    --d54:2.81vw;
    --d56:2.92vw;
    --d64:3.33vw;
    --d80:4.17vw;
    --d84:4.38vw;
    --d100:5.21vw;
    --d110:5.73vw;
    --d120:6.25vw;
    --d156:8.13vw;
    --d904:47.08vw;


     --m10:2.78vw;
    --m11:3.06vw;
    --m12:3.33vw;
    --m13:3.61vw;
    --m14:3.89vw;
    --m15:4.17vw;
    --m16:4.44vw;
    --m18:5vw;
    --m20:5.56vw;
    --m22:6.11vw;
    --m24:6.67vw;
    --m25:6.94vw;
    --m28:7.78vw;
    --m30:8.33vw;
    --m32:8.89vw;
    --m34:9.44vw;
    --m36:10vw;
    --m40:11.11vw;
    --m44:12.22vw;
    --m45:12.50vw;
    --m48:13.33vw;
    --m56:15.56vw;
    --m64:17.78vw;
    --m68:18.89vw;
    --m80:22.22vw;
    --mmt: 27.78vw;


  






 

}




.slider-hero{
  display: block;
}

.slider-hero-mobile{
  display: none;
}

.hero .section h1{
  position: absolute;
  top:15.69vw;
 left: 50%;
  transform: translateX(-50%);
  color:white;
  font-size: var(--d80);
  font-family: var(--manrope);
  font-weight: 600;
  line-height: 100%;
  letter-spacing: var(--sestica);
  margin: 0;
}


.hero .section h2{
  position: absolute;
  top:21.10vw;
  left: 50%;
  transform: translateX(-50%);
  color:white;
  font-size: var(--d80);
  font-family: var(--manrope);
  font-weight: 600;
  line-height: 100%;
  letter-spacing: var(--sestica);
  margin: 0;
}

.hero .section h1 strong,.hero .section h2 strong{
  font-family: var(--playfair);
  font-weight: 400;
  font-style: italic;
}


.hero .section p{
  color: white;
  font-family:var(--manrope);

font-size:var(--d16);

line-height: var(--d24);
letter-spacing: var(--dvojka);
text-align: center;
position: absolute;
top: 27.03vw;
left: 50%;
  transform: translateX(-50%);
margin: 0;
width: 38.67vw;

}

.hero .section .mapa-button{
  position: absolute;
  top:30.78vw ;
left: 50%;
  transform: translateX(-50%);
  width:8.65vw ;
  height:2.40vw;
  display: flex;
  justify-content: center;
   gap: 0.42vw;
  align-items: center;
  border: 1px solid #FFFFFF33;
  background: #FFFFFF0F;
  backdrop-filter: blur(29.899999618530273px)

}


.hero .section .mapa-button p{
  position: static;
  width: auto;
  line-height: 100%;
  left: 0;
  transform: unset;
 

}
.hero .section .mapa-button img{
 width: 0.42vw;
 

}






.slider-hero .slick-dots li:nth-child(2) {
    border: 0px solid black;
    border-radius: 0%;
    
    content: '';
    width:3.91vw;
    height: 2px;
}
.slider-hero .slick-dots li:nth-child(1),.slider-hero .slick-dots li:nth-child(3)  {
    border: 0px solid black;
    border-radius: 0%;
    
    content: '';
    width: 3.91vw;
    height: 2px;
}

.slider-hero .slick-dots li:nth-child(4)  {
   display:none;
}

.slider-hero .slick-dots  {
   bottom: var(--d64)!important;
}




.slider-hero .slick-dots li:not(.slick-active){
    
    background-color:#FFFFFF4D!important;
}
    

.slider-hero .slick-dots .slick-active {
    
    background-color: #FFFFFF!important;
}

.slider-hero .slick-dots li button:before {
    display: none;
}


/*ABOUT HOME*/

.about-landing{
  width: var(--landing-width);
  margin: auto;
  margin-top: var(--d100);
  display: flex;
  gap: var(--d20);
}

.about-landing .left{
  width: 35.89vw;
}

.about-landing .left h1{
  font-family: var(--manrope);
font-weight: 600;

font-size: var(--d14);

line-height: 100%;

text-transform: uppercase;
margin: 0;
color: var(--primary);


}

.about-landing .left h2{
  font-family: var(--manrope);
font-weight: 600;

font-size: var(--d56);

line-height: var(--d64);
letter-spacing: var(--sestica);
color: var(--primary);
margin-top: var(--d16);
margin-bottom: var(--d34);

}

.about-landing .left h2 strong{
  font-family: var(--playfair);
font-weight: 400;
font-style: italic;



}

.about-landing .left p{
  color: #4B4948;
  font-family: var(--manrope);
font-weight: 400;

font-size: var(--d16);

line-height: var(--d24);
letter-spacing: var(--dvojka);
margin: 0;
margin-bottom: var(--d34);
width: 33.55vw;





}

.about-landing .left h3{
  font-family: var(--manrope);
font-weight: 600;

font-size: var(--d24);

line-height: var(--d24);
letter-spacing: var(--dvojka);
color: var(--primary);
margin: 0;
margin-bottom: var(--d16);

}

.about-landing .left ul {
  margin: 0;
  padding: 0;
  padding-left: 1vw;
  margin-top: -1vw;
}

.about-landing .left ul li{
  font-family: var(--manrope);
font-weight: 400;

font-size:var(--d16);

line-height:var(--d24);
letter-spacing: var(--dvojka);
color:  #4B4948;


}






.about-landing .right{
  width: 24.95vw;
  margin-top: 9.94vw;
}

.about-landing .right p{
  font-family:var(--manrope);
  margin-top:0;
font-weight: 400;

font-size: var(--d20);

line-height: var(--d30);
letter-spacing: var(--dvojka);
color: #4B4948;
margin-bottom:var(--d56);

}

.about-landing .right img{
  width: 24.95vw;
}


.standardi{
  width: 100vw;
  background-color: #EDE6DE;
  margin-top: var(--d100);
}
.standardi .container{
  width: var(--landing-width);
  margin: auto;
  padding-top: var(--d100);
  padding-bottom: var(--d100);
 
}

.standardi .container h1{
  font-family:var(--manrope);
font-weight: 600;

font-size: var(--d14);

line-height: 100%;

text-align: center;
text-transform: uppercase;
color: var(--primary);
margin: 0;

}



.standardi .container h2{
  font-family: var(--manrope);
font-weight: 600;

font-size: var(--d56);

line-height: var(--d64);
letter-spacing: var(--sestica);
color: var(--primary);
margin-top: var(--d16);
margin-bottom: var(--d64);
text-align: center;

}

.standardi .container h2 strong{
  font-family: var(--playfair);
font-weight: 400;
font-style: italic;



}
.standardi .container .row{
  display: flex;
  justify-content: space-between;
}

.standardi .container .btb{
  border-top: 1px solid #BCBFC3;
   border-bottom: 1px solid #BCBFC3;
   padding-top: var(--d34);
   padding-bottom: var(--d44);

}

.standardi .container .row .card{
  width:19.43vw;
  position: relative;
  box-sizing: border-box;
  padding-left: var(--d54);
}


.standardi .container .row .card img{
  position: absolute;
  top: 0;
  left: 0;
  width: var(--d34);
}

.standardi .container .row .card h3{
  font-family:var(--manrope);
font-weight: 600;

font-size: var(--d23);

line-height: var(--d28);
letter-spacing: var(--dvojka);
color: var(--primary);
margin: 0;


}

.standardi .container .row .card p{
  font-family: var(--manrope);
font-weight: 400;

font-size: var(--d16);

line-height:var(--d24);
letter-spacing:var(--dvojka);
color: #4B4948;
width: 16vw;
margin-top: var(--d12);

  
}

.standardi .container .bb{
 
   border-bottom: 1px solid #BCBFC3;
   padding-top: var(--d34);
   padding-bottom: var(--d44);

}


.projekti-landing{
  width: var(--landing-width);
  margin: auto;
}

.projekti-landing .top{
  display: flex;
  justify-content: space-between;
}

.projekti-landing .top .left{
  width: 23.65vw;
}


.projekti-landing .top .left h2{
  font-family: var(--manrope);
font-weight: 600;

font-size: var(--d56);

line-height: var(--d64);
letter-spacing: var(--sestica);
color: var(--primary);
margin-top: var(--d16);
margin-bottom: var(--d56);
text-align: left;

}

.projekti-landing .top .left h2 strong{
  font-family: var(--playfair);
font-weight: 400;
font-style: italic;

}




.projekti-landing .top .left h1{
  font-family:var(--manrope);
font-weight: 600;

font-size: var(--d14);

line-height: 100%;

text-align: left;
text-transform: uppercase;
color: var(--primary);
margin: 0;
margin-top: var(--d100);

}


.projekti-landing .top .right p{
  font-family:var(--manrope);
font-weight: 400;

font-size: var(--d16);

line-height: var(--d24);
letter-spacing: var(--dvojka);
text-align: right;
width: 29.38vw;
margin-top: 7.86vw;
color: #4B4948;
margin-bottom: 0;


}

.right .read-more{

  width:7.50vw;
  height: 2.40vw;
  border: 1px solid #4B494833;
  display: flex;
  justify-content: center;
  gap: 0.42vw;
  float: right;
  align-items: center;
  cursor: pointer;
  margin-top: var(--d24);
}

.projekti-landing .top .right .read-more p{
  font-family:var(--manrope);
font-weight: 500;

font-size: var(--d16);

line-height: 100%;
margin: 0;
text-align: unset;
width: auto;
color: var(--primary);
background-color: transparent;
cursor: pointer;




}

.projekti-landing .top .right .read-more img{
  width: 0.42vw;
}
.projekti-landing .top .right .read-more.hovered{
  background-color: #5B4B3E;
}
.projekti-landing .top .right .read-more.hovered p{
  font-family:var(--manrope);
font-weight: 500;

font-size: var(--d16);

line-height: 100%;
margin: 0;
text-align: unset;
width: auto;
color: white;




}

.projekti-landing .bottom{
  display: flex;
  justify-content: space-between;
  margin-bottom: var(--d100);
}
.projektm{
  position: relative;
  width:19.79vw;
  height:20.83vw ;
  cursor: pointer;
}

.projekt-hovered{
  position: absolute;
  top: 0;
  left: 0;
  z-index: 3;
  background: #21252933;
  backdrop-filter: blur(34.599998474121094px);
    width:19.79vw;
  height:20.83vw ;
  display: none;



}

.projekt-hovered.hovered{

  display: block;



}

.projekt-hovered img{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);

}


.projektv{
    width:40.83vw ;
}

  @media screen and (max-width:900px){

    .slider-hero{
  display: none;
}

.slider-hero-mobile{
  display:block;
}


    



.slider-hero-mobile .slick-dots li:nth-child(2) {
    border: 0px solid black;
    border-radius: 0%;
    
    content: '';
    width:14.00vw;
    height: 2px;
}
.slider-hero-mobile .slick-dots li:nth-child(1),.slider-hero-mobile .slick-dots li:nth-child(3)  {
    border: 0px solid black;
    border-radius: 0%;
    
    content: '';
    width: 14.00vw;
    height: 2px;
}

.slider-hero-mobile .slick-dots li:nth-child(4)  {
   display:none;
}

.slider-hero-mobile .slick-dots  {
   bottom: 9vw!important;
}




.slider-hero-mobile .slick-dots li:not(.slick-active){
    
    background-color:#FFFFFF4D!important;
}
    

.slider-hero-mobile .slick-dots .slick-active {
    
    background-color: #FFFFFF!important;
}

.slider-hero-mobile .slick-dots li button:before {
    display: none;
}



.hero .section h1{
  top: 67.22vw;
  font-size: var(--m36);
  left: 11%;
  transform: unset;
}
.hero .section h2{
   top: 79.44vw;
  font-size: var(--m36);
  left: 8.89%;
  transform: unset;

}

.hero .section p{

    top: 99.72vw;
  font-size: var(--m15);
  left:6.67%;
  transform: unset;
  line-height: var(--m22);
  width: var(--landing-width-mobile)

}

.hero .section .mapa-button{

  top: 142.50vw;
 
  left: 26.94%;
  transform: unset;
  width: 46.11vw;
  height: 12.78vw;
  gap: var(--m16);

}

.hero .section .mapa-button img{
  width: 2.22vw;
}

.about-landing{
  width: var(--landing-width-mobile);
  gap: 0;
  flex-direction: column;
  margin-top:var(--m64);
  
}
.about-landing .left h1{
  font-size: var(--m14);
}

   .about-landing .left,.about-landing .right{
    width: var(--landing-width-mobile);
   } 
.about-landing .left h2{
  font-size:var(--m32);
  margin-top: var(--m16);
  margin-bottom: var(--m32);
  line-height: var(--m34);
}




.about-landing .left p{
  margin-bottom: var(--m24);
  font-size: var(--m16);
  line-height: var(--m24);
  width: var(--landing-width-mobile);

}

.about-landing .left h3{
  margin-bottom: var(--m16);
  font-size: var(--m24);
  line-height: var(--m24);

}
.about-landing .left ul li{
  font-size: var(--m16);
  line-height: var(--m24);
}

.about-landing .left ul {
    margin: 0;
    padding: 0;
    padding-left: 5vw;
    margin-top: -3vw;
}
.about-landing .right{
  margin-top: var(--m34);

}
.about-landing .right p{
  font-size: var(--m20);
  line-height: var(--m30);
  margin-bottom: var(--m34);
}
.about-landing .right img{
  width: var(--landing-width-mobile);
}
.standardi{
  margin-top: var(--m64);
}
.standardi .container{
  width: var(--landing-width-mobile);
  padding-bottom: var(--m64);
  padding-top: var(--m64);
}

.standardi .container h1{
  font-size: var(--m14);
  text-align: left;
}

.standardi .container h2{
  font-size: var(--m32);
  line-height: var(--m34);
  text-align: left;
      margin-top: var(--m16);
    margin-bottom: var(--m44);
}

.standardi .container .btb,.standardi .container .bb{
  border: none;
  flex-direction: column;
  padding: 0;
}

.standardi .container .row .card{
  padding-left:13.89vw ;
  width: var(--landing-width-mobile);
  border-bottom: 1px solid #BCBFC3;
  padding-top: var(--m24);
  padding-bottom: var(--m24);
}

.standardi .container .row .card img{

  width: 7.22vw;
  top: var(--m24);

    
  }
  .standardi .container .row .card h3{
    font-size: var(--m20);
    line-height: var(--m28);
  }
  .standardi .container .row .card p{
    font-size: var(--m14);
    line-height: var(--m22);
    margin-top: 2.22vw;
    width: 69.72vw;
  }

.projekti-landing{
  width: var(--landing-width-mobile);
}

.projekti-landing .top {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
}

.projekti-landing .top .right {
    display: flex;
    
    flex-direction: column;
}

.projekti-landing .top .right p {
    font-family: var(--manrope);
    font-weight: 400;
    font-size: var(--m16);
    line-height: var(--m24);
    letter-spacing: var(--dvojka);
    text-align: left;
    width: var(--landing-width-mobile);
    margin-top: var(--m34);
    color: #4B4948;
    margin-bottom: 0;
}


.right .read-more {
    width: 32.77vw;
    height:9.72vw;
    border: 1px solid #4B494833;
    display: flex;
    justify-content: center;
    gap: 2.22vw;
    float: right;
    align-items: center;
    cursor: pointer;
    margin-top: var(--m24);
    margin-bottom: var(--m34);
}
.projekti-landing .top .right .read-more p{
  font-size: var(--m14);
}

.projekti-landing .top .right .read-more.hovered p{
  font-size: var(--m14);
}

.projekti-landing .top .right .read-more img{
 width: 2.22vw;
}

.projekti-landing .bottom .projektm{
  display: none;
}
.projekti-landing .top .left{
  width: var(--landing-width-mobile);
}

.projekti-landing .top .left h1{
  font-size: var(--m14);
  text-align: left;
  margin-top:var(--m64);
}

.projekti-landing .top .left h2{
  font-size: var(--m32);
  line-height: var(--m34);
  text-align: left;
      margin-top: var(--m16);
    margin-bottom:0;
    width: var(--landing-width-mobile);
}

.projekti-landing .bottom{
  margin-bottom: var(--m64);
}

.projektv{
  width: var(--landing-width-mobile);
}






}

  