html {
	scroll-behavior: smooth;  /*sets the scroll behaviour to smooth.*/
}

 /*configures all of the body and sets font margin and width*/
body
{
    font-family: "Poppins",sans-serif;
}

header
{
	position: sticky;
	z-index: 5;
}
#showcase 
{
	color: white;
	background-image: url("../images/ShowcaseTablet.jpg");
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	height:100vh; 
}

#skills {
	min-height: 80vh; 
}

#portfolio
{
	padding-top: 110px;
	padding-bottom: 100px;
	min-height:100vh; 
}

#about
{
	padding-top: 110px;
	padding-bottom: 100px;
	min-height:100vh; 
}

.about-image-container::before
{
	position: absolute;
	width: 1px;
	background-color: #000000;
	content: ' ';
	height: 100%;
	left: 75px;
	z-index: -1;
}

#cv
{
	padding-top: 110px;
	padding-bottom: 100px;
	min-height:100vh; 
}

.cv-left > img
{
	width:150px;
	height:150px;
}

.cv-left ul
{
	list-style-type: none;
}

#contact
{
	background-image: url("../images/ContactTablet.jpg");
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	color: white;
	min-height:100vh; 
}

form input
{
	display: inline-block;
	margin-bottom: 20px;
	border-width: 2px;
	border-style: solid;
	border-color: black;
	
}

/*sets the hover cover for form input for contact */
form input:hover
{
	background-color: cornflowerblue;
	
}

form textarea 
{
	
	min-width: 250px;
	min-height: 100px; 
	border-radius: 5px; 
	padding: 20px 20px;
	margin-bottom: 20px;
	border-width: 2px;
	border-style: solid;
	border-color: black;
}

/*sets the hover cover for text area for contact */	
form textarea:hover
{
	background-color: cornflowerblue;
	
}

/*sets settings for the social icons */
.social
{
	list-style: none;
}


/* desktop/tablet styles */
@media (min-width: 768px) 
{
	
.cv-left > img
{
	width:350px;
	height:350px;
}
	
.about-image-container:before 
{
	left: 50%;
	z-index: -1;
}	
	
	
	
	
}