/*
Responsive Template Name: RS-1200 Prototype 38
File: Media Queries CSS
Author: OS Templates
Author URI: http://www.os-templates.com/
Licence: <a href="http://www.os-templates.com/template-terms">Website Template Licence</a>
*/

@-ms-viewport{width:device-width;} /* http://msdn.microsoft.com/en-gb/library/ie/hh869615%28v=vs.85%29.aspx */


/* 768px */

@media screen and (min-width:616px) and (max-width:960px) {
	#header, #intro, #container, #footer, #copyright{max-width:960px; margin:0 auto;}
	
	/*#topnav ul{display:none;} */
	form input[type="submit"]{margin-bottom:10px;}
	
	#username, #password {width: 90%;}
	#newPassword, #oldPassword, #confirmPassword{width: 90%;}
	
	.calltoaction.opt4 div{display:block; float:none; width:100%; margin:30px 0 0 0;}
	.calltoaction.opt4 div:first-child{margin-top:0; text-align:center;}
	.calltoaction.opt4{font-size:1.5em;}
	
	#fof{padding:30px 0 0 0;}
	#fof h1{margin-top:0; font-size:12em;}
	#fof h2{margin-top:0;}
	form input[type="submit"], form input[type="reset"] {
		padding: 5px 8px;
	}
	#header #header-contact { width: 45%;}
	.drop { width: 24px;}
	#mainNav {}
	#cart {}
	#sidebar_1 {background: none repeat scroll 0 0 #EBEBEB; margin-left: 0; width: 25%; margin-bottom: -3000px; padding-bottom: 3000px;}
	#container_info {font-size: 0.9em;}
	#mainContent {margin: 0 0 0 2%; width: 73%; margin-bottom: -3000px; padding-bottom: 3000px;}
	.accordion-wrapper .accordion-title, .toggle-wrapper .toggle-title {
    background-color: #189ACB;
    background-image: url("../../images/plus-16x16.png");
    }
    .resultsViewPagination { float: left; margin-left: 0%;}
	#footerContact {float: left; padding: 0 30px 30px; border: none; width: 590px;}
	#footer .contact li, #footer .contact li a {width: 400px;}

	#footer .contact li, #footer .contact li a {color: #FFFFFF; font-size: 1.2em;}
	
	#footerAccount, #footerShop, #footerSupport { padding-left: 40px; width: 25%; }
	#footerShop {margin-left: 15px;}
	#footerSupport {margin-left: 10px;}
	#footerContact { margin-left: 10px;}
	#copyright {padding: 25px 0 15px;}
	
	.resultsViewTypes {color: #FFFFFF; float: left; margin-left: -5px;}
	.resultsViewSort {border: medium none; float: right; font-size: 11px; padding: 0;}
	.twoColumnSection {width: 45% !important;}
	.conventionFieldSet {float: left;margin-top: 0;padding: 10px 2px 10px 22px;}


	.label_form_checkboxtxt { /* style for label next to checkbox */
	display: inline-block;
    left: 4px;
    position: relative;
    top: 28px;
    width: 130px;
	}
	
	.searchResult_gridView_fiveColumnSection .column {display: inline;float: left;height: 130px;width: 22.5%;}
	.templateCell {font-size: 10px;margin: 2px 12px 40px;padding: 10px;position: relative;width: 218px;}
	#image_container {margin: 0 auto !important;}
	/*.templateCell a .customizeButton {margin:19px;}*/
	.column.templateCell {text-align: center;}
	
	#createTemplateForm #fileListId .resultsTable {margin: 0 20px 0 0 !important; width: 100% !important; }
	
	
	/* ----- tiles  ----- */
	#expired_items p {line-height: 30px; padding: 82px 0;}
	#resource_center p {line-height: 22px; padding: 12px 0;}
	#recent_orders p {line-height: 23px; padding: 33px 0;}
	#announcement p {font-size: 21px;}
	
	
	
}

/* 960px */

@media screen and (min-width:960px) {
	body.boxed .wrapper{width: 960px;}
	#header, #intro, #container, #footer, #copyright{width: 100%; margin:0 auto;}
	#mainNav{}
	#header #header-contact { width: 37%;}

}

/* 1028px */

@media screen and (min-width:1028px) {
	body.boxed .wrapper{width: 960px;}
	#header, #intro, #container, #footer, #copyright{width: 960px; margin:0 auto;}
	#mainNav{}
	#header #header-contact { width: 37%;}
}

/* 1200px */

@media screen and (min-width:1200px) {
	body.boxed .wrapper{width: 960px;}
	#header, #intro, #container, #footer, #copyright, .stretched{width: 960px; margin:0 auto;}
	#mainNav{}
	#header #header-contact { width: 37%;}
	
}

/* Hide The Jquery Generated Navigation Form from 801px upwards */

@media screen and (min-width:801px) and (max-width:10000px) {
	body.boxed .wrapper{width: 960px;}
	#intro, #container, #footer, #copyright, .stretched{width: 100%; margin:0 auto;}

#header #header-contact { width: 40%;}
}

/* Resize Extended Box */

@media screen and (min-width:1501px) {
	body.boxed .wrapper{width: 960px;}
}