.body-sec { max-width: 100%; margin-left: auto; margin-right: auto; }
.jp-inner { max-width: 1070px; width: 90%; margin: 0 auto; font-family: "Roboto", serif; }
.jp-inner.full { width: 95%; }
#homepage h3.jp { font-size: 2em; text-align: center; margin-bottom: 1em; font-family: "Raleway", sans-serif; }
/*Hero Sec */
#homepage .hero-sec { background: #176c06; padding: 0 0 0 0; position: relative; }
#homepage .hero-sec .overlay { position: absolute; width: 100%; height: 100%; background: #000; z-index: 110; background-color: rgba(0, 0, 0, 0.1); }
#homepage .hero-sec::after { background-image: url("https://jamaicanpatwah.com/assets/img/homepage/jamaican_patwah_avatar_bk.jpg"); background-repeat: no-repeat; background-position: top right; background-size: 1200px 706px; position: absolute; width: 850px; height: 100%; content: ""; top: -2px; right: 150px; bottom: 0; border: 3px solid transparent; z-index: 100; }
#homepage .hero-sec .jp-inner { margin: 0 auto; padding-top: 2em; }
#homepage .hero-sec .left { max-width: 600px; width: 100%; margin-top: 3em; position: relative; z-index: 999; }
/* Make H1 bigger and add shadow to make it stand out */
#homepage .hero-sec h1 { font-size: 2.8em; color: #fff; font-family: "Montserrat", sans-serif; font-weight: 900; line-height: 1.4em; letter-spacing: -1px; text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.6); text-transform: none; }
#homepage .hero-sec h1 em { /* font-size: 1.15em; */ color: #ffe600; text-shadow: 0 0 10px rgba(255, 230, 0, 0.5); }
#homepage .hero-sec p.sub_desc { color: #e0ffe0; font-size: 1.4em; text-align: left; line-height: 1.6em; margin-top: 1.5em; text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.5); }
#homepage .hero-sec p.sub_desc i { color: #98e0ab; font-size: .8em; }
#homepage .hero-sec a.cta-btn { display: block; background: #b52121; color: #fff; padding: 1.2em 1.8em; width: 250px; text-align: center; }
#homepage .hero-sec a.cta-btn { font-weight: bold; font-size: 1.15em; text-transform: uppercase; border-radius: 8px; margin: 2em 0 3em 0; font-weight: bold; }
#homepage .hero-sec a.cta-btn { box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3); letter-spacing: 0.05em; transition: background-color 0.3s ease, box-shadow 0.3s ease; }
#homepage .hero-sec a.cta-btn:hover { background: #329310; text-decoration: none; box-shadow: 0 6px 15px rgba(0, 0, 0, 0.4); }
/* Top Sec 
----------------------------------------- **/
/*Word of the Day*/
#homepage .top-focus-sec { display: flex; }
#homepage .wft-day-container { max-width: 550px; width: 100%; }
#homepage .wft-day .word_of_day_label { display: inline-block; background: #37570e; color: #fff; padding: .4em 1em; font-family: 'Raleway', Helvetica, Arial; }
#homepage .wft-day .word_of_day_label { margin-bottom: .5em; }
#homepage .wft-day { background: #fff; padding: 2em 2em; border: 2px solid #ddd; box-shadow: 1px 1px 3px -1px rgba(0,0,0,0.35); }
#homepage .wft-day .cur_date { display: block; font-size: 1em; margin-top: 1em; color: #aaa; float: right; font-family: 'Raleway', Helvetica, Arial; }
#homepage .wft-day dt { font-family: 'Raleway', Helvetica, Arial; font-size: 1.5em; color: #333; }
#homepage .wft-day dt h2 { display: inline; font-size: 1.9em; }
#homepage .wft-day dd { font-size: .95em; }
#homepage .wft-day dd em { display: block; margin-bottom: 1em; color: #61931E; }
#homepage .wft-day dd p { color: #555; margin-bottom: .5em; }
#homepage .wft-day dd p i { color: #888; }
#homepage a.wft-link:hover { text-decoration: none; }
#homepage .wft-day .get-def { display: none; }
#homepage .subscribe-sec { padding: 1em; background: #444; }
/* trending */
#homepage .trending-sec { margin: 0 0 0 2em; font-family: "Raleway", sans-serif; }
#homepage .trending-sec h3 { font-size: 1.6em; margin-bottom: 1em; }
#homepage .trending-sec ul { width: 400px; display: block; }
#homepage .trending-sec li { background: #c5c5c5; width: 100px; }
#homepage .trending-sec li:hover { width: 100% !important; }
#homepage .trending-sec li a:hover { background: #075c1c; text-decoration: none; color: #fff !important; }
#homepage .trending-sec li a { font-size: 1.1em; color: #222; white-space: nowrap; display: block; padding: .8em 1em; font-weight: bold; }
#homepage .trending-sec li a span { display: inline-block; margin-right: 1em; }
#homepage .trending-sec li.one { width: 95%; }
#homepage .trending-sec li.two { width: 80%; background: #c5c5c5; }
#homepage .trending-sec li.three { width: 70%; background: #ccc; }
#homepage .trending-sec li.four { width: 60%; background: #ddd; }
#homepage .trending-sec li.four a { color: #444; font-size: 1em; }
#homepage .trending-sec li.five { width: 50%; background: #e1e1e1; }
#homepage .trending-sec li.five a { color: #888; font-size: 1em; }
#homepage .trending-sec li.six { width: 40%; background: none; border: none; }
#homepage .trending-sec li.six a { color: #888; font-size: 1em; }
#homepage .trending-sec a.browse { float: right; font-weight: bold; color: #2E882D; font-size: .9em; }
/*Translator Demo
-----------------------------------------*/
#homepage .translator-demo-sec-bg { background: #244625; }
#homepage .translator-demo-sec { padding: 3em 1em 2em 1em; }
#homepage .translator-demo-sec hgroup { text-align: center; color: #fff; }
#homepage .translator-demo-sec hgroup h6 { font-size: .9em; margin-bottom: 1em; color: #ccc; }
#homepage .translator-demo-sec hgroup h4 { font-size: 1.7em; font-family: "Raleway", sans-serif; }
#homepage .translator-demo-sec input#translator_demo_text { max-width: 650px; width: 95%; margin: 1em auto; display: block; border-radius: 5px; font-size: .9em; }
#homepage .translator-demo-sec input#translator_demo_text { height: 30px; padding: .4em; text-align: center; }
#homepage .translator-demo-sec a#translator_demo_link { border-radius: 5px; border: 1px solid #46A045; padding: .6em 1em; background: #2E882D; }
#homepage .translator-demo-sec a#translator_demo_link { color: #fff; max-width: 100px; width: 100%; text-align: center; font-family: "Trebuchet MS", Helvetica, sans-serif; font-size: .8em; display: block; margin: 1em auto; }
/* bundle feedback
-----------------------------------------*/
#homepage .bundle-feedback { max-width: 760px; margin: 0 auto 1.25em auto; padding: 1rem 1.25rem; background: #f7f7f7; border-left: 4px solid #2e882d; border-radius: 10px; box-shadow: 0 2px 8px rgba(0,0,0,0.05); }
#homepage .bundle-feedback__quote { margin: 0; color: #333; font-size: 1rem; line-height: 1.65; font-style: italic; }
#homepage .bundle-feedback__meta { margin: .55rem 0 0 0; color: #666; font-size: .9rem; font-weight: 700; }
/* patwah-academy-sec
-----------------------------------------*/
#homepage .patwah-academy-sec-bg { background: #fff; }
#homepage .patwah-academy-sec { padding: 0 0 1.5em 0; }
#homepage .patwah-academy-sec .content.jp-inner { padding-bottom: 0.75em; }
#homepage .patwah-academy-sec h2 { font-size: 2em; padding: 1em 0 .4em 0; color: #444; }
#homepage .patwah-academy-sec p { font-size: .95em; max-width: 720px; color: #666; line-height: 1.6em; }
#homepage .patwah-academy-sec .academy-benefits { display: grid; gap: .45em; margin: 1em 0 1.25em 0; }
#homepage .patwah-academy-sec .academy-benefit {
  display: flex;
  align-items: center;
  gap: .65em;
  color: #4f5c46;
  font-size: .98em;
  font-weight: 600;
  line-height: 1.5;
  padding: .65em .85em;
  border: 1px solid #d9dfd1;
  border-radius: 12px;
  background: #f8faf5;
}
#homepage .patwah-academy-sec .academy-benefit__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 1.7em;
  height: 1.7em;
  border-radius: 999px;
  color: #228b22;
  background: #e9f4e2;
}
#homepage .patwah-academy-sec .academy-benefit__iconSvg {
  width: 1em;
  height: 1em;
}
#homepage .patwah-academy-sec .academy-benefit__text { display: block; }
#homepage .patwah-academy-sec a.featured-article { display: flex; background: #f1f1f1; padding: 1em; }
#homepage .patwah-academy-sec a.featured-article:hover { text-decoration: none; }
#homepage .patwah-academy-sec a.featured-article .left { width: 100%; max-width: 400px; margin-right: 2em; }
#homepage .patwah-academy-sec a.featured-article .left img { width: 100%; }
#homepage .patwah-academy-sec a.featured-article .right h6 { font-size: 1.6em; margin-bottom: .5em; color: #329310; margin-top: 2em; }
#homepage .patwah-academy-sec a.featured-article .right p { font-size: .9em; margin-bottom: 1em; }
#homepage .patwah-academy-sec a.featured-article .right span { color: #3f93f3; font-size: .9em; }
#homepage .patwah-academy-sec .join-academy { background: linear-gradient(180deg, #f0f0f0 0%, #e4e4e4 100%); margin-top: 1em; padding: 1.75em 1em; border-top: 1px solid #d9d9d9; }
#homepage .patwah-academy-sec .join-academy .jp-inner { display: flex; align-items: center; justify-content: space-between; gap: 1.5em; }
#homepage .patwah-academy-sec .join-academy p { width: auto; flex: 1; font-size: 1em; color: #555; text-align: left; }
#homepage .patwah-academy-sec .join-academy p em { font-weight: bold; display: inline-block; font-family: "Raleway", sans-serif; color: #444; font-size: 1.2em; margin-bottom: .5em; }
#homepage .patwah-academy-sec .join-academy a { display: block; font-size: 1em; background: #444; color: #fff; padding: 1em 1.4em; min-width: 240px; width: auto; margin-left: 0; text-align: center; font-weight: bold; border-radius: 25px; flex-shrink: 0; }
#homepage .patwah-academy-sec .join-academy a:hover { text-decoration: none; background: #1a68b0; }
/*Define it here*/
#homepage .add_word_master_sec { border: 4px solid #2b8040; border-left: none; border-right: none; background: #333; margin: 0; }
#homepage .add_word_master_sec .item { width: 100%; max-width: 90%; }
#homepage .add_word_sec_br { display: none; }
#homepage .add_word_master_sec .add-word { background: #333; padding: 2em 1em; text-align: center; display: table; }
#homepage .add_word_master_sec .add-word hgroup { display: table-cell; vertical-align: middle; }
#homepage .add_word_master_sec .add-word h6 { font-size: .9em; color: #aaa; margin-bottom: .5em; }
#homepage .add_word_master_sec .add-word h2 { font-size: 1.5em; color: #ccc; font-family: "Raleway", sans-serif; }
#homepage .add_word_master_sec .add-word h2 a { text-decoration: underline; color: #8abd48; display: inline-block; margin-top: 0.3em; }
/* quiz-sec
--------------------------------------*/
#homepage .quiz-sec { padding: 1em 0; }
#homepage .quiz-sec .view-all-quiz { margin: 1em auto 0 auto; display: block; font-size: .8em; color: #fff; width: 120px; }
#homepage .quiz-sec .view-all-quiz { background: #1a68b0; padding: .8em 1em; text-align: center; border-radius: 15px; }
#homepage .quiz-sec .content { display: flex; justify-content: space-between; }
#homepage .quiz-sec .content a.item { display: block; width: 48%; background: #fff; border: 1px solid #ddd; }
#homepage .quiz-sec .content a.item:hover { text-decoration: none; }
#homepage .quiz-sec .content .quiz-empty { width: 100%; padding: 1.25em 1em; background: #fff; border: 1px dashed #bbb; text-align: center; }
#homepage .quiz-sec .content .quiz-empty p { margin: 0 0 1em; color: #555; line-height: 1.6em; }
#homepage .quiz-sec .content .quiz-empty a.inline { display: inline-block; width: auto; margin: 0; }
#homepage .quiz-sec .content .item img { display: block; width: 100%; }
#homepage .quiz-sec .content .item em { font-size: 1.3em; display: block; margin: 1em 1em 1em 1em; color: #444; }
#homepage .quiz-sec .content .item p { font-size: .9em; color: #777; margin: 0 1em; line-height: 1.7em; }
#homepage .quiz-sec .content .item span.play { font-size: 1em; margin: 1.5em 1em; display: block; color: #cb1913; }
/* download-app-sec
--------------------------------------*/
#homepage .download-app-sec { background: #555; padding: 2em 0 1em 0; }
#homepage .download-app-sec h3 { color: #ddd; }
#homepage .download-app-sec .item { width: 50%; background: #eee; border: 1px solid #bbb; padding: 1em; }
#homepage .download-app-sec .item img { width: 100%; display: block; }
#homepage .download-app-sec .item em { display: block; font-size: 1.3em; margin-bottom: 1em; text-align: center; }
#homepage .download-app-sec .item p { font-size: .9em; color: #555; margin-bottom: 1em; text-align: center; display: block; }
#homepage .download-app-sec .item a.btn { width: 200px; margin: 0 auto; display: block; }
#homepage .download-app-sec .item a.btn img { width: 100%; }
@media screen and (max-width: 1300px) {
  #homepage .hero-sec::after {
    background-size: 1100px 606px;
    width: 850px;
    top: -2px;
    right: 0px;
    bottom: 0;
  }
}
@media screen and (max-width: 1170px) {
  #homepage .hero-sec .overlay {
    background-color: rgba(0, 0, 0, 0.8);
  }
}
@media screen and (max-width: 800px) {
  /*Hero Sec */
  #homepage .hero-sec {
    padding: 0;
    margin:0;
    border: 1px solid transparent;
    overflow-x: hidden;
  }
  #homepage .hero-sec .jp-inner {
    padding: 0;
    margin: 0;
  }
  #homepage .hero-sec .left {
    margin: 0;
    max-width: 97%;
    padding: 5em 1.5em 1.5em 1.5em;
  }
  #homepage .hero-sec h1 {
    font-size: 2em;
  }
  #homepage .hero-sec p.sub_desc {
    font-size: 1.2em;
  }
  #homepage .hero-sec::after {
    background-size: 900px 506px;
  }
  #homepage .hero-sec .jpNewsletterSubscriber_v_2 fieldset input {
    width: 90%;
  }
  /* browse */
  #homepage .trending-sec {
    margin: 2em auto 1em auto;
    max-width: 100%;
    width: 100%;
  }
  #homepage .trending-sec ul {
    width: 100%;
  }
  #homepage .trending-sec li a {
    white-space: normal;
  }
  #homepage .trending-sec a.browse {
    float: none;
    font-weight: bold;
    color: #fff;
    font-size: .96em;
    background: #0f4f8a;
    padding: .8em;
  }
  #homepage .trending-sec a.browse {
    margin: 1em auto 0 auto;
    display: block;
    width: 180px;
    border-radius: 10px;
    text-align: center;
  }
  #homepage .trending-sec a.browse:hover {
    background: #329310;
    text-decoration: none;
  }
}
@media screen and (max-width: 690px) {
  /*Hero Sec */
  #homepage .hero-sec {
  }
  #homepage .hero-sec .jp-inner {
  }
  #homepage .hero-sec .left {
  }
  #homepage .hero-sec .jpNewsletterSubscriber_v_2 fieldset a {
    margin-bottom: 2em;
  }
  #homepage .hero-sec h1 {
  }
  #homepage .hero-sec p.sub_desc {
  }
}
@media screen and (max-width: 800px) {
  /*Word of the Day
------------------------------*/
  #homepage .top-focus-sec {
    display: block;
  }
  #homepage .wft-day-container {
    max-width:950px;
    width: 100%;
  }
  /* patwah-academy-sec
-----------------------------------------*/
  #homepage .patwah-academy-sec h2 {
    font-size: 1.7em;
  }
  #homepage .patwah-academy-sec p {
    font-size: .9em;
  }
  #homepage .patwah-academy-sec a.featured-article {
    display: block;
  }
  #homepage .patwah-academy-sec a.featured-article .right h6 {
    margin-top: 1em;
  }
  #homepage .patwah-academy-sec .join-academy .jp-inner {
    display: block;
    align-items: center;
    justify-content: space-between;
  }
  #homepage .patwah-academy-sec .academy-benefits {
    justify-items: center;
  }
  #homepage .patwah-academy-sec .academy-benefit {
    justify-content: center;
    text-align: left;
    width: 100%;
    max-width: 430px;
    padding: .6em .75em;
  }
  #homepage .patwah-academy-sec .join-academy p {
    margin-bottom: 2em;
    text-align: center;
  }
  #homepage .patwah-academy-sec .join-academy p em {
    margin-bottom: .7em;
  }
  #homepage .patwah-academy-sec .join-academy a {
    margin: 0 auto;
    min-width: 220px;
  }
  /* download-app-sec
--------------------------------------*/
  #homepage .download-app-sec .item {
    width: 90%;
  }
  #homepage .download-app-sec .item img {
    width: 100%;
    display: block;
  }
  #homepage .download-app-sec .item em {
    display: block;
    font-size: 1.3em;
    margin-bottom: 1em;
    text-align: center;
  }
  #homepage .download-app-sec .item p {
    font-size: .9em;
    color: #555;
    margin-bottom: 1em;
    text-align: center;
    display: block;
  }
  #homepage .download-app-sec .item a.btn {
    width: 200px;
    margin: 0 auto;
    display: block;
  }
  #homepage .download-app-sec .item a.btn img {
    width: 100%;
  }
}
@media screen and (max-width: 510px) {
  #homepage .wft-day dt h2 {
    font-size:1.4em;
  }
  #homepage .wft-day dd {
    display: none;
  }
  #homepage .wft-day .get-def {
    display: block;
    margin-top: 1.5em;
    font-size: .95em;
    color: #777;
    font-weight: bold;
  }
  /* quiz-sec
  --------------------------------------*/
  #homepage .quiz-sec .content {
    display: block;
  }
  #homepage .quiz-sec .content a.item {
    display: block;
    width: 90%;
    margin-bottom: 2em;
  }
  #homepage .quiz-sec .content .quiz-empty {
    width: 90%;
    margin-bottom: 2em;
  }
}