


.secUrun{
    
    position: relative;
    
    
    /*border:1px solid red;*/
}


.divUrunSlider{
    
    position: relative;
    
    height: auto;
    
    /*padding: 2em 0;*/
    /*padding-bottom: -8em;*/
    
    white-space: nowrap;
    
    background-color: var(--siyah);
    
}

.divUrunBaslik{
    
    position: absolute;
    
    top:3em;
    left:75%;
    transform: translateX(-50%);
    
    /*border:1px solid red;*/
}

.divUrunBaslik span:first-of-type{
    
    font-family: "Montserrat Bold",Helvetica, sans-serif;
    font-size: 2em;
    color:var(--gri3);
    
}
.divUrunBaslik span:last-of-type{
    
    font-family: "Montserrat Light",Helvetica, sans-serif;
    font-size: 2em;
    color:var(--gri3);
    
}


.divUrunKod{
    
    position: absolute;
    
    top:1em;
    left:28%;
    transform: translateX(-50%);
    
    /*border:1px solid red;*/
}
.divUrunKodCenter{
     position: absolute;
    
    top:2em;
    left:22%;
    transform: translateX(-50%);
}
.divUrunKod span, .divUrunKodCenter span{
    
    font-family: 'DIN Light',Helvetica, sans-serif;
    font-size: 1em;
    color:var(--gri2);
    
}

.divUrunResim{
    
    position: relative;
    display: inline-block;
    vertical-align: top;
    
    width: 50%;
    height:34em;
    
    margin-top: 3em;
    
    
    /*border:1px solid red;*/
}
.imgUrun{
    
    position: absolute;
    
    display: block;
    
    /*margin-left:auto;
    margin-right:15%;
    !*margin: 0 auto;*!*/
    right:10%;
    
    z-index: 2;
    
    width: 65%;
        
}
.imgUrunCenter{
    position: absolute;
    
    display: block;
    
    /*margin-left:auto;
    margin-right:15%;
    !*margin: 0 auto;*!*/
    left:44%;
    transform: translateX(-50%);
    
    
    width: 65%;
}

.divSecenek{
    
    position: absolute;
    
    width: 6em;
    
    top:6em;
    left:1em;
    
    white-space: normal;
    text-align: center;
    
    
    
    
    /*border:1px solid red;*/
}

.divSecenek span{
    
    position: relative;
    
    width: 6em;
    
    font-family: 'DIN Medium',Helvetica, sans-serif;
    font-size: 0.9em;
    color:var(--gri3);
}

.divSecenek div{
    
    position: relative;
    
    
    width: 2.5em;
    height: 2.5em;
        
    margin: 1em auto 0 auto;
    
    border-radius: 50%;
        
    cursor: pointer;
    

    border:1px solid white;
}
/*.divSecenek .divSelected{
    border:1px solid white;
}*/
.divSecenek .divSelected:after{
    
    content: '';
    
    position: absolute;
    
    width: 9em;
    height: 0;
    
    top:50%;
    left:100%;
    transform: translateY(-50%);
    
    
    border-top:1px solid white;
    
}



.divUstOzellikler{
    
    position: relative;
    display: inline-block;
    vertical-align: top;
    
    width: 50%;
    
    white-space: normal;
    
    /*border:1px solid red;*/
}

.divOzellik1{
    
    position: relative;
    
    min-height: 15em;
    
    margin-top: 7em;
    
}
.divOzellik1 p{
    
    position: relative;
    
    
    font-family: 'DIN Regular',Helvetica, sans-serif;
    font-size: 1em;
    color:var(--gri3);
}
.divOzellik1 p:before{
    
    content: '';
    
    position: absolute;
    width: 0.4em;
    height: 0.4em;
    
    top:0.5em;
    left: -1em;
    
    background-color: var(--gri3);
    
    border-radius: 50%;
    
}


.divOzellik2{
    
    position: relative;
    
    width: 92%;
    height: auto;
    
    white-space: nowrap;
        
    border-top:1px solid var(--gri3);
}

.divOzellik2Left{
    
    position: relative;
    display: inline-block;
    vertical-align: middle;
    
    white-space: normal;
    
    width: 50%;
    
}
.divOzellik2Left span:first-of-type{
    
    display: block;
    
    font-family: "Montserrat Bold",Helvetica, sans-serif;
    font-size: 1.8em;
    color:var(--gri3);
}
.divOzellik2Left span:last-of-type{
    
    display: block;
    
    font-family: "Montserrat Light",Helvetica, sans-serif;
    font-size: 1.8em;
    color:var(--gri3);
}
.divOzellik2 p{
    position: relative;
    
    
    font-family: 'DIN Regular',Helvetica, sans-serif;
    font-size: 1em;
    color:var(--gri3);
}

.divOzellik2Right{
    
    position: relative;
    display: inline-block;
    vertical-align: middle;
    
    width: 49%;
    
    text-align: right;
    
    margin-top: 0.5em;
    
    /*border:1px solid red;*/
    
}
.divOzellik2Right img{
    
    
    width:70%;
}


.divAsagi{
    
    position: absolute;
    
    width: 5em;
    
    bottom:-6em;
    left:65%;
    transform: translateX(-50%);
    
    cursor: pointer;
    
    opacity: 0;
    animation: pulse 1.2s infinite;
    
    /*border:1px solid red;*/
    
}
.divAsagi img{
    width: 100%;
}
@keyframes pulse {
  0% {
   
      opacity: 0;
      bottom: -6em;
  }
  100% {
    
      opacity: 1;
      bottom: -8em;

  }
}


.divUrunBaslik2{
    
    
    position: absolute;
    
    top:-6em;
    right:1em;
    
    /*border:1px solid red;*/
}

.divUrunBaslik2 span:first-of-type{
    
    font-family: "Montserrat Bold",Helvetica, sans-serif;
    font-size: 2.2em;
    color:var(--gri2);
    
}
.divUrunBaslik2 span:last-of-type{
    
    font-family: "Montserrat Light",Helvetica, sans-serif;
    font-size: 2.2em;
    color:var(--gri2);
    
}

.divUrunAlt{
    
    position: relative;
    display: block;
    
    /*min-height: 96em;*/
    
}

.divOzellik3{
    
    position: absolute;
       
    width: 40%;
    
    top:0em;
    left:0;
    
    /*margin-top: 8em;*/
    
    /*border:1px solid red;*/
}
.divOzellik3 span{
    font-family: "DIN Medium",Helvetica, sans-serif;
    font-size: 2.0em;
    color:var(--siyah);
}
.divOzellik3 p{
    font-family: "DIN Regular",Helvetica, sans-serif;
    font-size: 1.0em;
    color:var(--siyah);
}
.divOzellik3 img{
    width: 100%;
}

.divUrunSet{
    
    position: relative;
    
    width: 50%;
    height: auto;
    
    margin-top: 16em;
    margin-left: 50%;
    margin-bottom: 5em;
    
    
    /*right: 1em;
    top:5em;*/

    /*border:1px solid red;*/
    
}
.divUrunSet img{
    width: 100%;
}
.divUrunSet span{
    
    position: absolute;
    
    width: 4.5em;
    height: 2.5em;
    
    bottom:0;
    right:0;
    
    font-family: "DIN Medium",Helvetica, sans-serif;
    font-size: 1.8em;
    color:var(--siyah);
    
    /*border:1px solid red;*/
}
.divUrunSet span:before{
    
    content: '';
    
    position: absolute;
    
    width: 3em;
    height: 2em;
    
    top:-35%;
    left:-90%;
    
    transform: skew(30deg);
    
    z-index: -1;
    
    border-left:2px solid var(--siyah);
    border-bottom:2px solid var(--siyah);
}







.secDiger{
    
    position: relative;
    
    padding: 2em 0;
    
    text-align: center;

    white-space: nowrap;
    
    background-color: var(--gri2);
    
}

.divLeft{
    
    position: relative;
    display: inline-block;
    vertical-align: middle;
    
    width: 6%;
    
    transition: all 0.2s;

    cursor: pointer;

    
    /*border:1px solid red;*/

}
.divLeft img{
    display: block;
    width: 4em;
    margin:0 auto;
}
.divRight{
    
    position: relative;
    display: inline-block;
    vertical-align: middle;
    
    width: 6%;
    
    transition: all 0.2s;
    
    cursor: pointer;

    
    /*border:1px solid red;*/
    
}
.divRight img{
    display: block;
    width: 4em;
    margin:0 auto;
}


.divLeft:active, .divRight:active{
    
    transform: scale(0.9);
    
}


.divDigerContainer{
    
    position: relative;
    display: inline-flex;
    vertical-align: middle;
    
    
    width: 75%;
    
    /*height: 3em;*/
    
    
    overflow: hidden;
    
    text-align: left;
    
    /*border:1px solid red;*/
    
}
.divv{
    
    position: relative;
    
     flex-shrink: 0;
   
    /*vertical-align: top;*/
    
    width: 12.5%;
    
    height: 4em;
    
    white-space: normal;
    
    text-align: center;
    
    background-color: #5ac289;
    
    transition: all 0.3s;
    
    /*border:1px solid lime;*/
    
}

.divDiger{
     position: relative;
    
     flex-shrink: 0;
   
    /*vertical-align: top;*/
    
    width: 16.5%;
    height: 13em;
    
    
    white-space: normal;
    
    text-align: center;
    
    cursor:pointer;
    
    transition: all 0.3s;
    
    /*border:1px solid lime;*/
}
.divDigerImg{
    
    position: relative;
    
    width: 100%;
    height: 10em;
    
   
    
    /*border:1px solid red;*/
    
}

.divBack{
    
    position: absolute;
    /*display: none;*/
    
    width: 100%;
    height: 100%;
    
    top:0;
    left:50%;
    transform: translateX(-50%);
    
    border-radius: 50%;
    
    background-color: var(--maviAcik);
    
    opacity: 0;
    
    z-index: 1;
    
    transition: all 0.3s;
    
}

.divDigerImg img{
    position: absolute;
    display: block;
    width: 70%;
    
    bottom:0;
    left:50%;
    transform: translateX(-50%);
    
    
    z-index: 2;
}
.divDiger span:first-of-type{
    
    position: relative;
    display: block;
    
    margin-top: 1em;
    
    font-family: 'Montserrat SemiBold',Helvetica, sans-serif;
    font-size: 0.9em;
    
    transition: all 0.3s;
    
}
.divDiger span:last-of-type{
    
    position: relative;
    display: block;
    
    font-family: 'Montserrat Regular',Helvetica, sans-serif;
    font-size: 0.9em;
        
    transition: all 0.3s;
    
}

.divDiger:hover .divBack{
    opacity: 1;   
}

.divDiger:hover span{
    color:var(--maviAcik);
}