@charset "utf-8";
/* CSS Document */

@media screen and (max-width: 1081px) { /* only do this if the screen size becomes less than 1080px */
	#involve {
		padding-top: 20px;
		font-size: 36px;
	}
	
	#involve-tagline {
		padding-top: 9px;
		font-size: 26px;
	}
	
	#getstartedBtn {
		padding-top: 32px;
	}


}

@media screen and (max-width: 801px) { /* only do this if the screen size becomes less than 800px */
	#header {
		display: none;
	}
	
	#mobile-menu {
		clear: both;
		display: block;
		background-color: #3B3738;
		width: 100%;
		height: 52px;
				
	}
	
	.slicknav_menu {
		float: left;
		position: absolute;
	}
	
	.slicknav_menu, .slicknav_nav {
		background-color: #3B3738;
		z-index: 1000 !important;
	}
	
	.slicknav_btn {
		float: left;
	}
	
	.requestdemo {
		margin: 0px;
	}	
	
	#logo-responsive {
		position: absolute;
		right: 6px;
	}
	
	#logo-responsive img {
		height: 48px;
		width: 130px;
		float: right;
	}	



	#involve {
		padding-top: 18px;
		font-size: 30px;
	}
	
	#involve-tagline {
		padding-top: 7px;
		font-size: 24px;
	}
	
	#getstartedBtn {
		padding-top: 32px;
	}


	.swiper-container {
		  height: 320px;
	}	
	.swipeHeadline {
		font-size: 36px;	
	}
	
	
	
	a.getstarted {
		font-size: 19px;
		padding: 10px 50px;
	}	

	h1 {
		font-size: 24px;
	}

	h2 {
		padding-top: 0px;
		padding-bottom: 12px;
	} 
	
	.anEventImage {
		max-width: 40%;
		float: left;
	}
	.anEventDescription {
		padding-left: 12px;
		max-width: 60%;
		float: left;
	}	
	
	.priceTable {
		width: 90%;
	}
	
	.priceHeading {
		font-size: 1.3em;	
	}
	
	.priceText {
		font-size: 1.0em;
	}
	
	#blog .leftContent {
		width: 100%; 
		float: none;
		padding-right: 10px;
	}
	
	#blog .rightContent {
		display: none;
	}		

	#blog .mobileSearch {
		display: block;
		margin-bottom: 24px;
	}
}

@media screen and (max-width : 601px) {
	
	#involve {
		padding-top: 12px;
		font-size: 22px;
	}
	
	#involve-tagline {
		padding-top: 6px;
		font-size: 16px;
	}

	#getstartedBtn {
		padding-top: 12px;
	}
	a.getstarted {
		font-size: 14px;
		padding: 8px 40px;
	}	


	.getstartedBtn {
		margin-top: 20px;
	}


	.itemContainer_row2 {
		padding-top: 0px;
	}	
	.item5, .item5last, .item2, .item2last, .item3, .item3last {
		float: none;
		margin: 0 0 30px;
		width: 98%;
	}
	
	.item2last {
		margin-top: 60px;
	}
	
	.anEvent {
		padding-bottom: 24px;
	}	

	.anEventImage {
		max-width: 95%;
		float: none;
	}
	.anEventDescription {
		padding-left: 0px;
		max-width: 95%;
		float: none;
		line-height: 1.0em;
	}	
				

	.priceTable {
		width: 100%;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 24px;
	}
	
	.priceText {
		font-size: 1.0em;
	}

	.zeroPercent {
		font-size: 1.0em;
	}

	.featureTable {
		width: 100%
	}

	#getStartedPopup {
		max-width: 75%
	}
	.popupTitle {
		font-size: 28px;
	}
	
	.blog_icon_left {
		float: none; 
		width: 100%;
	}	

	.blog_text_right {
		float: none; 
		width: 100%;
		padding-bottom: 12px;
	}
		
}

@media screen and (max-width : 361px) { /* only do this if the screen size becomes less than 368px */

	#involve {
		padding-top: 6px;
		font-size: 17px;
		letter-spacing: -1.5px;	
	}
		
	#involve-tagline {
		padding-top: 3px;
		font-size: 14px;
		margin-left: 2em;
		margin-right: 2em;
	}
	
	#getstartedBtn {
		padding-top: 12px;
	}
	
	.featuredEventItem {
		margin-right: 0px;	
	}
	
	.swipeHeadline {
		font-size: 28px;	
	}
	
	
	a.getstarted {
		font-size: 14px;
		padding: 5px 25px;
	}	
			
	
	.leftContent {
		width: 100%; 
		float: none;
		padding-right: 0px;
	}
	
	.rightContent {
		width: 100%; 
		float: none;
		padding-left: 0px;
	}
	
	.leftFooter {
		width: 100%; 
		float: none;
	}
	
	.rightFooter {
		width: 100%; 
		float: none;
	}
	
	.borderFooter {
		margin-top: 6px;
		padding-top: 6px;
		padding-left: 0px;
		border-left-color: #fff; 
		border-left-width: 0px; 
		border-top-width: 1px; 
		border-top-style: solid;
	}
	
	h2, h3 {
		padding-top: 0px;
		padding-bottom: 12px;
	} 
	
	h2 {
		font-size: 24px;
	} 
	
	h3 {
		font-size: 28px;
	}
	
	.belowImg {
		padding-top: 12px;
	}		
	
	.learnmore {
		display: none;
	}	
	
	.learnmore-mobile {
		padding: 12px 0px;
		display: block;
	}		
	
	#tour {
		width: 280px;
		height: auto;
	}
	#facelike img, #twitterfollow img {
	  max-width: 36px;
	  height: auto;
	}
	
	img.half-mobile {
	  border: 0;
	  width: 40%;
	  height: auto;	
	  display:block;  /*to resolve 3px bottom margin of every image in div */	
	}	
	

 	#blog img.blogListImage {
		width: 100%;	
	}
	
	.text11 {
		font-size: 8px;	
	}

	#bg_strip .demo_button{
		display: block;
		padding-bottom: 9px;
		margin: 0 auto;
		width: 100%;
	}
	
	#bg_strip .buttonArea {
		padding: 0px;	
	}


}

@media screen and (min-width : 50px) and (max-width: 321px) { /* only do this if the screen size becomes less than 320px */

	#involve {
		padding-top: 6px;
		font-size: 15px;
		letter-spacing: -1.5px;	
	}
	
}