@charset "UTF-8";

@font-face {
  font-family: Mulish;
  src: url(../vendor/font-mulish/Mulish-VariableFont_wght.ttf);
}

@font-face {
  font-family: Kanit;
  src: url(../vendor/font-kanit/Kanit-Regular.ttf);
}

/* Common start */
.font-style-mulish {
  font-family: Mulish, Arial;
}

.font-style-kanit {
  font-family: Kanit, Arial;
}

.bg-color-white {
  background: #FFFFFF;
}

.bg-color-blue-astros-navy {
  background: #002D62;
}

.bg-color-green-limonka {
  background: #32CD32;
}

.bg-color-gradient-pink-to-blue {
  background: linear-gradient(45deg, #8E2DE2, #4A00E0);
}

.bg-gradient-sublime-light {
  background: linear-gradient(45deg, #FC5C7D, #6A82FB);
}

.bg-light-gradient {
  background: linear-gradient(45deg, #6c756e, #6c756e);
}

.bg-color-gradient-black {
  background: linear-gradient(45deg,#000000, #434343);
}

/* Common end */

/* Main nav start */
#mainNav .navbar-brand:hover {
  font-family: Kanit, Arial;
  font-size: 1.5rem;
  color: #6c756e;
  background-color: #FFFFFF;
  text-decoration: none;
}

#mainNav .navbar-brand {
  font-family: Kanit, Arial;
  font-size: 1.5rem;
  background-color: #FFFFFF;
}

#mainNav .navbar-nav .nav-item .nav-link {
  font-family: Kanit, Arial;
  font-size: 1.2rem;
  color: #212518;
  background-color: #FFFFFF;
}

#mainNav .navbar-nav .nav-item .nav-link:hover {
  font-family: Kanit, Arial;
  font-size: 1.2rem;
  color: #6c756e;
  text-decoration: none;
  background-color: #FFFFFF;
}

#mainNav .nav-link, #mainNav .btn {
  font-family: Kanit, Arial;
  font-size: 1.2rem;
}

#mainNav .navbar-toggler {
  font-family: Kanit, Arial;
  padding: 0.5rem 0.75rem;
  font-size: 1.2rem;
  line-height: 2;
}
/* Main nav end */

/* Overview start*/
#overview .font-text-overview-header {
  font-family: Kanit, Arial;
  font-size: 3.0rem;
}

#overview .img-blur {
  -webkit-filter: blur(5px); /* Safari 6.0 - 9.0 */
  filter: blur(5px);
}

#overview .font-text-overview-body {
  font-family: Mulish, Arial;
  font-size: 1.25rem;
}

/* start - dedicated for architecture book */
#overview .btn-buy a {
  color: #FFFFFF;
  background-color: #002D62;
  text-decoration: none;
  font-family: Mulish, Arial;
  font-size: 1.25rem;
  padding: 15px;
  border-radius: 20px;
}

#overview .btn-details a {
  color: #000000;
  border-color: #002D62;
  border-width: 2px;
  background-color: #FFFFFF;
  text-decoration: none;
  font-family: Mulish, Arial;
  font-size: 1.25rem;
  padding: 15px;
  border-radius: 20px;
}

#overview .btn-details a:hover, a:active, a:focus {
  color: #FFFFFF;
  border-color: #002D62;
  background-color: #002D62;
  text-decoration: none;
  font-family: Mulish, Arial;
  font-size: 1.25rem;
}
/* end - dedicated for architecture book */

/* start - dedicated for integration book */
#overview .btn-buy-int a {
  color: #FFFFFF;
  background-color: #228B22;
  text-decoration: none;
  font-family: Mulish, Arial;
  font-size: 1.25rem;
  padding: 15px;
  border-radius: 20px;
}

#overview .btn-details-int a {
  color: #000000;
  border-color: #228B22;
  border-width: 2px;
  background-color: #FFFFFF;
  text-decoration: none;
  font-family: Mulish, Arial;
  font-size: 1.25rem;
  padding: 15px;
  border-radius: 20px;
}

#overview .btn-details-int a:hover, a:active, a:focus {
  color: #FFFFFF;
  border-color: #228B22;
  background-color: #228B22;
  text-decoration: none;
  font-family: Mulish, Arial;
  font-size: 1.25rem;
}
/* end - dedicated for integration book */

#overview .font-text-reviewer-comment {
  font-family: Mulish, Arial;
  font-style: italic;
  font-size: 1.1rem;
}

#overview .font-text-reviewer-name {
  font-family: Kanit, Arial;
  font-size: 1.5rem;
}

#overview .font-text-reviewer-position {
  font-family: Mulish, Arial;
  font-size: 1.1rem;
}

#overview .link a {
  color: #000000;
  background-color: #FFFFFF;
  text-decoration: underline;
  font-family: Mulish, Arial;
  font-size: 1.1rem;
}

#overview .link a:hover, a:active, a:focus {
  color: #000000;
  background-color: #FFFFFF;
  text-decoration: underline;
  font-family: Mulish, Arial;
  font-size: 1.1rem;
}

/* Overview end*/


/* Scope start*/
#scope .font-text-header {
  font-family: Kanit, Arial;
  font-size: 2.0rem;
}

#scope .font-text-body {
  font-family: Mulish, Arial;
  font-size: 1.25rem;
}

#scope .icon-size {
  font-size: 3.0rem;
}
/* Scope end*/

/* Offer start*/
#offer .font-text-header {
  font-family: Kanit, Arial;
  font-size: 1.5rem;
}

#offer a {
  color: #000000;
  border-color: #FFBF00;
  border-width: 2px;
  background-color: #FFBF00;
  text-decoration: none;
  font-family: Kanit, Arial;
  font-size: 1.75rem;
  padding: 15px;
  border-radius: 30px;
}

#offer a:hover, a:active, a:focus {
  color: #000000;
  border-color: #FFBF00;
  background-color: #FFFFFF;
  text-decoration: none;
  font-family: Kanit, Arial;
  font-size: 1.75rem;
}
/* Offer end*/

/* Comments start*/
#comments .font-text-header {
  font-family: Kanit, Arial;
  font-size: 2.0rem;
}

#comments .font-text-reviewer-comment {
  font-family: Mulish, Arial;
  font-style: italic;
  font-size: 1.25rem;
}

#comments .font-text-reviewer-name {
  font-family: Kanit, Arial;
  font-size: 2.0rem;
}

#comments .font-text-reviewer-position {
  font-family: Mulish, Arial;
  font-size: 1.25rem;
}
/* Comments end*/

/* Author start*/
#author .font-text-section-header {
  font-family: Kanit, Arial;
  font-size: 4.0rem;
}

#author .font-text-header {
  font-family: Kanit, Arial;
  font-size: 2.5rem;
}

#author .font-text-body {
  font-family: Mulish, Arial;
  font-size: 1.25rem;
}

#author a {
  color: rgb(14, 13, 13);
  text-decoration: none;
  font-family: Mulish, Arial;
  font-size: 1.25rem;
}

#author a:hover, a:active, a:focus {
  color: rgb(14, 13, 13);
  text-decoration: underline;
  font-family: Mulish, Arial;
  font-size: 1.25rem;
}
/* Author end*/

/* Main footer start */
#mainFooter .font-text-header {
  color: rgba(255, 255, 255, 0.5);
  font-family: Mulish, Arial;
  font-size: 1.0rem;
}

#mainFooter a {
  color: rgba(255, 255, 255, 0.5);
  background-color: #000000;
  font-family: Mulish, Arial;
  text-decoration: none;
  font-size: 1.0rem;
}

#mainFooter a:hover, a:active, a:focus {
  color: rgba(255, 255, 255, 0.75);
  background-color: #000000;
  font-family: Mulish, Arial;
  text-decoration: underline;
  font-size: 1.0rem;
}
/* Main footer end */

/* FAQ start*/
#faq .font-text-header {
  font-family: Kanit, Arial;
  font-size: 1.75rem;
  color: rgb(14, 13, 13);
}

#faq .font-text-body {
  font-family: Mulish, Arial;
  font-size: 1.25rem;
  color: rgb(14, 13, 13);
}
/* FAQ end*/

/* Order details start */
#order .font-text-header {
  font-family: Kanit, Arial;
  font-size: 1.5rem;
}

#order .font-text-card-header {
  font-family: Kanit, Arial;
  font-size: 1.4rem;
  color: rgb(14, 13, 13);
}

#order label, #order input, #order select, #order span, #order p{
  font-family: Mulish, Arial;
  font-size: 1.1em;
  color: rgb(14, 13, 13);
}

#order .order-terms-font-text label {
  font-family: Mulish, Arial;
  font-size: 1.0em;
  color: rgb(14, 13, 13);
  text-decoration: none;
}

#order .order-terms-font-text a, a:hover, a:active, a:focus {
  font-family: Mulish, Arial;
  font-size: 1.0em;
  color: rgb(14, 13, 13);
  background: #FFFFFF;
  text-decoration: underline;
}

#order .btn-use-promo-code {
  color: #FFFFFF;
  border-color: #000000;
  border-width: 2px;
  background-color: #000000;
  text-decoration: none;
  font-family: Mulish, Arial;
  font-size: 1.1rem;
  border-radius: 10px;
}

#order .btn-order {
  color: #000000;
  border-color: #FFBF00;
  border-width: 2px;
  background-color: #FFBF00;
  text-decoration: none;
  font-family: Kanit, Arial;
  font-size: 1.5rem;
  border-radius: 10px;
}

/* Order details end */

/* terms content start */
#terms-content a {
  color: rgb(14, 13, 13);
  text-decoration: none;
  font-family: Mulish, Arial;
  font-size: 1.0rem;
}

#terms-content a:hover, a:active, a:focus {
  color: rgb(14, 13, 13);
  text-decoration: underline;
  font-family: Mulish, Arial;
  font-size: 1.0rem;
}
/* terms content end */

/* privacy content start */
#privacy-content a {
  color: rgb(14, 13, 13);
  text-decoration: none;
  font-family: Mulish, Arial;
  font-size: 1.0rem;
}

#privacy-content a:hover, a:active, a:focus {
  color: rgb(14, 13, 13);
  text-decoration: underline;
  font-family: Mulish, Arial;
  font-size: 1.0rem;
}
/* privacy content end */