/*
Christopher Kozinski
12/15/20
CIS133DA final
CSS stylesheet
*/
* body {
  background-color: black;
  color: #ffffff;
  font-family: calibri;
  margin: 50px;
  padding: 50px;
}
/* Create colors for NAV element and menu*/
nav {
    margin: 0px auto;
    width: 100%;
    height: 50px;
    background-color: #1d34de;
    color:#ffffff;
    float: left;
    padding: 10px;
    border: 2px;
    position: relative;
    z-index: 10;
}
nav a {
  color: white;
}
h1 {
  text-align: right;
  font-family: monospace;
}
ol, ul {
  list-style: none;
}
/* Create universal selector for main menu*/
* #mainmenu {
  margin: 10px;
  width: 900px;
  font-family: monospace;
  font-size: 20px;
  color: white;
}
* #mainmenu li {
  display: block;
  float: left;
  width: 120px;
  color: white;
}
* #mainmenu a:hover {
  background-color: #black;
  color: white;
}
* hr {
  border: 5px solid white;
}
@media {
  min-width: 600px
}
.containter {
  max-width: 800px;
  margin: 0 auto;
}
/* CSS floats, Home page columns*/
#left {
  float: left;
  width: 50%;
  height: 50%;
  overflow: auto;
}
#right {
  float: right;
  width: 50%;
  height: 50%;
  overflow: auto;
}
@media {
  min-width: 1024px
}
/* Table borders and padding*/
table, th, td {
border: 1px solid white;
}
th, td {
padding: 15px;
}
/*CSS for form*/
form[type=form] {
  display: flex;
flex-flow: column nowrap
}
input, datalist textarea[type=form] {
  margin-bottom: .5em
}
@media {
min-width: 600px
}
form[type=form] {
width: 60%;
max-width: 40em;
display: grid;
grid-gap: 1em;
gap: 1em;
grid-template-rows: auto;
grid-template-columns: 9em 1fr;
column-count: 2
}
input[type=form] {
    display: none;
}
label {
    display: block;
    padding: 8px 22px;
    margin: 0 0 1px 0;
    cursor: pointer;
    background: #5c0791;
    border-radius: 3px;
    color: #ffffff;
    transition: ease .5s;
}

label:hover {
    background: #1d34de;
}

.content {
    background: #616161;
    padding: 10px 25px;
    border: 1px solid #A7A7A7;
    margin: 0 0 1px 0;
    border-radius: 3px;
}

input + label + .content {
    display: none;
}

input:checked + label + .content {
    display: block;
}
/* CSS for news page*/
.all-news {
  margin: 0;
  padding: 5px;
  background-color: #0a0a0a;
  border-style: solid;
}

.all-news > h1, .news {
  margin: 10px;
  padding: 5px;
}

.news {
  background: $616161;
}

.news > h2, p {
  margin: 4px;
  font-size: 90%;
}
img {
height:200px;
display: block;
padding-bottom: 1em;
margin: auto;
}
#cybersecurity2 {
background-image: url("images/cybersecurity2");
float: left;
background-repeat: no-repeat;
}
#cybersecurity3 {
  background-image: url("images/cybersecurity3");
  float: none;
  background-repeat: no-repeat;
}
#footer {
    background-color: #1d34de;
    color:#ffffff;
    height:20px;
}