/*
	CSS file for 
*/


/*	Base styles / resets
-------------------------------------------*/

    :root {
        --Green---Dark: #032915;
        --Green---Menta: #98FF98;
        --Green---Mid: #06351D;
        --Green---Light: #098845;
        --White---01: #FAFAFA;
        --White---02: #F2EFEF;
        --White---03: #E2E0E0;
        --Yellow-default: #F9EE47;
        --Brown: #371D10;
        --monkie-gradient: linear-gradient(0deg, #098845 0%, #0CFF7F 98.7%);
        --white: #FAFAFA;
        --text-outline-brown: -3px 0 0 #371D10, 2px 0 0 #371D10, 0 -2px 0 #371D10, 0 2px 0 #371D10, -2px -1px 0 #371D10, 2px -1px 0 #371D10, -3px 4px 0 #371D10, 2px 4px 0 #371D10, -1px 0 0 #371D10, 1px 0 0 #371D10, 0 -1px 0 #371D10, 0 1px 0 #371D10, -1px 4px 0 #371D10;
        --text-outline-brown-small: -2px 0 0 #371D10, 1px 0 0 #371D10, 0 -1px 0 #371D10, 0 1px 0 #371D10, -1px 0 0 #371D10, 1px 0px 0 #371D10, -2px 3px 0 #371D10, 1px 3px 0 #371D10, 0 -1px 0 #371D10, 0 -1px 0 #371D10, 0 -1px 0 #371D10, 0 0 0 #371D10, 0px 3px 0 #371D10;
    }

	* {
		padding: 0;
		margin: 0;
		outline: none;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
        box-sizing: border-box;
	}

    *::selection {
        color: var(--Green---Dark, #032915);
        background: var(--Green---Menta, #98FF98);
    }

	body {
        color: var(--white);
        font-family: 'Baloo 2', Arial, sans-serif;
        font-size: 18px;
        line-height: 1.5;
		background: var(--Green---Dark);
	}

	img,
	svg {
		display: block;
		max-width: 100%;
		height: auto;
	}

	a {
		color: inherit;
		text-decoration: none;
	}

	a img {
		border: 0;
	}

	a,
	svg,
	path,
	button {
		transition: all ease 0.4s;
	}

	.container {
		width: 94%;
		max-width: 1296px;
		margin: 0 auto;
	}

        .container.narrow {
            max-width: 856px;
        }

	.wrapper {
        padding-top: 72px;
		position: relative;
		overflow: hidden;
	}

    .screen-reader-text {
        display: none;
    }


    /*** WILL BE AUTO-GENERATED ***/
    .tag-1 { color: #FF6EC7; border-color: #FF6EC7; }
    .tag-1:hover { color: #ffffff; background: #FF6EC7; }

    .tag-2 { color: #24FF72; border-color: #24FF72; }
    .tag-2:hover { color: #ffffff; background: #24FF72; }

    .tag-3 { color: #A9FF68; border-color: #A9FF68; }
    .tag-3:hover { color: #ffffff; background: #A9FF68; }

    .tag-4 { color: #FFA500; border-color: #FFA500; }
    .tag-4:hover { color: #ffffff; background: #FFA500; }

    .tag-5 { color: #00E0FF; border-color: #00E0FF; }
    .tag-5:hover { color: #ffffff; background: #00E0FF; }

    .tag-6 { color: #2DF9C5; border-color: #2DF9C5; }
    .tag-6:hover { color: #ffffff; background: #2DF9C5; }

    .tag-7 { color: #B84EFF; border-color: #B84EFF; }
    .tag-7:hover { color: #ffffff; background: #B84EFF; }

    .tag-8 { color: #FF5DA2; border-color: #FF5DA2; }
    .tag-8:hover { color: #ffffff; background: #FF5DA2; }

    .tag-9 { color: #FFF44F; border-color: #FFF44F; }
    .tag-9:hover { color: #ffffff; background: #FFF44F; }

    .tag-10 { color: #FF3C38; border-color: #FF3C38; }
    .tag-10:hover { color: #ffffff; background: #FF3C38; }
    /*** ***/


/*	Common Elements
-------------------------------------------*/

	/*
	 *	Button
	 */
	.btn {
        min-height: 40px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        color: var(--Brown, #371D10);
        font-family: "Baloo 2", sans-serif;
        font-size: 14px;
        font-weight: 700;
        line-height: 16px;
        text-align: center;
        padding: 6px 18px 5px 18px;
        border-radius: 100px;
        border: 2px solid var(--Brown, #371D10);
        background: var(--Yellow-default, #F9EE47);
        box-shadow: 2px 1.81px 0 var(--Brown, #371D10);
        transition: all ease 0.2s;
        cursor: pointer;
	}

        .btn:hover {
            transform: translate3d(2px, 1.81px, 0);
            box-shadow: 0 0 0 var(--Brown, #371D10);
        }

    .btn.white {
        color: var(--White---02, #F2EFEF);
        border-color: var(--White---02, #F2EFEF);
        background: var(--Green---Mid, #06351D);
        box-shadow: 4px 1.81px 0 #A3A3A3;
    }

            .btn.white:hover {
                color: var(--Green---Menta, #98FF98);
                border-color: var(--Green---Menta, #98FF98);
                transform: translate3d(4px, 1.81px, 0);
                box-shadow: 0 0 0 #A3A3A3;
            }


    /*
     *	Button - Tag
     */
    .btn-tag {
        height: 27px;
        display: inline-flex;
        align-items: center;
        color: var(--White---02, #F2EFEF);
        padding: 1px 11px 0 11px;
        border: 1px solid #fff;
        text-align: center;
        font-size: 12px;
        font-weight: 700;
        line-height: 120%;
        border-radius: 16px;
        text-transform: uppercase;
        transition: all ease 0.3s;
        cursor: pointer;
    }

        .btn-tag:hover {
            color: var(--Green---Menta, #98FF98);
            border: 1px solid var(--Green---Menta, #98FF98);
        }

        .btn-tag.active {
            color: var(--Green---Dark, #032915);
            background: var(--Green---Menta, #98FF98);
            border-color: var(--Green---Menta, #98FF98);
        }


	/*
	 *	Form
	 */
	.gform_ajax_spinner,
	.gform_validation_errors,
	.gform_validation_container,
	.gform_required_legend,
	.validation_error {
		display: none;
	}

	.validation_message {
		color: #fff;
		font-size: 12px;
		padding: 6px 16px;
		background: #D11563;
		border-radius: 4px;
		margin-top: 4px;
	}


    /*
     *	Card
     */
    .monkie-card {
        width: 100%;
        max-width: 416px;
        min-height: 365px;
        display: block;
        position: relative;
        overflow: hidden;
        border-radius: 16px;
        color: var(--White---01, #FAFAFA);
        border: 1px solid var(--Green---Light, #098845);
        background: var(--Green---Mid, #06351D) url('../img/monkie-card-bg.png') no-repeat center center / cover;
        cursor: pointer;
    }

        .monkie-card .content {
            z-index: 2;
            position: relative;
            padding: 54px 67px 0 24px;
        }

            .monkie-card .content .title {
                font-size: 32px;
                font-weight: 700;
                line-height: 120%;
                transition: all ease 0.3s;
            }

            .monkie-card .content p {
                font-size: 18px;
                font-weight: 400;
                line-height: 120%;
                margin-top: 12px;
                transition: line-height 0.4s cubic-bezier(.68,-0.55,.27,1.55);
            }

            .monkie-card .content .link {
                display: block;
                color: var(--Yellow-default, #F9EE47);
                font-size: 14px;
                font-weight: 400;
                line-height: normal;
                text-decoration: underline;
                margin-top: 14px;
            }

        .monkie-card .image {
            right: -15px;
            bottom: -15px;
            width: 318px;
            height: 211px;
            position: absolute;
            transition: transform 0.4s cubic-bezier(.68,-0.55,.27,1.55);
        }

            .monkie-card .image img {
                top: 0;
                left: 0;
                position: absolute;
                object-fit: contain;
            }

        .monkie-card:hover .content .title {
            color: var(--Green---Menta, #98FF98);
        }

        .page-rules .monkie-card:hover .content p {
            line-height: 150%;
        }

        .monkie-card:hover .content .link {
            font-weight: bold;
            text-decoration: underline;
        }

        .monkie-card:hover .image {
            transform: rotate(-4.444deg);
        }

    .monkie-card.green {
        color: var(--Green---Dark, #032915);
        background: var(--Green---Menta, #98FF98) url('../img/monkie-card-bg-alt.png') no-repeat center center / cover;
    }

        .monkie-card.green .content .link {
            color: var(--Green---Dark, #032915);
        }

        .monkie-card.green:hover .content .title {
            color: var(--Green---Dark, #032915);
        }

    .monkie-card.blue {
        color: var(--Green---Dark, #032915);
        background: var(--Blue, #6AC1EB) url('../img/monkie-card-bg-alt.png') no-repeat center center / cover;
    }

        .monkie-card.blue .content .link {
            color: var(--Green---Dark, #032915);
        }

        .monkie-card.blue:hover .content .title {
            color: var(--Green---Dark, #032915);
        }


    /*
     *  Review card
     */
    .review-card {
        width: 100%;
        text-align: center;
    }

        .review-card .content {
            padding: 42px 24px;
        }

            .review-card .content h5 {
                display: inline-flex;
                align-items: center;
                height: 16px;
                color: var(--Green---Dark, #032915);
                font-size: 12px;
                font-weight: 700;
                line-height: 120%;
                text-align: center;
                text-transform: uppercase;
                border-radius: 12px;
                padding: 1px 12px 0 12px;
                background: var(--Yellow--active, #FAE500);
                margin-bottom: 11px;
            }

            .review-card .content .link {
                margin-top: 0;
                text-decoration: none;
            }

            .review-card .content .author {
                color: var(--White---02, #F2EFEF);
                text-align: center;
                font-size: 24px;
                font-weight: 700;
                line-height: 120%;
                margin-top: 22px;
            }

                .review-card .content .author small {
                    display: block;
                    color: var(--White---02, #F2EFEF);
                    font-size: 12px;
                    font-weight: 400;
                    line-height: 120%;
                    text-align: center;
                    text-transform: uppercase;
                    margin-top: 1px;
                }


    /*
     *  Banner
     */
    .banner {
        display: flex;
        min-height: 492px;
        align-items: center;
        justify-content: center;
        position: relative;
        margin: 64px 0;
    }

        .banner .container {
            display: flex;
            min-height: 492px;
            align-items: center;
            justify-content: center;
            position: relative;
        }

        .banner .shape {
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            z-index: 1;
            position: absolute;
            background: #06351D;
            mask-image: url('../img/shape.svg');
            mask-mode: alpha;
            mask-repeat: no-repeat;
            mask-size: 100% 100%;
            mask-position: top;
            -webkit-mask-image: url('../img/shape.svg');
            -webkit-mask-mode: alpha;
            -webkit-mask-repeat: no-repeat;
            -webkit-mask-position: top;
        }

        .banner .bg {
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            z-index: 2;
            position: absolute;
            background: url('../img/dark-leafs-bottom.png') no-repeat bottom center / 100%;
        }

        .banner .side-left {
            top: 0;
            left: 0;
            z-index: 2;
            width: auto;
            max-height: 488px;
            position: absolute;
        }

        .banner .side-right {
            top: 0;
            right: 0;
            z-index: 2;
            width: auto;
            max-height: 488px;
            position: absolute;
        }

        .banner .content {
            z-index: 2;
            padding: 0 330px;
            text-align: center;
            position: relative;
        }

            .banner .content .logo {
                display: block;
                margin: 0 auto 24px auto;
            }

            .banner .content h2 {
                color: var(--Yellow-default, #F9EE47);
                font-size: 64px;
                font-weight: 700;
                line-height: 64px;
                text-align: center;
                text-shadow: var(--text-outline-brown);
                margin-bottom: 10px;
            }

            .banner .content p {
                color: var(--White---01, #FAFAFA);
                font-size: 18px;
                font-weight: 700;
                line-height: 150%;
                text-align: center;
            }

            .banner .content .btn {
                min-width: 195px;
                margin-top: 30px;
            }


    /*
     *  Dropdown
     */
    .m-dropdown {
        z-index: 100;
        width: 410px;
        padding: 42px;
        margin-top: 12px;
        border-radius: 16px;
        border: 1px solid var(--Monkie-atmenet, #098845);
        background: var(--Green---Mid, #06351D);
        box-shadow: 0 8px 8px 0 rgba(0, 0, 0, 0.48);
        transition: all ease 0.3s;
        transform: translate3d(0, 15px, 0);
        opacity: 0;
        visibility: hidden;
        position: absolute;
    }

        .m-dropdown.right {
            right: 0;
        }

        .m-dropdown.show {
            opacity: 1;
            visibility: visible;
            transform: translate3d(0, 0, 0);
        }

        .m-dropdown h4 {
            color: var(--Green---Menta, #98FF98);
            font-size: 24px;
            font-weight: 700;
            line-height: 120%;
        }

        .m-dropdown p {
            max-width: 230px;
            color: var(--White---01, #FAFAFA);
            font-size: 12px;
            font-weight: 400;
            line-height: 120%;
        }

        .m-dropdown .options .checkbox {
            margin-top: 24px;
        }

        .m-dropdown .btn {
            width: 100%;
            margin-top: 24px;
        }

        .m-dropdown .btn-clear {
            display: block;
            width: 100%;
            color: var(--White---04, #A3A3A3);
            font-family: "Baloo 2", sans-serif;
            font-size: 14px;
            font-style: normal;
            font-weight: 700;
            line-height: 14px;
            text-align: center;
            border: 0;
            background: transparent;
            padding: 12px 0;
            margin-top: 12px;
            margin-bottom: -12px;
            cursor: pointer;
        }

            .m-dropdown .btn-clear:hover {
                color: var(--White---03, #EAEAEA);
            }


    /*
     *  Form Elements
     */
    .checkbox {
        display: flex;
    }

        .checkbox input {
            display: none;
        }

        .checkbox label {
            min-height: 24px;
            display: flex;
            align-items: center;
            color: var(--White---02, #F2EFEF);
            font-size: 14px;
            font-weight: 700;
            line-height: 18px;
            position: relative;
            cursor: pointer;
        }

            .checkbox label:hover,
            .checkbox input:checked + label {
                color: var(--Green---Menta, #98FF98);
            }

            .checkbox label:before {
                content: "";
                display: block;
                width: 24px;
                height: 24px;
                margin-right: 12px;
                border-radius: 50%;
                background: var(--Green---Mid, #06351D);
                border: 1px solid var(--Green---Light, #098845);
                box-shadow: 0 4px 4px rgba(0, 0, 0, 0.24);
                transition: all ease 0.3s;
                cursor: pointer;
            }

            .checkbox label:after {
                content: "";
                top: 1px;
                left: 0;
                z-index: 2;
                width: 26px;
                height: 25px;
                position: absolute;
                transform: scale(0);
                background: url('../img/icon-checkbox.svg') no-repeat center center / 12px 12px;
                transition: all ease 0.3s;
            }

            .checkbox input:checked + label:before {
                background: var(--Green---Menta, #98FF98);
            }

            .checkbox input:checked + label:after {
                transform: scale(1);
            }


    /*
     *  Scrollbar
     */
    .swiper-scrollbar {
        margin-top: 24px;
        bottom: auto !important;
        left: auto !important;
        width: 100% !important;
        height: 12px !important;
        position: relative !important;
        border-radius: 32px;
        border: 1px solid var(--Green---Light, #098845);
        background: var(--Green---Mid, #06351D);
    }

        .swiper-scrollbar .bg {
            width: 5px;
            top: 0;
            left: 0;
            bottom: 0;
            position: absolute;
            border-radius: 32px 0 0 32px;
            background: var(--Green---Light, #098845);
        }

        .swiper-scrollbar .swiper-scrollbar-drag {
            top: -1px;
            height: 11px;
            position: relative;
            border-radius: 32px;
            background: var(--Green---Light, #098845);
            cursor: move;
        }

            .swiper-scrollbar .swiper-scrollbar-drag:before {
                content: "";
                width: 97px;
                height: 32px;
                right: 0;
                bottom: 0;
                margin-left: -48px;
                position: absolute;
                background: url('../img/slider-bug.png') no-repeat center center / contain;
            }

            .swiper-scrollbar.snail .swiper-scrollbar-drag:before {
                background-image: url('../img/slider-snail.png');
            }


    /*
     *  FAQ/QA links
     */
    .qa {

    }

        .qa .main {
            color: var(--Yellow-default, #F9EE47);
            font-size: 14px;
            font-weight: 700;
            line-height: 150%;
            text-align: center;
            text-decoration: underline;
        }

        .qa .grey {
            color: var(--White---04, #A3A3A3);
            text-align: center;
            font-size: 12px;
            font-weight: 400;
            line-height: 150%;
            margin-top: 5px;
        }

            .qa .grey a:hover {
                color: var(--Yellow-default, #F9EE47);
                text-decoration: underline;
            }


    /*
     *  Countdown
     */
    .countdown {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }

        .countdown h4 {
            width: 100%;
            color: var(--Yellow-default, #F9EE47);
            text-shadow: var(--text-outline-brown);
            font-size: 24px;
            font-weight: 700;
            line-height: 120%;
            text-align: center;
            margin-bottom: 22px;
        }

        .countdown .box {
            width: 84px;
            height: 84px;
            margin: 0 12px;
            padding-top: 11px;
            color: var(--Yellow-default, #F9EE47);
            font-size: 32px;
            font-weight: 700;
            line-height: 36px;
            text-align: center;
            text-shadow: var(--text-outline-brown-small);
            background: url('../img/countdown-box.png') no-repeat center center / contain;
        }

            .countdown .box span {
                display: block;
                font-size: 18px;
                line-height: 22px;
                margin-top: -5px;
                text-shadow: var(--text-outline-brown-small);
            }

    /*
     *  Responsive video
     */
    .responsive-video {
        height: 0;
        padding-top: 25px;
        padding-bottom: 67.5%;
        position: relative;
        overflow: hidden;
    }

    .responsive-video.widescreen {
        padding-bottom: 56.25%;
    }

    .responsive-video.vimeo {
        padding-top: 0;
    }

    .responsive-video embed,
    .responsive-video iframe,
    .responsive-video object,
    .responsive-video video {
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        position: absolute;
    }


/*	Header
-------------------------------------------*/

	header {
        top: 0;
        left: 0;
        right: 0;
        z-index: 200;
	    height: 72px;
        position: fixed;
        background: url('../img/header-bg.svg') no-repeat center center / 100% 72px;
	}

    header .container {
        display: flex;
        justify-content: space-between;
    }

        header .logo {
            width: 191px;
            padding-top: 10px;
        }

        header nav {
            color: var(--Green---Menta);
            font-size: 14px;
            font-weight: bold;
        }

            header nav > ul {
                display: flex;
                list-style: none;
            }

                header nav > ul > li {
                    display: flex;
                    flex-direction: column;
                    justify-content: center;
                    position: relative;
                    height: 72px;
                }

                    header nav > ul > li + li {
                        margin-left: 42px;
                    }

                    header nav > ul > li > a {
                        color: inherit;
                    }

                header nav > ul > li.menu-item-has-children > a {
                    padding-right: 15px;
                    background: url('../img/header-dropdown.svg') no-repeat right center;
                }

                header nav ul.sub-menu {
                    top: 100%;
                    left: -15px;
                    position: absolute;
                    list-style: none;
                    border-radius: 15px;
                    background: var(--Green---Mid);
                    box-shadow: 0 8px 8px 0 rgba(0, 0, 0, 0.48);
                    padding: 30px 42px;
                    opacity: 0;
                    visibility: hidden;
                }

                    header nav ul.sub-menu:before {
                        content: "";
                        position: absolute;
                        z-index: -1;
                        top: -1px;
                        left: -1px;
                        right: -1px;
                        bottom: -1px;
                        border-radius: 16px;
                        background: var(--monkie-gradient);
                    }

                    header nav ul.sub-menu li + li {
                        margin-top: 6px;
                    }

                    header nav ul.sub-menu li a {
                        display: block;
                        padding: 4px 0;
                        white-space: nowrap;
                    }

                header nav li:hover ul.sub-menu {
                    opacity: 1;
                    visibility: visible;
                }

        header .icons {
            width: 191px;
            display: flex;
            align-items: center;
            justify-content: flex-end;
        }

            header .icons a {

            }

            header .icons .cart {
                margin-left: 24px;
            }

            header .icons .account {
                display: block;
                width: 25px;
                height: 25px;
                margin-left: 24px;
                border-radius: 100px;
                border: 1px solid var(--Green---Light, #098845);
            }

                header .icons .account img {
                    display: block;
                    object-fit: cover;
                    object-position: center;
                    border-radius: 100px;
                }


    /*
     *	Lian
     */
    .header-lian {
        top: 60px;
        right: 0;
        width: auto;
        height: 150px;
        position: absolute;
    }

        body:has(.page-header .side-right) .header-lian {
            display: none;
        }



/*	Footer
-------------------------------------------*/

	footer {
        z-index: 2;
        padding-top: 313px;
        position: relative;
	}

    footer .bg {
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: -1;
        padding-top: 87px;
        position: absolute;
        background: url('../img/footer-top-plants.png') no-repeat center top / auto 271px;
    }

        footer .bg .top {
            height: revert-layer;
            margin:  auto;
        }

        footer .bg .shape {
            top: 238px;
            left: -45px;
            bottom: 0;
            width: calc(100% + 110px);
            position: absolute;
            background: #06351D;
            mask-image: url('../img/shape.svg');
            mask-mode: alpha;
            mask-repeat: no-repeat;
            mask-size: 100%;
            mask-position: top;
            -webkit-mask-image: url('../img/shape.svg');
            -webkit-mask-mode: alpha;
            -webkit-mask-repeat: no-repeat;
            -webkit-mask-position: top;
        }

            footer .bg .shape img {
                left: 44%;
                bottom: 56px;
                position: absolute;
            }


    /*
     *  Newsletter
     */
    footer .newsletter {
        top: 183px;
        left: calc(50% - 319px);
        width: 638px;
        height: 119px;
        position: absolute;
        padding: 31px 51px 0 51px;
        background: url('../img/footer-newsletter-bg.png') no-repeat top center / contain;
    }

        footer .newsletter form {
            display: flex;
            justify-content: space-between;
        }

            footer .newsletter .gform_body {
                width: calc(100% - 204px);
            }

                footer .newsletter .gfield_label {
                    display: none;
                }

                footer .newsletter .gfield input {
                    display: block;
                    width: 100%;
                    color: #FFF;
                    font-family: "Baloo 2", sans-serif;
                    font-size: 14px;
                    font-weight: 700;
                    line-height: 24px;
                    padding: 9px 24px 7px 24px;
                    border-radius: 32px;
                    border: 1px solid #371010;
                    background: #4E2E16;
                }

                    footer .newsletter .gfield input::placeholder {
                        color: #FFF;
                        opacity: 1;
                    }

            footer .newsletter .gform_footer {
                width: 192px;
            }


    /*
     *  Middle
     */
    footer .middle {
        display: flex;
        justify-content: space-between;
        padding-bottom: 24px;
    }

    footer .middle .left {
        max-width: 415px;
    }

        footer .middle .left img {
            margin-bottom: 24px;
        }

        footer .middle .left p {
            font-size: 16px;
            line-height: 24px;
            margin-bottom: 24px;
        }

        footer .middle .left .social {
            display: flex;
            align-items: center;
        }

            footer .middle .left .social .icon {
                display: flex;
                width: 24px;
                height: 24px;
                align-items: center;
                justify-content: center;
                border-radius: 100px;
                border: 2px solid var(--Green---Menta, #98FF98);
                background: var(--Green---Mid, #06351D);
                box-shadow: 2.14px 1.41px 0 0 var(--Green---Light, #098845);
                transition: all ease 0.2s;
            }

                footer .middle .left .social .icon:hover {
                    transform: translate3d(2.14px, 1.41px, 0);
                    box-shadow: 0 0 0 0 var(--Green---Light, #098845);
                }

                footer .middle .left .social .icon:hover svg {
                    fill: var(--Green---Menta, #98FF98);
                }

            footer .middle .left .social .icon + .icon {
                margin-left: 12px;
            }

            footer .middle .left .social .em {
                display: inline-block;;
                color: var(--Green---Menta, #98FF98);
                font-size: 14px;
                font-weight: 700;
                margin-left: 14px;
                z-index: 2;
                position: relative;
            }

                footer .middle .left .social .em:before {
                    content: "monkies@monkies.hu";
                    z-index: -1;
                    color: var(--Green---Light, #098845);
                    text-shadow: 1px 1px 4px #098845;
                    -webkit-text-stroke-width: 5px;
                    -webkit-text-stroke-color: var(--Green---Light, #098845);
                    position: absolute;
                }

    footer .middle nav {
        display: flex;
        margin-top: 20px;
    }

        footer .middle nav ul {
            list-style: none;
        }

            footer .middle nav ul li + li {
                margin-top: 4px;
            }

            footer .middle nav ul li a {
                color: var(--White---03, #E2E0E0);
                font-size: 14px;
                font-weight: 700;
            }

        footer .middle nav ul + ul {
            margin-left: 48px;
        }

    /*
     *  Bottom
     */
    footer .bottom {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 17px 0 16px 0;
        position: relative;
    }

        footer .bottom:before {
            content: "";
            display: block;
            top: 0;
            width: 100%;
            height: 1px;
            position: absolute;
            background: linear-gradient(90deg, #098845 0%, #0CFF7F 100%);
        }

        footer .bottom p {
            color: var(--White---03, #E2E0E0);
            font-size: 14px;
            font-weight: 700;
        }

        footer .bottom .right {
            display: flex;
            align-items: center;
        }

            footer .bottom .right ul {
                display: flex;
                align-items: center;
                list-style: none;
                color: var(--White---03, #E2E0E0);
                font-size: 14px;
                font-weight: 400;
            }

                footer .bottom .right ul li {
                    margin: 0 6px;
                }

                    footer .bottom .right ul li a:hover {
                        color: var(--Green---Menta, #98FF98);
                    }

            footer .bottom .right .logos {
                display: flex;
                align-items: center;
                margin-left: 24px;
            }

                footer .bottom .right .logos a + a {
                    margin-left: 12px;
                }




/*	General Content
-------------------------------------------*/

	.general-content > *:first-child {
        margin-top: 0;
        padding-top: 0;
    }

        .general-content h2 {
            color: var(--White---01, #FAFAFA);
            font-size: 24px;
            font-weight: 700;
            line-height: 120%;
            margin-top: 48px;
        }

        .general-content p {
            margin-top: 27px;
        }

        .general-content a {
            color: var(--Yellow-default, #F9EE47);
            font-weight: bold;
            text-decoration: underline;
        }

        .general-content blockquote {
            max-width: 640px;
            color: var(--Yellow-default, #F9EE47);
            font-size: 42px;
            font-weight: 700;
            line-height: 120%;
            text-shadow: var(--text-outline-brown);
            margin: 48px 0;
        }

            .general-content blockquote p {
                margin-top: 0;
            }

            .general-content blockquote:before {
                content: "";
                display: block;
                width: 28px;
                height: 23px;
                background: url('../img/icon-quote.svg') no-repeat top left;
            }

        .general-content ul {
            list-style: none;
            margin-top: 24px;
        }

            .general-content ul li + li {
                margin-top: 12px;
            }

            .general-content ul li {
                padding-left: 20px;
                background: url('../img/icon-li.svg') no-repeat 2px 10px;
            }

        .general-content ol {
            list-style: none;
            counter-reset: item;
            margin-top: 24px;
        }

            .general-content ol li {
                padding-left: 26px;
                counter-increment: item;
                position: relative;
            }

            .general-content ol li:before {
                content: counter(item, decimal-leading-zero);
                left: 0;
                font-size: 18px;
                font-weight: 700;
                line-height: 150%;
                background: var(--Monkie-atmenet, linear-gradient(0deg, #098845 0%, #0CFF7F 98.7%));
                background-clip: text;
                -webkit-background-clip: text;
                -webkit-text-fill-color: transparent;
                position: absolute;
            }

        .general-content .checklist {
            margin-top: 24px;
        }

            .general-content .checklist li {
                color: var(--Green---Menta, #98FF98);
                font-weight: bold;
                padding-left: 24px;
                background: url('../img/pkg-tick-featured.svg') no-repeat 0 5px;
            }



/*	Section: Page Header
-------------------------------------------*/

    .page-header {
        z-index: 0;
        padding: 64px 0;
        text-align: center;
        position: relative;
    }

        .page-header .side-left {
            top: 0;
            left: 0;
            position: absolute;
        }

        .page-header .side-right {
            top: 0;
            right: 0;
            position: absolute;
        }

    .page-header .container {
        position: relative;
    }

        .page-header .container:before {
            content: "";
            top: 28px;
            left: 0;
            right: 0;
            height: 355px;
            z-index: -1;
            position: absolute;
            background: url('../img/dark-leafs.png') no-repeat center top / auto 355px;
        }

        .page-header.no-bg .container:before {
            display: none;
        }

    .breadcrumbs {
        color: var(--White---03, #E2E0E0);
        font-size: 12px;
        line-height: 120%;
        text-transform: uppercase;
        margin-bottom: -3px;
        position: relative;
        z-index: 2;
    }

        .breadcrumbs ol {
            display: flex;
            list-style: none;
            justify-content: center;
        }

            .breadcrumbs ol li + li:before {
                content: "/";
                margin: 0 6px;
            }

            .breadcrumbs ol li a:hover {
                color: var(--Green---Menta, #98FF98);
            }

            .single .breadcrumbs ol li.breadcrumb_last {
                display: none;
            }

    .page-header h1 {
        color: var(--Yellow-default, #F9EE47);
        font-size: 64px;
        font-weight: 700;
        line-height: 120%;
        text-shadow: var(--text-outline-brown);
    }

    .page-header p {
        max-width: 636px;
        color: var(--White---01, #FAFAFA);
        font-size: 18px;
        font-weight: 700;
        line-height: 150%;
        margin: 3px auto 0 auto;
    }

    .page-header .filters {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        margin-top: 12px;
        margin-bottom: -18px;
        position: relative;
        z-index: 2;
    }

        .page-header .filters .btn-tag {
            margin: 0 12px 18px 12px;
        }

    .page-header .countdown {
        margin-top: 24px;
    }

        .page-header .countdown + .qa {
            margin-top: 24px;
        }

    .page-header .tags {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        margin: 0 -12px;
    }

        .page-header .tags .btag {
            margin: 0 6px 12px 6px;
        }

    .page-header .date {
        color: var(--White---02, #F2EFEF);
        font-size: 16px;
        font-weight: 400;
        line-height: 150%;
    }

    .subscribe-cta {
        display: flex;
        flex-direction: column;
        margin-top: 32px;
    }

        .subscribe-cta .btn {
            width: 158px;
            margin: 0 auto;
            z-index: 2;
            position: relative;
        }

        .subscribe-cta .btn:before {
            content: "";
            z-index: -1;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            position: absolute;
            border-radius: 100px;
            box-shadow: 0 4px 29.4px 0 rgba(250, 235, 0, 0.24);
        }

        .subscribe-cta .price {
            color: var(--White---04, #A3A3A3);
            font-size: 14px;
            font-weight: 400;
            text-align: center;
            margin-top: 14px;
        }

        .subscribe-cta p {
            color: var(--Yellow-default, #F9EE47);
            font-size: 14px;
            font-weight: 700;
            line-height: 150%;
            text-align: center;
            margin-top: 16px;
        }

            .subscribe-cta p a {
                text-decoration: underline;
            }


/*	Page: Home
-------------------------------------------*/

    .home .wrapper {
        padding-top: 0;
    }

    .home .header-lian {
        display: none;
    }

    .home .reviews-slider {
        margin-top: -20px;
    }

    .home .related-posts {
        margin-top: 70px;
    }

    .home .twi.boxed {
        margin-top: 210px;
    }

    .home .banner {
        margin-bottom: 55px;
    }

        .home .banner.mb-m-50 {
            margin-bottom: -50px;
        }

    .home .hero + .pod-slider {
        z-index: 3;
        position: relative;
        margin-top: 48px;
    }


    /*
     *  Hero
     */
    .hero {
        z-index: 1;
        min-height: 1080px;
        padding-top: 105px;
        position: relative;
        background: url('../img/hero-bg.png') no-repeat center top / cover;
    }

        .hero .container {
            z-index: 10;
            position: relative;
        }

        .hero .logo {
            display: block;
            width: 551px;
            height: 221px;
            margin: 0 auto 12px auto;
        }

        .hero p {
            max-width: 564px;
            margin: 12px auto 0 auto;
            color: var(--Green---Mid, #06351D);
            font-weight: bold;
            text-align: center;
        }

        .hero .buttons {
            margin-top :32px;
            display: flex;
            align-items: center;
            justify-content: center;
        }

            .hero .buttons .btn {
                min-width: 160px;
                margin: 0 12px;
            }

        .hero .back {
            max-width: none;
            width: calc(100% + 105px);
            z-index: 1;
            left: -105px;
            height: 545px;
            bottom: -20px;
            position: absolute;
        }

        .hero .center {
            max-width: none;
            width: 557px;
            z-index: 2;
            left: 50%;
            bottom: 66px;
            position: absolute;
            margin-left: -278px;
        }

        .hero .front-1 {
            max-width: none;
            width: calc(100% + 44px);
            height: 301px;
            z-index: 3;
            left: -44px;
            bottom: -82px;
            position: absolute;
        }

        .hero .front-2 {
            max-width: none;
            width: calc(100% + 44px);
            height: 374px;
            z-index: 4;
            left: -44px;
            bottom: -102px;
            position: absolute;
        }



/*	Page: Rules
-------------------------------------------*/

    .page-rules {

    }

    .page-rules .items {
        display: flex;
        flex-wrap: wrap;
        margin: 0 -12px -24px -12px;
        justify-content: space-between;
    }

        .page-rules .monkie-card {
            width: calc(33.333% - 24px);
            margin: 0 12px 24px 12px;
        }


/*	Page: Product Catalog
-------------------------------------------*/

    .product-card {
        display: block;
        padding: 42px;
        border-radius: 16px;
        border: 1px solid var(--Green---Light, #098845);
        background: var(--Green---Mid, #06351D);
        box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.24);
    }

        .product-card .tags {
            display: flex;
        }

            .product-card .tags span {
                height: 16px;
                display: flex;
                align-items: center;
                padding: 1px 12px 0 12px;
                color: var(--Green---Mid, #06351D);
                font-size: 12px;
                font-weight: 700;
                line-height: 120%; /* 14.4px */
                text-transform: uppercase;
                text-align: center;
                border-radius: 12px;
                background: var(--Green---Menta, #98FF98);
                margin-right: 6px;
            }

                .product-card .tags span.blue {
                    background: #6AC1EB;
                }

                .product-card .tags span.green {
                    color: var(--White---02, #F2EFEF);
                    background: var(--Green---Light, #098845);
                }

        .product-card .image {
            display: flex;
            margin: 24px 0;
            height: 258px;
            align-items: center;
        }

            .product-card .image img {
                display: block;
                width: 100%;
                height: calc(100% - 14px);
                object-fit: contain;
                object-position: center;
                transition: all ease 0.4s;
            }

        .product-card .title {
            color: var(--White---01, #FAFAFA);
            font-size: 24px;
            font-weight: 700;
            line-height: 120%;
            transition: all ease 0.4s;
        }

        .product-card p {
            color: var(--White---02, #F2EFEF);
            font-size: 16px;
            line-height: 150%;
            margin-top: 2px;
        }

        .product-card .bottom {
            display: flex;
            align-items: center;
            justify-content: space-between;
            margin-top: 28px;
        }

            .product-card .bottom .price {
                display: flex;
                align-items: center;
                color: var(--White---03, #E2E0E0);
                font-size: 18px;
                font-weight: 700;
                line-height: 150%;
            }

                .product-card .bottom .price ins {
                    order: 1;
                    text-decoration: none;
                }

                .product-card .bottom .price del {
                    order: 2;
                    margin-left: 6px;
                    color: var(--White---04, #A3A3A3);
                    font-size: 12px;
                    font-weight: 400;
                    line-height: 120%;
                    text-decoration-line: line-through;
                    text-transform: uppercase;
                }

            .product-card .bottom .add-to-cart {
                display: flex;
                align-items: center;
            }

                .product-card .bottom .stock {
                    color: var(--Green---Menta, #98FF98);
                    font-size: 12px;
                    font-weight: 700;
                    line-height: 120%;
                    text-transform: uppercase;
                }

                .product-card .bottom .btn {
                    margin-left: 6px;
                    min-height: 30px;
                }

    .product-card:hover {
        border-color: #0CFF7F;
        box-shadow: 0 8px 8px 0 rgba(0, 0, 0, 0.48);
    }

        .product-card:hover .title {
            color: var(--Green---Menta, #98FF98);
        }

        .product-card:hover .image img {
            height: 100%;
        }


    /*
     *  Catalog
     */
    .page-catalog {
        z-index: 2;
        margin-top: -32px;
        position: relative;
    }

        .page-catalog .items {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
            margin: 0 -12px -24px -12px;
        }

            .page-catalog .items .product-card {
                max-width: calc(33.333% - 24px);
                margin: 0 12px 24px 12px;
            }



/*	Page: Contact
-------------------------------------------*/

    .page-header-contact {
        padding-top: 80px;
        position: relative;
    }

    .page-contact {
        z-index: 2;
        position: relative;
        margin-top: -40px;
        padding-bottom: 90px;
    }

        .page-contact p {
            margin: 0 auto;
            max-width: 670px;
            color: var(--Yellow-default, #F9EE47);
            font-size: 24px;
            font-weight: 700;
            line-height: 120%;
            text-align: center;
            text-shadow: var(--text-outline-brown);
        }

            .page-contact p a {
                color: var(--Green---Menta, #98FF98);
            }

        .page-contact .social {
            display: flex;
            margin-top: 32px;
            justify-content: center;
        }

            .page-contact .social a {
                margin: 0 16px;
            }

                .page-contact .social a .icon {
                    display: flex;
                    width: 38px;
                    height: 38px;
                    margin: 0 auto;
                    align-items: center;
                    justify-content: center;
                    border-radius: 100px;
                    border: 2px solid var(--Green---Menta, #98FF98);
                    background: var(--Green---Mid, #06351D);
                    box-shadow: 3.6px 2.41px 0 0 var(--Green---Light, #098845);
                    transition: all ease 0.2s;
                }

                .page-contact .social a:hover .icon {
                    transform: translate3d(2.14px, 1.41px, 0);
                    box-shadow: 0 0 0 0 var(--Green---Light, #098845);
                }

                .page-contact .social a:hover .icon svg {
                    fill: var(--Green---Menta, #98FF98);
                }

                .page-contact .social a span {
                    display: block;
                    color: var(--Green---Menta, #98FF98);
                    font-size: 12px;
                    font-weight: 700;
                    line-height: 120%;
                    text-align: center;
                    text-transform: uppercase;
                    margin-top: 14px;
                }


/*	Page: FAQ
-------------------------------------------*/

    .faq {
        /*min-height: 448px;*/
        margin-top: 95px;
        position: relative;
    }

        .faq .side-left {
            top: -40px;
            left: 0;
            position: absolute;
        }

        .faq .side-right {
            top: -40px;
            right: 0;
            position: absolute;
        }

    .faq .container {
        max-width: 640px;
    }

    .faq h3 {
        color: var(--Yellow-default, #F9EE47);
        font-size: 42px;
        font-weight: 700;
        line-height: 120%;
        text-align: center;
        text-shadow: var(--text-outline-brown);
        margin-bottom: 28px;
    }

    .faq .items {

    }

        .faq .item {
            padding: 14px 24px;
            border-radius: 32px;
            border: 1px solid var(--Green---Light, #098845);
            background: var(--Green---Mid, #06351D);
            box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.24);
            transition: border-radius ease 0.3s, border ease 0.3s;
        }

            .faq .item .qn {
                display: flex;
                justify-content: space-between;
                cursor: pointer;
            }

                .faq .item .qn h4 {
                    width: calc(100% - 34px);
                    color: var(--White---03, #E2E0E0);
                    font-size: 18px;
                    font-weight: 700;
                    line-height: 150%;
                    transition: all ease 0.3s;
                }

            .faq .item .answer {
                display: none;
                color: var(--White---01, #FAFAFA);
                font-size: 18px;
                font-weight: 400;
                line-height: 150%;
                padding-top: 18px;
            }

            .faq .item.opened {
                border-radius: 16px;
                border: 1px solid var(--Green---Menta, #98FF98);
                background: var(--Green---Mid, #06351D);
                box-shadow: 0 8px 8px 0 rgba(0, 0, 0, 0.48);
            }

                .faq .item.opened .qn h4 {
                    color: var(--Green---Menta, #98FF98);
                }

                .faq .item.opened .qn svg {
                    fill: var(--Green---Menta, #98FF98);
                    transform: rotate(90deg);
                }

            .faq .item:hover {
                border: 1px solid var(--Green---Menta, #98FF98);
            }

                .faq .item:hover .qn h4 {
                    color: var(--Green---Menta, #98FF98);
                }

                .faq .item:hover .qn svg {
                    fill: var(--Green---Menta, #98FF98);
                }

        .faq .item + .item {
            margin-top: 12px;
        }

    .page-faq {
        z-index: 2;
        margin-top: -40px;
        position: relative;
    }

        .page-faq .faq {
            margin-top: 54px;
        }

        .page-faq .sd-1 {
            top: 234px;
            left: 0;
            position: absolute;
        }

        .page-faq .sd-2 {
            top: -95px;
            right: 0;
            position: absolute;
        }

        .page-faq .sd-3 {
            top: 140px;
            left: 0;
            position: absolute;
        }



/*	Section: Text with image
-------------------------------------------*/

    .twi {
        margin-top: 48px;
    }

    .twi .container {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

        .twi .image {
            display: flex;
            width: calc(50% - 16px);
        }

            .twi.img-right .image {
                order: 2;
            }

                .twi.img-right .image img {
                    max-width: 100%;
                }

        .twi .content {
            width: calc(50% - 16px);
            max-width: 526px;
            padding: 30px 0;
        }

            .twi .content h2 {
                color: var(--Yellow-default, #F9EE47);
                font-size: 64px;
                font-weight: 700;
                line-height: 120%;
                text-shadow: var(--text-outline-brown);
                margin-bottom: 5px;
            }

            .twi .content p + p {
                margin-top: 27px;
            }

            .twi .content .btn {
                padding-left: 32px;
                padding-right: 32px;
                margin-top: 32px;
            }

    .twi.boxed {
        margin-top: 235px;
        position: relative;
    }

    .twi.boxed .container {
        /*min-height: 682px;*/
        padding-top: 5px;
        padding-left: 110px;
        padding-bottom: 8px;
        background: url('../img/shape.svg') no-repeat top left / 100% 100%;
    }

        .twi.boxed .leafs {
            top: -206px;
            left: 50%;
            width: 100%;
            max-width: 1254px;
            z-index: -1;
            bottom: 580px;
            position: absolute;
            transform: translateX(-50%);
        }

        .twi.boxed .monkies {
            top: -188px;
            left: 50%;
            width: 100%;
            max-width: 720px;
            z-index: -1;
            position: absolute;
            transform: translateX(-50%);
        }


/*	Section: Packages
-------------------------------------------*/

    .packages {
        margin-top: 64px;
    }

        .packages h2 {
            color: var(--Yellow-default, #F9EE47);
            font-size: 64px;
            font-weight: 700;
            line-height: 120%;
            text-align: center;
            text-shadow: var(--text-outline-brown);
            margin-bottom: 0px;
        }

        .packages .items {
            width: 100%;
            max-width: 916px;
            margin: 0 auto;
            position: relative;
        }

            .packages .items .mleft {
                top: 24px;
                right: calc(100% - 36px);
                height: 249px;
                position: absolute;
            }

            .packages .items .mright {
                top: 24px;
                left: calc(100% - 36px);
                height: 249px;
                position: absolute;
            }

            .packages .swiper {
                overflow: visible;
                padding: 22px 24px 24px 24px;
            }

                .packages .items .swiper-slide {
                    display: flex;
                    height: auto;
                }

            .pkg-box {
                overflow: hidden;
                border-radius: 16px;
                border: 1px solid var(--Monkie-atmenet, #098845);
                background: var(--Green---Mid, #06351D);
                box-shadow: 0 4px 22px 0 rgba(0, 0, 0, 0.42);
            }

                .pkg-box .head {
                    padding: 48px 40px 32px 40px;
                    background: #0A311D;
                }

                    .pkg-box .head .ribbon {
                        top: 1px;
                        left: 40px;
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        min-width: 154px;
                        height: 34px;
                        color: #05381E;
                        font-size: 12px;
                        font-weight: 700;
                        line-height: 120%;
                        text-transform: uppercase;
                        position: absolute;
                        border-radius: 0 0 16px 16px;
                        border: 1px solid #0CFF7F;
                        border-top: 0;
                        background: linear-gradient(88deg, rgba(65, 136, 75, 1) 2.48%, rgba(123, 249, 136, 1) 100%);
                    }

                    .pkg-box .head h3 {
                        color: var(--White---01, #FAFAFA);
                        font-size: 32px;
                        font-weight: 700;
                        line-height: 120%;
                        margin-bottom: 8px;
                    }

                    .pkg-box .head p {
                        color: var(--White---03, #E2E0E0);
                    }

                .pkg-box .content {
                    padding: 24px 40px 50px 40px;
                }

                    .pkg-box .content .price {
                        padding-bottom: 32px;
                    }

                        .pkg-box .content .price h4 {
                            color: var(--White---02, #F2EFEF);
                            font-size: 24px;
                            font-weight: 700;
                            line-height: 120%;
                        }

                        .pkg-box .content .price p {
                            color: var(--White---04, #A3A3A3);
                            font-size: 12px;
                            font-weight: 400;
                            line-height: 150%;
                            margin-top: 4px;
                        }

                    .pkg-box .content .btn {
                        width: 100%;
                    }

                    .pkg-box .content ul {
                        list-style: none;
                        margin-top: 36px;
                    }

                        .pkg-box .content ul li {
                            color: var(--White---03, #E2E0E0);
                            font-size: 18px;
                            font-weight: 400;
                            line-height: 120%;
                            padding-left: 24px;
                            padding-bottom: 8px;
                            margin-top: 12px;
                            border-bottom: 1px solid var(--White---04, #A3A3A3);
                            background: url('../img/pkg-tick.svg') no-repeat 0 2px / 16px 16px;
                        }

                        .pkg-box .content ul li.featured {
                            color: var(--Green---Menta, #98FF98);
                            font-weight: bold;
                            background-image: url('../img/pkg-tick-featured.svg');
                        }

                .pkg-box.featured {
                    border: 1px solid #0CFF7F;
                    background: #083D22;
                    box-shadow: 0 4px 43.5px 0 rgba(10, 103, 55, 0.42);
                }

                    .pkg-box.featured .head {
                        background: #05381E;
                    }

                    .pkg-box.featured .content ul li {
                        border-color: var(--Green---Menta, #98FF98);
                    }

    .page-header + .packages {
        margin-top: -26px;
    }


/*	Section: Tagcloud
-------------------------------------------*/

    .tagcloud {
        margin-top: 78px;
    }

        .tagcloud .container {
            display: flex;
            align-items: center;
            justify-content: center;
            min-height: 464px;
            position: relative;
        }

        .tagcloud .bg {
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            z-index: -1;
            position: absolute;
            background: #06351D url('../img/tagcloud-bg.png') no-repeat center bottom / 100% auto;
            mask-image: url('../img/shape.svg');
            mask-mode: alpha;
            mask-repeat: no-repeat;
            mask-size: 100% 100%;
            mask-position: top;
            -webkit-mask-image: url('../img/shape.svg');
            -webkit-mask-mode: alpha;
            -webkit-mask-repeat: no-repeat;
            -webkit-mask-position: top;
        }

        .tagcloud .content {
            padding: 48px 32px;
        }

            .tagcloud .content h2 {
                color: var(--Yellow-default, #F9EE47);
                font-size: 64px;
                font-weight: 700;
                line-height: 120%;
                text-align: center;
                text-shadow: var(--text-outline-brown);
            }

            .tagcloud .content .tags {
                max-width: 860px;
                display: flex;
                flex-wrap: wrap;
                justify-content: center;
                margin: 12px auto -24px auto;
            }

                .tagcloud .content .tags .tag {
                    display: flex;
                    align-items: center;
                    height: 44px;
                    font-size: 12px;
                    font-weight: 700;
                    line-height: 120%;
                    text-align: center;
                    text-transform: uppercase;
                    border-width: 1px;
                    border-style: solid;
                    border-radius: 32px;
                    padding: 2px 24px 0 24px;
                    margin: 0 12px 24px 12px;
                }

                .tagcloud .content .tags .tag:hover {
                    color: #032915 !important;
                }


/*	Page: About
-------------------------------------------*/

    .page-template-about .page-header {
        display: flex;
        min-height: 448px;
        align-items: center;
    }



/*	Section: Filters
-------------------------------------------*/

    .section-filters {
        margin: 64px 0 32px 0;
    }

        .page-header + .section-filters {
            margin-top: 0;
        }

    .section-filters .container {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

        .section-filters .button {
            position: relative;
        }

            .section-filters .button .trigger {
                min-width: 84px;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                color: var(--White---02, #F2EFEF);
                font-size: 12px;
                font-weight: 700;
                line-height: 120%;
                text-transform: uppercase;
                text-align: center;
                height: 42px;
                padding: 0 24px;
                border-radius: 100px;
                border: 1px solid var(--White---02, #F2EFEF);
                cursor: pointer;
            }

                .section-filters .button .trigger svg {
                    display: block;
                    transition: transform ease 0.3s;
                }

                .section-filters .button .trigger span {
                    margin-right: 10px;
                }

                .section-filters .button .trigger:hover {
                    color: var(--Green---Menta, #98FF98);
                    border-color: var(--Green---Menta, #98FF98);
                }

                    .section-filters .button .trigger:hover svg {
                        stroke: var(--Green---Menta, #98FF98);
                    }


    .section-filters .tags {
        display: flex;
        width: 100%;
        margin: 24px -6px -12px -6px;
    }

        .section-filters .tags .btag {
            margin: 0 6px 12px 6px;
        }





/*	Page: Blog Listing
-------------------------------------------*/

    /*
     *  Tags
     */
    .btag {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        height: 15px;
        color: var(--Green---Dark, #032915);
        text-align: center;
        font-size: 12px;
        font-weight: 700;
        line-height: 120%;
        text-transform: uppercase;
        border-radius: 12px;
        padding: 1px 12px 0 12px;
    }

        .btag.btag-1 {
            background: #24FF72;
        }

        .btag.btag-2 {
            background: #FFF44F;
        }

        .btag.btag-3 {
            background: #FF3C38;
        }

        .btag .close {
            padding: 3px 6px;
            margin-right: -6px;
            cursor: pointer;
        }


    /*
     *  Slider
     */
    .blog-slider {
        margin-top: 42px;
    }

        .blog-slider .swiper-slide {
            display: flex;
            align-items: flex-end;
            min-height: 728px;
            position: relative;
            overflow: hidden;
            border-radius: 16px;
        }

            .blog-slider .swiper-slide .image {
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                position: absolute;
            }

                .blog-slider .swiper-slide .image:before {
                    content: "";
                    top: 0;
                    left: 0;
                    right: 0;
                    bottom: 0;
                    position: absolute;
                    background: linear-gradient(1deg, #032915 0.63%, rgba(0, 0, 0, 0.00) 98.9%);
                }

                .blog-slider .swiper-slide .image img {
                    width: 100%;
                    height: 100%;
                    border-radius: 17px;
                    object-fit: cover;
                    object-position: center;
                }

            .blog-slider .swiper-slide .content {
                z-index: 2;
                max-width: 770px;
                position: relative;
                padding: 0 42px 78px 42px;
            }

                .blog-slider .swiper-slide .content .tags {
                    display: flex;
                    flex-wrap: wrap;
                    margin-bottom: -12px;
                    padding-bottom: 4px;
                }

                    .blog-slider .swiper-slide .content .btag {
                        margin-right: 12px;
                        margin-bottom: 12px;
                    }

                .blog-slider .swiper-slide .content h2 {
                    color: var(--White---01, #FAFAFA);
                    font-size: 42px;
                    font-weight: 700;
                    line-height: 120%;
                    margin-bottom: 5px;
                }

                    .blog-slider .swiper-slide .content h2 a:hover {
                        color: var(--Green---Menta, #98FF98);
                    }

                .blog-slider .swiper-slide .content p {
                    color: var(--White---02, #F2EFEF);
                    font-size: 24px;
                    font-weight: 400;
                    line-height: 120%;
                }

        .blog-slider .swiper-pagination {
            width: auto;
            left: 42px;
            bottom: 42px;
            position: absolute;
        }

            .blog-slider .swiper-pagination-bullet {
                opacity: 1;
                width: 12px;
                height: 12px;
                border-radius: 200px;
                background: var(--White---04, #A3A3A3);
                transition: all ease 0.3s;
                cursor: pointer;
            }

                .blog-slider .swiper-pagination-bullet:hover {
                    background: var(--Green---Menta, #98FF98);
                }

            .blog-slider .swiper-pagination-bullet-active {
                width: 24px;
                background: var(--Green---Menta, #98FF98);
            }


    /*
     *  Post item
     */
    .blog-card {
        display: block;
        width: 100%;
        max-width: 416px;
    }

        .blog-card .image {
            display: block;
            width: 100%;
            overflow: hidden;
            position: relative;
            padding-bottom: 97%;
            border-radius: 18px;
        }

            .blog-card .image:before {
                content: "";
                top: 0;
                left: 0;
                opacity: 0;
                z-index: 2;
                width: 100%;
                height: 100%;
                position: absolute;
                border-radius: 18px;
                border: 1px solid var(--Green---Menta, #98FF98);
                box-sizing: border-box;
                transition: all ease 0.3s;
            }

            .blog-card .image img {
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                object-fit: cover;
                object-position: center;
                position: absolute;
                transition: all ease 0.3s;
            }

        .blog-card .tags {
            display: flex;
            flex-wrap: wrap;
            padding-bottom: 8px;
            margin: 24px -6px -12px -6px;
        }

            .blog-card .tags .btag {
                margin: 0 6px 12px 6px;
            }

        .blog-card h3 {
            color: var(--White---01, #FAFAFA);
            font-size: 24px;
            font-weight: 700;
            line-height: 120%;
            transition: all ease 0.3s;
        }

        .blog-card .date {
            color: var(--White---02, #F2EFEF);
            font-size: 12px;
            font-weight: 400;
            line-height: 120%;
            text-transform: uppercase;
            margin: 5px 0;
        }

        .blog-card p {
            color: var(--White---02, #F2EFEF);
        }

    .blog-card:hover {

    }

        .blog-card:hover .image:before {
            opacity: 1;
        }

        .blog-card:hover .image img {
            transform: scale(1.05);
        }

        .blog-card:hover h3 {
            color: var(--Green---Menta, #98FF98);
        }


    /*
     *  Blog listing
     */
    .page-blog-listing .items {
        display: flex;
        flex-wrap: wrap;
        margin: 0 -12px -24px -12px;
    }

        .page-blog-listing .blog-card {
            width: calc(33.3333% - 24px);
            margin: 0 12px 24px 12px;
        }

        .page-blog-listing .banner {
            margin: 48px 0;
        }


/*	Page: Blog Single
-------------------------------------------*/

    /*
     *  Blog Header
     */
    .blog-header {
        margin-top: 64px;
    }

        .blog-header .breadcrumbs {
            margin-bottom: 20px;
            justify-content: flex-start;
        }

        .blog-header .tags {
            display: flex;
            margin: 0 -6px -12px -6px;
        }

            .blog-header .tags .btag {
                margin: 0 6px 12px 6px;
            }

        .blog-header h1 {
            color: var(--White---01, #FAFAFA);
            font-size: 42px;
            font-weight: 700;
            line-height: 120%;
        }

        .blog-header .meta {
            display: flex;
            color: var(--White---02, #F2EFEF);
            font-size: 16px;
            line-height: 150%;
            padding-top: 2px;
        }

            .blog-header .meta span {
                margin-right: 12px;
            }

        .blog-header p {
            max-width: 636px;
            color: var(--White---02, #F2EFEF);
            font-size: 24px;
            font-weight: 700;
            line-height: 150%;
            margin-top: 24px;
        }

        .share {
            display: flex;
            margin-top: 24px;
        }

            .share h4 {
                color: var(--White---02, #F2EFEF);
                font-size: 16px;
                font-weight: 400;
                line-height: 150%;
                margin-right: 8px;
            }

            .share .icon {
                display: flex;
                width: 24px;
                height: 24px;
                align-items: center;
                justify-content: center;
                border-radius: 100px;
                border: 2px solid var(--Green---Menta, #98FF98);
                background: var(--Green---Mid, #06351D);
                box-shadow: 2.14px 1.41px 0 0 var(--Green---Light, #098845);
                transition: all ease 0.2s;
            }

                .share .icon:hover {
                    transform: translate3d(2.14px, 1.41px, 0);
                    box-shadow: 0 0 0 0 var(--Green---Light, #098845);
                }

                .share .icon:hover svg[fill] {
                    fill: var(--Green---Menta, #98FF98);
                }

                .share .icon:hover svg[stroke] {
                    stroke: var(--Green---Menta, #98FF98);
                }

                .share .icon + .icon {
                    margin-left: 8px;
                }

    /*
     *  Featured image
     */
    .featured-image {
        width: 100%;
        margin: 48px 0;
        position: relative;
    }

        .featured-image .container {
            height: 728px;
        }

        .featured-image img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: center;
            border-radius: 16px;
        }


    /*
     *  Blog Content
     */
    .blog-content .bottom {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-top: 24px;
    }

        .blog-content .bottom .share {
            margin-top: 0;
        }

        .blog-content .bottom .meta {
            display: flex;
            color: var(--White---02, #F2EFEF);
            font-size: 16px;
            font-weight: 400;
            line-height: 150%;
        }

            .blog-content .bottom .meta span {
                margin-left: 12px;
            }


    /*
     *  Related posts
     */
    .related-posts {
        padding-top: 8px;
        padding-bottom: 85px;
        background: url('../img/related-posts-bg.svg') no-repeat 35% top / auto 100%;
    }

        .related-posts h2 {
            color: var(--Yellow-default, #F9EE47);
            font-size: 64px;
            font-weight: 700;
            line-height: 120%;
            text-align: center;
            text-shadow: var(--text-outline-brown);
            margin-bottom: 24px;
        }

        .related-posts .items {
            display: flex;
            margin: 0 -12px -45px -12px;
        }

            .related-posts .items .blog-card {
                width: calc(33.3333% - 24px);
                margin: 0 12px;
            }


/*	Section: Video
-------------------------------------------*/

    .video {
        padding-bottom: 110px;
    }

    .video .container {
        position: relative;
    }

        .video .top {
            top: -206px;
            left: 50%;
            width: 100%;
            max-width: 1254px;
            z-index: -1;
            bottom: 580px;
            position: absolute;
            transform: translateX(-50%);
        }

        .video .box {
            z-index: 3;
            display: block;
            position: relative;
            aspect-ratio: 1296/628;
            mask-image: url('../img/shape.svg');
            mask-mode: alpha;
            mask-repeat: no-repeat;
            mask-size: 100% 100%;
            mask-position: top;
            -webkit-mask-image: url('../img/shape.svg');
            -webkit-mask-mode: alpha;
            -webkit-mask-repeat: no-repeat;
            -webkit-mask-position: top;
        }

            .play {
                display: flex;
                flex-direction: column;
                top: 50%;
                left: 50%;
                z-index: 4;
                position: absolute;
                transform: translate(-50%, -50%);
            }

                .play img {
                    display: block;
                    width: 66px;
                    height: 66px;
                    margin: 0 auto 12px auto;
                }

                .play p {
                    color: var(--Yellow-default, #F9EE47);
                    font-size: 18px;
                    font-weight: 700;
                    line-height: 150%;
                    text-align: center;
                    text-shadow: var(--text-outline-brown-small);
                }

            .video .box video {
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                object-fit: cover;
                object-position: center;
                position: absolute;
            }

        .video .bottom {
            top: 100%;
            left: 50%;
            width: auto;
            max-width: none;
            height: 125px;
            margin-top: -20px;
            position: absolute;
            transform: translateX(-50%);
        }


/*	Section: Pod Slider
-------------------------------------------*/

    .pod-slider {
        margin-top: 64px;
    }

        .pod-slider > .container h3 {
            color: var(--Yellow-default, #F9EE47);
            font-size: 64px;
            font-weight: 700;
            line-height: 120%;
            text-align: center;
            text-shadow: var(--text-outline-brown);
            margin-bottom: 22px;
        }

        .pods-slider .swiper {
            margin-bottom: -22px;
        }

        .pod-slider .swiper-slide {
            width: 416px;
            padding-bottom: 22px;
        }

            .pod-slider .swiper-slide .monkie-card {
                width: 100%;
                box-shadow: 0 4px 22px 0 rgba(0, 0, 0, 0.42);
            }

        .pod-slider[data-type="video"] .swiper-slide {
            width: calc(47vw - 12px);
            max-width: 636px;
        }


/*	Page: MonkieSuli
-------------------------------------------*/

    .page-template-monkiesuli .page-header {
        padding-bottom: 24px;
    }

    /*
     *  Join
     */
    .join {
        margin-top: 5px;
    }

        .join img {
            z-index: 2;
            display: block;
            position: relative;
            margin: 0 auto -4px auto;
            height: 164px;
        }

        .join h2 {
            color: var(--Yellow-default, #F9EE47);
            font-size: 42px;
            font-weight: 700;
            line-height: 120%;
            text-align: center;
            text-shadow: var(--text-outline-brown);
        }

        .join .desc {
            max-width: 417px;
            color: var(--White---01, #FAFAFA);
            font-size: 18px;
            line-height: 150%;
            text-align: center;
            margin: 10px auto -6px auto;
        }


    /*
     *  Subscription
     */
    .page-template-elofizetesek .subscribe-cta {
        margin-top: 0;
    }

        .page-template-elofizetesek .subscribe-cta p {
            margin-top: 0;
        }



/*	Page: Videos (MonkieSuli)
-------------------------------------------*/

    .page-template-videos .page-header {
        /*padding-bottom: 0;*/
    }

        .page-template-videos .page-header .qa {
            padding-bottom: 0;
        }

    .page-template-videos .section-filters {
        margin-top: 48px;
        margin-bottom: 48px;
    }

    /*
     *  Video Item
     */
    .video-item {

    }

        .video-item .image {
            display: flex;
            width: 100%;
            aspect-ratio: 634/356;
            align-items: center;
            justify-content: center;
            position: relative;
            overflow: hidden;
            border-radius: 16px;
        }

            .video-item .image .countdown {
                z-index: 2;
                position: relative;
            }

            .video-item .image img {
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                object-fit: cover;
                object-position: center;
                position: absolute;
                transition: all ease 0.3s;
            }

                .video-item .image img:hover {
                    transform: scale(1.05);
                }

                .video-item .image .countdown + img {
                    opacity: 0.24;
                }

            .video-item .image .seen {
                display: flex;
                align-items: center;
                justify-content: center;
                position: absolute;
                top: 24px;
                right: 24px;
                height: 16px;
                z-index: 2;
                color: var(--Green---Dark, #032915);
                font-size: 12px;
                font-weight: 700;
                line-height: 120%;
                text-transform: uppercase;
                text-align: center;
                border-radius: 12px;
                padding: 1px 12px 0 12px;
                background: var(--Yellow-default, #F9EE47);
            }

        .video-item .tags {
            display: flex;
            margin: 24px -6px 0 -6px;
        }

            .video-item .tags .btag {
                margin: 0 6px;
            }

        .video-item h3 {
            max-width: 510px;
            color: var(--White---01, #FAFAFA);
            font-size: 24px;
            font-weight: 700;
            line-height: 120%;
            margin-top: 5px;
        }

            .video-item h3 a:hover {
                color: var(--Green---Menta, #98FF98);
            }

        .video-item p {
            color: var(--White---02, #F2EFEF);
            font-size: 12px;
            font-weight: 400;
            line-height: 120%;
            text-transform: uppercase;
            margin-top: 2px;
        }

    /*
     *  Listing
     */
    .videos .container {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        margin-bottom: -24px;
    }

        .videos .video-item {
            width: calc(50% - 12px);
            margin-bottom: 24px;
        }


/*	Page: Single Video (MonkieSuli)
-------------------------------------------*/

    .single-lesson .page-header {
        padding-bottom: 40px;
    }

    .single-lesson .page-header .container:before {
        top: auto;
        bottom: -180px;
    }

    .single-lesson .video {
        padding-bottom: 48px;
    }

        .single-lesson .video .container {
            overflow: hidden;
            border-radius: 16px;
        }

        .single-lesson .video .countdown-wrapper {
            display: flex;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: 2;
            align-items: center;
            justify-content: center;
            position: absolute;
        }

        .single-lesson .video .responsive-video img {
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            position: absolute;
        }

        .single-lesson .video .countdown-wrapper + .responsive-video {
            opacity: 0.26;
        }


    /*
     *  Downloads
     */
    .downloads {
        margin-bottom: 48px;
    }

        .downloads .container {
            overflow: hidden;
            border-radius: 16px;
            border: 1px solid var(--Monkie-atmenet, #098845);
            background: var(--Green---Mid, #06351D);
        }

        .downloads .head {
            display: flex;
            align-items: center;
            padding: 24px;
            background: var(--Green---Dark, #032915);
        }

            .downloads .head h4 {
                color: var(--White---01, #FAFAFA);
                font-size: 24px;
                font-weight: 700;
                line-height: 120%;
                margin-left: 12px;
            }

        .downloads .list {
            padding: 48px 24px 60px 24px;
        }

            .downloads .list a {
                display: flex;
                align-items: center;
                justify-content: space-between;
                color: var(--White---02, #F2EFEF);
                font-size: 18px;
                font-weight: 700;
                line-height: 120%;
                padding-bottom: 12px;
                border-bottom: 1px solid var(--White---04, #A3A3A3);
            }

                .downloads .list a span {
                    max-width: calc(100% - 48px);
                }

                .downloads .list a:hover {
                    color: var(--Green---Menta, #98FF98);
                    border-bottom-color: var(--Green---Menta, #98FF98);
                }

                    .downloads .list a:hover svg {
                        stroke: var(--Green---Menta, #98FF98);
                    }

            .downloads .list a + a {
                margin-top: 24px;
            }


    /*
     *  Topics
     */
    .topics {

    }

    .topics .item {

    }

        .topics .item:after {
            content: "";
            display: block;
            width: 100%;
            height: 1px;
            margin-top: 24px;
            background: linear-gradient(270deg, #0CFF7F 0%, #098845 100%);
        }

            .topics .item.last:after {
                margin-top: 64px;
            }

        .topics .item .title {
            display: flex;
            justify-content: space-between;
            padding-bottom: 14px;
        }

            .topics .item .title h3 {
                color: var(--White---01, #FAFAFA);
                font-size: 32px;
                font-style: normal;
                font-weight: 700;
                line-height: 120%;
            }

            .topics .item .title time {
                color: var(--White---01, #FAFAFA);
                font-size: 14px;
                font-style: normal;
                font-weight: 400;
                line-height: 21px;
                padding-top: 5px;
            }

        .topics .item + .item {
            margin-top: 56px;
        }

        .topics .qa {
            margin-top: 24px;
        }


/*	Responsive
-------------------------------------------*/

@media (max-width: 1023px)
{

}

@media (max-width: 767px)
{

}


