#mainSection{
    padding-top: 65px;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    background: #fff;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    position: relative;
    min-height: calc(100vh - 64px - 96px - 48px);
    height: 100%;
    overflow: hidden;
}
.mainSectWrapp{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 100%;
    position: relative;
    height: 100%;
}
.mainSectDiv{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    width: 100%;
    z-index: 3;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center;
}
.mainSectDiv img{
    width: 100%;
    z-index: 1;
}
.mainBackGrad{
    background: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(30%, rgb(255,255,255)), color-stop(70%, rgb(255,255,255)), to(transparent));
    background: -o-linear-gradient(left, transparent 0%, rgb(255,255,255) 30%, rgb(255,255,255) 70%, transparent 100%);
    background: linear-gradient(to right, transparent 0%, rgb(255,255,255) 30%, rgb(255,255,255) 70%, transparent 100%);
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 2;
}
.mainBackGrad2{
    background: -webkit-gradient(linear, left top, left bottom, from(rgb(255,255,255)), color-stop(50%, rgb(255,255,255, .02)));
    background: -o-linear-gradient(top, rgb(255,255,255) 0%, rgb(255,255,255, .02) 50%);
    background: linear-gradient(to bottom, rgb(255,255,255) 0%, rgb(255,255,255, .02) 50%);
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 2;
}
.clipped{
    width: 360.7px;
  height: 95.2px;
  background: #00cfd0;
  background-size: cover;
  -webkit-clip-path: url(#my-clip-path);
  clip-path: url(#my-clip-path);

}
/*---------------------------------secondSection---------------------------------*/
#secondSection2{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    width: 100%;
    background-color: #fff;
    position: relative;
    padding-left: 60px;
    padding-right: 60px;
}
.secondSectionWrapp2{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    position: relative;
    margin-bottom: 60px;
    -webkit-column-gap: 15px;
       -moz-column-gap: 15px;
            column-gap: 15px;
    row-gap: 15px;
    padding: 25px;
}
.secondSectionWrapp2>a{
    max-width: 350px;
    width: 100%;
    position: relative;
    border-radius: 14px;
    overflow: hidden;
    background-color: #fafafa;
    max-height: 270px;
}
.secondSectionWrapp2>a>img{
    -o-object-fit: cover;
       object-fit: cover;
    width: 100%;
    height: 100%;
}
.secondSectionPopis{
    padding: 25px;
    z-index: 3;
    position: absolute;
    bottom: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 100%;
}
.secondSectionPopis>img{
    aspect-ratio:1
}
.backGrad{
    position: absolute;
    width: 100%;
    height: 100%;
    background: -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgb(0,0,0)));
    background: -o-linear-gradient(top, transparent 0%, rgb(0,0,0) 100%);
    background: linear-gradient(to bottom, transparent 0%, rgb(0,0,0) 100%);
    z-index: 2;
    top: 0;
}







@media only screen and (max-width: 1440px) {
    
}
@media only screen and (max-width: 910px) {
    .mainSectWrapp>img{
        display: none;
    }
}
@media only screen and (max-width: 770px) {
    .secondSectionWrapp2{
        padding: 0;
    }
    
}
@media only screen and (max-width: 650px) {
    h2{
        font-size: 38px;
    }
    #secondSection2{
        padding-left: 30px;
        padding-right: 30px;
    }
    .secondSectionPopis{
        padding: 15px;
    }
}
@media only screen and (max-width: 480px) {
    #secondSection2{
        padding-left: 15px;
        padding-right: 15px;
    }
    .secondSectionPopis>img{
        width: 90px !important;
        height: 90px !important;
    }
}