/*
*   Title:          fonts.scss
*   Description:    This file is created to contain all font-face definitions for global.scss.
*/
@font-face {
  font-family: PermanentMarker;
  src: url("/css/fonts/PermanentMarker.ttf");
}
@font-face {
  font-family: GothamLight;
  src: url("/css/fonts/Gotham/Gotham-Light.otf") format("opentype");
}
@font-face {
  font-family: GothamMedium;
  src: url("/css/fonts/Gotham/Gotham-Medium.otf") format("opentype");
}
@font-face {
  font-family: GothamBold;
  src: url("/css/fonts/Gotham/Gotham-Bold.otf") format("opentype");
}
@font-face {
  font-family: GothamRndBold;
  src: url("/css/fonts/Gotham Rounded/GothamRnd-Bold.otf") format("opentype");
}
@font-face {
  font-family: GothamRndMedium;
  src: url("/css/fonts/Gotham Rounded/GothamRnd-Medium.otf") format("opentype");
}
@font-face {
  font-family: GothamRndLight;
  src: url("/css/fonts/Gotham Rounded/GothamRnd-Light.otf") format("opentype");
}
@font-face {
  font-family: Nunito;
  src: url("/css/fonts/Nunito/Nunito-Regular.ttf");
}
@font-face {
  font-family: NunitoLight;
  src: url("/css/fonts/Nunito/Nunito-Light.ttf");
}
@font-face {
  font-family: NunitoSemiBold;
  src: url("/css/fonts/Nunito/Nunito-SemiBold.ttf");
}
@font-face {
  font-family: NunitoBold;
  src: url("/css/fonts/Nunito/Nunito-Bold.ttf");
}
@font-face {
  font-family: RubikLight;
  src: url("/css/fonts/Rubik/Rubik-Light.ttf");
}
@font-face {
  font-family: RubikLight-Italic;
  src: url("/css/fonts/Rubik/Rubik-LightItalic.ttf");
}
@font-face {
  font-family: RubikRegular;
  src: url("/css/fonts/Rubik/Rubik-Regular.ttf");
}
@font-face {
  font-family: RubikMedium;
  src: url("/css/fonts/Rubik/Rubik-Medium.ttf");
}
@font-face {
  font-family: RubikMediumItalic;
  src: url("/css/fonts/Rubik/Rubik-MediumItalic.ttf");
}
@font-face {
  font-family: RubikItalic;
  src: url("/css/fonts/Rubik/Rubik-Italic.ttf");
}
@font-face {
  font-family: RubikBoldItalic;
  src: url("/css/fonts/Rubik/Rubik-BoldItalic.ttf");
}
@font-face {
  font-family: RubikBold;
  src: url("/css/fonts/Rubik/Rubik-Bold.ttf");
}
@font-face {
  font-family: RubikSemiBold;
  src: url("/css/fonts/Rubik/Rubik-SemiBold.ttf");
}
@font-face {
  font-family: RubikMedium;
  src: url("/css/fonts/Rubik/Rubik-Medium.ttf");
}
@font-face {
  font-family: OpenSans-Light;
  src: url("/css/fonts/OpenSans/OpenSans-Light.ttf");
}
@font-face {
  font-family: OpenSans-LightItalic;
  src: url("/css/fonts/OpenSans/OpenSans-LightItalic.ttf");
}
@font-face {
  font-family: OpenSans-Regular;
  src: url("/css/fonts/OpenSans/OpenSans-Regular.ttf");
}
@font-face {
  font-family: OpenSans-Italic;
  src: url("/css/fonts/OpenSans/OpenSans-Italic.ttf");
}
@font-face {
  font-family: OpenSans-SemiBold;
  src: url("/css/fonts/OpenSans/OpenSans-SemiBold.ttf");
}
@font-face {
  font-family: OpenSans-SemiBoldItalic;
  src: url("/css/fonts/OpenSans/OpenSans-SemiBoldItalic.ttf");
}
@font-face {
  font-family: OpenSans-Bold;
  src: url("/css/fonts/OpenSans/OpenSans-Bold.ttf");
}
@font-face {
  font-family: OpenSans-BoldItalic;
  src: url("/css/fonts/OpenSans/OpenSans-BoldItalic.ttf");
}
@font-face {
  font-family: Roboto-Medium;
  src: url("/css/fonts/Roboto/Roboto-Medium.ttf");
}
#floating-banner-paid-qanda {
  position: sticky;
  bottom: 20px;
  max-width: 500px;
}
#floating-banner-paid-qanda .banner {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  align-items: center;
  margin-left: 32px;
}
#floating-banner-paid-qanda .banner .floating-banner {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  align-items: center;
  cursor: pointer;
  text-decoration: none;
}
#floating-banner-paid-qanda .banner .circle-area {
  width: 86px;
  height: 86px;
  background: #FFFFFF;
  border: 2px solid #e6e6e6;
  box-shadow: 0 12px 20px 0 rgba(0, 0, 0, 0.2);
  border-radius: 60px;
  padding: 10px 20px;
  z-index: 10;
}
#floating-banner-paid-qanda .banner .circle-area img {
  width: 40px;
  margin: 0 auto;
}
#floating-banner-paid-qanda .banner .circle-area:hover + .banner-area {
  box-shadow: 0 1px 20px 0 #4A86FC;
}
#floating-banner-paid-qanda .banner .banner-area {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: flex-start;
  -moz-align-items: flex-start;
  -ms-align-items: flex-start;
  align-items: flex-start;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -ms-justify-content: center;
  justify-content: center;
  -ms-flex-pack: center;
  background-image: linear-gradient(180deg, #42A3F0 0%, #5C5ED8 100%);
  box-shadow: 0 12px 20px 0 rgba(116, 116, 116, 0.32);
  border-radius: 0 32px 32px 0;
  margin-left: -14px;
  padding: 0 30px;
  height: 60px;
  min-width: 380px;
  width: 100%;
  text-transform: uppercase;
}
#floating-banner-paid-qanda .banner .banner-area p {
  font-family: RubikItalic, sans-serif;
  font-size: 12px;
  color: #FFFFFF;
  letter-spacing: 0;
  margin: 0;
  line-height: 18px;
}
#floating-banner-paid-qanda .banner .banner-area span {
  font-family: RubikBoldItalic, sans-serif;
  font-size: 16px;
  color: #FFFFFF;
  margin: 0;
  line-height: 18px;
}
#floating-banner-paid-qanda .banner .banner-area:hover {
  box-shadow: 0 1px 20px 0 #4A86FC;
}

/*# sourceMappingURL=floating-banner-paid-qanda.css.map */