/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.5.15,
* Autoprefixer: v10.5.0
* Browsers: last 4 version
*/

/*==========================HERO SECTION==========================*/
section.heroSectionContainer.singleProject .heroSectionInfoContainer {
    position: relative;
    z-index: 3;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    padding-bottom: 7rem;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.heroSectionTitleDescWrapper {
    width: 30%;
}
.statusInfoWrapper .project-status {
    position: relative;
    top: auto;
    left: auto;
}
.material-img {
    width: 5rem;
    aspect-ratio: 1 / 1;
}
.material-img img {
    width: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    height: 100%;
    aspect-ratio: 1 / 1;
}
.materialWrap {
    width: 10rem;
    aspect-ratio: 1 / 1;
    background-color: var(--medium-yellow);
    border-radius: var(--radius-box);
    padding: .65rem;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 0.5rem;
}
.materialWrapper {
    gap: 1rem;
}
.materialContainer > p {
    font-size: 1.125rem;
    font-weight: 700;
}
.materialWrap p {
    margin: 0;
    color: var(--medium-gray);
    text-transform: uppercase;
    font-family: var(--font-arame), sans-serif;
}
/*==========================HERO SECTION==========================*/
/*=========================SLIDER SECTION=========================*/
section.singleProjectSliderWrapper .mySwiper .media-wrap img {
    -webkit-filter: grayscale(1);
    filter: grayscale(1);
    -webkit-transition: -webkit-filter 0.3s linear;
    transition: -webkit-filter 0.3s linear;
    transition: filter 0.3s linear;
    transition: filter 0.3s linear, -webkit-filter 0.3s linear;
}
section.singleProjectSliderWrapper .mySwiper .swiper-slide-thumb-active .media-wrap img {
    -webkit-filter: none;
    filter: none;
}
section.singleProjectSliderWrapper {
    position: relative;
    width: 100%;
    display: block;
}
section.singleProjectSliderWrapper .mySwiper2 {
    margin-bottom: 1rem;
}
section.singleProjectSliderWrapper .media-wrap {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    border-radius: var(--radius-box);
}
section.singleProjectSliderWrapper .media-wrap img,
section.singleProjectSliderWrapper .media-wrap video {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: var(--radius-box);
}
section.singleProjectSliderWrapper .swiper-slide {
    border-radius: var(--radius-box);
}
section.singleProjectSliderWrapper .media-wrap.video .play-icon-wrap {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    cursor: pointer;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 3.75rem;
    height: 3.75rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.50);
    backdrop-filter: blur(5px);
    border-radius: 50%;
}
section.singleProjectSliderWrapper .media-wrap.video .play-icon-wrap [class^="icon-"] {
    color: var(--yellow);
    font-size: 1.35rem;
    -webkit-transition: opacity 0.15s linear;
    transition: opacity 0.15s linear;
}
section.singleProjectSliderWrapper .mySwiper .media-wrap {
    cursor: pointer;
}
section.singleProjectSliderWrapper .media-wrap.main [class^="icon-"] {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
section.singleProjectSliderWrapper .media-wrap.main .icon-pause {
    opacity: 0;
}
section.singleProjectSliderWrapper .media-wrap.main.playing .play-icon-wrap .icon-pause {
    opacity: 1;
}

section.singleProjectSliderWrapper .media-wrap.main.playing .play-icon-wrap .icon-play {
    opacity: 0;
}
/*=========================SLIDER SECTION=========================*/
/*======================SPECIFICATION SECTION======================*/
.singleProjectSpecificationWrapper {
    margin-bottom: calc(var(--margin-block) / 2);
}
.singleProjectSpecificationContainer {
    -ms-grid-column: 1;
    -ms-grid-column-span: 6;
    grid-column: 1 / 7;
    position: relative;
}
section.singleProjectSpecificationDiagramWrapper {
    position: relative;
    width: 100%;
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: (1fr)[10];
    grid-template-columns: repeat(10,1fr);
}
.singleProjectDiagramProcessWrapper {
    -ms-grid-column: 8;
    -ms-grid-column-span: 3;
    grid-column: 8 / 11;
    position: relative;
    display: block;
}
.singleProjectSpecificationContainer .title-wrap {
    margin-bottom: calc(var(--margin-block) / 2);
}
.singleProjectSpecificationWrap {
    border-top: 1px solid var(--light-yellow);
    padding-block: 1rem;
    -webkit-padding-start: 0.75rem;
    padding-inline-start: 0.75rem;
}

.singleProjectSpecificationWrap.section-title {
    border-top: none;
}

.singleProjectSpecificationWrap.section-title h3.title.section {
    font-size: 1.125rem;
    font-weight: 700;
    margin: 0;
}

.singleProjectSpecificationWrap p {
    margin: 0;
}

.singleProjectSpecificationWrap p.title {
    font-weight: 700;
    color: var(--light-gray);
    margin-bottom: .5rem;
}
.singleProjectDiagramWrapper {
    margin-bottom: 2rem;
}

.singleProjectDiagramProcessWrapper .title-wrap {
    margin-bottom: 3rem;
}

.diagramWrap {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
}
.diagramWrap img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    vertical-align: middle;
}
.process-wrap {
    margin-bottom: 2rem;
}
.process-wrap img {
    width: 100%;
}
.singleProjectProcessWrap {
    position: sticky;
    left: 0;
    top: var(--headerHeight);
}
/*======================SPECIFICATION SECTION======================*/
body[data-pagetype="singleProject"] section.membersWrapper {
    margin-top: calc(var(--margin-block) / 2);
}
/*=======================DOCUMENTATION SECTION=======================*/
.documentationWrapper {
    margin-top: calc(var(--margin-block) / 2);
    position: relative;
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 1.813rem 1fr 1.813rem 1fr;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 1.813rem;
}

section.documentationContainer {
    position: relative;
    width: 100%;
    display: block;
}

.documentationWrap {
    padding: 2.5rem;
    background-color: var(--gray);
    border-radius: var(--radius-box);
    border: 1px solid var(--medium-yellow);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: .75rem;
}

.documentationWrap h3 {
    margin: 0;
    font-size: 1.375rem;
}
.documentationItem {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-block: .75rem;
    border-top: 1px solid var(--medium-yellow);
    border-bottom: 1px solid var(--medium-yellow);
    gap: 1.5rem;
}
.documentationItem p {
    margin: 0;
    color: #B3B4BC;
}
.documentationItem span.icon-card-download {
    font-size: 1.25rem;
    color: var(--light-medium-yellow);
}
.documentationItem:last-child {
    border-top: none;
}
.documentationItem .download-pdf {
    border-radius: 5px;
    border: 1px solid var(--very-light-gray);
    background: #D2D2D2;
    width: 2rem;
    height: 2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-width: 2rem;
    min-height: 2rem;
}
/*=======================DOCUMENTATION SECTION=======================*/
/*=====================RELATED PROJECTS SECTION======================*/
.relatedProjectsWrapper {
    position: relative;
    width: 100%;
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 1.5rem 1fr 1.5rem 1fr;
    grid-template-columns: repeat(3,1fr);
    grid-gap: 1.5rem;
    margin-top: calc(var(--margin-block) / 2);
}
.relatedProjectsWrapper .projectWrap:nth-child(4n + 2),.relatedProjectsWrapper .projectWrap:nth-child(4n + 3) {
    grid-column: unset;
}
section.relatedProjectsContainer {
    position: relative;
    width: 100%;
    margin-bottom: var(--margin-bottom);
}
/*=====================RELATED PROJECTS SECTION======================*/
.aboutMachineryInfoWrap {
    margin-top: calc(var(--margin-block) / 2);
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
}

.aboutMachineryInfoWrap p {
    margin-top: 0;
}

@media only screen and (max-width: 768px){}
@media only screen and (min-width: 640px) and (max-width: 768px){}
@media only screen and (min-width: 769px) and (max-width: 1199px){}
@media only screen and (min-width: 1200px) and (max-width: 1399px){}
@media only screen and (min-width: 1400px) and (max-width: 1700px){}