:root {
    --indigo: #a12eb7;
  }

.about-container{
    margin-top: 30px;
}

.img-div{
    text-align: center;
    height: 100px;
}

.img-div img{
    height: 100%;
}

.textDiv{
    margin-top: 60px;
}
.TextAbout{
    color: var(--indigo);
    font-weight: bold;
    font-size: 21px;
    font-family: mtavruli;
}

.imgAboutDiv{
    height: 600px;
    background-size: 110% 105% !important;
    margin-bottom:0px;
    margin-left: auto;
    background: url(/upload/images/about/ourteam.svg);
    background-size: cover;
    position: relative;
    opacity:0.8;
}
.txtAboutDiv{
    width: 800px;
    opacity:0.9;
    background-image: url(/upload/images/navbar/header.svg);
    background-size: auto 100%;
    top: 50%;
    position: absolute;
    padding: 40px;
    transform: translateY(-50%);
    color: white;
    font-weight: bold;
    z-index: 3;
    left: 0;
}

.txtAboutDiv p{
    font-size: 20px;
}
.txtAboutDiv h1{
    position: relative;
    margin-bottom: 14px;
}
.txtAboutDiv h1::after{
    content: "";
    position: absolute;
    height: 2px;
    width: 140px;
    background-color: white;
    bottom: -5px;
    left: 0;
}

.section_title{
    display: flex; 
    justify-content: left;
    margin-left:14px;
    margin-top: 30px;
    margin-bottom:30px !important;
    font-family: mtavruli !important;
}


#partners .section_title, #clients .section_title, #history .section_title, #aboutus .section_title{
    justify-content: center !important;
    margin-left:0px !important;
}

.section_title h1{
     color: var(--indigo);
     font-weight: bold;
     font-size:25px;
}

.text-indent{
    text-indent:30px;
}

.teamCard{
    background-color: #f3f3f3;
    box-shadow: 0 0 13px rgb(133, 133, 133);
    padding: 0;
    position: relative;
    box-shadow: 0 0 13px rgb(123 123 123 / 30%);
}

.teamCard img{
    border-radius: 50%;
    height: 180px;
    width: 60%;
    display: block;
    margin: 20px auto 0;
    border: 2px solid white;
    position: relative;
    z-index: 2;
    background-color: white;
}

.teamCard::after{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 150px;
    background: linear-gradient(to right, var(--indigo), #5a415f);
    border-radius: 8px;
}

.teamTitle{
    color: var(--indigo);
    font-weight: bold;
    text-align: center;
}

.teamPosition{
    text-align: center;
}

.aboutservices {
    max-width: 850px;
    margin: 40px auto 20px;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(100px, 205px));
    gap: 20px;
    justify-content: center;
}
.aboutservices > div > img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}


.image_div:hover {
    transform: scale(1.05);
}

.image_div{
    display:grid;
    place-items: center;
    transition:0.2s ease;
    background-color: white;
    margin-right: 15px;
    height:65px;
    width:15%; 
    border-radius:7px;
    overflow: hidden;
    margin-top:15px;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
}

#clients > div > div > img, #partners > div > div > img{
    display:grid;
    place-items: center;
    width:100%;
    max-height:100%;
    max-width:100%;
    background-color: white !important;
    margin:0 auto;
}

.one_section{
    padding-top:70px;
    margin:0 auto;
    margin-top:-px;
}

.one_section img{
    width:100%;
    height:auto;
    float:left;
    margin-right:10px;
}

.important_word{
    color:var(--indigo);
}

#vision li, #mission li, #values li{
    margin-top:20px;
    text-align:justify;
}

#activities p, #environmentalprotection p{
    margin-left:20px;
    text-align:justify; 
    line-height:30px
}

#clients .row , #partners .row{
    grid-gap:2%;
}

#environmentalprotection .col-8{
    text-align: center;
}

#environmentalprotection .col-4, #activities .col-4, #values .col-4, #vision .col-4,  #mission .col-4, #vision .col-4  #history .col-4 {
    display: grid;
    place-items: center;
    padding-top:30px;
}

.all {
    display: flex;
    flex-wrap: wrap;
    gap: 2%;
}


.each {
    height: 320px;
    /* background: red; */
    width: 14.8%;
    /* border-bottom: 9px solid green; */
    position: relative;
    border-left: 3px dashed var(--indigo);
    padding-top:15px;
    margin-top:20px;
}

.border-bottom{
    position:absolute;
    width:110%;
    height:10px;
    bottom:-10px;
    background-image: linear-gradient(90deg, var(--indigo), #740f88);
}

.each > img {
     width: 30%;
     max-height: 100px;
     margin: 0 auto;
     display: block;
     color:var(--indigo);
}
  
.each:last-child:after {
  content: "";
  position: absolute;
  transform: translate(98%,70%);
  bottom: 0;
  right: 0;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  border: 5px solid #740f88;
  background-color: white;
}

.index {
  position: absolute;
  transform: translate(calc(-50%),60%);
  bottom: 0;
  left: 0;
  display: grid;
  place-items: center;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  background: white;
  padding:7px;
  z-index: 1;
  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}

.index_number{
    background-color: var(--indigo);
    border-radius: 50%;
    color:white;
    width:100%;
    text-align:center;
    font-weight: bold;
    font-size:18px;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 30px 60px -12px inset, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px inset;
    padding: 2px 5px;
}

.year{
    border:3px dashed var(--indigo);
    display: inline-block;
    font-size:28px;
    font-weight: bold;
    color: rgba(0, 0, 0, 0.7);
    padding:0px 30px;
    border-radius: 40px;
    transform: translate(-30%, 0%);
    background-color: #e9ebee;
    height: 65px;
    width:124px;
    margin:7px 0px;
}

.each .year-child{
    position: absolute;
    height: 66px !important;
    background: #e9ebee;
    padding-top: 5px;
    top: -4px;
    left: 33px;
    width: 100%;
}

.check_icon{
    display: block;
    text-align: center;
    font-size: 58px;
    color:var(--indigo);
    margin-left:20px;
}

.each .year_span{
    border:4px solid var(--indigo);
    border-radius: 30px;
    padding:0px 30px;
    position:absolute;
    left: -25px;
    top:8px;
    background-color: white;
    box-shadow: rgba(0, 0, 0, 0.6) 3px 3px 4px;
    font-family: sans-serif;
    width:175px;
    text-align: center;
}

.text-div{
    padding-left:10px;
    font-size:13px;
    width:105%;
}


#history .important_word{
    font-weight: bold;
    font-family: mtavruli;
    font-size: 14px;
}

.aboutImgs{
    max-width:450px;
}
.ck-content  .ck-widget__resizer
{
    display: none !important;
}

.ck-content  .ck-widget__type-around
{
    display: none !important;
}

@media screen and (max-width: 768px) {
    .txtAboutDiv {
    width: auto;
    position: initial;
    transform: inherit;
    margin-bottom: 28px;
    }    
}


@media screen and (max-width: 1200px) {

    #clients .row , #partners .row{
        grid-gap:2.5%;
    }

    .image_div{
        width:18%;
    }

    .col-1{
        width:110px !important;
    }

    .each{
        width:18%;
    }

    .all{
        gap:2.5%;
    }
    
}


@media screen and (max-width: 990px) {

    #clients .row , #partners .row{
        grid-gap:4%;
    }

    .image_div{
        width:22%;
    }

    #activities img{
        width:100%;
    }

    .each{
        width:30%;
    }

    .all{
        gap:5%;
    }

    .one_section img{
        width:50%;
    }
    
}  


@media screen and (max-width: 766px) {

    #clients .row , #partners .row{
        grid-gap:3.5%;
        flex-direction: row !important;
    }

    .each{
        width:48%;
    }

    .all{
        gap:4%;
    }
    

    .image_div{
        width:31%;
    }

    #environmentalprotection .col-8, #activities .col-8, #values .col-8, #mission .col-8, #vision .col-8, #history .col-8,
    #environmentalprotection .col-4, #activities .col-4, #values .col-4, #mission .col-4, #vision .col-4, #history .col-4 {
        width:100% !important;   
    }

    #vision .col-4{
        display:none;
    }

    #values p{
        text-align: center;
    }

    #environmentalprotection img, #activities img, #values img, #mission img{
        height:230px;
        float:right;
        margin-right:10px;
        width:auto;
        margin:0 auto;
    }

    .section_title{
        justify-content: center;
        margin-left:0px !important;
    }

    p{
        line-height: 24px !important;
        font-size:14px;
    }

    li{
        font-size: 15px;
    }

    ul{
        padding-left:23px;
    }

    #activities p, #environmentalprotection p{
        margin-left:0px;
    }

    .one_section img{
        width:50%;
    }
}  


@media screen and (max-width: 574px) {

    #clients .row , #partners .row{
        grid-gap:8%;
    }

    .image_div{
        width:100%;
        height: 110px;
        padding-left: 90px;
    }

    .each{
        width:100%;
    }

    .border-bottom{
        width:100%;
    }

    .all{
        margin:0px 20px 0px 30px;
    }

    .one_section img{
        width:50%;
    }

    .image_div img{
        width:72%;
    }
}  