/**
 * Theme Name: Maranello Village - Child Aitec Theme
 * Template: aitec
 * Theme URI: http://aitec.it
 * Author: The Aitec Team
 * Author URI: http://aitec.it
 * Description: A special theme created (with love!) for La Perla Corvara
 * Version: 1.0
 * License: GNU General Public License v2 or later
 * License URI: http://www.gnu.org/licenses/gpl-2.0.html
 * Text Domain: aitec
 */

:root {
	--text-base-size: 18px;
	--text-base-font: 'Titillium Web', sans-serif;
	--text-alt-font: 'Oswald', sans-serif;	
	--primary-color: #e51c24;
	--primary-color-text: #ffffff;
	--secondary-color: #ffffff;
	--secondary-color-text: #101010;
	--tertiary-color: #101010;
	--tertiary-color-text: #ffffff;
	--background-color: #ffffff;
	--background-color-text: #101010;
	--surface-color: #e6d020;
	--surface-color-text: #101010;
	--header-height: 150px;
	--upper-menu-height: 50px;
	--lower-menu-height: 100px;
}

/* Default styles, HTML and Bootstrap Customization */

body { font-weight:300; font-size: var(--text-base-size); font-family: var(--text-base-font); color: var(--background-color-text); position: relative; margin: 0; padding: 0; background-color:var(--background-color); }

.btn { font-family: var(--text-base-font); text-decoration:none; font-weight:bold; }
.btn:focus, .btn:focus-visible { outline:thin solid var(--secondary-color); border-color:#fff; }

.btn.btn-default { color: var(--secondary-color-text); border: 1px solid var(--green-gradient-dark); background: linear-gradient(to right, var(--green-gradient-dark), var(--green-gradient-light)); }
.btn.btn-default:hover, .btn.btn-default.active { text-decoration:none; background: transparent; border: 1px solid var(--secondary-color-variant); color: var(--secondary-color-variant); }
.btn.btn-default:visited, .btn.btn-default:active { border: 1px solid var(--secondary-color-variant); }

.btn.btn-default.alternative { color: var(--primary-color-text); border: 1px solid var(--brown-gradient-light); background: linear-gradient(to right, var(--brown-gradient-light), var(--brown-gradient-dark)); }
.btn.btn-default.alternative:hover, .btn.btn-default.alternative.active { text-decoration:none; background: transparent; border: 1px solid var(--primary-color); color: var(--primary-color); }
.btn.btn-default.alternative:visited, .btn.btn-default.alternative:active { border: 1px solid var(--primary-color-variant); }

.h2, h2 { font-weight:600; }
.h3, h3 { font-weight:200; text-transform:uppercase; }

strong, bold { font-weight:700; }

.menu { list-style: none inside; margin: 0; padding: 0; }
.menu > li { display:inline-block; vertical-align:top;  }

/* Main Header styles */

#main-header { background-color: transparent; border-bottom: none; z-index: 10; }

#main-header #top-header {  height:var(--upper-menu-height); position:relative; text-align:right; }
#main-header #lower-header{ height:var(--lower-menu-height); position:relative; background-color:rgba(255,255,255,0.2); }

#logo-wrapper { height: calc(var(--lower-menu-height) + 1rem); padding: 0 1rem; top: -0.5rem; }

#main-header nav.menu-menu-principale-container { display: table; position: absolute; height: var(--lower-menu-height); right: calc(var(--lower-menu-height) + 1rem); background-color: var(--primary-color); }
#main-header nav.menu-menu-principale-container:before { background: url('img/menu.svg') no-repeat scroll top left / auto 100%; position: absolute; content: ''; width: var(--lower-menu-height); height: var(--lower-menu-height); top: 0; bottom: 0; left: calc(var(--lower-menu-height) * -1); }

#main-header nav.menu-menu-principale-container #main-menu { display: table-row; height: var(--lower-menu-height); line-height: var(--lower-menu-height);  padding: 0; margin: 0; list-style: none inside;}
#main-header nav.menu-menu-principale-container #main-menu > li { display: table-cell; height: var(--lower-menu-height); line-height: var(--lower-menu-height); padding:0 2em; }
#main-header nav.menu-menu-principale-container #main-menu > li.menu-item-has-children { position:relative; }
#main-header nav.menu-menu-principale-container #main-menu > li a { display: inline-block; position: relative; color: var(--primary-color-text);  text-align: center; text-transform:uppercase; }
#main-header nav.menu-menu-principale-container #main-menu > li a:hover { text-decoration:none; color:var(--tertiary-color); }
#main-header nav.menu-menu-principale-container #main-menu > li.highlight a span { background-color: var(--surface-color); color: var(--surface-color-text); padding: 0.2em 1em; clip-path: polygon(10% 0%, 100% 0%, 90% 100%, 0% 100%); font-weight: bold; }
#main-header nav.menu-menu-principale-container #main-menu > li.highlight a:hover span { background-color: var(--secondary-color); color: var(--secondary-color-text); }

#main-header nav.menu-menu-principale-container #main-menu > li > a span { position:relative; }
#main-header nav.menu-menu-principale-container #main-menu > li.menu-item-has-children > a span:after { content: ''; font-family: 'Font Awesome 5 Free'; font-weight:bold; height: 1em; width: 1em; top: 0; line-height: 1.5em; right: -1.2em; position: absolute; transition: all 0.2s ease-in; -moz-transition: all 0.2s ease-in; -webkit-transition: all 0.2s ease-in;  }

#main-header nav.menu-menu-principale-container #main-menu > li.button a { background: linear-gradient(to right, var(--green-gradient-dark), var(--green-gradient-light)); border:thin solid var(--green-gradient-dark); color: var(--secondary-color-text); font-weight: bold; text-shadow: none; padding: 0.2em 1em; border-radius: var(--bs-border-radius); font-size: 1em; }
#main-header nav.menu-menu-principale-container #main-menu > li.button a:hover { background: transparent; color: var(--secondary-color); border:thin solid var(--green-gradient-dark); }
#main-header nav.menu-menu-principale-container #main-menu > li.button a:after { display:none; }

#main-header nav.menu-menu-principale-container #main-menu > li .sub-menu { visibility:hidden; list-style: none inside; margin: 0; padding: 1em; line-height: 1.2em; position: absolute; text-align: left; left: -33%; right: -33%; background-color: var(--tertiary-color); border-radius: var(--bs-border-radius); top:80%; }
#main-header nav.menu-menu-principale-container #main-menu > li .sub-menu { -webkit-animation-name: slideMenuRevert; animation-name: slideMenuRevert; -webkit-animation-duration: .15s; animation-duration: .15s; -webkit-animation-fill-mode: both; animation-fill-mode: both; }
#main-header nav.menu-menu-principale-container #main-menu > li.menu-item-has-children:hover .sub-menu { -webkit-animation-name: slideMenu; animation-name: slideMenu; -webkit-animation-duration: .75s; animation-duration: .75s; -webkit-animation-fill-mode: both; animation-fill-mode: both; }

#main-header nav.menu-menu-principale-container #main-menu > li .sub-menu::before { content: ''; position: absolute; top: calc(calc(1.3em / 2) * -1); left: calc(50% - calc(1.5em / 2) ); width: 1.5em; height: 1.5em; border-radius: var(--bs-border-radius); transform: rotate(45deg); background-color: var(--tertiary-color); }
#main-header nav.menu-menu-principale-container #main-menu > li .sub-menu > li { margin-bottom:0.5em; }
#main-header nav.menu-menu-principale-container #main-menu > li .sub-menu > li:last-child { margin-bottom:0; }
#main-header nav.menu-menu-principale-container #main-menu > li .sub-menu > li a { display:block; text-shadow:none; color: var(--tertiary-color-text); font-size:0.975em; font-weight:normal; text-align:left; line-height: 1.4em; padding: 0.2em 0;}
#main-header nav.menu-menu-principale-container #main-menu > li .sub-menu > li a:hover { text-decoration:underlime; color:var(--surface-color);  }

/* Language Selector styles */

.language-selector-wrapper { display: table; position: absolute; height: var(--lower-menu-height); width: calc(var(--lower-menu-height) + 1rem); right: 0; padding:0 0.5rem; background-color: var(--primary-color); }
.language-selector-wrapper .language-selector { width:100%; display:table-row; height:100%; text-align:center; list-style: none inside; padding: 0.375rem 0; margin: 0; }
.language-selector-wrapper .language-selector li { display:table-cell; vertical-align:middle; }
.language-selector-wrapper .language-selector li a, .language-selector-wrapper .language-selector li span{ color: var(--primary-color-text); font-weight: 500; font-size: 1rem; line-height: 2rem; text-shadow: 0 0 0.4em rgba(0,0,0,0.4); text-align: center;  text-transform: uppercase; }
.language-selector-wrapper .language-selector li a:hover, .language-selector-wrapper .language-selector li.active span{ color:#fff;  }

/* Top menu styles */

#main-header nav.menu-menu-superiore-container { display: inline-block; vertical-align: top; height: calc(var(--upper-menu-height) * 0.75); line-height: calc(var(--upper-menu-height) * 0.75); margin-top: calc(var(--upper-menu-height) * 0.25); padding: 0 1em 0 0.25em; position:relative; background-color:var(--tertiary-color); color: var(--tertiary-color-text); }
#main-header nav.menu-menu-superiore-container:before { background: url('img/menu-tertiary.svg') no-repeat scroll top left / auto 100%; position: absolute; content: ''; width: calc(var(--upper-menu-height) * 0.75); height: calc(var(--upper-menu-height) * 0.75); top: 0; bottom: 0; left: calc(var(--upper-menu-height) * -0.75); }
#main-header nav.menu-menu-superiore-container li a { color:var(--tertiary-color-text); text-decoration:none; }
#main-header nav.menu-menu-superiore-container li a:hover { color:var(--surface-color);  }

#main-header nav.menu-menu-social-container { display: inline-block; vertical-align: top; height: calc(var(--upper-menu-height) * 0.5); line-height: calc(var(--upper-menu-height) * 0.5); margin-top: calc(var(--upper-menu-height) * 0.5); padding: 0 2em 0 0; position:relative; background-color:var(--secondary-color); color: var(--tertiary-color-text); }
#main-header nav.menu-menu-social-container:before { background: url('img/menu-secondary.svg') no-repeat scroll top left / auto 100%; position: absolute; content: ''; width: calc(var(--upper-menu-height) * 0.5); height: calc(var(--upper-menu-height) * 0.5); top: 0; bottom: 0; left: calc(var(--upper-menu-height) * -0.5); }
#main-header nav.menu-menu-social-container li a { color:var(--secondary-color-text); text-decoration:none; padding: 0 1em; }
#main-header nav.menu-menu-social-container li a:hover { color:var(--primary-color); }