* {
   margin: 0;
   padding: 0;
   border: 0;
   font-size: 100%;
   font: inherit;
   vertical-align: baseline;
   box-sizing: border-box;
}

:focus {
   outline: 0;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
   display: block;
}

body,
html {
   line-height: 1;
}

ol,
ul {
   list-style: none;
}

a {
   color: white;
   text-decoration: none;
}

audio,
canvas,
video {
   display: inline-block;
   *display: inline;
   *zoom: 1;
   max-width: 100%;
}

.app {
   max-width: 100vw;
   min-height: 100vh;
   background: #202020;
   color: silver;
   font-size: 20px;
   overflow-x: hidden;
   font-family: 'Cormorant Upright', serif;
}

::-moz-selection {
   background-color: transparent;
   color: #96810c;
}

::selection {
   background-color: transparent;
   color: #96810c;
}

.header {
   margin: 15vh 0 10vh 5vw;
   font-size: 2rem;
   color: #96810c;
}

.paragraph,
.list {
   line-height: 120%;
   font-family: 'Source Sans Pro', sans-serif;
   margin: 5vh auto 0;
   width: 90vw;
}
.paragraph .list-item,
.list .list-item {
   font-size: 1.4rem;
   margin: 0 0 5vh 5vw;
   font-family: 'Source Sans Pro', sans-serif;
}

i {
   margin-right: 2vw;
   color: #96810c;
}

.payment-ways {
   font-size: 25px;
   margin: 15vh 0 0 3vw;
   padding: 4vh 6vw;
   background-color: #161616;
}

.app-header {
   position: relative;
   background-image: url('../../images/bg.jpg');
   background-size: 350%;
   max-width: 100vw;
   padding: 15vh 0 30vh 3vw;
   color: #202020;
   box-sizing: border-box;
   z-index: 40;
}
.app-header .header__company-name {
   font-size: 2.5rem;
   margin-bottom: 3vh;
}
.app-header .header__company-slogan {
   font-size: 2rem;
   z-index: 1000;
   padding-bottom: 5vh;
}
.app-header .header__underline {
   opacity: 1;
   width: 50vw;
   height: 20px;
   background-color: #f8eca9;
}
.app-header .header__main-paragraph {
   margin-top: 15vh;
   font-size: 1.6rem;
   line-height: 140%;
}

.wrapper .special-img {
   width: 80vw;
   margin: 10vh calc((100vw - 80vw) / 2);
}

.wrapper p {
   width: 80vw;
   font-size: 1.3rem;
}

.wrapper img {
   margin: 10vh calc((100vw - 50vw) / 2);
   width: 50vw;
}

.chart {
   margin-bottom: 10vh;
}

@media only screen and (min-width: 1600px) {
   .wrapper strong {
      font-size: 1.7rem;
   }
}

.gold-titbits .titbit::before {
   content: attr(data-firstLetter);
   display: block;
   position: relative;
   font-size: 50px;
   top: 2vh;
   left: -4vw;
   opacity: 0.3;
}

.FAQ {
   padding-bottom: 10vh;
}
.FAQ .FAQ__list .FAQ__answer {
   font-size: 1.3rem;
   line-height: 140%;
}
.FAQ .FAQ__list .FAQ__question {
   font-size: 2rem;
   color: silver;
   margin: 20vh 0 5vh 0;
   border-bottom: 20px solid rgba(150, 129, 12, 0.7);
}
@media only screen and (min-width: 1500px) {
   .FAQ .FAQ__list .FAQ__question {
      font-size: 3rem;
   }
}

.footer {
   line-height: 140%;
   background: black;
   font-family: 'Source Sans Pro', sans-serif;
   color: #96810c;
   font-size: 1.3rem;
   padding: 5vh 0 5vh 3vw;
}
.footer a {
   color: #96810c;
}

.company-adventages-wrapper .company-adventages {
   margin: 15vh 0;
}
.company-adventages-wrapper .company-adventages .adventage .far {
   color: #96810c;
   margin: 1vh;
}

@media only screen and (min-width: 1000px) {
   .header {
      font-size: 2.5rem;
      margin: 20vh 10vw;
   }
   .app-header {
      background-size: 180%;
   }
   .app-header .header__company-name {
      font-size: 2.5rem;
      margin-bottom: 3vh;
   }
   .app-header .header__company-slogan {
      font-size: 2rem;
      z-index: 1000;
      padding-bottom: 5vh;
      width: 55vw;
   }
   .app-header .header__main-paragraph {
      width: 55vw;
      margin: 10vh 0;
      font-size: 1.4rem;
   }
   .app-informations {
      width: 80vw;
      margin: 0 auto;
   }
   .app-informations .metals-prices-chart {
      display: flex;
      flex-direction: column;
   }
   .wrapper {
      display: flex;
      align-items: center;
   }
   .wrapper img {
      width: 20vw;
      margin: 5vh 10vw;
   }
   .wrapper .special-img {
      width: 30vw;
      margin: 5vh 8vw;
   }
   .wrapper strong {
      font-size: 1.35rem;
   }
   .wrapper .paragraph {
      line-height: 180%;
      width: 35vw;
      font-size: 1.3rem;
   }
   .gold-titbits .titbit {
      width: 80vw;
   }
   .gold-titbits .titbit::before {
      left: -1vw;
      top: 3vh;
   }
   .paragraph,
   .list {
      line-height: 140%;
      margin: 5vh auto;
      width: 90vw;
   }
   .paragraph .list-item,
   .list .list-item {
      position: relative;
      margin: 0 0 5vh 7vw;
      font-family: 'Source Sans Pro', sans-serif;
   }
   .company-adventages-wrapper .company-adventages {
      display: flex;
      width: 95vw;
      margin: 0 auto;
   }
   .company-adventages-wrapper .company-adventages .list {
      margin: 0 auto;
   }
   .FAQ__list li {
      width: 70vw;
      font-size: 1.4rem;
      margin: 10vh auto;
   }
   .footer {
      display: flex;
      justify-content: space-evenly;
      line-height: 140%;
   }
   .footer .footer-side p {
      margin-bottom: 2vh;
      padding-bottom: 1%;
   }
}

@media only screen and (min-width: 1600px) {
   .header {
      font-size: 3rem;
      margin: 20vh 10vw;
   }
   .app-header {
      background-size: 180%;
      font-size: 2.5rem;
   }
   .app-header .header__company-name {
      margin-bottom: 3vh;
   }
   .app-header .header__company-slogan {
      font-size: 2.5rem;
      z-index: 1000;
      padding-bottom: 5vh;
      width: 55vw;
   }
   .app-header .header__main-paragraph {
      width: 55vw;
      font-size: 2rem;
      margin: 10vh 0;
   }
   .app-informations {
      width: 80vw;
      margin: 0 auto;
   }
   .app-informations table {
      font-size: 2.3rem;
   }
   .wrapper .special-img {
      width: 35vw;
      margin: 5vw;
   }
   .wrapper strong {
      font-size: 2rem;
   }
   .gold-titbits .titbit {
      width: 80vw;
      line-height: 150%;
   }
   .gold-titbits .titbit::before {
      left: -1vw;
      top: 3vh;
   }
   .paragraph,
   .list {
      line-height: 140%;
      margin: 5vh auto;
      font-size: 2.3rem;
      width: 90vw;
   }
   .paragraph .list-item,
   .list .list-item {
      font-size: 2.2rem;
      position: relative;
      margin: 0 0 5vh 7vw;
      font-family: 'Source Sans Pro', sans-serif;
   }
   .company-adventages-wrapper .company-adventages {
      display: flex;
      width: 95vw;
      margin: 0 auto;
   }
   .company-adventages-wrapper .company-adventages .list {
      width: 60%;
      margin: 6vh 0 0 2vw;
   }
   .company-adventages-wrapper .company-adventages .list .list-item {
      font-size: 2.5rem;
   }
   .FAQ__list {
      width: 70vw;
      margin: 10vh auto;
   }
   .FAQ__list .FAQ__question {
      font-size: 2rem;
   }
   .FAQ__list dfn {
      font-size: 2.3rem;
      line-height: 140%;
   }
   .footer {
      display: flex;
      justify-content: space-evenly;
      font-size: 1.3rem;
      line-height: 140%;
   }
   .footer .footer-side p {
      margin-bottom: 2vh;
      padding-bottom: 1%;
   }
}

@media only screen and (min-width: 1900px) {
   .article-about-company {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
   }
   .article-gold-price {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
   }
   .article-gold-price .header {
      font-size: 3.5rem;
      color: #96810c;
      width: 70%;
      margin: 10vw 10vw 5vh 10vw;
   }
   .header {
      font-size: 3.5rem;
      color: #96810c;
      width: 90%;
      margin: 10vw 10vw 5vh 10vw;
   }
   .app-header {
      background-size: 180%;
      font-size: 2.5rem;
   }
   .app-header .header__company-name {
      margin-bottom: 3vh;
      font-size: 6rem;
   }
   .app-header .header__company-slogan {
      z-index: 1000;
      padding-bottom: 5vh;
      width: 55vw;
      font-size: 4.5rem;
   }
   .app-header .header__main-paragraph {
      width: 55vw;
      font-size: 2.7rem;
      margin: 10vh 0;
   }
   .wrapper {
      width: 70vw;
      margin: 0 5vw 5vh 5vw;
   }
   .wrapper strong {
      font-weight: 500;
      font-size: 2rem;
      line-height: 150%;
   }
   .wrapper .special-img {
      width: 50%;
      margin: 5vh 5vw 5vh 0;
   }
   .wrapper .list {
      width: 60%;
   }
   .wrapper .list-item {
      font-size: 2.5rem;
   }
   .footer {
      font-size: 2rem;
   }
}

/*# sourceMappingURL=styles.css.map */