/* ----- Menu CSS ----- */

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

			.logo {

				width: 76%;

				padding: 0 20px 12px 60px;

				

			}

			.logo h1 {

				font-size: 36px;

			}

			.m-menu {

				position: absolute;

				right: 42px;

				top: 18px;

			}

			.logo h1 span {

				font-size: 36px;

			}

			.slogan{

				display: none;

			}

			.header_clr{

				display: none;

			}

			.header_top {

				float: left;

				left: 0;

				min-height: 70px;

				right: 0;

				top: 0;

				width: 100%;

				z-index: 10;

			}

			.position_head {

				float: left;

				position: fixed;

				width: 94%;

				min-height: 70px;

			}

			.topnav.mobile_navbar {

				left: 28px;

				margin-right: 121px;

				position: fixed;

				top: 83px;

				width: 85% !important;

				z-index: 10;

			}

	}



/* ----- Schedule Page CSS ----- */

	.content_title {

		float: left;

		width: 41%;

	}

	.schedule_content{

		float: left;

		width: 59%;

	}

	.content_right{

		margin: 0 15px; float:left;

	}

	.container_title {

		float: left;

		margin-top: 30px;

		width: 100%;

	}

	.center_col {

		margin-top: 15px;

	}

	.text_space {

		padding-left: 7px;

	}



/* ----- Topics Page CSS ----- */	

	#searchform {

		float: left;

		width: 100%;

		padding: 0px;

	}

	.header {

		float: left;

		width: 100%;

	}



/* ----- mobile-responsive small devices----- */

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

	

	#page {

			width: 320px;

		}

	.ques_page{

			width: 314px !important;

		}

	.topnav.mobile_navbar {

			float: left;

			width: 100%;

		}

		.topnav.mobile_navbar li {

				width: 100%;

			}

	.menu_icon {

			width: 35px;

			height: 5px;

			background-color: black;

			margin: 6px 0;

			

		}

	.mobile_navbar {

			display: none;

		}

		.m-menu{

				cursor: pointer;

			}

	.blog_body .bloog1 {

			padding: 5px 0 15px;

			width: 323px;

		}

		.blog_body .bloog1.last {

				padding: 5px 0 15px;

				width: 323px;

			}

	#welcomeScroller {

			width: 90%;

		}

	#welcomeScroller #scrollerTitle {

			width: 180px;

		}

	#welcomeScroller #scrollableText {

			width: 130px;

		}

	#featured {

			height: auto;

			width: 100%;

		}

	.d-fragments {

			float: left;

			width: 100%;

		}

	#featured ul.ui-tabs-nav {

			float: left;

			left: 0;

			position: relative;

			top: 0;

			width: 100%;

		}

	.desktop_feature {

			float: left;

		}

	#featured .ui-tabs-panel {

			width: 320px;

		}

	#fragment-1 > a, #fragment-2 > a, #fragment-3 > a, #fragment-4 > a {

			float: left;

			width: 100%;

		}

	#fragment-1 img, #fragment-2 img, #fragment-3 img, #fragment-4 img {

			float: left;

			width: 100%;

		}

	#centercol {

			float: left;

			width: 100%;

		}

	.table_des {

			margin-bottom: 40px;

			float:left; width: 100%;

		}

	.table-img{

		float:left; width: 100%;

		}

	#rightcol {

			float: left;

			width: 100%;

		}

	.mob-video {

			height: 258px !important;

			width: 313px !important;

		}

	.schedule_img{

			width: 100%;

		}

	.content_title {

			float: left;

			width: 100%;

		}

	.schedule_content{

			float: left;

			width: 100%;

		}

	.content_right{

			margin: 20px 0 0;

		}

	.center_col{

			width: 100% !important;

		}

	.text_space {

			padding-left: 0px;

		}

	.post-title{

			float: left;

			width: 100%;

		}

	#footer{

			width: 100%;

			float:left;

		}

	.topic_page{

			float: left;

		}

	.header{

			width: 100%;

			float: left;

		}

	.search_form{

			width: 100%;

			float: left;

		}

	.about_img {

			height: 115px;

			width: 319px;

		}

	table.join_table {

			float: left;

			width: 100%;

		}

	tbody {

			float: left;

			width: 100%;

		}

		tr {

				float: left;

				width: 100%;

			}

	.smallblack {

			float: left;

			width: 142px;

		}

	.join_page{

			width:313px !important;

		}

	option {

			float: left;

			width: 159px;

		}

	.username {

			margin-left: 24px;

		}

}



/* ----- mobile-responsive medium devices ----- */

@media screen and (min-width: 451px) and (max-width: 667px){

	#page {

			width: 475px;

		}

	.topnav.mobile_navbar {

			float: left;

			width: 100%;

		}

		.topnav.mobile_navbar li {

				width: 100%;

			}

	.menu_icon {

			width: 35px;

			height: 5px;

			background-color: black;

			margin: 6px 0;

		}

	.mobile_navbar {

			display: none;

		}

		.m-menu{

				cursor: pointer;

			}

	.blog_body .bloog1 {

			padding: 5px 0 15px;

			width: 430px;

		}

		.blog_body .bloog1.last {

				padding: 5px 0 15px;

				width: 430px;

			}

		#welcomeScroller {

				width: 90%;

			}

		#welcomeScroller #scrollerTitle {

				width: 180px;

			}

		#welcomeScroller #scrollableText {

				width: 250px;

			}

		#featured {

			height: auto;

			width: 100%;

		}

		.d-fragments {

			float: left;

			width: 100%;

		}

		#featured ul.ui-tabs-nav {

			float: left;

			left: 0;

			position: relative;

			top: 0;

			width: 100%;

		}

		.desktop_feature {

			float: left;

		}

		#featured .ui-tabs-panel {

			width: 427px;

		}

		#fragment-1 > a, #fragment-2 > a, #fragment-3 > a, #fragment-4 > a {

			float: left;

			width: 100%;

		}

		#fragment-1 img, #fragment-2 img, #fragment-3 img, #fragment-4 img {

			float: left;

			width: 100%;

		}

		#centercol {

			float: left;

			width: 100%;

		}

		.table_des {

			margin-bottom: 40px;

			float:left; width: 100%;

		}

		.table-img{

			float:left; width: 100%;

		}

		#rightcol {

			float: left; width: 100%;

		}

		.mob-video {

			height: 412px !important;

			width: 416px !important;

		}

		.box.widget.widget_flickrRSS {

			float: left;

			width: 95%;

		}

		.schedule_img{

			width: 90%;

		}

		.content_title {

			float: left;

			width: 100%;

		}

		.schedule_content{

			float: left;

			width: 100%;

		}

		.content_right{

			margin-top: 20px;

			margin-left: 0px;

		}

		.center_col{

			width: 91% !important;

		}

		.text_space {

			padding-left: 0px;

		}

		.post-title{

			float: left;

			width: 100%;

		}

		#header {

			float: left;

			width: 90%;

		}

		#columns {

			float: left;

			width: 95%;

		}

	#footer{

			width: 100%;

			float:left;

		}

	.topic_page{

			float: left;

		}

	.header{

			width: 100%;

			float: left;

		}

	.search_form{

			width: 100%;

			float: left;

		}

	.about_img {

			height: 158px;

			width: 427px;

		}

		

}



/* ----- mobile-responsive for scroll ----- */

@media screen and (min-width: 448px) and (max-width: 513px){

	#page {

			width: 403px;

		}

	#footer{

			width: 100%;

			float:left;

		}

	#featured .ui-tabs-panel {

			width: 363px;

		}

	#welcomeScroller #scrollableText {

			width: 210px;

		}

	.blog_body .bloog1 {

			width: 404px;

		}

	.blog_body .bloog1.last {

			width: 404px;

		}

	.topic_page{

			float: left;

		}

	.header{

			width: 100%;

			float: left;

		}

	.search_form{

			width: 100%;

			float: left;

		}

	.about_img {

			height: 140px;

			width: 363px;

		}

}



/* ----- mobile-responsive large devices ----- */

@media screen and (min-width: 668px) and (max-width: 768px){

}



/* ----- mobile-responsive xlarge devices----- */

@media screen and (min-width: 769px) and (max-width: 891px){

}