/**
* Author			technoWizard
* Revision Date		28 Febuary 2023
* File Name			style.css
* Description		Displays and formats the header section of each page
**/
/* import font */
@import url(fonts.css);

/* reset */
* {
	margin: 0;
	padding: 0;
}

/* Custom Fonts custom font file location is ../fonts */

/* Main Body */
body { 
/*	background: url(../images/viewport.jpg); */
	background-image: linear-gradient(to right, #250047, #e8c1ff);
/*	background: rgb(0, 0, 0); */
	font-family: DosFont;
}

/* wrapper the place where everything lives */
#wrapper {
	position: relative;
/*	width: 960px; */
	width: 100%;
	height: 100vh;
	margin: 0 auto;
	padding: 0;
	border: 1px ridge #ccc; 
/*	background: rgba(10,10,10,0);*/
	background: url("../images/grid.png");
	background-repeat: repeat-y;
}

#header {
	width: 100%;
/*	height: 50px; */
	height: 5vw;
	border-bottom: 2px ridge #ccc;
	background-image: linear-gradient(to right, #5ae2fc, #30bbfc);
/*	background: rgba(10, 10, 10, 0); */
}

#headertext p {
	margin: 0 auto;
	font-size: 5vw;
	text-align: center;
}

#logo img {
	width: 20vw;
}

#logo {
	float: left;
	padding-top: 2%;
}

#primary-navigation {
	float: right;
	height: 50px;
	margin-top: 10%;
	margin-left: -1px;
	width: 38%;
	position: relative;
	background: rgba(10, 10, 10, 0);
/*	border: 2px solid lime; */
}

.clearfix {
	clear: both;
}
/*
#primary-navigation img {
	margin-left: -1px;
}
*/
#primary-navigation a {
	font: bold 14px georgia, times, serif;
	text-decoration: none;
	color: rgb(254, 254, 254);
}

#primary-navigation a:active {
	color: #000;
/*	background: #000; */
}

#primary-navigation ul {
	margin-top: -35px;
	margin-left: 10px;
	list-style: none;
	line-height: normal;
}

#primary-navigation ul li {
	display: inline;
	padding: 10px;
	position: relative;
	top: 10px;
}

#main {
	clear: both;
}

#works {
	position: relative;
	background: rgb(250, 250, 250);
	width: 100%;

}

#works a img{
	width: 50%;
}

#works p {
	width: 50%;
}
.style {
	width: 45%;
	float: left;
	color: rgb(0, 0, 0);
	font-weight: bold;
	font-size: 3vw;
	padding-left:5%;
	background: rgba(0,0,0,.1);
/*	border: 1px solid red; */
}

.col1 {
	width: 50%;
	float: left;
	color: rgb(0, 0, 0);
	font-weight: bold;
	font-size: 3vw;
/*	border: 1px solid red; */
}

.col2 {
	width: 50%;
	float: left;
	color: rgb(0, 0, 0);
	font-weight: bold;
	font-size: 3vw;
/*	border: 1px solid red; */
}

.photo a img{
	float: left;
	width: 20%;
}

#footer {
	color: rgb(0, 0, 0);
}
#copyright {
	padding: 20px;
	color: rgb(0, 0, 0);
	font-weight: bold;
	font-size: 2vw;
}

#recent {
	width: 100%;
	height: 20%;
}

#recent h1 {
	width: 10%;
	margin: 0 auto;
	color: rgb(180,180,180);
}
#recent a img {
	width: 100%;
}

@media only screen and (max-width: 768px) {
  /* For mobile phones: */
  [class*="style"] {
    width: 100%;
  }