/* Add here all your css styles (customizations) */
/* These styles are generated from project.scss. */

.alert-debug {
  color: black;
  background-color: white;
  border-color: #d6e9c6;
}

.alert-error {
  color: #b94a48;
  background-color: #f2dede;
  border-color: #eed3d7;
}


.Primary-font-style {
  font-family: Urbanist;
  color: #1a1a1a;
  font-size: 18px;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.4;
  letter-spacing: normal;
}


.Secondary-font-style{
  font-family: Urbanist;
  font-size: 16px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: -0.36px;
  color: #767676;
}

.Headline {
  margin: 100px 150px 30px;
  font-family: Urbanist;
  font-size: 80px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.05;
  letter-spacing: -1.16px;
  text-align: center;
  color: #000;
}

.Headline-desc-text {
  font-family: 'Noto Sans KR' , sans-serif;
  font-size: 22px;
  font-weight: 300;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.67;
  letter-spacing: -0.48px;
  text-align: center;
  color: #555555;
}

.SubHeadline {
  font-family: 'Noto Sans KR' , sans-serif;
  font-size: 40px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  letter-spacing: -1.04px;
  text-align: left;
  color: #000;
}

.Logo {
  font-family: Urbanist;
  font-size: 30px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 0.58;
  letter-spacing: 0.4px;
  text-align: left;
  color: #1a1a1a;
}

.Main-btn{
  font-family: 'Noto Sans KR' , sans-serif;
  background-color: #FF7D0D;
  font-size: 16px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: normal;
  text-align: center;
  color: #fff;
}

.Main-btn:hover {
  color: white;
  background-color: black;
  /*opacity: .6;*/
}

.Subscribe-btn {
  border-radius: 28px;
}

.Start-btn {
  font-family: 'Noto Sans KR' , sans-serif;
  font-size: 18px;
  border-radius: 6px;
  font-weight: bold;
  color: #fefefe;
}

.Start-text {
  font-family: 'Noto Sans KR' , sans-serif;
  font-size: 18px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: normal;
  text-align: center;
  text-decoration: underline;
  color: #FF7D0D;
}

.Start-text:hover {
  text-decoration: none !important;
}

.Book-title {
  margin: 20px 20px 12px;
  font-family: Urbanist;
  font-size: 40px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.2;
  letter-spacing: -0.94px;
  text-align: left;
  color: #1a1a1a;
}

.Book-desc-flex-column {
  padding: 6px 20px;
  justify-content: center;
  line-height: 18px;
  text-align: center;
  font-size: 20px;
  /*color: #767676;*/
  color: #000;
}

.Book-desc-text {
  font-family: Urbanist;
  font-size: 16px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.63;
  letter-spacing: -0.29px;
  text-align: left;
  /*color: #767676;*/
  color: #000;
}

.Tag {
  font-family: 'Noto Sans KR' , sans-serif;
  margin: 10px 20px 0 0;
  padding: 10px 20px;
  border-radius: 22px;
  background-color: #e1eaf9;
}

.Detail-btn{
  font-family: 'Noto Sans KR' , sans-serif;
  background-color: #E1EAF9;
  color: #FF7D0D !important;
  font-size: 16px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: normal;
  text-align: center;
}

.Detail-Black-btn{
  font-family: 'Noto Sans KR' , sans-serif;
  background-color: #fff;
  color: #000 !important;
  font-size: 16px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: normal;
  text-align: center;
}

.Detail-Title {
  font-family: 'Noto Sans KR' , sans-serif;
  font-size: 16px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  letter-spacing: normal;
  text-align: left;
  color: #000;
}

*::-webkit-media-controls-panel {
  display: none!important;
  -webkit-appearance: none;
}

*::--webkit-media-controls-play-button {
  display: none!important;
  -webkit-appearance: none;
}

*::-webkit-media-controls-start-playback-button {
  display: none!important;
  -webkit-appearance: none;
}

.Overlay {
  position: absolute;
  bottom: 0;
  /*background: rgb(0, 0, 0);*/
  background: rgba(0, 0, 0, 0.5); /* Black see-through */
  color: #f1f1f1;
  width: 100%;
  transition: .5s ease;
  opacity:1;
  color: white;
  font-family: 'Noto Sans KR' , sans-serif;
  font-size: 20px;
  padding: 20px;
  text-align: center;
}

.White-Transparent {
  background : #ffffffed;
}

/*** modal dialog ***/
.Top-modal-dialog {
  margin-top: 0rem;
  max-width: 100%;
}

.Bottom-modal-dialog {
  position:fixed;

   bottom:0;
  max-width: 100%;
}

.typeahead.tt-hint {
  color: lightgrey;
}

.twitter-typeahead .tt-menu {
  width: 100%;
}

.twitter-typeahead .tt-menu .tt-suggestion {
  font-family: 'Noto Sans KR' , sans-serif;
  padding: 10px;
  font-size: 16px;
  line-height: 24px;
  font-weight: 300;
}

@media (max-width: 575px) {
  .Headline {
    font-family: Urbanist;
    margin: 60px 20px 15px;
    font-size: 3rem;
    line-height: 1.21;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.05;
    letter-spacing: -1.16px;
    color: #000;
  }

  .Headline-desc-text {
    font-family: 'Noto Sans KR' , sans-serif;
    margin: 0px;
    font-size: 12px;
    font-weight: 300;
    line-height: 1.67;
    letter-spacing: -0.48px;
    text-align: center;
    color: #555555;
  }

  .g-width-100x--sm {
    width: 100% !important;
    /* P */
  }

  .Title {
    margin-left: 20px;
  }

  .SubHeadline {
    font-size: 30px;
  }

  .Book-title {
    font-size: 30px;
  }
}

@media (min-width: 576px) and (max-width: 991px) {
  .Headline {
    font-family: Urbanist;
    margin: 30px 20px 15px;
    font-size: 4rem;
    line-height: 1.21;
    letter-spacing: -1.16px;
  }

  .Headline-desc-text {
    font-family: 'Noto Sans KR' , sans-serif;
    margin: 5px 0px 30px;
    font-size: 14px;
    font-weight: 300;
    line-height: 1.67;
    letter-spacing: -0.48px;
    text-align: center;
    color: #555555;
  }

  .SubHeadline {
    font-size: 30px;
  }

  .Book-title {
    font-size: 30px;
  }
}

/*@media (min-width: 768px) and (max-width: 991px) {*/

/*}*/

/*@media (min-width: 992px) and (max-width: 1200px) {*/

/*}*/

/*@media (min-width: 1201px) {*/

/*}*/