body {
  width: 99.9%;
  margin: auto;
  padding: 0;
color: white ;
background-color: black;
  margin: 0;
}

head {
  width: 100%;
}
.subhead {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
	background-color: orange;
flex: 1;
padding: 10px ;
align-items: center;

}

.subhead_left {
flex: 0.2
}

.logo {
height: 65px ;
width: 65px ;
border-radius: 50%;
background-color: white ;	
}
.logo img {
height: 65px ;
width: 65px ;
border-radius: 50%;
background-color: white ;
}
.subhead_right {
flex: 0.56;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
.subhead_right a {
text-decoration: none;
}

.subhead_right a h1 {
font-weight: 550px;
color: black;
font-size: 18px;
}

a {
  text-decoration: none;
  color: black;
  
}

.main_heading {
background-color: black ;
height: 300px;
display: flex;
justify-content: center ;
align-items: center ;
width: 100%;
font-size: 40px ;
color: orange ;
font-weight: 790 ;
font-family: tahoma, cursive;
}

.sectionone {
background-color: white;
color: black;
margin-top: 20px;
}

.sectionone_head {
display: flex; 
justify-content: center;
align-items: center;
height: 50px ;
width: 100% ;
color: black;
background-color: orange;
border-radius: 30px ;
margin-bottom: 50px ;
} 

.sub_section {
display: grid ;
grid-template-columns: repeat(3, 1fr) ;
justify-content: space-between ;
align-items: center ;
gap: 30px ;
width: 90% ;
margin: auto ;
}

.section_content {
display: flex; 
flex-direction: column ;
align-items: center;
margin-bottom : 30px; 
box-shadow: 7px 10px 10px 0px darkgray;
}

.section_content img {
height: 400px;
width: 300px;
background-color: whitesmoke ;
} 
 

.sectiontwo {
padding-top: 50px ;
padding-bottom : 30px ;
width: 90%;
margin:auto ;
}

.rules {
 width: 90%;
margin: auto ;
padding: 20px 20px;
}

.rule2 {
margin-top: 50px;
display: flex;
gap: 25px;
flex-direction: column ;
align-items: center;
padding-top: 20px;
padding-bottom: 10px;
width: 90%;
margin: auto;
}

footer {
  background-color: orange;
  color: black;
  width: 94%;
  margin: auto;
  display: flex;
  flex-direction: row;
  flex: 1 ;
  padding-left: 40px;
  padding-right: 40px;
  padding-top: 10px;
  padding-bottom: 10px;
  justify-content: space-between;
}
.footer_links a p {
  font-size: 18px;
  font-weight: 400;
}
.footer_links { 
  display: flex;
  flex-direction: column;
  gap: 10px;
  cursor: pointer;
  flex: 0.4 ;
	justify-content: center ;
align-items: center;


}

.footer_links a p:hover {
  color: white ;
  background-color: black;
  padding: 5px ;
  text-align: center;
}

.footer_socials {
  height: 60px;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex: 0.4;
}

.footer_socials a {
  height: 50px;
  width: 50px;
  margin: 20px;
  background-color: black;
  color: orange;
border-radius: 50% ;
}


@media screen and (max-width: 600px) {
.body {
width: 100%; 
}


.subhead {
  display: flex;
  flex-direction: column;
  align-items: center ;
	gap: 30px ;
}

.subhead_right {
display: flex;
flex-direction: column;
justify-content: center;
gap: 10px ;
align-items: center;
}

.subhead_right a h1 {
font-weight: 550px;
color: black;
font-size: 15px;
}



.sub_section {
display: grid ;
grid-template-columns: repeat(1, 1fr) ;
justify-content: center ;
align-items: center ;
gap: 15px ;
}
.section_content {
width: 100%;
height: inherit ;
} 

.section_content a img {
height: 400px;
width: 300px;
background-color: whitesmoke ;
}


.main_heading {
width: 100%;
font-size: 20px ;
}
.sectionone_head {
font-size: 18px ;
}
footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 30px;
  width: 80%;
  margin: auto;
}
.footer_links { 
  display: flex;
  flex-direction: column;
  gap: 10px;
  cursor: pointer;
}

.footer_links a p {
  font-size: 14px;
  font-weight: 400;
}



}

@media screen and (min-width: 601px) and (max-width: 857px) {

.sub_section {
display: grid ;
grid-template-columns: repeat(2, 1fr) ;
justify-content: center ;
align-items: center ;
gap: 15px ;
}
}