:root{
--body-color: hsl(44, 19%, 85%);
--text-color: hsl(45, 13%, 24%);
--links-color: hsl(45, 13%, 24%);
--links-color-hover: hsl(45, 4%, 54%);
--primary: hsl(44, 19%, 85%);
--secondary: hsl(45, 13%, 24%);
--tertiary: hsl(0, 0%, 100%);
--light: hsl(0, 0%, 96%);
--dark: #202020;
--info: #80838a;
--success: #3c9b5f;
--warning: #e3c83f;
--danger: #eb242c;
--html-font-size: 18px;
--body-font-family: 'Bodoni Moda';
--body-font-size: 1rem;
--body-line-height: 1.5;
--body-font-weight: 400;
--h1-font-family: 'Bodoni Moda';
--h1-font-size: 100px;
--h1-line-height: 1.2;
--h1-font-weight: 500;
--h2-font-family: 'Bodoni Moda';
--h2-font-size: 130px;
--h2-line-height: 1;
--h2-font-weight: 500;
--h3-font-family: 'Bodoni Moda';
--h3-font-size: 60px;
--h3-line-height: 1.2;
--h3-font-weight: 500;
--h4-font-family: 'Bodoni Moda';
--h4-font-size: 26px;
--h4-line-height: 1.2;
--h4-font-weight: 500;
--h5-font-family: 'Bodoni Moda';
--h5-font-size: 20px;
--h5-line-height: 1.2;
--h5-font-weight: 500;
--h6-font-family: 'Bodoni Moda';
--h6-font-size: 18px;
--h6-line-height: 1.2;
--h6-font-weight: 500;
--primary-hover: hsla(0, 0%, 20%, 1);
--primary-text: #ffffff;
--primary-text-hover: #ffffff;
--primary-letter-spacing: 0.5px;
--primary-padding: 0.375rem 0.75rem;
--primary-border: 1px;
--primary-border-radius: 0px;
--primary-border-style: solid;
--primary-border-color: hsla(0, 0%, 10%, 1);
--primary-border-hover: hsla(0, 0%, 20%, 1);
--primary-icon: none;
--primary-icon-width: 0px;
--primary-icon-height: 0px;
--primary-icon-inset: 6px auto auto 10px;
--primary-icon-color: transparent;
--primary-icon-color-hover: #ffffff;
--secondary-hover: hsla(320, 2%, 30%, 1);
--secondary-text: #ffffff;
--secondary-text-hover: #ffffff;
--secondary-letter-spacing: 0.5px;
--secondary-padding: 0.375rem 0.75rem;
--secondary-border: 1px;
--secondary-border-radius: 0px;
--secondary-border-style: solid;
--secondary-border-color: hsla(320, 2%, 39%, 1);
--secondary-border-hover: hsla(320, 2%, 30%, 1);
--secondary-icon: none;
--secondary-icon-width: 0px;
--secondary-icon-height: 0px;
--secondary-icon-inset: 6px auto auto 10px;
--secondary-icon-color: transparent;
--secondary-icon-color-hover: #ffffff;
--btn-style-1-text: hsl(45, 13%, 24%);
--btn-style-1-text-hover: hsl(45, 7%, 43%);
--btn-style-1-letter-spacing: 0.5px;
--btn-style-1-padding: 0.375rem 2.5rem 0.375rem 0rem;
--btn-style-1-border: 0px;
--btn-style-1-border-radius: 0px;
--btn-style-1-border-style: solid;
--btn-style-1-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='27.086' height='11.426' viewBox='0 0 27.086 11.426'%3E%3Cg id='Group_50' data-name='Group 50' transform='translate(-885 -2302.45)'%3E%3Cline id='Line_3' data-name='Line 3' x2='26.036' transform='translate(885 2308.163)' fill='none' stroke='%23464236' stroke-width='1.5'/%3E%3Cline id='Line_4' data-name='Line 4' x1='6.218' y1='4.663' transform='translate(904.819 2303.5)' fill='none' stroke='%23464236' stroke-linecap='round' stroke-width='1.5'/%3E%3Cline id='Line_5' data-name='Line 5' x1='6.218' y2='4.663' transform='translate(904.819 2308.163)' fill='none' stroke='%23464236' stroke-linecap='round' stroke-width='1.5'/%3E%3C/g%3E%3C/svg%3E");
--btn-style-1-icon-width: 27px;
--btn-style-1-icon-height: 11px;
--btn-style-1-icon-inset: calc(50% - 5px) 0px auto auto;
--btn-style-1-icon-color: hsl(45, 13%, 24%);
--btn-style-1-icon-color-hover: hsl(45, 7%, 43%);
--btn-style-2: hsla(320, 2%, 39%, 1);
--btn-style-2-hover: hsla(320, 2%, 30%, 1);
--btn-style-2-text: #ffffff;
--btn-style-2-text-hover: #ffffff;
--btn-style-2-letter-spacing: 0.5px;
--btn-style-2-padding: 0.375rem 0.75rem;
--btn-style-2-border: 1px;
--btn-style-2-border-radius: 0px;
--btn-style-2-border-style: solid;
--btn-style-2-border-color: hsla(320, 2%, 39%, 1);
--btn-style-2-border-hover: hsla(320, 2%, 30%, 1);
--btn-style-2-icon: none;
--btn-style-2-icon-width: 0px;
--btn-style-2-icon-height: 0px;
--btn-style-2-icon-inset: 6px auto auto 10px;
--btn-style-2-icon-color: transparent;
--btn-style-2-icon-color-hover: #ffffff;
--btn-style-3: hsla(320, 2%, 39%, 1);
--btn-style-3-hover: hsla(320, 2%, 30%, 1);
--btn-style-3-text: #ffffff;
--btn-style-3-text-hover: #ffffff;
--btn-style-3-letter-spacing: 0.5px;
--btn-style-3-padding: 0.375rem 0.75rem;
--btn-style-3-border: 1px;
--btn-style-3-border-radius: 0px;
--btn-style-3-border-style: solid;
--btn-style-3-border-color: hsla(320, 2%, 39%, 1);
--btn-style-3-border-hover: hsla(320, 2%, 30%, 1);
--btn-style-3-icon: none;
--btn-style-3-icon-width: 0px;
--btn-style-3-icon-height: 0px;
--btn-style-3-icon-inset: 6px auto auto 10px;
--btn-style-3-icon-color: transparent;
--btn-style-3-icon-color-hover: #ffffff;
--btn-style-4: hsla(320, 2%, 39%, 1);
--btn-style-4-hover: hsla(320, 2%, 30%, 1);
--btn-style-4-text: #ffffff;
--btn-style-4-text-hover: #ffffff;
--btn-style-4-letter-spacing: 0.5px;
--btn-style-4-padding: 0.375rem 0.75rem;
--btn-style-4-border: 1px;
--btn-style-4-border-radius: 0px;
--btn-style-4-border-style: solid;
--btn-style-4-border-color: hsla(320, 2%, 39%, 1);
--btn-style-4-border-hover: hsla(320, 2%, 30%, 1);
--btn-style-4-icon: none;
--btn-style-4-icon-width: 0px;
--btn-style-4-icon-height: 0px;
--btn-style-4-icon-inset: 6px auto auto 10px;
--btn-style-4-icon-color: transparent;
--btn-style-4-icon-color-hover: #ffffff;
--btn-style-5: hsla(320, 2%, 39%, 1);
--btn-style-5-hover: hsla(320, 2%, 30%, 1);
--btn-style-5-text: #ffffff;
--btn-style-5-text-hover: #ffffff;
--btn-style-5-letter-spacing: 0.5px;
--btn-style-5-padding: 0.375rem 0.75rem;
--btn-style-5-border: 1px;
--btn-style-5-border-radius: 0px;
--btn-style-5-border-style: solid;
--btn-style-5-border-color: hsla(320, 2%, 39%, 1);
--btn-style-5-border-hover: hsla(320, 2%, 30%, 1);
--btn-style-5-icon: none;
--btn-style-5-icon-width: 0px;
--btn-style-5-icon-height: 0px;
--btn-style-5-icon-inset: 6px auto auto 10px;
--btn-style-5-icon-color: transparent;
--btn-style-5-icon-color-hover: #ffffff;
--header-height: 80px;
--header-background: hsl(44, 19%, 85%);
--header-icons-color: hsl(228, 3%, 34%);
--header-position: sticky;
--header-logo-width: 192px;
--headermobile-height: 80px;
--headermobile-background: hsl(44, 19%, 85%);
--headermobile-icons-color: hsl(228, 3%, 34%);
--headermobile-position: sticky;
--headermobile-logo-width: 192px;
--footer-background: hsl(44, 19%, 85%);
--footer-color: hsl(45, 13%, 24%);
--footer-title-color: hsl(45, 13%, 24%);
--footer-icons-color: hsl(45, 13%, 24%);
--footer-margin-top: 0px;
--footer-margin-top-mobile: 0px;
--footer-bottom-background: hsl(44, 19%, 85%);
--footer-bottom-color: hsl(45, 13%, 24%);
--menu-color: hsl(45, 13%, 24%);
--menu-color-hover: hsl(45, 5%, 46%);
--menu-color-transparent-layout: hsl(0, 0%, 100%);
--menu-color-hover-transparent-layout: hsl(0, 6%, 92%);
--menu-font-family: 'Bodoni Moda';
--menu-font-size: 32px;
--menu-font-weight: 400;
--menu-gap: 40px;
--menumobile-width: 100svw;
--menumobile-background: hsl(44, 19%, 85%);
--menumobile-color: hsl(45, 13%, 24%);
--menumobile-font-family: 'Roboto';
--menumobile-font-size: 32px;
--menumobile-font-weight: 300;
--menumobile-gap: 20px;
--menufooter-color: hsl(45, 13%, 24%);
--menufooter-color-hover: hsl(45, 5%, 46%);
--menufooter-font-family: 'Bodoni Moda';
--menufooter-font-size: 20px;
--menufooter-font-weight: 400;
--menufooter-gap: 20px;
--section-gap: 155px;
--margin: 30px;
}
@font-face {
font-family: 'Bodoni Moda';
font-weight: 400;
src: url("//fonts.gstatic.com/s/bodonimoda/v23/aFT67PxzY382XsXX63LUYL6GYFcan6NJrKp-VPjfJMShrpsGFUt8oU7awIBytVjMYwE.ttf");
}
@font-face {
font-family: 'Bodoni Moda';
font-weight: 500;
src: url("//fonts.gstatic.com/s/bodonimoda/v23/aFT67PxzY382XsXX63LUYL6GYFcan6NJrKp-VPjfJMShrpsGFUt8oXzawIBytVjMYwE.ttf");
}
@font-face {
font-family: 'Roboto';
font-weight: 300;
src: url("//fonts.gstatic.com/s/roboto/v30/KFOlCnqEu92Fr1MmSU5vAx05IsDqlA.ttf");
}