main section.topblock {
    grid-column: 1/35;
    display: grid;
    grid-template-columns: var(--Column);
    overflow: hidden
}

main section.topblock .WayPoint {
    grid-column: 1/35;
    height: 1px;
    grid-row: 1/2;
    align-self: center
}

main section.topblock .WayPoint:last-of-type {
    align-self: end
}

main section.topblock span.background {
    grid-column: 11/35;
    grid-row: 1/2;
    background-color: var(--AccentColor);
    justify-self: end;
    align-self: end;
    height: 0%;
    width: 100%;
    transition: height .5s
}

main section.topblock span.background.fullwidth {
    height: 100%;
    transition: height .5s
}

main section.topblock h3 {
    grid-column: 13/28;
    grid-row: 1/2;
    font-family: var(--Font_Big);
    color: var(--MainColor_Light);
    text-transform: uppercase;
    font-size: 2.8em;
    padding: 60px 0 50px 0;
    line-height: 1em;
    transform: translate(0, 100%);
    transition: transform .5s
}

main section.topblock h3.show {
    transform: translate(0, 0);
    transition: transform .5s
}

main section.projectblock {
    grid-column: 1/35;
    grid-row: 2/3;
    display: grid;
    grid-template-columns: var(--Column);
    grid-template-rows: 100px 100px max-content;
    margin-top: 50px
}

main section.projectblock .WayPoint {
    grid-row: 2/3;
    grid-column: 1/35;
    height: 1px;
    width: 100%
}

main section.projectblock .WayPoint:nth-child(3) {
    grid-row: 3/4;
    grid-column: 1/35;
    margin-top: 180px
}

main section.projectblock .WayPoint:nth-child(4) {
    grid-row: 3/4;
    grid-column: 1/35;
    margin-top: 150px
}

main section.projectblock .WayPoint:nth-child(5) {
    grid-row: 1/4;
    grid-column: 1/35;
    align-self: center;
    justify-self: center
}

main section.projectblock .WayPoint:nth-child(6) {
    grid-row: 1/4;
    grid-column: 1/35;
    align-self: center;
    justify-self: center
}

main section.projectblock article {
    grid-column: 3/8;
    grid-row: 1/3;
    opacity: 0;
    transition: opacity .5s
}

main section.projectblock article.show {
    opacity: 1;
    transition: opacity .5s
}

main section.projectblock article p {
    font-family: var(--Font_Reg);
    color: var(--MainColor_Dark)
}

main section.projectblock article p strong {
    font-family: var(--Font_Bold)
}

main section.projectblock>div {
    display: grid
}

main section.projectblock>div .hider {
    grid-row: 1/2;
    grid-column: 1/2;
    height: 100%;
    width: 100%;
    background-color: #000;
    align-self: end;
    z-index: 8;
    transition: height 1s;
    transition-delay: 1 s
}

main section.projectblock>div.show .hider {
    height: 0;
    transition: height 1s
}

main section.projectblock>div figure {
    grid-row: 1/2;
    grid-column: 1/2;
    height: 600px;
    width: 100%;
    display: grid;
    z-index: 5
}

main section.projectblock>div.rightart figure {
    height: 700px
}

main section.projectblock>div figure img {
    height: 600px;
    width: 100%;
    object-fit: cover;
    grid-row: 1/2;
    grid-column: 1/2
}

main section.projectblock>div.rightart figure img {
    height: 700px
}

main section.projectblock>div figcaption {
    grid-row: 1/2;
    grid-column: 1/2;
    display: flex;
    align-items: center;
    font-family: var(--Font_Big);
    color: var(--MainColor_Light);
    font-size: 1em;
    height: max-content;
    align-self: end;
    padding-left: 15px;
    padding-bottom: 15px;
    z-index: 10;
    opacity: 0;
    transition: opacity .5s
}

main section.projectblock>div.show figcaption {
    opacity: 1;
    transition: opacity .5s
}

main section.projectblock>div figcaption img {
    height: 20px;
    width: max-content;
    margin-right: 10px
}

main section.projectblock>div h4 {
    font-family: var(--Font_Big);
    color: var(--MainColor_Dark);
    text-transform: uppercase;
    margin-top: 10px
}

main section.projectblock>div.leftart {
    grid-template-rows: 600px max-content;
    grid-column: 3/12;
    grid-row: 3/4
}

main section.projectblock>div.rightart {
    grid-column: 15/33;
    grid-row: 2/4;
    grid-template-rows: 700px max-content
}

main section.bigblock {
    grid-column: 1/35;
    display: grid;
    grid-template-columns: var(--Column);
    grid-template-rows: max-content max-content;
    margin-top: 100px;
    gap: 30px 0
}

main section.bigblock.no_reg {
    grid-row: 3/4;
    grid-template-rows: max-content
}

main section.bigblock .WayPoint {
    grid-row: 1/3;
    grid-column: 1/35;
    height: 1px;
    width: 100%
}

main section.bigblock .WayPoint[data-anim-type=Parallax] {
    align-self: center;
    justify-self: center
}

main section.bigblock .WayPoint:nth-child(2) {
    align-self: start;
    margin-top: 150px
}

main section.bigblock .WayPoint:nth-child(3) {
    align-self: end;
    margin-bottom: 110px
}

main section.bigblock img {
    grid-column: 1/8;
    grid-row: 1/3;
    height: 100%;
    width: 100%
}

main section.bigblock.no_reg img {
    grid-row: 1/2
}

main section.bigblock article {
    grid-column: 1/35;
    grid-row: 1/2;
    width: 100%;
    display: grid;
    grid-template-columns: var(--Column)
}

main section.bigblock article.tekstregular {
    grid-row: 1/2;
    grid-template-rows: max-content max-content max-content;
    overflow: hidden
}

main section.bigblock.flip article.tekstregular {
    grid-row: 2/3
}

main section.bigblock article.tekstregular p {
    grid-column: 11/32;
    font-family: var(--Font_Bold);
    color: var(--MainColor_Dark);
    transform: translate(0, 1000%);
    transition: transform 1s
}

main section.bigblock.flip article.tekstregular p {
    grid-column: 12/32
}

main section.bigblock article.tekstregular.show p {
    transform: translate(0, 0);
    transition: transform 1s
}

main section.bigblock article.tekstregular h5 {
    grid-column: 11/32;
    font-family: var(--Font_Big);
    color: var(--AccentColor);
    text-transform: uppercase;
    font-size: 2em;
    margin-top: 10px;
    transform: translate(0, 1000%);
    transition: transform 1s
}

main section.bigblock.flip article.tekstregular h5 {
    grid-column: 12/32
}

main section.bigblock article.tekstregular.show h5 {
    transform: translate(0, 0);
    transition: transform 1s
}

main section.bigblock article.tekstregular a {
    grid-column: 11/32;
    width: max-content;
    height: max-content;
    margin-top: 20px;
    transform: translate(0, 1000%);
    transition: transform 1s
}

main section.bigblock.flip article.tekstregular a {
    grid-column: 12/32
}

main section.bigblock article.tekstregular.show a {
    transform: translate(0, 0);
    transition: transform 1s
}

main section.bigblock article.blackbox {
    grid-row: 2/3;
    grid-template-rows: max-content max-content
}

main section.bigblock.flip article.blackbox {
    grid-row: 1/2;
    grid-template-rows: max-content max-content
}

main section.bigblock article.blackbox.button_box {
    grid-row: 1/2;
    grid-template-rows: max-content max-content max-content;
    align-self: center;
    justify-self: center
}

main section.bigblock article.blackbox span {
    grid-column: 11/35;
    grid-row: 1/3;
    background-color: var(--MainColor_Dark);
    justify-self: end;
    width: 0;
    transition: width .5s;
    transition-delay: .4s
}

main section.bigblock.flip article.blackbox span {
    grid-column: 11/35
}

main section.bigblock article.blackbox.button_box span {
    grid-row: 1/4
}

main section.bigblock article.blackbox.show span {
    width: 100%;
    transition: width .5s;
    transition-delay: 0s
}

main section.bigblock article.blackbox h5 {
    grid-column: 13/31;
    grid-row: 1/2;
    font-family: var(--Font_Big);
    color: var(--MainColor_Light);
    text-transform: uppercase;
    font-size: 2em;
    margin-top: 50px;
    opacity: 0;
    transition: opacity 1s;
    transition-delay: 0s
}

main section.bigblock.no_reg article.blackbox h5 {
    grid-column: 12/24
}

main section.bigblock article.blackbox.show h5 {
    opacity: 1;
    transition: opacity 1s;
    transition-delay: .2s
}

main section.bigblock article.blackbox p {
    grid-column: 15/25;
    grid-row: 2/3;
    font-family: var(--Font_Reg);
    color: var(--MainColor_Light);
    margin-top: 20px;
    margin-bottom: 50px;
    opacity: 0;
    transition: opacity 1s;
    transition-delay: 0s
}

main section.bigblock.no_reg article.blackbox p {
    grid-column: 15/23;
    margin-bottom: 20px
}

main section.bigblock article.blackbox.show p {
    opacity: 1;
    transition: opacity 1s;
    transition-delay: .4s
}

main section.bigblock article.blackbox.button_box a {
    grid-column: 15/23;
    grid-row: 3/4;
    margin-bottom: 20px;
    opacity: 0;
    transition: opacity 1s
}

main section.bigblock article.blackbox.show.button_box a {
    opacity: 1;
    transition: opacity 1s;
    transition-delay: .4s
}

main section.bigblock.form {
    margin-top: -100px
}

main section.bigblock.form img {
    height: auto;
    align-self: end
}

main section.bigblock.form article.blackbox {
    grid-template-rows: max-content max-content max-content
}

main section.bigblock article.blackbox span {
    grid-row: 1/4
}

main section.bigblock.form article.blackbox a {
    grid-column: 13/31;
    grid-row: 1/2;
    font-family: var(--Font_Big);
    color: var(--MainColor_Light);
    text-transform: uppercase;
    font-size: 2em;
    margin-top: 50px;
    text-decoration: none;
    opacity: 0;
    line-height: 1.4em;
    cursor: pointer;
    transition: opacity 1s;
    transition-delay: 0s
}

main section.bigblock.form article.blackbox a:nth-child(3) {
    grid-row: 2/3;
    margin-top: 0
}

main section.bigblock.form article.blackbox a span {
    color: var(--AccentColor)
}

main section.bigblock.form article.blackbox.show a {
    opacity: 1;
    transition: opacity 1s;
    transition-delay: .2s
}

main section.bigblock.form article.blackbox.show a:hover {
    opacity: .5;
    transition: opacity 1s
}

main section.bigblock.form article.blackbox p {
    grid-column: 13/16;
    grid-row: 3/4
}

main section.bigblock.form article.form {
    grid-row: 2/3;
    grid-column: 1/35;
    display: grid;
    grid-template-columns: var(--Column);
    grid-template-rows: max-content max-content
}

main section.bigblock.form article.form div.title {
    display: flex;
    flex-flow: column;
    grid-row: 1/2;
    grid-column: 13/32;
    margin: 20px 0
}

main section.bigblock.form article.form div.title h5 {
    color: var(--AccentColor);
    font-size: 2em;
    text-transform: uppercase;
    font-family: var(--Font_Big)
}

main section.bigblock.form article.form form {
    display: grid;
    grid-template-columns: var(--Column);
    grid-column: 1/35;
    grid-row: 2/3;
    gap: 20px 0
}

main section.bigblock.form article.form form fieldset {
    display: flex;
    width: 100%;
    flex-flow: column
}

main section.bigblock.form article.form form fieldset label {
    font-family: var(--Font_Big);
    font-size: 1.5em;
    color: var(--MainColor_Dark);
    text-transform: uppercase
}

main section.bigblock.form article.form form fieldset input,
main section.bigblock.form article.form form fieldset textarea {
    font-family: var(--Font_Reg);
    color: var(--MainColor_Dark);
    font-size: 1em;
    border: none;
    border-bottom: solid 1px var(--MainColor_Dark);
    resize: none;
    transition: border-bottom .5s
}

main section.bigblock.form article.form form fieldset textarea {
    min-height: 80px
}

main section.bigblock.form article.form form fieldset input.invalid,
main section.bigblock.form article.form form fieldset textarea.invalid {
    border-bottom: solid 1px var(--AccentColor);
    transition: border-bottom .5s
}

main section.bigblock.form article.form form fieldset:nth-child(1) {
    grid-row: 1/2;
    grid-column: 13/20
}

main section.bigblock.form article.form form fieldset:nth-child(2) {
    grid-row: 1/2;
    grid-column: 23/32
}

main section.bigblock.form article.form form fieldset:nth-child(3) {
    grid-row: 2/3;
    grid-column: 13/20
}

main section.bigblock.form article.form form fieldset:nth-child(4) {
    grid-row: 2/3;
    grid-column: 23/32
}

main section.bigblock.form article.form form fieldset:nth-child(5) {
    grid-row: 3/4;
    grid-column: 13/32
}

main section.bigblock.form article.form form p.captcha_notify {
    margin-top: 10px;
    grid-column: 13/33;
    grid-row: 4/5;
    text-align: start;
    color: var(--MainColor_Dark);
    opacity: .3;
    font-size: .8em;
    font-family: var(--Font_Reg)
}

main section.bigblock.form article.form form p.captcha_notify a {
    color: var(--MainColor_Dark)
}

main section.bigblock.form article.form form>input {
    grid-row: 5/6;
    grid-column: 13/32
}

main section.bigblock.form article.form form .message {
    grid-row: 5/6;
    grid-column: 13/32;
    width: 100%;
    background-color: var(--AccentColor);
    opacity: 0;
    transition: opacity 1s
}

main section.bigblock.form article.form form .message p {
    font-family: var(--Font_Bold);
    font-size: 1.3em;
    color: var(--MainColor_Light);
    padding: 10px
}

main section.teamblock {
    grid-column: 1/35;
    display: grid;
    grid-template-columns: var(--Column);
    z-index: 10
}

main section.teamblock.top {
    grid-row: 2/3
}

main section.teamblock>h4 {
    grid-column: 13/33;
    grid-row: 1/2;
    margin-top: 60px;
    margin-bottom: 20px;
    font-family: var(--Font_Bold);
    color: var(--AccentColor);
    text-transform: uppercase;
    font-size: 2.5em
}

main section.teamblock>p {
    grid-column: 13/29;
    grid-row: 2/2;
    margin-top: 30px;
    margin-bottom: 20px;
    font-family: var(--Font_Reg);
    color: var(--MainColor_Dark);
}

main section.teamblock>div {
    grid-column: 1/35;
    grid-row: 3/4;
    display: grid;
    grid-template-columns: var(--Column);
    grid-template-rows: max-content max-content
}

main section.teamblock>div figure {
    align-self: end;
    display: grid;
    margin-top: 50px;
    grid-template: 250px 1fr max-content/1fr
}

main section.teamblock .WayPoint {
    grid-row: 1/2;
    grid-column: 1/35;
    height: 1px;
    width: 1px;
    align-self: end
}

main section.teamblock .WayPoint:nth-child(11),
main section.teamblock .WayPoint:nth-child(13),
main section.teamblock .WayPoint:nth-child(15),
main section.teamblock .WayPoint:nth-child(9) {
    grid-row: 2/3
}

main section.teamblock .WayPoint:nth-child(17),
main section.teamblock .WayPoint:nth-child(19),
main section.teamblock .WayPoint:nth-child(21),
main section.teamblock .WayPoint:nth-child(23) {
    grid-row: 3/4
}

main section.teamblock .WayPoint:nth-child(25),
main section.teamblock .WayPoint:nth-child(27),
main section.teamblock .WayPoint:nth-child(29),
main section.teamblock .WayPoint:nth-child(31) {
    grid-row: 4/5
}

main section.teamblock .WayPoint:nth-child(33),
main section.teamblock .WayPoint:nth-child(35),
main section.teamblock .WayPoint:nth-child(37),
main section.teamblock .WayPoint:nth-child(39) {
    grid-row: 5/3
}

main section.teamblock>div figure:nth-child(2) {
    grid-column: 3/9;
    grid-row: 1/2
}

main section.teamblock>div figure:nth-child(4) {
    grid-column: 11/16;
    grid-row: 1/2
}

main section.teamblock>div figure:nth-child(6) {
    grid-column: 19/24;
    grid-row: 1/2
}

main section.teamblock>div figure:nth-child(8) {
    grid-column: 27/32;
    grid-row: 1/2
}

main section.teamblock>div figure:nth-child(10) {
    grid-column: 3/9;
    grid-row: 2/3
}

main section.teamblock>div figure:nth-child(12) {
    grid-column: 11/16;
    grid-row: 2/3
}

main section.teamblock>div figure:nth-child(14) {
    grid-column: 19/24;
    grid-row: 2/3
}

main section.teamblock>div figure:nth-child(16) {
    grid-column: 27/32;
    grid-row: 2/3
}

main section.teamblock>div figure:nth-child(18) {
    grid-column: 3/9;
    grid-row: 3/4
}

main section.teamblock>div figure:nth-child(20) {
    grid-column: 11/16;
    grid-row: 3/4
}

main section.teamblock>div figure:nth-child(22) {
    grid-column: 19/24;
    grid-row: 3/4
}

main section.teamblock>div figure:nth-child(24) {
    grid-column: 27/32;
    grid-row: 3/4
}

main section.teamblock>div figure:nth-child(26) {
    grid-column: 3/9;
    grid-row: 4/5
}

main section.teamblock>div figure:nth-child(28) {
    grid-column: 11/16;
    grid-row: 4/5
}

main section.teamblock>div figure:nth-child(30) {
    grid-column: 19/24;
    grid-row: 4/5
}

main section.teamblock>div figure:nth-child(32) {
    grid-column: 27/32;
    grid-row: 4/5
}

main section.teamblock>div figure:nth-child(34) {
    grid-column: 3/9;
    grid-row: 5/6
}

main section.teamblock>div figure:nth-child(36) {
    grid-column: 11/16;
    grid-row: 5/6
}

main section.teamblock>div figure:nth-child(38) {
    grid-column: 19/24;
    grid-row: 5/6
}

main section.teamblock>div figure:nth-child(40) {
    grid-column: 27/32;
    grid-row: 5/6
}

main section.teamblock>div figure img {
    height: 250px;
    width: auto;
    grid-row: 1/2;
    grid-column: 1/2;
    opacity: 0;
    transition: opacity .5s
}

main section.teamblock>div figure.show img {
    opacity: 1;
    transition: opacity .5s
}

main section.teamblock>div figure>p {
    transform: translate(0, 500%);
    transition: transform .5s
}

main section.teamblock>div figure.show>p {
    transform: translate(0, 0);
    transition: transform .5s
}

main section.teamblock>div figure>p:first-of-type {
    grid-row: 2/3;
    grid-column: 1/2;
    color: var(--MainColor_Dark);
    font-family: var(--Font_Big);
    text-transform: uppercase;
    font-size: 2em;
    line-height: 1em;
    margin-top: 20px
}

main section.teamblock>div figure>p:last-of-type {
    grid-row: 3/4;
    grid-column: 1/2;
    height: max-content
}

main section.teamblock>div figure.open>p:last-of-type {
    border-bottom: solid 1px rgba(252, 50, 50, 0);
    transition: border-bottom .5s
}

main section.teamblock>div figure>div {
    grid-row: 1/4;
    grid-column: 1/2;
    align-self: end;
    width: 100%;
    height: max-content;
    transform: translate(0, 100%);
    overflow: hidden
}

main section.teamblock>div figure>div article:first-of-type {
    background-color: var(--AccentColor);
    border-radius: 0 35px 0 0;
    transform: translate(0, -100%);
    transition: transform .5s
}

main section.teamblock>div figure.open>div article:first-of-type {
    transform: translate(0, 0);
    transition: transform .5s
}

main section.teamblock>div figure>div article:last-of-type {
    background-color: var(--MainColor_Dark);
    transform: translate(0, -250%);
    transition: transform .5s
}

main section.teamblock>div figure.open>div article:last-of-type {
    transform: translate(0, 0);
    transition: transform .5s
}

main section.teamblock>div figure>div article p {
    color: var(--MainColor_Light);
    font-family: var(--Font_Bold);
    line-height: 1em;
    padding: 20px 20px 20px 20px;
    width: 60%
}

main section.teamblock>button {
    display: none
}

main section.clients {
    grid-column: 1/35;
    display: grid;
    grid-template-columns: var(--Column);
    margin-top: 200px
}

main section.clients a {
    cursor: pointer;
    grid-row: 1/2;
    align-items: center;
    justify-self: center;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    opacity: .5;
    transition: opacity .5s
}

main section.clients a img {
    transform: translate(0, 100%);
    transition: transform .5s
}

main section.clients a.show img {
    transform: translate(0, 0);
    transition: transform .5s
}

main section.clients a:hover {
    opacity: 1;
    transition: opacity .5s
}

main section.clients .WayPoint {
    height: 1px;
    width: 100%;
    grid-row: 1/2;
    grid-column: 1/35;
    justify-self: center;
    align-self: center
}

main section.clients .WayPoint:nth-child(2) {
    align-self: end
}

main section.clients a:nth-child(3) {
    grid-column: 7/8
}

main section.clients a:nth-child(4) {
    grid-column: 11/12
}

main section.clients a:nth-child(5) {
    grid-column: 15/16
}

main section.clients a:nth-child(6) {
    grid-column: 19/20
}

main section.clients a:nth-child(7) {
    grid-column: 23/24
}

main section.clients a:nth-child(8) {
    grid-column: 27/28
}

main section.clients a img {
    width: 100%;
    object-fit: contain
}

main section.map {
    grid-column: 1/35;
    display: grid;
    width: 100%;
    height: auto;
    margin-top: 150px
}

main section.map .grad {
    grid-row: 1/2;
    grid-column: 1/2;
    height: 100%;
    width: 100%;
    background: #fff;
    background: -moz-linear-gradient(0deg, rgba(255, 255, 255, 0) 0, #fff 100%);
    background: -webkit-linear-gradient(0deg, rgba(255, 255, 255, 0) 0, #fff 100%);
    background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0, #fff 100%);
    z-index: 5;
    pointer-events: none
}

main section.map a {
    grid-row: 1/2;
    grid-column: 1/2;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: flex-end;
    z-index: 2
}

main section.map a img {
    width: 100%;
    object-fit: contain
}

main section.pageheader {
    grid-column: 1/35;
    grid-row: 1/2;
    display: grid;
    grid-template-columns: var(--Column);
    grid-template-rows: 60vh 240px max-content;
    min-height: 100vh
}

main section.pageheader.full {
    grid-column: 1/35;
    grid-row: 1/2;
    display: grid;
    grid-template-columns: var(--Column);
    grid-template-rows: 60vh 400px max-content;
    min-height: 100vh
}

main section.pageheader.small {
    grid-template-rows: 45vh 240px max-content
}

main section.pageheader .WayPoint {
    grid-row: 2/3;
    grid-column: 1/35;
    width: 100%;
    height: 1px;
    align-self: center;
    justify-self: center
}

main section.pageheader .background {
    grid-row: 1/3;
    grid-column: 1/35;
    background-color: var(--MainColor_Dark)
}

main section.pageheader.red .background {
    background-color: var(--AccentColor)
}

main section.pageheader .toptitle {
    grid-row: 1/2;
    grid-column: 3/16;
    display: flex;
    flex-flow: column;
    align-self: end;
    margin-bottom: 40px
}

main section.pageheader .toptitle span {
    overflow: hidden;
    height: max-content
}

main section.pageheader .toptitle span h2 {
    color: var(--MainColor_Light);
    font-family: var(--Font_Big);
    text-transform: uppercase;
    font-size: 2em;
    transform: translate(0, 200%);
    transition: transform .5s
}

main section.pageheader.show .toptitle span h2 {
    transform: translate(0, 0);
    transition: transform .5s
}

main section.pageheader.show .toptitle span:nth-child(1) h2 {
    transition-delay: .2s
}

main section.pageheader.show .toptitle span:nth-child(2) h2 {
    transition-delay: .3s
}

main section.pageheader.show .toptitle span:nth-child(3) h2 {
    transition-delay: .4s
}

main section.pageheader ul {
    grid-row: 2/3;
    grid-column: 27/32;
    display: flex;
    flex-flow: column;
    align-self: center;
    z-index: 5
}

main section.pageheader .sidetekst {
    grid-row: 2/3;
    grid-column: 27/32;
    display: flex;
    flex-flow: column;
    align-self: center;
    z-index: 5
}

main section.pageheader .sidetekst strong {
    font-family: var(--Font_Bold)
}

main section.pageheader .sidetekst h4 {
    font-family: var(--Font_Big);
    color: var(--MainColor_Light);
    text-transform: uppercase
}

main section.pageheader .sidetekst p {
    font-family: var(--Font_Reg);
    color: var(--MainColor_Light)
}

main section.pageheader ul.project_info {
    gap: 20px 0
}

main section.pageheader li {
    border-bottom: solid 1px var(--MainColor_Light);
    transition: color .5s;
    cursor: pointer;
    overflow: hidden;
    width: 0;
    transition: width 1s
}

main section.pageheader .project_info li {
    width: 100%
}

main section.pageheader ul.project_info li {
    border-bottom: none;
    cursor: default
}

main section.pageheader.show li {
    width: 100%;
    transition: width 1s
}

main section.pageheader.show li:nth-child(1) {
    transition-delay: .2s
}

main section.pageheader.show li:nth-child(2) {
    transition-delay: .3s
}

main section.pageheader.show li:nth-child(3) {
    transition-delay: .4s
}

main section.pageheader li p {
    color: var(--MainColor_Light);
    font-family: var(--Font_Bold);
    font-size: 1.2em;
    transition: color .5s;
    white-space: nowrap
}

main section.pageheader li p strong {
    color: var(--AccentColor)
}

main section.pageheader li.active,
main section.pageheader li:hover {
    border-bottom: solid 1px var(--AccentColor);
    transition: color .5s
}

main section.pageheader li.active p,
main section.pageheader li:hover p {
    color: var(--AccentColor);
    transition: color .5s
}

main section.pageheader .project_info li:hover {
    border-bottom: none
}

main section.pageheader .project_info li:hover p {
    color: var(--MainColor_Light)
}

main section.pageheader li p {
    white-space: normal;
    line-height: 1.3em
}

main section.pageheader .topproject {
    display: grid;
    grid-row: 2/4;
    grid-column: 1/35;
    grid-template-rows: 600px max-content max-content;
    grid-template-columns: var(--Column)
}

main section.pageheader .topproject .hider {
    width: 100%;
    height: 100%;
    grid-row: 1/2;
    grid-column: 1/23;
    background-color: var(--MainColor_Dark);
    z-index: 5;
    transition: height 1s, transform 0s linear 0s !important
}

main section.pageheader.show .topproject .hider {
    height: 0%;
    transition: height 1s
}

main section.pageheader .topproject figure {
    grid-row: 1/2;
    grid-column: 1/23;
    height: 100%;
    width: 100%;
    z-index: 3
}

main section.pageheader .topproject figure img {
    height: 100%;
    width: 100%;
    object-fit: cover
}

main section.pageheader .topproject figcaption {
    grid-row: 1/2;
    grid-column: 3/8;
    display: flex;
    align-self: end;
    align-items: center;
    justify-content: center;
    width: max-content;
    margin-bottom: 10px;
    z-index: 4
}

main section.pageheader .topproject figcaption img {
    height: 20px;
    margin-right: 5px
}

main section.pageheader .topproject figcaption p {
    font-family: var(--Font_Bold);
    color: var(--MainColor_Light)
}

main section.pageheader .topproject h4 {
    grid-row: 2/3;
    grid-column: 2/23;
    font-size: 2em;
    line-height: 1.2em;
    color: var(--MainColor_Dark);
    font-family: var(--Font_Big);
    text-transform: uppercase;
    padding-top: 20px
}

main section.pageheader .topproject .button {
    grid-row: 3/4;
    grid-column: 2/7
}

main section.pageheader .sideart {
    grid-row: 3/4;
    grid-column: 27/32;
    margin-bottom: 125px;
    display: flex;
    flex-flow: column;
    align-self: end
}

main section.pageheader .sideart h3 {
    font-family: var(--Font_Bold);
    color: var(--MainColor_Dark);
    text-transform: uppercase;
    font-size: 2em;
    line-height: 1.2em
}

main section.pageheader .sideart p {
    font-family: var(--Font_Reg);
    color: var(--MainColor_Dark);
    line-height: 1.2em;
    margin-top: 10px;
    margin-bottom: 10px;
    width: 80%
}

main section.pageheader .sideart.banner {
    grid-row: 3/4;
    grid-column: 1/35;
    display: grid;
    grid-template-columns: var(--Column);
    z-index: 10
}

main section.pageheader .sideart.banner .background {
    grid-row: 1/2;
    grid-column: 19/35;
    background-color: var(--AccentColor);
    height: 100%;
    width: 100%
}

main section.pageheader .sideart.banner img {
    grid-row: 1/2;
    grid-column: 19/20;
    margin-top: 20px
}

main section.pageheader .sideart.banner p {
    grid-row: 1/2;
    grid-column: 23/32;
    color: var(--MainColor_Light);
    align-self: center
}

main section.projects_wrapper {
    grid-column: 1/35;
    grid-row: 2/3;
    width: 100%;
    display: grid;
    grid-template-columns: var(--Column);
    margin-top: 50px;
    gap: 50px 0
}

main section.projects_wrapper>div {
    display: none;
    grid-template: 600px max-content max-content/1fr
}

main section.projects_wrapper>div.hide {
    display: none
}

main section.projects_wrapper>div .WayPoint {
    grid-row: 1/4;
    grid-column: 1/2;
    width: 100%;
    height: 1px;
    align-self: center;
    justify-self: center
}

main section.projects_wrapper>div .hider {
    width: 100%;
    height: 100%;
    grid-row: 1/2;
    grid-column: 1/2;
    background-color: var(--MainColor_Dark);
    z-index: 5;
    transition: height 1s, transform 0s linear 0s !important
}

main section.projects_wrapper>div.show .hider {
    height: 0%;
    transition: height 1s
}

main section.projects_wrapper>div figure {
    grid-row: 1/2;
    grid-column: 1/2
}

main section.projects_wrapper>div figure img {
    width: 100%;
    height: 600px;
    object-fit: cover
}

main section.projects_wrapper>div figcaption {
    grid-row: 1/2;
    grid-column: 1/2;
    display: flex;
    align-self: end;
    align-items: center;
    justify-content: center;
    width: max-content;
    margin-left: 10px;
    margin-bottom: 10px;
    z-index: 4
}

main section.projects_wrapper>div figcaption img {
    height: 20px;
    margin-right: 5px
}

main section.projects_wrapper>div figcaption p {
    font-family: var(--Font_Bold);
    color: var(--MainColor_Light);
    white-space: nowrap
}

main section.projects_wrapper>div h4 {
    grid-row: 2/3;
    grid-column: 1/2;
    font-size: 2em;
    line-height: 1.2em;
    color: var(--MainColor_Dark);
    font-family: var(--Font_Big);
    text-transform: uppercase;
    padding-top: 20px
}

main section.projects_wrapper>div .button {
    grid-row: 3/4;
    grid-column: 1/2
}

main section.projects_wrapper>div.left {
    display: grid;
    grid-column: 3/16
}

main section.projects_wrapper>div.right {
    display: grid;
    grid-column: 19/32
}

main section.projects_wrapper>div.auto:nth-child(odd) {
    display: grid;
    grid-column: 3/16
}

main section.projects_wrapper>div.auto:nth-child(even) {
    display: grid;
    grid-column: 19/32
}

main section.pageheader_2 {
    grid-column: 1/35;
    grid-row: 1/2;
    display: grid;
    grid-template-columns: var(--Column);
    grid-template-rows: 50vh 7vh
}

main section.pageheader_2 .WayPoint {
    grid-row: 1/2;
    grid-column: 1/35;
    width: 100%;
    height: 1px;
    align-self: center;
    justify-self: center
}

main section.pageheader_2 .background {
    grid-row: 1/3;
    grid-column: 1/35;
    background-color: var(--AccentColor)
}

main section.pageheader_2 .toptitle {
    grid-row: 1/2;
    grid-column: 3/12;
    display: flex;
    flex-flow: column;
    align-self: end
}

main section.pageheader_2 .toptitle span {
    overflow: hidden;
    height: max-content
}

main section.pageheader_2 .toptitle span h2 {
    color: var(--MainColor_Light);
    font-family: var(--Font_Big);
    text-transform: uppercase;
    font-size: 2em;
    transform: translate(0, 200%);
    transition: transform .5s
}

main section.pageheader_2.show .toptitle span h2 {
    transform: translate(0, 0);
    transition: transform .5s
}

main section.pageheader_2.show .toptitle span:nth-child(1) h2 {
    transition-delay: .2s
}

main section.pageheader_2.show .toptitle span:nth-child(2) h2 {
    transition-delay: .3s
}

main section.pageheader_2.show .toptitle span:nth-child(3) h2 {
    transition-delay: .4s
}

main section.pageheader_2 .tekst {
    grid-row: 1/2;
    grid-column: 15/20;
    display: flex;
    flex-flow: column;
    align-self: end
}

main section.pageheader_2 .tekst p {
    color: var(--MainColor_Light);
    font-family: var(--Font_Reg);
    line-height: 1.2em
}

main section.pageheader_2.bigger {
    grid-template-rows: 50vh 150px
}

main section.tekstslider_1 {
    margin-top: 70px;
    margin-bottom: 100px;
    grid-column: 1/35;
    grid-row: 2/3;
    display: grid;
    grid-template-columns: var(--Column);
    grid-template-rows: 40px 400px 200px 300px
}

main section.tekstslider_1 .WayPoint {
    grid-row: 1/5;
    grid-column: 1/35;
    width: 100%;
    height: 1px;
    z-index: 20;
    align-self: center;
    justify-self: center
}

main section.tekstslider_1 .tekst {
    grid-row: 1/3;
    grid-column: 1/35;
    display: grid;
    grid-template-columns: var(--Column);
    grid-template-rows: max-content 1fr;
    z-index: 5;
    pointer-events: none;
    overflow: hidden
}

main section.tekstslider_1 .tekst .background {
    grid-column: 1/19;
    grid-row: 1/3;
    background-color: var(--MainColor_Dark);
    width: 0;
    transition: width .5s
}

main section.tekstslider_1.show .tekst .background {
    width: 100%;
    transition: width .5s
}

main section.tekstslider_1 .tekst img {
    grid-row: 1/3;
    grid-column: 1/4;
    align-self: end;
    margin-top: 50px;
    width: 100%
}

main section.tekstslider_1 .tekst h3 {
    grid-row: 1/2;
    grid-column: 7/16;
    color: var(--MainColor_Light);
    font-family: var(--Font_Big);
    font-size: 2.5em;
    text-transform: uppercase;
    margin-top: 50px;
    margin-bottom: 20px;
    pointer-events: auto;
    transform: translate(0, 500%);
    transition: transform .5s
}

main section.tekstslider_1.show .tekst h3 {
    transform: translate(0, 0);
    transition: transform .5s
}

main section.tekstslider_1 .tekst p {
    grid-row: 2/3;
    grid-column: 7/16;
    color: var(--MainColor_Light);
    font-family: var(--Font_Reg);
    line-height: 1.5em;
    font-size: 1.2em;
    pointer-events: auto;
    margin-bottom: 30px;
    transform: translate(0, 500%);
    transition: transform 1s
}

main section.tekstslider_1.show .tekst p {
    transform: translate(0, 0);
    transition: transform 1s
}

main section.tekstslider_1 .slider {
    grid-row: 2/4;
    grid-column: 1/35;
    display: grid;
    grid-template-columns: var(--Column);
    grid-template-rows: max-content 1fr;
    z-index: 4;
    overflow: hidden
}

main section.tekstslider_1 .slider .background {
    grid-column: 15/35;
    grid-row: 1/3;
    background-color: var(--AccentColor);
    justify-self: end;
    width: 0;
    transition: width .5s
}

main section.tekstslider_1.show .slider .background {
    width: 100%;
    transition: width .5s
}

main section.tekstslider_1 .slider .slidetabs {
    grid-row: 1/2;
    grid-column: 1/35;
    display: grid;
    grid-template-columns: var(--Column);
    flex-flow: row;
    overflow: hidden
}

main section.tekstslider_1 .slider .slidetabs>span {
    grid-row: 1/2;
    display: flex;
    flex-flow: column;
    align-items: flex-start;
    justify-content: center;
    margin-top: 50px;
    margin-bottom: 40px;
    transform: translate(0, 500%);
    transition: transform 1s
}

main section.tekstslider_1.show .slider .slidetabs>span {
    transform: translate(0, 0);
    transition: transform 1s
}

main section.tekstslider_1 .slider .slidetabs>span:nth-child(1) {
    grid-column: 20/24
}

main section.tekstslider_1 .slider .slidetabs>span:nth-child(2) {
    grid-column: 27/28
}

main section.tekstslider_1 .slider .slidetabs>span:nth-child(3) {
    grid-column: 31/32
}

main section.tekstslider_1 .slider .slidetabs>span p {
    font-family: var(--Font_Bold);
    color: var(--MainColor_Dark);
    font-size: 1.2em;
    transition: color .5s;
    white-space: nowrap
}

main section.tekstslider_1 .slider .slidetabs>span span {
    width: 100%;
    height: 2px;
    background-color: var(--MainColor_Dark);
    transition: background-color .5s
}

main section.tekstslider_1 .slider .slidetabs>span.active p {
    color: var(--MainColor_Light);
    transition: color .5s
}

main section.tekstslider_1 .slider .slidetabs>span.active span {
    background-color: var(--MainColor_Light);
    transition: background-color .5s
}

main section.tekstslider_1 .slider article.slide {
    grid-row: 2/3;
    grid-column: 20/32;
    display: flex;
    flex-flow: column;
    gap: 20px
}

main section.tekstslider_1 .slider article.slide h4 {
    font-family: var(--Font_Big);
    color: var(--MainColor_Light);
    font-size: 2em;
    text-transform: uppercase;
    transform: translate(0, 2000%);
    transition: transform .5s
}

main section.tekstslider_1 .slider article.slide p {
    font-family: var(--Font_Reg);
    color: var(--MainColor_Light);
    font-size: 1.2em;
    line-height: 1.2em;
    transform: translate(0, 2000%);
    transition: transform .5s
}

main section.tekstslider_1 .slider article.slide.active h4 {
    transform: translate(0, 0);
    transition: transform .5s
}

main section.tekstslider_1 .slider article.slide.active p {
    transform: translate(0, 0);
    transition: transform .5s
}

main section.tekstslider_1 .slider .slide_controlls {
    grid-row: 2/3;
    grid-column: 15/19;
    display: flex;
    height: max-content;
    width: max-content;
    align-self: end;
    justify-self: end;
    margin-bottom: 40px;
    gap: 20px
}

main section.tekstslider_1 .slider .slide_controlls button {
    border: solid 1px var(--MainColor_Light);
    height: 50px;
    width: 50px;
    border-radius: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: transparent;
    cursor: pointer;
    opacity: .5;
    transition: opacity .5s
}

main section.tekstslider_1 .slider .slide_controlls button:hover {
    opacity: 1;
    transition: opacity .5s
}

main section.tekstslider_1 .slider .slide_controlls button img {
    height: 20px;
    width: 20px
}

main section.tekstslider_1 .slider .slide_controlls button.left img {
    margin-right: 4px
}

main section.tekstslider_1 .slider .slide_controlls button.right img {
    margin-left: 4px
}

main section.tekstslider_1>figure {
    grid-row: 3/5;
    grid-column: 1/16;
    z-index: 3
}

main section.tekstslider_1>figure img {
    object-fit: cover;
    width: 100%;
    height: 500px
}

main section.tussentekst {
    grid-column: 1/35;
    display: grid;
    grid-template-columns: var(--Column);
    grid-template-rows: max-content max-content
}

main section.tussentekst h4 {
    grid-row: 1/2;
    grid-column: 11/20;
    font-family: var(--Font_Big);
    text-transform: uppercase;
    color: var(--AccentColor);
    font-size: 2em
}

main section.tussentekst p {
    grid-row: 2/3;
    grid-column: 12/24;
    font-family: var(--Font_Reg);
    color: var(--MainColor_Dark);
    margin-top: 15px;
    line-height: 1.5em
}

main section.link_blocks {
    grid-column: 1/35;
    grid-row: 4/5;
    display: grid;
    grid-template-columns: var(--Column);
    grid-template-rows: 40px 1fr 1fr 70px;
    margin-top: 100px
}

main section.link_blocks .WayPoint {
    grid-row: 1/4;
    grid-column: 1/35;
    align-self: center;
    justify-self: center;
    width: 100%;
    height: 1px
}

main section.link_blocks>div {
    grid-row: 1/3;
    grid-column: 1/35;
    display: grid;
    grid-template-columns: var(--Column);
    grid-template-rows: max-content max-content
}

main section.link_blocks .left .background {
    grid-column: 1/19;
    grid-row: 1/3;
    background-color: var(--MainColor_Dark);
    width: 0;
    transition: width .5s
}

main section.link_blocks.show .left .background {
    width: 100%;
    transition: width .5s
}

main section.link_blocks .left {
    z-index: 4
}

main section.link_blocks .right {
    grid-row: 2/4;
    z-index: 2
}

main section.link_blocks .right .background {
    grid-column: 15/35;
    grid-row: 1/3;
    background-color: var(--AccentColor);
    justify-self: end;
    width: 0;
    transition: width .5s
}

main section.link_blocks.show .right .background {
    width: 100%;
    transition: width .5s
}

main section.link_blocks div h4 {
    font-family: var(--Font_Big);
    color: var(--MainColor_Light);
    font-size: 2em;
    line-height: 1.2em;
    margin-top: 40px
}

main section.link_blocks div a {
    grid-row: 2/3;
    font-family: var(--Font_Bold);
    color: var(--AccentColor);
    line-height: 1em;
    margin-top: 20px;
    margin-bottom: 40px;
    display: flex;
    flex-flow: column;
    text-decoration: none;
    opacity: 0;
    transition: opacity .5s
}

main section.link_blocks.show div a {
    opacity: 1;
    transition: opacity .5s
}

main section.link_blocks.show div a:hover {
    opacity: .5;
    transition: opacity .5s
}

main section.link_blocks div a span {
    width: 100%;
    height: 2px;
    background-color: var(--AccentColor)
}

main section.link_blocks .left a {
    grid-column: 7/12
}

main section.link_blocks .right a {
    color: var(--MainColor_Dark);
    grid-column: 20/28
}

main section.link_blocks .right a span {
    background-color: var(--MainColor_Dark)
}

main section.link_blocks .left h4 {
    grid-row: 1/2;
    grid-column: 7/16
}

main section.link_blocks .right h4 {
    grid-row: 1/2;
    grid-column: 20/32
}

main section.tekstslider_2 {
    margin-top: 70px;
    margin-bottom: 100px;
    grid-column: 1/35;
    grid-row: 5/6;
    display: grid;
    grid-template-columns: var(--Column);
    grid-template-rows: 360px 40px 1fr 1fr
}

main section.tekstslider_2 .WayPoint {
    grid-row: 1/5;
    grid-column: 1/35;
    width: 100%;
    height: 1px;
    align-self: center;
    justify-self: center
}

main section.tekstslider_2 .tekst {
    grid-row: 2/4;
    grid-column: 1/35;
    display: grid;
    grid-template-columns: var(--Column);
    grid-template-rows: max-content 1fr;
    z-index: 5;
    pointer-events: none
}

main section.tekstslider_2 .tekst .background {
    grid-column: 19/35;
    grid-row: 1/3;
    background-color: var(--MainColor_Dark)
}

main section.tekstslider_2 .tekst img {
    grid-row: 1/3;
    grid-column: 19/20;
    align-self: end;
    margin-top: 50px;
    width: 100%
}

main section.tekstslider_2 .tekst h3 {
    grid-row: 1/2;
    grid-column: 23/32;
    color: var(--MainColor_Light);
    font-family: var(--Font_Big);
    font-size: 2.5em;
    text-transform: uppercase;
    margin-top: 50px;
    margin-bottom: 20px;
    pointer-events: auto
}

main section.tekstslider_2 .tekst p {
    grid-row: 2/3;
    grid-column: 23/32;
    color: var(--MainColor_Light);
    font-family: var(--Font_Reg);
    line-height: 1.5em;
    font-size: 1.2em;
    pointer-events: auto;
    margin-bottom: 30px
}

main section.tekstslider_2 .slider {
    grid-row: 3/5;
    grid-column: 1/35;
    display: grid;
    grid-template-columns: var(--Column);
    grid-template-rows: 1fr max-content;
    z-index: 4;
    overflow: hidden
}

main section.tekstslider_2 .slider .background {
    grid-column: 1/24;
    grid-row: 1/3;
    background-color: #f4f4f4
}

main section.tekstslider_2 .slider .slidetabs {
    grid-row: 1/2;
    grid-column: 3/8;
    display: flex;
    flex-flow: column;
    gap: 10px;
    margin-top: 50px
}

main section.tekstslider_2 .slider .slidetabs>span {
    grid-row: 1/2;
    display: flex;
    flex-flow: column;
    align-items: flex-start;
    justify-content: center
}

main section.tekstslider_2 .slider .slidetabs>span p {
    font-family: var(--Font_Bold);
    color: var(--MainColor_Dark);
    font-size: 1.2em;
    transition: color .5s
}

main section.tekstslider_2 .slider .slidetabs>span span {
    width: 100%;
    height: 2px;
    background-color: var(--MainColor_Dark);
    transition: background-color .5s
}

main section.tekstslider_2 .slider .slidetabs>span.active p {
    color: var(--AccentColor);
    transition: color .5s
}

main section.tekstslider_2 .slider .slidetabs>span.active span {
    background-color: var(--AccentColor);
    transition: background-color .5s
}

main section.tekstslider_2 .slider article.slide {
    grid-row: 1/2;
    grid-column: 11/16;
    display: flex;
    flex-flow: column;
    gap: 20px;
    margin-top: 50px
}

main section.tekstslider_2 .slider article.slide h4 {
    font-family: var(--Font_Big);
    color: var(--AccentColor);
    font-size: 2em;
    text-transform: uppercase;
    transform: translate(0, 2000%);
    transition: transform .5s
}

main section.tekstslider_2 .slider article.slide p {
    font-family: var(--Font_Reg);
    color: var(--MainColor_Dark);
    font-size: 1.2em;
    line-height: 1.2em;
    transform: translate(0, 2000%);
    transition: transform .5s
}

main section.tekstslider_2 .slider article.slide.active h4 {
    transform: translate(0, 0);
    transition: transform .5s
}

main section.tekstslider_2 .slider article.slide.active p {
    transform: translate(0, 0);
    transition: transform .5s
}

main section.tekstslider_2 .slider .slide_controlls {
    grid-row: 2/3;
    grid-column: 15/16;
    display: flex;
    height: max-content;
    width: max-content;
    align-self: end;
    justify-self: end;
    margin-bottom: 40px;
    gap: 20px
}

main section.tekstslider_2 .slider .slide_controlls button {
    border: solid 1px var(--MainColor_Dark);
    height: 50px;
    width: 50px;
    border-radius: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: transparent;
    cursor: pointer;
    opacity: .5;
    transition: opacity .5s
}

main section.tekstslider_2 .slider .slide_controlls button:hover {
    opacity: 1;
    transition: opacity .5s
}

main section.tekstslider_2 .slider .slide_controlls button img {
    height: 20px;
    width: 20px
}

main section.tekstslider_2 .slider .slide_controlls button.left img {
    margin-right: 4px
}

main section.tekstslider_2 .slider .slide_controlls button.right img {
    margin-left: 4px
}

main section.tekstslider_2>figure {
    grid-row: 1/3;
    grid-column: 1/35;
    z-index: 3
}

main section.tekstslider_2>figure img {
    object-fit: cover;
    width: 100%;
    height: 500px
}

main section.tekstslider_3 {
    margin-top: 70px;
    margin-bottom: 0;
    grid-column: 1/35;
    grid-row: 6/7;
    height: max-content;
    display: grid;
    grid-template-columns: var(--Column);
    grid-template-rows: 360px 40px 1fr 1fr;
    overflow: hidden
}

main section.tekstslider_3 .WayPoint {
    grid-row: 1/5;
    grid-column: 1/35;
    width: 100%;
    height: 1px;
    align-self: center;
    justify-self: center
}

main section.tekstslider_3 .tekst {
    grid-row: 2/4;
    grid-column: 1/35;
    display: grid;
    grid-template-columns: var(--Column);
    grid-template-rows: max-content 1fr;
    z-index: 5;
    pointer-events: none
}

main section.tekstslider_3 .tekst .background {
    grid-column: 1/18;
    grid-row: 1/3;
    background-color: var(--AccentColor)
}

main section.tekstslider_3 .tekst img {
    grid-row: 1/3;
    grid-column: 1/4;
    align-self: end;
    margin-top: 50px;
    width: 100%
}

main section.tekstslider_3 .tekst h3 {
    grid-row: 1/2;
    grid-column: 7/16;
    color: var(--MainColor_Light);
    font-family: var(--Font_Big);
    font-size: 2.5em;
    text-transform: uppercase;
    margin-top: 50px;
    margin-bottom: 20px;
    pointer-events: auto
}

main section.tekstslider_3 .tekst p {
    grid-row: 2/3;
    grid-column: 7/16;
    color: var(--MainColor_Light);
    font-family: var(--Font_Reg);
    line-height: 1.5em;
    font-size: 1.2em;
    pointer-events: auto;
    margin-bottom: 50px
}

main section.tekstslider_3 .slider {
    grid-row: 3/5;
    grid-column: 1/35;
    display: grid;
    height: max-content;
    grid-template-columns: var(--Column);
    grid-template-rows: max-content max-content max-content;
    z-index: 4;
    overflow: hidden
}

main section.tekstslider_3 .slider .background {
    grid-column: 15/35;
    grid-row: 1/4;
    background-color: #f4f4f4
}

main section.tekstslider_3 .slider .slidetabs {
    grid-row: 1/2;
    grid-column: 1/35;
    display: grid;
    grid-template-columns: var(--Column);
    flex-flow: row;
    overflow: hidden
}

main section.tekstslider_3 .slider .slidetabs>span {
    grid-row: 1/2;
    display: flex;
    flex-flow: column;
    align-items: flex-start;
    justify-content: center;
    margin-top: 50px;
    margin-bottom: 40px;
    transform: translate(0, 500%);
    transition: transform 1s
}

main section.tekstslider_3.show .slider .slidetabs>span {
    transform: translate(0, 0);
    transition: transform 1s
}

main section.tekstslider_3 .slider .slidetabs>span:nth-child(1) {
    grid-column: 20/24
}

main section.tekstslider_3 .slider .slidetabs>span:nth-child(2) {
    grid-column: 27/28
}

main section.tekstslider_3 .slider .slidetabs>span:nth-child(3) {
    grid-column: 31/32
}

main section.tekstslider_3 .slider .slidetabs>span p {
    font-family: var(--Font_Bold);
    color: var(--MainColor_Dark);
    font-size: 1.2em;
    transition: color .5s;
    white-space: nowrap
}

main section.tekstslider_3 .slider .slidetabs>span span {
    width: 100%;
    height: 2px;
    background-color: var(--MainColor_Dark);
    transition: background-color .5s
}

main section.tekstslider_3 .slider .slidetabs>span.active p {
    color: var(--AccentColor);
    transition: color .5s
}

main section.tekstslider_3 .slider .slidetabs>span.active span {
    background-color: var(--AccentColor);
    transition: background-color .5s
}

main section.tekstslider_3 .slider article.slide {
    grid-row: 2/3;
    grid-column: 20/32;
    display: flex;
    flex-flow: column;
    gap: 20px;
    margin-top: 50px
}

main section.tekstslider_3 .slider article.slide h4 {
    font-family: var(--Font_Big);
    color: var(--AccentColor);
    font-size: 2em;
    text-transform: uppercase;
    transform: translate(0, 2000%);
    transition: transform .5s
}

main section.tekstslider_3 .slider article.slide>p {
    font-family: var(--Font_Reg);
    color: var(--MainColor_Dark);
    font-size: 1.2em;
    line-height: 1.2em;
    transform: translate(0, 2000%);
    transition: transform .5s
}

main section.tekstslider_3 .slider article.slide ul {
    font-family: var(--Font_Reg);
    color: var(--MainColor_Dark);
    font-size: 1.2em;
    line-height: 1.2em;
    list-style-image: url(../assets/icon/icon-a.svg);
    transform: translate(0, 2000%);
    transition: transform .5s;
    margin-left: 20px
}

main section.tekstslider_3 .slider article.slide.active h4 {
    transform: translate(0, 0);
    transition: transform .5s
}

main section.tekstslider_3 .slider article.slide.active>p {
    transform: translate(0, 0);
    transition: transform .5s
}

main section.tekstslider_3 .slider article.slide.active ul {
    transform: translate(0, 0);
    transition: transform .5s
}

main section.tekstslider_3 .slider .slide_controlls {
    grid-row: 3/4;
    grid-column: 15/19;
    display: flex;
    height: max-content;
    width: max-content;
    align-self: end;
    justify-self: end;
    margin-bottom: 40px;
    gap: 20px
}

main section.tekstslider_3 .slider .slide_controlls button {
    border: solid 1px var(--MainColor_Dark);
    height: 50px;
    width: 50px;
    border-radius: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: transparent;
    cursor: pointer;
    opacity: .5;
    transition: opacity .5s
}

main section.tekstslider_3 .slider .slide_controlls button:hover {
    opacity: 1;
    transition: opacity .5s
}

main section.tekstslider_3 .slider .slide_controlls button img {
    height: 20px;
    width: 20px
}

main section.tekstslider_3 .slider .slide_controlls button.left img {
    margin-right: 4px
}

main section.tekstslider_3 .slider .slide_controlls button.right img {
    margin-left: 4px
}

main section.tekstslider_3>figure {
    grid-row: 1/3;
    grid-column: 1/35;
    z-index: 3
}

main section.tekstslider_3>figure img {
    object-fit: cover;
    width: 100%;
    height: 500px
}

main section.quoteblock {
    grid-column: 1/35;
    height: max-content;
    display: grid;
    grid-template-columns: var(--Column);
    grid-template-rows: 50px 1fr 50px .5fr 50px;
    margin-top: 150px
}

main section.quoteblock>article {
    grid-column: 1/35;
    display: grid;
    grid-template-columns: var(--Column);
    width: 100%;
    height: 100%;
    pointer-events: none
}

main section.quoteblock>article.block1 {
    grid-row: 2/5
}

main section.quoteblock>article.block2 {
    grid-row: 1/3
}

main section.quoteblock>article.block3 {
    grid-row: 4/6
}

main section.quoteblock>article.block1 div.background {
    background-color: #f4f4f4;
    grid-column: 3/15;
    grid-row: 1/2;
    height: 100%;
    width: 100%
}

main section.quoteblock>article.block1 img {
    grid-column: 3/7;
    grid-row: 1/2;
    margin-left: 30px
}

main section.quoteblock>article.block1 div.tekst {
    grid-column: 7/12;
    grid-row: 1/2
}

main section.quoteblock>article.block2 div.background {
    background-color: #f4f4f4;
    grid-column: 16/31;
    grid-row: 1/2
}

main section.quoteblock>article.block2 img {
    grid-column: 19/20;
    grid-row: 1/2
}

main section.quoteblock>article.block2 div.tekst {
    grid-column: 20/28;
    grid-row: 1/2
}

main section.quoteblock>article.block3 div.background {
    background-color: #f4f4f4;
    grid-column: 16/31;
    grid-row: 1/2
}

main section.quoteblock>article.block3 img {
    grid-column: 19/20;
    grid-row: 1/2
}

main section.quoteblock>article.block3 div.tekst {
    grid-column: 20/28;
    grid-row: 1/2
}

main section.quoteblock>article img {
    margin-top: 30px;
    pointer-events: auto;
    height: 50px
}

main section.quoteblock>article div.tekst {
    display: flex;
    flex-flow: column;
    margin: 30px 0;
    height: calc(100% - 60px);
    pointer-events: auto
}

main section.quoteblock>article div.tekst p {
    font-family: var(--Font_Reg);
    color: var(--MainColor_Dark);
    font-size: 1em;
    line-height: 1.3em;
    margin-bottom: 10px
}

main section.quoteblock>article div.tekst p:nth-last-child(1) {
    font-family: var(--Font_Bold);
    margin: 0;
    justify-self: flex-end
}

main section.quoteblock>article div.tekst p:nth-last-child(2) {
    font-family: var(--Font_Bold);
    color: var(--AccentColor);
    margin: 0;
    margin-top: auto;
    justify-self: flex-end
}

main section.quoteblock>article div.tekst p:nth-last-child(3) {
    margin-bottom: 30px
}

main section.projectinfo {
    grid-column: 1/35;
    display: grid;
    grid-template-columns: var(--Column);
    gap: 50px 0
}

main section.projectinfo figure {
    height: 500px
}

main section.projectinfo figure img {
    object-fit: cover;
    height: 100%;
    width: 100%
}

main section.projectinfo article {
    display: grid;
    grid-template: 60px max-content/1fr
}

main section.projectinfo article h3 {
    grid-row: 1/2;
    font-family: var(--Font_Big);
    color: var(--AccentColor);
    font-size: 2em;
    text-transform: uppercase
}

main section.projectinfo article p {
    grid-row: 2/3;
    font-family: var(--Font_Reg);
    color: var(--MainColor_Dark);
    font-size: 1em
}

main section.projectinfo figure:nth-child(odd) {
    grid-column: 3/16
}

main section.projectinfo figure:nth-child(even) {
    grid-column: 19/32
}

main section.projectinfo article:nth-child(odd) {
    grid-column: 3/16
}

main section.projectinfo article:nth-child(even) {
    grid-column: 19/32
}

main section.projectbutton {
    grid-column: 1/35;
    display: grid;
    grid-template-columns: var(--Column);
    margin-top: 50px
}

main section.projectbutton .button {
    grid-column: 15/16
}

main section.is_block_fade {
    grid-column: 1/35;
    display: grid;
    grid-template-columns: var(--Column);
    margin-top: 89px;
    padding: 50px 0 100px 0;
    box-sizing: border-box;
    background-color: var(--MainColor_Dark)
}

main section.is_block_fade>figure {
    grid-row: 1/3;
    grid-column: 1/8;
}

main section.is_block_fade>figure img {
    height: 100%;
    width: 100%;
    object-fit: contain;
    object-position: bottom;
}

main section.is_block_fade>article {
    grid-row: 1/2;
    grid-column: 1/35;
    display: grid;
    grid-template-columns: var(--Column);
    grid-template-rows: max-content max-content max-content
}

main section.is_block_fade>article p.smoll {
    grid-column: 12/29;
    grid-row: 1/2;
    color: var(--AccentColor);
    font-family: var(--Font_Bold);
    margin-bottom: 20px
}

main section.is_block_fade>article h3 {
    grid-column: 12/29;
    grid-row: 2/3;
    color: var(--MainColor_Light);
    font-family: var(--Font_Big);
    font-size: 3em;
    line-height: 1em;
    margin-bottom: 40px
}

main section.is_block_fade>article p {
    grid-column: 12/31;
    grid-row: 3/4;
    color: var(--MainColor_Light);
    font-family: var(--Font_Reg);
    font-size: 1.1em;
    line-height: 1.2em
}

main section.is_block_fade>article p:nth-child(4) {
    margin-top: 17px;
    grid-row: 4/5;
}

main section.is_block_fade>article p:nth-child(5) {
    margin-top: 17px;
    grid-row: 5/6;
}

main section.is_block_fade>article .comp_holder {
    grid-column: 1/35;
    grid-row: 6/7;
    display: grid;
    grid-template-columns: var(--Column)
}

main section.is_block_fade>article .comp_holder>div {
    grid-row: 1/2;
    margin-top: 40px;
    display: flex;
    flex-flow: column
}

main section.is_block_fade>article .comp_holder>div:nth-child(1) {
    grid-column: 12/16
}

main section.is_block_fade>article .comp_holder>div:nth-child(2) {
    grid-column: 19/24
}

main section.is_block_fade>article .comp_holder>div:nth-child(3) {
    grid-column: 26/31
}

main section.is_block_fade>article .comp_holder>div figure {
    height: 100px
}

main section.is_block_fade>article .comp_holder>div figure img {
    height: 100px;
    object-fit: contain
}

main section.is_block_fade>article .comp_holder>div>div {
    display: grid;
    height: auto;
    overflow: hidden
}

main section.is_block_fade>article .comp_holder>div>div p {
    grid-row: 1/2;
    grid-column: 1/2;
    z-index: 1
}

main section.is_block_fade>article .comp_holder>div a {
    width: 100%;
    border-bottom: solid 1px var(--AccentColor);
    color: var(--AccentColor);
    font-family: var(--Font_Bold);
    text-decoration: none;
    display: block;
    margin-top: auto;
    margin-bottom: 0
}

main section.newsletter {
    grid-column: 1/35;
    display: grid;
    grid-template-columns: var(--Column);
    grid-template-rows: 1fr max-content max-content 1fr;
    margin-top: 100px;
    position: relative;
    z-index: 5
}

main section.newsletter .background {
    grid-row: 1/5;
    grid-column: 3/33;
    background-color: #f4f4f4
}

main section.newsletter p {
    grid-row: 2/3;
    grid-column: 7/33;
    color: var(--AccentColor);
    font-size: 1em;
    line-height: 1em;
    font-family: var(--Font_Bold);
    padding: 10px 0
}

main section.newsletter p.title {
    grid-row: 1/2;
    font-family: var(--Font_Big);
    font-size: 3em;
    line-height: 1em;
    color: var(--MainColor_Dark);
    align-self: end
}

main section.newsletter p.captcha_notify {
    margin-top: 10px;
    grid-column: 7/33;
    grid-row: 4/5;
    text-align: start;
    color: var(--MainColor_Dark);
    opacity: .3;
    font-size: .8em
}

main section.newsletter p.captcha_notify a {
    color: var(--MainColor_Dark)
}

main section.newsletter form {
    grid-row: 3/4;
    grid-column: 1/35;
    display: grid;
    grid-template-columns: var(--Column);
    height: max-content
}

main section.newsletter form fieldset {
    display: flex;
    flex-flow: column;
    grid-row: 1/2
}

main section.newsletter form fieldset:nth-child(1) {
    grid-column: 7/12
}

main section.newsletter form fieldset:nth-child(2) {
    grid-column: 15/20
}

main section.newsletter form fieldset label {
    font-family: var(--Font_Bold);
    color: var(--MainColor_Dark)
}

main section.newsletter form fieldset input {
    border: none;
    background-color: var(--MainColor_Light);
    color: var(--MainColor_Dark);
    font-family: var(--Font_Reg);
    padding: 10px
}

main section.newsletter form fieldset input.invalid {
    border: solid 1px red
}

main section.newsletter form .message_box {
    margin-top: 10px;
    grid-column: 7/33;
    grid-row: 4/5;
    text-align: start;
    color: var(--MainColor_Dark);
    font-size: .8em
}

main section.newsletter form .button {
    grid-row: 1/2;
    grid-column: 23/29;
    margin-top: 0;
    height: max-content;
    align-self: end
}

main section.newsletter>span {
    grid-row: 4/5;
    grid-column: 7/28;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 15px
}

main section.newsletter>figure {
    grid-row: 1/5;
    grid-column: 31/33;
    overflow: hidden
}

main section.newsletter>figure img {
    transform: translate(83px);
    height: 310px
}

main section.newsletter .talk_tekst {
    color: var(--MainColor_Dark);
    grid-column: 7/26
}

main section.newsletter .talk_tekst a {
    color: var(--AccentColor);
    text-decoration: underline;
    cursor: pointer;
    opacity: 1;
    transition: opacity .3s ease-in-out
}

main section.newsletter .talk_tekst a:hover {
    opacity: .5;
    transition: opacity .3s ease-in-out
}

main section.video_holder {
    grid-column: 1/35;
    display: grid;
    grid-template-columns: var(--Column);
    grid-template-rows: 1fr max-content max-content 1fr;
    margin-top: 100px;
    position: relative;
    z-index: 5
}

main section.video_holder p {
    grid-column: 6/31;
    font-family: var(--Font_Big);
    font-size: 3em;
    line-height: 1em;
    color: var(--MainColor_Dark);
    align-self: end;
    margin-bottom: 20px
}

main section.video_holder video {
    height: auto;
    width: 100%;
    grid-column: 6/31;
    background-color: #f4f4f4
}

main section.centertext {
    grid-column: 1/35;
    margin-top: 40px;
    margin-bottom: 20px;
    display: grid;
    grid-template-columns: var(--Column)
}

main section.centertext div {
    grid-column: 7/28;
    display: flex;
    flex-flow: column;
    gap: 10px
}

main section.centertext div .title {
    font-family: var(--Font_Big);
    font-size: 3em;
    line-height: 1em
}

main section.centertext div .reg {
    font-family: var(--Font_Reg);
    font-size: 1em;
    line-height: 1.3em
}

main section.centertext div ul {
    display: flex;
    flex-flow: column;
    margin-top: 15px;
    margin-bottom: 15px;
    gap: 6px;
    list-style: disc
}

main section.centertext div ul li {
    margin-left: 15px
}

main section.centertext div p a {
    color: var(--AccentColor);
    cursor: pointer
}