@font-face {
    font-family: "acerfoco_black";
    font-display: auto;
    font-weight: 900;
    font-style: normal;
    src: local("acerfoco"), url("../assets/fonts/acerfoco-black-webfont.woff2") format("woff2"),
        url("../assets/fonts/acerfoco-black-webfont.woff") format("woff");
}
@font-face {
    font-family: "acerfoco_bold";
    font-display: auto;
    font-weight: 700;
    font-style: normal;
    src: local("acerfoco"), url("../assets/fonts/acerfoco-bold-webfont.woff2") format("woff2"),
        url("../assets/fonts/acerfoco-bold-webfont.woff") format("woff");
}
@font-face {
    font-family: "acerfoco_focosemibold";
    font-display: auto;
    font-weight: 500;
    font-style: normal;
    src: local("acerfoco"), url("../assets/fonts/acerfoco-semibold-webfont.woff2") format("woff2"),
        url("../../assets/fonts/acerfoco-semibold-webfont.woff") format("woff");
}
@font-face {
    font-family: "acerfoco-i";
    font-display: auto;
    font-weight: 500;
    font-style: normal;
    src: local("acerfoco"), url(../assets/fonts/AcerFoco-SemiboldItalic.woff) format("truetype");
}
@font-face {
    font-family: "acerfoco";
    font-display: auto;
    font-weight: 400;
    font-style: normal;
    src: local("acerfoco"), url("../assets/fonts/acerfoco-regular-webfont.woff2") format("woff2"),
        url("../../assets/fonts/acerfoco-regular-webfont.woff") format("woff");
}
@font-face {
    font-family: "acerfoco";
    font-display: auto;
    font-weight: 300;
    font-style: normal;
    src: url(../assets/fonts/acerfoco-light-webfont.woff) format("truetype");
}
@font-face {
    font-family: "acer_focolight";
    font-weight: normal;
    font-style: normal;
    src: local("acerfoco"), url("../assets/fonts/acerfoco-light-webfont.woff2") format("woff2"),
        url("../assets/fonts/acerfoco-light-webfont.woff") format("woff");
}
body {
    font-family: "acerfoco";
    font-size: 18px;
    color: #696969;
    overflow-x: hidden;
    max-width: 1600px;
    margin: auto;
}

body .font_size_xxxSmall {
    font-size: 8px;
}
body .font_size_xxSmall {
    font-size: 10px;
}
body .font_size_xSmall {
    font-size: 12px;
}
body .font_size_small {
    font-size: 14px;
}
body .font_size_regular {
    font-size: 18px;
}
body .font_size_medium {
    font-size: 25px;
}
body .font_size_large {
    font-size: 32px;
}
body .font_size_xLarge {
    font-size: 42px;
}
body .font_size_xxLarge {
    font-size: 55px;
}
body .font_size_xxxLarge {
    font-size: 65px;
}
body p,
body h1,
body h2,
body h3,
body h4,
body h5 {
    margin-bottom: 0px;
}
body img {
    max-width: 100%;
}
body h2 {
    color: #80c342;
    font-family: "acerfoco_focosemibold";
    font-style: italic;
}

body p,
li {
    font-size: 1.5rem;
}

/* text and colors */
.font-i {
    font-family: "acerfoco-i";
}
.font-italic {
    font-style: italic;
}
.font-light {
    font-family: "acer_focolight";
    font-weight: 300;
}
.font-regular {
    font-family: "acerfoco";
}
.font-semibold {
    font-family: "acerfoco_focosemibold";
}
strong,
.font-bold {
    font-family: "acerfoco_bold";
}
.font-black {
    font-family: "acerfoco_black";
}
.text-lightgreen {
    color: #357465;
}
.text-darkgray {
    color: #334140;
}
.text-gray {
    color: #696969;
}
.border-black {
    border: 2px solid #000000;
}
@media (min-width: 992px) {
    .border-l-lg-green {
        border-left: 1px solid #80c342;
    }
}

/* sizing and spacing */
.w-fit {
    width: fit-content;
}

/* sections styles */
body #hero {
    background: url("../assets/images/bg-paper-recycled.png") top repeat;
    background-size: contain;
    color: #000000;
}
@media (min-width: 992px) {
    body #hero {
        background: url("../assets/images/bg-hero.png") top no-repeat;
        background-size: cover;
        background-color: #ffffff;
        padding-bottom: 23rem;
    }
}
body #selos {
    background: url("../assets/images/bg-paper-recycled.png");
    background-repeat: repeat;
    background-size: 50%;
    padding-bottom: 1.5rem;
}
body #selos .selo-intel {
    max-width: 200px;
    width: 5.5rem;
    height: 5.5rem;
}
@media (min-width: 992px) {
    body #selos .selo-intel {
        max-width: 150px;
    }
}
@media (max-width: 600px) {
    body #selos .selo-intel {
        max-width: 80px;
        max-height: 80px;
    }
}
body #video {
    background: url("../assets/images/bg-video.jpg") top no-repeat;
    background-size: cover;
}
@media (max-width: 400px) {
    body #video {
        max-width: 90%;
        margin-left: auto;
        margin-right: auto;
    }
}
.video-container,
#video-player {
    width: 27rem;
    height: 16rem;
    border-radius: 10px;
}
#video-player {
    max-width: 100% !important;
}
.video-container {
    position: relative;
    margin: 2rem auto;
}
#video-player,
#video-card {
    position: absolute;
    top: 0;
    left: -2%;
}
#video-card {
    z-index: 100;
    width: 100%;
    height: 100%;
    background-image: url("../assets/images/03-video-card-img.png");
    background-size: cover;
    border-radius: 10px;
}
@media (max-width: 400px) {
    .video-container,
    #video-player {
        max-width: 320px;
        max-height: 200px;
    }
}
@media (min-width: 768px) {
    .video-container,
    #video-player {
        width: 650px;
        height: 380px;
    }
}
@media (min-width: 992px) {
    .video-container,
    #video-player {
        width: 100%;
        height: 500px;
        max-width: 80%;
    }
}
@media (min-width: 1200px) {
    .video-container,
    #video-player {
        width: 100%;
        height: 600px;
    }
}
body #design {
    /* background: url("../assets/images/bg-design.jpg") top no-repeat; */
    background-size: 100%;
}

/* #design {
    padding-bottom: 30rem;
} */
body #design .design-notebook {
    position: absolute;
    z-index: 5;
    top: 20%;
    left: 16.75%;
}
body #design .design-video {
    position: absolute;
    z-index: 10;
    width: 45%;
    left: 27.5%;
    top: 22.75%;
    background-color: #27282e;
    padding-top: 1rem;
    padding-bottom: 0.5rem;
}
@media (min-width: 700px) {
    body #design .design-video {
        padding-bottom: 1.25rem;
    }
}
body #design .design-box {
    color: #696969;
    background-color: #e0e0e0;
    border-radius: 10px;
}
body #design .gif-border {
    border-radius: 10px 10px 0 0;
}
body #pcr {
    background: linear-gradient(to top, transparent 50%, #fefefe 100%),
        url("../assets/images/bg-paper.jpg");
    background-size: contain;
    background-repeat: repeat;
    padding-top: 5rem;
    padding-bottom: 0.5rem;
}
body #pcr .pcr-box {
    background: url("../assets/images/bg-paper.jpg") top;
    background-size: contain;
    background-repeat: repeat;
    box-shadow: 0px 0px 55px #00000021;
    border-radius: 15px;
}
body #memoria {
    background: url("../assets/images/bg-bubbles.jpg") top no-repeat;
    background-size: 100%;
    padding-bottom: 5rem;
}
body #memoria .disclaimer {
    margin-top: -2rem;
    margin-bottom: 2rem;
}
@media (min-width: 768px) {
    body #memoria .memoria-img {
        max-width: 150%;
    }
}
@media (min-width: 992px) {
    body #memoria .disclaimer {
        margin-top: -8rem;
    }
}

body #bateria {
    overflow: hidden;
}

@media (min-width: 768px) {
    body #bateria {
        padding-top: 50px;
    }
    body #bateria .battery-img {
        width: 100%;
    }
    body #bateria .bateria-content {
        padding-top: 50px;
    }
}
body #embalagem {
    background-color: #687b76;
    padding-bottom: 1rem;
}

@media (min-width: 992px) {
    body #features article {
        margin-right: -7rem;
    }
    body #features img {
        position: absolute;
        top: -2rem;
        left: 0;
        max-width: 140%;
        z-index: 10;
    }
    body #fingerprint article {
        margin-left: -15rem !important;
    }
    body #garantia .box-garantia {
        border: 1px solid #b29227;
        padding: 1rem 6rem 1rem 0;
    }
    #garantia figure {
        background-color: #fff;
        padding: 0.5rem 0;
        margin-left: -13%;
    }
}
@media (min-width: 1400px) {
    body #features article {
        margin-right: -15rem;
    }
    body #features img {
        top: -4rem;
    }
}
.copilot-box {
    border: 1px solid #80c342;
    border-radius: 20px;
    margin-top: 2rem;
    padding: 1.25rem 5rem 1.25rem 2rem;
}
#copilot ul li h4,
#copilot ul li p {
    font-size: 1.2rem;
}
.acer-sense-box {
    background-color: #dddddd;
    border-radius: 30px;
    padding: 2rem;
}
@media (min-width: 992px) {
    #copilot figure img {
        max-width: 150%;
    }
}
@media (min-width: 1200px) {
    #copilot figure {
        margin-left: -15%;
        margin-top: -3rem;
    }
    .acer-sense-heading {
        position: absolute;
        top: 2rem;
        right: 10%;
    }
}
body #specs {
    background: url("../assets/images/bg-specs.jpg") center bottom no-repeat;
    background-size: 100% auto;
    text-align: center;
    padding-bottom: 100px;
    color: #ffffff;
}
body #specs hr {
    border-top: 8px solid #80c342;
    width: 120px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 3rem;
    opacity: 1 !important;
}
body #specs h2 {
    padding: 0;
    margin-bottom: 0px;
}
body #specs .img-specs {
    margin-top: -40px;
    margin-bottom: 2rem;
}
body #specs .table-specs {
    padding: 90px 30px 30px;
    border: 1px solid #cccccc;
    margin-top: -140px;
    border-radius: 20px;
    background-image: linear-gradient(to bottom right, #80c342 30%, #b19132);
}
@media (min-width: 768px) {
    body #specs .table-specs {
        margin-top: -130px;
    }
}
@media (min-width: 992px) {
    body #specs .table-specs {
        width: 680px;
        margin: 0 auto;
        margin-top: -130px;
    }
}
@media (min-width: 1200px) {
    body #specs .table-specs {
        width: 60%;
        padding-left: 80px;
        padding-right: 80px;
    }
}
body #specs .table-specs hr {
    border-top: 6px solid #b07728;
    width: 80px;
}
body #specs .table-specs h3 {
    font-size: 18px;
    display: inline-block;
    margin-bottom: 30px;
}
body #specs .table-specs h3 small {
    display: block;
    color: #fff;
    font-size: 16px;
}
body #specs .table-specs h3 span {
    display: block;
    font-size: 16px;
}
@media (min-width: 992px) {
    body #specs .table-specs h3 {
        font-size: 26px;
    }
}
body #specs .table-specs h3 strong {
    text-transform: capitalize;
    font-style: bold;
}
body #specs .table-specs ul li {
    list-style: none;
    font-size: 14px;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #ffffff;
}
@media (min-width: 992px) {
    body #specs .table-specs ul li:last-child {
        border: none;
    }
}
@media (min-width: 768px) {
    body #specs .table-specs ul li {
        font-size: 14px;
    }
}
@media (min-width: 992px) {
    body #specs .table-specs ul li {
        float: left;
        width: 100%;
        font-size: 16px;
    }
}
body #specs .table-specs ul li span {
    display: block;
}
body #specs .table-specs ul li span.title {
    color: #ffffff;
    font-family: "acerfoco_bold";
    font-size: 14px;
}
@media (min-width: 992px) {
    body #specs .table-specs ul li span.title {
        width: 40%;
        float: left;
        line-height: 40px;
        text-align: left;
        padding-left: 30px;
    }
}
@media (min-width: 992px) {
    body #specs .table-specs ul li span.title br {
        display: none;
    }
}
@media (min-width: 992px) {
    body #specs .table-specs ul li span.title.three {
        line-height: 60px;
    }
}
@media (min-width: 992px) {
    body #specs .table-specs ul li span.title.four {
        line-height: 80px;
    }
}
@media (min-width: 992px) {
    body #specs .table-specs ul li span.title.five {
        line-height: 100px;
    }
}
body #specs .table-specs ul li span .registered {
    display: inline-block;
    font-size: 11px;
    vertical-align: top;
    line-height: 30px;
}
body #specs .table-specs ul li span.desc {
    font-family: "acer_focolight";
}
@media (min-width: 992px) {
    body #specs .table-specs ul li span.desc {
        width: 60%;
        float: left;
        text-align: left;
        line-height: 40px;
    }
}
@media (min-width: 992px) {
    body #specs .table-specs ul li span.desc.double {
        line-height: 20px;
    }
}
body #specs .table-specs ul li span.desc.double .registered {
    line-height: 12px;
}
body #specs .table-specs ul:last-of-type li:last-child {
    padding-bottom: 0;
    border: none;
}
body #footer {
    background: #80c342;
    text-align: center;
    padding: 0;
}
body #footer .container {
    padding: 32px;
}
@media (min-width: 992px) {
    body #footer .container {
        padding: 12px 42px;
    }
}
body #footer .logo {
    margin-bottom: 30px;
}
@media (min-width: 992px) {
    body #footer .logo {
        float: left;
    }
}
body #footer p {
    font-family: "acerfoco_black";
    font-size: 24px;
    text-transform: uppercase;
    margin-bottom: 0;
    color: #ffffff;
}
body #footer p br {
    display: block !important;
}
@media (min-width: 992px) {
    body #footer p {
        float: right;
        font-size: 30px;
        line-height: 30px;
        text-align: right;
    }
}
.font-size-xxxSmall {
    font-size: 10px !important;
}
.font-size-xxSmall {
    font-size: 10px !important;
}
.font-size-xSmall {
    font-size: 12px !important;
}
.font-size-small {
    font-size: 14px !important;
}
.font-size-regular {
    font-size: 18px !important;
}
.font-size-medium {
    font-size: 25px !important;
}
.font-size-large {
    font-size: 32px !important;
}
.font-size-xLarge {
    font-size: 42px !important;
}
.font-size-xxLarge {
    font-size: 55px !important;
}
.font-size-xxxLarge {
    font-size: 65px !important;
}
@media (min-width: 768px) {
    .font-size-md-xxxSmall {
        font-size: 10px !important;
    }
    .font-size-md-xxSmall {
        font-size: 10px !important;
    }
    .font-size-md-xSmall {
        font-size: 12px !important;
    }
    .font-size-md-small {
        font-size: 14px !important;
    }
    .font-size-md-regular {
        font-size: 18px !important;
    }
    .font-size-md-medium {
        font-size: 25px !important;
    }
    .font-size-md-large {
        font-size: 32px !important;
    }
    .font-size-md-xLarge {
        font-size: 42px !important;
    }
    .font-size-md-xxLarge {
        font-size: 55px !important;
    }
    .font-size-md-xxxLarge {
        font-size: 65px !important;
    }
}
@media (min-width: 992px) {
    .font-size-lg-xxxSmall {
        font-size: 10px !important;
    }
    .font-size-lg-xxSmall {
        font-size: 10px !important;
    }
    .font-size-lg-xSmall {
        font-size: 12px !important;
    }
    .font-size-lg-small {
        font-size: 14px !important;
    }
    .font-size-lg-regular {
        font-size: 18px !important;
    }
    .font-size-lg-medium {
        font-size: 25px !important;
    }
    .font-size-lg-large {
        font-size: 32px !important;
    }
    .font-size-lg-xLarge {
        font-size: 42px !important;
    }
    .font-size-lg-xxLarge {
        font-size: 55px !important;
    }
    .font-size-lg-xxxLarge {
        font-size: 65px !important;
    }
}
@media (min-width: 1200px) {
    .font-size-xl-xxxSmall {
        font-size: 10px !important;
    }
    .font-size-xl-xxSmall {
        font-size: 10px !important;
    }
    .font-size-xl-xSmall {
        font-size: 12px !important;
    }
    .font-size-xl-small {
        font-size: 14px !important;
    }
    .font-size-xl-regular {
        font-size: 18px !important;
    }
    .font-size-xl-medium {
        font-size: 25px !important;
    }
    .font-size-xl-large {
        font-size: 32px !important;
    }
    .font-size-xl-xLarge {
        font-size: 42px !important;
    }
    .font-size-xl-xxLarge {
        font-size: 55px !important;
    }
    .font-size-xl-xxxLarge {
        font-size: 65px !important;
    }
}