
/* ==============================
   BASE
============================== */

.rj-blog-post{
  font-family:Arial,Helvetica,sans-serif!important;
  line-height:1.8!important;
  color:#333!important;
  background:#fff!important;
  font-size:16px!important;
}

.rj-blog-post h1{
  color:#117a65!important;
  font-size:27px!important;
  line-height:1.45!important;
  margin:8px 0 15px!important;
}

.rj-blog-post h2{
  color:#fff!important;
  background:linear-gradient(135deg,#117a65,#0b5345)!important;
  padding:11px 14px!important;
  border-radius:7px!important;
  font-size:21px!important;
  line-height:1.45!important;
  margin:28px 0 14px!important;
}

.rj-blog-post h3{
  color:#117a65!important;
  font-size:19px!important;
  line-height:1.5!important;
  margin:22px 0 10px!important;
}

.rj-blog-post p{
  margin:10px 0!important;
}

.rj-blog-post ul,
.rj-blog-post ol{
  padding-left:25px!important;
  margin:10px 0 16px!important;
}

.rj-blog-post li{
  margin-bottom:7px!important;
}

/* ==============================
   BOXES
============================== */

.rj-info-box{
  background:#f4f8f7!important;
  border-left:5px solid #117a65!important;
  padding:14px 16px!important;
  margin:18px 0!important;
  border-radius:5px!important;
}

.rj-success-box{
  background:#eefaf3!important;
  border-left:5px solid #27ae60!important;
  padding:14px 16px!important;
  margin:18px 0!important;
  border-radius:5px!important;
}

.rj-warning-box{
  background:#fff8e8!important;
  border-left:5px solid #e67e22!important;
  padding:14px 16px!important;
  margin:18px 0!important;
  border-radius:5px!important;
}

.rj-danger-box{
  background:#fff2f2!important;
  border-left:5px solid #c0392b!important;
  padding:14px 16px!important;
  margin:18px 0!important;
  border-radius:5px!important;
}

/* ==============================
   READ ALSO
============================== */

.rj-read-also{
  background-color:#f4f6f6!important;
  border-left:4px solid #c0392b!important;
  padding:12px 15px!important;
  margin:25px 0!important;
  border-radius:0 4px 4px 0!important;
  font-weight:bold!important;
  box-shadow:0 2px 4px rgba(0,0,0,.05)!important;
}

.rj-read-also span{
  font-family:Arial,sans-serif!important;
  font-size:16px!important;
}

.rj-read-also strong{
  color:#117a65!important;
}

.rj-read-also a{
  color:#c0392b!important;
  font-weight:bold!important;
  text-decoration:none!important;
}

.rj-read-also a:hover{
  color:#117a65!important;
}

/* =========================================================
   TABLE SYSTEM
   IMPORTANT:
   2 & 3 COLUMN = FIT SCREEN
   4+ COLUMN = HORIZONTAL SCROLL ONLY WHEN REQUIRED
========================================================= */

.rj-table-wrapper{
  width:100%!important;
  max-width:100%!important;
  overflow-x:auto!important;
  margin:18px 0!important;
  -webkit-overflow-scrolling:touch!important;
}

/* Normal / 4+ column table */
.rj-custom-table{
  width:100%!important;
  min-width:700px!important;
  border-collapse:collapse!important;
  table-layout:auto!important;
  font-size:16px!important;
  background:#fff!important;
}

.rj-custom-table th,
.rj-custom-table td{
  border:1px solid #d7d7d7!important;
  padding:10px 11px!important;
  vertical-align:top!important;
  font-size:16px!important;
  line-height:1.65!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
}

.rj-custom-table th{
  background:#117a65!important;
  color:#fff!important;
  font-weight:700!important;
  text-align:left!important;
}

.rj-custom-table tr:nth-child(even) td{
  background:#f8faf9!important;
}

/* 2 Column */
.rj-custom-table.two-column-table{
  width:100%!important;
  min-width:0!important;
  table-layout:fixed!important;
}

.rj-custom-table.two-column-table th,
.rj-custom-table.two-column-table td{
  width:50%!important;
}

/* 3 Column */
.rj-custom-table.three-column-table{
  width:100%!important;
  min-width:0!important;
  table-layout:fixed!important;
}

.rj-custom-table.three-column-table th,
.rj-custom-table.three-column-table td{
  width:33.3333%!important;
}

/* Center */
.center-align{
  text-align:center!important;
}

/* ==============================
   STUDENT TOOLS
   ONLY ONE TIME
============================== */

.rj-student-tools{
  display:grid!important;
  grid-template-columns:repeat(3,1fr)!important;
  gap:12px!important;
  margin:18px 0!important;
}

.rj-tool-card{
  display:block!important;
  text-decoration:none!important;
  background:#f7faf9!important;
  border:1px solid #d8e7e2!important;
  border-radius:9px!important;
  padding:16px 12px!important;
  text-align:center!important;
}

.rj-tool-icon{
  display:block!important;
  font-size:27px!important;
  margin-bottom:6px!important;
}

.rj-tool-title{
  color:#117a65!important;
  font-weight:700!important;
  font-size:16px!important;
}

.rj-tool-desc{
  display:block!important;
  color:#555!important;
  font-size:13px!important;
  line-height:1.45!important;
  margin-top:4px!important;
}

/* ==============================
   LINK BUTTON
============================== */

.rj-link-btn{
  display:inline-block!important;
  background:#117a65!important;
  color:#fff!important;
  padding:7px 12px!important;
  border-radius:5px!important;
  text-decoration:none!important;
  font-weight:700!important;
}

.rj-link-btn:hover{
  background:#0b5345!important;
  color:#fff!important;
}

/* ==============================
   CHECKLIST
============================== */

.rj-checklist{
  background:#f8faf9!important;
  border:1px solid #dce9e5!important;
  border-radius:7px!important;
  padding:15px 18px!important;
}

/* ==============================
   MOBILE
============================== */

@media(max-width:768px){

  .rj-blog-post{
    font-size:16px!important;
  }

  .rj-blog-post h1{
    font-size:24px!important;
  }

  .rj-blog-post h2{
    font-size:19px!important;
    padding:10px 12px!important;
  }

  .rj-blog-post h3{
    font-size:18px!important;
  }

  .rj-custom-table{
    font-size:16px!important;
  }

  .rj-custom-table th,
  .rj-custom-table td{
    font-size:16px!important;
    padding:9px 10px!important;
  }

  /* Only wide tables scroll */
  .rj-custom-table:not(.two-column-table):not(.three-column-table){
    min-width:700px!important;
  }

  .rj-student-tools{
    grid-template-columns:1fr!important;
  }

  .rj-tool-card{
    text-align:left!important;
    display:flex!important;
    align-items:center!important;
    gap:12px!important;
  }

  .rj-tool-icon{
    margin:0!important;
  }
}
