/* Smartphones (portrait and landscape) ----------- 320 x 480 */
/* Inherits mobile styles, but floats containers to make columns */

/* 	AS THE min-width NUMBER GOES UP, THE CHANGE-OVER FROM 
	DESKTOP RENDERING TO HANDHELD RENDERING COMES SOONER.
	
	min-width: 65em SEEMS LIKE A REASONABLE MOMENT TO LEAVE HANDHELD RENDERING
	WITH THE SIDEBAR WIDGETS/GADGETS GIVEN A HEALTHY PERCENTAGE OF OVERALL BODY WIDTH (45%)
	
	AT EACH LARGER BREAKPOINT, E.G. min-width: 75em, THE SIDEBAR NEEDS LESS REAL ESTATE (35%).
	A GREAT EXAMPLE OF USING MEDIA QUERIES TO REAPPORTION SCREEN REAL ESTATE FROM CONTENT TO SIDEBAR WIDGETS
*/

@media all and (min-width: 27em) {
	div#branding h1#site_title {
		padding-left: 144px;
		/* background-image: url(http://m.vtpaddlers.net/m/m.images/VPC_logo_pms653.png); */
		background-image: url(../2020_images/banners/VPC_logo_pms653.png); /* VPC_logo_b_w_2313_1300.png); */
		background-repeat: no-repeat;
		background-size: contain;
	}
	div#access {
		white-space: nowrap;
		overflow: hidden;
	}
	ul.menu li:first-child {
		display: none !important;
	}
	form#login {
		width: 100%;
		margin: 0;
	}

@media all and (min-width: 38em) {
	div#branding h1#site_title {
		padding-left: 80px;
	}
	div#access {
		white-space: nowrap;
		overflow: hidden;
	}
	form#login {
		width: 80%;
		margin: 0 5em;
	}
}
@media all and (min-width: 65em) {
/* SEE: https://www.tinymce.com/docs/mobile/ FOR A GOOD NEWBIE TUTORIAL WHERE TinyMCE FOR HANDHELD DEVICES IS CONCERNED! */

	div.mce-tinymce, table.mceLayout, textarea.richEditor, textarea.tinymce {
       /* width: 600px !important; */
    }
	div#wrapper div#admin_panel,div#wrapper div#admin_panel * {
		background-color: #000 ! important;
	}
	div#access {
		display : block !important;
	}
	div#glyph_icons {
		display: none !important;
	}
	div#content {
		width: 55% !important;
		float: left;
	}
	div#content.no_widgets {
		width: 100% !important;
		padding: 0 15px !important;
	}
	div#primary_widgets {
		width: 45% !important;
		float: left;
	}
	html {
		padding: 0 10%;
	}
	div#branding h1#site_title {
		display: inline-block;
		background-image: none;
		margin: 0;
		line-height: 1.3em;
	}

	div#branding h1#site_title {
		display: inline-block;
		background-image: none;
		padding-left: 0;
	}
	
	div#site_description {
		/* position: absolute; top: 0; left: 60%; */
		clear : right;
		float : right;
		margin : 15px 0 18px 0;
	}
	div#site_banner_rotating {
		height: 150px !important;
		display: block !important;
		background-image: url(../2020_images/banners/VPC_logo_b_w_2313_1300.png), url(../2020_images/banners/wp_vpc_header_graphic-940x150.jpg);
    	background-position: left top, left top;
    	background-repeat: no-repeat, no-repeat;
		background-size: contain, cover;		
	 }
	a#page_id_1, a#page_id_5 {
		display: inline-block !important;
	}
	div#main {
		clear: both;
	}
	div#content, div#primary_widgets {
		clear: none;
	}
	div#events_calendars table.calendar td {
		line-height: 2em;
	}
	div#colophon {
		clear: both;
	}
	div#access {
		white-space: normal;
		overflow: visible;
	}
	ul.menu li:first-child {
		display: list-item !important;
	}
}

@media all and (min-width: 75em) {
	div#access{
		margin-top: 0px;
	}
	div#content {
		width: 65% !important;
		float: left;
	}
	div#content.no_widgets {
		width: 100% !important;
		padding: 0 15px !important;
	}
	div#primary_widgets {
		width: 35% !important;
		float: left;
	}
	form#login {
		width: 50%;
		margin: 0 10em;
	}
}