html {
  background-color:#F0F0EF;
}

body {
  max-width: 560px;  /* Adjust the width as needed */
  margin: auto;      /* Centers the content */
  line-height:1.75;
  font-size:1rem;
  margin-top:0px;
  padding-bottom:60px;
  padding-left: 40px;     /* Optional padding for aesthetics */
  padding-right: 40px;     /* Optional padding for aesthetics */
  font-family: 'Segoe UI', 'Helvetica', 'Arial', sans-serif;
  background-color:#ffffff;
  border-left:1px solid #ededed;
  border-right:1px solid #ededed;
}

h1 {
  font-size:30px;
}

#index-title {
  margin-left:-40px;
  margin-right:-40px;
  margin-bottom:40px;
  padding-top:60px;
  padding-bottom:10px;
  padding-left:40px;
  background-color:#F1D795;
  display:block;
  border-bottom:1px solid #E1C170;
}

#programming {
  margin-top:0px;
  font-weight:100;
  margin-bottom:0px;
}

#platformers {
  margin-top:-16px;
  margin-bottom:0px;
  font-weight:400;
}

#page-title {
  margin-left:-40px;
  margin-right:-40px;
  padding-top:10px;
  padding-bottom:10px;
  padding-left:40px;
  background-color:#F1D795;
  border-bottom:1px solid #E1C170;
  margin-bottom:40px;
  text-decoration:none;

  display:block;
}

#a-page-title {
  font-weight:100;
  color:black;
}

@media screen and (max-width: 640px) {
    body {
        max-width:640px;
        padding-bottom:40px;
        padding-left: 20px; /* Reduced padding for max width */
        padding-right: 20px; /* Reduced padding for max width */
    }
    #index-title {
      margin-left:-20px;
      margin-right:-20px;
      padding-left:20px;
    }

    #page-title {
      padding-left:20px;
      margin-left:-20px;
      margin-right:-20px;
    }
}

h2 {
    font-weight:100;
    font-size:32px;
    margin-bottom:10px;
}

h3 {
    margin-top:40px;
    margin-bottom:10px;
    font-size:20px;
    font-weight:200;
}

h4 {
  font-weight:100;
  font-size:16px;
}

hr {
    margin-top:0px;
}

p {
    font-size: 1rem;
    font-weight:200;
}

blockquote {
    font-size: 14px;
    background-color:#FFFFE2;
    border-radius:4px;
    margin:0px;
    margin-top:10px;
    margin-bottom:10px;
    padding:2px 10px;
}

iframe {
    max-width: 720px;
    height:400px;
    width:100%;
    border:none;
    border-radius: 4px;
    margin-top:8px;
    margin-bottom:8px;
}

.codehilite {
    margin-top:8px;
    margin-bottom:8px;
    padding: 4px 16px;
    border-radius: 4px;
    font-size:15px;
    overflow-x:auto;
}

a {
  font-weight:100;
  color:#1569A4;
  text-decoration:none;
}

.disabled-text {
  color:#cccccc;
  -webkit-user-select: none; /* Safari */
  -ms-user-select: none; /* IE 10 and IE 11 */
  user-select: none; /* Standard syntax */
}