@charset "UTF-8";
/* CSS Document */

	
				@font-face {
font-family: ModernSans-Light;
src: url(fonts/ModernSans-Light.otf);
src:
url("fonts/ModernSans-Light.woff") format("woff"),
url("fonts/ModernSans-Light.otf") format("opentype"),
url("fonts/ModernSans-Light.svg#filename") format("svg");
} 
@font-face {
			font-family:Quantify;
			src: url("_fonts/quantify/Quantify.ttf")
		}	
body {
    width: 100%;
/*    height: 100vh;*/
    font-family: ModernSans-Light;
    font-weight: 600;
    margin: 0px;
    scroll-behavior: smooth;
	overflow: auto;
    left: auto;
		}
html {
			width:100%;
			min-height: 100%;
			scroll-behavior: smooth;
		}
.responsive {
	width:100%;
	height: auto;
}
.responsiveImage {
	width:100%;
	height: auto;
	margin: 0px auto;
}
.responsiveVideo {
	width:90%;
}
/* FULL PAGE - THE FOLLOWING CODE IS FOR ALL ELEMENTS BETWEEN THE HEADER AND THE FOOTER */
		
.homePageWrapper {
    width:90%;
    height:100%;
    margin: 0px auto 10px;
    padding: 0px;
	position: relative;

}
a  {
    color:black;
    font-weight: 600;
    text-decoration: none;
}
p {
    margin: 0px;
    font-family: ModernSans-Light;
}

/*  THIS CLASS CAN BE USED TO CREATE A HOVER ZOOM EFFECT -AS OF NOW NOT USED  */
		.zoom:hover {
		  -ms-transform: scale(1.1); /* IE 9 */
		  -webkit-transform: scale(1.1); /* Safari 3-8 */
		  transform: scale(1.1); 
		}

	/* THIS  noScroll CLASS HAS NOT BEEN USED YET */
.noScroll {
	overflow: hidden;
}
/* NOT USED YET */e
.fixed {
	position: fixed;
}
.headerContainer {
    width: 100%;
    height: auto;
    position: fixed;
    padding: 0px;
    top: 0px;
    z-index: 1;
}
header {
    width: 95%;
    height: 100px;
    margin: 0px auto;
    padding: 0px 15px 0px;
    position: relative;
    box-sizing: border-box;
    border: black 1px solid;
    border-radius: 5px;
    background-color: #eee;
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
}
.headerName {
	display: flex; 
	flex-flow: column nowrap; 
	justify-content: flex-start;
    font-family: Quantify;
    font-size: 42px;
    font-weight: normal;
    line-height: 60px;
    width:auto;
	height: auto;
	margin: 0px;
	padding: 0px 10px 0px 0px;
}
.headerName a:hover {
    text-shadow: 2px 2px 4px #D3901E;
}
.navLogoContainer {
	display: flex;
	flex-flow: row nowrap;
	justify-content:flex-end;
	width:auto;
	margin: 0px;
	padding: 0px;
	gap:0px;
}
.flexNav {
	display: flex;
	flex-flow: row wrap;
	justify-content:flex-start;
	width:auto;
	height: auto;
	column-gap:5px;
}
.projects {
	position: relative;
	cursor: pointer;
	transition:all 0.3s ease-in-out;
}
.projects:hover .projectsDropdown {
	height: 550px;
}
/*
	-webkit-transition-duration: 0.2s;
	-moz-transition-duration: 0.2s;
	-webkit-transition-timing-function: linear, ease-in;
	-moz-transition-timing-function: linear, ease-in;
*/

.flexNavBtn {
	width:auto;
	height: auto;
	display: block;
	margin: 0px 30px 0px 0px;
	padding: 0px 0px;
	font-family: ModernSans-Light;
	font-size: 16px;
	font-weight: 600;
	line-height: 30px;
	text-align: center;
}
.projectsDropdown {
	display: flex; 
	flex-direction: column; 
	grid-row-gap: 0px; 
	background-color:#eee; 
	width: auto; 
	height: 0px; 
	position: absolute; 
	text-align:left; 
	padding-left:10px;
	border-radius: 5px;
	overflow: hidden;
	transition:height 0.3s ease-in-out;
	transition-delay: 0.1s;
}

/* THE FOLLOWING .mediums WAS CREATED IN ORDER FOR EACH MEDIUM TO HAVE A DROPDOWN - ABANDONDED FOR NOW */
/*
.mediums {
	position: relative;
	transition: 0.3s;
	height: auto;
	font-size: 14px;
	letter-spacing: .03rem;
}
.mediums:hover .photoDropdown {
	visibility: visible;
	transform: translate(0px, 350px)
}
.photoDropdown {
	display: flex;
	flex-direction: column;
	visibility: visible;
	position: absolute;
	z-index: -5;
}
.interDropdown {
	display: flex;
	flex-direction: column;
	visibility: visible;
	position: absolute;
	top:250px;
}
*/
/* END ALTERNATE MEDIUMS DROPDOWNS */

.flexNavBtn img {
	width:100%;
	height:100%;
	margin: 0px;
	padding: 0px;
}
.flexNavBtn p {
	line-height: 30px;
}
.hoverBoxShadowOrange {
    box-shadow: 2px 2px 4px #D3901E;
}
.socialBtnContainer {
	display: flex;
	flex-flow: row nowrap;
	justify-content:center;
	width:90%;
	height: auto;
	margin: 0px auto;
	padding: 0px;
	box-sizing: border-box;
	gap:5px;
}
.socialMediaBtn {
	width:35px;
	height: 35px;
	display: block;
	padding: 0px 0px;
	text-align: center;
	margin-top: 45px;
	margin-left: 0px;
	margin-right: 10px;
}
.socialMediaBtn img {
	width:100%;
	height: 100%;
}
.socialMediaBtn img:hover{
	webkit-filter: drop-shadow(2px 2px 2px #D3901E);
	filter: drop-shadow(2px 2px 2px #D3901E);
}
.logoContainer {
	width:auto;
	height: auto;
}
#logo {
    margin: 10px 0px 10px 10px;
    width:75px;
    height: auto;
    display: block;
}
	
	/* SECTION FOR NAVBAR */	
	
		.mainNav  {
			display: flex;
			flex-flow: row nowrap;
			justify-content: flex-end;
			width:80%;
			height: auto;
			margin: 0px auto 20px;
			padding-right:80px;
			text-align: center;
			position: relative;
			font-size: 16px;
			font-weight: 600;
		}
.mainNav a {
	display: block;
}

  .navBtn {
      width:auto;
      height:auto;
      display: block;
	  margin:0px auto;
      padding: 10px 25px;
      border: black solid 1px;
      border-radius: 0px 0px 5px 5px;
      border-top: none;
      background-color:#EEEEEE;
      font-family: inherit;
      font-size: inherit;
      font-weight: inherit;
      position: relative;
      text-align: center;
      overflow: hidden;
  }
.mainNavBtn {
      width:auto;
      height:auto;
      display: block;
      margin: 0px 0px 0px 5px;
      padding: 10px 25px;
      border: black solid 1px;
      border-radius: 0px 0px 5px 5px;
      border-top: none;
      background-color:#EEEEEE;
      font-family: inherit;
      font-size: inherit;
      font-weight: inherit;
      position: relative;
      text-align: center;
      overflow: hidden;
}
.mainNavDropdownBtn {
	width: auto;
	height: auto;
	padding: 0px 20px 0px 20px;
	font-family: ModernSans-Light;
	font-size: 12px;
	line-height: 16px;
	margin-bottom: 2px;
	white-space: nowrap;
	letter-spacing: .03rem;
}
.dropdownNavBtn {
	background-color:#EEEEEE;
	border: solid black 1px;
	border-radius:5px;
	position: absolute;
	left: 24px;
	padding-left: 20px;
}
.mobileMenuBtn {
    display: none;
}
button, .navBtn, a {
    cursor: pointer;
}
.dropdown {
    width:auto;
    height: auto;
    margin-left:0px;
    padding:0px;
    border: none;
}
.dropdown .navBtn {
			padding: 10px 25px;
}
.dropdown a {
    width:auto;
    height:auto;
    display: block;
    margin: 0px 0px 0px 5px;
    padding: 10px 25px;
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    text-align: center;
    position: relative;
}


/* THE FOLLOWING CODE IS FOR MAIN NAV BUTTONS */


/* ONLY USED FOR NON-ACCORDION MOBILE DROPDOWN */
.dropdown button:hover, .dropdown a:hover {
    background-color: white;
    border: solid 1px rgb(211, 144, 32);
    border-top:none;
    border-radius: 5px;
}

/* MOBILE NAV ELEMENTS */ /* ALL PARTS OF THE MOBILE NAV ARE HERE IN ORDER TO TEST THE NAV AT WIDER PAGE SIZES *//* TURN ON/OFF WITH DISPLAY */
	.mobileNav {
		display:none;
		width:210px;
		height: auto;
        position: relative;
		margin: 110px auto 0px;
/*		background-color:brown;*/
	  text-align: center;
	}
	#mobileNavBtn {
		width: auto;
		height: auto;
		position: relative;
		border-left: 25px solid transparent;
		border-right: 25px solid transparent;
		border-top: 40px solid rgb(211, 144, 30);
		border-bottom: 0px solid transparent;
		margin: 0px auto;
		padding: 0px;
        background-color:#eee;
	}
/*	#mobileNavBtn:hover {
		  background-color:whitesmoke;
		  box-shadow: 0px 1.5px 3px rgb(211, 144, 30);;
	  }*/
	.mobileDropdownLink {
      display: block;
      width:90%;
      height: auto;
      margin:15px auto;
      padding: 4px 0px;
      position: relative;
      background-color: rgba(220,150,10,.9);
      color: whitesmoke;
	  border: 1px solid black;
      border-radius: 3px;
      outline: none;
		font-family: ModernSans-Light;
      text-align: center;
      line-height: 22px;
      font-size: 16px;
      cursor: pointer;
      transition: background-color 0.1s linear;
		 -webkit-box-shadow:2px 2px 2px rgba(81,66,39,.3),	
      inset 1px 1px 3px rgba(246,224,161,1.00) ;
      -moz-box-shadow:2px 2px 2px rgba(81,66,39,.3),	
      inset 1px 1px 3px rgba(246,224,161,1.00) ;
      -o-box-shadow:2px 2px 2px rgba(81,66,39,.3),	
      inset 1px 1px 3px rgba(246,224,161,1.00) ;
      box-shadow: 2px 2px 2px rgba(81,66,39,.3),	
      inset 1px 1px 3px rgba(246,224,161,1.00) ;
}
	
	.mobileDropdownLink:hover {
		background-color:whitesmoke;
		color:rgb(211, 144, 30);
	}
	.dropdown-content {
		display: none;
		position: absolute;
		top:40px;
		background-color:rgb(211, 144, 30);
		z-index: 1;
		width:100%;
		height: auto;
		margin: 0px auto;
		padding: 3px 0px;
		border-radius: 3px;
	}
    .dropdown-content a {
		display: block;
		width:95%;
		height: 20px;
		margin: 0px auto 5px;
		padding: 3px 0px;
		text-align: center;
	}
.mobileSocialBtnContainer {
    display: flex; 
    flex-flow: row nowrap; 
    justify-content: center; 
    width:95%; 
    height: auto; 
    gap:3px; 
    margin: 0px auto;
	padding: 0px 0px 3px;
    background-color:rgb(211, 144, 30);
	border:1px solid black;
	border-radius: 3px;
	transition: background-color 0.1s linear;
		 -webkit-box-shadow:2px 2px 2px rgba(81,66,39,.3),	
      inset 1px 1px 3px rgba(246,224,161,1.00) ;
      -moz-box-shadow:2px 2px 2px rgba(81,66,39,.3),	
      inset 1px 1px 3px rgba(246,224,161,1.00) ;
      -o-box-shadow:2px 2px 2px rgba(81,66,39,.3),	
      inset 1px 1px 3px rgba(246,224,161,1.00) ;
      box-shadow: 2px 2px 2px rgba(81,66,39,.3),	
      inset 1px 1px 3px rgba(246,224,161,1.00) ;
}
.mobileSocialBtnContainer:hover {
    background-color:whitesmoke;
}
.mobileSocialBtnContainer img:hover {
    webkit-filter: drop-shadow(2px 2px 2px #D3901E);
    filter: drop-shadow(2px 2px 2px #D3901E);
}
/* END MOBILE NAV TEST AT FULL WIDTH */


/* THIS CLASS IS ONLY FOR THE PURPOSE OF SHOWING/HIDING THE DROPDOWN-CONTENT IN MOBILE NAV */
.show {
	display: block;
}
.indexMain {
    width:90%;
    height: auto;
    margin: 0px auto 80px;
}

.dropdown-content {
	font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, "sans-serif";
}
		/* END OF CODE FOR ALL HEADER & MAIN NAV RELATED ELEMENTS */





/* THIS SECTION IS UNDER CONSTRUCTION NOTICE */
		
.constructionNotice {
	display: block;
	width:28%; 
	height: 60px; 
	margin:0px 0px 5px 5%; 
	z-index: 0; 
	color: rgb(211, 144, 30);
	background-color: rgba(255,255,255,0.50);
		}
/* END CONSTRUCTION NOTICE */

.containerCV {
	width:80%;
	height: 500px;
	margin: 0px auto;
	background-color:aqua;
}	
	/* 	SECTION FOR TEXT LEFT SIDE TEXT PANELS  */

.homePageText {
    display: block;
    float: left;
    width: 30%;
    height: auto;
    padding-top:4px;
    padding-left:5px;
    box-sizing: border-box;
    border: solid 0px black;
    border-radius: 5px;
    margin: 58px 20px 0px 0px;
    line-height: 20px;
    letter-spacing: .7px;
    text-indent: 20px;
	position: relative;
/*    overflow: auto;*/
}
.homePageTextWrapper {
    width:22%; 
    height: 60vh;
	overflow: auto;
    padding: 15px;
    border-top:1px solid black;
    border-left: 1px solid black;
    border-bottom:1px solid black;
	border-right: none;
    border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
	position:fixed;
}
.homePageIntro {
    width: 27%;
    height: 65vh;
    margin: 0px;
    padding: 20px;
    background-color:lightgray;
    line-height: 20px;
    text-indent: 50px;
    box-sizing: border-box;
    font-family: ModernSans-Light;
    font-weight: bolder;
    letter-spacing: .5px;
    border: solid 1px black;
    border-top-left-radius: 5px;
    overflow: scroll;
    overflow-x: hidden;
}
.blogBox1 {
    width: 55%;
    height: 400px;
    line-height: 20px;
    text-indent: 50px;
    box-sizing: border-box;
    font-family: ModernSans-Light;
    font-weight: bolder;
    letter-spacing: .5px;
    border: solid 1px black;
    border-radius: 5px;
    overflow: auto;
    margin-top: 40px;
    padding: 20px;
    display: none;
}
.blogBox1 p {
    padding-bottom: 20px;
}
.blogImage {
    position: fixed;
    top:1900px;
    max-width: 100px;
    max-height: 200px;
    display: inline-block;
}
.homePageBlogBox2 {
    position: fixed;
    top:900px;
    background-color:red;
    font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif";
    color:beige;
}




/* THE FOLLOWING IS TO PROVIDE BACKGROUND COLOR FOR SOME PORTFOLIO PAGES - CURRENTLY ONLY THE COMMUTING PAGE */
.backgroundColorBox {
	width:60%;
	height: auto;
	margin: 0px auto;
	padding: 1px 0px;
	background-color:gainsboro;
	border-radius: 5px;
}
/* END BACKGROUND COLOR BOX CODE */
/* THE FOLLOWING IS FOR PORTFOLIO PAGES HAVING NAV ON THE LEFT AND PORTFOLIO IMAGES ON THE RIGHT */
.projectPageMain {
	margin:210px auto 20px;
	width: 90%;
	height: auto;
	display: flex;
	flex-flow: row nowrap;
}
.projectNav {
	display: flex;
	flex-flow: column;
	width:15%;
	min-width: 300px;
	height: auto;
	line-height: 22px;
	color:#888;
	position: fixed;
	z-index: 1;
}
.projectGenre {
	margin:5px 0px 5px;
	text-decoration: underline;
/*	border-bottom: solid 1px rgba(203,203,203,1.00);*/
}
.projectNav a {
	margin-left: 10px;
	color: #888;
	font-size: 14px;
}
.projectNav a:hover {
	color: black;
}
.projectNav a:active {
	color:rgba(211,143,30,1.00);
}
/* END PORTFOLIO PAGES WITH NAV */

#top {
	width:100%; height:0px; margin-bottom:0px; padding: 0px; position: absolute; top: -500px;
	}

	/* SECTION FOR PROJECT THUMBNAILS */
	
		.homePageThmbs {
			position: relative;
			display: flex;
			flex-wrap: wrap;
			justify-content: center;
			width:auto;
			height: auto;
			margin-top:160px;
			padding-top: 0px;
			background-color: white;
			}

.homePageThmb a {
    display: block;
    padding: 0px;
    background-color:pink;
}
.thmbs {
    width: auto;
    height: 220px;
    margin: 10px;
    padding: 10px 10px 35px 10px;
    position: relative;
    text-align: center;
    border: lightgrey solid 1px;
    border-radius: 5px;
        }
.thmbs:hover{
    border: solid black 1px;
}
.thmbs  img {
    display: block;
    max-height: 200px;
    max-width: 200px;
    margin-bottom: 20px;
}
.homePageThmbs .thmbs p {
    max-width: 90%;
    font-size: 14px;
    font-family: inherit;
    font-style: italic;
    font-weight: 700;
    position: absolute;
    bottom:5px;
}
.projectCategories {
    width: 98%;
    height: auto;
    padding: 10px;
    font-size: 18px;
    text-align: center;
    background-color: white;
    border-bottom: black 1px solid;
    margin: 20px 0px 30px;
    font-family: ModernSans-Light;
    font-weight: bolder;
    letter-spacing: 1px;
}
		
	
/* 	THIS SECTION IS DEDICATED TO VIDEOS - IT ENABLES CHANGING SIZE RESPONSIVELY  */

.videoClips {
	margin: 0px auto;
	
}

	/* SECTION FOR FOOTER - GLOBAL */

.footerWrapper {
    width:100%;
    height: 80px;
    margin: 0px auto 0px;
    padding: 0px;
    position: absolute;
    bottom:0px;
    display: block;
	background-color:green;
}
footer {
    display: flex;
    justify-content: center;
    width: 95%;
    height: 80px;
    position:relative;
    bottom: 0px;
    margin:0px auto;
    padding: 20px 0px;
    box-sizing: border-box;
    background-color: darkgray;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    font-family: ModernSans-Light;
    font-size: 14px;
    font-weight: bold;
    letter-spacing: .5px;
}
	footer > div  {
		width:auto;
		height:auto;
		font-family: inherit;
		font-size:inherit;
		font-weight: inherit;
		margin:0px 20px;
		padding: 0px 5px;
		line-height: 40px;
		vertical-align: middle;
	}
	footer div> p {
		margin:0px;padding:0px;line-height:18px;
}
	footer a {
		display: block;
		width:auto;
		height: auto;
		margin:0px 20px;
		padding: 0px 25px;
		line-height: 40px;
		font-size: inherit;
		font-weight: 600;
		background-color:darkgray;
		border:1px solid lightgray;
		border-radius:5px;
}
footer img {
	display: block;
	margin:0px;
	padding:0px;
	line-height: 50px;
}
	footer a:hover {
		background-color:lightgray;
		border: solid 1px rgb(211, 144, 32);
		cursor: pointer;
	}

/* END FULL PAGE STYLING - HOMEPAGE */

/* START CODE FOR BIO/TEXT PAGES - GLOBAL */
.homePageWrapper {
	height: 100%;
}
	  .bioMain {
			width:70%; height:auto; margin:0px auto 0px; padding: 150px 0px 0px;  position: relative; box-sizing: border-box; border-radius: 5px;  
		}
/* STYLING SPECIFIC TO THE CV PAGES */
	.cvMain {
			width:100%; height:auto; margin:0px auto 0px; padding: 150px 0px 0px;  position: relative; box-sizing: border-box; border-radius: 5px;
	}
.cvPDFlink {
	width:20%;
	height: auto;
	margin: 0px auto 10px;
	padding: 5px;
	border: 1px solid black;
	border-radius: 5px;
	background-color: #d3911e;
}
.cvPDFlink:hover, .cvPDFlink:focus {
	background-color:#eee;
	border: 1px solid #d3911e;
}
.cvPhotoWrapper {
	padding-top: 20px;
	border-radius: 5px;
	background-color:#eee;
}
.cvPhotoWrapper img {
	border-radius: 5px;
}
/* END CV SPECIFIC STYLING */

/* START TEXT PAGE STYLING */
.textPageContents {
	width:70%; 
	height:100%; 
	margin:0px auto; 
	position:relative; 
	top:0px; 
	left:0px; 
	bottom:0px; 
	right:-30px; 
	padding:0px 0px 100px 0px;  
	overflow:hidden; 
	box-sizing:border-box; 
	line-height: 24px;
}
.textPageContents:hover {
}
	  .bioTitle {
		  color:#444444; float: left; 
	  }
.artStatementTitle {
	color:#444444 ;
}
	  .bioPhoto {
		 display: block; max-width: 100%; float: left; margin: 20px; position:relative;
	  }
    .bioText {
        width:100%; 
		height: 100%; 
		clear: both; 
		margin: 0px auto 0px;
		letter-spacing: .5px; 
		text-indent: 50px; 
    }
		.artStatementPhoto {
			width:100%;
			margin: 0px 0px 40px 0px;
			clear: both;
		}
.cvPhotoWrapper {
	width:80%; 
	height:100%; 
	margin: 40px auto;
	text-align: center;
	position: relative; 
}
.cvPhotoWrapper img {
	width:98%;
}


	/* END GLOBAL CODE FOR BIO/TEXT PAGES */

/* THE FOLLOWING IS GLOBAL CODE FOR THE HOME PROJECT PAGES */

.featureImageHorizontal {
	width:55%;
	height: auto;
	margin:10px auto 0px;
	text-align: center;
}

.featureImages {
	width: 35vw; 
	height: auto;
	margin: 0px auto;
}

.projectDescription {
    width: 55%;
    height: auto;
    margin: 70px auto 40px;
    font-family: ModernSans-Light;
    display: block;
    position: relative;
    clear: both;
    line-height: 20px;
    text-indent: 30px;
}

.leftTitle {
	float: left;
	font-style: italic;
	line-height: 25px;
	margin: 0px;
	padding: 0px;
}

.projectTitleMain {
	width:100%;
	height: 25px;
	margin: 200px auto 30px;
}
.projectTitleProjectPage {
	width: 50%;
	height: 25px;
	margin: 200px auto 30px;
}
.projectDateInfo {
	float: right;
	line-height: 25px;
}
.artworkTitle {
	margin: 10px auto;
	text-align: center;
}
.projectPageImages {
	width: 80%;
	height: auto;
	margin: 30px auto;
	padding: 0px;
	text-align: center;
}

.figureVertical {
	width:40%;
	height: auto;
	margin: 30px auto;
	padding: 0px;
}
.figureHorizontal {
	width:70%;
	height: auto;
	margin: 30px auto;
	padding: 0px;
}
.figureSqr {
	width: 50%;
	height: auto;
	margin: 0px auto;
}
.projectPageImages figcaption {
	width:100%;
	text-align: center;
	margin: 10px 0px 45px;
}
.exhibitionList {
	width:100%;
	height: auto;
	margin: 2% 0px 0px 0px;
	padding: 5px;
	font-size: 14px;
	line-height: 18px;
	list-style-type:circle;
	list-style-position: inside;
	box-sizing: border-box;
}
.exhibitionList li:first-child {
	list-style-type: none;
}

/* THE FOLLOWING CODE IS FOR MSYL PROJECT PAGE ONLY */

.projectExamples {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	width:50%;
	height: auto;
	background-color:gainsboro; 
	margin: 0px auto 40px;
	padding: 2%;
	box-sizing: border-box;
	border-radius: 5px;
}

/* THE FOLLOWING IS FOR LANDSCAPE INITIATIVE PAGE ONLY - GLOBAL */

/* THE CLASS landscapeMainContent IS NEEDED FOR STYLING IN MEDIA QUIERIES */
.projectsMain {
	width:85%;
	margin: 0px 0px 10px 15%;
	background-color:yellow;
}
.projectsMainContent {
	width:85%;
	height: auto;
	margin: 0px auto;
}
.landscapeMainContent{

}
.landscapeMainContent .projectTitleProjectPage {
	width:70%;
	margin-bottom: 60px;
}
.landscapeMainContent .projectTitleProjectPage p:first-child {
	font-size: 24px;
	margin-bottom:10px;
}
.landscapeInitiativeGrid {
	display: flex;
	flex-flow: row wrap;
	width:70%;
	height: auto;
	margin: 20px auto 60px;
	background-color:gainsboro;
	padding: 2%;
	border-radius: 5px;
	box-sizing: border-box;
}
.landscapeInitiativeGrid div {
	padding: 10px;
}
.landscapeInitiativeGrid p {
	font-size: 18px;
}
.landscapeInitiativeGrid a:hover {
	color: white;
}
.landscapeInitiativeGrid img:hover {
	color: white;
	box-shadow: 1px 1px 5px black;
}
.landscapeInitiativeVideo {
	width:50%; 
	margin:0px auto; 
	margin-bottom:50px;
}
.landscapeMainContent .projectExamples figure {
	width: 40%;
	margin:0px 0px 0px;
}

/* THE FOLLOWING IS FOR PERFECT VIEW ELEMENTS - GLOBAL */

.perfectViewVideo {
	width:60%; 
	height: auto; 
	margin:10px auto; 
	padding: 2%; 
	text-align: center; 
	background-color:gainsboro; 
	border-radius: 5px;
}
.perfectViewVideo video {
	width:60%;
}

/* END PERFECT VIEW STYLING FULL - GLOBAL */


/* 	THE FOLLOWING IS QUEST FOR SUCCESS FULL */

.questProjectImages {
	max-width: 1200px;
/*	max-height: 600px;*/
}
/* END QUEST FOR SUCCESS FULL */


/* THE FOLLOWING IS CODE FOR C5 MEDIA PLAYER PAGE FULL SIZE ONLY */
	
	.mediaPlayerFeatureImage img {
	display: block;
	width: 100%;
	max-width: 800px;
	margin: 0px auto;
		border:black 3px solid;
}
/* END CODE FOR C5 MEDIA PLAYER PAGE FULL SIZE */

/* END GLOBAL CODE FOR HOME PROJECT PAGE ELEMENTS */

/* BEGIN MEDIA QUERIES */

@media (min-width: 1475px) and (max-width: 1600px){
		header {
		background-color:rgb(68,152,162);
	}
			.projectsDropdown {
				background-color: rgb(68,152,162);
			}
}

/*  BEGIN MEDIA QUIERY FOR homePageText */
@media only screen and (max-width: 1366px){
	.homePageTextWrapper {
		width:22%;
	}
}


@media only screen and (max-height: 700px) {
	.homePageText {
		height: 80%;
	}
}

/* END MEDIA QUIERY FOR homePageText Height */


/* BEGIN MEDIA QUIERIES -  1600px Max */
		

/*			.homePageTextWrapper {
				height: 80%;
			}*/		
/* 	END MEDIA QUERIES 1600PX MAX */


@media only screen and (max-height:800px){
	.homePageTextWrapper {
		height: 60%;
	}
}
/* CODE FOR BIO/TEXT PAGES - MAX-WIDTH 1366 */

@media only screen and (max-width: 1366px){
	.textPageContents {
		width:100%;
	}
	.featureImageHorizontal {
		width:80%;
	}

.projectTitleMain {
	width:80%;
	height: 25px;
	margin: 10px auto 30px;
}

.pro80ctDateInfo {
	float: right;
	line-height: 25px;
}
	.projectDescription {
		width:80%;
		margin-top: 50px;
	}
	.projectPageImages {
	width: 90%;
	}
	.cvPhotoWrapper {
		width:95%;
		border-radius: 5px;
	}
	.cvPDFlink {
	width:20%;
}


/* END CODE FOR BIO/TEXT PAGES - MAX-WIDTH 1366PX */
/* START CODE FOR PROJECT PAGES - MAX-WIDTH 1366PX */

.projectTitleProjectPage {
	width: 80%;
	height: 25px;
	margin: 200px auto 20px;
}
/* THE FOLLOWING IS FOR CHANGING THE SIZE OF THE PERFECT VIEW VIDEO - MAX 1366PX */
	.perfectViewVideo video {
		width: 80%;
	}
}
/* THIS LITTLE SECTION IS ONLY FOR THE CHANGING HEADER COLOR */
@media only screen and (min-width : 1250px ) and ( max-width : 1366px ){
			header {
				background-color:rgba(185,10,6,1.00)
			}
	.projectsDropdown {
		background-color:rgba(185,10,6,1.00)
	}

		}
/* END CODE FOR HEADER COLOR CHANGE */

/* CODE FOR HIDING THE MSYL EXAMPLE IMAGES AS THERE ISN'T ROOM FOR THEM */
@media only screen and (max-width:1366px){
	.landscapeMainContent .projectExamples {
/*	display:none;
*/	}
}

/* START CODE FOR 900PX TO 1180PX MAX */
@media (min-width: 900px) and (max-width: 1180px){
	header {
	background-color: rgba(117,109,109,1.00)
}
	.projectsDropdown {
	background-color: rgba(117,109,109,1.00)	
	}
}
/* THIS CODE IS ONLY FOR REDUCING THE FONT SIZE FOR PARTICULAR SECTIONS AT 1180PX */
/* FOR LANDSCAPE INITIATIVE SECTIONS - MAX 1180PX */
@media only screen and (max-width: 1180px) {
	
	.landscapeMainContent .projectTitleProjectPage {
		width:80%;
	}
	.landscapeInitiativeGrid {
		width:80%;
		margin-bottom: 40px;
	}
	.landscapeInitiativeGrid div {
		flex-flow: wrap;
	}
	.landscapeInitiativeGrid p {
		font-size: 16px;
	}
.landscapeMainContent .projectExamples {
	width:70%;
}


/* MOBILE NAV ELEMENTS */ /* ALL PARTS OF THE MOBILE NAV FOR SCREEN WIDTHS 500 TO 1180 */
	.mobileNav {
		display: none;
		width:210px;
		height: auto;
        position: relative;
		margin: 110px auto 0px;
	  text-align: center;
	}
	#mobileNavBtn {
		width: auto;
		height: auto;
		position: relative;
		border-left: 25px solid transparent;
		border-right: 25px solid transparent;
		border-top: 40px solid rgb(211, 144, 30);
		border-bottom: 0px solid transparent;
		margin: 0px auto;
		padding: 0px;
        background-color:#eee;
	}
#mobileNavBtn:hover {
      background-color:whitesmoke;
      box-shadow: 0px 1.5px 3px rgb(211, 144, 30);
  }
	.mobileDropdownLink {
      display: block;
      width:90%;
      height: auto;
      margin:15px auto;
      padding: 4px 0px;
      position: relative;
      background-color: rgba(220,150,10,.9);
      color: whitesmoke;
	  border: 1px solid black;
      border-radius: 3px;
      outline: none;
		font-family: ModernSans-Light;
      text-align: center;
      line-height: 22px;
      font-size: 16px;
      cursor: pointer;
      transition: background-color 0.1s linear;
		 -webkit-box-shadow:2px 2px 2px rgba(81,66,39,.3),	
      inset 1px 1px 3px rgba(246,224,161,1.00) ;
      -moz-box-shadow:2px 2px 2px rgba(81,66,39,.3),	
      inset 1px 1px 3px rgba(246,224,161,1.00) ;
      -o-box-shadow:2px 2px 2px rgba(81,66,39,.3),	
      inset 1px 1px 3px rgba(246,224,161,1.00) ;
      box-shadow: 2px 2px 2px rgba(81,66,39,.3),	
      inset 1px 1px 3px rgba(246,224,161,1.00) ;
}
	
	.mobileDropdownLink:hover {
		background-color:whitesmoke;
		color:rgb(211, 144, 30);
	}
	.dropdown-content {
		display:none;
		position: absolute;
		top:40px;
		background-color:rgb(211, 144, 30);
		z-index: 1;
		width:100%;
		height: auto;
		margin: 0px auto;
		padding: 3px 0px;
		border-radius: 3px;
	}
    .dropdown-content a {
		display: block;
		width:95%;
		height: 20px;
		margin: 0px auto 5px;
		padding: 3px 0px;
		text-align: center;
	}
.mobileSocialBtnContainer {
    display: flex; 
    flex-flow: row nowrap; 
    justify-content: center; 
    width:95%; 
    height: auto; 
    gap:3px; 
    margin: 0px auto;
	padding: 0px 0px 3px;
    background-color:rgb(211, 144, 30);
	border:1px solid black;
	border-radius: 3px;
	transition: background-color 0.1s linear;
		 -webkit-box-shadow:2px 2px 2px rgba(81,66,39,.3),	
      inset 1px 1px 3px rgba(246,224,161,1.00) ;
      -moz-box-shadow:2px 2px 2px rgba(81,66,39,.3),	
      inset 1px 1px 3px rgba(246,224,161,1.00) ;
      -o-box-shadow:2px 2px 2px rgba(81,66,39,.3),	
      inset 1px 1px 3px rgba(246,224,161,1.00) ;
      box-shadow: 2px 2px 2px rgba(81,66,39,.3),	
      inset 1px 1px 3px rgba(246,224,161,1.00) ;
}
.mobileSocialBtnContainer:hover {
    background-color:whitesmoke;
}
.mobileSocialBtnContainer img:hover {
    webkit-filter: drop-shadow(2px 2px 2px #D3901E);
    filter: drop-shadow(2px 2px 2px #D3901E);
}
}
/* END MOBILE NAV TEST AT 1189PX */
/* END MEDIA QUERIE FOR MAX 1180PX */

/* BEGIN MEDIA QUERIE FOR MAX 900PX */
@media only screen and (max-width:900px) {
	.homePageWrapper {
		width:95%;
	}
	header {
		width:95%;
		height: 80px;
	}
	.headerName {
		width:auto;
		height:auto;
		font-size: 36px;
		line-height: 45px;
	}
	#logo {
		width:60px;
	}
	.socialBtnContainer {
		height: 90%;
		margin-top: 0px;
		column-gap: 0px;
	}
	.socialMediaBtn {
		margin-top: 35px;
	}
	.constructionNotice {
		width:30%;
		height: auto;
		margin-top:0px;
	}
}

 /* START CODE FOR 795px Max INDEX PAGE*/
		
@media only screen and (max-width: 795px){
	
	.headerContainer {
		position: fixed;
    	width: 100%;
		}
.navBtn {
    padding: 5px 20px;
}
.constructionNotice {
	height: auto; 
	font-size: 14px;
    }
.homePageWrapper {
    padding: 0px 0px 20px 0px;
    }
.homePageText {
        display: block;
        float: left;
        width: 52%;
        height: 1500px;
        box-sizing: border-box;
        border-radius: 5px;
        margin: 20px 0px 0px 0px;
        padding: 0px;
    }
.homePageTextWrapper {
    font-size: 14px;
    width:35%;
    margin: 0px;
}
.homePageIntro {
        width: 42%;
        height: 600px;
        margin-bottom: 50px;
        padding: 10px;
        /* [disabled]background-color:pink; */
        line-height: 20px;
        text-indent: 20px;
        font-weight: bolder;
        letter-spacing: .5px;
    }
.blogBox1 {
        width: 100%;
        height: 352px;
        line-height: 20px;
        text-indent: 50px;
        box-sizing: border-box;
        font-family: ModernSans-Light;
        font-weight: bolder;
        letter-spacing: .5px;
        border: solid 1px black;
        border-radius: 5px;
        overflow: auto;
        margin-top: 40px;
        padding: 20px;
    }
.homePageThmbs {
        position: relative;
        display: flex;
        flex-wrap: wrap;
        margin-top:160px;
        margin-right:auto;
    	margin-left: auto;
        background-color: white;
        width:40%;
        justify-content: center;
    	overflow-y: hidden;
        }
#top {
    width:100%; height:0px; margin:0px; padding: 0px; 
    }
.projectCategories {
        margin: 0px;
        padding: 0px;
    }
footer a {
    margin:0px 5px;
    padding: 0px 2%;
    line-height: 40px;
}
	
/* CODE FOR HOME PAGE MAX 700PX */
@media only screen and (max-width:700px){
	.flexNav {
		display: flex;
	}
	.socialBtnContainer {
		column-gap: 2px;
	}
	.socialMediaBtn {
		width:30px;
		height:30px;
		margin: 40px 0px 0px 0px;
	}
}
	/* END CODE FOR INDEX PAGE MAX 700PX */
	
	
	
	@media (max-width:650px){
/* BEGIN CODE FOR HEADER MAX 650 */	

/* TURN ON MOBILE NAV MAX 650 */
		
	}
	
/* CODE FOR BIO/TEXT PAGES MAX-WIDTH 795PX */


.textPageContents {
    width:100%;
    height: auto;
    position:relative; 
    padding:0px 10px; 
}
  .bioTitle {
      padding: 0px; margin:0px; float: left; line-height: 100px
  }
.bioText {
    margin-top:0px;
    padding:30px 0px 40px;
}
  .bioPhoto {
     display: block; max-width: 35%; 
  }
footer div {
    font-size: 12px;
    margin-right: 50px;
}
.cvPhotoWrapper {
    width:100%;
    margin-top: 0px;
}
.cvPDFlink {
    width:40%;
    font-size: 12px;
}
/* FOLLOWING IS CODE FOR PROJECT HOME PAGES 795PX MAX */
	.projectTitleProjectPage {
	width: 90%;
	height: 25px;
	margin: 180px auto 10px;
}
	h2 {
		font-size:20px;
	}
	.projectDescription {
		width:90%;
		margin-top:40px;
	}
	.projectPageImages {
		width: 100%;
	}
	.figureSqr {
		width:30%;
	}
	.featureImageHorizontal {
		width: 90%;
	}
	.projectTitleMain {
		width:85%;
	}
	.projectDescription {
		width:85%;
	}
	/* CODE ONLY FOR LANDSCAPE INITIATIVE GATEWAY PAGE AT 795PX */
	.landscapeMainContent .projectTitleProjectPage {
		width:100%;
	}
	.landscapeInitiativeGrid {
		width: 100%;
	}
	.landscapeInitiativeVideo {
		width:70%;
	}
	.landscapeMainContent .projectExamples {
	width:85%;
}
}
	/* END CODE FOR PROJECT HOME PAGES 795PX MAX */

/* END CODE FOR BIO/TEXT PAGES MAX-WIDTH 795PX */



/* HEADER COLOR ONLY */
		
@media only screen and (min-width: 700px) and (max-width: 900px){
	header {
		background-color:rgba(240,133,172,1.00)
	}
	.projectsDropdown {
		background-color:rgba(240,133,172,1.00)
	}
}

	@media only screen and (min-width:1700px) and (max-width:1800px){
		header {
			background-color:gray;
		}
		.projectsDropdown {
			background-color:gray;
		}
	}
@media only screen and  (min-width:500px) and (max-width: 650px){
	header {
		background-color:#58B8DA;
	}
	.projectsDropdown {
		background-color: #58B8DA;
	}
}
/* END HEADER COLOR CHANGE */

/* FOR LANDSCAPE INITIATIVE PAGE ONLY - MAX 700PX */


/* CHANGE LANDSCAPE INITIATIVE GRID TO 100% */

	@media only screen and (max-width:700px){
		.landscapeInitiativeGrid {
			width:100%;
		}
		.landscapeMainContent .projectExamples {
			flex-flow: column;
			justify-content: center;
		}
		.landscapeMainContent .exhibitionList {
			width:80%;
		}
		.landscapeMainContent .projectExamples figure {
			width:70%;
			margin: 10px auto;
		}
	}

/* END LANDSCAPE INITIATIVE MAX 700PX */




/* CHANGE PORTFOLIO PAGE ELEMENTS - MAX 900PX */

	@media only screen and (max-width:900px){
/* MAKE SQUARE IMAGES ON PORTFOLIO PAGES LARGER */
		.figureSqr {
			width:80%;
		}
/* CHANGE PERFECT VIEW VIDEO SIZE - MAX 900X */
		.perfectViewVideo {
			width: 70%;
		}
		.perfectViewVideo video {
			width:90%;
		}

	}
	
/* HIDE CONSTRUCTION NOTICE TILL MOBILE */
@media only screen and (min-width:414px) and (max-width:800px){
	.constructionNotice {
	display:block;
}
}

/* THE FOLLOWING IS FOR landscapeInitiative GATEWAY PAGE ONLY - @ 650px */
	@media only screen and (max-width:650px){
		.landscapeMainContent .projectTitleProjectPage p:first-child {
			font-size: 20px;
		}
	}
	
/* CHANGE HOMEPAGETEXTWRAPPER DIV WIDTH - CHANGE AT 625PX */

	@media (min-width: 414px) and (max-width: 625px){
		.homePageTextWrapper {
/*			width:40%;*/
		}
}
/* SWITCHING FROM MAIN NAV TO MOBILE NAV */

		











				/* -----------------------------MAX WIDTH 500PX -------------------------------- */

@media only screen and (max-width:500px){
	
.show {
	display: block;
}
html {
    overflow: scroll;
    scrollbar-with:0px;
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}

	/* Hides scrollbars but keep the ability to scroll */
/* Hide scrollbar for Chrome, Safari and Opera */
	html::-webkit-scrollbar {
  		display: none;
		scrollbar-width:none;
}
	.top {top:-600px}
	
	
/* Hides scrollbars but keep the ability to scroll */
	
/* Hide scrollbar for Chrome, Safari and Opera */
	.hiddenScroll::-webkit-scrollbar {
  display: none;
}
.homePageWrapper {
    width: 100%;
    margin: 0px;
    padding: 0px;
}
main {
    width:98%;
	overflow: auto;
	margin: 0px auto;
}
	
	
.headerContainer {
    width: 98%;
    height: auto;
    margin: 3px auto 0px;
    padding: 0px;
    position: relative;
    }
header {
    width: 100%;
    height: 60px;
    margin: 0px 0px 0px 0px;
    padding: 0px 10px;
    position: relative;
    box-sizing: border-box;
    border: black 1px solid;
    border-radius: 5px;
    background-color:#24CFD4;
    }
.headerName {
    font-family: Quantify;
    font-size: 36px;
    font-weight: normal;
    float: left;
    line-height: 60px;
    }
.flexNav {
    display: none;
}
#logo {
    float: right;
    width:40px;
    height: 40px;
    line-height: 60px;
    display: block;
}
	/* THE FOLLOWING HIDES THE SOCIAL MEDIA BUTTONS IN THE HEADER */
.navLogoContainer .socialBtnContainer {
    display: none;
}

.socialBtnContainer {
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  width:95%;
  height: auto;
  margin:0px auto;
  padding: 0px 0px 4px;
  gap:3px;
	background-color:aqua;
/*  background-color: rgba(220,150,10,1);*/
  border: 1px solid black;
  border-radius: 3px;
  cursor: pointer;
  transition: background-color 0.1s linear;
     -webkit-box-shadow:2px 2px 2px rgba(81,66,39,.3),	
  inset 1px 1px 3px rgba(246,224,161,1.00) ;
  -moz-box-shadow:2px 2px 2px rgba(81,66,39,.3),	
  inset 1px 1px 3px rgba(246,224,161,1.00) ;
  -o-box-shadow:2px 2px 2px rgba(81,66,39,.3),	
  inset 1px 1px 3px rgba(246,224,161,1.00) ;
  box-shadow: 2px 2px 2px rgba(81,66,39,.3),	
  inset 1px 1px 3px rgba(246,224,161,1.00) ;
}
.socialBtnContainer:hover {
    background-color:whitesmoke;
}
.socialMediaBtn {
    background-color:yellow;
}
.socialMediaBtn img {
    display:block;
    width:100%;
    height: 100%;
}
.socialBtnContainer img:hover{
	webkit-filter: drop-shadow(1px 1px 1px #D3901E);
	filter: drop-shadow(1px 1px 1px #D3901E);
}



	 
	/* BEGIN MOBILE NAV STYLING - MAX500PX - THIS IS THE NON-ACCORDION MOBILE NAV */

/*.mobileDropdownContainer {
    display: flex;
    flex-flow: column nowrap;
    justify-content: center;
    width: 95%;
    margin: 0px auto;
    text-align: center;
}*/
#menuBtn {
    width: auto;
    height: auto;
    border-left: 25px solid transparent;
    border-right: 25px solid transparent;
    border-top: 40px solid rgb(211, 144, 30);
    border-bottom: 0px solid transparent;
    padding: 0px;
    background-color:#eee;
    display: block;
}
.mobileNav {
    display: block;
    width:210px;
    height: auto;
    position: relative;
    margin: 0px auto;
  text-align: center;
}
	
	/* THIS THE TRIANGULAR MOBILE NAV BUTTON */ 
#mobileNavBtn {
    width: auto;
    height: auto;
    position: relative;
    border-left: 25px solid transparent;
    border-right: 25px solid transparent;
    border-top: 40px solid rgb(211, 144, 30);
    border-bottom: 0px solid transparent;
    margin: 0px auto;
    padding: 0px;
    background-color:#eee;
}
#mobileNavBtn:hover {
      background-color:whitesmoke;
      box-shadow: 0px 1.5px 3px rgb(211, 144, 30);
  }
#menuBtn:hover, #menuBtn:focus {
    border-left: 25px solid transparent;
    border-right: 25px solid transparent;
    border-top: 40px solid rgb(211, 144, 30);
    background-color:white;
}
	
	/* FOR THE BUTTONS WITHIN THE MOBILE DROPDOWN */
.mobileDropdownLink {
    display: block;
    width:90%;
    height: auto;
    margin:15px auto;
    padding: 4px 0px;
    position: relative;
    background-color: rgba(220,150,10,.9);
    color: whitesmoke;
    border: 1px solid black;
    border-radius: 3px;
      font-family: ModernSans-Light;
    text-align: center;
    line-height: 22px;
    font-size: 16px;
    cursor: pointer;
    transition: background-color 0.1s linear;
       -webkit-box-shadow:2px 2px 2px rgba(81,66,39,.3),	
    inset 1px 1px 3px rgba(246,224,161,1.00) ;
    -moz-box-shadow:2px 2px 2px rgba(81,66,39,.3),	
    inset 1px 1px 3px rgba(246,224,161,1.00) ;
    -o-box-shadow:2px 2px 2px rgba(81,66,39,.3),	
    inset 1px 1px 3px rgba(246,224,161,1.00) ;
    box-shadow: 2px 2px 2px rgba(81,66,39,.3),	
    inset 1px 1px 3px rgba(246,224,161,1.00) ;
}
	
.mobileDropdownLink:hover {
    background-color:whitesmoke;
    color:rgb(211, 144, 30);
}
	/* THE FOLLOWIN IS FOR THE BOTTOM ROW OF SOCIAL MEDIA BUTTONS IN THE MOBILE NAV */
.mobileSocialBtnContainer {
    display: flex; 
    flex-flow: row nowrap; 
    justify-content: center; 
    width:95%; 
    height: auto; 
    gap:3px; 
    margin: 0px auto;
	padding: 0px 0px 3px;
    background-color:rgb(211, 144, 30);
	border:1px solid black;
	border-radius: 3px;
	transition: background-color 0.1s linear;
		 -webkit-box-shadow:2px 2px 2px rgba(81,66,39,.3),	
      inset 1px 1px 3px rgba(246,224,161,1.00) ;
      -moz-box-shadow:2px 2px 2px rgba(81,66,39,.3),	
      inset 1px 1px 3px rgba(246,224,161,1.00) ;
      -o-box-shadow:2px 2px 2px rgba(81,66,39,.3),	
      inset 1px 1px 3px rgba(246,224,161,1.00) ;
      box-shadow: 2px 2px 2px rgba(81,66,39,.3),	
      inset 1px 1px 3px rgba(246,224,161,1.00) ;
}
.mobileSocialBtnContainer:hover {
    background-color:whitesmoke;
}
.mobileSocialBtnContainer img:hover {
    webkit-filter: drop-shadow(2px 2px 2px #D3901E);
    filter: drop-shadow(2px 2px 2px #D3901E);
}
.dropdown {
    position: relative;
}

.submenu {
    display:block;
}

.mobileMenuBtn:hover, .mobileMenuBtn:focus {
    width: 0;
    height: 0;
    border-left: 25px solid transparent;
    border-right: 25px solid transparent;
    border-top: 40px solid rgb(211, 144, 30);
    padding: 0px;
    background-color:#eee;
}


	/* END NAV CODING */
	
	/* CONSTRUCTION NOTICE */
	
		.constructionNotice {
			width:350px; 
			height: auto; 
			margin:0px 0px 5px 15px; 
			padding: 0px; 
			font-size: 14px;
		}
	/* END CONSTRUCTION NOTICE */
	
	.indexMain {
		display: flex;
		justify-content: center;
		flex-direction: column;
	}
	.homePageText {
		clear: both;
		width:95%;
		height: 220px;
		margin: 0px auto;
		padding: 0px 0px 0px 0px;
border:black solid 1px;	}
	/* THIS CODE IS FOR RETURNING TO TOP */
	#top {
		width:100%; height:0px; margin-bottom:0px; padding: 0px; position: absolute; top: -200px;
	}
	
	/* THE FOLLOWING CODE CREATES A BACKGROUND BOX WITH COLOR - CURRENTLY ONLY USED ON THE COMMUTER PROJECT PAGE */
	.backgroundColorBox {
	width:80%;
	height: auto;
	margin: 0px auto;
	padding: 1px 0px;
	background-color:gainsboro;
	border-radius: 5px;
}
	.backgroundColorBox .projectDescription {
		width:90%;
		font-size: 14px;
		line-height: 16px;
	}
	
/* THE FOLLOWING BLOCK IS FOR THE HOMEPAGE ONLY */
	.homePageTextWrapper {
		position: relative;
		width:90%;
		height: 77%;
		margin: 0px auto;
		padding-bottom:30px;
		border: none;
/*		overflow: auto;*/
/*		border-top:solid black 1px;
		border-right:none;
		border-bottom: solid black 1px;
		border-left: solid black 1px;
		border-top-right-radius: 0px;
		border-bottom-right-radius: 0px;
		padding: 10px 10px 10px 10px;*/
	}
	.homePageIntro {
		width:100%;
		height: 100px;
/*		scrollbar-width:0px;*/
		margin: 0px;
		padding: 10px;
		overflow-y:scroll;
		line-height: 1.2em;
		text-indent: 20px;
		border-radius: 5px;
		clear: both;
		position: relative;
	}
	

	.blogBox1 {
		display: none;
	}
	
	.homePageThmbs {
		width:95%;
		margin: 0px;
		padding-top: 300px;
		box-sizing: content-box;
		clear: both;
/*		background-color:#eee;
*/	}
	

	/* Hide scrollbar for Chrome, Safari and Opera */
	.homePageThmbs::-webkit-scrollbar {
		display:none;
	}
	.projectCategories {
			width: 95%;
			height: auto;
			padding: 10px;
			font-size: 16px;
			text-align: center;
			background-color: white;
			border-bottom: black 1px solid;
			margin: 15px auto;
			font-family: ModernSans-Light;
			font-weight: bolder;
			letter-spacing: 1px;
		}

	

	.homePageThmbs {
		clear: both;
		position: relative;
		width: 100%;
		height: auto;
		margin: 0px;
		padding:5px;
	}
	.homePageThmbs a {
		display: block;
		width:50%;
		height: auto;
		margin: 0px;
		padding: 0px;
		}
	.thmbs {
		width: 90%;
		height: 200px;
		margin: 0px 0px 10px 0px;
		padding: 5px 5px 20px 5px;
		position: relative;
		text-align: center;
		border: lightgrey solid 1px;
		border-radius: 5px;
		background-color:white;
				}
	.thmbs:hover, .thmbs:focus {
			border: solid black 1px;
		}
	.thmbs  img {
			display: block;
			max-height: 180px;
			max-width: 90%;
			margin:5px auto 20px;
		}
	.thmbs p {
		position: relative;
		margin: 0px auto;
		font-size: 14px;
		color:black;
	}


	
	/* THIS CODE IS FOR RESIZING VIDEO CLIPS FOR PHONE FORMAT */
	
	.videoClips {
	margin: 0px auto;
	width:90%;
}
	.footerWrapper {
		width:100%;
		height: auto;
	}
	footer {
		display: flex;
		justify-content: center;
		width:100%;
		height:60px;
		position: relative;
		margin: 0px auto;
		padding:10px 0px 0px;
		box-sizing: border-box;
		font-family: ModernSans-Light;
		font-size:12px;
		font-weight: bold;
		letter-spacing: .5px;
	}
	footer > div  {
		width:130px;
		height: auto;
		font-family: inherit;
		font-size:inherit;
		font-weight: inherit;
		margin:0px 10px 5px 5px;
		padding: 5px 0px;;
		line-height: 14px;
		vertical-align: middle;
		word-spacing: -1px;
	}
	footer a {
		width:auto;
		height: 40px;
		margin:0px 5px;
		padding: 0px 10px;
		line-height: 40px;
		font-size: inherit;
		font-weight: inherit;
		background-color:darkgray;
		border:1px solid lightgray;
		border-radius:5px;
	}
	footer div {
		font-size:9px;
	}
	
	/* START CODE FOR BIO/TEXT PAGE MAX-WIDTH 414PX */
	
	.bioMain {
		width:95%; 
		height: auto; 
		background-color:#eee; 
		margin-bottom: 40px;
		padding-bottom: 30px; 
		padding-top:0px;
		}
	/* STYLING SPECIFIC TO CV PAGES */
	.cvMain {
		width:100%; 
		height: auto; 
		margin:0px auto 0px; 
		background-color:#eee; 
		padding-bottom: 30px; 
		padding-top:10px;
		border-radius: 0px;
		position: relative;
	}
	.cvPDFlink  {
		width:40%;
		height: auto;
		margin:0px auto 5px; 
		padding: 5px 10px;
		font-size: 12px;
	}
	.cvPhotoWrapper {
		width: 100%;
		margin: 0px auto;
		padding-left: 0px;
		position: relative;
	}
	.cvPhotoWrapper img {
		padding-left: -200px;
		padding-right: 0px;
	}
	/* END STYLING SPECIFIC TO CV PAGES */
	
.textPageContents {
    width:90%;
    margin:0px auto 0px;
    padding:0px 0px 0px 0px;
    height: 100%;
    position:relative; 
    top:0px;
}
.bioTitle {
    font-size: 16px; 
    line-height: 20px; 
    float: left;
    margin:50px 0px ;
}
.artStatementTitle {
    margin:10px 0px; 
    float: left;
    color:red;
}
.bioPhoto {
   width: 30%; height: auto; position: relative; text-align: center; padding: 0px; float: right;margin-right: 50px;
}
.artStatementPhoto {
    width:100%; 
    margin: 0px auto; 
    padding: 0px; 
    clear: both; 
    background-color:red;
}
.bioText {
    width:100%; 
    height: auto; 
    padding: 10px 0px 0px 0px; 
}
.bioText p{
    margin: 0px; 
    padding: 0px;  
    line-height: 1.3em; 
    letter-spacing: .5px; 
    text-indent: 40px; 
}


	
/* END CODE FOR BIO/TEXT PAGE MAX-WIDTH 414PX */

	
/* THE FOLLOWING IS CODE FOR THE PROJECT HOME PAGES 414PX */

 featureImageHorizontal {
	width:70%;
	height: auto;
	margin:20px auto 0px;
}
.projectTitleMain {
	width:70%;
}
.projectTitleProjectPage {
	width: 70%;
	height: 25px;
	margin: 0px auto 0px;
}
.leftTitle {
	font-size:16px;
}
.projectDateInfo {
	font-size: 14px;
}
.projectDescription {
	width:70%;
margin: 20px auto 20px;
}
.projectPageImages {
	width:100%;
}
	.figureHorizontal {
		width:95%;
	}
	.figureVertical {
	width:95%;
}
	.figureSqr {
	width: 95%;
}
	.responsiveVideo {
		width:90%;
	}
	.projectPageImages figcaption {
		font-size: 14px;
	}
	.projectExamples {
		width:95%;
	}
	.exhibitionList {
		width:90%;
	}
	

	
	
	/* THE FOLLOWING CODE IS FOR LANDSCAPE INITIATIVE GATEWAY PAGE ONLY - MAX WIDTH 414PX */
	
	.landscapeMainContent .projectTitleProjectPage {
		width:90%;
		margin:20px auto 40px;
	}
	.landscapeMainContent .projectTitleProjectPage p:first-child {
		font-size: 18px;
	}
	.landscapeMainContent .projectTitleProjectPage p:last-child {
		font-size:14px;
	}
	.landscapeInitiativeGrid {
		padding: 0px;
		width:95%;
	}
	.landscapeInitiativeGrid a {
		font-size: 12px;
	}
	.landscapeMainContent .projectExamples {
		display: block;
		width:95%;
		flex-flow: column;
		justify-content: center;
	}
	.landscapeMainContent .exhibitionList {
		width:95%;
	}
	.landscapeMainContent .projectExamples figure {
		width:70%;
		margin: 5px auto;
	}

	
	/* PERFECT VIEW ELEMENTS - MAX 414PX */
	.perfectViewVideo {
		width:90%;
	}
}
	/* END CODE FOR PROJECT HOME PAGES 414PX */
 /* END CSS FOR 414PX */


/* BEGIN CODE FOR CV PAGE ONLY */

.cvsectiontitle {
	width:30%;
	height: auto;
	padding:0px;
}
.cvsections {
	width:100%;
	height: auto;
	display: flex;
	padding-bottom: 0px;
}
.cvdates {
	width:20%;
	height: auto;
	padding: 5px 5px 5px 10px;
}
.cvitems {
	width: 70%;
	height: auto;
	padding: 5px 5px 5px;
	text-indent: -20px;
	line-height: 18px;
}
.cvitems div {
	margin-bottom:8px;
}

.responsiveImageSmall {
	width:75%;
}

.responsiveImageMini {
	width: 60%;
}

.centeredText {
	text-align: center;
}

/* CODE FOR VILLAGE IDIOT PAGE */
.villageIdiotGraphs {
	display: flex;
	flex-flow: wrap;
	width: 80%;
	height: auto;
	margin: 20px auto;
}

.villageIdiotGraphs img {
	width:45%;
	height: auto;
	margin: 1%;
}
.woodstockVillagePhotos {
	display: flex;
	flex-flow: wrap;
	width: 80%;
	height: auto;
	margin: 0px auto 30px;
}
.woodstockVillagePhotos img {
	width: 45%;
	height:auto;
	margin: 1%;
}
/* END CODE FOR VILLAGE IDIOT */






