html, body{
	overflow-x: hidden;
}
#topPanel {
	position: relative;
	overflow: hidden;
	width: 100%;
	height: auto;
	z-index: 4;
	border-bottom: 1px solid #333;
	background: url('/assets/img/patterns/bg_pattern_zigzag.png') #ECE84C;
	background-size: 18px;
	padding-top: 250px;
	padding-bottom: 65px;
	margin-bottom: 110px;
}

#topPanel h1 {
	float: left;
	font-size: 60px;
	line-height: 1;
}

#topPanel .title {
	position: relative;
}
#topPanel .btn {
	margin-right: 15px;
	margin-bottom: 10px;
}

#plusMembers {
	white-space: nowrap;
	margin-left: -30px;
	margin-bottom: 120px;
	display: none;
}

#plusMembers .userLi {
	max-width: 100px;
	display: inline-block;
	margin-right: 30px;
	width: 10%;
}

#plusMembers .userLabel {
	display: none;
}

#plusMembers .ratioKeeper {
	background: #f5f5f5;
}

#plusMembers .userThumbPlus {
	transform: translate(-100%, 100%);
	transition-property: transform opacity;
	transition-duration: 800ms;
	opacity: 0;
}

#plusMembers .userThumbPlus.show {
	transform: translate(0%, 0%);
	opacity: 1;
}

#illustrationContainer {
	height: 3px;
	position: absolute;
	right: -20px;
	width: 50%;
	transform: translateY(-100%);
	bottom: 0;
	z-index: -1;
}

#membershipIllustration {
	width: 100%;
	transform: translateY(-70%);
}

#content {
	position: relative;
	min-height: 500px;
}
#couponContainer {
	padding: 0;
}

#couponContainer form,
#couponContainer #couponDescription {
	display: none;
}

#coupon {
	text-transform: uppercase;
	width: 150px;
	PADDING: 3PX;
	height: 32px;
}
.section video,
.section img,
#animated {
	width: 100%;
	height: auto;
	margin-bottom: 40px;
}

#section_private {}

#pricing {
    position: relative;
}

.plan {
	margin-bottom: 155px;
	margin-top: 0;
}

.plan ul {
	padding: 0px 0px 10px 0;
	list-style: none;
	/* Remove list bullets */
}

.plan li {
	margin-bottom: 10px;
	margin-left: 20px;
	position: relative;
}

.plan li:before {
	    content: "";
	    left: -20px;
	    width: 11px;
	    height: 12px;
	    background: url('/assets/img/icons/checkmark_green@2x.png') no-repeat;
	    position: absolute;
	    background-size: contain;
	    top: 7px;
	    display: block;
}

.plan .btn {
	margin-bottom: 10px;
}

.planContainer {
	background: #FFFFFF;
	box-shadow: 0 0 9px 0 rgba(208, 208, 208, 0.50);
	padding: 25px 15px 15px 15px;
	position: relative;
	height: 100%; 
}

#content .section {
	margin-bottom: 130px;
}

.section.active {
	border-left-width: 7px;
	-left-width: 15px;
}
.section img{
	border:1px solid  #f5f5f5;
}
.section h2 {
	margin-bottom: 0px;
}
#pricingBg {
	position: absolute;
	background-color: #E1F2FA;
	width: 100%;
	height: 400px;
	bottom: 0px;
	left: 0;
}
.flex {
	display: flex;
}

#professorPlusPlan {
	 align-self: flex-end;
}
#professorPlusPlan >.planContainer {
	background: none;
	box-shadow: none;
	padding: 0;
}



#animated {
	border: 1px solid #eee;
	margin-bottom: -100%;
	position: relative;
	transition: all 400ms;
	width: 650px;
	transform: translateY(-50%);
}

#animatedContainer {
	height: 1px;
}

#animatedContainer.sticky {
	position: fixed;
	width: 100%;
	top: 0;
	left: 0;
	padding-left: 30px;
	padding-right: 0;
}

#animated_openprocessing,
#animated_browser,
#animated_tree,
#animated_website,
#animated_sun,
#animated_nyan,
#animated_mountains {
	opacity: 0;
	transition: opacity 200ms, transform 200ms;
}

#animated.sun #animated_sun {
	display: block;
}

#animated.openprocessing #animated_openprocessing,
#animated.browser #animated_browser,
#animated.tree #animated_tree,
#animated.website #animated_website,
#animated.sun #animated_sun,
#animated.nyan #animated_nyan,
#animated.mountains #animated_mountains {
	opacity: 1;
}

#animated.website #animated_tree {
	transform: translate(128px, 160px);
}

#animated_heart {
	transition: transform 100ms ease-in, opacity 100ms;
}

#animated_lock {
	transition: transform 100ms ease-out;
	transform: translate(17px, -25px);
}

#animated.private #animated_heart {
	transform: translate(0, 25px);
	opacity: 0;
}

#animated.private #animated_lock {
	transform: translate(17px, 4px);
}

#animated_sun {
	transition: transform 400ms 200ms ease-in-out, opacity 400ms;
	transform: translate(-150px, 120px);
}

#animated.sun #animated_sun {
	transform: translate(0px, 0px);
}

#animated_nyan {
	transition: transform 400ms ease-in-out, opacity 400ms;
	transform: translate(1170px, 100px) scale(-1,1);
	opacity: 1;
}

#animated.nyan #animated_nyan {
	transform: translate(640px, 100px) scale(-1,1);
}

#animated.final {
	/* position: fixed; */
	width: 100%;
	left: 0;
	border: none;
}

#animated.final #animated_bg{
	opacity: 0;
}
.grey {
	color: #999
}

@media (max-width: 767px) {
	#topPanel {
		padding-top: 120px;
		padding-bottom: 30px;
		margin-bottom: 50px;
	}
	#topPanel h1 {
		font-size: 40px;
	}
	#illustrationContainer {
		right: -40px;
		bottom: -20px;
	}
	#plusMembers {
		margin-bottom: 50px;
		margin-left: 5px;
	}
	#plusMembers .userLi {
		margin-right: 10px;
	}
	#pricing .flex {
		display: block;
	}
	#pricing .plan {
		margin-bottom: 40px;
	}
		
	#professorPlusPlan {
	}
		

}