/* Smartphones (portrait and landscape) ----------- */
@media only screen and (max-device-width : 480px) {
	/* Styles */
	.header_menu li {
		padding: 0;
	}

	.header_menu .menu a {
		font-size: 10px;
		margin: 0 3px;
		padding: 14px 0;
	}

	.header_logo {
		display: none;
	}
	#q, #s {
		width: 100px;
		height:	8px;
		position: absolute;
		font-size: 5px;
		top: 3px;
		left: -2px;
	}

	#searchsubmit {
		position: absolute;
		left: 115px;
		top: 5px;
		font-size: 7px;
	}


	.random_links {
		padding: 0;
	}

	.header_searchform {
		padding: 0;
	}
	.search_box {
		float: right;
		position: absolute;
		top: 10px;
		width:95%;
		background-color: white;
		border-bottom: 2px solid #10AC84;
		height: 30px;
	}

	.home_picture {
		display: none;
	}

	body .site {
		font-size: 10px;
	}

	.content_wrap {
		max-width: 100%;
		min-width: 0px;
	}

	.content_wrap img {
		max-width: 100%;
	}

	.three_col {
		max-width: 100%;
		width: 100%;
	}

	.two_col {
		max-width: 100%;
		width: 100%;
	}

	.home_content {
		max-width: 100%;
	}

	.search_box {
		display: none;
	}

	.left-panel {
		display: none;
	}

	.right-panel {
		display: none;
	}


	.right-panel-mobile {
		display: block;
	}

	.inner-mobile-menu {
		display: none;
	}

	.mobile-menu-btn {
		background-color: #10AC84;
		width: 30px;
		height: 13px;
		color: #fff;
		padding: 5px;
	}

	.library_col {
		width: 70px;
		font-size: 8px;
	}

	.overview_text.left {
		width: 28%;
		float: left;
	}

	.overview_panel.half {
		width: 100%;
	}

	.overview_panel.full .overview_image {
		margin: 0 10px 0 0px;
	}
}


@media only screen
and (min-device-width : 667px)
and (max-device-width : 1024px)
and (orientation : landscape) {

	.overview_text.left {
		width: 28%;
		float: left;
	}

	.overview_panel.half {
		width: 100%;
	}

	.overview_panel.full .overview_image {
		margin: 0 10px 0 0px;
	}
}


/* Smartphones (landscape) ----------- */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px)
and (orientation : landscape) {
	/* Styles */

	.content_wrap {
		max-width: 460px;
		min-width: 100px;
	}

	.content_wrap img {
		max-width: 460px;
	}

	.three_col {
		max-width: 380px;
		min-width: 380px;
	}

	.two_col {
		max-width: 380px;
		width: 380px;
	}

	.home_content {
		max-width: 460px;
	}

	.library_col {
		width: 120px;
	}

	.search_box {
		width: 97.3%;
	}
}

/* Smartphones (portrait) ----------- */
@media only screen
and (max-width : 320px) {
	/* Styles */
}

/* iPads (portrait and landscape) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) {
	/* Styles */
}

/* iPads (landscape) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape) {
	/* Styles */
	.content_home {
		width: 100%;
	}

	.three_col {
		width:  480px;
		max-width: 480px;
	}

	.content_wrap {
		min-width: 480px;
	}

	.two_col_knowledge {
		width: 675px;
	}

	.lib_t_col {
		width: 330px;
	}

	.two_col {
		width: 680px;
	}
}

/* iPads (portrait) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait) {
	/* Styles */
	.content_home {
		width: 100%;
	}

	.three_col {
		width:  340px;
		max-width: 340px;
	}

	.content_wrap {
		min-width: 340px;
	}

	.two_col_knowledge {
		width: 500px;
	}

	.lib_t_col {
		width: 130px;
	}

	.two_col {
		width: 450px;
	}

	.right-panel {
		width: 150px;
	}

	.left-panel {
		width: 150px;
	}

	.header_logo {
		margin: 0px 0px 0px 20px;
	}

	/*
	.header_searchform {
		padding: 16px 12px 0;
	}
	*/

	.random_links {
		padding: 16px 12px 0;
	}

	.header_menu .menu a {
		font-size: 12px;
	}
}

/* Desktops and laptops ----------- */
@media only screen
and (max-width : 1024px)
and (min-width : 500px) {
	/* Styles */
	.content_home {
		width: 100%;
	}

	.three_col {
		width:  480px;
		max-width: 480px;
	}

	.content_wrap {
		min-width: 480px;
	}

	.two_col_knowledge {
		width: 675px;
	}

	.lib_t_col {
		width: 330px;
	}

	.two_col {
		width: 680px;
	}
}

/* Desktops and laptops ----------- */
@media only screen
and (min-width : 1224px) {
	/* Styles */
}

/* Large screens ----------- */
@media only screen
and (min-width : 1824px) {
	/* Styles */
}

/* iPhone 4 ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5) {
	/* Styles */
}

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

	.header_menu {
		width: 60%;
	}

	.header_menu .menu a {
		font-size: 10px;
	}
}