@font-face {
  font-family: viga;
  src: url("../fonts/viga.ttf");
}
* {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}
html {
    scroll-behavior: smooth;
}
body {
    font-family: viga;
    font-size: 1em;
    color: #555;
}
header{
    background: #36c;
    height: 500px;
}
header #title {
    color: #fff;
    float: left;
    /* background: #f09; */
    width: 54.9%;
    text-align: center;
    margin-top: 75px;
    padding: 0 2%;
}
header #title h2 {
    font-size: 2.7em;
}
header #title p {
    font-size: 1.8em;
}
header #book {
    float: right;
    /* background: #f90; */
    width: 44.9%;
    text-align: center;
}
header #book img {
    height: 600px;
    margin-top: 50px;
}
main {
    background: #fff;
}
main #problems {
    background: #fff;
    float: left;
    width: 100%;
    /* overflow: hidden; */
}
main #problems .content {
    margin-top: -100px;
}
main #what {
    clear: both;
    overflow: hidden;
    background: #6c9;
    color: #fff;
    margin: 0;
}
main #what .content ul li, main #problems .content ul li {
    list-style: none;
    margin-top: 20px;
}
main #icons {
    /* margin-top: 50px; */
    /* padding: 50px 0; */
    background: #fff;
    overflow:hidden;
    /* color: #fff; */
}
main #icons .icon {
    display: inline-block;
    color: #555;
    text-decoration: none;
    float: left;
    width: 16.6%;
    /* background: #f90; */
    /* padding: 10px; */
    text-align: center;
}
main #icons .icon i {
    font-size: 3em;
}
main #multi {
    background-image:url("../img/destruindo-o-mau-halito-bg-branco.jpg");
    background-attachment: fixed;
    background-position: bottom;
    background-repeat: repeat-y;
    background-size: cover;
    overflow: hidden;
}
main #multi .content {
    /*background-image:url("../img/destruindo-o-mau-halito-multiplataforma.png");
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: 100%;*/
    /* height: 350px; */
    text-align: center;
}
main #multi .content h2 {
    /* font-size: 1.5em; */
}
main #multi .content img {
    width: 100%;
}
main #update {
    background: #7f7f7f;
    color: #fff;
    overflow: hidden;
    text-align: center;
}
main #download .content {
    text-align: center;
}
main #download .content img {
    width: 50%;
}
main #access {
    background-image:url("../img/destruindo-o-mau-halito-bg-azul.jpg");
    background-attachment: fixed;
    background-position: bottom;
    background-repeat: repeat-y;
    background-size: cover;
    overflow: hidden;
    color: #fff;
}
main #access .content {
    text-align: center;
}
main #warranty {
    overflow: hidden;
}
main #warranty .content {
    text-align: center;
}
main #reliable {
    overflow: hidden;
    background: #6c9;
    color: #fff;
}
main #reliable .content {
    text-align: center;
}
main #price {
    background-image:url("../img/destruindo-o-mau-halito-bg-cinza.jpg");
    background-attachment: fixed;
    background-position: bottom;
    background-repeat: repeat-y;
    background-size: cover;
    overflow: hidden;
    color: #fff;
    text-align: center;
}
main #price ul {
    display: block;
    margin: 0 auto;
    width: 21%;
    /* background: #f90; */
}
main #price ul li{
    text-align: left;
    text-decoration: line-through;
}
main #price .price {
    font-size: 3em;
    background: #fff;
    border-radius: 35px;
    padding: 50px;
    width: 80%;
    margin: 0 auto;
}
main #price .price .old {
    color: #ccc;
    text-decoration: line-through;
}
main #price .price .new {
    color: #6c9;
}
main #price .price .new span {
    font-size: 2em;
}
main #price .price #countdown {
    color: #555;
    font-size: .5em;
    margin-top: 20px;
}
main #price .price .btn {
    font-size: 1em;
}
.content {
    width: 80%;
    margin: 50px auto;
    /* background: #f90; */
    overflow: hidden;
}
.content h2 {
    font-size: 2em;
}
.arrows {
    display: inline-block;
    width: 100%;
    font-size: 3em;
    text-align: center;
    padding-bottom: 30px;
    /* background: #f90; */
    color: #fff;
}
.txt-gray {
    color: #7f7f7f;
}
.red {
    color: #f66;
}
.green {
    color: #6c9;
}
.btn {
    background: #6c9;
    color: #fff;
    text-decoration: none;
    font-size: 2em;
    padding: 10px 20px;
    border-radius: 100px;
    margin-top: 50px;
    display: inline-block;
    text-align: center;
}
.btn.blue {
    background: #36c;
}
.btn.orange {
    background: #f66;
}
.sub {
    border-bottom: 5px solid #6c6;
    /* text-decoration: underline; */
}