/* ----------------------------------------------- */
/* BASIC SETUP FOR STYLING.CSS */
/* ----------------------------------------------- */
@import url('https://fonts.googleapis.com/css?family=Lato:400,700');


* {
	box-sizing: border-box;
}

.clearfix {zoom: 1;}
.clearfix:after {
	content: '.';
	clear: both;
	display: block;
	height: 0;
	visibility: hidden;
}

/* Body: */

html,
body {
	margin: 0;	
	font-family: 'Lato', 'Arial', 'sans-serif', 'Vollkorn';
	/* font-weight: 400; */
	font-size: 20px;
	line-height: 1.5;
	color: #000;
	text-rendering: optimizeLegibility;
	overflow-x: hidden;
}


/* ----------------------------------------------- */
/* REUSABLE COMPONENTS */
/* ----------------------------------------------- */

.row, .container {
	max-width: 1140px;
	padding-left: 1rem;
	padding-right: 1rem;
	margin: auto;
	text-align: center;
}

section {
	padding: 60px 0;	
}

.v-header {
	height: 100vh;
	display: flex;
	align-items: center;
	color: #fff;
} 


.fullscreen-video-wrap {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	overflow: hidden;	
}


.fullscreen-video-wrap video {
	min-width: 100%;
	min-height: 100%;	
}


.header-overlay {
	height: 100vh;
	width: 100vw;
	position: absolute;
	top: 0;
	left: 0;
	background: #225470;
	z-index: 1;
	opacity: 0.65;
}


.header-content {
	z-index:2;
}

.header-content h1 {
	font-size: 340%;
	word-spacing: 10px;
	letter-spacing: 2px;
	margin-top: 110px;
	margin-bottom: 50px;
	font-weight: 700
}

h1:after {
	display: block;
	height: 0.5px;
	background-color: rgb(29, 167, 179);
	content: " ";
	width: 550px;
	margin: 0 auto;
	margin-top: 25px;
	margin-bottom: 5px;	
}

.header-content h2 {
	font-size: 150%;
	word-spacing: 5px;
	letter-spacing: 0;
	margin-top: 2px;
	margin-bottom: 40px;
}

h3 {
	color: rgb(29, 167, 179);
}


h3:after {
	display: block;
	height: 2px;
	background-color: #e67e22;
	content: " ";
	width: 200px;
	margin: 0 auto;
	margin-top: 15px;
	margin-bottom: 40px;
}


/* .header-content p {
	font-size: 1.5rem; 
	display: block;
	padding-bottom: 2rem;
} */

.btn{
	background-color: rgb(56, 63, 64);
	color: #fff;
	font-size: 20px;
	padding: 10px 20px;
	border-radius: 5%;
	margin-top: 20px;
}

.btn:hover{
background-color: rgba(29, 167, 179, 0.5);
}


/* ----------------------------------------------- */
/* NAVIGATION */
/* ----------------------------------------------- */

.navbar {
	text-transform: capitalize;
	font-weight: 700;
	font-size: .9rem;
	letter-spacing: .1rem;
	background: rgba(0, 0, 0, .6)!important;
}

.navbar-brand p {
	height: 1.5rem;
	text-shadow: 3px 3px #e67e22;
}

.navbar-nav li {
	padding-right: .7rem;	
}

.navbar-dark .navbar-nav .nav-link {
	color: white;
	padding-top: .8rem;
}

.navbar-dark .navbar-nav .nav-link:active,
.navbar-dark .navbar-nav .nav-link:hover {
	color: #1ebba3;
}

/* #education, #projects, #skills, #contact {
background-color: transparent; 
color: #000; 
text-align: center; 
padding-top: 20%; 
} */


/* ----------------------------------------------- */
/* ABOUT ME SECTION */
/* ----------------------------------------------- */

#about{
	text-align: center;
	padding-top: 60px;
	/* background-color: #eee; */	
	background: linear-gradient(to bottom left,grey,white,white,white,grey);
}

#about p{
	margin-top: 20px;
	/* background-color: #463131; */
	border: 1px solid #888; 
	border-radius: 5%;
	padding: 25px;
}

#about img {
	width: 100%;
	height: auto;
	margin-top: 20px;
	border-radius: 50%;
} 


/* ----------------------------------------------- */
/* EDUCATION SECTION */
/* ----------------------------------------------- */

#education{
	padding-top: 60px;
}

#education .row {
	margin-top: 10px;
}


/* ----------------------------------------------- */
/* SKILLS SET SECTION */
/* ----------------------------------------------- */

#skills {
	padding-top: 60px;
	background-color: #eee;
	/* background: linear-gradient(to bottom left,red,yellow,red,yellow,purple); */
}


/* ----------------------------------------------- */
/* PROJECTS SECTION */
/* ----------------------------------------------- */

#projects{
	padding-top: 60px;	
}

#projects img {
	height: 80px;
	width: 100px;
}

/* ----------------------------------------------- */
/* CONTACT SECTION */
/* ----------------------------------------------- */

#contact{
	padding-top: 100px;
	color: #000;
	background-color: #eee;
}


.contact-form {
    width: 70%;
    margin: 0 auto;
}

input[type=text],
input[type=email],
select,
textarea {
    width: 100%;
    padding: 7px;
	margin: 4px;
    border-radius: 3px;
    border: 2px solid #000;
}

textarea {
    height: 100px;
}

input[type=checkbox] {
    margin: 10px 5px 10px 0;
}

*:focus {outline: none;}



/* ----------------------------------------------- */
/* FOOTER SECTION */
/* ----------------------------------------------- */

footer{
background: rgba(0, 0, 0, .6)!important;
/* background: linear-gradient(to bottom left,red,yellow,red,yellow,purple); */
color: #fff;
font-size: 20px;
}

footer a {
	color: white;
}

footer svg.svg-inline--fa {
	font-size: 1.2rem;
	margin: 1.2rem .5rem 0 0;
}

footer svg.svg-inline--fa:hover {
	color: #1ebba3;
}

.footer-nav li {
	list-style: none;
	display: inline-block;
	margin-right: 20px;
}

.footer-nav li:last-child,
.social-links:last-child {
	list-style: none;
	display: inline-block;
	margin-right: 0;
}


.footer-nav li a:link,
.footer-nav li a:visited, 
.social-links li a:link,
.social-links li a:visited {
    text-decoration: none;
    border: 0;
    color: #fff;
    -webkit-transition: color 0.2s;
    transition: color 0.2s;
}


.footer-nav li a:hover,
.footer-nav li a:active {
    color: #888;
}

.social-links li a:link,
.social-links li a:visited {
    font-size: 120%;
}

.ion-social-facebook,
.ion-social-twitter,
.ion-social-instagram {
    -webkit-transition: color 0.2s;
    transition: color 0.2s;
}

.ion-social-facebook:hover {
    color: #3b5998;
}

.ion-social-twitter:hover {
    color: #00aced;
}

.ion-social-instagram:hover {
    color: #517fa4;
}

.footer-nav {
    padding-top: 20px;
}

footer p {
    padding-top: 20px;
}


.social-links {
    padding-top: 0;
}


