
body {
	background: #130D33;
	font-family: -apple-system, BlinkMacSystemFont, "Roboto", arial, sans-serif;
    margin: 0;
    padding: 0;
}

.page-background {
	top: 30px;
	background-image: url("head-menu-h.png"),
					  url("menu-close-h.png"),
					  url("head-menu-h-dark.png"),
					  url("menu-close-h-dark.png"),
					  url("hero-discover-h.png"),
					  url("hero-learn-h.png"),
					  url("hero-download-h.png");
}

.page-background {
	position: fixed;
	z-index: -1;
	width: 100vw;
	height: 100vh;
	background-image: url("bg-dot.png"),
					  linear-gradient(131deg, rgba(0,50,131,0.00) 48%, #003283 99%),
					  linear-gradient(121deg, #391B5F 0%, rgba(57,27,95,0.00) 50%);
	background-size: 20px 20px,
					 cover,
					 cover;
	background-color: #0D042A;
}



/* Header */

	/* Menu button */

		#menu-button {
			display: inline-block;
			position: relative;
			right: 0;
			transform: translateY(-3px);
			width: 28px;
			height: 28px;
			margin-left: 20px !important;
			background: url("head-menu.png") no-repeat;
    			background-size: 28px;
			transition: all .15s ease-in-out;
			vertical-align: middle;
		}

			#menu-button:hover {
				width: 28px;
				height: 28px;
				background: url("head-menu-h.png") no-repeat;
	    		background-size: 28px;
			}

/* End Header*/


/* Menu responsive */

		@media (max-width: 1140px) and (min-width: 1020px) {
				
			.modal-close {
			  display: block;
			  position: fixed;
		  	  left: 465px;
			}
	
		}

		@media (max-width: 1020px) and (min-width: 830px) {
				
			.modal-close {
			  display: block;
			  position: fixed;
			  left: unset !important;
			  right: 25px;
			}
			
			#lizard {
				margin-left: 25px;
			}

		}

		@media (max-width: 830px) and (min-width: 601px) {

			#menu-panel-container {
				width: 75% !important;
				height: 100vh;
				margin: 0;
				position: fixed;
		    }
				
			.modal-close {
			  display: block;
			  position: fixed;
			  left: unset !important;
			  right: 60px;
			}
			
			#lizard {
				margin-left: 25px;
			}

		}
		
		@media (max-width: 600px) and (min-width: 400px) {

			#menu-panel-container {
				width: 90% !important;
				height: 100vh;
				margin: 0;
				position: fixed;
		    }
				
			.modal-close {
			  display: block;
			  position: fixed;
			  left: unset !important;
			  right: 30px;
			}
			
			#lizard {
				margin-left: 25px;
			}

		}

		@media (max-width: 400px) {

			#menu-panel-container {
				width: 90% !important;
				height: 100vh;
				margin: 0;
				position: fixed;
		    }
				
			.modal-close {
			  display: block;
			  position: fixed;
			  left: unset !important;
			  right: 20px;
			}
			
			#lizard {
				margin-left: 25px;
			}

		}
		
/* End menu responsive */



/* Menu */

	#menu-panel-container {
		width: 50%;
		height: 100vh;
		margin: 0;
		position: fixed;
	    -webkit-backdrop-filter: saturate(280%) blur(40px);
	    backdrop-filter: saturate(180%) blur(30px);
	    background-color: rgba(30, 30, 30, 0.6);
	    background-image: linear-gradient(180deg, #0D042A 0%, rgba(13,4,42,0.00) 8%);
    }

		.overshadow {
			display: block;
			width: 816px;
			height: 100vh;
			position: absolute;
			left: -816px;
			opacity: 0;
			cursor: default;
		}

			.overshadow a {
				color: transparent;
			}

			.modal-window:target .overshadow {
				opacity: 0;
				transition: none;
			}


		#shadow {
			display: block;
			width: 816px;
			height: 100vh;
			position: absolute;
			left: -816px;
			background: url("shadow.png");
				background-size: 816px 110vh;
				background-repeat: no-repeat;
				background-position: right;
			opacity: 0;
			transition: all .3s ease-in-out;
		}

			.modal-window:target #shadow {
				opacity: 1;
				transition: none;
			}

		#shine-outside {
			display: block;
			width: 1px;
			height: 100vh;
			position: absolute;
			top: 0px;
			left: 0px;
			background-image: url("ui/shine-outside.png");
				background-size: 100px 100vh;
				background-repeat: no-repeat;
			opacity: 1;
			transform: translateX(-1px);
		}

		#shine {
			display: block;
			width: 1px;
			height: 100vh;
			position: absolute;
			top: 0px;
			left: 0px;
			background-image: url("shine.png");
				background-size: 1px 100vh;
				background-repeat: no-repeat;
			opacity: .3;
		}

	#menu-panel-container:before {
		display: block;
		position: absolute;
		right: -100px;
		height: 100vh;
		width: 100px;
		content: " ";
	    -webkit-backdrop-filter: saturate(180%) blur(30px);
	    backdrop-filter: saturate(180%) blur(30px);
	    background-color: rgba(0, 0, 0, 0.3);
	}
	
		#menu-iframe {
			width: 100%;
			border: none;
			height: 100vh;
		}
	
	.modal-window {
		z-index: 999;
		opacity: 1;
		pointer-events: none;
		transition: all .15s cubic-bezier(1,-0.01,1,.07);
		top: 0px;
		right: calc(-100%);
	}
	
		.modal-window:target {
			opacity: 1;
			pointer-events: auto;
			transition: all .3s cubic-bezier(0, 1, 0, 1.02);
			right: 0px;
		}
		
			.modal-window:target::after {
				display: block;
				position: absolute;
				content: "";
				background: transparent;
				pointer-events: none;
				opacity: 1;
				height: 100vh;
				width: 100%;
				right: 0;
				box-shadow: -88px 99px 100px 0 rgba(0,0,0,.25);
			}

			.modal-window:target::after {
			}

		.modal-close {
		  display: block;
		  position: absolute;
		  left: 465px;
		  top: 12px;
		  width: 28px;
		  height: 28px;
		  background: url("menu-close-dark.png");
			  background-size: 28px;
			  background-repeat: no-repeat;
		  transition: all .15s ease-in-out;
		  
		}

		.modal-window a {
			color: transparent;
			font-size: 0;
		}
			
	.modal-close:hover {
		  background: url("menu-close-h-dark.png");
			  background-size: 28px;
			  background-repeat: no-repeat;
	}


/* End Menu */




.signature {
	display: inline-block;
	width: 24px;
	height: 19px;
	background-image: url("signature.png");
		background-size: 24px 19px;
		background-repeat: no-repeat;
	margin-top: -2px;
	margin-bottom: -2px;
	margin-left: 7px;
}




.header-content {
	width: 980px;
	margin-left: auto;
	margin-right: auto;
	padding: 0;
	margin-bottom: -40px;
}

	#lizard {
		z-index: 10;
		position: relative;
		top: 6px;
		left: 0px;
		display: block;
	    width: 150px;
	    height: 40px;
		background: url("hectorlizard-logo.png");
			background-size: 150px 40px;
		transition: all .2s ease-in-out;
	}
	
		#lizard:hover {
			opacity: 1 !important;
			background: url("hectorlizard-logo-h.png");
			background-size: 150px 40px;
		}


/* Getting started */ h1 {
	font-weight: 500;
	font-size: 61px;
	line-height: 60px;
	color: white;
	margin: -15px 0 0 0
}

/* Sections */ h2 {
	font-size: 35px;
	font-weight: 500;
	color: white;
	line-height: 30px;
	margin-top: 0px;
}

	.anchor {
	    display: block;
	    position: relative;
	    top: 0px;
	    visibility: hidden;
	}

	.anchor-type-2 {
	    display: block;
	    position: relative;
	    top: -50px;
	    visibility: hidden;
	    margin-bottom: 60px;
	}

/* Sidebar title */ h3 {
	font-size: 26px;
	color: #FFFFFF;
	margin: 0 0 20px 0;
	font-weight: 500;
}

/* Hector Big Picture surtitre */ h4 {
	font-size: 16px;
	color: #9F9FB2;
	font-weight: 500
}

/* Subsections */ h5 {
	font-size: 26px;
	color: #9F9FB2;
	font-weight: 500;
	margin: 25px 0 -5 0
}

/* Localnav title */

	.hide {
	    opacity:0;
	    transition: all .2s ease-in-out
	    /*bottom:-100%;*/
	}
	.show {
	    opacity:1;
	    transition: all .2s ease-in-out
	    /*left:0;*/
	}


label {
	display: block;
	font-size: 14px;
	color: #9F9FB2;
	margin: 0 0 10px 0;
}

p, ol, ul {
	font-weight: 400
	font-size: 17px;
	color: #9F9FB2;
	letter-spacing: .1px;
	line-height: 20px
}

li {
	margin-bottom: 5px
}

a {
	text-decoration: none;
	color: white;
	cursor: pointer;
}

	.sidebar a:hover, p a:hover, ul a:hover, ol a:hover {
		opacity: .8
	}

	.inline-download:after {
		display: inline-block;
		position: relative;
		content: "";
		width: 13px;
		height: 18px;
		background-size: 13px 18px !important;
		background: url(inline-download.png);
		transform: translateY(3px);
		margin: 0 6px;
	}

.intro {
	font-size: 22px;
	font-weight: 500;
	color: #9F9FB2;
	line-height: 25px
}


.inline-code, .block-code {
	font-family: Menlo;
	font-size: 12px;
	color: #B2B2C7;
	background: #4A4A59;
	border-radius: 5px;
	padding: 0 8px 0 8px
}

.inline-code {
	display: inline-block;
	margin: 0 3px 0 2px;
	transform: translateY(-1px);
}

.block-code {
	display: block;
	width: 100%;
	margin: 10px 0 30px 0;
	padding: 20px 20px 8px 20px
}

	.block-code p {
		margin: 0 0 10px 0;
		line-height: 15px
	}

.sidebar .title {
	font-size: 26px;
	color: #FFFFFF;
}

.localnav-download-icon {
	display: inline-block;
	width: 10px;
	height: 13px;
	background: url("localnav-download-icon.png");
	background-color: transparent;
	background-size: 10px 13px;
	transform: translateY(1px);
}

.sidebar-contents-icon {
	display: inline-block;
	width: 29px;
	height: 25px;
	background: url("sidebar-contents-icon.png");
	background-color: transparent;
	background-size: 29px 25px;
	margin-right: 7px;
	transform: translateY(2px);
}

.main-content {
	margin-top: 50px;
	width: 980px;
	margin-left: auto;
	margin-right: auto;
	padding: 0
}

	#sidebar a {
		display: block;
		font-size: 19px;
		color: #FFFFFF;
		text-decoration: none;
		font-weight: 300;
		line-height: 30px;
		margin: -5px -2px;
		transform: translateY(-5px);
		transition: all .15s ease-in-out;
	}

			#sidebar a:hover{
				opacity: .5
			}

		/* Sidebar icons */

			#sidebar a::before {
				display: inline-block;
				position: relative;
				content: "";
				width: 32px;
				height: 32px;
				background-size: 32px 32px !important;
				transform: translateY(8px);
				margin-right: 10px;
			}

				#sidebar a[href="#what-is-this"]::before {
					background: url("sidebar/what-is-this.png");
				}

				#sidebar a[href="#quick-install"]::before {
					background: url("sidebar/quick-install.png");
				}

				#sidebar a[href="#variants"]::before {
					background: url("sidebar/variants.png");
				}

				#sidebar a[href="#uploading-your-images"]::before {
					background: url("sidebar/uploading-your-images.png");
				}

				#sidebar a[href="#blurred-panels"]::before {
					background: url("sidebar/blurred-panels.png");
				}

				#sidebar a[href="#editing-the-css"]::before {
					background: url("sidebar/editing-the-css.png");
				}

				#sidebar a[href="#hector-color-system"]::before {
					background: url("sidebar/hector-color-system.png");
				}

				#sidebar a[href="#user-flair"]::before {
					background: url("sidebar/user-flair.png");
				}

				#sidebar a[href="#link-flair"]::before {
					background: url("sidebar/link-flair.png");
				}

				#sidebar a[href="#text-image-logo"]::before {
					background: url("sidebar/text-image-logo.png");
				}

				#sidebar a[href="#sticky-quick-links"]::before {
					background: url("sidebar/sticky-quick-links.png");
				}	

				#sidebar a[href="#sidebar-hbp"]::before {
					background: url("sidebar/sidebar-hbp.png");
				}	

				#sidebar a[href="#new-reddit"]::before {
					background: url("sidebar/new-reddit.png");
				}



.content {
	margin-left: 300px;
}

.content-full-width {
	margin-left: 0px;
}

	#hero-container {
		right: 0;
		margin-top: 110px;
		margin-bottom: 120px;
	}

		#hero-text-block {
			display: inline-block;
			width: 50vw;
			max-width: 420px;
			height: 345px;
		}

			.hero-logo {
				content:"";
				display: inline-block;
				background: url("hector-big-picture-logo.png");
				width: 400px;
				height: 190px;
				background-size: 400px 190px;
				margin-right: 10px;
				transform: translateY(13px);
			}

			.hero-title {
				font-size: 44px;
				color: #FFFFFF;
				line-height: 47px;
				font-weight: 700;
				text-shadow: 0 0 71px #000000;
			}

			.hero-tagline {
				font-size: 21px;
				color: rgba(255,255,255,1);
				line-height: 30px;
				text-shadow: 0 0 60px #000000;
				position: relative;
				letter-spacing: .4px;
			}

			.hero-links {
				display: block;
				overflow-x: visible;
				width: 60vw;
				max-width: 500px;
			}

				.hero-link {
					display: inline-block;
					font-size: 21px;
					color: #6563FF;
					line-height: 31px;
					text-shadow: 0 0 60px #000000;
					transition: all .2s ease-in-out;
					transform: translate3d(0,0,0);
				}

						.hero-link:hover{
							color: white;
							cursor: pointer;
						}

						.hero-link:active{
							opacity: .5;
							cursor: pointer;
						}

					.hero-link::after {
						content:"";
						display: inline-block;
						width: 33px;
						height: 33px;
						background-size: 33px 33px !important;
						margin-left: 10px;
						transform: translateY(9px);
						margin: 0 32px 0 1px;
						transition: all .2s ease-in-out;
					}

					#discover::after {
						background: url(hero-discover.png);
					}
	
						#discover:hover::after {
							background: url(hero-discover-h.png);
						}

					#learn::after {
						background: url(hero-learn.png);
					}
	
						#learn:hover::after {
							background: url(hero-learn-h.png);
						}

					#download::after {
						background: url(hero-download.png);
					}
	
						#download:hover::after {
							background: url(hero-download-h.png);
						}

		#hero-image-block {
			display: inline-block;
			position: relative;
			right: 0;
			top: 20px;
			width: calc(100% - 425px);
			height: 350px;
			background: no-repeat right url("theme-crop.png");
			background-size: contain;
		}

#after-hero-anchor {
	display: block;
	visibility: hidden;
	position: relative;
	top:-40px;
}


#variant-dark {
	display: block;
	text-align: right;
	width: 100%;
	min-height: 600px;
	margin-top: 70px;
	background: black no-repeat right url("variant-dark.jpg");
	background-size: 980px 600px;
	padding: 50px;
	border-radius: 20px;
	box-shadow: 0 0 0 1px rgba(255,255,255,0.08);
}

	#variant-dark-text-block {
		position: relative;
		width: 290px;
		float: right;
		transform: translateY(11%);
	}

		#variant-dark h2 {
			font-size: 28px;
			color: #63636E;
			font-weight: 500;
			margin-bottom: 6px
		}

		#variant-dark h3 {
			font-size: 61px;
			color: #FFFFFF;
			line-height: 60px;
			margin-bottom: 40px;
		}

		#variant-dark p {
			font-size: 20px;
			color: #63636E;
			letter-spacing: .1px;
			line-height: 24px;
			margin-bottom: -4px
		}

#variant-light {
	display: block;
	text-align: left;
	width: 100%;
	min-height: 600px;
	margin-top: 70px;
	background: black no-repeat left url(variant-light.jpg);
	background-size: 980px 600px;
	padding: 50px;
	border-radius: 20px;
	box-shadow: 0 0 0 1px rgba(255,255,255,0.08);
}

	#variant-light-text-block {
		position: relative;
		width: 290px;
		float: left;
		transform: translateY(18%);
	}

		#variant-light h2 {
			font-size: 28px;
			color: #63636E;
			font-weight: 500;
			margin-bottom: 6px
		}

		#variant-light h3 {
			font-size: 61px;
			color: #FFFFFF;
			line-height: 60px;
			margin-bottom: 40px;
		}

		#variant-light p {
			font-size: 20px;
			color: #63636E;
			letter-spacing: .1px;
			line-height: 24px;
			margin-bottom: -4px;
		}


#installation {
	margin-top: 100px;
}

	#installation h1 {
		font-size: 28px;
		color: #7A79B5;
		text-align: center;
	}

	#installation h2 {
		font-size: 61px;
		color: white;
		text-align: center;
		line-height: 65px;
	}


.clearfix:after{
	display: block;
	content: "";
	clear: both;
}


#what-is-this, #quick-install, #variants, #uploading-your-images {
    padding-top: 100px;
    margin-top: -50px;
}


/* Style from sidebar plugin */

		*,
	*:before,
	*:after{
		box-sizing: border-box;
	}

	.container {
		max-width: 1030px;
		margin: 50px auto;
		padding: 0 25px;
	}

	#content {
		border: none;
		padding: 0;
		margin-left: 350px;
		min-height: none;
	}

	#sidebar {
		float: left;
		width: 300px;
		color: #ffbdbd;
		will-change: min-height;
	}

	#sidebar .sidebar__inner{
		padding: 0;
		position: relative;
		transform: translate(0, 0);
		transform: translate3d(0, 0, 0);
		will-change: position, transform;
	}

	.clearfix:after{
		display: block;
		content: "";
		clear: both;
	}


.content-img {
	margin: 20px 0 8px 0;
	width: 100%
}

.content-img-zoom {
	margin: 20px 0 8px 0;
	width: 100%;
	cursor: zoom-in;
}

.inline-img-gear {
	width: 20px;
	height: 20px;
	background-size: 20px 20px;
	margin: -20px -2px 0 2px;
	transform: translateY(4px);
}

/* 1px separators */

	.separator-container {
			display: block;
			width: 1020px;
			padding: 0 20px;
			margin: 100px auto;
	}

		.separator {
			height: 1px;
			background-color: white;
			opacity: 0.1;
		}

	.separator-in-content-row-container {
		display: block;
		width: 100%;
		margin: 50px auto;
	}

	.separator-on-index-container {
			display: block;
			width: 100%;
			margin: 100px auto;
	}


/* Pre-footer download banner */

	#download-banner-container {
		width: 1020px;
		padding: 0 20px;
		margin: 100px auto;
	}

#download-banner-container .copyright {
	color: white;
	opacity: .3;
	font-weight: 300;
	font-size: 15px;
	margin-top: 100px;
}

	#download-banner-container-index {
		width: 100%;
		padding: 0 0;
		margin: 100px auto;
	}

		#download-banner {
			height:300px;
			padding: 50px;
			position: relative;
			background: black url("download-banner-bg.png") no-repeat left;
			background-size: 169px 300px;
			border-radius: 20px;
			box-shadow: 0 0 0 1px rgba(255,255,255,0.1);
		}

			#download-banner-textarea {
				float: left;
				margin-left: 120px;
				height: 100%;
			}

				#banner-title {
					font-size: 40px;
					color: #FFFFFF;
					letter-spacing: -0.5px;
					font-weight: 500;
					margin-top:70px;
				}

				#banner-subtitle {
					font-size: 18px;
					color: #63636E;
					letter-spacing: -0.2px;
					font-weight: 500;
					margin-top: -20px;
				}

			#download-banner-buttonarea {
				height: 100%;
				float: right;
				padding: 78px 0;
			}

				#big-download-button {
					font-size: 21px;
					color: white;
					text-align: center;
					background: #0071E3;
					border-radius: 9px;
					width: 197px;
					height: 43px;
					line-height: 43px;
					transition: all .2s ease-in-out
				}

					#big-download-button-arrow {
						display: inline-block;
						background-image: url("big-download-button-arrow.png");
						background-size: 18px 23px;
						width: 18px;
						height: 23px;
						margin-left: 6px;
						transform: translateY(4px);
					}

					#big-download-button:hover {
						transform: translateY(-1px);
						background: #007DFC;
						box-shadow: 0 7px 33px -3px #0B6BE6;
					}

					#big-download-button:active {
						transform: translateY(-1px);
						background: #0071E3;
						box-shadow: 0 3px 29px -2px #0B6BE6;
					}


/* Footer */

	footer{
		height: 100px;
		margin-top: 20px;
		text-align: center;
		color: white;
		background: black;
	}

	footer p{
		margin: 0;
	}

	#ac-globalnavfooter .footer-content {
	    margin: 0 auto;
	    max-width: 1020px;
	    padding: 15px 20px;
	    position: relative;
	    z-index: 2;
	}

			@supports (padding: calc(max(0px))) {
			    #ac-globalnavfooter .footer-content {
			    }
			}

			@media only screen and (max-width: 767px) {
			    #ac-globalnavfooter .footer-content {
			        padding: 0;
			        position: absolute;
			        top: 0;
			        width: 100%;
			        height:100%
			    }
			}

		.footer-hector-global {
			font-family: font-family: -apple-system, BlinkMacSystemFont, "Roboto", arial, sans-serif !important;
			font-size: 13px !important;
			display: inline !important;
		}

			.footer-menu-container {
				float: right;
				transform: translateY(-7px) !important;
			}

				.footer-content #footer-copyright {
					font-family: font-family: -apple-system, BlinkMacSystemFont, "Roboto", arial, sans-serif !important;
					font-size: 13px !important;
					display: inline !important;
					position: relative !important;
					left: 0 !important;	
					text-align: left !important;
					float: left !important;
					margin: 0 !important;
					padding: 0 !important;
					margin-left: 0 !important;
					padding-left: 0 !important;
					color: white;
					opacity: .5;
				}

				.footer-menu {
					font-family: font-family: -apple-system, BlinkMacSystemFont, "Roboto", arial, sans-serif !important;
					font-size: 13px !important;
					display: inline !important;
				}

					.footer-menu li {
						margin: 0 0 0 30px !important;
					}

					    .footer-content .footer-menu-container .footer-menu a {
					    	opacity: .5;
					    }

							.footer-content .footer-menu-container .footer-menu a:hover {
								opacity: 1;
							}

							.footer-white {
								color: white !important;
								font-family: -apple-system, BlinkMacSystemFont, "Roboto", arial, sans-serif !important;
							}

					    .footer-content .footer-menu-container .footer-menu [href="https://dribbble.com/hectorlizard"] {
					        background: transparent url("dribbble-footer.png") no-repeat;
					        display: inline-block;
					        width: 20px;
					        height: 20px;
					        background-size: 20px 20px;
					        position: relative;
					        transform: translateY(6px) !important;
					    }

					    .footer-content .footer-menu-container .footer-menu [href="https://twitter.com/hectrlzrd"] {
					        background: transparent url("twitter-footer.png") no-repeat;
					        display: inline-block;
					        width: 20px;
					        height: 20px;
					        background-size: 20px 20px;
					        position: relative;
					        transform: translateY(6px) !important;
					    }

					    .footer-content .footer-menu-container .footer-menu [href="https://www.instagram.com/hectrlzrd"] {
					        background: transparent url("insta-footer.png") no-repeat;
					        display: inline-block;
					        width: 20px;
					        height: 20px;
					        background-size: 20px 20px;
					        position: relative;
					        transform: translateY(6px) !important;
					    }



/* Specific to Overview (index) */

	#install-details {
		max-width: 780px;
		margin: auto;
	}

		#install-easy {
			max-width: 329px;
			display: inline-block;
			margin-right: 110px;
		}

		#install-custom {
			max-width: 329px;
			display: inline-block;	
		}

			.install-text {
				font-size: 20px;
				font-weight: 400;
				color: #9F9FB2;
				text-align: center;
				padding-top: 120px;
				background-size: 102px 102px !important;
				background: no-repeat top center;
			}

				.install-text p {
					margin: 0;
					line-height: 24px;
					letter-spacing: .2px;
					color: #7A79B5;
				}

				#install-easy .install-text {
					background-image: url("install-easy.png");
				}

				#install-custom .install-text {
					background-image: url("install-custom.png");
				}

			.install-features{
				width: 330px;
				padding: 0;
			}

				.install-feature {
					margin-top: 50px;
					display: inline-block;
					width: 150px;
					text-align: center;
					padding: 0;
					padding-top: 65px;
					vertical-align: top;
					background: no-repeat top center;
				}

						.install-feature + .install-feature {
							margin-left: 25px
						}

						.linkflair-like-label {
				            border-radius: 20px;
				            text-transform: uppercase;
				            border: none;
				            font-size: 9px;
				            font-weight: 700;
				            letter-spacing: 0.5px;
				            color: white;
				            background: #D17300;
				            padding: 2px 8px 1px 8px;
				            position: relative;
				            line-height: normal;
				            height: 15px;
				            float: right;
				            transform: translateX(-30px) translateY(-10px);
						}

						#install-easy #left.install-feature  {
							background-image: url("install-hidpi.png");
							background-size: 99px 72px !important
						}

						#install-easy #right.install-feature  {
							background-image: url("install-swap.png");
							background-size: 99px 72px !important
						}

						#install-custom #left.install-feature  {
							background-image: url("install-stylesheet.png");
							background-size: 99px 72px !important
						}

						#install-custom #right.install-feature  {
							background-image: url("install-sketch.png");
							background-size: 99px 72px !important
						}

		#learn-more-install {
			display: block;
			margin: 60px auto 100px auto;
			width: 149px;
			height: 22px;
			background: url("learn-more-install.png");
			background-size: 149px 22px !important;
			transition: all .15s ease-in-out;
		}

			#learn-more-install:hover {
				background: url("learn-more-install-h.png");
			}

		#learn-more-install-preload {
			background:url("learn-more-install-h.png");
		}


	/* Sub logos list */

		#sub-logos img {
			width: 100%;
			margin-bottom: 100px
		}

		#sub-logos p {
			margin-top: 100px;
			font-size: 28px;
			font-weight: 500;
			color: #7A79B5;
			letter-spacing: -.2px;
			text-align: center;
			margin-bottom: 50px
		}

	/* Gallery */
	
		/* Gallery title */

			#gallery-title {
				font-size: 44px;
				color: #FFFFFF;
				letter-spacing: -.2px;
				font-weight: 500;
				margin-top: 100px
			}

		/* 2 images row */

			.image-duo + .image-duo {
					display: block;
					margin: 0;
					padding: 0 !important;
					margin-top: 27px 
			}

			.image-duo img {
					display: inline-block;
					width: calc(50vw - 15px);
					height: auto;
					margin: 0 0 0 0;
					padding: 0 0 0 0
			}

				 .gallery-image + .gallery-image {
				 	margin: 0 0 0 25px !important;
				}