/* Font Family */
body {
	font-family: "Jost", sans-serif !important;
}
/* General */
:root {
	--border-radius: 4px;
	--border-radius2x: 8px;
	--default: #777;
}
/* Skin Colors */
:root {
	--primary: #FD2B36;
	--primary-100: #fd121e;
	--primary-200: #fd0512;
	--primary-300: #f3020f;
	--primary--100: #fd444e;
	--primary--200: #fd515a;
	--primary--300: #fd5e66;
	--primary-rgba-0: rgba(253, 43, 54, 0);
	--primary-rgba-10: rgba(253, 43, 54, 0.1);
	--primary-rgba-20: rgba(253, 43, 54, 0.2);
	--primary-rgba-30: rgba(253, 43, 54, 0.3);
	--primary-rgba-40: rgba(253, 43, 54, 0.4);
	--primary-rgba-50: rgba(253, 43, 54, 0.5);
	--primary-rgba-60: rgba(253, 43, 54, 0.6);
	--primary-rgba-70: rgba(253, 43, 54, 0.7);
	--primary-rgba-80: rgba(253, 43, 54, 0.8);
	--primary-rgba-90: rgba(253, 43, 54, 0.9);
	--secondary: #AE141C;
	--secondary-100: #971118;
	--secondary-200: #8c1016;
	--secondary-300: #800f15;
	--secondary--100: #c51720;
	--secondary--200: #d01822;
	--secondary--300: #dc1923;
	--secondary-rgba-0: rgba(174, 20, 28, 0);
	--secondary-rgba-10: rgba(174, 20, 28, 0.1);
	--secondary-rgba-20: rgba(174, 20, 28, 0.2);
	--secondary-rgba-30: rgba(174, 20, 28, 0.3);
	--secondary-rgba-40: rgba(174, 20, 28, 0.4);
	--secondary-rgba-50: rgba(174, 20, 28, 0.5);
	--secondary-rgba-60: rgba(174, 20, 28, 0.6);
	--secondary-rgba-70: rgba(174, 20, 28, 0.7);
	--secondary-rgba-80: rgba(174, 20, 28, 0.8);
	--secondary-rgba-90: rgba(174, 20, 28, 0.9);
	--tertiary: #2ba1b1;
	--tertiary-100: #268e9c;
	--tertiary-200: #248592;
	--tertiary-300: #217c88;
	--tertiary--100: #30b4c6;
	--tertiary--200: #34bbce;
	--tertiary--300: #3fbfd0;
	--tertiary-rgba-0: rgba(43, 161, 177, 0);
	--tertiary-rgba-10: rgba(43, 161, 177, 0.1);
	--tertiary-rgba-20: rgba(43, 161, 177, 0.2);
	--tertiary-rgba-30: rgba(43, 161, 177, 0.3);
	--tertiary-rgba-40: rgba(43, 161, 177, 0.4);
	--tertiary-rgba-50: rgba(43, 161, 177, 0.5);
	--tertiary-rgba-60: rgba(43, 161, 177, 0.6);
	--tertiary-rgba-70: rgba(43, 161, 177, 0.7);
	--tertiary-rgba-80: rgba(43, 161, 177, 0.8);
	--tertiary-rgba-90: rgba(43, 161, 177, 0.9);
	--quaternary: #383f48;
	--quaternary-100: #2d323a;
	--quaternary-200: #272c32;
	--quaternary-300: #22262b;
	--quaternary--100: #434c56;
	--quaternary--200: #49525e;
	--quaternary--300: #4e5865;
	--quaternary-rgba-0: rgba(56, 63, 72, 0);
	--quaternary-rgba-10: rgba(56, 63, 72, 0.1);
	--quaternary-rgba-20: rgba(56, 63, 72, 0.2);
	--quaternary-rgba-30: rgba(56, 63, 72, 0.3);
	--quaternary-rgba-40: rgba(56, 63, 72, 0.4);
	--quaternary-rgba-50: rgba(56, 63, 72, 0.5);
	--quaternary-rgba-60: rgba(56, 63, 72, 0.6);
	--quaternary-rgba-70: rgba(56, 63, 72, 0.7);
	--quaternary-rgba-80: rgba(56, 63, 72, 0.8);
	--quaternary-rgba-90: rgba(56, 63, 72, 0.9);
	--dark: #121212;
	--dark-100: #050505;
	--dark-200: #000000;
	--dark-300: #000000;
	--dark--100: #1f1f1f;
	--dark--200: #252525;
	--dark--300: #2c2c2c;
	--dark-rgba-0: rgba(18, 18, 18, 0);
	--dark-rgba-10: rgba(18, 18, 18, 0.1);
	--dark-rgba-20: rgba(18, 18, 18, 0.2);
	--dark-rgba-30: rgba(18, 18, 18, 0.3);
	--dark-rgba-40: rgba(18, 18, 18, 0.4);
	--dark-rgba-50: rgba(18, 18, 18, 0.5);
	--dark-rgba-60: rgba(18, 18, 18, 0.6);
	--dark-rgba-70: rgba(18, 18, 18, 0.7);
	--dark-rgba-80: rgba(18, 18, 18, 0.8);
	--dark-rgba-90: rgba(18, 18, 18, 0.9);
	--light: #FFF;
	--light-100: #f2f2f2;
	--light-200: #ececec;
	--light-300: #e6e6e6;
	--light--100: #ffffff;
	--light--200: #ffffff;
	--light--300: #ffffff;
	--light-rgba-0: rgba(255, 255, 255, 0);
	--light-rgba-10: rgba(255, 255, 255, 0.1);
	--light-rgba-20: rgba(255, 255, 255, 0.2);
	--light-rgba-30: rgba(255, 255, 255, 0.3);
	--light-rgba-40: rgba(255, 255, 255, 0.4);
	--light-rgba-50: rgba(255, 255, 255, 0.5);
	--light-rgba-60: rgba(255, 255, 255, 0.6);
	--light-rgba-70: rgba(255, 255, 255, 0.7);
	--light-rgba-80: rgba(255, 255, 255, 0.8);
	--light-rgba-90: rgba(255, 255, 255, 0.9);
}
/* Skin Colors - Inverse */
:root {
	--primary-inverse: #FFF;
	--secondary-inverse: #FFF;
	--tertiary-inverse: #FFF;
	--quaternary-inverse: #FFF;
	--dark-inverse: #FFF;
	--light-inverse: #777;
}
/* Grey Colors */
:root {
	--grey: #969696;
	--grey-100: #f4f4f4;
	--grey-200: #eaeaea;
	--grey-300: #e5e5e5;
	--grey-400: #e0e0e0;
	--grey-500: #dbdbdb;
	--grey-600: #cecece;
	--grey-700: #c1c1c1;
	--grey-800: #a8a8a8;
	--grey-900: #8e8e8e;
	--grey-1000: #757575;
}

.less-error-message ul, .less-error-message li {
	list-style-type: none;
	margin-right: 15px;
	padding: 4px 0;
	margin: 0;
}

.less-error-message label {
	font-size: 12px;
	margin-right: 15px;
	padding: 4px 0;
	color: #cc7777;
}

.less-error-message pre {
	color: #dd6666;
	padding: 4px 0;
	margin: 0;
	display: inline-block;
}

.less-error-message pre.line {
	color: #ff0000;
}

.less-error-message h3 {
	font-size: 20px;
	font-weight: bold;
	padding: 15px 0 5px 0;
	margin: 0;
}

.less-error-message a {
	color: #10a;
}

.less-error-message .error {
	color: red;
	font-weight: bold;
	padding-bottom: 2px;
	border-bottom: 1px dashed red;
}

.btn{
    border-radius:0px!important;
}

.custom-hero-heading{
    opacity: 56% !important;
}

.custom-hero-font-1 {
    font-size: clamp(28px, 0px + 0.0583333333* 100vw, 60px);
}

html.sticky-header-enabled.sticky-header-active.sticky-header-scroll-direction #header .header-body{
    background-color: #0f0f0f !important;
}

.text-4-5 {
    font-size: 16px !important;
}

.text-xl-11 {
        font-size: 32px !important;
        font-weight:500!important;
    }
    
    .custom-section-1 {
    margin-top: 60px;
    padding-top: 70px;
}

h1, h2, h3, h4, h5, h6 {
        letter-spacing: 0px;
}

.custom-grid-1 {
    margin-top: 0px;
}

.background-gradient{
    background: rgb(253,43,54);
background: linear-gradient(180deg, rgb(223 41 51) 0%, rgba(174,20,28,1) 100%);
}

#header .header-container{
    height:120px!important;
}

#header .header-body:not(.h-100) {
        height: 120px !important;
    }
    
    
    /*@media (min-width: 992px) {
    .custom-col{
        width:20%;
    }
    }*/
    
    @media (min-width: 992px) {
    .custom-grid-1 .container .row > *:nth-child(1), .custom-grid-1 .container .row > *:nth-child(3), .custom-grid-1 .container .row > *:nth-child(5), .custom-grid-1 .container .row > *:nth-child(7) {
        background-color: var(--grey-100);
    }
    .custom-grid-1 .container .row > *:nth-child(6){
         background-color:#fff;
    }
}

.col-descrizione.descrizione-oleodinamico{
    padding: 90px 50px !important;
}

.body .text-3 {
    font-size: 16px !important;
}

.custom-titlebox{
    color:#000!important;
    font-size:20px!important;
    text-transform: uppercase;
}

.background-gradient-orizzontale{
    background: rgb(253,43,54);
background: linear-gradient(90deg, rgb(223 41 51) 0%, rgba(174,20,28,1) 100%);
}

.social i{
    background-color: #222222 !important;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    color: #fff;
}

#footer{
    font-size: 16px!important;
}

.col-info-contatti a {
    color:#fff!important;
}

form a{
    color:#000;
}

body{
    font-size:16px;
}

#footer a:not(.btn):not(.no-footer-css):hover{
    color: #e1333b;
}

@media (min-width: 992px) {
    #header .header-nav-main nav > ul > li > a {
        font-weight:500;
        letter-spacing:0.5px;
        font-size: 15px;
    }
    
  
}

  .bg-color-quaternary, .bg-quaternary {
    background-color: #212121 !important;
}


/*floating*/

.style-toggle#contact_phone {
    width: 45px;
    height: 45px;
    margin-top: 310px;
    cursor: pointer;
    background-color: #e2281b;
    border-right: none;
    display: block;
    background-position: top left;
    position: fixed;
    right: 8px;
    opacity: 1;
    font-size: 20px;
    color: #fff;
    text-transform: none;
    line-height: 40px;
    z-index: 99;
    padding: 11px 0px;
    border-radius: 100%; 
    padding-right: 3px;
}

.style-toggle#contact_email {
    width: 45px;
    height: 45px;
    margin-top: 253px;
    cursor: pointer;
    background-color: #e2281b;
    border-right: none;
    display: block;
    background-position: top left;
    position: fixed;
    right: 8px;
    opacity: 1;
    font-size: 20px;
    color: #fff;
    text-transform: none;
    line-height: 40px;
    z-index: 99;
    padding: 11px 0px;
   border-radius: 100%; 
   padding-right: 3px;
}


.style-toggle {
    writing-mode: vertical-rl;
    text-orientation: mixed;
    /* margin-left: 5px; */
}

.style-toggle:hover{   
    
    opacity:80%!important;
    text-decoration:none!important;
   
}

a:not(.btn):hover {
    text-decoration: none !important;
}

html.sticky-header-active #header .header-body{
        background-color: #1b1b1b;
}

#header .header-btn-collapse-nav{
    color: #fff !important;
}

@media (max-width: 991px) {
    html.sticky-header-active #header .header-nav-main nav {
        max-height: 50vh;
        overflow: hidden;
        overflow-y: auto;
        padding: 0 15px;
        transition: ease all 500ms;
    }
    
    .custom-section-1 {
    margin-top: 0px;
    padding-top: 50px;
}

.card-body{
        padding: 0.7rem 2rem;
}

#contatti.py-4 {
    padding-top: 0rem !important;
    padding-bottom: 0rem !important;
}

#contatti.mb-5 {
    margin-bottom: 3rem !important;
}

 #contatti .container.p-5 {
    padding: 1rem 1rem !important;
}

#footer{
    padding:0px 20px;
}

.style-toggle#contact_email{
    width: 40px;
    height: 40px;
    right: 2px;
    padding-right: 1px;
    padding: 9px 0px;
}

.style-toggle#contact_phone{
      width: 40px;
    height: 40px;
    right: 2px;
    padding-right: 1px;
    padding: 9px 0px;
}

.col-descrizione.p-5{
        padding: 1rem !important;
}

#contatti .col-lg-7.p-5{
    padding: 2rem !important;
}

#settori .custom-grid-1-text h3{
    font-size: 22px !important;
}

#settori .custom-grid-1-text p{
    color:#000!important;
    text-decoration: underline;
}

#dsk .py-5 {
    padding-top: 0rem !important;
}

.text-xl-11 {
    font-size: 26px !important;
    line-height:1.3;

}

.min-vh-100 {
    min-height: 84vh !important;
}
    
}
    


.p-10{
    padding:100px!important;
}

.custom-hero-font-1 {
    font-size: clamp(30px, 0px + 0.08* 100vw, 60px);
}

@media (max-width: 1025px) {
    .card-body{
            padding: 1rem;
    }
    
}

@media (max-width: 500px) {
    .contatti-btn{
        display:none;
    }
}

@media (max-width: 325px) {
    
    #settori .custom-grid-1-text h3 {
        font-size: 17px !important;
    }
    
    
}

@media (max-width: 991px) {
    html .scroll-to-top.hidden-mobile {
        display: block !important;
    }
}


html .scroll-to-top{
    right:60px;
}