@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&display=swap');

body {
font-family: "IBM Plex Mono", monospace;
font-size:14px;
font-weight: 400;
font-style: normal;
color:black;
margin:20px;
}

ul {
margin-left: -1px;
}

li {
padding:5px;
}

p.regular_text {
margin:0;
}

p.small_text {
font-size:12px;
margin-bottom:5px;
}

p.large_text {
font-size:16px;
margin-bottom:5px;
}

h2 {
font-size:16px;
margin:0;
}

a.regular_link {
color:black;
line-height:17px;
text-decoration:underline;
}

a.regular_link:hover {
font-weight:600;
color:#2664eb;
text-decoration:underline;
}

input {
font-family: "IBM Plex Mono", monospace;
font-size:14px;
padding:10px;
margin-top:5px;
background-color: white;
border:1px dotted black;
border-radius:5px;
}

select {
width:100%;
font-family: "IBM Plex Mono", monospace;
font-size:14px;
padding:10px;
margin-top:5px;
background-color: white;
border:1px dotted black;
border-radius:5px;
box-sizing: border-box;
}

.submit_button {
font-family: "IBM Plex Mono", monospace;
font-size:14px;
padding:10px;
margin-top:5px;
color:black;
background-color: #d3e3fd;
border:1px dotted black;
border-radius:5px;
}


.icons
{
vertical-align:middle;
}

p.spacer {
margin:5px;
}

/*******************/
/* COLS */
.box_grid {
display: grid;
grid-column-gap: 15px;
grid-row-gap: 15px;
grid-template-columns: 24.6% 49.6% 24.6%;
}

.box_grid_container {
overflow:hidden;
box-sizing: border-box;
}
/******************/

.content_box_container {
width:100%;
box-shadow: 3px 3px 60px -36px rgba(102,77,77,0.75);
display:block;
}

.content_box_header {
width:100%px;
padding:15px;
background: #1196cd;
color:white;
border-top-left-radius:8px;
border-top-right-radius:8px;
box-sizing: border-box;
}

.content_box_content_ads {
width:100%px;
padding:10px;
background:white;
color:black;
border:1px dotted #1196cd;
border-radius:5px;
box-sizing: border-box;
}

.content_box_content {
width:100%px;
padding:10px;
background:white;
color:black;
border-bottom-left-radius:8px;
border-bottom-right-radius:8px;
border-left:1px dotted #2664eb;
border-right:1px dotted #2664eb;
border-bottom:1px dotted #2664eb;
box-sizing: border-box;
}

.show_categories {
display:block;
}

.show_mobile_categories {
display:none;
}

/* OLD CSS CODE */
#code_container_first {
background:black;
color:white;
padding:10px;
margin-top:5px;
margin-bottom:15px;
border-radius:5px;
word-wrap : break-word;
display:inline-block;
}

#code_container {
background:black;
color:white;
padding:10px;
margin-top:7px;
margin-bottom:15px;
border-radius:5px;
word-wrap : break-word;
display:inline-block;
}

#code_explain {
border:1px dotted black;
padding:10px;
background:#fcfcfc;
}

.image_container {
margin-top:10px;
margin-bottom:0px;
}

.article_out_of_date {
width:100%;
padding:10px;
margin-bottom:20px;
background:red;
color:white;
box-sizing: border-box;
}

.article_note {
  width:100%;
  padding:10px;
  margin-bottom:20px;
  background:#81d4f7;
  color:black;
  box-sizing: border-box;
  }

/* Article Image Size */
img.article_image {
width:70%;
}

img.article_image_large {
width:100%;
}

/* gle noad */
ins.adsbygoogle[data-ad-status='unfilled'] {
display: none !important;
}

kbd {
background:lightgrey;
border:1px solid black;
padding:2px;
}

a.regular_text_link {
font-weight:600;
color:#2664eb;
}

/* END OLD CSS CODE */


@media only screen and (max-width: 600px) {

.box_grid {
display: grid;
grid-column-gap: 10px;
grid-row-gap: 10px;
grid-template-columns: 100%;
}

/* OLD CSS CODE */

#code_container_first {
width:100%;
background:black;
color:white;
padding:10px;
margin-top:5px;
margin-bottom:15px;
border-radius:5px;
text-wrap: balance;
box-sizing: border-box;
}

#code_container {
width:100%;
background:black;
color:white;
padding:10px;
margin-top:7px;
margin-bottom:15px;
border-radius:5px;
text-wrap: balance;
box-sizing: border-box;
}

.show_categories {
display:none;
}

.show_mobile_categories {
cursor:pointer;
display:block;
}

/* ARTICLE IMAGE SIZE */
img.article_image {
width:100%;
}

/* END OLD CSS CODE */

a.regular_text_link {
font-weight:600;
color:#2664eb;
word-wrap : break-word;
}



}