/* ------------------------------ */
/* ----------- Iconset ---------- */
/* ------------------------------ */

/* General */
.iconset {
    position: relative;
}

.iconset:not(.iconset--after)::before, .iconset--after::after, .iconset--before::before, .iconset--hover::after, .quform-input-select::after {
    content: "";
    position: absolute;
    background-image: url('/wp-content/themes/riverside-restaurant-child/img/iconset.svg');
    background-size: 202px;
    background-repeat: no-repeat;
}

.iconset--hover::before, .iconset--hover::after {
    -webkit-transition: var(--transition-2);
    -o-transition: var(--transition-2);
    transition: var(--transition-2);
}

.iconset--hover::after, .no-touchevents .iconset--hover:hover::before {
    opacity: 0;
}


/* Example */
.iconset--example::before, .iconset--example::after {
    top: 5px;
    left: 0;
    height: 24px;
    width: 24px;   
}

.iconset--example::before {
    background-position: -1px -76px;
}

.iconset--example::after {
    background-position: -29px -76px;
}


/* Arrow small */
.iconset--arrow-small::before, .iconset--arrow-small::after {
    top: 2px;
    width: 17px;
    height: 17px;
    background-position: -3px -3px;
    -webkit-transition: var(--transition-1);
    -o-transition: var(--transition-1);
    transition: var(--transition-1);
}

.iconset--arrow-small::before {
    right: 0;
}

.link_container .iconset--arrow-small::before, .link_container .iconset--arrow-small::after {
    top: 11px;
}

.link_container .iconset--arrow-small::after {
    left: calc(var(--spacing-3) * -1);
}



/* Arrow small circle */
.iconset--arrow-small-circle::before, .iconset--after.iconset--arrow-small-circle::after,
.iconset--arrow-small-left-circle::before, .iconset--after.iconset--arrow-small-left-circle::after {
    top: 0;
    width: 52px;
    height: 52px;
    -webkit-transition: var(--transition-1);
    -o-transition: var(--transition-1);
    transition: var(--transition-1);
}

.iconset--arrow-small-circle::before, .iconset--after.iconset--arrow-small-circle::after {
    background-position: -4px -68px;
}

.iconset--arrow-small-left-circle::before, .iconset--after.iconset--arrow-small-left-circle::after {
    background-position: -64px -68px;
}

.iconset--arrow-small-circle::before {
    right: 0;
}

.iconset--arrow-small-left-circle::before {
    left: 0;
}

.iconset--after.iconset--arrow-small-circle::after, .iconset--after.iconset--arrow-small-left-circle::after {
    opacity: 0;
}

.iconset--after.iconset--arrow-small-circle::after {
    left: calc(var(--spacing-7) * -1);
}

.iconset--after.iconset--arrow-small-left-circle::after {
    right: calc(var(--spacing-7) * -1);
}



/* Arrow middle */
.iconset--arrow-middle::before, .iconset--arrow-middle::after {
    width: 48px;
    height: 26px;
    background-position: -28px -3px;
}

.menu__category.iconset--after.iconset--arrow-middle::after {
    right: 20px;
    top: 14px;
}

.button--small .iconset--arrow-middle::before, .button--small .iconset--arrow-middle::after {
    top: -2px;
    -webkit-transition: var(--transition-1);
    -o-transition: var(--transition-1);
    transition: var(--transition-1);
}

.button--small .iconset--arrow-middle::before {
    left: calc(var(--spacing-6-5) * -1);
    opacity: 0;
}

.button--small .iconset--arrow-middle::after {
    right: 0;
    opacity: 1;
}



/* Arrow big */
.iconset--after.iconset--arrow-big::after {
    right: 0;
    top: 0;
    width: 62px;
    height: 29px;
    background-position: -91px -1px;
}



/* Arrow big down */
.iconset--arrow-big-down::before {
    bottom: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
    width: 34px;
    height: 91px;
    background-position: -161px 0px;
}



/* Wave */
.iconset--wave::before {
    left: 0;
    top: 0;
    width: 38px;
    height: 6px;
    background-position: -3px -39px;
    -webkit-transform-origin: top left;
        -ms-transform-origin: top left;
            transform-origin: top left;
}



/* Call-to-actions */
.iconset--reservation::before, .iconset--opening_hours::before, .iconset--phone::before, .iconset--mail::before {
    top: 50%;
    left: 25px;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
    width: 28px;
}

.iconset--opening_hours::before, .iconset--phone::before, .iconset--mail::before {
    height: 28px;
}

.iconset--reservation::before {
    height: 36px;
    background-position: -47px -31px;
}

.iconset--opening_hours::before {
    background-position: -82px -34px;
}

.iconset--phone::before {
    background-position: -116px -34px;
}

.iconset--mail::before {
    background-position: -124px -70px;
}


/* Social Media */
.iconset--instagram::before {
    z-index: 2;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    width: 22px;
    height: 22px;
    background-position: -1px -150px;
}




/* ------------------------------ */
/* -------- Media Queries ------- */
/* - Position changes or scaling - */
/* ------------------------------ */

@media all and (min-width: 992px) {

    .menu__categories.hover .menu__category.hover::after, .menu__categories:not(.hover) .menu__category.is-active::after {
        right: 0;
        opacity: 1;
    }

    .no-touchevents .iconset--hover:hover::after {
        opacity: 1;
    }

    .no-touchevents .iconset--after.iconset--arrow-small-circle:hover::before,
    .no-touchevents .other_events__event__button:hover .iconset--after.iconset--arrow-small-circle::before,
    .no-touchevents .iconset--after.iconset--arrow-small-left-circle:hover::before,
    .no-touchevents .other_events__event__button:hover .iconset--after.iconset--arrow-small-left-circle::before {
        opacity: 0;
    }
    
    .no-touchevents .iconset--after.iconset--arrow-small-circle:hover::before,
    .no-touchevents .other_events__event__button:hover .iconset--after.iconset--arrow-small-circle::before {
        right: calc(var(--spacing-7) * -1);
    }

    .no-touchevents .link_container a:hover + .iconset--arrow-small::before {
        right: calc(var(--spacing-3) * -1);
        opacity: 0;
    }
    
    .no-touchevents .link_container a:hover + .iconset--arrow-small::after {
        left: 0;
        opacity: 1;
    }

    .no-touchevents .iconset--after.iconset--arrow-small-left-circle:hover::after,
    .no-touchevents .other_events__event__button:hover .iconset--after.iconset--arrow-small-left-circle::after {
        right: 0;
    }
    
    .no-touchevents .iconset--after.iconset--arrow-small-circle:hover::after,
    .no-touchevents .other_events__event__button:hover .iconset--after.iconset--arrow-small-circle::after {
        left: 0;
    }
    
    .no-touchevents .iconset--after.iconset--arrow-small-circle:hover::after,
    .no-touchevents .other_events__event__button:hover .iconset--after.iconset--arrow-small-circle::after, 
    .no-touchevents .iconset--after.iconset--arrow-small-left-circle:hover::after,
    .no-touchevents .other_events__event__button:hover .iconset--after.iconset--arrow-small-left-circle::after {
        opacity: 1;
    }
    
    .no-touchevents .iconset--after.iconset--arrow-small-left-circle:hover::before,
    .no-touchevents .other_events__event__button:hover .iconset--after.iconset--arrow-small-left-circle::before {
        left: calc(var(--spacing-7) * -1);
    }

}

@media all and (min-width: 768px) {

    .no-touchevents .button--small .iconset--arrow-middle:hover::before, .no-touchevents .hover_container:hover .button--small .iconset--arrow-middle::before {
        opacity: 1;
        left: 0;
    }
    
    .no-touchevents .button--small .iconset--arrow-middle:hover::after, .no-touchevents .hover_container:hover .button--small .iconset--arrow-middle::after {
        opacity: 0;
        right: calc(var(--spacing-6-5) * -1);
    }

}

@media (max-width: 1399.98px) and (min-width: 1240px) {

    .iconset--wave::before {
        -webkit-transform: scale(.95);
            -ms-transform: scale(.95);
                transform: scale(.95);
    }

    .menu__category.iconset--after.iconset--arrow-middle::after {
        top: 12px;
    }

}


@media all and (max-width: 1399.98px) and (min-width: 768px) {

    .iconset--reservation::before, .iconset--opening_hours::before, .iconset--phone::before, .iconset--mail::before {
        -webkit-transform-origin: top left;
            -ms-transform-origin: top left;
                transform-origin: top left;
        -webkit-transform: translateY(-50%) scale(.95);
            -ms-transform: translateY(-50%) scale(.95);
                transform: translateY(-50%) scale(.95);
        margin-left: -6px; 
    }

}


@media all and (max-width: 1239.98px) and (min-width: 768px) {

    .iconset--arrow-small-circle::before, .iconset--after.iconset--arrow-small-circle::after,
    .iconset--arrow-small-left-circle::before, .iconset--after.iconset--arrow-small-left-circle::after,
    .iconset--arrow-middle::before, .iconset--arrow-middle::after, .iconset--after.iconset--arrow-big::after {
        -webkit-transform-origin: top left;
            -ms-transform-origin: top left;
                transform-origin: top left;
    }

    .iconset--arrow-small-circle::before, .iconset--after.iconset--arrow-small-circle::after,
    .iconset--arrow-small-left-circle::before, .iconset--after.iconset--arrow-small-left-circle::after, .iconset--after.iconset--arrow-big::after {
        -webkit-transform: scale(.95);
            -ms-transform: scale(.95);
                transform: scale(.95);
    }

    .iconset--wave::before, .iconset--arrow-middle::before, .iconset--arrow-middle::after {
        -webkit-transform: scale(.9);
            -ms-transform: scale(.9);
                transform: scale(.9);
    }

    .button--small .iconset--arrow-middle::before, .button--small .iconset--arrow-middle::after {
        top: -1px;
    }

    .menu__category.iconset--after.iconset--arrow-middle::after {
        top: 11px;
    }

    .link_container .iconset--arrow-small::before, .link_container .iconset--arrow-small::after {
        top: 10px;
    }

}


@media all and (max-width: 991.98px) {

    .iconset--arrow-middle-left::before {
        width: 34px;
        height: 20px;
        left: 0;
        top: 1px;
        background-position: -5px -126px;
    }

}


@media all and (max-width: 767.98px) {

    .iconset--reservation::before, .iconset--opening_hours::before, .iconset--phone::before, .iconset--mail::before, .iconset--arrow-middle::before, .iconset--arrow-middle::after, .iconset--arrow-small-circle::before {
        -webkit-transform-origin: top left;
            -ms-transform-origin: top left;
                transform-origin: top left;
    }

    .iconset--reservation::before, .iconset--opening_hours::before, .iconset--phone::before, .iconset--mail::before {
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%) scale(.925);
            -ms-transform: translate(-50%, -50%) scale(.925);
                transform: translate(-50%, -50%) scale(.925);
    }

    .iconset--arrow-middle::before, .iconset--arrow-middle::after {
        margin-top: -1px;
        -webkit-transform: scale(.7);
            -ms-transform: scale(.7);
                transform: scale(.7);
    }

    .iconset--arrow-big-down::before {
        bottom: -12px;
        -webkit-transform: translateX(-50%) scale(.75);
            -ms-transform: translateX(-50%) scale(.75);
                transform: translateX(-50%) scale(.75);
    }

    .iconset--wave::before {
        -webkit-transform: scale(.75);
            -ms-transform: scale(.75);
                transform: scale(.75);
    }

    .iconset--arrow-small-left-circle::before {
        left: 50%;
        -webkit-transform: translateX(-50%);
            -ms-transform: translateX(-50%);
                transform: translateX(-50%);
    }

    .iconset--arrow-small-circle::before {
        right: 50%;
        -webkit-transform: translateX(50%) scale(.96);
            -ms-transform: translateX(50%) scale(.96);
                transform: translateX(50%) scale(.96);
    }

    .button--small .iconset--arrow-middle::before, .button--small .iconset--arrow-middle::after {
        top: 2px;
    }

    .link_container .iconset--arrow-small::before {
        top: 10px;
    }

}