@charset "utf-8";
/*
Author: Maheshwar Sai Ganesh
Date: 06/14/2023
Filename: mWeb_styles.css
*/


html {
   background-color: rgb(63, 104, 134);
   font-size: 12px;
   font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
}

body {
   box-shadow: 20px 0 70px rgb(92, 171, 210),
      -20px 0 70px rgb(47, 235, 235);
   background-color: rgb(155, 209, 235);
   border-radius: 40px;
   color: rgb(14, 53, 82);
   z-index:1;
}


/* Body/Header Navigation Styles */
nav a {
   text-decoration: none;
}

body > header {
   position: sticky;         
   top: 0;                     
   width: 100%;               
   height: 105px;
   background-color: rgb(186, 217, 240);
   border-radius: 20px;
   box-sizing: border-box;
   z-index: 1000;
}

body>header nav.tabs {
   position: relative;
   height: 135%;
   margin-top: 10px;
   margin-right: auto;
   width: 105%;
}

body>header>nav.tabs>ul {
   position: absolute;
   bottom: 0px;
   width: 100%;
}

body>header nav.tabs li {
   display: flex;
   flex-grow: 1;
   background-color: rgb(186, 217, 240);
   float: left;
   height: 40px;
   line-height: 36px;
   margin-left: 2%;
   margin-right: 2%;
   width: 12%;
   border-radius: 10px;
}

.dropdown {
   display: block;
   float: left;
   height: 47px;
   line-height: 40px;
   margin-left: 4%;
   margin-right: 2%;
   width: 12%;
   border-radius: 10px;
}

button {
   background-color: rgb(186, 217, 240);
}

body>header nav.tabs li a,
.dropbtn {
   color: rgb(63, 104, 134);
   display: block;
   text-align: center;
   font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
   font-size: 200%;
   letter-spacing: 1px;
   font-weight: bolder;
   width: 97%;
   height: 93%;
   border-style: solid;
   border-radius: 10px;
   border-width: 3px;
   border-color: rgb(63, 104, 134);

}

body>header nav.tabs li:hover,
.dropdown:hover .dropbtn,
.dropdwn-content a:hover {
   background-color: rgb(107, 173, 224);

}

.dropdwn-content {
   display: none;
   position: absolute;
   background-color: rgb(186, 217, 240);
   width: 11%;
   box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
   border-style: solid;
   border-radius: 8px;
   border-width: 4px;
   border-color: rgb(63, 104, 134);
   text-align: center;
   line-height: 1.3em;
   font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
   font-size: 14px;
   font-weight: bolder;

}

.dropdwn-content a {
   display: block;
   color: rgb(63, 104, 134);
   padding: 12px 16px;
   font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
   font-size: 16px;
   border-radius: 5px;
   border-style: solid;
   border-radius: 8px;
   border-width: 4px;
   border-color: rgb(186, 217, 240);

}

.dropdown:hover .dropdwn-content {
   display: block;
}

section h1,
section h2 {

   display: block;
   color: rgb(14, 53, 82);
}

section h1,
table#Home h1 {
   font-size: 3em;
   margin-left: 8%;
   padding-bottom: 1%;
}

table#Home h1,
table#Education h1 {
   display: inline-block;
   font-size: 4em;
}




table#Home figcaption {
   display: block;
   text-wrap: nowrap;
   text-align: center;
   font-size:2.2em;
   padding-left: 40%;
   padding-top:2%;
}




section h2 {
   font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
   font-size: 50px;
   font-weight: bolder;
   text-wrap: nowrap;
   text-align: center;
   border-style: solid;
   margin-top: -0.1%;
   border-radius: 10px;
   border-width: 5px;
   line-height: 75px;
   background-color: rgb(186, 217, 240);
   border-color: rgb(63, 104, 134);
   margin-right: 1.4%;
   margin-left: 1.4%;
}

.Contact_Header {
   margin-top: 2%;
}

section h3 {
   font-size: 35px;
   font-weight: bolder;
   text-wrap: nowrap;
   text-align: center;
}
section h5 {
   font-size: 50px;
   font-weight: bolder;
   text-wrap: nowrap;
   text-align: center;
   margin-top:-0.5%;
   margin-bottom:0.5%;
   margin-left:3%;
   margin-right:auto;
}



/* Change logo size */

body>header img {
   float: left;
   height: 60%;
   margin-top: 8px;
   margin-bottom: 10px;
   margin-left: 15px;
   margin-right: auto;
}

/*Aside*/
aside {
   color: rgb(63, 104, 134);
   background-color: rgb(186, 217, 240);
   display: block;
   text-align: center;
   line-height: 1.3em;
   font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
   font-size: 14px;
   font-weight: bolder;
   width: 32%;
   height: 95%;
   border-style: solid;
   border-radius: 15px;
   border-width: 2px;
   border-color: rgb(63, 104, 134);
   margin-left: auto;
   margin-right: auto;
}

/*Footer*/
footer {
   background-color: rgb(186, 217, 240);
   clear: left;
   margin-top: 25px;
   text-align: right;
   border: solid 2px rgb(186, 217, 240);
   border-bottom-right-radius: 20px;
   border-bottom-left-radius: 20px;
}

footer,
footer span a {
   text-decoration: none;
   padding: 10px;
   color: rgb(63, 104, 134);
}

footer span a:hover {
   color: rgb(55, 158, 236);
   text-decoration: underline;
}

/*Table Styles*/
table {
   font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
   font-weight: bold;
   width: 97%;
}

table tbody tr td p {
   font-size: 200%;
   line-height: 1.2em;
   margin-right: 15%;
   margin-left: 8%;
   height: 100%;
   line-height: 1.2em;
   margin-top: -6%;
}

img[alt~="Temple"] figcaption {
   font-size: 10em;
   margin-right: 100px;
   margin-left: auto;
}

table figcaption,
table figcaption br {
   font-size: 200%;
}



img[alt~="Niagra_Bridge"],
img[alt~="NYC_Bridge"],
img[alt~="Windmills"],
img[alt~="OPMF_5"],
img[alt~="OPMF_1"],
img[alt~="OPMF_4"],
img[alt~="OPMF_9"],
img[alt~="OPMF_8"],
img[alt~="OPMF_2"],
img[alt~="SciOly"],
img[alt~="CHS_Logo"],
img[alt~="Sinclair_Logo"],
img[alt~="OSU_Logo"],
img[alt~="Cardio_Shadowing"],
img[alt~="EV_CAD"],
img[alt~="EV_2"]{
   border-radius: 20px;
   display: inline-block;
   margin-right: auto;
}


img[alt~="M_Portrait"] {
   display: inline-block;
   margin-left: 20%;
   margin-right: auto;
   margin-top: 50px;
   border-radius: 40px;
}
/* Photography Image Styles */
img[alt~="Smokies"] {
   border-radius: 20px;
   display: inline-block;
   margin-right: 30%;
   margin-left: 30%;
   border-radius: 20px;
   display: inline-block;

}

img[alt~="OPMF_5"],
img[alt~="OPMF_1"],
img[alt~="OPMF_4"],
img[alt~="OPMF_9"],
img[alt~="OPMF_8"],
img[alt~="OPMF_2"],
img[alt~="EV_CAD"],
img[alt~="EV_2"] {
   margin-left: 12%;
}

img[alt~="Niagra_Bridge"],
img[alt~="Windmills"] {
   margin-left: 16%;
}

img[alt~="Temple"],
img[alt~="Cuyahoga"],
img[alt~="Local"],
img[alt~="Milo_Smokies"],
img[alt~="SantaPaws"] {
   border-radius: 20px;
   display: inline-block;
   margin-left: 30%;
   margin-right: auto;
}

img[alt~="NYC_Bridge"] {
   border-radius: 20px;
   display: inline-block;
   margin-left: 32%;
   margin-right: auto;
}

img[alt~="CHS_Logo"]{
   border-radius: 50%;
   margin-left: 31.5%;
   margin-right: auto;
}

img[alt~="Sinclair_Logo"],
img[alt~="OSU_Logo"]{
   border-radius: 50%;
   margin-left: 39%;
   margin-right: auto;
}

img[alt~="Cardio_Shadowing"]{
   border-radius: 10%;
   margin-left: 39%;
   margin-right: auto;
}




table#Photography p,
table#Hiking p,
table#CAD p {
   display: inline-block;
   text-align: center;
   margin-left: -30%;
   margin-right: auto;
   margin-bottom: -8%;
   margin-top: -1%;
}

table#EV p {
   display: inline-block;
   margin-left: -15%;
   margin-right: 10%;
   font-size: 200%;
   font-weight: bolder;
   text-align: center;
   padding-left: 30%;
}

table#Temple figcaption,
table#Smokies figcaption,
table#Niagra figcaption,
table#NYC_Bridge figcaption,
table#Windmills figcaption,
table#OPMF_5 figcaption,
table#OPMF_1 figcaption,
table#OPMF_4 figcaption,
table#OPMF_9 figcaption,
table#OPMF_8 figcaption,
table#OPMF_2 figcaption,
table#Cuyahoga figcaption table,
table#Local figcaption,
table#SantaPaws figcaption,
table#Milo_Smokies figcaption,
table#SciOly figcaption,
table#CHS_Logo figcaption,
table#Sinclair_Logo figcaption,
table#OSU_Logo figcaption,
table#Cardio_Shadowing figcaption,
table#EV_CAD figcaption,
table#EV_2 figcaption {
   display: inline-block;
   font-size: 250%;
   font-weight: bolder;

}

table#Temple figcaption {
   padding-left: 40%;
}


table#Niagra figcaption {
   display: inline-block;
   text-wrap: none;
   padding-left: 38%;
}


table#NYC_Bridge figcaption {
   margin-left: 36.5%;
   margin-right: auto;
}

table#Windmills figcaption {
   margin-left: 45%;
   margin-right: auto;
}

table#Smokies figcaption {
   padding-left: 38.5%;
}  

table#Cuyahoga figcaption {
   margin-left: 45%;
   margin-right: auto;
}

table#Local figcaption {
   margin-left: 49%;
   margin-right: auto;
}

table#SantaPaws figcaption {
   margin-left: 34%;
   margin-right: auto;
}

table#Milo_Smokies figcaption {
   margin-left: 41%;
   margin-right: auto;
   font-weight: bolder;
}

img[alt~="YGIC"] {
   border-radius: 20px;
   display: inline-block;
   margin-left: 23%;
   margin-right: auto;

}

table#YGIC figcaption {
   display: inline-block;
   margin-left: 32.5%;
   margin-right: auto;
   font-size: 225%;
   font-weight: bolder;

}

table img[alt~="OPMF"],
table img[alt~="EV"]{
   border-radius: 20px;
   display: inline-block;
   margin-left: 16.6%;
   margin-right: auto;

}

table#OPMF figcaption,
table#EV figcaption {
   display: inline-block;
   text-align: center;
   margin-left: 35%;
   margin-right: auto;
   font-size: 200%;
   font-weight: bolder;
}

table img[alt~="TAB"] {
   border-radius: 20px;
   display: inline-block;
   margin-left: 1.5%;
   margin-right: auto;

}

table#TAB figcaption {
   display: inline-block;
   margin-left: 29%;
   margin-right: auto;
   font-size: 235%;
   font-weight: bolder;
}


table#OPMF p,
table#TAB p,
table#YGIC p,
table#Hiking p,
table#Photography p,
table#CAD p,
table#EV p{
   display: inline-block;
   margin-left: -15%;
   margin-right: 10%;
   margin-bottom: 1%;
   margin-top: -0.5%;
   font-size: 250%;
   font-weight: bolder;
   text-align: center;
   padding-left: 30%;
}
table#SciOly p,
table#HOSA p,
table#NHS p,
table#SHS p,
table#BioClub p,
table#OPMF p,
table#EV p,
table#CAD p,
table#CAD li,
table#CHS_Logo p,
table#Sinclair_Logo p,
table#OSU_Logo p,
table#Cardio_Shadowing p{
   display: block;
   margin-bottom: 1%;
   margin-top: -0.5%;
   font-size: 250%;
   font-weight: bolder;
   text-align: center;
}

table#CAD p,
table#CAD li{
   display: block;
   margin-bottom: 1%;
   margin-top: -0.5%;
   font-size: 220%;
   font-weight: bolder;
   text-align: center;
}


table#SciOly p,
table#HOSA p,
table#NHS p,
table#SHS p,
table#BioClub p,
table#CHS_Logo p,
table#Sinclair_Logo p,
table#OSU_Logo p,
table#Cardio_Shadowing p{
   padding-left:10%;
}

article table tbody tr td figure {
   margin-left: 80px;
}

article table tbody tr td iframe {
   margin-left: 30px;
}

/*OPMF Images*/
table#OPMF_5 figcaption {
   margin-left: 28%;
   margin-right: 22%;
   text-wrap: wrap;
   text-align: center;
}

table#OPMF_1 figcaption {
   margin-left: 23%;
   margin-right: auto;
}

table#OPMF_4 figcaption {
   margin-left: 34%;
   margin-right: auto;
}

table#OPMF_9 figcaption {
   margin-left: 29%;
   margin-right: 21%;
   text-wrap: wrap;
   text-align: center;
}

table#OPMF_8 figcaption{
   margin-left: 40%;
   margin-right: auto;
}

table#OPMF_2 figcaption {
   margin-left: 30%;
   margin-right: auto;
}

/*Figure captions to the CAD tab*/
table#EV_CAD figcaption {
   margin-left: 47%;
   margin-right: auto;
}

table#EV_2 figcaption {
   margin-left: 40%;
   margin-right: auto;
}
/*Extracurricular Image Styles*/

img[alt~="Sci_Oly"] {
   display: inline-block;
   margin-left: 22%;
   margin-right: auto;
   border-radius: 150px;
}

img[alt~="HOSA"] {
   display: inline-block;
   margin-left: 39%;
   margin-right: auto;
   border-radius: 75px;
}

img[alt~="NHS"] {
   display: inline-block;
   margin-left: 39%;
   margin-right: auto;

}

img[alt~="SHS"] {
   display: inline-block;
   margin-left: 40%;
   margin-right: auto;
   border-radius: 170px;
}
