﻿/* mobile phones */

body						{ background-color: #e8dbe5; }

h1							{ font-size: 1.3em; line-height: 1.6em; }
h2							{ font-size: 1.2em; line-height: 1.6em; }

#wrapper					{ width: 100%; }

#maincontent				{ margin-left: 0; width: 100%; }
#maincontent img			{ max-width: 98%; height: auto; }

#topintro					{ padding-top: 3em; }

.bullet						{ list-style: square; padding: .125em .5em; margin: 0 .25em 0 1em; font-size: 90%; }

#leftside					{ clear: both; width: 100%; margin-left: 0; }
#rightside					{ clear: both; width: 100%; margin-left: 0; }
#contenthome				{ clear: both; width: 100%; margin-left: 0; }

#homecontent				{ margin-left: 0; width: 100%; }
#homecontent h1				{ padding: 0 2.5em; }

#content h1					{ padding: 0 2.5em; }
#homerightside				{ clear: both; float: left; margin-left: 0; width: 100%; }
#homerightside img			{ max-width: 98%; height: auto; }
#mainnavigation ul li a		{ font-size: 1.1em; padding: .5em; }
#rightnav ul li a			{ font-size: 1.1em; padding: .5em; }

#topnav 					{ max-width: 100%; height: auto; margin: .5em .5em 1em .5em; padding: .75em .75em .25em 1em; }

#topnav ul li a				{ float:left; padding: 1em .75em; font-size: 80%; }

#footernav					{ max-width: 100%; height: auto; margin: .5em .5em 1em .5em; padding: .75em .75em .25em 1em; }

#footernav ul li a			{ float:left; padding: 1em .75em; font-size: 80%; }

#leftfooter					{ margin: 0 0 0 1em; }
#leftfooter	img				{ max-width: 90%; height: auto; }
#rightfooter				{ margin: 0 0 0 0; }
#rightfooter img			{ max-width: 90%; height: auto; }
#middlefooter				{ width: 60%; font-size: 80%; }

#advertisingresponsive		{ max-width: 84%; margin: auto .25em auto 1.25em; }

#advertisingresponsivevert	{ max-width: 85%; margin: .375em .25em .375em 1.5em; height: 18em; }

.floaturl					{ float: left; padding: .375em .75em; margin: .125em auto; width: 90%; }

.floaturl2					{ margin-left: 1em; padding: .375em .75em; margin: .125em auto; width: 90%; }

/* Youtube Reflexive */
#contentvideo				{ position: relative; padding-bottom: 50%; padding-top: 2em; height: 0; overflow: hidden; padding: 1em 0; }

#contentvideo iframe, 
#contentvideo object, 
#contentvideo embed			{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

#merchants					{ width: 90%; }

#momborder img				{ max-width: 98%; height: auto; }

#topintro 					{ margin-top: 0; }
#topintro img				{ max-width: 98%; height: auto; }

#contentimages img			{ max-width: 98%; height: auto; }

#advertising img			{ max-width: 98%; height: auto; }

#adivider img				{ max-width: 95%; height: auto; }

#advertisingmerchant img	{ max-width: 95%; height: auto; }

#topfamilypattern p			{ font-size: 80%; }

#directoryboxes				{ clear: both; font-size: 1em; }
.directoryfloat3			{ width: 90%; }
.directoryfloat3 p			{ display: block; margin-left: auto; margin-right: auto; }

.floatnavigate				{ width: 90%; }
.floatnavigate2				{ width: 90%; }

.patternnamesfloat			{ width: 40%; }
.patternnamesfloat2			{ width: 40%; }
.patternnamesfloat3			{ width: 40%; }
.patternnames2float			{ width: 40%; }
.patternnames3float			{ width: 40%; }
.patternnames4float			{ width: 40%; }
.contentsfloat				{ margin-left: 1em;width: 80%; }
.contentsfloat2				{ margin-left: 1em;width: 80%; }
.contentsfloat2b			{ margin-left: 1em;width: 80%; }

.introfamilyfloat4			{ width: 50%; }
.introfamilyfloat4 p		{ font-size: 80%; }
.introfamilyfloat4 img		{ max-width: 98%; height: auto; }

.thumbsfloat4				{ width: 50%; }
.thumbsfloat4 p				{ font-size: 80%; }
.thumbsfloat4 img			{ max-width: 98%; height: auto; }

.thumbsfloat5				{ width: 50%; }
.thumbsfloat5 p				{ font-size: 80%; }
.thumbsfloat5 img			{ max-width: 98%; height: auto; }

.thumbsfloat5S				{ width: 50%; }
.thumbsfloat5S p			{ font-size: 80%; }
.thumbsfloat5S img			{ max-width: 98%; height: auto; }

.thumbs100float4			{ width: 50%; }
.thumbs100float4 p			{ font-size: 80%; }
.thumbs100float4 img		{ max-width: 98%; height: auto; }

.thumbs100float5			{ width: 50%; }
.thumbs100float5 p			{ font-size: 80%; }
.thumbs100float5 img		{ max-width: 98%; height: auto; }

.thumbs110float4			{ width: 50%; }
.thumbs110float4 p			{ font-size: 80%; }
.thumbs110float4 img		{ max-width: 98%; height: auto; }

.thumbs110float5			{ width: 50%; }
.thumbs110float5 p			{ font-size: 80%; }
.thumbs110float5 img		{ max-width: 98%; height: auto; }

.thumbsfloat4c				{ width: 50%; }
.thumbsfloat4c p			{ font-size: 80%; }
.thumbsfloat4c img			{ max-width: 98%; height: auto; }

.thumbsfloat5c				{ width: 50%; }
.thumbsfloat5c p			{ font-size: 80%; }
.thumbsfloat5c img			{ max-width: 98%; height: auto; }

.familyfloat2				{ width: 50%; }
.familyfloat2 p				{ font-size: 80%; }
.familyfloat2 img			{ max-width: 98%; height: auto; }

.familyfloat2S				{ width: 50%; }
.familyfloat2S p			{ font-size: 80%; }
.familyfloat2S img			{ max-width: 98%; height: auto; }

.familyfloat3				{ width: 30%; }
.familyfloat3 p				{ font-size: 80%; }
.familyfloat3 img			{ max-width: 98%; height: auto; }

.familyfloat3L				{ width: 30%; }
.familyfloat3L p			{ font-size: 80%; }
.familyfloat3L img			{ max-width: 98%; height: auto; }

.familyfloat3S				{ width: 30%; }
.familyfloat3S p			{ font-size: 80%; }
.familyfloat3S img			{ max-width: 98%; height: auto; }

.familyfloat4				{ width: 50%; }
.familyfloat4 p				{ font-size: 80%; }
.familyfloat4 img			{ max-width: 98%; height: auto; }

.familyfloat4L				{ width: 50%; }
.familyfloat4L p			{ font-size: 80%; }
.familyfloat4L img			{ max-width: 98%; height: auto; }

.familyfloat4S				{ width: 50%; }
.familyfloat4S p			{ font-size: 80%; }
.familyfloat4S img			{ max-width: 98%; height: auto; }

.familyfloat5				{ width: 50%; }
.familyfloat5 p				{ font-size: 80%; }
.familyfloat5 img			{ max-width: 98%; height: auto; }

.familyfloat5L				{ width: 50%; }
.familyfloat5L p			{ font-size: 80%; }
.familyfloat5L img			{ max-width: 98%; height: auto; }

.familyfloat5S				{ width: 50%; }
.familyfloat5S p			{ font-size: 80%; }
.familyfloat5S img			{ max-width: 98%; height: auto; }

.familyfloat6				{ width: 30%; }
.familyfloat6 p				{ font-size: 80%; }
.familyfloat6 img			{ max-width: 98%; height: auto; }

.topfamilyfloat2			{ width: 50%; }
.topfamilyfloat2 p			{ font-size: 80%; }
.topfamilyfloat2 img		{ max-width: 98%; height: auto; }

.topfamilyfloat3			{ display: block; width: 30%; }
.topfamilyfloat3 p			{ font-size: 80%; }
.topfamilyfloat3 img		{ max-width: 95%; height: auto; }

.topfamilyfloat4			{ width: 25%; }
.topfamilyfloat4 p			{ font-size: 80%; }
.topfamilyfloat4 img		{ max-width: 98%; height: auto; }

.topfamilyfloat5			{ width: 20%; }
.topfamilyfloat5 p			{ font-size: 80%; }
.topfamilyfloat5 img		{ max-width: 98%; height: auto; }

.leftprod75imgage			{ width: 12%; }
.leftprod75desc				{ margin-left: 6em; }
.leftprod75desc p			{ font-size: 80%; }

#leftprod125				{ clear: both; margin: .125em 0; }
.leftprod125imgage 			{ clear: both; width: 100%; }
.leftprod125imgage img		{ display: block; max-width: 98%; height: auto; }
.leftprod125desc			{ clear: both; margin-left: .25em; width: 100%; }
.leftprod125bullet			{ list-style: square; padding: .125em .125em; margin-left: 1.25em; }

#leftprod150				{ clear: both; margin: .125em 0; }
.leftprod150imgage 			{ clear: both; width: 100%; }
.leftprod150imgage img		{ display: block; max-width: 98%; height: auto; }
.leftprod150desc			{ clear: both; margin-left: .25em; width: 100%; }
.leftprod150bullet			{ list-style: square; padding: .125em .125em; margin-left: 1.25em; }

#rightprod125				{ clear: both; margin: .125em 0; }
.rightprod125desc			{ clear: both; margin-left: .25em; width: 100%; }
.rightprod125bullet			{ list-style: square; padding: .125em .125em; margin-left: 1.25em; }
.rightprod125imgage 		{ clear: both; width: 100%; }
.rightprod125imgage img		{ display: block; max-width: 98%; height: auto; }

#auctionphp img				{ max-width: 75%; height: auto; }
#auctionphp table			{ font-size: 75%; }
#auctionbinbox p			{ font-size: 70%; }

.merchantpromo				{ line-height: 1em; padding: 1em 1.5em 0 1.5em; }

.floatdinnerwarelist		{ clear: both; width: 98%; }
.floatdinnerwarelist img	{ margin-left: 0; display: block; max-width: 98%; height: auto; }
.floatdinnerwaredesc		{ margin-left: 0; width: 98%; }

.floatshoppinglist			{ clear: both; width: 100%; }
.floatshoppinglist img		{ margin-left: 0; display: block; max-width: 98%; height: auto; }
.floatshoppingdesc			{ margin-left: 0; width: 98%; }

/* charts */

.nameschartfloat			{ width: 30%; }

#wattagebox					{ margin-left: .5em; display: block; width: 75%; }

.floatvideolist				{ width: 90%; }
.floatbookslist				{ width: 90%; }
.recipeingredients			{ padding: 0; width: 42%; }
.recipeinstructions			{ padding: 0; margin-left: 42%; }
.recipenotes				{ margin: 0 0 0 .125em; padding: .5em 0 .5em .125em; }

/* Chart Reflexive */
#chartcontent				{ position: relative; padding-bottom: 50%; padding-top: 2em; height: 0; overflow: hidden; }

#chartcontent iframe, 
#chartcontent object, 
#chartcontent embed			{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; }



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

/* Smartphones (landscape) ----------- */
@media only screen 
and (min-width : 321px) {
/* Styles */
}

/* 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 */
}

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

/* 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 */
}