:root {
  --heading: rgb(0 10 45);
  --para: #777;
  --para-tint: #e4e4e4;
  --white: #fff;
  --black: #212529;
  --helper: #8490ff;
  --overlay: #3e64ff;
  --helper-tint: #f3f4ff;
  --bg: rgb(249 249 255);
  --icons-bg: rgba(144, 172, 209, 0.2);
  --gradient: linear-gradient(0deg, rgb(132 144 255) 0%, rgb(98 189 252) 100%);
  --gradientSupport: -webkit-linear-gradient(
    0deg,
    rgb(132 144 255) 0%,
    rgb(98 189 252) 100%
  );
  --shadow: 0px 0px 20px 0px rgb(132 144 255 / 20%);
  --shadowSupport: 0px 20px 20px 0px rgb(132 144 255 / 30%);
}

.top-gap-filler{background:black; display:block;position:absolute; width:100%;}
main{position:relative; display:flex; flex-direction:column;}
main section{width:100%;padding: 3em 0 3em 0;    display: flex;
    flex-direction: column;
    margin: auto;
    justify-content: center;
    align-items: center;}

.resume-section{display:flex;justify-content: center; align-content: center;}
.container{width: 60%;
padding: 3em 3em 0em 3em;
display: grid;
grid-template-columns: auto auto;
grid-column-gap: 3em;
justify-content: center;
align-content: center;
margin: 6em auto;
}
.cover-info{
display: flex;
flex-direction: column;
justify-content: center;
align-content: center;
}
.cover-info h1{font-size:35px;position:relative;}
.cover-info p{position:relative;top: -15px;}
.cover-info h2{font-size: 30px;color: #5d625e;position:relative;font-weight: 100; top: -10px;}
.cover-image{
display: flex;
justify-content: center;
align-content: center;
}
.container img{width:80%;vertical-align: middle;-webkit-box-shadow: 10px 10px 0px 0px rgba(117,72,117,1);
-moz-box-shadow: 10px 10px 0px 0px rgba(117,72,117,1);
box-shadow: 10px 10px 0px 0px rgba(117,72,117,1);
}

.cover-social-icons{  display: flex;
  flex-direction: column;
  margin: auto 1em;
  row-gap: 0.5em;
}

/*============
Work Tabs
==========*/
#work-section{background-color:#ffeded;}
#work-wrapper{display: flex;flex-direction: column;justify-content: center;align-content: center;margin: auto;width: 70%;padding: 1em;}
#work-info{margin: auto;\text-align: center;}
#work-info h2{font-size: 35px;}
#work-tabs{display:flex;justify-content: center;align-content: center;padding: 20px 1px 20px 0px;column-gap: 1em;}
transition:all 0.3s ease-in-out;text-decoration:none;}

#work-container{width: 100%;
border-radius: 5px;}
.work-portfolio{display:none;}

.full-time-container{width: 86%;
    display: flex;
    row-gap: 1.5em;
    justify-content: center;
    align-content: center;
    margin: 2em auto;
    flex-wrap: wrap;
    column-gap: 0em;}
.work-companies{width: 350px;display:flex;margin: auto;padding:1px;-webkit-box-shadow: 1px 1px 10px 1px rgb(206, 206, 206);
-moz-box-shadow: 1px 1px 10px 1px rgb(206, 206, 206);
box-shadow: 1px 1px 10px 1px rgb(206, 206, 206);
}

.work-company-logo{width: 140px;height: 100px;text-align: center;}
.work-company-logo img{width:100%;vertical-align: middle;}
.work-company-info{position:relative;display: grid;grid-template-row: auto auto;
grid-row-gap: 1px;margin: auto; width: 100%; justify-content: center;align-content: center;}

.work-company-info h3{position:relative;font-size: 16px; font-weight: 500;}
.work-company-info h4{position:relative;font-size: 14px; font-weight: 300;top: -5px;}
.service-period{position:relative;font-size: 12px; font-weight: 300;top: -5px;}

.company-location{display:flex; width:100%; justify-content: space-between;}
.work-location span i {font-size: 12px; color: #373535;}
.work-location .location-name{font-size: 12px; font-weight: 300; color: #373535; margin-left: -10px;}

.company-location .current-working-status span i{font-size: 12px;}

.working-yes{color:green !important;}
.not-working{color:grey !important;}
.industry-info{display:flex;justify-content: center;align-content: center;margin: 3em 0em;    column-gap: 3em;}
.industry-container{    display: flex;
    justify-content: center;
    align-content: center;
    flex-direction: column;
    box-shadow: black 0px 0px 10px;
    width: 18%;
    text-align: center;
    row-gap: 1em;    border-radius: 10px;
    padding: 20px 10px;}
.industry-photo{width:100%;display:flex;justify-content: center;align-content: center;}
.industry-photo i{font-size:100px;}
.ind-photo-caption{    font-size: 22px;}
/*============
Skills
==========*/
#skill-section{background:#efeff7}
#skill-wrapper{display: grid; grid-template-columns: auto auto; grid-column-gap: 2em; justify-content: center;align-content: center;margin: auto;width: 70%;padding: 1em;}
.skill-cover-photo{width: 250px;height: 425px;display: flex; align-items: center; margin: auto;  justify-content: center;}
.skill-cover-photo img{width:100%;background: #e1e8a3;box-shadow: 10px 10px 0 0 #754875; display: inline-block;}
.skill-cover-data{width: 100%;padding: 10px 10px 10px 100px;width: 500px;display: grid;grid-template-rows: auto;
border-left: 0px solid black;}

.skill-panel-container{padding: 1px;}
.bio-data-stats{padding: 1px;}

.skill-header{margin: 0 0 1em 0;width:100%;}
.skill-header h2{font-size: 35px;}
.skill-header p{}
#skill-nav-bar{display: flex; flex-wrap: wrap;height: fit-content;}

.skill-panel-container{}
.skill-download{display: flex;justify-content: center;margin: 2em 0 0 0;justify-content: start;}


/*============
Work Tabs
==========*/
#edu-section{background-color:#ffeded;}
#edu-wrapper{display: flex;flex-direction: column;justify-content: center;align-content: center;margin: auto;width: 70%;padding: 1em;}
#edu-info{margin: auto;\text-align: center;}
#edu-info h2{font-size: 35px;}
#edu-tabs{display:flex;justify-content: center;align-content: center;padding: 20px 1px 20px 0px;column-gap: 1em;}
.btn{padding: 10px 20px 10px 20px;border: 1px solid black; border-radius: 5px;cursor:pointer;
transition:all 0.3s ease-in-out;text-decoration:none;}
.btn:hover{background:grey;}

#edu-container{width: 100%;
border-radius: 5px;}
.edu-portfolio{display:none;}

.academic-container{width: 85%; display: grid; grid-template-rows: auto; grid-row-gap: 1.5em;
justify-content: center; align-content: center; margin: 2em auto; grid-column-gap: 0em;}

.academic-info-container{display: grid; grid-template-rows: auto;
grid-row-gap: 1em;
margin: 1em auto;}

.academic-info-container h3{font-size: 17px; font-weight: 400;}
.school-info-container{
padding: 0.5em 1em 0.5em 1em;
border-left: 5px solid green;
margin-right: 2em; width:500px;
}

.school-info-header{display:grid;grid-template-columns: auto auto;justify-content: space-between;}
.school-info-body{font-size: 14px;}
.academic-institute{width:100%;display:grid;grid-template-columns: auto auto;margin: auto;padding:1px;-webkit-box-shadow: 1px 1px 10px 1px rgb(206, 206, 206);
-moz-box-shadow: 1px 1px 10px 1px rgb(206, 206, 206);
box-shadow: 1px 1px 10px 1px rgb(206, 206, 206); border: 1px solid #fffdfd;
border-radius: 10px;}

.school-meta-detail{display: flex; column-gap: 2em;}
.school-meta-detail span{}
.school-meta-detail span i{font-size:14px;}

.institute-logo{width: 140px;height: 100px;text-align: center;text-align: center;align-content: center;margin: auto;display: flex;justify-content: center;}
.institute-logo i{width:100%;margin: auto;text-align: center;font-size: 50px;}

/*============
Unknown
==========*/

#work-quick-snapshot{background-color:#e6d8d8;}
#quick-snapshot-wrapper{width:80%; background-color:#dbbaba;margin:auto;display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;}

/*============
FAQ
==========*/

#faq-section{background-color:#e6d8d8;}
#faq-wrapper{width:60%;margin:auto;display: flex; flex-direction: column;     align-items: center;}
.faq-header h2{font-size:35px;}

@media screen and (min-device-width: 350px) and (max-device-width: 600px)
{

	.full-time-container {
		display: grid;
		grid-template-columns: 1fr;
	}

	.top-gap-filler{background:black; display:block;position:absolute; width:100%;}
	main{position:relative; display:flex; flex-direction:column;}
	main section{width:100%;padding: 3em 0 3em 0;    display: flex;
		flex-direction: column;
		margin: auto;
		justify-content: center;
		align-items: center;}

	.resume-section{display:flex;justify-content: center; align-content: center;}
	.container{width: 100%;
	padding: 3em 3em 0em 3em;
	display: grid;     row-gap: 2em;
	grid-template-columns: auto;
	grid-column-gap: 3em;
	justify-content: center;
	align-content: center;
	margin: 2em auto;
	}
	.cover-info{
	display: flex;     text-align: center;
	flex-direction: column;
	justify-content: center;
	align-content: center;
	}
	.cover-info h1{    font-size: 33px;
		position: relative;
		display: flex;
		justify-content: center;
		align-items: center;
		text-align: center;}
	.cover-info p{position:relative;top: -15px;}
	.cover-info h2{font-size: 22px;color: #5d625e;position:relative;font-weight: 100; top: -10px;}
	.cover-image{
	display: flex;
	justify-content: center;
	align-content: center;text-align: center;
		width: 100%;
		margin-left: 1.5em;
	}
	.container img{width:80%;vertical-align: middle;-webkit-box-shadow: 10px 10px 0px 0px rgba(117,72,117,1);
	-moz-box-shadow: 10px 10px 0px 0px rgba(117,72,117,1);
	box-shadow: 10px 10px 0px 0px rgba(117,72,117,1);
	}

	.cover-social-icons{  display: flex;
	  flex-direction: column;
	  margin: auto 1em;
	  row-gap: 0.5em;
	}

	/*============
	Work Tabs
	==========*/
	#work-section{background-color:#ffeded;}
	#work-wrapper{display: flex;flex-direction: column;justify-content: center;align-content: center;margin:
 auto;width: 90%;padding: 1em;}
	#work-info{margin: auto;\text-align: center;}
	#work-info h2{font-size: 27px;}
	#work-info p{font-size: 12px;}
	#work-tabs{display:flex;justify-content: center;align-content: center;padding: 20px 1px 20px 0px;column-gap: 1em;}
	transition:all 0.3s ease-in-out;text-decoration:none;

	#work-container{width: 100%;
	border-radius: 5px;}
	.work-portfolio{display:none;}

	.full-time-container{width: 85%;
	display: grid;
	grid-template-columns: 1fr;
	grid-row-gap: 1.5em;
	justify-content: center;
	align-content: center;
	margin: 2em auto;
	grid-column-gap: 0em;}
	.work-companies{width: 350px;display:flex;margin: auto;padding:1px;-webkit-box-shadow: 1px 1px 10px 1px rgb(206, 206, 206);
	-moz-box-shadow: 1px 1px 10px 1px rgb(206, 206, 206);
	box-shadow: 1px 1px 10px 1px rgb(206, 206, 206);
	}

	.work-company-logo{width: 140px;height: 100px;text-align: center;}
	.work-company-logo img{width:100%;vertical-align: middle;}
	.work-company-info{position:relative;display: grid;grid-template-row: auto auto;
	grid-row-gap: 1px;margin: auto; width: 100%; justify-content: center;align-content: center;}

	.work-company-info h3{position:relative;font-size: 16px; font-weight: 500;}
	.work-company-info h4{position:relative;font-size: 14px; font-weight: 300;top: -5px;}
	.service-period{position:relative;font-size: 12px; font-weight: 300;top: -5px;}

	.company-location{display:flex; width:100%; justify-content: space-between;}
	.work-location span i {font-size: 12px; color: #373535;}
	.work-location .location-name{font-size: 12px; font-weight: 300; color: #373535; margin-left: -10px;}

	.company-location .current-working-status span i{font-size: 12px;}

	.working-yes{color:green !important;}
	.not-working{color:grey !important;}
	.industry-info{display: flex;
    justify-content: center;
    align-content: center;
    margin: 3em 0em;
    column-gap: 3em;
    flex-wrap: wrap;
    flex-direction: row;
    row-gap: 2em;}
	.industry-container{    display: flex;
		justify-content: center;
		align-content: center;
		flex-direction: column;
		box-shadow: black 0px 0px 10px;
		width: 40%;
		text-align: center;
		row-gap: 1em;    border-radius: 10px;
		padding: 20px 10px 15px 10px;}
	.industry-photo{width:100%;display:flex;justify-content: center;align-content: center;}
	.industry-photo i{font-size:54px;display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}
	.ind-photo-caption{    font-size: 16px;}
	/*============
	Skills
	==========*/
	#skill-section{background:#efeff7}
	#skill-wrapper{    display: grid;
		grid-template-columns: auto;
	grid-column-gap: 2em; justify-content: center;align-content: center;margin: auto;width: 90%;padding: 1em;}
	.skill-cover-photo{width: 250px;height: 425px;display: flex; align-items: center; margin: auto;  justify-content: center;}
	.skill-cover-photo img{width:100%;background: #e1e8a3;box-shadow: 10px 10px 0 0 #754875; display: inline-block;}
	.skill-cover-data{width: 100%;margin-top: 3em;padding: 10px 10px 10px 10px;width: 100%;display: grid;grid-template-rows: auto;
	border-left: 0px solid black;row-gap: 2em;}

	.skill-panel-container{padding: 1px;}
	.bio-data-stats{padding: 1px;}

	.skill-header{margin: 0 0 1em 0;width:100%;display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;}
	.skill-header h2{font-size: 30px;}
	.skill-header p{display: flex;text-align:center;}
	#skill-nav-bar{display: flex;
		flex-wrap: wrap;
		row-gap: 5px;
		column-gap: 5px;
		justify-content: center;
		align-items: center;
		text-align: center;}

	.skill-panel-container{}
	.skill-download{display: flex;justify-content: center;margin: 2em 0 0 0;}

	/*============
	Education
	==========*/
	#edu-section{background-color:#ffeded;}
	#edu-wrapper{display: flex;flex-direction: column;justify-content: center;align-content: center;margin: auto;width: 100%;padding: 1em;}
	#edu-info{margin: auto;\text-align: center;}
	#edu-info h2{font-size: 35px;}
	#edu-tabs{display:flex;justify-content: center;align-content: center;padding: 20px 1px 20px 0px;column-gap: 1em;}
	.btn{padding: 10px 20px 10px 20px;border: 1px solid black; border-radius: 5px;cursor:pointer;
	transition:all 0.3s ease-in-out;text-decoration:none;}
	.btn:hover{background:grey;}

	#edu-container{width: 100%;
	border-radius: 5px;}
	.edu-portfolio{display:none;}

	.academic-container{width: 85%; display: grid; grid-template-rows: auto; grid-row-gap: 1.5em;
	justify-content: center; align-content: center; margin: 2em auto; grid-column-gap: 0em;}

	.academic-info-container{display: grid; grid-template-rows: auto;
	grid-row-gap: 1em;
	margin: 1em auto;
	border-top: 2px solid green;
		padding-top: 1em;}

	.academic-info-container h3{font-size: 17px; font-weight: 400;}
	.school-info-container{
	padding: 0.5em 1em 0.5em 1em;
	border-left: 0px solid green;
	margin-right: 2em; width:100%;     row-gap: 1em;
		display: flex;
		flex-direction: column;
	}
	.line-break{width:100%;height:2px;}
	.visible{border:1px solid #cdc3c3;}
	.school-info-header{display:grid;grid-template-columns: auto auto;justify-content: space-between;row-gap: 1em;}
	.school-info-body{font-size: 14px;}
	.academic-institute{width:100%;display:grid;grid-template-columns: auto;margin: auto;padding:1px;-webkit-box-shadow: 1px 1px 10px 1px rgb(206, 206, 206);
	-moz-box-shadow: 1px 1px 10px 1px rgb(206, 206, 206);
	box-shadow: 1px 1px 10px 1px rgb(206, 206, 206); border: 1px solid #fffdfd;
	border-radius: 10px;}

	.school-meta-detail{display: flex; column-gap: 2em;}
	.school-meta-detail span{}
	.school-meta-detail span i{font-size:14px;}

	.institute-logo{width: 140px;height: 100px;text-align: center;text-align: center;align-content: center;margin: auto;display: flex;justify-content: center;}
	.institute-logo i{width:100%;margin: auto;text-align: center;font-size: 50px;}

	/*============
	Unknown
	==========*/

	#work-quick-snapshot{background-color:#e6d8d8;}
	#quick-snapshot-wrapper{width:80%; background-color:#dbbaba;margin:auto;display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;}

	/*============
	FAQ
	==========*/

	#faq-section{background-color:#e6d8d8;}
	#faq-wrapper{width:90%;margin:auto;display: flex; flex-direction: column;     align-items: center;}
	.faq-header h2{font-size:25px;}

}