* {
    margin: 0;
    padding: 0;
}

a.col {
	font-size: 1.25rem!important;
}
.nav-link {
	font-size:1.25rem!important;
}

.show {
	display: block;
}
.hide {
	display: none;
}

.spacer {
	display: block;
	position: relative;
	padding:2% 0 7% 0;
}

p {
	font-size:1.25rem!important;
}

.col-10.body-wrapper ul li, .col-10.body-wrapper ol li {
	font-size:1.25rem;
}

#resultID-one p, #resultID-four p{
	position: relative;
	width:40%;
	margin: 0 auto;
	/*background-color: rgb(183,222,130);*/
	color:rgb(11,35,65);
	border: 5px solid rgb(33,88,52);
	text-align: center;
	padding:2%;
	border-top-right-radius: 15px;
	border-top-left-radius: 15px;
	border-bottom-right-radius: 15px;
	border-bottom-left-radius: 15px;
	margin-top:2%;
	margin-bottom:2%;
}

#resultID-zero p, #resultID-two p, #resultID-none{
	position: relative;
	width:40%;
	margin: 0 auto;
	/*background-color: rgb(250,185,185);*/
	color:rgb(11,35,65);
	border: 5px solid rgb(255,0,0);
	text-align: center;
	padding: 2%;
	border-top-right-radius: 15px;
	border-top-left-radius: 15px;
	border-bottom-right-radius: 15px;
	border-bottom-left-radius: 15px;
	margin-top:2%;
	margin-bottom:2%;
}

/* ------------------- Page Header Hexagln Style ------------------- */
#wrapper {
    overflow: hidden;
    width: 100%;
    height: 29vh;
    position: relative;
    background: url('../images/adobe_stock_header.jpg') 100% 0% /100%;
	background-color: rgb(164,219,247);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
    animation: bg 25s linear infinite paused;
}

.bg {
  width: 100%;
  height: 30vh;
  background: linear-gradient(to right, #EE7752, #E73C7E, #23A6D5, #23D5AB);
  background-size: 400% 100%;
  animation: bg 20s infinite;
}

@keyframes bg {
  0% {
      background-position: 0% 50%;
  }

  50% {
      background-position: 100% 50%;
  }

  100% {
      background-position: 0% 50%;
  }
}

/* === SVG === */
svg.header-svg {
  display: block;
  position: absolute;
  top: 46%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 31vh;
}

svg polygon {
  position: absolute;
}

svg polygon.center {
  opacity:0.7;
  cursor: pointer;
  transition: opacity 0.3s;
}

svg polygon.center:hover {
  opacity:0.2;
}

#startText {
  font-weight: 700;
  fill:#fff;
  user-select: none;
  pointer-events: none;
}

#restartText {
  font-weight: 700;
  fill:rgb(255, 255, 255);
  user-select: none;
  pointer-events: none;
  opacity: 0;
}

/* ------------------------------- Hexagon Style End ---------------------------- */
body {
	max-width: 100%;
	overflow-x: hidden;
}

a {
	font-size: 1.25rem;
}

.site-header {
	box-shadow: 0px 2px 5px;
}

.navbar {
	background-color: rgb(231,233,236);
	box-shadow: 0px -2px 5px;
}

.site-header .header-logo img {
	width: 60%;
}

.navbar-light .navbar-nav .nav-link {
	color: rgb(11,35,65);
}

.nav-item {
	border-right: 1px solid rgb(11,35,65);
	padding: 0 2rem;
}

.nav-item:last-child {
	border-right:none;
}

.navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus {
	color: rgb(204,78,11);
}

.page-header {
    background-repeat: no-repeat;
    background-image: url('../images/adobe_stock_header.jpg');
    width: 100%;
    min-height: 45vh;
    background-size: cover;
    background-position: center center;
}
.overlay-box {
    display: inline-block;
    position: relative;
    z-index: 9;
    background-color: rgb(206,211,217);
    padding: 3rem;
}

.col-10.body-wrapper {
	display: block;
	position: relative;
	width: 90%;
	margin: 0 auto;
	padding: 5rem;
}
.index {
	text-align: center;
}

.icon-container {
	padding: 5% 0;
}

.icon-row {
	margin: 0;
	display:block;
}

.icon-block {
	display: inline-block;
	position: relative;
	padding: 1%;
	width: 15%;
}

.icon-inner {
	width: 100%;
}

.icon-inner img {
	width: 70%;
	height: auto;
}

.site-btn {
	position: relative;
	width: 25%;
	text-align: center;
	background-color: rgb(204,78,11);
	margin: 0 auto;
	padding: 1%;
	border-radius: 15px;
	font-size: 1.5rem;
	color: #fff;
	text-transform: uppercase;
	text-decoration: none;
}
.site-btn:hover, .site-btn:focus {
	
	background-color: rgb(11,35,65);
	
}
.none {
	text-decoration: none;
}
.page-header img {
	width:100%;
	max-height: 30vh;
} 

.icon-inner:hover, .icon-inner:focus {
	transform: scale(1.25);
	transition: transform .5s ease-out;
}
/* ----------------- Featured Work Styles ----------------- */
.image-gallery {
  margin: 0 auto;
  display: table;
  width:70%;
}

.primary, .primary1, .primary2,
.thumbnails {
  display: table-cell;
}

.thumbnails {
  width: 30%;
  padding: 0 2%;

}

.primary, .primary1, .primary2 {
  width: 100%;
  height: auto;
  background-color: #fff;
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;
  border: 4px solid rgb(11,35,65);
}

.thumbnail:hover .thumbnail-image, .selected .thumbnail-image, .thumbnail1:hover .thumbnail-image {
  border: 4px solid rgb(204,78,11);
}

.thumbnail-image {
  width: 100%;
  height: 20rem;
  margin: 0 0 2% 0;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  border: 4px solid transparent;
}

.ts-1 {
	background-image: url("../images/Taylor_Sondgeroth_KnolledBones.png");
}

.ts-2 {
	background-image: url("../images/Taylor_Sondgeroth_Project1.png");
}

.ts-3 {
	background-image: url("../images/Taylor_Sondgeroth_Project2.png");
}

.ab-1 {
	background-image: url("../images/Autumn_Busbee_Project2.png");
}

.ab-2 {
	background-image: url("../images/Autumn_Busbee_Project3.png");
}

.ab-3 {
	background-image: url("../images/Autumn_Busbee_Challenge6.png");
}

.nm-1 {
	background-image: url("../images/NatalieMcAfee_project3.png");
}

.nm-2 {
	background-image: url("../images/natalie_mcafee_challenge_6.png");
}

.featured-img-container {
    display: block;
    position: relative;
    width: 60%;
    /* padding: 2rem; */
    margin: 0 auto;
}

.featured-img-container img{
    width:100%;
	border: .5rem solid #fff;
}

.col-6.video-container {
	display: block;
	position: relative;
	width:60%;
	margin: 0 auto;
	padding: 2% 0;
}

a.footer-url-link {
	color: rgb(11,35,65);
}

.site-footer .social .icons .item a svg {
    color: #0b2341;
    transition: all .25s;
}

.site-footer .social .icons .item a:hover svg {
    color: #cc4e0b;
    transform: scale(1.5);
}


/* ---------------------- Featured Work Gallery -------------------*/

.col-4.artist-container{
	display: inline-block;
	position: relative;
	width:30%;
}

.artist-img {
	display: block;
	position: relative;
	width:75%;
	margin: 0 auto;
}

.info-container {
	padding: 1% 0;
}
.artist-info {
	text-align: center;
	font-size:1.25rem;
}

.col-6.gallery-container {
	display: inline-block;
	position: relative;
	width:58%;
}


/* -------------- Featured End -------------- */
@media only screen and (min-width: 3840px) {
	.slideshow {
		max-height: 40vh;
	}
	.slideshow .slideshow-left .Lslide, .slideshow .slideshow-right .Rslide {
		height: 94%;
	}
	.control {
		top: 48%;
	}
}

@media only screen and (min-width: 3440px) {
	.slideshow .slideshow-right .Rslide img {
		width:56%;
	}
}


@media only screen and (min-width: 1920px) {
	.slideshow {
	max-height: 40vh;
}
	.slideshow .slideshow-right .Rslide img {
		width:65%;
	}
}

@media only screen and (max-width: 600px) {
	.site-btn {
		width:90%;
		font-size: 1rem;
	}
	
	.icon-inner img {
		width: 90%;
		height: auto;
	}
}

/*-------------------------------------------------------*/


@media only screen and (max-width: 2560px) {
  
}

@media only screen and (max-width: 1920px) {
  
}


@media only screen and (max-width: 1536px) {
  	.col-4.artist-container {
		display: block;
		position: relative;
		width: 50%;
		left:25%;
	}
	
	.image-gallery {
		margin: 0 auto;
		display: table;
		width: 100%;
	}
}

@media only screen and (max-width: 1440px) {
  
}

@media only screen and (max-width: 1366px) {
  
}
@media only screen and (max-width: 1280px) {
	
	/* ------- featured -------- */
	.col-4.artist-container {
		display: block;
		position: relative;
		width: 50%;
		left:25%;
	}
	
	.image-gallery {
		margin: 0 auto;
		display: table;
		width: 100%;
	}
  
}
@media only screen and (max-width: 962px) {
  
}
@media only screen and (max-width: 800px) {
  	.col-4.artist-container {
		display: block;
		position: relative;
		width: 100%;
	}
	
	.thumbnails {
	  width: 100%;
	  padding: 0 2%;

	}
	
	.thumbnail-image {
		width: 100%;
		height: 37rem;
		margin: 0 0 2% 0;
		background-size: cover;
		background-position: center center;
		background-repeat: no-repeat;
		border: 4px solid transparent;
	}
	
	.primary, .primary1 {
		display: none!important;
	}
	
	#resultID-one p, #resultID-four p{
	position: relative;
	width:80%;
	margin: 0 auto;
	/*background-color: rgb(183,222,130);*/
	color:rgb(11,35,65);
	border: 5px solid rgb(33,88,52);
	text-align: center;
	padding:2%;
	border-top-right-radius: 15px;
	border-top-left-radius: 15px;
	border-bottom-right-radius: 15px;
	border-bottom-left-radius: 15px;
	margin-top:2%;
	margin-bottom:2%;
}

#resultID-zero p, #resultID-two p, #resultID-none{
	position: relative;
	width:80%;
	margin: 0 auto;
	/*background-color: rgb(250,185,185);*/
	color:rgb(11,35,65);
	border: 5px solid rgb(255,0,0);
	text-align: center;
	padding: 2%;
	border-top-right-radius: 15px;
	border-top-left-radius: 15px;
	border-bottom-right-radius: 15px;
	border-bottom-left-radius: 15px;
	margin-top:2%;
	margin-bottom:2%;
}

}

@media only screen and (max-width: 768px) {
  	/*--------------- Index ----------------*/
	#resultID-one h2, #resultID-four h2, #resultID-two h2, #resultID-zero h2 {
		width:100%;
		margin:2%;
	}
	
	.col-10.body-wrapper {
		padding:2% 0;
	}
	.icon-block {
		width:18%;
	}
/*--------------------------------------*/
/*------------------ Creative Space ------------*/
	.col-6.video-cointainer {
		width:100%;
	}
	iframe {
		height: 50%;
	}
/*-------------------------------------*/
/* ----------------- Feautred Work -------------*/
	.col-4.artist-container {
		width:100%;
	}
	.col-6.gallery-container {
		width:100%;
	}
	.portfolio, .portfolio1 {
		position: relative;
		width:100%;
		max-width: 100%;
	}
	.portfolio img, .portfolio1 img {
		width:100%;
	}
	.portfolio:nth-child(1), .portfolio1:nth-child(1) {
		left: 0;
	}
	.portfolio:nth-child(1):hover, .portfolio1:nth-child(1):hover {  
		-webkit-transform: rotate(-2deg);
		-moz-transform: rotate(-2deg);
		transform: rotate(-2deg);
		left: 0;
	}

	.portfolio:nth-child(2), .portfolio1:nth-child(2) {
		left: 0%;
	}
	.portfolio:nth-child(2):hover, .portfolio1:nth-child(2):hover {
		-webkit-transform: rotate(-2deg);
		-moz-transform: rotate(-2deg);
		transform: rotate(-2deg);
		left: 0%;
	}

	.portfolio:nth-child(3), .portfolio1:nth-child(3) {  
		left: 0%;
	}
	.portfolio:nth-child(3):hover, .portfolio1:nth-child(3):hover  {  
		-webkit-transform: rotate(-2deg);
		-moz-transform: rotate(-2deg);
		transform: rotate(-2deg);
		left: 0%;
	}

	.portfolio:nth-child(4), .portfolio1:nth-child(4) {  
		left: 0%;
	}
	.portfolio:nth-child(4):hover, .portfolio1:nth-child(4):hover {  
		-webkit-transform: rotate(-2deg);
		-moz-transform: rotate(-2deg);
		transform: rotate(-2deg);
		left: 0%;
	}

	.portfolio:nth-child(5), .portfolio1:nth-child(5) {  
		left: 0%;
	}
	.portfolio:nth-child(5):hover, .portfolio1:nth-child(5):hover {  
		-webkit-transform: rotate(-2deg);
		-moz-transform: rotate(-2deg);
		transform: rotate(-2deg);
		left: 0%;
	}
	
	/* ------- featured -------- */
	.col-4.artist-container {
		display: block;
		position: relative;
		width: 100%;
		left:0;
	}
	
	.thumbnails {
	  width: 100%;
	  padding: 0 2%;

	}
	
	.thumbnail-image {
		width: 100%;
		height: 37rem;
		margin: 0 0 2% 0;
		background-size: cover;
		background-position: center center;
		background-repeat: no-repeat;
		border: 4px solid transparent;
	}
	
	.primary, .primary1 {
		display: none!important;
	}
	.page-header {
		background-position: center center;
	}
}

@media only screen and (max-width: 601px) {
  	.thumbnail-image {
		width: 100%;
		height: 25rem;
		margin: 0 0 2% 0;
		background-size: cover;
		background-position: center center;
		background-repeat: no-repeat;
		border: 4px solid transparent;
	}
}

@media only screen and (max-width: 414px) {
  	

}

@media only screen and (max-width: 375px) {
  
}

@media only screen and (max-width: 360px) {
	
/*--------------- Index ----------------*/
	.col-10.body-wrapper {
		padding:2% 0;
	}
	.icon-block {
		width:18%;
	}
/*--------------------------------------*/
/*------------------ Creative Space ------------*/
	.col-6.video-cointainer {
		width:100%;
	}
	iframe {
		height: 50%;
	}
/*-------------------------------------*/
/* ----------------- Feautred Work -------------*/
	.col-4.artist-container {
		width:100%;
	}
	.col-6.gallery-container {
		width:100%;
	}
	.portfolio, .portfolio1 {
		position: relative;
		width:100%;
		max-width: 100%;
	}
	.portfolio img, .portfolio1 img {
		width:100%;
	}
	.portfolio:nth-child(1), .portfolio1:nth-child(1) {
		left: 0;
	}
	.portfolio:nth-child(1):hover, .portfolio1:nth-child(1):hover {  
		-webkit-transform: rotate(-2deg);
		-moz-transform: rotate(-2deg);
		transform: rotate(-2deg);
		left: 0;
	}

	.portfolio:nth-child(2), .portfolio1:nth-child(2) {
		left: 0%;
	}
	.portfolio:nth-child(2):hover, .portfolio1:nth-child(2):hover {
		-webkit-transform: rotate(-2deg);
		-moz-transform: rotate(-2deg);
		transform: rotate(-2deg);
		left: 0%;
	}

	.portfolio:nth-child(3), .portfolio1:nth-child(3) {  
		left: 0%;
	}
	.portfolio:nth-child(3):hover, .portfolio1:nth-child(3):hover  {  
		-webkit-transform: rotate(-2deg);
		-moz-transform: rotate(-2deg);
		transform: rotate(-2deg);
		left: 0%;
	}

	.portfolio:nth-child(4), .portfolio1:nth-child(4) {  
		left: 0%;
	}
	.portfolio:nth-child(4):hover, .portfolio1:nth-child(4):hover {  
		-webkit-transform: rotate(-2deg);
		-moz-transform: rotate(-2deg);
		transform: rotate(-2deg);
		left: 0%;
	}

	.portfolio:nth-child(5), .portfolio1:nth-child(5) {  
		left: 0%;
	}
	.portfolio:nth-child(5):hover, .portfolio1:nth-child(5):hover {  
		-webkit-transform: rotate(-2deg);
		-moz-transform: rotate(-2deg);
		transform: rotate(-2deg);
		left: 0%;
	}
}