html {
	height: 100%;
}

body {
	height: 100%;
	background: #161616;
	color: #ffffff;
	margin: 0;
	font-family: sans-serif;
}

.home-content {
	display: none;
}

.conditions-background {
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	position: fixed;
	display: block; 
	z-index: 99; 
	background-color: #000;
	background-image: url(../media/background_1.png);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	padding: 100px;
	box-sizing: border-box;
}

	.conditions {
		padding: 100px;
	  display: block;
	  width: 90%;
	  max-width: 1200px;
	  background-color: rgba(0,0,0,0.7);
	  border: solid 1px #ccc;
	  box-sizing: border-box;
	  margin: auto;
	  z-index: 100;
	  position: relative;
	  margin: 50px auto;
	  text-align: center;
	}
	
		.conditions h2 {
			font-size: 1.8rem;
			text-align: center;
			text-transform: uppercase;
		}


.bg-video {
  position: absolute;
  z-index: 10;
  min-width: 100%;
  min-height: 100%;
  overflow: hidden;
}

	.banner-logo {
		position: absolute;
	  z-index: 40;
	  margin-left: auto;
	  margin-right: auto;
	  margin-top: 30vh;
	  text-align: center;
	  width: 100%;
	}

	.banner-logo h1 {
		max-width: 600px;
		margin-top: 2em;
		margin-left: auto;
		margin-right: auto;
		font-size: 2rem;
	}


	.banner .banner-inner {
		align-items: center;
		width: 700px;
		margin-left: auto;
		margin-right: auto;
		position: relative;
		z-index: 2;
	}

	.banner .banner-inner h1 {
		font-size: 4rem;
	}

	.banner .banner-inner p {
		font-size: 1.5rem;
	}

		@media only screen and (max-width: 800px) {
			.banner-logo h1 {
				font-size: 2rem;
			}
		}

a.btn {
	padding: 0.5rem 2rem;
	border-radius: 1rem;
	color: #efe5db;
  	background-color: #3c5dc0;
  	transition: background-color .25s;
}

	a.btn:hover {
		background-color: #243b7e;
		cursor: pointer;
	}






	.button {
	  border-radius: 20px;
	  color: #333;
	  font-weight: bold;
	  padding: 10px 20px;
	  text-decoration: none;
	  transition: all 100ms ease-in-out;
	}

		.button:hover {
		  background-color: #e6e6e6;
		}

		.button:not(:first-of-type) {
		  margin-left: 15px;
		}

		.button.bg-blue {
		  background-color: #243b7e;
		  color: #ddd;
		}

		.button.bg-blue:hover {
		  background-color: #3c5dc0;
		  color: #fff;
		}

		.button-arrow .arrow-icon {
		  overflow: visible;
		  margin-left: 3px;
		  width: 8px;
		}

		.button-arrow .arrow-head {
		  transform: translateX(0);
		  transition: transform 100ms ease-in-out;
		}

		.button-arrow .arrow-body {
		  opacity: 0;
		  transform: scaleX(1);
		  transition: transform 100ms ease-in-out, opacity 100ms ease-in-out;
		}

		.button-arrow:hover .arrow-head {
		  transform: translateX(3px);
		}

		.button-arrow:hover .arrow-body {
		  opacity: 1;
		  transform: scaleX(2);
		}



#product .product.content-wrapper {
	margin-top: 10vh;
}




.banner {
  position: relative;
  min-height: 100vh;
  padding-right: 20%;
  padding-left: 20%;
  text-align: center;
  display: block;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  display: flex;
  align-items: center;
  background-image: url(../media/background_1.png);
}

	.banner.curved::after {
		content: "";
		position: absolute;
		height: 0px;
		bottom: 0;
		left: 0;
		right: 0;
		background-image: url(../media/banner-bottom-curve-bg.png);
		background-position: center bottom;
		background-repeat: no-repeat;
		background-size: 100vw 50px;
		z-index: 1;
		transition: height 0.6s linear;
	}

		.banner.curved.animate-banner::after {
			height: 50px;
		}

		.banner.curved h1 {
			margin-top: 20px;
			margin-bottom: 10px;
		}

		.banner.curved p {
			margin-top: 0;
			margin-bottom: 30px;
		}

		.banner.curved hr {
			display: block;
		  height: 1px;
		  border: 0;
		  border-top: 1px solid #fff;
		  background-color: #fff;
		  -webkit-transition: width 1s ease-out; /* For Safari 3.1 to 6.0 */
    	transition: width 0.6s  ease-out;
    	width : 0%;
		}

			.banner.curved.animate-banner hr {
				width: 100px;
			}





	.affiliate .banner {
		background-image: url(../media/background_1.png);
	}

	.cart .banner {
		background-image: url(../media/background_2.png);
	}

	.contact .banner {
		background-image: url(../media/background_3.png);
	}

	.faq .banner {
		background-image: url(../media/background_1.png);
	}

	.product .banner {
		background-image: url(../media/background_2.png);
	}

	.shop .banner {
		background-image: url(../media/background_3.png);
	}


	.triggers {
		display: block;
		height: 10px;
	}



		.content-slide {
			position: relative;
			min-height: 50vh;
			padding-top: 10vh;
			padding-bottom: 40vh;
			width: 35%;
			margin-left: 5%;
			display: block;
		}

			.relative .content-slide {
				height: 0;
				min-height: 0;
				overflow: hidden;
			}



	.slideshow {
		position: fixed;
		top: 0;
		height: 100vh;
		width: 100%;
		overflow: hidden;
	}

		.relative .slideshow {
			position: relative;
		}

		.slideshow--slide {
			position: absolute;
			top: 0;
			right: 0;
			left: 0;
			width: 100%;
			height: 150vh;
			overflow:hidden;
			transition: top 1.2s;	
		}

			.slideshow--slide.upwards {
				top: -150vh;
			}

			.slideshow--slide.showing {
				top: 0;	
			}






		.slideshow--slide .slide-inner {
			position: absolute;
			right: 0;
			left: 0;
			width: 100%;
			height: 100vh;
			background-position: center;
			background-size: cover;
			background-repeat: no-repeat;
			opacity: 0;
			transform: scale(1.5);
			transition: opacity 1s, transform 1.3s;
		}

			.slideshow--slide.showing .slide-inner {
				opacity: 1;
				transform: scale(1.0);
			}





			.slideshow--slide.slide-1 .slide-inner  {
				z-index: 20;
			}

			.slideshow--slide.slide-1 .slideshow-overlay  {
				z-index: 19;
			}



			.slideshow--slide.slide-2 .slide-inner  {
				background-image: url("../media/background_1.png");
				z-index: 15;
			}

			.slideshow--slide.slide-2 .slideshow-overlay  {
				z-index: 14;
			}



			.slideshow--slide.slide-3 .slide-inner  {
				background-image: url("../media/background_2.png");
				z-index: 10;
			}


			.slideshow--slide.slide-3 .slideshow-overlay  {
				z-index: 9;
			}



			.slideshow--slide.slide-4 .slide-inner  {
				background-image: url("../media/background_3.png");
				z-index: 5;
			}


			.slideshow--slide.slide-4 .slideshow-overlay  {
				z-index: 4;
			}




		.slideshow-overlay {
			position: absolute;
			top: 0;
			right: 0;
			bottom: 0;
			left: 0;
			height: 130vh;
			background-image: url("../media/slide-bg.png");
			background-position: bottom center;
			background-size: cover;
			background-repeat: no-repeat;
		}






















.site-banner.site-banner--home {
  background-image: url('../media/bgpreload6.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center bottom;
  background-color: black;
  height: 100vh;
  width: 100vw;
  position: relative;
  top: 0;
  margin: 0;
  z-index: 0;
  overflow: hidden;
}

  .planet-container {
    position: relative;
    height: 1200px;
    width: 1200px;
    top: 10vh;
    left: 0; 
    right: 0; 
    margin-left: auto; 
    margin-right: auto; 
  }

    .planet-container .halo {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      z-index: 4;
      background-image: url("../media/css_globe_halo12.png");
      background-size: 1200px 1200px;
    }



    .planet-container .night {
      position: absolute;
      top: 159.5px;
      right: 159.5px;
      bottom: 159.5px;
      left: 159.5px;
      z-index: 3;
      width: 881px;
      height: 881px;
      background-image: url("../media/2k_earth_nightmap.jpg");
      background-size: 881px 881px;
      border-radius: 50%;
      animation: rotate-night 240s linear infinite;
      background-size: 200%;
    }


      @keyframes rotate-night {
          0% { 
            background-position: calc(120% + 120px) 0; 
          }
          100% { 
            background-position: calc(-80% + 120px) 0; 
          }
      }


    	.planet-container img {
      		display: block;
		 	text-align: center;
		 	margin-left: auto;
			margin-right: auto;
			position: relative;
		 	z-index: 5;
		  	top: 50vh;
		  	opacity: 0;
		  	transition: opacity 0.6s, top 0.6s;
		  	transition-delay: 0.3s;
      	}

      		.loaded .planet-container img {
      			top: 30vh;
		  		opacity: 1;
      		}








	.slide-page-content {
		position: relative;
		top: 0;
		z-index: 25;
		display: block;
		color: #fff;
		min-height: 100vh;
		width: 100%;
	}

		.slide-page-content-wrap {
			width: 90%;
			margin-right: auto;
			margin-left: auto;
			display: block;
		}

		.site-banner--home h1 {
  			font-weight: 900;
 			text-align: center;
 			margin-bottom: 50vh;
 			margin-top: 30vh;
 			position: absolute;
  			top: 30px;
  			z-index: 6;
  			width: 100%;
  			text-align: center;
		}

			.slide-changer {
				
			}

				.slide-changer:first-of-type {
					
				}

				.slide-changer p {
					padding-bottom: 60vh;
				}

					.slideshow-relative .slide-changer p {
						padding-bottom: 0;
					}




		.fade-blur-in {
  			transform: scale(0.8);
  			filter: blur(4px);
  			opacity: 0;
		}

		.fade-blur-in.in {
			animation-name: fadeBlurIn;
  			animation-duration: 1s;
  			animation-fill-mode: forwards;
		}

			@keyframes fadeBlurIn {
  				from {
  					transform: scale(0.8);
  					filter: blur(4px);
  					opacity: 0;
  				}
  				to {
  					transform: scale(1);
  					filter: blur(0px);
  					opacity: 1;
  				}
			}




	h2 {
		font-size: 1.4rem;
	}

	p {
		font-size: 1rem;
		font-weight: 400;
	}

		p.larger {
			font-size: 1.3rem;
			line-height: 1.8rem;
		}

		p.extra-large {
			font-size: 3rem;
		}


	.trigger {
		height: 20px;
		width: 20px;
		display: block;
		background-color: red;
	}





	.opacity-trigger {
		height: 20px;
		width: 20px;
		display: block;
		background-color: yellow;
	}





	.call-to-action {
		display: block;
		width: 100%;
		min-height: 100vh;
		background-image: url("../media/cycle.png");
		background-size: cover;
		background-repeat: no-repeat;
		background-position: left center;
		text-align: center;
		display: flex;
		flex-direction: column;
  	align-items: center;
  	justify-content: center;
  	margin-top: 10vh;
	}

		.call-to-action p {
			max-width: 800px;
			margin-left: auto;
			margin-right: auto;
		}





	.footer {

	}

		.footer-inner {
			width: 80%;
			margin-top: 10rem;
			margin-right: auto;
			margin-bottom: 10rem;
			margin-left: auto;
			display: flex;
			flex-direction: row;
			color: #e2d5c6;
		}

			.footer-inner div {
				flex-grow: 1;
				width: 25%;
			}


			@media only screen and (max-width: 800px) {
				.footer-inner {
					flex-direction: column;
				}

				.footer-inner div {
					padding: 1em;
					width: 100%;
				}
			}


				.footer-inner ul {
					margin-top: 0;
					margin-bottom: 0;
					padding-left: 0;
					list-style: none;
				}

					.footer-inner ul a {
						color: #e2d5c6;
						text-decoration: none;
						font-weight: 400;
						margin-bottom: 0.5rem;
						display: block;
					}

						.footer-inner ul a:hover,
						.footer-inner ul a.current-page {
							color: #ffffff;
							font-weight: 500;
							text-decoration: underline;
						}


			.footer-inner .logo img {
				height: 100px;
				max-width: 100%;
			}

		.footer-copyright {
			width: 80%;
			text-align: center;
			margin-top: 0;
			margin-right: auto;
			margin-bottom: 2rem;
			margin-left: auto;
			color: #e2d5c6;
		}



/* Times Square */

  .marquee {
    background-color: #3c5dc0;
    overflow: hidden;
    position: relative;
    bottom: 0;
    z-index: 15;
    height: 50px;
    width: 100%;
    white-space: nowrap;
  }

    .marquee p {
      position: absolute;
      width: auto;
      height: 100%;
      margin: 0;
      line-height: 50px;
      text-align: center;
      font-weight: normal;
      transform: translateX(100%);
      animation: scroll-left 30s linear infinite;
    }

    .marquee p a {
    	color: #fff;
    	font-weight: bold;
    }

    .marquee p span {
    	color: #fff;
    	font-weight: bold;
    }

    @keyframes scroll-left {
      0% {
    	  transform: translateX(100%);
      }

      100% {
        transform: translateX(-100%);
      }
    }





	.content-wrapper {
		width: 80%;
		margin: 0 auto;
	}






		.main-content {
			width: 100%;
			max-width: 1200px;
			margin-left: auto;
			margin-right: auto;
			margin-top: 50px;
			margin-bottom: 50px;
		}




			.row.flex {
				display: flex;
				flex-direction: row;
				align-items: center;
				justify-content: center;
				box-sizing: content-box;
				gap: 1rem;
			}

				.row.flex > div {
					margin-top: 50px;
					margin-bottom: 50px;
				}

					.row.flex > div.thirty-percent {
						width: 30%;
					}

					.row.flex > div.forty-percent {
						width: 40%;
					}

					.row.flex > div.sixty-percent {
						width: 60%;
					}


					.row.flex > div.top-content {
						align-items: start;
					}


					.row.flex > div:nth-of-type(even) {
						flex-direction: row-reverse;
					}

					.row.flex.no-row-reverse > div:nth-of-type(even) {
						flex-direction: row;
					}

					.row.flex > div > div {
						box-sizing: border-box;
						padding: 1rem;
						width: 50%;
					}

					.row.flex img {
						margin-left: auto;
						margin-right: auto;
						max-width: 100%;
					}

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

						.row.flex > div:nth-of-type(even),
						.row.flex > div {
							flex-direction: column;
						}

						.row.flex > div > div {
							width: 100%;
						}

					}



				.row.inline-grid {
					display: grid;
					grid-template-columns: repeat(3, 1fr);
					grid-gap: 3rem;
					padding: 5rem 0;
				}






/* Cards */


		.card {
			text-align: center;
		}

			.card .card-header {
				border-radius: 50%;
			  padding: 1rem;
			  width: 75px;
			  height: 75px;
			  background-color: #fff;
			  margin-left: auto;
				margin-right: auto;
				position: relative;
				z-index: 2;
			}

				.card .card-header img {
					max-width: 94%;
				}

			

			.card-body {
				padding-bottom: 7rem;
				
			}

				.card:hover .card-body {
					
				}

				.card-body h3 {
					
				}

				.card-body p {

				}






			.card-footer {
				position: absolute;
				bottom: 0;
				right: 0;
				left: 0;
				padding-top: 1rem;
				padding-bottom: 2rem;
			}

				.card-footer .button {
				  display: inline-block;
				  margin-bottom: 1rem;
				}


			.card ul {
				list-style: none;
				padding-left: 0;
				margin-top: 1rem;
			}





	/* Card Variations */

		/* Stage Cards */
			.card.stage-card {
				text-align: center;
				background: rgb(36,59,126);
				background: -moz-linear-gradient(90deg, rgba(36,59,126,1) 0%, rgba(60,93,192,1) 100%);
				background: -webkit-linear-gradient(90deg, rgba(36,59,126,1) 0%, rgba(60,93,192,1) 100%);
				background: linear-gradient(90deg, rgba(36,59,126,1) 0%, rgba(60,93,192,1) 100%);
				filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#243b7e",endColorstr="#3c5dc0",GradientType=1);
				border-radius: 0.5rem;
				flex-grow: 0;
				position: relative;
				border: solid 2px #3c5dc0;
			}

				.card.stage-card .button {
					background-color: #dddddd;
					color: #243b7e;
				}

				.card.stage-card .button:hover {
					background-color: #ffffff;
					color: #3c5dc0;
				}


				.card.stage-card.recommended {
					scale: 1.1;
					background: rgb(204,204,204);
					background: -moz-linear-gradient(90deg, rgba(204,204,204,1) 0%, rgba(255,255,255,1) 100%);
					background: -webkit-linear-gradient(90deg, rgba(204,204,204,1) 0%, rgba(255,255,255,1) 100%);
					background: linear-gradient(90deg, rgba(204,204,204,1) 0%, rgba(255,255,255,1) 100%);
					filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#cccccc",endColorstr="#ffffff",GradientType=1); 
					color: #243b7e;
					border: solid 2px #fff;
				}

				.card.stage-card.recommended .button {
					background-color: #243b7e;
					color: #dddddd;
				}

				.card.stage-card.recommended .button:hover {
					background-color: #3c5dc0;
					color: #ffffff;
				}


				.card.stage-card span.price {
					display: block;
					font-size: 2rem;
				}

					.card.stage-card span.price span.smaller {
						font-size: 1.4rem;
					}

				.card.stage-card span.recommended {
					display: block;
					font-size: 1.5rem;
					text-transform: uppercase;
					background-color: seagreen;
					color: #fff;
					margin-top: 0.5rem;
					margin-bottom: 0.5rem;
					padding-top: 0.25rem;
					padding-bottom: 0.25rem;
				}


		/*  Affiliate Cards */

			.affiliate-card .card-body {
				border-radius: 0.5rem;
				border: 2px solid #455dc0;
				position: relative;
				top: -60px;
				padding: 60px 1rem 80px 1rem;
				z-index: 1;
				background-color: #161616;
				min-height: 300px;
			}

				.affiliate-card .card:hover .card-body {
					border: 2px solid #4971e8;
					background-color: #191919;
				}

					.affiliate-card .card-body h3 {
						min-height: 50px;
					}

					.affiliate-card .card-body p {

					}


		/* Card Hover Background */

			.card.card-hover-bg:hover::before {
				-webkit-box-shadow:0px 0px 175px 115px rgba(78,0,194,0.9);
				-moz-box-shadow: 0px 0px 175px 115px rgba(78,0,194,0.9);
				box-shadow: 0px 0px 175px 115px rgba(78,0,194,0.9);
				content: "";
				position: relative;
				top: 150px;
			}

			.card.card-hover-bg:hover::after {
				-webkit-box-shadow:0px 0px 175px 115px rgba(60,101,227,0.9);
				-moz-box-shadow: 0px 0px 175px 115px rgba(60,101,227,0.9);
				box-shadow: 0px 0px 175px 115px rgba(60,101,227,0.9);
				content: "";
				position: relative;
				top: -200px;
			}





	/* Cryptobubbles */

		#cryptobubbles .main-content {
			max-width: 1500px;
		}

		#filters {
			display: none;
		}

		text {
			-webkit-touch-callout: none;
		  -webkit-user-select: none;
		  fill: white;
		  text-shadow: -0.5px -0.5px 0 black, 0.5px -0.5px 0 black, -0.5px 0.5px 0 black, 0.5px 0.5px 0 black;
		  font-weight: 700;
		  font-style: italic;
		}



header {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 30;
  display: inline-flex;
  transition: top 0.6s;
  transition-delay: 0s;
  transition-delay: 0.5s;
}

	.home header,
	.has-slideshow header {
		top: -60px;
	}

	.loaded header {
	  top: 0;
	}

	header .content-wrapper {
		display: flex;
		width: 100%;
	}

	header a {
		color: #ffffff;
		padding: 0.5rem;
		text-decoration: none;
	}

		header a.logo img {
			margin-top: 0.5rem;
			height: 30px;
		}


	header h1 {
		display: flex;
		flex-grow: 1;
		flex-basis: 0;
		font-size: 20px;
		margin: 0;
		padding: 24px 0;
	}


.hamburger {
  padding: 15px 15px;
  display: inline-block;
  cursor: pointer;
  transition-property: opacity, filter;
  transition-duration: 0.15s;
  transition-timing-function: linear;
  font: inherit;
  color: inherit;
  text-transform: none;
  background-color: transparent;
  border: 0;
  margin: 0;
  overflow: visible; 
}

  .hamburger:hover {
    opacity: 0.7; 
  }

	  .hamburger.is-active:hover {
	    opacity: 0.7; 
	  }

	  .hamburger.is-active .hamburger-inner,
	  .hamburger.is-active .hamburger-inner::before,
	  .hamburger.is-active .hamburger-inner::after {
	    background-color: #fff; 
	  }

		.hamburger-box {
		  width: 40px;
		  height: 24px;
		  display: inline-block;
		  position: relative; }

		.hamburger-inner {
		  display: block;
		  top: 50%;
		  margin-top: -2px; 
		}
		
		  .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
		    width: 40px;
		    height: 4px;
		    background-color: #fff;
		    border-radius: 4px;
		    position: absolute;
		    transition-property: transform;
		    transition-duration: 0.15s;
		    transition-timing-function: ease; 
		  }
		  
		  .hamburger-inner::before, .hamburger-inner::after {
		    content: "";
		    display: block; 
		  }

		  .hamburger-inner::before {
		    top: -10px; 
		  }
		  
		  .hamburger-inner::after {
		    bottom: -10px; 
		  }


		  .hamburger--spin .hamburger-inner {
		    transition-duration: 0.22s;
		    transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); 
		  }
		    .hamburger--spin .hamburger-inner::before {
		      transition: top 0.1s 0.25s ease-in, opacity 0.1s ease-in; 
		    }
		  
		    .hamburger--spin .hamburger-inner::after {
		      transition: bottom 0.1s 0.25s ease-in, transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19); 
		    }

		  .hamburger--spin.is-active .hamburger-inner {
		    transform: rotate(225deg);
		    transition-delay: 0.12s;
		    transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); 
		  }

		    .hamburger--spin.is-active .hamburger-inner::before {
		      top: 0;
		      opacity: 0;
		      transition: top 0.1s ease-out, opacity 0.1s 0.12s ease-out; 
		    }

		    .hamburger--spin.is-active .hamburger-inner::after {
		      bottom: 0;
		      transform: rotate(-90deg);
		      transition: bottom 0.1s ease-out, transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
       }




	nav.main-nav {
		position: fixed;
		top: 0;
		right: -500px;
		bottom: 0;
		left: auto;
		width: 500px;
		background-color: #000;
		z-index: 14;
		overflow-x: hidden;
  	transition: 0.5s;
	}

		nav.main-nav.show-nav {
			right: 0px;
		}

		nav.main-nav ul {
			margin: 20px 0 0;
			padding: 0;
		}

			nav.main-nav ul:first-of-type {
				margin: 80px 0 0;
			}

			nav.main-nav ul li {
				width: 100%;
				list-style: none;
			}

				nav.main-nav a {
					text-decoration: none;
					color: #fff;
					padding: 10px 20px;
					text-transform: uppercase;
					display: block;
					font-size: 1.2rem;
				}









	main .featured {
		display: flex;
		flex-direction: column;
		background-image: url(imgs/featured-image.jpg);
		background-repeat: no-repeat;
		background-size: cover;
		height: 500px;
		align-items: center;
		justify-content: center;
		text-align: center;
	}

	main .featured h2 {
		display: inline-block;
		margin: 0;
		width: 1050px;
		font-family: Rockwell, Courier Bold, Courier, Georgia, Times, Times New Roman, serif;
		font-size: 68px;
		color: #FFFFFF;
		padding-bottom: 10px;
	}

	main .featured p {
		display: inline-block;
		margin: 0;
		width: 1050px;
		font-size: 24px;
		color: #FFFFFF;
	}

	main .recentlyadded h2 {
		display: block;
		font-weight: normal;
		margin: 0;
		padding: 40px 0;
		font-size: 24px;
		text-align: center;
		width: 100%;
		border-bottom: 1px solid #EEEEEE;
	}

	main .recentlyadded .products, main .products .products-wrapper {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: space-between;
		padding: 40px 0 0 0;
	}

	main .recentlyadded .products .product, 
	main .products .products-wrapper .product {
		display: block;
		overflow: hidden;
		text-decoration: none;
		width: 25%;
		padding-top: 60px;
		padding-bottom: 60px;
		box-sizing: border-box;
	}

	main .recentlyadded .products .product img, main .products .products-wrapper .product img {
		transform: scale(1);
		transition: transform 1s;
		max-width: 100%;
		height: auto;
	}

	main .recentlyadded .products .product .name, main .products .products-wrapper .product .name {
		display: block;
		color: #555555;
		padding: 20px 0 2px 0;
	}

	main .recentlyadded .products .product .price, main .products .products-wrapper .product .price {
		display: block;
		color: #999999;
	}

	main .recentlyadded .products .product .rrp, main .products .products-wrapper .product .rrp {
		color: #BBBBBB;
		text-decoration: line-through;
	}

	main .recentlyadded .products .product:hover img, main .products .products-wrapper .product:hover img {
		transform: scale(1.05);
		transition: transform 1s;
	}

	main .recentlyadded .products .product:hover .name, main .products .products-wrapper .product:hover .name {
		text-decoration: underline;
	}

	main > .product {
		display: flex;
		padding: 40px 0;
	}

	main > .product > div {
		padding-left: 15px;
	}

	main > .product h1 {
		font-size: 34px;
		font-weight: normal;
		margin: 0;
		padding: 20px 0 10px 0;
	}

	main > .product .price {
		display: block;
		font-size: 22px;
		color: #999999;
	}

	main > .product .rrp {
		color: #BBBBBB;
		text-decoration: line-through;
		font-size: 22px;
		padding-left: 5px;
	}

	main > .product form {
		display: flex;
		flex-flow: column;
		margin: 40px 0;
	}

	main > .product form input[type="number"] {
		width: 400px;
		padding: 10px;
		margin-bottom: 15px;
		border: 1px solid #ccc;
		color: #555555;
		border-radius: 5px;
	}

	main > .product form input[type="submit"] {
		background: #4e5c70;
		border: 0;
		color: #FFFFFF;
		width: 400px;
		padding: 12px 0;
		text-transform: uppercase;
		font-size: 14px;
		font-weight: bold;
		border-radius: 5px;
		cursor: pointer;
	}

	main > .product form input[type="submit"]:hover {
		background: #434f61;
	}

	a.product {
		padding: 3em;
	}

	.product-image-wrap {
		background-color: #cccccc;
		border: border: 1px solid #cccccc;
		border-radius: 2rem;
		overflow: hidden;
	}

		.product-image-wrap img {
			display: block;
			margin-left: auto;
			margin-right: auto;
		}

	main > .products h1 {
		display: block;
		font-weight: normal;
		margin: 0;
		padding: 40px 0;
		font-size: 24px;
		text-align: center;
		width: 100%;
	}

	main > .products .buttons {
		text-align: right;
		padding-bottom: 40px;
	}

	main > .products .buttons a {
		display: inline-block;
		text-decoration: none;
		margin-left: 5px;
		padding: 12px 20px;
		border: 0;
		background: #4e5c70;
		color: #FFFFFF;
		font-size: 14px;
		font-weight: bold;
		border-radius: 5px;



		display: none;


	}

	main > .products .buttons a:hover {
		background: #434f61;
	}

	main .cart h1 {
		display: block;
		font-weight: normal;
		margin: 0;
		padding: 40px 0;
		font-size: 24px;
		text-align: center;
		width: 100%;
	}

	main .cart table {
		width: 100%;
	}

	main .cart table thead td {
		padding: 30px 0;
		border-bottom: 1px solid #EEEEEE;
	}

	main .cart table thead td:last-child {
		text-align: right;
	}

	main .cart table tbody td {
		padding: 20px 0;
		border-bottom: 1px solid #EEEEEE;
	}

	main .cart table tbody td:last-child {
		text-align: right;
	}

	main .cart table .img {
		width: 80px;
	}

	main .cart table .remove {
		color: #777777;
		font-size: 12px;
		padding-top: 3px;
	}

	main .cart table .remove:hover {
		text-decoration: underline;
	}

	main .cart table .price {
		color: #999999;
	}

	main .cart table a {
		text-decoration: none;
		color: #555555;
	}

	main .cart table input[type="number"] {
		width: 68px;
		padding: 10px;
		border: 1px solid #ccc;
		color: #555555;
		border-radius: 5px;
	}

	main .cart .subtotal {
		text-align: right;
		padding: 40px 0;
	}

	main .cart .subtotal .text {
		padding-right: 40px;
		font-size: 18px;
	}

	main .cart .subtotal .price {
		font-size: 18px;
		color: #999999;
	}

	main .cart .buttons {
		text-align: right;
		padding-bottom: 40px;
	}

	main .cart .buttons input[type="submit"] {
		margin-left: 5px;
		padding: 12px 20px;
		border: 0;
		background: #4e5c70;
		color: #FFFFFF;
		font-size: 14px;
		font-weight: bold;
		cursor: pointer;
		border-radius: 5px;
	}

	main .cart .buttons input[type="submit"]:hover {
		background: #434f61;
	}

	main .placeorder h1 {
		display: block;
		font-weight: normal;
		margin: 0;
		padding: 40px 0;
		font-size: 24px;
		text-align: center;
		width: 100%;
	}

	main .placeorder p {
		text-align: center;
	}

	footer {
		position: absolute;
		bottom: 0;
		border-top: 1px solid #EEEEEE;
		padding: 20px 0;
		width: 100%;
	}

	.paypal {
		text-align: right;
		padding-bottom: 40px;
	}

	.paypal button {
		display: inline-block;
		padding: 10px 20px 7px 20px;
		background-color: #FFC439;
		border-radius: 5px;
		border: none;
		cursor: pointer;
		width: 215px;
	}

	.paypal button:hover {
		background-color: #f3bb37;
	}







	.collapsible {
	  background-color: #333;
	  color: white;
	  cursor: pointer;
	  padding: 18px;
	  width: 100%;
	  border: none;
	  text-align: left;
	  outline: none;
	  font-size: 15px;
	  margin-bottom: 1rem;
	}

		.collapsible:first-of-type {
			margin-top: 3rem;
		}

	.active, .collapsible:hover {
	  background-color: #555;
	}

	.collapsible-content {
	  padding: 0 18px;
	  display: none;
	  overflow: hidden;
	  margin-bottom: 1rem;
	}



/* Logo Slider */

.slider	img {
  width: 100px;
  height: 100px;
  animation: scroll 30s linear infinite;
}

	.slide-track {
	  width: 80%;
	  margin-left: auto;
	  margin-right: auto;
	  display: flex;
	  gap: 3em;
	  overflow: hidden;
	}

	.slider {
	  background-color: #000;
	  padding: 8em 2em;
	}

	@keyframes scroll {
	  0% {transform: translateX(0);}
	  100% {transform: translatex(-1000%)}
	}



/* Form */

	.form-row {
		width: 90%;
		margin-left: auto;
		margin-right: auto;
		display: block;
		margin-bottom: 3em;
		box-sizing: content-box;
	}

	.form-row > * {
		-ms-box-sizing:content-box;
		-moz-box-sizing:content-box;
		-webkit-box-sizing:content-box; 
		box-sizing:content-box;
	}


		.form-row p {
			font-size: 0.8rem;

		}

	label {
		display: block;
		margin-bottom: 0.5rem;
	}

	input {
		width: 100%;
		padding: 0.5rem;
		max-width: 100%;
	}

	textarea {
		width: 100%;
		height: 100px;
		padding: 0.5rem;
	}

	select {
		width: 100%;
		padding: 0.5rem;
		display: block;
  	border-radius: 0;
  	border: 0;
	}

	input[type="submit"]{
		background-color: #3c5dc0;
		border: solid 1px #3c5dc0;
  	color: #fff;
	  border-radius: 20px;
  	font-weight: bold;
  	padding: 10px 20px;
  	text-decoration: none;
  	transition: all 100ms ease-in-out;
	}

		input[type="submit"]:hover {
			background-color: #243b7e;
		}