/* Landscape phones and smaller */


@media (max-width: 700px){
	#white3cirlces .desc{
		text-align: justify;
	}
	#login_wrapper {
		padding: 0;
	}
	#guest_wrapper {
		position: absolute;
		width: 100%;
		margin: 0px auto;
		padding-top: 0;
	}
	
	.user-line{
		padding: 0px 15px;
	}
	
	 #white3cirlces ul li{
		padding: 15px;
	}
	
	 #white3cirlces ul li{
		clear: both;
		width: 100%;
	}
	
	#white3cirlces ul li img{	
		/*float: left;*/
		margin-right: 10px;		
		width: 150px;
	}
	#paralax1 .inner{
		padding-top: 20px;
		padding-bottom: 20px;
	}
	
	a.ghostButton{
		display: block;
	}
	
	#screenShots .inner{
		min-height: auto;
	}
	
	#screenShots .inner .textContainer{
		width: 100%;
		text-align: center;
		margin: 0 auto;
		background-color: rgba(255,255,255, 0.8);
	}
	
	#password_reset {
		width: 100%;
	}
	#password_reset input{
		max-width: 100%;
	}
	
	#registrationSection h2 {
		margin-bottom: 24px;
	}
	
	#registrationSection .subTitle {
		margin-bottom: 24px;
	}
	
	#registrationSection .user-input {
		margin-bottom: 0px;
	}
	.one-of-two {
		width: 100%;
		margin-bottom: 20px;
	}
	
}

@media (max-width: 360px){
	#paralax1 .inner {
		font-size: 1.2em !important;
		padding: 40px 10px !important;
	}
	#white3cirlces .desc{
		padding:15px;
		text-align: justify;
	}
	#user_login .login-button-box{
		margin-bottom: 15px;
		float: left;
		position: relative;
		width: 100%;
	}
	#user_login .login-button-box #login-button{
		width:100%;
	}
	#loginRegButton{
		float: left;
		position: relative;
		width:100%;
		text-align: center;
		margin-bottom:15px;
	}
	#loginRegButton:hover{
		color:#fff;
	}
	#menu-icon{
		margin-right:0 !important;
	}
	#white3cirlces ul li img{	
		display: none;
	}
	#white3cirlces ul li {
		padding: 8px;
	}
	#headerRegButton{
		display: none;		
	}
	#loginRegButton{
		display: block;		
	}	
	
	#login_wrapper {
		padding: 5px;
		margin: 0 auto;
	}
	#login-button{
		float: left;
	}
	
	#screenShots .inner .textContainer{
		width: 100%;
		margin: 0 auto;
		background-color: none;
	}	
	
	#guest_wrapper {
		position: absolute;
		width: 83%;
		margin: 0px auto;
		padding-top: 0;
	}
	.user-line{
		padding: 0px 15px;
	}
	#login_wrapper {
		padding: 0;
	}
	
	#login_wrapper .login-box .info_text {
		line-height: 19px;
	}
	.benefits .inner{
		padding: 5px;
	}
	.benefits .inner .title1, .benefits .inner .title2{
		margin	: 5px 10px;	
		display: block;
	}
	.benefits .inner ul {
		margin-left: 22px;
		margin-top: 15px;
		margin-bottom: 15px;
	}
	
	#features .inner .left ul {
		margin: 0 auto;
		width: 95%;
	}
	
	#registrationSection h2{
		font-size: 23px;
	}	
	#registrationSection .subTitle {
		font-size: 18px;
	}	
	
	#registrationSection .left .user-input {
		margin-bottom: 23px;
	}
	
	#activate-account-wrapper #activate-cloud{
		display: none !important;
	}
	#activate-header h1, #activate-header h2, #activate-header h3 {
		line-height: 20px !important;
		font-size: 18px !important;
	}
	#activate-account-wrapper .user-names{
		font-size: 17px !important;
	}
	#activate-account-wrapper .user-text{
		font-size: 14px !important;
	}
	#activate-account-wrapper form label{
		font-size: 14px !important;
	}
	#content.activate-outer #activate-account-wrapper #activate-button{
		font-size: 12px !important;
	}
	#features .inner .left, #features .inner .right {
		max-width: 100%;
		margin: 20px auto 0 auto !important;
	}
	#features .inner .mod-tabs span{
		margin-bottom:20px;
	}
	#features .inner .right ul{
		margin-top:0;
	}
	#prices .inner .plan{
		width:300px !important;
	}
	#prices .inner .plan .bottom .pricesButton a{
		display: block;
		text-align: center;
	}
	#features .inner .mod-tabs ul li i {
		font-size: 1.2em;
	}
	#features .inner .mod-tabs ul li a {
		font-size: 17px !important;
	}
	#features .inner .mod-tabs ul li {
		padding: 15px 2px !important;
	}
	#registrationSection .orange-section-toggle{
		max-width: 280px;
	}
	#screenShots .inner .textContainer .desc{
		padding: 15px 16px 40px;
		text-align: justify;
		font-size:18px;
	}

	#password-box.technical-offline .static_cloud{
		display: none;
	}
}

@media (max-width: 480px){
	#content.activate-outer #playGround {
		padding-top: 247% !important;
	}
	#playGround{

	}
	#login_wrapper.change-login .change-login-buttons #btn-login{
		font-size:15px;
	}
	#features .inner .mod-tabs ul li a{
		font-size:18px;
	}
	.regButton{
		font-size: 12px;
		padding: 10px;
	}
	#menu-icon{
		margin-right:0 !important;
	}
	#activate-account-wrapper #activate-cloud {
		display: none !important;
	}
    #playGround {
        padding-top: 150% !important;
    }
    #guest_wrapper{
        width: 100%;
    }
    #login_wrapper{
        width:100% !important;
    }
    #login_wrapper .login-box{
        padding: 7px !important;
    }
    #user_login .user-line .input-box input{
        float: left;
        width:100%;
    }
	#paralax1 .inner {
		font-size: 1.2em !important;
		padding: 40px 15px;
	}

	#playGround.headerOnly{
		height: 1450px !important;
		float: left;
		position: relative;
		padding-top:0 !important;
	}

	#reg-box-events {
		top: 120% !important;
		padding:0;
	}
	#ev-program-left{
		float: left;
		width: 100%;
		height: auto;
	}
	#ev-program-right{
		width:100%;
		margin-top:40px;
	}

	#ev-program-right,
	#ev-program-left{
		padding:5px 10px;
	}
	#reg-box-events .text-danger {
		font-size: 13px;
	}

	#password-box.technical-offline .static_cloud{
		top: -80px;
	}
}

@media (max-width: 640px){

	.benefits .inner .title1{
		float: left;
		position: relative;
		width:100%;
		text-align: center;
		margin-left:0;
	}
	.benefits .inner .title2 {
		color: #f8862c;
		font-size: 38px;
		float: left;
		position: relative;
		width: 100%;
		text-align: center;
		margin: 21px 0;
	}

	#activate-account-wrapper #activate-cloud {
		position: absolute;
		right: -45px !important;
		top: -20px !important;
		width: 150px;
	}
	#prices .inner .plan{
		margin: 0 auto;
		width: 320px;
		float: none;
	}
	#prices .inner .plan{
		margin-bottom:20px;
	}
}

@media (max-width: 720px){
	#content.activate-outer #playGround {
		padding-top: 150%;
	}
	#playGround {
		padding-top: 90%;
	}
	#activate-account-wrapper #activate-cloud {
		position: absolute;
		right: -45px !important;
		top: -20px !important;
		width: 150px;
	}

	#registrationSection .controls li{
		margin-right:0;
	}
	#registrationSection .controls li:first-child{
		margin-bottom:30px;
	}
	#registrationSection .nav-tabs {
		float: none;
		margin: 0 auto;
		width: 300px;
	}
}

@media (max-width: 860px){
	#activate-account-wrapper #activate-cloud {
		position: absolute;
		right: -60px !important;
		top: -40px !important;
		width: 200px;
	}
	#content.activate-outer .activate-wrap{
		width: 80%;
	}
}

@media (max-width: 1000px){
	#guest-main-nav{
		float: left;
		position: relative;
		width:100%;
	}
	#guest-main-nav ul{
		float: left;
		position: relative;
		width:100%;
	}
	#guest-main-nav ul li{
		text-align: center;
		margin-top: 0px;
	}
	#activate-account-wrapper #activate-cloud {
		position: absolute;
		right: -60px !important;
		top: -40px !important;
		width: 200px;
	}
	#login-chrome-warning{
		display: none !important;
	}
}

/* Landscape phones and portrait tablets */
@media (max-width: 767px){
    #login_wrapper{
        padding: 42px 20px 20px;
    }
	#features .inner .middle{
		display: none;
	}
	#paralax1 .inner {
		font-size: 1.8em;
	}
	#playGround.headerOnly{
		height: 1290px;
		float: left;
		position: relative;
		padding-top:0;
	}

	#reg-box-events {
		top: 126%;
	}
	#ev-program-left{
		float: left;
		width: 100%;
		height: auto;
	}
	#ev-program-right{
		width:100%;
		margin-top:40px;
	}

}

@media (max-width: 1000px){

	header .inner{
		padding-bottom: 2px;
		padding-top: 2px;
	}
	#menu-icon {
		display:inline-block;	
		margin-left: 35px;
	}

	header {
		position: absolute;
		height: auto;
		z-index: 1001;
		
	}

	#menu-icon {
		display:inline-block;
		float: right;
		margin-right: 35px;
		
	}
	nav{
		display: none;
		z-index: 1001;
	}
	
	#mainmenu{
		margin: 0;
		z-index: 1001;
	}

	nav ul, nav:active ul { 
		/*display: none;*/
		/*background: #444;		*/
		/*border-radius: 4px 0 4px 4px;*/
	}

	nav li {
		text-align: left;
		width: 100%;
		padding: 10px 0;
		margin: 0;
	}

	nav:hover ul {
		/*display: block;*/
	}
	
	nav a{
		width: 100%;
		/*background: red;*/
		display: block;
	}
	
	#headerRegButton{
		float: right;
	}
	.zopim{
		display: none;
	}

}

@media (min-width: 1001px) and (max-width: 1064px){

	#mainmenu li{
        padding: 15px 5px;
    }

    .regButton{
		padding: 10px 15px;
	}

}

@media (min-width: 720px) and (max-width: 1000px) {
	#playGround{
		padding-top: 74.64%;
	}
}


/* Portrait tablets and small desktops */
@media (min-width: 768px) and (max-width: 991px) {
	#paralax1 .inner {
		font-size: 1.8em;
	}
	#forgot-password{
		position:relative;
		top:-15px;
	}
    #login_wrapper .login-box{
        padding:20px 0 0 0;
    }
	#features .inner .middle{
		display: none;
	}
	#features .inner .mod-tabs {
		max-width: 40.638%;
	}
	#features .inner .left{
		margin-right: 18%;
	}

	#reg-box-events form{
		margin-top:10px !important;
	}
	#reg-box-events form .form-group {
		margin-bottom: 11px !important;
	}
	#reg-box-events{
		height: 605PX;
	}

	#playGround.headerOnly{
		height: 725px;
		float: left;
		position: relative;
	}
	#reg-box-events {
		top: 435px;
	}
}

@media (min-width: 992px) and (max-width: 1199px) {
	#features .inner .middle{
		width: 40.08%;
	}
	#features .inner .middle{
		background-size: 300px;
	}
	#features .inner .mod-tabs {
		max-width: 29.638%;
	}
	#features .inner .mod-tabs ul li{
		padding: 15px 10px;
	}
	#features .inner .mod-tabs ul li a{
		font-size:18px;
	}
	#reg-box-events form{
		margin-top:10px !important;
	}
	#reg-box-events form .form-group {
		margin-bottom: 11px !important;
	}
	#reg-box-events{
		height: 550PX;
	}
	#playGround.headerOnly{
		height: 700px;
		float: left;
		position: relative;
	}
	#reg-box-events{
		top:54%;
	}
	#mainmenu li{
		font-size: 14px;
		padding: 15px 5px;
	}
}

/* Large desktops and laptops */
@media (max-width: 821px) {
    #features .inner {
        background: none;
    }
	#features .inner .mod-tabs span{
		width:100%;
	}

    #features .inner .left,
	#features .inner .right{
        max-width: 100%;
        margin: 0 auto;
    }
}
@media (min-width: 1200px) and (max-width: 1600px) {
	#features .inner .middle{
		width: 44.08%;
	}
	#features .inner .mod-tabs {
		max-width: 27.638%;
	}
	#playGround.headerOnly{
		height: 850px;
		float: left;
		position: relative;
	}
	#reg-box-events{
		top: 400px;
	}
	#content.activate-outer #playGround {
		padding-top: 60%;
	}
}