
	.underline {
		text-decoration: none;
		position: relative;
	}
	.underline:after {
		content: '';
		position: absolute;
		bottom: -3px;
		left: 0;
		width: 0%;
		border-bottom: 1px solid;
		transition: 0.2s ease-out;
	}
	.underline:hover:after {
		width: 100%;
	}
	.underline_2 {
		text-decoration: none;
		position: relative;
	}
	.underline_2:after {
		content: '';
		position: absolute;
		bottom: 0;
		left: 0;
		width: 0%;
		border-bottom: 2px solid;
		transition: 0.2s ease-out;
	}
	.underline_2:hover:after {
		width: 100%;
	}
	hr {
		height: 0;
		width: 50vw;
		max-width: 1000px;
		margin: 0 auto;
		border: 0;
		border-bottom: 1px solid rgba(0,0,0,.1);
	}
	.logoText {
		transition:all 0.2s ease-out;
	}
	.menuLabel {
		transition:all 0.2s ease-out;
	}
	.Thumbs\.grid div {
		width:400px;
		/*height:232px !important;*/
		transition: all 0.2s;
		transform:scale(1);
		z-index:0;
		overflow: visible;
		cursor:pointer !important;
		padding-bottom: 0;
	}
	.Thumbs\.grid div:hover {
		margin-top:-23px;
		/* height:295px !important; */
		transform:scale(1.05);
		box-shadow:rgba(0, 0, 0, 0.2) 0px 40px 40px 0px;
		z-index:5;
		padding-bottom: 55px;
	}
	.Thumbs\.grid span {
		z-index:-1 !important;
	}
	.Thumbs\.grid img {
		box-shadow:rgba(0, 0, 0, 0.07) 0px 10px 30px 0px;
		width: 100% !important;
		height: unset !important;
	}
	.Thumbs\.grid li {
		position:absolute;
		display:block;
		opacity:0;
		/* width:380px;
		height:48px; */
		padding: 11px 0px 3px 20px;
		transition: all 0.2s;
		bottom:0px;
		background-color:#222;
		width: 100%;
		top: -3px;
	}
	.Thumbs\.grid li p {
		color:#999;
	}
	.Thumbs\.grid div:hover li {
		opacity:1;
		bottom:-57px;
	}
	.Thumbs\.grid div span h4 {
		color:#DDD;
		font-weight:300;
		padding-bottom:4px;
	}
	.Thumbs\.grid div span p {
		font-size:12px;
		font-weight:400;
	}
[class~="Thumbs.grid"] li {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
}
	.homeslideshow {
		/* height: 100%; */
		/* background-position: top; */
		/* background-repeat: no-repeat; */
		/* background-size: cover; */
	}
	.landing-text1 {
		display: block;
		position: absolute;
		bottom: 7vh;
		left: 7vw;
	}
	.homeslideshow h1 {
		font-size:3.5vw;
		font-weight:500;
		color:#FFFFFF;
		max-width: 65%;
		line-height:105%;
	}
	.homeslideshow h3 {
		font-size: 1.5vw;
		font-weight:500;
		margin:10px 0 40px 3px;
		color:#FFFFFF;
	}
	.homeslideshow button {
		cursor:pointer;
		font-weight:400;
		font-size:14px;
		padding:15px 30px;
		margin:15px 5px;
		text-transform:uppercase;
		border:none;
		color:#111;
		background-color:#FFF;
		outline:none;
		transition:all 0.2s ease-out;
		white-space: nowrap;
	}
	.homeslideshow button:hover {
		opacity:0.7;
	}
	.homeslideshow h5 {
		color:#FFFFFF;
		font-weight:500;
		display:inline-block;
		font-size:14px;
		top:7px;
		position:relative;
		left: 20px;
	}
	.landing-vid {
		left:5px;
		cursor:pointer;
		display:block;
		position:relative;
		width:16vw;
		max-width:21rem;
		margin-bottom:42px;
		box-shadow:rgba(0, 0, 0, 0.1) 0px 10px 30px 0px;
		transition: all 0.2s ease-out;
	}
	.landing-vid:hover {
		opacity:0.7;
		transform: scale(1.1);
		box-shadow:rgba(0, 0, 0, 0.2) 0px 10px 30px 0px;
	}
	.landing-vid span {
		position: absolute;
		z-index:1;
		bottom:15px;
		font-size: 11px;
		text-transform:uppercase;
		font-weight:700;
		right:64px;
		text-align:right;
		color:#FFF;
		opacity:0.9;
	}
	.landing-vid .home_play_icon {
		width:52px;
		position:absolute;
		bottom:-2px;
		right:0px;
		z-index:1;
		opacity:0.9;
	}
	.landing-vid .home_preview {
		position: relative;
		top:5px;
		z-index:0;
		width:16vw;
		max-width:21rem;
		-webkit-backface-visibility: hidden;
	}
	.examples-section {
		cursor: default;
		display: grid;
		font-family: Roboto;
		grid-template-columns: 1.22fr 1.78fr;
		grid-template-rows: 100%;
		justify-items: center;
	}
	.examples-text {
		display: grid;
		align-content: center;
		padding: 1.2vw 0 2vw 0;
		grid-area: 1 / 1 / 1 / 1;
		width: 33vw;
	}
	.examples-text h2 {
		font-size:2.5vw;
		line-height:120%;
		font-weight:500;
		padding:20px 0 20px 0;
	}
	.examples-text h5 {
		padding: 0.3vw 0;
		font-size: 1vw;
		font-weight: 400;
	}
	.examples-categories-list {
		padding-top: 14px;
		display: flex;
		flex-direction: column;
		align-items: start;
	}
	.examples-categories-list a {
		cursor: pointer;
		position: relative;
		font-size: 1.8vw;
		font-weight: 400;
		text-transform: lowercase;
		transition: all 0.2s ease-out;
		color:#FFF;
	}
	.examples-categories-list a:hover {
		margin-left:10px;
	}
	#examples-sample-sites {
		height: 100%;
		display: grid;
		grid-template-rows: 100%;
		grid-template-columns: 1fr;
		align-items: center;
		justify-content: center;
		/*background-color: rgba(0,0,0,0.05);*/
		grid-area: 2 / 4 / 1 / 2;
	}
	#examples-sample-sites img {
		grid-area: 1 / 1 / 1 / 1;
		align-self: center;
		justify-self: center;
		max-width:100%;
		max-height:100%;
		transition: all 0.65s;
	}
	#examples-overlay {
		display: grid;
		grid-area: 2 / 4 / 1 / 2;
		opacity: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, 0.8);
		z-index: 1;
		align-content: center;
		justify-content: center;
		transition: all 0.2s;
	}
	#examples-overlay a {
		color:#FFF;
		font-size: 28px;
		font-weight:400;
	}
	.pro-features {
		display:grid;
		align-content:center;
		justify-content:center;
		grid-template-columns:1.64fr 1.36fr;
	}
	.features-left {
		display:grid;
		height:100%;
		width:100%;
		align-content:center;
		justify-items:center;
	}
	.features-left img {
		width:100%;
		max-width:2000px;
		padding: 0px 0;
		grid-area: 2 / 4 / 1 / 2;
	}
	#dark_mode_toggle {
		position: absolute;
		display: block;
		left: 4.5vw;
		bottom: 20px;
		z-index: 2;
		font-size: 1vw;
		font-weight: 300;
	}
	#admin_dark {
		display: inline-block;
		color: #444;
		cursor: pointer;
	}
	#admin_light {
		display: inline-block;
		color: #FFF;
		cursor: pointer;
	}
	#admin_dark_preview {
		z-index: 1;
		transition: all 0.3s;
	}
	#admin_light_preview {
		z-index: 0;
	}
	.features-right {
		display: grid;
		height:100%;
		width:100%;
		/*background-color:rgba(255,255,255,0.05);*/
		align-items: center;
		justify-items: center;
	}
	.features-right h2 {
		font-size: 2.5vw;
		font-weight:500;
	}
	.features-right h2 svg {
		top: .5vw;
		position:relative;
		padding-right:10px;
		width: 2.5vw;
	}
	.features-right h5 {
		font-size: 1vw;
		font-weight:400;
		padding:0.3vw 0;
	}
	.features-right-container {
		width: 75%;
		/*padding: 1.2vw 0 3vw 0;*/
	}
	.features-list p {
		font-size: 1.1vw;
		font-weight:400;
		padding-left:10px;
	}
	.support-page {
		display:grid;
		grid-template-columns: 1fr 1fr;
		align-items:center;
		justify-content:center;
	}
	.support-left h2 {
		line-height:95%;
		font-size: 2.5vw;
		font-weight:500;
		padding: 0 10px 1.2vw 0;
		text-align:right;
	}
	.support-left h2 small {
		font-size: 1.2vw;
		text-transform:uppercase;
	}
	.support-left h5 {
		padding: 0.5vw 0;
		font-size: 1vw;
		font-weight: 400;
	}
	.support-left {
		padding: 0px 4.5vw 0px 5.5vw;
		font-size: 1.1vw;
		font-weight: 400;
	}
	.support-page blockquote {
		color:#777;
		font-size: 1.1vw;
		margin: 0;
		font-weight:400;
		font-style:italic;
		border-left:3px solid #F5F5F5;
		padding-left: 15px;
	}
	.support-page img {
		width:100%;
	}
	
	
	/* Footer */
	
	.footer-grid {
		display: grid;
		grid-template-columns: 1fr 1fr 1fr 1fr;
		width: 72%;
		min-width: 750px;
		padding-left: 80px;
	}
	
	.footer-container {
		display: flex;
		background-color: rgb(0, 0, 0);
		padding: 0;
		color: #999999;
		font-family: Roboto;
		flex-flow: nowrap;
		justify-content: start;
	}
	.footer-column {
		display: flex;
		flex-direction: column;
		padding: 100px 0px;
		min-width: 120px;
	}
	.footer-left {
		width: 28%;
		padding-left: 80px;
		min-width: 320px;
	}
	.footer-column h4 {
		color: #ffffff;
		font-size: 14px;
		text-transform: uppercase;
		padding-bottom: 10px;
	}
	.footer-column a {
		color: #999999;
		font-size: 14px;
		text-transform: uppercase;
		text-decoration: none;
		padding-bottom: 10px;
		font-weight: 500;
		cursor: pointer;
		transition: all 0.2s;
	}
	.footer-column a:hover {
		color: #FFFFFF;
	}
	.footer-column p {
		color: #999999;
		font-size: 14px;
		padding: 0 20px 16px 0;
		margin: 0;
		font-weight: 300;
	}
	@media screen and (max-width: 1200px) and (min-width: 825px) {
		.footer-container {
			flex-flow: wrap;
			padding: 50px 0;
		}
		.footer-left {
			width: 100%;
			margin-left: 7vw;
		}
		.footer-column {
			padding: 0;
		}
		.footer-column p {
			padding: 0 80px 16px 0;
		}
		.footer-grid {
			width: 100%;
			padding: 50px 0 50px 7vw;
		}
	}
	@media screen and (max-width: 825px) {
		.footer-container {
			flex-flow: wrap;
			padding: 50px 0;
		}
		.footer-left {
			width: 100%;
			margin-left: 14vw;
		}
		.footer-column {
			padding: 20px 0px;
		}
		.footer-column p {
			padding: 0 60px 16px 0;
		}
		.footer-grid {
			width: 100%;
			grid-template-columns: 1fr 1fr;
			min-width:320px;
			display:flex;
			flex-flow:column wrap;
			max-height: 500px;
			padding: 0 0 3vw 14vw;
		}
	}



	/* design services overlay */
	
	.design_services {
		padding: 0 5%;
		max-width: 90%;
		tab-size:1;
	}

	.design_services h1 {
		text-align: center;
		text-transform:uppercase;
		margin-top:65px;
	}
	


	/* feature list overlay */

	.feature_column {
		padding: 0 5%;
	}
	.feature_column h2 {
		text-align: center;
		text-transform:uppercase;
		margin-top:65px;
	}
	.feature_column h3 {
		text-transform:uppercase;
	}

	@media (min-width: 1800px) {
		#feature_content {
			max-width: 1586px;
		}
		#feature_content h2{
			margin: 100px 0 40px 0;
		}
		.feature_column {
			max-width: 370px;
			min-width: 270px;
		}
	}

	@media (min-width: 0px) {
		#feature_content {
			max-width: 600px;
		}
		#feature_content h2{
			margin: 60px 0 0px 0;
		}
		.feature_column {
			max-width: 500px;
			min-width: 270px;
		}
	}
	
	
	
	.signup_page {
		display:grid;
		align-content:center;
		justify-content:center;
		transition: all 0.2s ease-out;
	}
	.signup_page h2 {
		font-size: 24px;
		font-weight: 500;
		color: #333;
		text-align: center;
		margin-bottom: 0px;
	}
	.signup_page h5 {
		color: #888;
		text-align: center;
		margin-top: -6px;
		font-weight: 500 !important;
		font-size: 12px !important;
		margin-bottom: 30px;
	}
	.signup_page form {
		display:grid;
		width:356px;
		height: 500px;
		transition: all 0.2s ease-out;
	}
	.signup_page input {
		font-family: 'Open sans', sans-serif;
		font-weight:300;
		color:#333;
		border-bottom:1px solid #EEE;
		border-radius:2px;
		font-size:14px;
		height:40px;
		transition: all 0.2s ease-out;
		padding: 0px;
		margin-top: -10px;
	}
	.signup_page input::placeholder {
		color:#BBB;
	}
	.signup_page input:focus {
		border-bottom:1px solid #FFF;
		background-color:#F8F8F8;
		padding: 0px 10px;
	}
	.signup_page .website_input {
		position: absolute;
		left:-1000px;
		top:-1000px;
	}
	.signup_page  textarea {
		font-family: 'Open sans', sans-serif;
		font-weight:300;
		color:#333;
		border-bottom:1px solid #EEE;
		border-radius:2px;
		font-size:14px;
		height:100px;
		transition: all 0.2s ease-out;
		padding: 0px;
		margin-top: -10px;
	}
	.signup_page textarea::placeholder {
		color:#BBB;
	}
	.signup_page textarea:focus {
		border-bottom:1px solid #FFF;
		background-color:#F8F8F8;
		padding: 0px 10px;
	}
	#username_input::after {
		content:'.photofolio.com';
	}
	.signup_page label {
		position: relative;
		top: -9px;
		font-weight: 300;
		font-family: 'Open Sans', sans-serif;
		font-size: 11px;
		color: #888;
		height: 10px;
	}
	.signup_page p {
		font-size:12px;
		font-weight:400;
		color:#999;
		margin: 15px 0 12px 0;
	}
	.signup_page a {
		font-size:12px;
		font-weight:400;
		color:#999;
	}
	.signup_page button {
		font-size:15px;
		font-weight:500;
		width:100%;
		height:56px;
		line-height:56px;
		text-decoration:none;
		color:#FFF;
		background-color:#333;
		text-align:center;
		letter-spacing: .5px;
		transition: .2s ease-out;
		cursor: pointer;
		border: none;
		border-radius:2px;
		display:inline-block;
		outline: 0;
		padding: 0 2rem;
		text-transform:uppercase;
		vertical-align: middle;
		transition: all 0.2s ease-out;
		-webkit-tap-highlight-color:transparent;
		margin-top: 8px;
	}
	.signup_page button:hover {
		background-color:#333;
		transform: scale(1.05);
	}
	.signup_page button:focus {
		background-color:#333;
		transform: scale(1.05);
	}
	.signup_page button:disabled {
		cursor: not-allowed;
		background-color:#DDD;
		transform: scale(1);
	}
	#signup_success, #contact_success {
		width: 356px;
		display: none;
		opacity: 0;
		text-align: left;
		transition: all 0.2s ease-out;
		border-radius: 7px;
		overflow: hidden;
	}
	#signup_success_bg, #contact_success_bg {
		position: absolute;
		z-index: -1;
		bottom:0px;
		width: 356px;
		height: 0px;
		display: block;
		background-color:#333;
		transition: all 0.4s;
		border-radius: 7px;
	}
	#signup_success h2, #contact_success h2 {
		text-align: left;
		color:#FFF;
		font-size: 38px;
		padding: 20px 0 5px 20px;
		margin-bottom: 0px;
		opacity: 0;
		position: relative;
		top: 20px;
		transition: all 0.4s ease-out;
	}
	#signup_success li, #contact_success li {
		font-size: 14px;
		color:#DDD;
		padding: 16px 20px;
		list-style-type: none;
		opacity: 0;
		position: relative;
		top: 20px;
		transition: all 0.4s ease-out;
	}
	#signup_success .n_bull {
		position: relative;
		font-size: 20px;
		color:#777;
		padding: 0 2px 0 4px;
		top: 2px;
	}
	#success_email {
		font-size: 12px;
	}
	#success_close, #contact_close {
		color: #DDD;
		font-size: 11px;
		transform: scale(1);
		opacity: 0;
		position: relative;
		top: 20px;
		transition: all 0.4s ease-out;
	}
	#success_close:hover, #contact_close:hover {
		color: #888;
	}
	#activation_sub {
		font-size: 11px;
		padding: 10px 20px;
		color: #AAA;
		font-weight:300;
		opacity: 0;
		position: relative;
		top: 20px;
		transition: all 0.4s ease-out;
	}
	#signup_fail, #contact_fail {
		width: 356px;
		display: none;
		opacity: 0;
		text-align: center;
		transition: all 0.2s ease-out;
	}
	#signup_fail h2, #contact_fail h2 {
		font-size: 38px;
	}
	#signup_fail p, #contact_fail p {
		font-size: 18px;
		color:#444;
	}
	
	#design_services {
		tab-size: 1;
	}
	.design_text ul {
		padding-left: 5px !important;
	}
	.design_text li {
		padding-left: 5px !important;
	}
	
	
	.terms {
		max-width: 700px;
		margin: auto;
		padding: 0 20px 70px 20px;
	}
	.terms h1 {
		text-transform: uppercase;
		padding: 120px 0 80px 0;
		font-size: 24px;
		font-weight: 500;
		color: #111;
		text-align: center;
	}
	.terms h2 {
		padding: 40px 0 10px 0;
		font-size: 18px;
		font-weight: 500;
		color: #222;
	}
	.terms h4, .terms strong {
		padding: 40px 0 10px 0;
		font-size: 16px;
		font-weight: 500;
		color: #222;
	}
	.terms p, .terms li {
		padding: 10px 0 10px 0;
		font-size: 15px;
		font-weight: 300;
		line-height: 20px;
		color: #666;
	}
	.terms a {
		text-decoration: underline;
		color: #444;
	}
	.terms a:hover {
		text-decoration: none;
	}
	.company_header {
		height:65vh;
		background-color:#181818;
		display: flex;
		align-items: center;
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
	}
	.company_header .header_text {
		margin: 0 8vw;
	}
	.company_header .header_text h2 {
		color:#333;
		font-size:45px;
		font-weight:500;
		line-height:125%;
	}
	.company_header .header_text h3 {
		color:#666;
		font-size:16px;
		font-weight:500;
		margin-bottom:10px;
		text-transform:uppercase;
	}
	.company {
		max-width: 95%;
		margin: 140px auto 140px auto;
		text-align: center;
	}
	.recognition {
		background-color:#CCC;
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
		text-align: center;
	}
	.company_blocks {
		display:flex;
		justify-content: space-between;
		counter-reset: index;
		margin: 0 8vw;
		flex-wrap: wrap;
	}
	.recognition_blocks {
		display:flex;
		justify-content: space-between;
		counter-reset: index;
		margin: 0 8vw 140px 8vw;
		flex-wrap: wrap;
	}
	.company_block {
		position: relative;
		margin: 0 px;
		width: 35vw;
		text-align:left;
		min-width: 400px;
	}
	.company_block svg {
		position: absolute;
		top: 34px;
		left: 0px;
	}
	.recognition_block {
		margin: 0 px;
		width: 22vw;
		text-align:left;
		min-width: 300px;
	}
	.company h1 {
		font-size: 36px;
		font-weight: 500;
		color: #222;
		text-align: center;
		padding-bottom: 35px;
	}
	.recognition h1, .contact h1 {
		padding: 140px 0 35px 0;
		font-size: 36px;
		font-weight: 500;
		color: #222;
		text-align: center;
	}
	.company h2 {
		padding: 36px 0 15px 45px;
		font-size: 20px;
		font-weight: 500;
		color: #222;
		text-transform: capitalize;
	}
	 .recognition h2 {
		padding: 30px 0 15px 0;
		font-size: 20px;
		font-weight: 500;
		color: #222;
		text-transform: capitalize;
	}
	.company h5, .recognition h5 {
		max-width: 600px;
		font-size: 16px;
		font-weight: 300;
		color: #666;
		text-align: center;
		padding-bottom: 50px;
		margin: 0 auto;
	}
	.company p, .recognition p {
		padding: 10px 0 0 0;
		font-size: 15px;
		font-weight: 300;
		line-height: 20px;
		color: #333;
		letter-spacing: .025ch;
	}
	.company_hslide {
		height:650px;
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
	}
	.about_nav {
		display:flex;
		height:90px;
		justify-content:center;
		align-items:center;
		background-color:#F5F5F5;
	}
	.about_nav_flex {
		display:grid;
		grid-auto-flow:column;
	}
	.about_nav a {
		padding: 0 50px;
		font-size:16px;
		font-weight:300;
		color:#666;
		cursor:pointer;
		transition: .2s ease-out;
	}
	.about_nav_divider {
		border-right: 1px solid #DDD;
	}
	.about_nav a:hover {
		color:#111;
		font-weight:400;
	}
	.team {
		max-width: 80%;
		margin: auto;
		padding: 0px 20px 0px 20px;
	}
	.team h1 {
		padding: 140px 0 140px 0;
		font-size: 36px;
		font-weight: 500;
		color: #111;
		text-align: center;
	}
	.team h3 {
		padding-bottom: 15px;
		font-size: 18px;
		font-weight: 500;
		color: #222;
		text-transform: uppercase;
	}
	.team h4 {
		font-size: 12px;
		font-weight: 500;
		padding-bottom: 5px;
		color: #333;
		text-transform: uppercase;
		letter-spacing: .1em;
	}
	.team p {
		padding: 10px 0 0 0;
		font-size: 15px;
		font-weight: 300;
		line-height: 20px;
		color: #333;
		letter-spacing: .025ch;
	}
	.team a {
		text-decoration: underline;
		color: #444;
	}
	.team a:hover {
		text-decoration: none;
	}
	.team_members {
		display: flex;
		flex-wrap: wrap;
		justify-content: start;
	}
	.team_member {
		display: flex;
		width: 50%;
		margin-bottom: 140px;
	}
	.team_img {
		display: block;
		width: 200px;
		height: 280px;
	}
	.team_img img {
		display: block;
		width: 200px;
		height: 280px;
		max-width: initial !important;
	}
	.member_text {
		display: flex;
		flex-direction: column;
		width: 60%;
		margin: 0 60px 0 40px;
	}
	.contact {
		max-width: 800px;
		margin: 0 auto 140px auto;
		text-align: center;
	}
	.contact_segment_content {
		float: left;
		display: flex;
		text-align: left;
		padding: 0 0 50px 35px;
		flex-direction: column;
	}
	.contact_segment_content p {
		color: #333;
		letter-spacing: .025ch;
		padding: 0 0 3px 0;
		font-size: 15px;
		font-weight: 300;
		line-height: 20px;
	}
	.contact_segment_wrapper {
		margin: auto;
		text-align: right;
	}
	.contact_segment_wrapper h3 {
		width: 300px;
		font-weight: 500;
		float: left;
		padding: 0 0;
		color: #333;
	}
	.contact_btn {
		max-width: 300px;
		font-size: 15px;
		font-weight: 500;
		width: 100%;
		height: 56px;
		line-height: 56px;
		text-decoration: none;
		color: #FFF;
		background-color: #DDD;
		text-align: center;
		letter-spacing: .5px;
		transition: .2s ease-out;
		cursor: pointer;
		border: none;
		border-radius: 2px;
		display: inline-block;
		outline: 0;
		padding: 0 2rem;
		text-transform: uppercase;
		vertical-align: middle;
		margin-top: 10px;
	}
	.contact_btn:hover, .contact_btn:focus {
		background-color: #333;
	}
	
	
	
	#pricing_container {
		display: grid;
		grid-auto-flow: column;
		white-space: normal;
	}
	#pricing_container li {
		list-style: none;
		height: calc(4vh);
		line-height: normal;
	}
	#pricing_feature {
		width: 12vw;
		text-align: right;
	}
	#pricing_feature li {
		display: grid;
		align-content: center;
		color: #999;
		padding-right: 10px;
		font-size: calc(0.3vw + 8px);
	}
	#pricing_container h5 {
		font-size: calc(0.5vw + 3px);
		font-weight: 300;
		line-height: 30px;
		color: #FFF;
		background-color: #999;
		padding: 0;
		margin: 0;
	}
	#pricing_container h2 {
		font-size: calc(2.5vw);
		font-weight: 300;
		color: #FFF;
		background-color: #777;
		padding: 10px 0 8px 0;
		margin: 0;
	}
	#pricing_feature h5 {
		background-color: transparent;
	}
	#pricing_feature h2 {
		background-color: transparent;
	}
	#pricing_container sup {
		font-size: calc(0.5vw + 3px);
		position: relative;
		top: calc(0.5vh);
		white-space: nowrap;
		vertical-align: top;
		left: calc(-.5vw);
	}
	.pricing_option {
		background-color: #F5F5F5;
		width: 20vw;
		text-align: center;
		border: 3px solid #FFF;
		transition: all 0.35s;
		box-shadow: rgba(0, 0, 0, 0) 0px 10px 30px 0px;
		z-index: 0;
		cursor: pointer;
	}
	.pricing_option:hover {
		transform: scale(1.05);
		box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 30px 0px;
		border: 3px solid #555;
		z-index: 1;
	}
	.pricing_option li {
		display: grid !important;
		align-content: center;
		color: #444;
		font-size: calc(0.3vw + 9px);
	}
	.pricing_option li:nth-child(even) {
		background-color: #FAFAFA;
	}
	.pricing_option li:nth-child(odd) {
		background-color: #F4F4F4;
	}
	
	.pricing_option a {
		text-decoration: none;
		color: #444;
	}
	#pricing_option_2 h5 {
		background-color: #0888c8;
	}
	#pricing_container div:hover:nth-child(3) {
		transform: scale(1.05);
		box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 30px 0px;
		border: 3px solid #555;
		z-index: 1;
	}
	#pricing_container:not(:hover) div:nth-child(3) {
		transform: scale(1.05);
		box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 30px 0px;
		border: 3px solid #555;
		z-index: 1;
	}
	
	
	
	@media screen and (max-width: 1300px) {
		.team_members {
			display: flex;
			flex-direction: column;
		}
		.team_member {
			width: 100%;
		}
	}
	@media screen and (max-width: 700px) {
		.team_members {
			display: flex;
			flex-direction: column;
		}
		.team_member {
			flex-direction: column;
		}
		.member_text {
			width: 100%;
			margin: 50px 0;
		}
	}
	@media screen and (max-width: 1300px) and (min-width: 1100px) {
		.examples-text h2 {
			font-size: 28px;
			padding: 15px 0 15px 0;
		}
		.examples-text {
			padding: 0px 30px 30px 60px;
		}
		.examples-categories-list a {
			font-size: 24px;
		}
		.features-right h2 {
			font-size: 34px;
		}
	}
	
	@media only screen and (max-width: 1100px) {
		.landing-text1 {
			bottom: 70px;
			left: 0px;
			width: 100%;
		}
		.landing-vid {
			width: 100px;
			margin: 0;
			display: block;
			bottom: 20px;
			left: 9vw;
		}
		.landing-vid .home_preview {
			width: 100px;
		}
		.landing-vid .home_play_icon {
			width: 26px;
			bottom: 0px;
		}
		.landing-vid span {
			font-size: 8px;
			bottom: 1px;
			right: 30px;
		}
		.home_caption_text {
			display: block;
			max-width: 80%;
			text-align: left;
			padding-left: 9vw;
		}
		.homeslideshow h1 {
			font-size: 40px;
			max-width: 100%;
		}
		.homeslideshow h3 {
			margin: 10px 0 15px 3px;
			font-size: 18px;
		}
		.homeslideshow h5 {
			color: #FFFFFF;
			font-weight: 500;
			font-size: 14px;
			top: 17px;
			position: relative;
			display:block;
			left: 12;
		}
		.homeslideshow button {
					font-size: 12px;
					padding: 15px 15px;
			float: left;
			margin-left: 10vw;
		}
		.Thumbs\.grid div:hover {
			margin-top:-23px;
			padding-bottom: 15px;
		}
		.Thumbs\.grid div:hover li {
			bottom:-38px;
		}
		.Thumbs\.grid li {
			padding: 5px 0px 2px 10px;
			width: calc(100% - 10px);
			top: -3px;
		}
		.Thumbs\.grid div span h4 {
			color:#DDD;
			font-size:12px;
			font-weight:300;
			padding-bottom:2px;
		}
		.Thumbs\.grid div span p {
			font-size:10px;
			font-weight:400;
		}
		.examples-section {
			grid-template-rows: 1.5fr 1.74fr;
			grid-template-columns: 100%;
		}
		.examples-text h2 {
			font-size: 30px;
			padding:10px;
		}
		.examples-text h5 {
			font-size: 15px;
			padding: 8px 32px 14px;
		}
		.examples-categories-list a {
			font-size: 20px;
			margin: 0 5px 0 0;
		}
		.examples-categories-list a:hover {
			margin-left:0px;
		}
		.examples-categories-list {
			flex-direction: row;
			align-content: center;
			flex-wrap: wrap;
			padding: 0 10px;
			justify-content: center;
		}
		.examples-text {
			justify-content: center;
			padding: 24px 20px 0px 20px;
			grid-area: 1 / 1 / 2 / 2;
			text-align: center;
			width: 100%;
		}
		#examples-overlay {
			grid-area: 2 / 1 / 3 / 2;
			height: calc(100% - 40px);
			top: 20px;
			position: relative;
		}
		#examples-sample-sites {
			height: 100%;
			grid-area: 2 / 1 / 3 / 2;
		}
		.pro-features {
			grid-template-rows: 1.58fr 1.0fr;
			grid-template-columns: 1fr;
		}
		#dark_mode_toggle {
			font-size: 3vw;
			font-weight: 400;
			bottom:10px;
		}
		.features-left {
			height: 100%;
			grid-area: 2 / 1 / 3 / 2;
		}
		.features-right {
			height: 100%;
			grid-area: 1 / 1 / 2 / 2;
		}
		.features-right-container {
			width: 100%;
			padding: 15px 20px 0px 20px;
			text-align: center;
			margin-top: -60px;
		}
		.features-right h2 {
			font-size: 38px;
		}
		.features-right h2 svg {
			top: 5px;
			 width: 38px;
		}
		.features-right h3 {
			font-size: 12px;
			padding: 5px 0;
		}
		.features-right h5 {
			font-size: 12px;
			padding: 5px;
		}
		.features-list p {
			font-size: 16px;
			padding-left: 15px;
			text-align: left;
		}
		.support-page {
			grid-template-columns: 1fr;
			grid-template-rows: 1fr auto;
		}
		.support-left {
			padding: 0px 25px 40px 25px;
		}
		.support-left h2 {
			font-size:38px;
			padding:25px 10px 15px 0;
			text-align:center;
		}
		.support-left h2 small {
			font-size: 20px;
		}
		.support-left h5 {
			font-size: 14px;
		}
		.support-left p {
			font-size: 12px;
			padding: 5px 0;
		}
		.support-page blockquote {
			font-size: 14px;
		}
		.header_text {
			margin: 243px 8vw 0 !important;
		}
		.header_text h3 {
			text-align:left;
			margin-bottom: 0px;
			padding-left: 5px;
		}
		.header_text h2 {
			text-align:left;
			font-size:38px !important;
			color: #303030;
			padding-left: 5px;
		}
		.about_nav {
			display:flex;
			height:200px;
			justify-content:center;
			align-items:center;
			background-color:#F5F5F5;
		}
		.about_nav_flex {
			display: column;
			grid-auto-flow:row;
		}
		.about_nav a {
			padding: 10px 50px;
			font-size:16px;
			font-weight:300;
			color:#666;
			cursor:pointer;
			transition: .2s ease-out;
			text-align: center;
		}
		.about_nav_divider {
			border-right: 0px solid #DDD;
			border-bottom: 1px solid #EEE;
		}
		.about_nav a:hover {
			color:#111;
			font-weight:400;
		}
		.company {
			margin: 50px auto 60px auto;
		}
		.company_block {
			min-width: 310px;
		}
		.company h5 {
			padding: 0px 12px 20px 12px;
		}
		.recognition h1 {
			padding: 50px 0 35px 0;
		}
		.recognition h5 {
			padding: 0px 12px 20px 12px;
		}
		.recognition_blocks {
			margin: 0 8vw 60px 8vw;
		}
		.team h1 {
			padding: 60px 0 50px 0;
			text-align: center;
		}
		.team_member {
			text-align: left;
			margin-bottom: 60px;
		}
		.team_img {
			align-self: center;
		}
		.team p {
			text-align: left;
		}
		.contact {
			margin: 0 auto 60px auto;
			max-width:400px;
		}
		.contact h1 {
			padding: 60px 0 35px 0;
		}
		.contact_segment_wrapper h3 {
			padding: 10px 50px;
			text-align: left;
			float: none;
		}
		.contact_segment_content {
			padding: 0 50px 50px 50px;
			float: none;
		}
		#pricing_feature {
			width:18vw;
		}
		.pricing_option {
			width:25vw;
		}
	}
	
	@media screen and (max-width: 1100px) and (min-width: 700px) {
		.landing-vid {
			width: 200px;
			margin-bottom: 22px;
			display: block;
			/*bottom: 20px;*/
			left: 9vw;
		}
		.landing-vid .home_preview {
			width: 200px;
		}
		.landing-vid .home_play_icon {
			width: 52px;
			bottom: 0px;
		}
		.landing-vid span {
			font-size: 8px;
			bottom: 1px;
			right: 30px;
		}
		.home_caption_text {
			max-width: 60%;
		}
		.homeslideshow h1 {
			font-size:55px;
		}
		.homeslideshow h3 {
			font-size: 24px;
			margin: 10px 0 40px 0;
		}
		.homeslideshow button {
					font-size: 14px;
					padding: 15px 30px;
			float: left;
			margin-left: 15px 5px;
		}
		.examples-section {
			grid-template-rows: 1.5fr 1.74fr;
			grid-template-columns: 100%;
		}
		.examples-text h2 {
			font-size: 60px;
			margin-bottom: 14px;
			letter-spacing: -1px;
		}
		.examples-text h5 {
			font-size: 23px;
		}
		.examples-text {
			padding: 0px 20px 20px 40px;
		}
		.examples-categories-list {
			padding: 10px 10px 0 0px;
			flex-wrap: wrap;
			flex-direction: initial;
		}
		.examples-categories-list a {
			font-size: 23px;
			margin: 10px 10px 0 0;
			font-weight: 500;
		}
		.examples-categories-list a:hover {
			margin-left: 0;
		}
		.pro-features {
			grid-template-rows: 1.15fr 1.05fr;
			grid-template-columns: 1fr;
		}
		.features-right h2 {
			font-size: 45px;
			letter-spacing: -1px;
			margin: 45px 0 15px 0;
		}
		.features-right h5 {
			font-size: 23px;
		}
		.features-list {
			line-height: 1.2;
		}
		.features-list p {
			font-size: 23px;
			margin-left: 6vw;
			font-weight: 500;
			line-height: 30px;
		}
		#dark_mode_toggle {
			font-size: 16px;
			font-weight: 400;
			bottom: 20px;
		}
		.support-page blockquote {
			font-size: 16px;
			padding: 0 60px;
			margin-left: 15px;
		}
		.support-left h2 {
			font-size: 45px;
			padding: 40px 10px 15px 0;
		}
		.support-left h5 {
			font-size: 23px;
			line-height: 1.1;
			letter-spacing: -0.5px;
			text-align: center;
		}
		.support-page {
			font-size: 18px;
		}
	}
	
	@media screen and (max-width: 1100px) and (min-width: 700px) and (orientation : landscape) {
			/* landscape */
		.landing-text1 {
			bottom: 100px;
		}
		.landing-vid {
			width: 200px;
			margin-bottom: 22px;
			display: block;
			left: calc(100% - 270px);
			position: absolute;
		}
		.home_caption_text {
			max-width: 40%;
			padding-left:7vw;
		}
		.homeslideshow h1 {
			font-size: 35px;
		}
		.homeslideshow h3 {
			font-size: 18px;
			margin: 10px 0 10px 0;
		}
		.homeslideshow button {
			margin-left: 7vw;
		}
	}
	