html {
 line-height:1.2;
 -webkit-text-size-adjust:100%;
 -moz-tab-size:4;
 tab-size:4;
 font-size:100%;
 font-family:ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", 
             Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, 
             "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
 font-feature-settings:normal;
 font-variation-settings:normal
}
body {
 margin: 0;
 line-height: inherit
}
footer {
  text-align: center;
  background-color: black;
  color: white;
}
hr {
 height: 0;
 color: inherit;
 border-top-width: 1px
}
abbr:where([title]) {
 -webkit-text-decoration: underline dotted;
 text-decoration: underline dotted
}
a {
 color: inherit;
 text-decoration: inherit
}
.info {
 margin-left: 0rem;
 border-radius: 0.125rem;
 padding: 1rem;
 color: white;
 background-color: black
}
.info:hover {
  background-color: rgb(51 66 77 / var(--tw-bg-opacity));
  --tw-bg-opacity: 0.8;
}
.sticky {
  position: -webkit-sticky;
  position: sticky;
  z-index: 1
}
.top-0 {
 top: 0px
}
.front-page-outline {
 padding-left: 8px;
 padding-right: 2px;
 border-style: ridge;
 border-color: gray;
 color: black;
 background-image:url('ctcsudoku.jpg');
 filter: brightness(135%);
 background-size:cover;
/* height: 100vh; */
}
.page-outline {
 padding-left: 8px;
 padding-right: 2px;
 border-style: ridge;
 border-color: gray;
 background-image:url('cover.jpg');
}
.mx-auto {
 margin-left: auto;
 margin-right: auto
}
.ml-5 {
 margin-left: 1.25rem
}
.ml-10 {
 margin-left: 2.5rem
}
.mr-2 {
 margin-right: 0.5rem
}
.w-6 {
 width: 1.5rem
}
.h-6 {
 height: 1.5rem
}
.flex {
 display: flex
}
.h-10 {
 height: 2.0rem
}
.h-16 {
 height: 4rem
}
.h-full {
 height: 99%
}
.min-h-full {
 min-height: 100%
}
.w-5 {
 width: 5%
}
.w-60 {
 width: 60%
}
.w-10 {
 width: 2.0rem
}
.w-full {
 width: 100%
}
.max-w-7xl {
 max-width: 100%
}
.flex-shrink-0 {
 flex-shrink: 0
}
.items-center {
 align-items: center
}
.justify-start {
 justify-content: flex-start
}
.space-x-4 > :not([hidden]) ~ :not([hidden]) {
 margin-right:0rem;
 margin-left:1rem
}
.bg-gray-100 {
 background-color: rgb(243 244 246)
}
.bg-gray-800 {
 background-color: rgb(31 41 55)
}
.bg-gray-900 {
 background-color: rgb(17 24 39)
}
.bg-white {
 background-color: rgb(255 255 255)
}
.px-3 {
 padding-left: 0.75rem;
 padding-right: 0.75rem
}
.px-4 {
 padding-left: 1rem;
 padding-right: 1rem
}
.py-2 {
 padding-top: 0.5rem;
 padding-bottom: 0.5rem
}
.py-6 {
 padding-top: 0.2rem;
 padding-bottom: 0.2rem
}
.text-3xl {
 font-size: 0.975rem;
 line-height: 0.95rem
}
.text-sm {
 font-size: 0.75rem;
 line-height: 0.75rem
}
.font-bold {
 font-weight: 700
}
.font-medium {
 font-weight: 500
}
.tracking-tight {
 letter-spacing: -0.025em
}
.text-blue-500 {
 color: rgb(0 0 255)
}
.text-gray-300 {
 color: rgb(209 213 219)
}
.text-gray-900 {
 color: rgb(17 24 39)
}
.text-white {
 color: rgb(255 255 255)
}
.placeholder-gray-500::placeholder {
 color: #a0aec0
}
.-space-y-px {
 margin-top: -1px
} 
.rounded-md {
 border-radius: 0.375rem
}
.hover\:bg-gray-700:hover {
 background-color: rgb(55 65 81)
}
.hover\:text-white:hover {
 color: rgb(255 255 255)
}
.hover\:underline:hover {
 -webkit-text-decoration-line: underline;
 text-decoration-line: underline
}
.mininewspaper {
column-count: 3;
list-style-type:none
}
.newspaper {
column-count: 4;
list-style-type:none
}
.mobilemininewspaper {
column-count: 1;
list-style-type:none
}
.mobilenewspaper {
column-count: 1;
list-style-type:none
}
.container {
  position: relative;
  margin:auto;
  width: 75%;
  overflow: hidden;
  padding-bottom: 45%;
}
.mobilecontainer {
  position: relative;
  left: 0px;
  width: 100%;
  overflow: hidden;
  height: 70vh;
}
.fullcontainer {
  position: relative;
  left: 0px;
  width: 100%;
  overflow: hidden;
  padding-top: 100%;
}
.container2 {
  position: relative;
  margin:auto; 
  width: 60%;
  overflow: hidden;
  padding-bottom: 33.75%;
}
.mobilecontainer2 {
  position: relative;
  margin:auto; 
  width: 95%;
  overflow: hidden;
  padding-bottom: 60%;
}
.grid-container {
  display: grid;
  grid-template-columns: auto auto;
  grid-template-rows: 40vh 49vh;
  gap: 1vh;
  padding: 0vh;
}
.four-grid-container {
  display: grid;
  justify-content: space-evenly;
  grid-template-columns: auto auto auto auto;
  grid-template-rows: auto;
  gap: 2vh;
  padding: 2vh;
}
.seven-grid-container {
  display: grid;
  justify-content: space-evenly;
  grid-template-columns: auto auto auto auto auto auto auto;
  grid-template-rows: auto;
  gap: 2vh;
  padding: 2vh;
}
.double-container {
  display: grid;
  justify-content: space-evenly;
  grid-template-columns: auto auto;
  grid-template-rows: auto;
  gap: 2vh;
  padding: 2vh;
}
.mobiledouble-container {
  display: grid;
  justify-content: space-evenly;
  grid-template-columns: auto;
  grid-template-rows: auto auto;
  gap: 2vh;
  padding: 2vh;
}
.ninegrid-container {
  display: grid;
  grid-template-columns: auto auto;
  gap: 10px;
  padding: 10px;
}
.responsiveab-iframe {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  border: none;
}
.responsive-iframe {
  position: relative;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  border: none;
}
.app-first{
  font-size: 1.0rem;
  line-height: 1.75rem;
  font-weight: 600;
  margin-bottom: 0.5rem;
  display: flex;
  align-items: center;  
}
.app-header {
  font-size: 1.0rem;
  line-height: 1.75rem;
  font-weight: 600;
  margin-bottom: 0.5rem;
  margin-top:0.5rem;
  display: flex;
  align-items: center;
  justify-content: space-around;
}
.button-style {
  align-items: center;
  justify-content: space-around;
  padding: 0.6rem 0.6rem;
  border-width: 1px;
  border-radius: 0.25rem;
  border-color: green;
  background-color: green;
  color: white; 
}
.button-style:hover {
  justify-content: space-around;
  align-items: center;
  padding: 0.6rem 0.6rem;
  border-width: 1px;
  border-radius: 0.25rem;
  border-color: white;
  background-color: white;
  color: green; 
}
.topnav {
  overflow: hidden;
}

.topnav a {
  float: left;
  display: block;
  color: #f2f2f2;
}

.topnav .icon {
  display: none;
}

@media screen and (max-width: 900px) {
  .topnav a:not(:first-child) {display: none;}
  .topnav a.icon {
    float: right;
    display: block;
    padding-right: 1rem;
  }
}

@media screen and (max-width: 900px) {
  .topnav.responsive {position: relative;}
  .topnav.responsive a.icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
}
/*
@media (min-width: 640px) {
 .sm\: px-6 {
  padding-left: 1.0rem;
  padding-right: 1.0rem;
 }
}
@media (min-width: 4096px) {
 .lg\: px-8 {
  padding-left: 2rem;
  padding-right: 2rem; 
 }
}
*/