
/***/
.progress{ max-width: 540px; margin:auto; margin-bottom: 40px; }
.progress-item-title{ padding: 10px; background: var(--dark_green); color: var(--extralight); font-size: 18px; font-weight: bold}
.progress .docs-content{ text-align: center; font-size: 18px}
.progress .box-content-button{ margin: 20px 0}
.progress .progress-image{  width: 100%; max-width: 100%; height: 0; padding-top: 70%; background-repeat: no-repeat; background-position: center; background-size: cover; box-sizing: border-box}
.read-more{ display: none}

.read-more-button{ position: absolute; font-size: 13px; top: 0; bottom: 0; right: 0; margin: auto; height: 20px; line-height: 20px; padding-right: 30px; font-weight: normal}
.read-more-button:after {content: "\203A";display: block;width: 24px;height: 24px;position: absolute;top: 0;bottom: 0;right: 10px;box-sizing: border-box;margin: auto;font-size: 24px;transform: rotate(90deg);text-align: center;line-height: 19px;transition: all 0.3s ease;
}
.read-more-button.is-open:after{transform: rotate(-90deg)}
.read-more { padding: 10px 0}
.read-more p { padding-bottom: 7px;}

.box-image-slider .box-slider-item{ background-size: cover}

.box-image-slider .embla_navbutton{ position: absolute; width: 35px; height: 35px; top:50%; transform: translateY(-50%); transition: opacity 0.6s ease;
    border-radius: 50%;background: #e8f1eaad;box-shadow: 0 0 40px 0 #3041304f;cursor: pointer;}
.box-image-slider .embla_navbutton.hide{opacity: 0;}
.box-image-slider .embla__prev{ left: 20px; transform: rotate(180deg)}
.box-image-slider .embla__next{ right: 20px; }
.box-image-slider .zoom{ width: 40px; height: 40px; top:30px; right: 30px; background-size: 30px}

iframe{    width: 100%;  height: calc(100vw - 47vw); border: 0}

.progress .textarea{  padding: 0}

.progress .title-wrap .text{ font-weight: bold; font-size: 1.4em}

@media only screen and (min-width: 550px) {
    iframe{    width: 510px;  height: 287px; margin: auto; display: block}

}


@media only screen and (min-width: 1024px) {
    .progress{ max-width:1090px; }
    .read-more-button{ display: none}
    .read-more { display: block !important}
    .progress-item-title{background: none; color: inherit; padding: 0; margin-bottom: 10px; font-size: 24px}
    .progress-content{ padding-left: 20px;}

    .progress .progress-image{height: 100%; padding-top: 0;  min-height: 300px;}
    .content-box{ padding-top: 30px; margin-top: 30xp; border-top: 1px solid var(--green)}

    iframe{    width: 600px;  height: 340px;}
}

@media only screen and (min-width: 1600px) {
    .progress{ max-width:1160px; }

}