/*
 * Author: Samyr Gonzaga, and Ew Informatica contributors
 * Copyright (c) Clarins 2019
 */

@font-face {
    font-family: BarlowSemiCondensed-Black;
    src: url(./../font/BarlowSemiCondensed-Black.ttf);
    font-weight: 400;
    font-style: normal
}
@font-face {
    font-family: BarlowSemiCondensed-BlackItalic;
    src: url(./../font/BarlowSemiCondensed-BlackItalic.ttf);
    font-weight: 400;
    font-style: normal
}
@font-face {
    font-family: BarlowSemiCondensed-Bold;
    src: url(./../font/BarlowSemiCondensed-Bold.ttf);
    font-weight: 400;
    font-style: normal
}
@font-face {
    font-family: BarlowSemiCondensed-BoldItalic;
    src: url(./../font/BarlowSemiCondensed-BoldItalic.ttf);
    font-weight: 400;
    font-style: normal
}
@font-face {
    font-family: BarlowSemiCondensed-ExtraBold;
    src: url(./../font/BarlowSemiCondensed-ExtraBold.ttf);
    font-weight: 400;
    font-style: normal
}
@font-face {
    font-family: BarlowSemiCondensed-ExtraBoldItalic;
    src: url(./../font/BarlowSemiCondensed-ExtraBoldItalic.ttf);
    font-weight: 400;
    font-style: normal
}
@font-face {
    font-family: BarlowSemiCondensed-ExtraLight;
    src: url(./../font/BarlowSemiCondensed-ExtraLight.ttf);
    font-weight: 400;
    font-style: normal
}
@font-face {
    font-family: BarlowSemiCondensed-ExtraLightItalic;
    src: url(./../font/BarlowSemiCondensed-ExtraLightItalic.ttf);
    font-weight: 400;
    font-style: normal
}
@font-face {
    font-family: BarlowSemiCondensed-Light;
    src: url(./../font/gotham/BarlowSemiCondensed-Light.ttf);
    font-weight: 400;
    font-style: normal
}
@font-face {
    font-family: BarlowSemiCondensed-Italic;
    src: url(./../font/BarlowSemiCondensed-Italic.ttf);
    font-weight: 400;
    font-style: normal
}
@font-face {
    font-family: BarlowSemiCondensed-Medium;
    src: url(./../font/BarlowSemiCondensed-Medium.ttf);
    font-weight: 400;
    font-style: normal
}
@font-face {
    font-family: BarlowSemiCondensed-MediumItalic;
    src: url(./../font/BarlowSemiCondensed-MediumItalic.ttf);
    font-weight: 400;
    font-style: normal
}
@font-face {
    font-family: BarlowSemiCondensed-Regular;
    src: url(./../font/BarlowSemiCondensed-Regular.ttf);
    font-weight: 400;
    font-style: normal
}
@font-face {
    font-family: BarlowSemiCondensed-SemiBold;
    src: url(./../font/BarlowSemiCondensed-SemiBold.ttf);
    font-weight: 400;
    font-style: normal
}
@font-face {
    font-family: BarlowSemiCondensed-SemiBoldItalic;
    src: url(./../font/BarlowSemiCondensed-SemiBoldItalic.ttf);
    font-weight: 400;
    font-style: normal
}
@font-face {
    font-family: BarlowSemiCondensed-Thin;
    src: url(./../font/BarlowSemiCondensed-Thin.ttf);
    font-weight: 400;
    font-style: normal
}
@font-face {
    font-family: BarlowSemiCondensed-ThinItalic;
    src: url(./../font/BarlowSemiCondensed-ThinItalic.ttf);
    font-weight: 400;
    font-style: normal
}

/*INSERT FONT CLASSES*/

/*BarlowSemiCondensed*/
.BarlowSemiCondensed-Black {
  font-family: BarlowSemiCondensed-Black;
}
.BarlowSemiCondensed-BlackItalic {
  font-family: BarlowSemiCondensed-BlackItalic;
}
.BarlowSemiCondensed-Bold {
  font-family: BarlowSemiCondensed-Bold;
}
.BarlowSemiCondensed-BoldItalic {
  font-family: BarlowSemiCondensed-BoldItalic;
}
.BarlowSemiCondensed-ExtraBold {
  font-family: BarlowSemiCondensed-ExtraBold;
}
.BarlowSemiCondensed-ExtraBoldItalic {
  font-family: BarlowSemiCondensed-ExtraBoldItalic;
}
.BarlowSemiCondensed-ExtraLight {
  font-family: BarlowSemiCondensed-ExtraLight;
}
.BarlowSemiCondensed-ExtraLightItalic {
  font-family: BarlowSemiCondensed-ExtraLightItalic;
}
.BarlowSemiCondensed-Light {
  font-family: BarlowSemiCondensed-Light;
}
.BarlowSemiCondensed-Italic {
  font-family: BarlowSemiCondensed-Italic;
}
.BarlowSemiCondensed-Medium {
  font-family: BarlowSemiCondensed-Medium;
}
.BarlowSemiCondensed-MediumItalic {
  font-family: BarlowSemiCondensed-MediumItalic;
}
.BarlowSemiCondensed-Regular {
  font-family: BarlowSemiCondensed-Regular;
}
.BarlowSemiCondensed-SemiBold {
  font-family: BarlowSemiCondensed-SemiBold;
}
.BarlowSemiCondensed-SemiBoldItalic {
  font-family: BarlowSemiCondensed-SemiBoldItalic;
}
.BarlowSemiCondensed-Thin {
  font-family: BarlowSemiCondensed-Thin;
}
.BarlowSemiCondensed-ThinItalic {
  font-family: BarlowSemiCondensed-ThinItalic;
}

/*** Small devices (landscape phones, 576px and up) ***/
@media (max-width: 576px) { 
  .section1 .col-12 .card h1 {
    text-align: center;
    font-size: 2em;
    margin-top: 1rem;
  }
  .section1 .col-12 .card-body.p-5 {
    padding: 3rem 1.5rem!important;
  }

  .section3 .col-md-9 {
    padding: 0 2.5rem;
  }
  .section3 .col-md-9 p {
    font-size: 1.2rem;
  }
  .FAQ a h2 {
    width: 86%;
    font-size: 1.3em !important;
  }
  div#content-person-01 h1 {
    font-size: 2.5rem;
    text-align: center;
  }
  div#content-person-01 h2 {
    font-size: 2em;
    text-align: center;
    margin: 1.5rem 0;
  }
  div#content-person-01 p {
    font-size: 1.5rem;
    color: #000000;
    font-weight: 600;
    text-align: center;
  }

  div#content-person-02 h1 {
    font-size: 2.5rem;
    text-align: center;
  }
  div#content-person-02 h2 {
    font-size: 2em;
    text-align: center;
    margin: 1.5rem 0;
  }
  div#content-person-02 p {
    font-size: 1.5rem;
    color: #000000;
    font-weight: 500;
  }
  .navbar .container-fluid .row.w-100 {
    width: calc(103% + 15px) !important;
  }
  .navbar .container-fluid li.a {
    font-size: 14px;
  }
  .navbar .container-fluid div.px-5 {
    padding: 0px 1rem !important;
  }
  footer h3 {
    font-size: 1rem;
  }
  .col-sm-2 {
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }
  .col-sm-10 {
    -ms-flex: 0 0 83.333333%;
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
  }
}

/*** Medium devices (tablets, 768px and up) ***/
@media (max-width: 768px) {
  .fixed-bottom h3 {
    font-size: 15px;
    line-height: 20px;
  }
  .fixed-bottom .small {
    font-size: .83rem;
  }
}
@media (min-width: 768px) {
  h1 {
    /*color:  blue !important;*/
  }
  .d-md-block {
    display: flex !important; 
  }
}

/*** Large devices (desktops, 992px and up) ***/
@media (min-width: 992px) {
  h1 {
    /*color:  green !important;*/
  }
  .fixed-bottom h3 {
    font-size: 30px;
    line-height: 30px;
    letter-spacing: 3px;
  }
  .fixed-bottom small {
      font-size: 12px;
      padding: 0px;
      margin: 0px;
      text-transform: none;
  }
}

@media only screen 
and (min-width: 1023px) 
and (max-width: 1024px) {
  #Person-01 img {
    transform: scale(1);
    margin-top: 50vw;
  }
  .cardContainer .flip-card {
    height: 520px;
  }
}

@media only screen 
and (min-width: 992px) 
and (max-width: 1600px) {
  .col-md-9.small-desk {
    flex: 0 0 auto;
    width: 100%;
  }
}
@media only screen 
and (min-width: 1025px) 
and (max-width: 1366px) {
  #Person-01 img {
    transform: scale(1);
    margin-top: 11vw;
  }
}
@media only screen 
and (min-width: 1367px) 
and (max-width: 1600px) {
  #Person-01 img {
    transform: scale(1.);
  }
}
@media only screen 
and (min-width: 1680px) 
and (max-width: 1920px) {
  #Person-01 img {
    transform: scale(1.3);
  }
}
@media only screen 
and (orientation: portrait) {
  .portrait {
    display: block;
  }
  .landscape {
    display: none;
  }
@media only screen 
and (orientation: landscape) {
  .landscape {
    display: block;
  }
  .portrait {
    display: none;
  }
}
