/* THE KIRIBBEAN COLOR PUH-LET:
#4AA2BF – blue
#BF4A4C – red
#470175 – lighter purple
#30014F – darker purple
#E4E4E4 – off-white 1
#EEE – off-white 2
*/
@import url('https://fonts.googleapis.com/css2?family=Carter+One&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Open+Sans&display=swap');
.carter-one-regular {
  font-family: "Carter One", system-ui;
  font-weight: 400;
  font-style: normal;
}
body {
min-width:720px;
background-color:#30014F;
font-family: "Open Sans", system-ui;
font-size: 14px;
}
h1, h2, h3, h4 {
font-family: "Carter One", sans-serif;
color:#4AA2BF;
}
h1 {
font-size:45px;
margin-bottom:0;
}
h2 {
font-size:40px;
}
h3 {
font-size:30px;
}
h4 {
font-size:25px;
}
ul {
  list-style-image: url('bullet.png')
}
a {
  text-decoration:none;
  cursor: pointer;
}
img {
  max-width: 100%;
}
.banner {
border-radius:7px;
margin-left: auto;
margin-right: auto;
margin-bottom: 7px;
background-color:#470175;
background-image: url("banner_site.png");
background-position-x:right;
background-size: cover;
background-repeat: no-repeat;
width:60%;
height:150px;
}
.banner p {
display:relative;
font-family: "Carter One", sans-serif;
font-size:70px;
padding:30px;
color:#fff;
text-align: center;
}
.belowbanner {
display:flex;
width:100%;
justify-content:center;
}
.sidebar {
min-width:8%;
max-height:250px;
padding-top:7px;
position:sticky;
top:0;
height:auto;
}
.sidebar.title, .mobile.title {
font-family:"Open Sans", system-ui;
font-size: 18px;
color:#fff;
align-content:center;
width:auto;
min-height:25px;
padding: 7px;
margin-bottom: 5px;
background-color:#4AA2BF;
}
.sidebar.left{
border-radius: 7px 0 0 7px;
}
.sidebar.right {
border-radius: 0 7px 7px 0;
right:0;
}
.sidebar.title i { /* For sidebar's social media icons */
color:#eee;
font-size: 20px;
text-align:center;
}
.sidebar.title.ico {
max-width:30px;
background-color:#470175;
}
.sidebar.title:hover, .sidebar.sub:hover, .linkico:hover, .mobile.title:hover, .readmore:hover, #prev:hover, #next:hover {
background-color:#BF4A4C;
cursor:pointer;
}
.hamburger {
  width:50%;
  height:auto;
  margin: 0 auto 5px auto;
  text-align: left;
  color:#eee;
  background-color: #4AA2BF;
  border-radius: 7px;
  padding: 5px;
  font-size: 30px;
  display:none;
}
.hamburger:hover {
  cursor: pointer;
}
.hamburger i {
  padding-right:5px;
}
.hamburger div {
  margin:0;
  padding:3px 7px !important;
}
.mobile {
  background-color: #4AA2BF;
  border-radius: 7px;
  margin-top:20px;
}
.mobile h3 {
  color:white;
  font-family: "Carter One";
}
.maincol {
background-color:#eee;
width:50%;
padding:0 14px 0 14px;
border-radius:7px;
}
.maincol h1, h2, h3 {
text-align:center;
}
.maincol h4 {
margin: 7px 0;
}
.maincol table {
width:100%;
text-align:left;
border-collapse:collapse;
}
.maincol table b {
font-size:25px;
font-weight:800;
color: #470175;
}
.maincol tr {
border-bottom: 2px dotted #ccc;
}
.maincol tr:nth-child(3) {
border-bottom: none;
}
.maincol td {
padding:5px 0;
}
.titlesec { /* "Title Section" -- e.g. on index page, the title for a new section, like "Links" */
color:white;
background-color:#470175;
margin:0 -14px;
}
.linkico { /* "Link Icon" -- fully-rounded social media buttons in "More Links" section */
display:inline-block;
color:white;
font-size:20px;
background-color: #4AA2BF;
padding:10px;
margin:0 5px;
border-radius:7px;
}
.newsblock, .blogblock {
display:flex;
width:100%;
justify-content:space-between;
content-align:left;
padding-bottom:25px;
}
.newsblock div{
width:43%;
height:200px;
padding:0 10px 10px 10px;
overflow-y:scroll;
overflow-x:hidden;
border:1px solid #ccc;
border-radius:7px;
background-color: #eee;
}
.newsblock p {
font-size: 14px;
text-align:left;
}
.newsblock h3 {
position:sticky;
top:0;
}
.blogblock table {
  padding:0 1%;
}
.blogblock img {
  border-radius:7px;
}
.blogblock h3 {
  margin:0;
}
.blogblock tr {
  border-bottom:none;
}
.blogblock tr:nth-child(3){
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  text-align: center;
}
.blogblock p {
  margin:1px;
}
.readmore {
  max-width: 150px;
  padding: 5px;
  text-align: center;
  background-color: #4AA2BF;
  border-radius: 7px;
  color:white;
  font-family: "Carter One";
  font-size: 18px;
}
.blogblock td:nth-child(2) p{
  float:right;
  margin-right:5px;
}
@media screen and (max-width: 1100px) {
  .blogblock {flex-direction: column;}
  .hamburger{display: none;}
}
@media screen and (max-width:900px) {
  .sidebar.right, .sidebar.left {display: none;}
  .hamburger {display:block;}
}
.banner, .maincol, .sidebar.title, .sidebar.sub, .banner, .banner p, .hamburger {
filter: drop-shadow(5px 5px 7px rgba(0,0,0,0.5));
}
/* ===== BLOG NAVIGATION BUTTONS ===== */
#prev, #next, #readmore {
  background-color:#4AA2BF;
  padding:7px;
  color:#eee;
  font-size:15px;
  border-radius: 5px;
  text-decoration: none;
  border: none;
}


input {
  max-width:25px;
  text-align:center;
}
#total, #of, input {
  font-size:20px;
  font-family:"Open Sans", system-ui;
}
#pageBoxContainer {
  padding-top:20px;
  text-align: center;
}
/* ===== end blog navigation buttons ===== */