@media screen and (max-width: 900px) {
	html {
		background: none;
	}

	body {
		background: none !important; /* To hide Zen circle in narrow browsers */
	}

	.shadow {
		display: none;
	}

}

@media screen and (max-width: 880px) {
	.logo {
		margin-top: 5px;
	}

	.artificially-narrowed {
		width: 62%;
	}

	.alerts {
		display: none;
	}
}

@media screen and (max-width: 830px) {
	/*
		Minor corrections to account for fixed-width right side log
	*/

	.artificially-narrowed {
		width: 56%;
	}

	.sessionfeed {
		width: 60%;
	}
	.sessionfeed-boxes {
		width: 94%;
	}
	.all-users {
		display: none;
		width: 1%;
	}
	.followed-users {
		width: 64%;
		margin-right: 1%;
	}
	.totaltoday {
		width: 28%;
		margin-left: 1%;
	}

	.counter {
		font-size:150px;
	}

	/* Styling for "Benefits of meditation" visualizer */
	div.benefit-box, div.benefits-field {
		width:50%;
	}
}

@media screen and (max-width: 680px) {

	.logo {
		margin-top: 12px;
	}

	/*
		Pop recently logged stuff in line
	*/
	.artificially-narrowed {
		width: 100%;
	}
	.sessionfeed {
		width: 90%;
	}
	.sessionfeed-boxes {
		width: 70%;
	}

	.notificationholder .inbutton {
		width: 97%;
		left: .1em;
	} 
	.inbutton {
		width: 98%;
		left: .1em;
	}

	.index-log-holder {
		float: left;
		width: 100%;
		border: none;
		padding: 1em 0 0 0;
		margin: 0;
	}
	.quick-log-stats {
		display: none;
	}

	.post-container {
		max-width: 89%;
		min-width: 70%;
	}
	.forum-post {
		max-width: 88%;
		min-width: 64%;
	}
	.personal-sitlog {
		font-size: 76%;
	}

	.sitlogcontent-narrowed {
		width: 96%;
	}

	.nav-category {
		font-size: 90%;
		width: 48%;
		margin: .6em .8%;
	}

	.goalside {
		clear: left;
		width: 100%;
		border-left: none;
	}
	.goalmain {
		width: 100%;
	}

	iframe {
		max-width: 100%;
	}


	.counter {
		font-size:80px;
	}

	/* Styling for "Benefits of meditation" visualizer */
	.benefit-details .benefit-description, .benefit-details .benefit-meta-details {
		font-size:.8em;
		line-height: 1.1em;
	}

}

@media screen and (max-width: 480px) {

	.logo {
		margin: 6px 27% 2px 27%;
		width: 46%;
	}

	#topdiv .right {
		width: 96%;
		margin: 0px 2% 2px 2%;
	}

	.half-column {
		width: 100%;
		padding: 0;
		min-width:0;
	}

	.landingpage-title {
		font-size: 2.1em;
		font-weight: bold;
	}

	.col-caption h2 {
		font-size: 1.3em;
	}

	.sessionfeed-boxes {
		width: 94%;
	}

	.logged-in-as {
		display: none;
	}

	.nav-category {
		font-size: 90%;
	}

	.shortentext {
		width: 95%;
	}

	.signup {
		display:block;
		margin-top:.6em;
	}

	.globalfiveplus {
		display: none;
	}

	#timerholder td.tdlayout {
		font-size: 18px;
	}

	td.holdsbell {
		text-align:left;
	}

	.bell {
		margin:0;
	}

	/* Styling for "Benefits of meditation" visualizer */

	div.benefit-box {
		width:100%;
	}

	div.benefit-box div.benefit-title {
		font-size: 1.4em;
	}

	.benefit-details .benefit-description, .benefit-details .benefit-meta-details {
		font-size:1em;
		line-height:1.4em;
	}

}

@media screen and (max-width: 380px) {
	.logo {
		margin: 6px 17% 2px 17%;
		width: 66%;
	}

	.counter {
		font-size:70px;
	}

	/* Styling for "Benefits of meditation" visualizer */
	.benefit-details .benefit-description, 
	.benefit-details .benefit-meta-details {
		line-height: 1.1em;
	}

	.benefits-field {
		font-size: .9em;
	}

	.benefits-field-contents input {
		font-size: 30px;
	}


}

@media screen and (max-width: 318px) {
	.nav-category {
		width: 98%;
	}
}

@media screen and (max-width: 282px) {
	#topdiv .right {
		width: 80px;
	}

	.counter {
		font-size:50px;
	}

	/* Styling for "Benefits of meditation" visualizer */
	.benefit-details .benefit-description, .benefit-details .benefit-meta-details {
		font-size:.8em;
	}

}

@media screen and (max-width: 220px) {
	.logo {
		margin-top: 20px;
		width: 27%;
	}

	#counter2 {
		display:none !important;
	}

}

@media 
screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 400px), 
screen and (   min--moz-device-pixel-ratio: 2) and (max-width: 400px), 
screen and ( -o-min-device-pixel-ratio: 2/1) and (max-width: 400px), 
screen and ( min-device-pixel-ratio: 2) and (max-width: 400px), 
screen and (min-resolution: 192dpi) and (max-width: 400px), 
maxscreen and (min-resolution: 2dppx)  and (max-width: 400px) { 

  /* Small screen, retina, stuff to override above media query */

	body {
		font-size: 72%;
	}

	.benefit-details {
		font-size: 160%;
	}

	.content, p {
		line-height: 1.2em;
	}
}
