:root {
    /* Cores */
    --color-white: #fff;
    --color-grey: #505a57;
    --color-blue: #0f5371;
    --color-primary: #505a57;
    --color-text-contrast: #212529;
    --color-secondary: #d7d7d7;
    --color-highlight: #494b4c;
    --color-background: #ffffff;
    --color-background-active: #dddddd;
    --color-background-secondary: #eaf0f1;
    --color-shadow-active: #949494;
    --color-link: #f39c12;
    --color-link-hover: #28a745;
    --color-block-bg: #e4e7e8;
    --color-table-header: #317ec1;
    --color-table-row-bg: #87a6d7;
    --color-table-row-bg-alt: #6390cb;
    --color-table-row-highlight: #6e85ad;
    --color-table-row-bg-alt-highlight: #426b9b;
    --color-footer-bg: #fff;
    --color-title: #00568a;
    --color-input-bg: #f1f1f2;
    --color-input-border: #495057;
    --color-disabled: #dfdfdf;
    --color-light: #ffffff;
    --color-gradient-start: #dedede;
    --color-gradient-end: #b5b5b5;
    --color-gradient-start-rgb: 222, 222, 222;
    --color-gradient-end-rgb: 181, 181, 181;
    --color-menu-bg: #0a3d5e;
    --color-menu-text: #BED7E5;
    --color-gradient-footer-start: #005f8d;
    --color-gradient-footer-mid1: #0068b0;
    --color-gradient-footer-mid2: #0071d3;
    --color-gradient-footer-end: #0081ff;
    --color-button-send: #2ecc71;
    --color-button-send-bg-info: #43bbef;
    --color-button-send-text-info: #fff;
    --color-rgb-shadow: 0, 0, 0;


    --font-100: 1.1;
    --font-200: 1.2;

    /* Fontes */
    --font-family-primary: "ClanOT-Book", sans-serif;
    --font-family-bold: "ClanOT-Bold", sans-serif;
    --font-family-secondary: "Montserrat-Regular", sans-serif;
    --font-size-large: 2rem; /* 32px */
    --font-size-large-100: calc(var(--font-size-large) * var(--font-100)); /* 35.2px */
    --font-size-large-200: calc(var(--font-size-large) * var(--font-200)); /* 38.4px */
    --font-size-medium-large: 1.5rem; /* 24px */
    --font-size-medium-large-100: calc(var(--font-size-medium-large) * var(--font-100)); /* 26.4px */
    --font-size-medium-large-200: calc(var(--font-size-medium-large) * var(--font-200)); /* 28.8px */
    --font-size-medium: 1rem; /* 16px */
    --font-size-medium-100: calc(var(--font-size-medium) * var(--font-100)); /* 17.6px */
    --font-size-medium-200: calc(var(--font-size-medium) * var(--font-200)); /* 19.2px */
    --font-size-small: 0.875rem; /* 14px */
    --font-size-small-100: calc(var(--font-size-small) * var(--font-100));  /* 15.4px */
    --font-size-small-200: calc(var(--font-size-small) * var(--font-200)); /* 16.8px */
    --font-size-extra-small: 0.8125rem; /* 13px */
    --font-size-extra-small-100: calc(var(--font-size-extra-small) * var(--font-100));
    --font-size-extra-small-200: calc(var(--font-size-extra-small) * var(--font-200));
    --font-size-table-header: 1.575rem;
    --font-size-table-cell: 1.25rem;
    --line-height-default: 2rem;
    --line-height-large: 2.2rem;
    --font-size-heading-1: 2.25rem;
    --font-size-heading-2: 2rem;
    --font-size-heading-3: 1.75rem;
    --font-size-heading-4: 1.25rem;
    --font-size-heading-5: 1rem;

    /* Espaçamentos */
    --spacing-large: 4rem;
    --spacing-medium: 3rem;
    --spacing-small: 2rem;
    --spacing-extra-small: 1rem;
    --padding-body: 0.375rem 0; /* 6px 0 */
    --padding-block: 4%;
    --padding-button: 0.375rem 0; /* 6px */
    --margin-large: 3rem;
    --margin-medium: 1.5rem;
    --margin-small: 1rem;
    --margin-extra-small: 0.5rem;

    /* dispositivos */
    --breakpoint-small: 576px;
    --breakpoint-medium: 768px;
    --breakpoint-large: 992px;
    --breakpoint-extra-large: 1200px;

    /* Botões */
    --btn-padding: 0.5rem 1rem; /* 8px 16px */
    --btn-border-radius: 0.1875rem; /* 3px */

    /* Tabelas */
    --table-padding: 0.9375rem 1.25rem; /* 15px 20px */
    --table-border: 0.0625rem solid var(--color-secondary); /* 1px */

    /* Outros */
    --gap-custom: 1rem;
    --input-height: 2.4375rem; /* 39px */
}

body.dark {
    --color-primary: #f5f5f5;
    --color-text-contrast: #e0e0e0;
    --color-secondary: #555555;
    --color-highlight: #b0b2b3;
    --color-background: #2d2d2d;
    --color-background-active: #2e2e2e;
    --color-background-secondary: #3a3a3a;
    --color-shadow-active: #111;
    --color-link: #ffdb58;
    --color-link-hover: #45d682;
    --color-block-bg: #383c44;
    --color-table-header: #f5f5f5;
    --color-table-row-bg: #2a2a2a;
    --color-table-row-bg-alt: #333;
    --color-table-row-highlight: #445566;
    --color-footer-bg: #2a2a2a;
    --color-title: #76c3ff;
    --color-input-bg: #444a50;
    --color-input-border: #c0c5cd;
    --color-disabled: #596067;
    --color-light: #313539;
    --color-gradient-start: #313539;
    --color-gradient-end: #2d2d2d;
    --color-gradient-start-rgb: 49, 53, 57;
    --color-gradient-end-rgb: 45, 45, 45;
    --color-menu-bg: #3d4249;
    --color-menu-text: #d8e8f2;
    --color-gradient-footer-start: #1e1e1e;
    --color-gradient-footer-mid1: #353535;
    --color-gradient-footer-mid2: #424242;
    --color-gradient-footer-end: #0a0a0a;
    --color-button-send: #1f8d4d;
    --color-button-send-bg-info: #4fc3f7;
    --color-button-send-text-info: #ffffff;
    --color-rgb-shadow: 255, 255, 255;
    --color-blue: #0f5371;
}

html,
body {
    color: var(--color-primary);
    background-color: var(--color-background);
    font-family: var(--font-family-primary);
    font-display: swap;
}

@font-face {
    font-family: "ClanOT-NarrowThin";
    src: url("../fonts/ClanOT-NarrowThin.otf");
    src: url("../fonts/ClanOT-NarrowThin.woff") format("woff");
    font-display: swap;
}

@font-face {
    font-family: "ClanOT-Thin";
    src: url("../fonts/FFClanProThin.TTF") format("truetype");
    font-display: swap;
}

@font-face {
    font-family: "ClanOT-Medium";
    src: url("../fonts/ClanOT-Medium.eot");
    src: url("../fonts/ClanOT-Medium.woff") format("woff"), url("../fonts/ClanOT-Medium.ttf") format("truetype");
    font-display: swap;
}

@font-face {
    font-family: "ClanOT-News";
    src: url("../fonts/ClanOT-News.eot");
    src: url("../fonts/ClanOT-News.woff") format("woff"), url("../fonts/ClanOT-News.ttf") format("truetype");
    font-display: swap;
}

@font-face {
    font-family: "ClanOT-Bold";
    src: url("../fonts/ClanOT-Bold.eot");
    src: url("../fonts/ClanOT-Bold.woff") format("woff"), url("../fonts/ClanOT-Bold.ttf") format("truetype");
    font-display: swap;
}

@font-face {
    font-family: "ClanOT-Book";
    src: url("../fonts/ClanOT-Book.eot");
    src: url("../fonts/ClanOT-Book.woff") format("woff"), url("../fonts/ClanOT-Book.ttf") format("truetype");
    font-display: swap;
}

@font-face {
    font-family: 'fiber-icons';
    src: url('../fonts/fiber-icons.otf');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat-Medium';
    src: url("../fonts/Montserrat-Medium.ttf"), url("../fonts/Montserrat-Medium.ttf") format("truetype");
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat-Regular';
    src: url("../fonts/Montserrat-Regular.ttf"), url("../fonts/Montserrat-Regular.ttf") format("truetype");
}

@font-face {
    font-family: 'Montserrat-Bold';
    src: url("../fonts/Montserrat-Bold.ttf"), url("../fonts/Montserrat-Bold.ttf") format("truetype");
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat-Light';
    src: url("../fonts/Montserrat-Light.ttf"), url("../fonts/Montserrat-Light.ttf") format("truetype");
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat-ExtraBold';
    src: url("../fonts/Montserrat-ExtraBold.ttf"), url("../fonts/Montserrat-ExtraBold.ttf") format("truetype");
    font-display: swap;
}

h1, h2, h3, h4, h5, h6 {
    &.strong {
        font-family: var(--font-family-bold);
    }
    font-family: var(--font-family-primary);
    color: var(--color-primary);
}

h1 {
    font-family: var(--font-family-bold);
    font-size: var(--font-size-heading-1);
}

h2 {
    font-size: var(--font-size-heading-2);
}

h2[data-variant="90"] {
    font-size: calc(var(--font-size-heading-2) * 0.9);
}

h3 {
    font-family: var(--font-family-bold);
    font-size: var(--font-size-heading-3);
    color: var(--color-highlight);
}

h4 {
    font-size: var(--font-size-heading-4);
}

h5 {
    font-size: var(--font-size-heading-5);
}

.font-size {
    font-size: var(--computed-font-size, var(--font-size-medium));
}

.font-size[data-font="large"] {
    --base-font-size: var(--font-size-large);
  }

  .font-size[data-font="medium"] {
    --base-font-size: var(--font-size-medium);
  }

  .font-size[data-font="small"] {
    --base-font-size: var(--font-size-small);
  }

  .font-size[data-font="extra-small"] {
    --base-font-size: var(--font-size-extra-small);
  }

  .font-size[data-variant="90"] {
    --computed-font-size: calc(var(--base-font-size) * 0.9);
  }

  .font-size[data-variant="100"] {
    --computed-font-size: calc(var(--base-font-size) * var(--font-100));
  }

  .font-size[data-variant="200"] {
    --computed-font-size: calc(var(--base-font-size) * var(--font-200));
  }

  .font-size:not([data-variant]) {
    --computed-font-size: var(--base-font-size);
  }

.separator {
    display: flex;
    align-items: center;
}

.separator::after {
    content: '';
    flex: 1;
    border-top: 1px solid var(--color-secondary);
    margin-left: 1rem;
}

.text-primary {
    font-family: var(--font-family-primary);
}

.text-contrast {
    color: var(--color-text-contrast);
}

.text-bold {
    font-family: var(--font-family-bold);
}

.text-secondary {
    font-family: var(--font-family-secondary);
}

.text-icon {
    font-family: 'fiber-icons';
}

#conteudo {
    min-height: 100vh;
}

.corPadraoStrong {
    color: var(--color-primary);
}

.clan-ot-bold {
    font-family: var(--font-family-bold);
}

.clan-ot-news {
    font-family: "ClanOT-News";
}

.clan-ot-book {
    font-family: "ClanOT-Book";
}

.clan-ot-book strong {
    font-family: "clan-ot-bold";
}

.montserrat-medium {
    font-family: 'Montserrat-Medium', sans-serif;
}

.montserrat-regular {
    font-family: 'Montserrat-Regular', sans-serif;
}

.montserrat-bold {
    font-family: 'Montserrat-Bold', sans-serif;
}

.montserrat-extrabold {
    font-family: 'Montserrat-ExtraBold', sans-serif;
}

.montserrat-light {
    font-family: 'Montserrat-Light', sans-serif;
}

#iconWpp {
    /* background: rgb(30,98,34);
    background: linear-gradient(0deg, rgba(30,98,34,1) 10%, rgba(45,253,69,1) 100%); */
    position: fixed;
    display: block !important;
    z-index: 999;
    float: right;
    right: 2vw;
    bottom: 10vh;
    border-radius: 10px 10px 10px 0;
    /* padding: 7px 10px; */
    /* box-shadow: -4px 6px 11px darkgray;  */
}

#iconWpp a:hover {
    text-decoration: none;
}

#iconWpp .img {
    float: left;
    margin-right: 3px;
}

#iconWpp .texto {
    color: var(--color-light);
    font-family: "Open Sans";
    float: right;
    display: contents;
    font-weight: 700;
}

.px-sm-0 {
    padding-right: 0 !important;
    padding-left: 0 !important;
}

a,
a:hover {
    text-decoration: none;
}

.mt-padrao {
    margin-top: var(--margin-large);
}

.mt-page {
    margin-top: var(--margin-medium);
}

form .custom-select {
    width: 100%;
    padding: .375rem .5rem;
}

.infoButtons a.btn-solicitar-orcamento,
.infoButtons .btn-baixar-catalogo {
    background-color: var(--color-link);
    border: 1px solid var(--color-link);
    color: var(--color-light);
    display: block;
    font-size: 16px;
    margin-top: 25px;
    padding-bottom: 6px;
    padding-top: 3px;
    width: 100%;
}

.infoButtons .btn-baixar-catalogo {
    background-color: var(--color-link-hover);
    border: 1px solid var(--color-link-hover);
    margin-top: 15px;
}

.title {
    color: var(--color-primary);
    line-height: inherit;
}

.form-control,
.form-control:focus,
.admin-form .select>select,
.admin-form .select>select:hover,
.admin-form .select>select:focus {
    border-radius: 0;
    border: none;
    background-color: var(--color-input-bg);
    box-shadow: none;
    color: var(--color-highlight);
    padding: 9px 10px;
    height: 39px;
}

.admin-form .switch {
    cursor: pointer;
    position: relative;
    padding-right: 10px;
    display: inline-block;
    margin-bottom: 5px;
    height: 26px;
}

.admin-form .switch>input {
    -webkit-appearance: none;
    position: absolute;
    width: inherit;
    height: inherit;
    opacity: 0;
    left: 0;
    top: 0;
}

.admin-form .switch>label::after {
    content: "";
    margin: 1px;
    width: 19px;
    height: 19px;
    display: block;
    background: #fff;
}

.admin-form .switch>label::before {
    content: attr(data-off);
    position: absolute;
    top: 1px;
    right: 13px;
    width: 33px;
}

.admin-form .switch>label {
    cursor: pointer;
    display: inline-block;
    position: relative;
    height: 25px;
    width: 110px;
    color: #fff;
    font-size: 10px;
    font-weight: bold;
    line-height: 20px;
    text-align: center;
    background: #D7D7D7;
    border: 2px solid #D7D7D7;
    text-transform: uppercase;
    font-family: Helvetica, Arial, sans-serif;
    -webkit-transition: 0.3s ease-out;
    -moz-transition: 0.3s ease-out;
    -o-transition: 0.3s ease-out;
    transition: 0.3s ease-out;
}

.admin-form .switch-primary>input:checked+label {
    background: var(--color-highlight) !important;
    border-color: var(--color-highlight) !important;
}

#phone {
    text-indent: 20px;
}

.icons8-whatsapp {
    display: inline-block;
    width: 20px;
    top: 9px;
    left: 20px;
    position: absolute;
    height: 20px;
    background: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHg9IjBweCIgeT0iMHB4Igp3aWR0aD0iMTYiIGhlaWdodD0iMTYiCnZpZXdCb3g9IjAgMCA0MCA0MCIKc3R5bGU9IiBmaWxsOiMwMDAwMDA7Ij48cGF0aCBmaWxsPSIjZjJmYWZmIiBkPSJNNC4yMjEsMjkuMjk4bC0wLjEwNC0wLjE4MWMtMS42MDgtMi43ODYtMi40NTktNS45NjktMi40NTgtOS4yMDUgQzEuNjYzLDkuNzYsOS45MjYsMS41LDIwLjA3OCwxLjVjNC45MjYsMC4wMDIsOS41NTMsMS45MTksMTMuMDMsNS4zOTljMy40NzcsMy40OCw1LjM5Miw4LjEwNyw1LjM5MiwxMy4wMjggYy0wLjAwNSwxMC4xNTMtOC4yNjgsMTguNDE0LTE4LjQyLDE4LjQxNGMtMy4wODItMC4wMDItNi4xMjYtMC43NzYtOC44MTEtMi4yNGwtMC4xNzQtMC4wOTZsLTkuMzg1LDIuNDZMNC4yMjEsMjkuMjk4eiI+PC9wYXRoPjxwYXRoIGZpbGw9IiM3ODhiOWMiIGQ9Ik0yMC4wNzgsMkwyMC4wNzgsMmM0Ljc5MSwwLjAwMSw5LjI5MywxLjg2NywxMi42NzYsNS4yNTNDMzYuMTM3LDEwLjYzOSwzOCwxNS4xNCwzOCwxOS45MjcgYy0wLjAwNSw5Ljg3OC04LjA0MywxNy45MTQtMTcuOTI3LDE3LjkxNGMtMi45OTEtMC4wMDEtNS45NTItMC43NTUtOC41NjQtMi4xOGwtMC4zNDktMC4xOWwtMC4zODQsMC4xMDFsLTguMzU0LDIuMTkgbDIuMjI2LTguMTMxbDAuMTEtMC40MDNMNC41NSwyOC44NjdjLTEuNTY2LTIuNzExLTIuMzkzLTUuODA4LTIuMzkxLTguOTU1QzIuMTYzLDEwLjAzNiwxMC4yMDIsMiwyMC4wNzgsMiBNMjAuMDc4LDEgQzkuNjUxLDEsMS4xNjMsOS40ODUsMS4xNTgsMTkuOTEyYy0wLjAwMiwzLjMzMywwLjg2OSw2LjU4OCwyLjUyNSw5LjQ1NUwxLDM5LjE2OWwxMC4wMy0yLjYzYzIuNzYzLDEuNTA3LDUuODc1LDIuMyw5LjA0MiwyLjMwMiBoMC4wMDhjMTAuNDI3LDAsMTguOTE1LTguNDg1LDE4LjkyLTE4LjkxNGMwLTUuMDU0LTEuOTY2LTkuODA3LTUuNTM4LTEzLjM4MkMyOS44OSwyLjk3MSwyNS4xNCwxLjAwMiwyMC4wNzgsMUwyMC4wNzgsMXoiPjwvcGF0aD48cGF0aCBmaWxsPSIjNzliYTdlIiBkPSJNMTkuOTk1LDM1Yy0yLjUwNC0wLjAwMS00Ljk4Mi0wLjYzMi03LjE2Ni0xLjgyM2wtMS40MzMtMC43ODJsLTEuNTc5LDAuNDE0bC0zLjI0MSwwLjg1bDAuODMtMy4wMwlsMC40NTMtMS42NTZMNywyNy40ODVjLTEuMzA5LTIuMjY3LTIuMDAxLTQuODU4LTItNy40OTJDNS4wMDQsMTEuNzI2LDExLjczMiw1LjAwMSwxOS45OTgsNWM0LjAxMSwwLjAwMSw3Ljc3OSwxLjU2MywxMC42MSw0LjM5NwlDMzMuNDQxLDEyLjIzMSwzNSwxNS45OTksMzUsMjAuMDA1QzM0Ljk5NiwyOC4yNzMsMjguMjY4LDM1LDE5Ljk5NSwzNXoiPjwvcGF0aD48cGF0aCBmaWxsPSIjZmZmIiBkPSJNMjguMjgsMjMuNjg4Yy0wLjQ1LTAuMjI0LTIuNjYtMS4zMTMtMy4wNzEtMS40NjJjLTAuNDEzLTAuMTUxLTAuNzEyLTAuMjI0LTEuMDEyLDAuMjI0CWMtMC4zLDAuNDUtMS4xNjEsMS40NjItMS40MjMsMS43NjFjLTAuMjYyLDAuMy0wLjUyNCwwLjMzNy0wLjk3NCwwLjExM2MtMC40NS0wLjIyNC0xLjg5OS0wLjctMy42MTUtMi4yMzEJYy0xLjMzNy0xLjE5MS0yLjIzOS0yLjY2My0yLjUwMS0zLjExM2MtMC4yNjItMC40NS0wLjAyOS0wLjY5MywwLjE5Ny0wLjkxN2MwLjIwMi0wLjIwMiwwLjQ1LTAuNTI1LDAuNjc0LTAuNzg3CWMwLjIyNC0wLjI2MiwwLjMtMC40NSwwLjQ1LTAuNzVjMC4xNTEtMC4zLDAuMDc1LTAuNTYzLTAuMDM4LTAuNzg3Yy0wLjExMy0wLjIyNC0xLjAxMi0yLjQzNy0xLjM4Ny0zLjMzNgljLTAuMzY0LTAuODc2LTAuNzM2LTAuNzU3LTEuMDEyLTAuNzcxYy0wLjI2Mi0wLjAxNC0wLjU2Mi0wLjAxNS0wLjg2MS0wLjAxNWMtMC4zLDAtMC43ODcsMC4xMTMtMS4xOTgsMC41NjMJYy0wLjQxMSwwLjQ1LTEuNTczLDEuNTM3LTEuNTczLDMuNzQ5czEuNjExLDQuMzUsMS44MzUsNC42NDljMC4yMjQsMC4zLDMuMTY5LDQuODM5LDcuNjgsNi43ODYJYzEuMDcyLDAuNDYyLDEuOTExLDAuNzM5LDIuNTYyLDAuOTQ3YzEuMDc2LDAuMzQyLDIuMDU3LDAuMjk0LDIuODMyLDAuMTc4YzAuODY0LTAuMTI5LDIuNjYtMS4wODcsMy4wMzQtMi4xMzYJYzAuMzc1LTEuMDQ5LDAuMzc1LTEuOTUsMC4yNjItMi4xMzZDMjkuMDMsMjQuMDI1LDI4LjczMSwyMy45MTIsMjguMjgsMjMuNjg4eiI+PC9wYXRoPjwvc3ZnPg==') 50% 50% no-repeat;
    background-size: 100%;
}

.titleCinza {
    color: #494b4c;
}


.iti {
    width: 100%;
}

#form input,
#form select,
#form textarea {
    font-family: var(--font-family-primary);
    background-color: var(--color-input-bg);
    border: none;
    box-shadow: none;
    padding: 8px 10px;
    color: var(--color-primary);
    width: 100%;
}

#form select:invalid {
    color: var(--color-highlight);
}

#form input::placeholder,
#form select::placeholder,
#form textarea::placeholder {
    font-family: var(--font-family-primary);
    color: var(--color-highlight);
}

#form .disabled {
    background-color: var(--color-disabled);
}

#form button[type="submit"] {
    background-color: var(--color-button-send);
}

#form textarea {
    min-height: 120px;
}

.title-poll {
    color: var(--color-primary);
}

.info-poll {
    font-size: 19px;
}

.text-justify {
    text-align: justify;
}

#carouselBanner .carousel-indicators {
    bottom: -15px;
}

#carouselBanner .carousel-indicators [data-bs-target] {
    border-radius: 50%;
    width: 10px;
    height: 10px;
}

@media (min-width: 1400px) {

    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
        max-width: 1140px;
    }
}

@media (max-width: 768px) {
    .contentInstallation p.title-step {
        margin-top: 1rem;
        text-align: left;
    }
}