* 
{
    box-sizing: border-box;
}

html
{
	font-family: 'ABeeZee', sans-serif;
}



body
{
	padding:0px;
	margin:0px;
	background:url("/assets/crossword.png");
	background-repeat: repeat;
}

.col-1 {width: 8.33%;}
.col-2 {width: 16.66%;}
.col-3 {width: 25%;}
.col-4 {width: 33.33%;}
.col-5 {width: 41.66%;}
.col-6 {width: 50%;}
.col-7 {width: 58.33%;}
.col-8 {width: 66.66%;}
.col-9 {width: 75%;}
.col-10 {width: 83.33%;}
.col-11 {width: 91.66%;}
.col-12 {width: 100%;}

[class*="col-"] 
{
    float: left;
    padding: 15px;
}

.row
{
	width: 100%;
}

.row::after 
{
    content: "";
    clear: both;
    display: table;
}

.wrapper
{
	padding:0px;
}

nav
{
	background-color: black;
	height: 80px;
	padding: 20px;
}

nav > a 
{
	height:100%
}

.nav-header
{
	color:white;
	font-size: 40px;
	font-family: 'ABeeZee', sans-serif;
	text-decoration: none;
}

.nav-links:link
{
	color:white;
	font-family: 'ABeeZee', sans-serif;
	text-decoration: none;
	padding: 10px;
	float: right;
}

.nav-links:visited
{
	color:white;
}

.nav-links:hover
{
	color:#7babf7;
	text-align: center;
}

ul
{
	display:flex;
	list-style:none;
	float: right;
	padding: 0px;
	margin: 0px;
}

h1 
{
	font-family: 'ABeeZee', sans-serif;
	margin:0px;
} 

.main
{
	background-image:url("/assets/chess.png");
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	padding:20px;
	height:500px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: white;
	width: 100%;
	background-position: 50% 10%;
}

.main-heading
{
	margin:auto;
	text-align: center;
	background: rgba(123, 171, 247, 0.5);
	font-family: 'ABeeZee', sans-serif;
	font-size: 40px;
	padding: 40px;
	border-radius: 8px;
}

.aboutme
{
	padding:20px;
	text-align: center;
}

.section
{
	background-image:url("/assets/code.png");
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	padding:20px;
	padding-top:100px;
	height:500px;
	align-items: center;
	justify-content: center;
	color: white;
	text-align: center;
}

.buttons
{
	padding:20px;
	height:100%;
	text-align: center;
}

button
{
	background-color: white;
    border: 2px solid #7babf7;
    color: black;
    padding: 15px 32px;
	margin: 20px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
	border-radius: 8px;
	-webkit-transition-duration: 0.4s;
    transition-duration: 0.4s;
	width: 80%;
	font-family: 'ABeeZee', sans-serif;
}

button:hover 
{
    background-color: #7babf7;
    color: white;
	cursor: pointer;
}

.cv
{
	padding: 20px;
	text-align: center;
}

table 
{
    font-family: 'ABeeZee', sans-serif;
    border-collapse: collapse;
    width: 100%;
}

td, th 
{
    border: 1px solid #7babf7;
    text-align: left;
    padding: 8px;
}

tr:nth-child(even) 
{
    background-color: #dddddd;
}

.web
{
	padding:20px;
	text-align: center;
}

.threed
{
	padding:20px;
	text-align: center;
}

.branding
{
	padding:20px;
	text-align: center;
}

.foot
{
	color: black;
	text-align: center;
	padding: 5px;
}

@media only screen and (max-width: 1059px) 
{
    /* For mobile phones: */
    [class*="col-"] 
	{
        width: 100%;
    }
	button 
	{ 
		margin:0
	}
	[class*="section"]
	{
		padding-top: 20px;
	}
	ul
	{
		display: block;
		list-style: initial;
	}
	nav
	{
		height: 240px;
	}
	[class*="main"]
	{
		height: 300px;
	}
}