* {
margin:0;
padding:0;
box-sizing:border-box;
}
body {
background: white;
font-family: 'Courier New', monospace;
}
.hidden {
display: none;
}
.HeaderText {
font-family: 'Courier New', monospace;
font-size: 20px;
font-weight: bold;
padding: 16px 60px;
margin: 20px 0 0 120px;
position: inherit;
}
.Greet {
text-align: center;
margin-top: 60px;
font-size: 50px;
}
.Name {
text-align: center;
font-size: 60px;
}
.Intro {
display: flex;
justify-content: center;
margin: 10px 0px 100px 0px;
}
.ProfilePhoto {
max-height: 200px;
max-width: 200px;
display: block;
margin-left:auto;
margin-right:auto;
width:50%;
border: #000000;
border-style: ridge;
border-width: 6px;
}
.tab {
float: left;
border: 1px solid #ccc;
background-color: #f1f1f1;
width: 30%;
height: 550px;
}
.tab button {
display: block;
background-color: inherit;
color: black;
padding: 22px 16px;
width: 100%;
border: none;
outline: none;
text-align: left;
cursor: pointer;
transition: 0.3s;
}
.tab button:hover {
background-color: #ddd;
}
.tab button.active {
background-color: #ccc;
}
.tabcontent {
float: left;
padding: 0px 12px;
border: 1px solid #ccc;
width: 70%;
border-left: none;
height: 550px;
}
.ITSLogo{
margin-left: 180px;
max-width: 100px;
max-height: 100px;
border: 6px solid #198fff;
border-radius: 30px;
}
.SMALogo{
margin: 90px 0 0 180px;
max-width: 100px;
max-height: 100px;
border: 6px solid #198fff;
border-radius: 30px;
}
.container {
width: 100%;
background-color: #ddd;
}
.skills {
text-align: right;
padding-top: 10px;
padding-bottom: 10px;
color: white;
}
.CPP {width: 70%; background-color: #04AA6D;}
.Python {width: 50%; background-color: #2196F3;}
.R {width: 40%; background-color: #f44336;}
.Java {width: 55%; background-color: #808080;}
.JS {width: 30%; background-color: #809043;}
.Social {
padding-top: 100px
}
.fa {
padding: 20px;
font-size: 30px;
width: 30px;
text-align: center;
text-decoration: none;
}