/*

┏━━━┓ ┏┓ ┏┓ ┏━━━┓ ┏━━━━┓ ┏━━━┓ ┏━┓┏━┓   ┏━━━┓ ┏━━━┓ ┏━━━┓
┃┏━┓┃ ┃┃ ┃┃ ┃┏━┓┃ ┃┏┓┏┓┃ ┃┏━┓┃ ┃ ┗┛ ┃   ┃┏━┓┃ ┃┏━┓┃ ┃┏━┓┃
┃┃ ┗┛ ┃┃ ┃┃ ┃┗━━┓ ┗┛┃┃┗┛ ┃┃ ┃┃ ┃┏┓┏┓┃   ┃┃ ┗┛ ┃┗━━┓ ┃┗━━┓
┃┃ ┏┓ ┃┃ ┃┃ ┗━━┓┃   ┃┃   ┃┃ ┃┃ ┃┃┃┃┃┃   ┃┃ ┏┓ ┗━━┓┃ ┗━━┓┃
┃┗━┛┃ ┃┗━┛┃ ┃┗━┛┃   ┃┃   ┃┗━┛┃ ┃┃┃┃┃┃   ┃┗━┛┃ ┃┗━┛┃ ┃┗━┛┃
┗━━━┛ ┗━━━┛ ┗━━━┛   ┗┛   ┗━━━┛ ┗┛┗┛┗┛ ▀ ┗━━━┛ ┗━━━┛ ┗━━━┛ - "CUSTOM STYLESHEET"

DESIGN BY © LO STUDIO

CUSTOM.CSS STYLESHEET FOR => " ___NOME_SITO___ "

BASE (MOBILE) SIZE


/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞


.ratio-1-1, .squared { padding-bottom: 100%; }      =>  1:1     -> padding-bottom: calc(100% * 1 / 1);
.ratio-16-9 { padding-bottom: 56.25%; }             =>  16:9    -> padding-bottom: calc(100% * 9 / 16);
.ratio-4-3 { padding-bottom: 75%; }                 =>  4:3     -> padding-bottom: calc(100% * 3 / 4);
.ratio-3-2 { padding-bottom: calc(100% * 3 / 4); }  =>  3:2     -> padding-bottom: calc(100% * 2 / 3);
.ratio-8-5 { padding-bottom: 62.5%; }               =>  8:5     -> padding-bottom: calc(100% * 8 / 5); 


*/





/**
 *
 *  ▐▌ ▐▌  ▄▀▀▄  █▀▀▄  ▄▀▀
 *   ▀▄▀   █▀▀█  █▐█▀   ▀▄
 *    ▀    ▀  ▀  ▀ ▀▀  ▀▀  - VARS
 *
 * ░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
 */


.primary_font { font-family: var(--title-font); }
.upper { text-transform: uppercase; }



.search_sec { text-align: center; padding: 0 1.5rem; background-color: rgba(var(--red-rgb),0.95); position: fixed; top: 0; z-index: 10; display: none; }
.search_sec p { color: #fff; font-size: calc(var(--rem) * 2.5); line-height: 1.2; }

.search_sec .close { position: absolute; top: 1rem; right: 1rem; height: 2rem; }


/**
 *
 *  █  █  █▀▀  ▄▀▀▄  █▀▀▄  █▀▀  █▀▀▄
 *  █▀▀█  █▀▀  █▀▀█  █  █  █▀▀  █▐█▀
 *  ▀  ▀  ▀▀▀  ▀  ▀  ▀▀▀   ▀▀▀  ▀ ▀▀ - HEADER
 *
 * ░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
 */


header { z-index: 4; }
.head_wrapper { padding: 1em 2.5%; z-index: 2; }


a.fixed_btn:after { content: "\2794"; margin-left: .7rem; }
a.fixed_btn { position: sticky; top: 0; width: 100%; background-color: var(--red); color: #fff; font-weight: 600; z-index: 4; text-align: center; padding: .6rem;
    border-bottom: 1px solid #fff; }


/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ LOGO ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.head_logo { 
    display: inline-block; 
    --head-logo-width: 60px; /* <- in 'px' */
    --head-logo-min: 60;
    --head-logo-max: 150;
    max-width: 150px;
}
.head_logo img, .foot_logo img { width: 100%; }




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ HEAD CONTENT ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.link_white.link_menu { display: none; }

.link_menu { margin: 0 .6rem; }

.link_menu svg { height: calc(var(--rem) * 1.8); transition: .3s ease; }
.link_menu svg .st0 { fill: var(--red); }

.link_menu svg:hover { transform: scale(.95); }




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ HAMBURGER / MENU ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/


.hamburger_btn { 
    display: inline-block;
    font-size: 20px; line-height: 0;
    --hamburger-px: 15px;
    --hamburger-min: 15;
    --hamburger-max: 20;
    padding: .5em;
}

/* Included style from "hamburger.css" */
.hamburger {
    position: relative; display: inline-block;
    width: 2.4em; height: 1.5em;
    transition: .15s linear;
}
.top_bun, .burger, .bottom_bun {
    display: block; position: absolute;
    width: 2.4em; height: .15em;
    background-color: var(--red);
    text-shadow: 0 0 5px rgba(30,30,30,.8);
    border-radius: .4em;
    transition: .125s ease;
}
.top_bun { top: -.1em; }
.burger { top: calc(50% - .1em); }
.bottom_bun { bottom: -.1em; }


/* Tapped / Clicked */
.tapped .hamburger--boring span { transform-origin: center; background-color: var(--black); }
.tapped .hamburger--boring .burger, .tapped .hamburger--boring:hover .burger { opacity: 0; }
.tapped .hamburger--boring .top_bun, .tapped .hamburger--boring:hover .top_bun { top: 0; transform: rotate(45deg) translate(.5em, .5em); }
.tapped .hamburger--boring .bottom_bun, .tapped .hamburger--boring:hover .bottom_bun { bottom: 0; transform: rotate(-45deg) translate(0.5em, -0.5em); }




/* Animation */

/* SONO TUTTE DA SISTEMARE, PER ORA NON UTILIZZARE O TORNARE ALLA VECCHIA VERSIONE! */

.hamburger--boring:hover .burger { transform: scale(.9); }


/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ NAV MENU ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.main_nav { 
    display: none; 
    position: absolute; top: 0; left: 0;
    z-index: 1;
}
.menu_wrapper { background-color: #fff; }
.menu_bkg { width: 50%; top: 0; right: 0; }
.menu_bkg img { width: 100%; height: 100%; object-fit: cover; opacity: 0; position: absolute; top: 0; left: 0; }

.menu_bkg .img_menu.active { opacity: 1; }

.head_menu { padding: 5%; }

.head_menu li {}
.head_menu li:first-child {}
.head_menu li:last-child {}
.head_menu li.current-menu-item {}

.head_menu a { display: inline-block; font-size: 1.5em; line-height: 1; padding: .25em; color: #1e1e1e; transition: .3s ease; }
.head_menu li:hover a, .head_menu li:active a, .head_menu li:focus a { transform: translateX(10px); }




.open-menu .link_menu svg .st0 { fill: var(--white); }
.open-menu .link_menu.link_white { border-color: var(--white); color: var(--white); }
.open-menu .head_logo img.logo_home { filter: invert(0); }


/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ DARKMODE SWITCHER ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/








/**
 *
 *  ▄▀▀▄  ▄▀▀  ▄▀▀  █▀▀  ▀▀█▀▀  ▄▀▀
 *  █▀▀█   ▀▄   ▀▄  █▀▀    █     ▀▄
 *  ▀  ▀  ▀▀   ▀▀   ▀▀▀    ▀    ▀▀  - ASSETS
 *
 * ░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
 */


/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ BUTTONS STYLE ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.btn {
    display: inline-block; position: relative; font: inherit; color: #fff; padding: .5em 1em;
    border: 1px solid var(--red); background-color: var(--red); font-size: var(--rem); border-radius: 10rem;
}
.btn:hover, .btn:focus { background-color: ; color: ; }
.btn:active { transform: translateY(1px); }





/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ LINKS STYLE ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

a.link_btn {
    display: inline-block; position: relative; font: inherit; padding: .8em 2em;
    border: 2px solid var(--red); font-weight: 600; font-size: var(--rem);
    background-color: var(--red); color: #fff; border-radius: 10rem;
}

a.link_red { background-color: var(--red); color: #fff; border-radius: 10rem; border-color: var(--red); }
a.link_white { background-color: transparent; color: #fff; border-radius: 10rem; border-color: var(--white); }

a.link_red:hover { background-color: rgba(var(--red-rgb),.6);  }
a.link_white:hover { background-color: rgba(255,255,255,.4); }


a.link_grey { background-color: #fff; color: #6d6d6d; border-radius: 10rem; border-color: #6d6d6d; }
a.link_grey:hover { background-color: #ccc; color: #fff; }


/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ FILTERS STYLE ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.filter_color {
    background-color: var(--color);
    mix-blend-mode: multiply;
    opacity: .5;
}

.filter_white { background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(255,255,255,0.1) 25%, rgba(255,255,255,0) 100%);
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(255,255,255,0.1) 25%,rgba(255,255,255,0) 100%);
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(255,255,255,0.1) 25%,rgba(255,255,255,0) 100%); }


/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ SECTION 1 ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.masked_thumb {
    background-color: var(--red);
    margin: 9rem 0 1rem 0;
    height: 10rem;
    background-image: url(../images/jpg/cissva.jpg);
}


.s1_title { text-align: center; }


.s1_title h1, .s1_title h2, .s1_title p { color: var(--red); }
#s1_home .s1_title h1, #s1_home .s1_title h2, #s1_home .s1_title p { color: #fff; }
.s1_title a.link_btn:nth-of-type(2) { margin-top: 1.5rem; }

.like_button { background-color: var(--red); color: #fff !important; font-family: var(--main-font); font-size: calc(var(--rem) * .8); padding: .6rem 1.7rem .5rem 1.7rem;
    margin: 0 auto; margin-bottom: 2rem; border-radius: 10rem; letter-spacing: 1px; font-weight: 400; width: fit-content; }




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ BREADCRUMBS ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.breadcrumb, .breadcrumb a, .breadcrumb span { color: var(--white); }




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ SCROLL BUTTON ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.scroll {
    display: inline-block;
    position: absolute; left: 50%; bottom: 5%;
    --scroll-px: 40px;
    --scroll-min: 40;
    --scroll-max: 60;
    max-width: 60px;
    transform: translate(-50%, -50%);
    cursor: pointer; z-index: 1;
}
.scroll svg { 
    width: 100%; 
    animation: hang_scroll 1.5s ease-in-out infinite forwards alternate;
    animation-play-state: running;
}
@keyframes hang_scroll {
    0% { transform: translateY(.5em); }
    50% { transform: translateY(0); }
    100% { transform: translateY(.5em); }
}
.scroll:hover svg, .scroll:focus svg, .scroll:active svg { animation-play-state: paused; }
.scroll svg .scroll-path { fill: var(--black); }




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ COMPONENTS ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ CARD ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ CARD EMPTY ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ SIDEBAR ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ [...] ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/


.slider_nav { width: 2em; top: 50%; transform: translateY(-50%); z-index: 1; }
.slider_prev { left: 0; }
.slider_next { right: 0; }
.slider_nav img { width: 100%; }

.slider_nav.swiper-button-disabled { display: none; }







/**
 *
 *  █▀▀  ▄▀▀▄  ▄▀▀▄  ▀▀█▀▀  █▀▀  █▀▀▄
 *  █▀▀  █  █  █  █    █    █▀▀  █▐█▀
 *  ▀     ▀▀    ▀▀     ▀    ▀▀▀  ▀ ▀▀ - FOOTER
 *
 * ░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
 */

.form_container { border: 1px solid var(--red); padding: .8rem; text-align: center; }

#mailpoet_form_1 { margin: 1.5rem 0; }
#mailpoet_form_1 form.mailpoet_form { padding: 0 !important; }
#s_news #mailpoet_form_1 .mail-input, #s_news #mailpoet_form_1 .submit-input { display: inline-block; width: 100%; }

#s_news #mailpoet_form_1 .mail-input input {
    background-color: #fff;
    box-shadow: 0 0 10px rgb(30 30 30 / 20%);
    height: auto;
    padding: 0.9rem 1.5rem !important;
    border-radius: 10rem;
    font-size: var(--rem);
    border: 2px solid #fff;
    width: 20rem !important;
    max-width: 100%;
    line-height: 1.4;
}

#mailpoet_form_1 .submit-input input {
    width: 100% !important;
    padding: 0.9rem 2.5rem !important;
    border-radius: 10rem;
    background-color: var(--red);
    color: #fff;
    font-size: var(--rem);
    border: 2px solid var(--red);
    line-height: 1.4;
    letter-spacing: 2px;
}


.sconto img { max-width: 8rem; margin-right: 1rem; filter: drop-shadow(0 0 20px rgba(30,30,30,.2)); }




.formaggi-cissva { position: absolute; right: 0; top: 5%; width: 100%; z-index: -1; opacity: .2; }








/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ FOOTER CONTENT ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

footer { background-image: url(../images/jpg/Castle_in_Breno_Valcamonica.jpg); background-position: bottom center; background-size: cover; background-repeat: no-repeat; }


.foot_logo { 
    display: block; 
    --foot-logo-width: 150px;
    --foot-logo-min: 80;
    --foot-logo-max: 360;
    max-width: 360px;
}


.foot_block { margin: 1rem 0; }
.foot_block h3 { color: var(--red); }

.foot_block p { margin: 1.3rem 0; }
.foot_block p a { display: inline-block; }


.ico { padding-left: calc(var(--rem) * 2.4); position: relative; }
.ico:before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); background: center no-repeat; background-size: contain;
    width: calc(var(--rem) * 1.8); height: calc(var(--rem) * 1.8); }

.ico-marker:before { background-image: url(../images/svg/marker.svg); }
.ico-tel:before { background-image: url(../images/svg/telefono.svg); }
.ico-mail:before { background-image: url(../images/svg/mail.svg); }




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ CREDITS ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.credits { font-size: .825em; line-height: 1.5; color: #fff; font-weight: 600; text-shadow: 0 0 11px rgba(30,30,30,1);
    margin: 0 auto; text-align: center; margin-top: 45vh; z-index: 1; }

.credits .resp_sep { display: none; }
.credits a { display: inline-block; color: inherit; font-size: 1em; }
.credits a:active, .credits a:focus { opacity: 1; }




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ BACK TO TOP ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.back_top {
    display: none; 
    position: fixed; bottom: .5em; right: .5em;
    padding: .25em;
    --back-top-px: 40px;
    --back-top-min: 40;
    --back-top-max: 60;
    max-width: 60px;
    z-index: 2;
}
.back_top img { width: 100%; }








/**
 *
 *  █  █  ▄▀▀▄  █▄ ▄█  █▀▀
 *  █▀▀█  █  █  █ █ █  █▀▀
 *  ▀  ▀   ▀▀   ▀   ▀  ▀▀▀ - HOMEPAGE
 *
 * ░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
 */


/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ SECTION 1 ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

/*#s1_home { border-radius: 0 0 0% 10rem; overflow: hidden; }*/









/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ SECTION 2 ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.swiper_dots { margin-top: 2rem; }
.swiper_dots .swiper-pagination-bullet { background-color: #fff; border: 1px solid var(--red); margin: 0 .2em; width: .7rem; height: .7rem; opacity: 1; transition: .3s ease; }
.swiper_dots .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: var(--red); width: .8rem; height: .8rem; }



/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ SECTION 3 ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.container_tax { margin-top: 2rem; grid-gap: 1rem; display: grid; grid-template-columns: 1fr; }

.box_cat { height: 20rem; border-radius: 1rem; overflow: hidden; background-color: var(--red); }
.box_cat .bkg_abs { transition: .2s ease; }
.box_cat img { height: 8rem; background-color: rgba(255,255,255,.3); padding: 1.3rem; border-radius: 50%; transition: .3s ease; }

.box_cat .cat_name { position: absolute; top: 50%; left: 50%; width: 80%; transform: translate(-50%, -49%); text-transform: uppercase; font-size: calc(var(--rem) * 2.2);
    font-family: var(--second-font); letter-spacing: 5px; text-align: center; transition: .4s ease; opacity: 0;  color: #fff; }


.box_cat:hover .cat_name { opacity: 1; }
.box_cat:hover .bkg_abs { opacity: .5; }
.box_cat:hover img { opacity: 0; }


/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ SECTION [...] ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/








/**
 *
 *  █▀▀▄  ▄▀▀▄  ▄▀▀▀   █▀▀  ▄▀▀
 *  █  █  █▀▀█  █  ▀▌  █▀▀   ▀▄
 *  █▀▀   ▀  ▀   ▀▀▀   ▀▀▀  ▀▀  - TEMPLATES _ PAGINE
 *
 * ░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
 */


.delivery_home { background-color: var(--red); padding: 1.5rem; padding-bottom: 0; }
.delivery_home h2 { font-size: calc(var(--h2-size) * 1); color: #fff; margin-bottom: 1rem; }
.delivery_home img { display: block; margin: 0 auto; height: auto; max-width: 80%; margin-top: 5%; }



.text_cont p { font-size: 120%; margin: .8rem 0; }
.text_cont p a { font-size: 100%; display: inline-block; font-weight: 550; }
.text_cont p a:hover { color: var(--red); }



.box_content_ids-field { clip: rect(1px,1px,1px,1px); height: 1px; overflow: hidden; position: absolute!important; width: 1px; }
.box_price_cart .cart button.single_add_to_cart_button:disabled { cursor: no-drop !important; color: #ccc; border-color: #ccc; }





.xoo-wsc-qty-price { margin-top: 1rem; }

.xoo-wsc-ft-buttons-cont .xoo-wsc-ft-btn-continue { background-color: #fff; color: var(--red); }
.xoo-wsc-ft-buttons-cont .xoo-wsc-ft-btn-continue:hover { color: #fff; }
span.xoo-wsch-close { font-size: 1.5rem; }




/**
 *
 *  ▄▀▀▄  █▀▀▄  ▄▀▀▀  █  █  ▀  ▐▌ ▐▌  █▀▀
 *  █▀▀█  █▐█▀  █     █▀▀█  █   ▀▄▀   █▀▀
 *  ▀  ▀  ▀ ▀▀   ▀▀▀  ▀  ▀  ▀    ▀    ▀▀▀ - TEMPLATES _ ARCHIVIO
 *
 * ░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
 */

.pagination { margin-top: 5%; }
.pagination li { border-image: 1px solid #ccc; }
.pagination a, .pagination span { color: var(--red); }
.pagination .current { color: var(--red); font-weight: 700; }







/**
 *
 *  ▄▀▀  ▀  █▄ █  ▄▀▀▀   █     █▀▀
 *   ▀▄  █  █ ▀█  █  ▀▌  █  ▄  █▀▀
 *  ▀▀   ▀  ▀  ▀   ▀▀▀   ▀▀▀▀  ▀▀▀ - SINGLE
 *
 * ░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
 */


/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ SECTION 1 ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.s1_title h3 { color: var(--red); font-family: var(--main-font); font-size: calc(var(--rem) * 1.8); }


.sottotitolo_product { font-size: calc(var(--rem) * 3.5); color: var(--red); font-family: var(--title-font); }

.single_content p { line-height: 2rem; font-weight: 600; }

.single_content .cart { display: flex; align-items: center; justify-content: flex-start; }
.single_content .quantity input {
    background-color: transparent; border: 2px solid var(--red); border-radius: 1rem 0 0 1rem; color: var(--red); font-weight: 500;
    font-size: var(--rem); padding: .5rem; width: 3rem; margin: 0; height: 2.5em;
}
.cart button.single_add_to_cart_button {
    background-color: transparent; border: 2px solid var(--red); border-left: 0; border-radius: 0 1rem 1rem 0; color: var(--red); font-weight: 500; margin: 0; height: 2.5em;
    font-size: var(--rem); padding: .5rem 3rem .5rem 1rem; background: calc(100% - 1rem) center no-repeat; background-size: calc(var(--rem) * 1.1);
    background-image: url(../images/svg/cart-red.svg);
}
.cart button.single_add_to_cart_button:hover { background-color: rgba(var(--red-rgb), .5); color: #fff; background-image: url(../images/svg/cart.svg); }






.dettagli h3 { margin: 0; font-weight: 500; font-size: 150%; font-family: var(--main-font); color: var(--red); }
.dettagli li { margin: .7rem 0; list-style: none; }



.card_faq { margin: .8rem 0; padding: 1rem; border-radius: 1rem; border: 1px solid #ccc; cursor: pointer; }
.faq_head { padding-right: 2rem; }
.faq_head h3 { margin: 0; font-weight: 500; font-size: 120%; font-family: var(--main-font); color: var(--red); }
.faq_content { display: none; margin-top: 1.5rem; }
.faq_content p { line-height: 1.4; font-size: 90%; font-weight: 500; }


.faq_head:after { content: "+"; position: absolute; right: .5rem; font-size: 1.5rem; top: 50%; transform: translateY(-50%); color: var(--red); }
.faq_head.active:after { content: "-"; }
.faq_head.active h3 { border-bottom: 1px solid #ccc; padding-bottom: .5rem; }




.icona { height: 5rem; margin: .5rem; display: inline-block; }







/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ CUSTOM BOX ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

.to_box { background-color: var(--red); padding: 1rem; display: block; position: sticky; bottom: 0; z-index: 10; color: #fff; text-transform: uppercase; font-weight: 600;
    font-size: calc(var(--red) * 2); }

.desc_cesto { margin-bottom: 1.5rem; text-align: center; }
.desc_cesto p { font-size: calc(var(--rem) * 2); color: var(--red); font-family: var(--second-font); font-weight: 600; }

.mybox_loader { justify-content: space-between; }
.box-item { width: calc((100% / 2) - .8rem); height: 12rem; margin: .4rem; border: var(--red) 3px dashed; border-radius: 1rem; flex-grow: 1; }
.box-item a { height: 100%; }

.box-item.full { border: var(--red) 3px solid; background-color: #fff; }

.box-item.full a { display: flex; align-items: center; justify-content: center; flex-direction: column; }
.box-item.full a img { height: 9rem; width: auto; object-fit: contain; }
.box-item.full a small { color: var(--red); font-weight: 550; }

#loading-animation { display: flex; align-items: center; justify-content: center; width: 100%; }
#loading-animation img { width: 3.5rem; }


/*
#category-menu { margin-bottom: 2rem; position: sticky; top: 0; background-color: #fff; padding: 1rem; z-index: 3; }
#category-menu li { list-style: none; display: inline-block; }
#category-menu li a { border: var(--red) 1px solid; color: var(--red); padding: .4rem 1rem; margin: .2rem; border-radius: 10rem; font-weight: 600; }
#category-menu li a:hover { background-color: rgba(var(--red-rgb),.7); color: #fff; }
#category-menu li a.current { background-color: var(--red); color: #fff; }
*/



/* Filtro ricerca + select  */
.filter-content { margin-bottom: 2rem; position: sticky; top: 0; background-color: #fff; padding: 1.5rem 1rem; z-index: 3;  }
.filter-content select, .filter-content input#search_prod { width: calc(50% - 1rem); margin: 0 .5rem; }
.filter-content select {
    background-color: #fff; border: 1px solid var(--red); font-size: 100%; height: auto; padding: .4rem 1rem;
    background-position: calc(100% - 1rem); background-size: var(--rem);
}
.filter-content input#search_prod {
    background-color: #fff; border: 1px solid var(--red); font-size: 100%; height: auto; padding: .4rem 1rem;
    background-image: url(../images/svg/search-grey.svg); background-position: calc(100% - 1rem); background-size: var(--rem);
}




#category-post-content { display: grid; grid-template-columns: 1fr; }
.card-box { padding: 1.5rem; }
.card-box .card_content h2 { font-size: calc(var(--rem) * 2); }
.price { font-size: calc(var(--rem) * 0.8); }



/* Overlay schedine  */
.card.card-box { transition: .2s ease; }

.remove_card { background-color: var(--red); background-size: .8rem; background-image: url(../images/svg/remove.svg); width: 1.8rem; height: 1.8rem; 
    border-radius: .4rem; position: absolute; top: 0.5rem; right: 0.5rem; z-index: 2; }
.added {
    position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); display: none;
    background-color: #fff; border: 2px solid var(--red); border-radius: .4rem; width: 100%; min-height: 2.7rem; box-shadow: 0 0 10px rgba(var(--red-rgb),0.4);
    z-index: 3; color: var(--red); font-weight: 550; padding: 1rem; font-size: calc(var(--rem) * 0.8); }
.addto {
    position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); opacity: 0; transition: .2s ease;
    background-color: #fff; border: 2px solid var(--red); border-radius: .4rem; width: 100%; min-height: 2.7rem;
    z-index: 2; color: var(--red); font-weight: 550; padding: 1rem; font-size: calc(var(--rem) * 0.8); }

.addto:after { content: "\279C"; margin-left: .5rem; }

.card.card-box:hover .addto { opacity: 1; }
.card.card-box:hover { box-shadow: 0 0 20px rgba(30,30,30,.2); border-radius: 1rem; }



/* Box prezzo + add to cart fisso in basso */
.box_price_cart { background-color: var(--red); position: sticky; bottom: 0; z-index: 3; }
.box_price_cart::after {
    display: inline-block;
    content: '';
    position: absolute;
    left: 50%;
    top: 0;
    border-left: 1em solid transparent;
    border-right: 1em solid transparent;
    border-bottom: .75rem solid var(--red);
    transform: translate(-50%, calc(-100% + 1px));
}
.box_price_cart .cart_custom_box { display: flex; align-items: center; justify-content: center; }
.box_price_cart .quantity input {background-color: transparent;
    border: 2px solid var(--white);
    border-radius: 1rem 0 0 1rem;
    color: var(--white);
    font-weight: 500;
    font-size: var(--rem);
    padding: .5rem;
    width: 3rem;
    margin: 0;
    height: 2.5em;
}
.box_price_cart .cart button.single_add_to_cart_button {
    border: 2px solid var(--white);
    border-left: 0;
    background-color: transparent;
    color: var(--white);
    background-image: url(../images/svg/cart.svg);
}
.box_price_cart .cart button.single_add_to_cart_button:hover { background-color: rgba(255,255,255,.4); }
.box_price_cart .price { color: #fff; font-size: 120%; }


.box_price_cart { padding: .5rem; transition: .3s ease; }
.box_price_cart .box_price_cart_i { transform: scale(.8); transition: .3s ease; }

.box_price_cart.complete { padding: 1rem; }
.box_price_cart.complete .box_price_cart_i { transform: scale(1); }




.raggiunto_massimo { position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 5; display: none; }
.raggiunto_massimo p { background-color: var(--red); color: #fff; padding: 1.2rem 2.5rem; font-size: 150%; border-radius: 1rem; }
.raggiunto_massimo p:before { content: "\2713"; margin-right: .5rem; font-size: 140%; }






/* Prezzo accumulativo nascosto  */
#ywcnp_form_name_your_price { display: none !important; }

/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ SECTION [...] ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/








/**
 *
 *  █▀▀  ▄▀▀▄  █▀▀▄  █▄ ▄█
 *  █▀▀  █  █  █▐█▀  █ █ █
 *  ▀     ▀▀   ▀ ▀▀  ▀   ▀ - FORM
 *
 * ░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
 */


input[type="..."],
select,
textarea {}

input[type="..."]:focus, input[type="..."]:active,
select:focus, select:active,
textarea:focus, textarea:active {}

/* Animazioni */
input:focus {
    /* animation-name / animation-duration / animation-delay / animation-iteration-count */
    -webkit-animation: formanim 0.25s forwards;
    animation: formanim 0.25s forwards;
}
@-webkit-keyframes formanim {
    0% {}
    100% {}
}
@keyframes formanim {
    0% {}
    100% {}
}

input[type="checkbox"] { border: 1px solid #6d6d6d; width: 1.5em; height: 1.5em; color: #6d6d6d; }
input[type=checkbox]:checked { background: url(../images/svg/checked.svg) no-repeat center; background-size: 1.25em; }

input[type="..."].wpforms-error {}
input[type="..."].wpforms-error:hover {}

input[type="..."].wpforms-valid {}

input[type="..."][disabled] {}

select {}

textarea {}

/*
input[type=checkbox] {}
input[type=checkbox]:checked { background: url(../images/svg/checked.svg) no-repeat center; background-size: 2em; }
*/

input[type="submit"] {}
input[type="submit"]:hover {}
input[type="submit"]:focus, input[type="submit"]:active {}


/*
#form .wpforms-field-checkbox .wpforms-selected input { background-image: url(../images/svg/checked.svg); background-color: #fff; }
*/



#form { padding: 3%; box-shadow: 0 0 10px rgba(30,30,30,.2); border-radius: 1rem; }
#form .input-text input, #form .input-text textarea { border: 1px solid var(--red); border-radius: 0; border-radius: .4rem; }

#form .wpforms-submit { width: 100%; margin: 0; background-color: var(--red); color: #fff; font-size: 130%; padding: 1rem; border: 2px solid var(--red); border-radius: .4rem; }
#form .wpforms-submit:hover { background-color: rgba(var(--red-rgb),.6); }

#form .form-privacy a { display: inline-block; font-weight: 500; text-decoration: underline; }
#form .form-privacy input[type=checkbox] { width: 1rem; height: 1rem; }
#form .form-privacy input[type=checkbox]:checked { background: url(../images/svg/checked.svg) no-repeat center; background-size: .9rem; }





/**
 *
 *  █▀▀  █  █  ▀▀█▀▀  █▀▀▄  ▄▀▀▄
 *  █▀▀  ▄▀▀▄    █    █▐█▀  █▀▀█
 *  ▀▀▀  ▀  ▀    ▀    ▀ ▀▀  ▀  ▀ - EXTRA
 *
 * ░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
 */


/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ PAGE GRAZIE ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/

#s1_grazie { text-align: center; }
.back_wrapper { margin-top: 2.5%; }
.go_back {
    display: inline-block;
    padding: .75em 1.25em .75em 4.5em;
    border: 1px solid #1e1e1e; border-radius: .5em;
    background: url(../images/svg/back.svg) no-repeat 1.25em center; background-size: 2em;
    font-size: 1.25em; font-weight: bolder; color: #1e1e1e; letter-spacing: .1em; text-transform: uppercase;
}
.go_back:hover, .go_back:active, .go_back:focus { background-color: #888; color: #fff; }




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ PAGE 404 ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/




/*∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞ CSS EXTRA O MOD ∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞∞*/












/**
 * ██████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████████
 *
 * RESPONSIVE
 *
 * Settare se necessario regole fluid per minmax di elemtni specifici basandosi sulle seguenti regole:
 *  =>  ORIGINAL CALC           ->  calc( 12px + (24 - 12) * ( (100vw - 320px) / (1920 - 320) ) )
 *  =>  CALC 1920px -> 320px    ->  calc( 12px + (24 - 12) * ( (100vw - 320px) / 1600 ) )
 *  =>  CALC 1280px -> 320px    ->  calc( 12px + (24 - 12) * ( (100vw - 320px) / 960 ) )
 *  =>  CALC 1024px -> 320px    ->  calc( 12px + (24 - 12) * ( (100vw - 320px) / 704 ) )
 *
 * Da creare fluid dinamico con 2 step per i calc iniziali =   1920 -> 1024   1024 -> 320
 *
 * __________________________________________________________________________________________________________________________________________________________________________
 */


@media screen and (max-width: 1921px) {

    .head_logo { width: calc( var(--head-logo-width) + ( var(--head-logo-max) - var(--head-logo-min) ) * ( (100vw - 320px) / 1600 ) ); }
    .hamburger_btn { font-size: calc( var(--hamburger-px) + ( var(--hamburger-max) - var(--hamburger-min) ) * ( (100vw - 320px) / 1600 ) ); }

    .scroll { width: calc( var(--scroll-px) + ( var(--scroll-max) - var(--scroll-min) ) * ( (100vw - 320px) / 1600 ) ); }

    .foot_logo { width: calc( var(--foot-logo-width) + ( var(--foot-logo-max) - var(--foot-logo-min) ) * ( (100vw - 320px) / 1600 ) ); }
    .back_top { width: calc( var(--back-top-px) + ( var(--back-top-max) - var(--back-top-min) ) * ( (100vw - 320px) / 1600 ) ); }

}




/*∞∞∞∞∞∞ HEADER ∞∞∞∞∞∞*/
/* Logo */
/* Head Content */
/* Hamburger */
/* Nav Menu */
/* Darkmode Switch */


/*∞∞∞∞∞∞ FOOTER ∞∞∞∞∞∞*/
/* Contents */
/* Credits */
/* Back Top */


/*∞∞∞∞∞∞ ASSETS ∞∞∞∞∞∞*/
/* Buttons */
/* Links */
/* Filters */
/* Sections 1 */
/* Breadcrumbs */
/* Scroll */
/* Components */
/* Cards */
/* Sidebar */
/* ... */


/*∞∞∞∞∞∞ HOMEPAGE ∞∞∞∞∞∞*/
/* Sec 1 */
/* Sec 2 */
/* Sec [...] */


/*∞∞∞∞∞∞ PAGE ∞∞∞∞∞∞*/
/* Template ... */
/* Template ... */
/* Template ... */


/*∞∞∞∞∞∞ ARCHIVE ∞∞∞∞∞∞*/
/* Sec 1 */
/* Sec 2 */
/* Sec ... */


/*∞∞∞∞∞∞ SINGLE ∞∞∞∞∞∞*/
/* Sec 1 */
/* Sec 2 */
/* Sec ... */


/*∞∞∞∞∞∞ FORM ∞∞∞∞∞∞*/


/*∞∞∞∞∞∞ EXTRA ∞∞∞∞∞∞*/




/**
 *
 *  █▄ ▄█  ▄▀▀▄  █▀▀▄  ▀  █     █▀▀
 *  █ █ █  █  █  █▀▀█  █  █  ▄  █▀▀
 *  ▀   ▀   ▀▀   ▀▀▀   ▀  ▀▀▀▀  ▀▀▀ - MOBILE PORT | 480 -> 767
 *
 * Stylesheet: 481px and Up Stylesheet
 * This stylesheet is loaded for larger devices. 
 * It's set to 481px because at 480px it would load on a landscaped iPhone.
 * __________________________________________________________________________________________________________________________________________________________________________
 */

@media screen and (min-width: 481px) {

    #category-post-content { grid-template-columns: 1fr 1fr 1fr; }

}






/**
 *
 *  ▀▀█▀▀  ▄▀▀▄  █▀▀▄  █     █▀▀  ▀▀█▀▀
 *    █    █▀▀█  █▀▀█  █  ▄  █▀▀    █
 *    ▀    ▀  ▀  ▀▀▀   ▀▀▀▀  ▀▀▀    ▀   - TABLET | 768 -> 1280
 *
 * Stylesheet: Tablet & Small Desktop Stylesheet
 * Here's where you can start getting into the good stuff.
 * This size will work on iPads, other tablets, and desktops.
 * So you can start working with more styles, background images, and other resources. 
 * You'll also notice the grid starts to come into play.
 * __________________________________________________________________________________________________________________________________________________________________________
 */

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

    /*__ FOOTER __*/
    .credits br { display: none; }
    .credits .resp_sep { display: inline-block; }

    .s1_title a.link_btn { margin-top: 1rem; }
    .s1_title a.link_btn:nth-of-type(2) { margin-top: 0; margin-left: 1.5rem; }



    .swiper-foodbox .card a { display: flex; align-items: center; justify-content: center; }
    .swiper-foodbox .bkg_thumb { width: 50%; }
    .swiper-foodbox .bkg_thumb img { height: 25rem;  }
    .swiper-foodbox .card_content { text-align: left; margin-left: 1.5rem; }
    .swiper-foodbox .card_content h2 { font-size: calc(var(--rem) * 2.5); }
    .swiper-foodbox .card .link_container { justify-content: flex-start; }


    .container_tax {grid-template-columns: 1fr 1fr; }


    /*__ CUSTOM BOX __*/
    #category-post-content { grid-template-columns: 1fr 1fr; }
    .to_box { display: none; }
}



/**
 *
 * Stylesheet: Desktop Stylsheet
 * This is the desktop size. 
 * It's larger than an iPad so it will only be seen on the Desktop.
 * __________________________________________________________________________________________________________________________________________________________________________
 */

@media screen and (min-width: 1025px) {

    /*__ HEADER __*/
    /* Overlay */
    .hamburger_btn { font-size: 20px; }
    .hamburger_btn:hover {  }
    .hamburger_btn.tapped:hover {  }


    .fixed_btn { display: none; }


    /*__ FOOTER __*/
    footer { background-position: center; }
    .foot_block p a:hover { color: var(--red); }

    .credits a:hover, .credits a:active, .credits a:focus { opacity: 1; color: var(--red); }
    #credits_studio:hover { color: #e74e0f; }

    .form_container { border: unset; text-align: left; }

    #s_news #mailpoet_form_1 .mail-input, #s_news #mailpoet_form_1 .submit-input { width: auto; }
    #mailpoet_form_1 .submit-input input { width: fit-content; }

    .formaggi-cissva { position: absolute; right: 0; top: 5%; width: 40%; z-index: 2; opacity: 1320; }

    /* Back Top */
    .back_top { opacity: 1; }


    /*__ HOME __*/
    .masked_thumb { -webkit-mask-image: url(../images/svg/mask.svg); -webkit-mask-repeat: no-repeat; -webkit-mask-size: contain; height: 10rem; margin: 0; }

    .swiper-foodbox .bkg_thumb img { height: 33rem; }


    .container_tax {grid-template-columns: 1fr 1fr 1fr; }


    .delivery_home { padding: 2rem; margin-top: 6rem; }
    .delivery_home h2 { font-size: calc(var(--h2-size) * .9); }
    .delivery_home img { position: absolute; height: calc(100% + 9rem); width: auto; bottom: 0; right: 5%; margin-top: 0; }





    /*__ CUSTOM BOX __*/
    #category-post-content { grid-template-columns: 1fr 1fr 1fr; }
    .box-item { width: calc((100% / 3) - .8rem); }

    

}






/**
 *
 *  █     ▄▀▀▄  █▀▀▄  ▀█▀  ▄▀▀▄  █▀▀▄
 *  █  ▄  █▀▀█  █  █   █   █  █  █  █
 *  ▀▀▀▀  ▀  ▀  █▀▀    ▀    ▀▀   █▀▀  - LAPTOP | 1281 -> 1366
 *
 * Stylesheet: Super Large Monitor Stylesheet
 * You can add some advanced styles here if you like. 
 * This kicks in on larger screens.
 * __________________________________________________________________________________________________________________________________________________________________________
 */

@media screen and (min-width: 1281px) {}






/**
 *
 *  █▀▀▄  █▀▀  ▄▀▀  █ ▄▀  ▀█▀  ▄▀▀▄  █▀▀▄
 *  █  █  █▀▀   ▀▄  █▀▄    █   █  █  █  █
 *  ▀▀▀   ▀▀▀  ▀▀   ▀ ▀▀   ▀    ▀▀   █▀▀  - LAPTOP | 1440 -> 1919
 * __________________________________________________________________________________________________________________________________________________________________________
 */

@media screen and (min-width: 1367px) {}






/**
 *
 *  █  █  █▀▀▄  █▀▀  █▀▀▄
 *  █  █  █▀▀█  █▀▀  █▐█▀
 *   ▀▀   ▀▀▀   ▀▀▀  ▀ ▀▀ - ÜBER | 1920 -> ...
 * __________________________________________________________________________________________________________________________________________________________________________
 */

@media screen and (min-width: 1921px) {}






/**
 *
 *   ▄▀█   █ ▄▀
 *  █▄▄█▄  █▀▄
 *     █   ▀ ▀▀ - DESKTOP 4K & UP | 2561px -> ...
 * __________________________________________________________________________________________________________________________________________________________________________
 */

@media screen and ( min-width: 2561px ) {}






/**
 *
 *  █▀▀▄  █▀▀  ▀▀█▀▀  ▀  █▄ █  ▄▀▀▄
 *  █▐█▀  █▀▀    █    █  █ ▀█  █▀▀█
 *  ▀ ▀▀  ▀▀▀    ▀    ▀  ▀  ▀  ▀  ▀ - RETINA (2x RESOLUTION DEVICES)
 *
 * This applies to the retina iPhone (4s) and iPad (2,3) along with other displays with a 2x resolution. 
 * You can also create a media query for retina AND a certain size if you want. 
 * Go Nuts.
 * __________________________________________________________________________________________________________________________________________________________________________
 */

@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) {

}






/**
 *
 *  █▀▀▄  █▀▀  ▐▌ ▐▌  ▀  ▄▀▀  █▀▀  ▄▀▀
 *  █  █  █▀▀   ▀▄▀   █  █    █▀▀   ▀▄
 *  ▀▀▀   ▀▀▀    ▀    ▀   ▀▀  ▀▀▀  ▀▀  - SPECIFIC DEVICES
 * __________________________________________________________________________________________________________________________________________________________________________
 */


/* If is Device */
@media screen and (max-device-width: 1280px){}
@media screen and (max-device-width: 768px){}
@media screen and (max-device-width: 480px){}