/*//////////////// 
////////////////// 
////
////	Tales of Things
////	
////	Responsive CSS
////	@Ollie Lindsey
////	Play Nicely Ltd.
////
///////////////////
/////////////////*/

@media (min-width: 768px) and (max-width: 979px) { /* iPad/Tablet/Widescreen Desktop */
}

@media (max-width: 959px) { /* Tablet/Small Desktop */

	#tot-id1-info img { width: 100%; height: auto; }

	.fw { width: 95%; margin-left: auto; margin-right: auto; }
	
	#id1 img { width: 100%; height: auto; }
	
	#tot-page h1 { width: 146px !important; }
	
	h2 { display: none; }
	h2 { margin-top: 0; }
	
	nav#tot-primary {
		width: 100% !important;
		background: transparent url(img/primary-nav-tablet.png) left center no-repeat;
		margin-top: 0;
		padding-top: 58px;
		position: relative;
	}
	
	nav#tot-secondary {
		background: transparent url(img/thing-collection-toggle-tablet.png) top left no-repeat;
		width: 375px;
	}
	
	body form input.tot-submit-large, body form .tot-button-large { margin-top: 0; }	
	a.sound { clear: left; }
	
	.tot-select-surround {
		float: left;
		padding-bottom: 10px;
		margin-left: 0;
        }
       
}

@media (max-width: 660px) { /* iPhone 5 */
         
	h1 { pointer-events: all; }
	
	#tot-search { width: 160px; }
	
	#tot-related-things { position: relative; top: auto; right: auto; margin: 18px 0; float: none; clear: left; width: 100%; }	
	#tot-search { width: 370px; margin-top: -20px;   }
	#tot-breadcrumbs { display: none; }

	.col { float: none !important; width: 100% !important; margin-left: 0 !important; }
	
	.col-16-0_5, 
	.col-16-1, 
	.col-16-1_5, 
	.col-16-2, 
	.col-16-2_5, 
	.col-16-3, 
	.col-16-3_5, 
	.col-16-4, 
	.col-16-4_5, 
	.col-16-5, 
	.col-16-5_33,
	.col-16-5_5, 
	.col-16-6, 
	.col-16-6_5, 
	.col-16-7, 
	.col-16-7_5, 
	.col-16-8, 
	.col-16-8_5, 
	.col-16-9, 
	.col-16-9_5, 
	.col-16-10, 
	.col-16-10_5, 
	.col-16-11, 
	.col-16-11_5, 
	.col-16-12, 
	.col-16-12_5, 
	.col-16-13, 
	.col-16-13_5, 
	.col-16-14, 
	.col-16-14_5, 
	.col-16-15, 
	.col-16-15_5, 
	.col-16-16 { float: none !important; width: 220px !important; margin-left: 0 !important; }
	
	.fw { width: 90%; margin-left: auto; margin-right: auto; }
	
	#tot-page h1 { float: left !important; width: 146px !important; }
	
	h2 { display: none; }
	h2 { margin-top: 0; }
	
	footer { min-height: 360px; background-position: bottom center; }
	footer .inner { border-right: 0; margin-right: 0; }
	
	footer ul { margin-bottom: 18px; }
	
	nav#tot-primary {
		background: transparent url(img/primary-nav-mobile.png) left center no-repeat;
		margin-top: 10px;
		padding-top: 28px;
		padding-bottom: 10px;
		float: left;
		padding-left: 150px;
	}
	
	nav#tot-primary > ul { padding-left: 5px; width: 98%; }
	
	nav#tot-primary > ul li { margin-right: 5px; float: none; font-size: 2em; }
	
	nav#tot-primary form { margin: 0; z-index: 999999; width: 98%; }
	
		nav#tot-primary form option,
		nav#tot-primary form select { width: 100px; }
	
	#tot-tools { top: 0; }
	
	nav#tot-primary .dk_container.dk_theme_tot {
		margin-bottom: 0;
		padding-bottom: 0;
	}
	
	nav#tot-primary .tot-select-surround {
		margin-left: 5px;
		float: left;
	}
	
	.dk_theme_tot .dk_options_inner, .dk_theme_tot.dk_touch .dk_options, .dk_theme_tot .dk_toggle {
		width: 75%;
	}
	
	#tot-related-things { position: relative; top: auto; right: auto; margin: 18px 0 }
	
	/*
	nav#tot-primary > ul li { right: 50%; }
	nav#tot-primary > ul { left: 50%; }
	*/
	
	nav#tot-primary ul.dk_options_inner { padding-left: 0; }
	
	nav#tot-secondary { display: none; }
	
	nav#tot-secondary {  background-position: top center; padding-bottom: 26px; }
	nav#tot-secondary li { float: left !important; width: 49.5% !important; }
	
		nav#tot-secondary li:first-child a.active,
		nav#tot-secondary li:first-child a:hover { color: #fff !important; background: #f05a25; }
		
		nav#tot-secondary li:last-child a.active,
		nav#tot-secondary li:last-child a:hover {  color: #fff !important; background: #f05a25; }
	
	#tot-breadcrumbs { display: none; }
	
	#tot-login-inner, #tot-login-info-inner,
	#tot-id1-info .col-inner { padding-left: 0; }
	
	#tot-signup-inner, #tot-signup-info-inner,
	#tot-id1-gallery ol { padding-left: 0; margin-left: 0; }
	
	.tot-tale-media .video,
	.tot-tale-media .pictures,
	.tot-tale-media .text,
	.tot-tale-media .sound { float: left; }
	
	#tot-share-options { margin-top: 10px; padding-top: 0; }
	
	#tot-tale-comment { width: 100%; }
	
	body form input.tot-submit-large, body form .tot-button-large { margin-top: 0; }
	
	
	#tot-thing-tales-menu { border-top: 1px dotted white; margin-top: 12px; padding-top: 12px; }
	
	#tot-thing-tales-menu .add-new { float: right; }
	
	#tot-thing-tales-menu .nav-tabs { float: left; width: 100%; }
	
	#tot-collection-chooser label > span { font-size: 1.2em; text-align: left; clear: both; display: block; position: relative; }
	
	#tot-collection-chooser select,
	#tot-collection-chooser option { width: 100%; }
	
	#tot-thing-detail img.hero { margin-bottom: 15px; }
	
	#tot-thing-title, .tot-title { margin-top: 10px; }
	
	img { height: auto; }
	
	#tot-search { margin-top: -0px; max-width: 390px; }
	
	#tot-search input.tot-text {
		max-width: 275px !important;
	}
	
	#tot-search input.tot-search-submit {
		padding: 6px 0;
	}
	
	#tot-search .tot-search-submit { font-size: 1.4em; }
	
	#tot-search input.tot-text {
		margin-top: 9px;
		border-bottom: none !important;
	}
	
	form#tot-login .tot-cancel {
		float: right;
		clear: both;
		margin-top: 0;
		margin-right: 0;
	}
	
	form#tot-login label span { font-size: 1em; }
	
	.tot-grid .tot-grid-list { padding-left: 0; margin-left: 0; }
	
	body .tot-grid ul.tot-grid-list li,
	body .tot-grid ul.tot-grid-list { left: auto!important; right: auto!important; }
	
	nav#tot-collections-categories {
		background: none;	
	}
	
	nav#tot-collections-categories ul {
		display: none;
	}
	
	#tot-categories-mobile { display: block; }
		#tot-categories-mobile select { background: transparent url(img/thing-incollection-bg.png) top right no-repeat; padding-bottom: 10px; padding-top: 5px; margin-top: 10px; width: 100%; }
	
}

@media (min-width: 980px) { /* Widescreen*/

}

@media (min-width: 1200px) { /* Super Widescreen*/

}