
/*-----------------------------------------------------------------------------
		PAGE STYLES - DEFAULT TO SMALLER SCREENS FIRST
-----------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------
		WHEN assigning multiple classes, if at the same order of precedence,
		order of classes in this file is what matters,
		not the order of specifying the classes on the element.
		Put the class you want to take priority, AFTER the others, in this file.
-----------------------------------------------------------------------------*/


/*-----------------------------------------------------------------------------
		SITE SPECIFIC
-----------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------
		Charts
-----------------------------------------------------------------------------*/
.jqplot-title {
			font-weight: bold;
			margin-bottom: 60px;
}

#chartDiv_numOf, #chartDiv_rank {
			display: block;
			float: none;
			height: 350px;
			width: 100%;
			margin: 0px auto 30px auto;
}


/*-----------------------------------------------------------------------------
		General - Specific Elements
-----------------------------------------------------------------------------*/
#curvedarrow {
			position: relative;
			width: 0;
			height: 0;
			border-top: 9px solid transparent;
			border-right: 9px solid red;
			transform: rotate(10deg);
			display: inline-block;
}
#curvedarrow:after {
			content: "";
			position: absolute;
			border: 0 solid transparent;
			border-top: 3px solid red;
			border-radius: 20px 0 0 0;
			top: -12px;
			left: -9px;
			width: 12px;
			height: 12px;
			transform: rotate(45deg);
}
	
#shop {
			display: inline-block;
			padding-right: 5px;
			padding-left: 5px;
			font-weight: bold;
}
#shop:after {
			color: red;
			content: "Shop";
}
	
DIV.searchNameIntro {
			padding: 10px;
			padding-right: 70px;
			overflow: auto;
			background-color: #FFEC86;
			background-image: url( "/images/pages/bearBoy.gif" );
			background-position: right bottom;
			background-repeat: no-repeat;
}

DIV.searchLettersSmBox {
			padding: 10px 10px 10px 15px;
			margin: 20px auto 20px auto;
			background-color: lightgrey;
			border: 1px solid darkgrey;
}

DIV.searchLettersSmBox A {
			display: inline-block;
			font-size: 20px;
			font-weight: bold;
			text-decoration: none;
			padding: 10px 2px 5px 6px;
			width: 28px;
}

DIV.searchLettersSmBox A.asIs {
			width: auto;
}


DIV.wizard {
			color: white;
			margin: 0px;
			margin-bottom: 20px;
			padding: 10%;
			background-image: url( "/images/pages/wizard.gif" );
			background-repeat: no-repeat;
			background-size: 100% 100%;
			overflow: hidden;
}

DIV.betweenArea {
			margin-top: 20px;
			padding: 10px 0px 3px 2px;
			border: 1px burlywood dotted;  /* salmon, burlywood */
			background-color: bisque;  /* mistyrose, bisque */
}

DIV.betweenBg, DIV.betweenBgWinner {
			background-image: url( "/images/pages/betweenBgRace.gif" );
			background-repeat: no-repeat;
			background-position: left bottom;
			background-size: 100%;
			width: 100%;
			height: auto;
}

DIV.betweenBgWinner {
			background-image: url( "/images/pages/betweenBgRaceWinner.gif" );
}

IMG.betweenBaby {
			width: 100%;
			height: auto;
			position: relative;
			left: 0px;
			bottom: 0px;
}


DIV.pregnancyWeeks DIV {
			display: inline-block;
			width: 70px;
			padding: 5px;
}

DIV.pregnancyWeeksSmBox {
			width: 70%;
			padding: 10px;
			margin: 20px auto 20px auto;
			background-color: lightgrey;
			border: 1px solid darkgrey;
}

DIV.pregnancyWeeksSmBox A {
			display: inline-block;
			color: grey;
			font-size: 18px;
			font-weight: bold;
			text-decoration: none;
			padding: 7px;
}


/*-----------------------------------------------------------------------------
		Edges
-----------------------------------------------------------------------------*/
DIV.edgeTop_genderPredictor {
			background-image: url( "/images/pages/genderPredictorEdgeTop.gif" );
			height: 14px;
}
DIV.edgeBottom_genderPredictor {
			background-image: url( "/images/pages/genderPredictorEdgeBottom.gif" );
			height: 14px;
}


/*-----------------------------------------------------------------------------
		Styles
-----------------------------------------------------------------------------*/
.style_bgHieroIntro {
			background-image: url( "/images/hieroPage/bgHiero_intro.png" );
}

.style_bgNauticalWaves {
			background-color: #C6FEFF;
}

.style_bgNauticalHistory,
.style_bgHieroHistory {
			background-color: #0070B0;
			color: white;
}

.style_bgNauticalWaves2 {
			background-color: #FEF6AD;
}

.style_bgHoroscopes {
			background-color: #97D0E4;
}

.style_fgHoroscopes {
			color: #97D0E4;
}

.style_bgWizardGirl, .style_bgNameGirl, .style_bgGenderPredictorGirl {
			background-color: #F6C1C6;
}

.style_bgWizardBoy, .style_bgNameBoy, .style_bgGenderPredictorBoy {
			background-color: #93BFDE;
}

.style_bgWizardUnisex, .style_bgNameUnisex {
			background-color: #8DD293;
}

.style_bgConceive {
			background-color: #FCF3AD;
}

.style_bgPregnancy {
			background-color: #D1E7C1;
}

.style_bgShower {
			xbackground-color: #D7C1E7;
			background-color: #F5DCF5;  /* 245, 220, 245 */
}

.style_bgParenting, .style_bgPopularity {
			background-color: #C1D7E7;
}

.style_bgGenderPredictor {
			color: white;
			background-color: #015DA2;
}

.style_bgNumerology {
			color: yellow;
			background-color: #32347F;
}

.style_bgNameFun_ltPurple {
			background-color: #DFD6E7;  /* light #DFD6E7, dark #D2C5DD; powderblue */
			border-top: 20px solid #D2C5DD; /* rebeccaPurple; skyblue */
			border-bottom: 20px solid #D2C5DD;
}

.style_bgNameFun_blue {
			background-color: powderblue;  /* light #DFD6E7, dark #D2C5DD; powderblue */
			border-top: 20px solid skyblue; /* rebeccaPurple; skyblue */
			border-bottom: 20px solid skyblue;
}

.style_bgNameFun_ltPurple A, .style_bgNameFun_blue A {
			white-space: nowrap;
}


/*-----------------------------------------------------------------------------
		Text
-----------------------------------------------------------------------------*/
.text_momHoroscope {
      display: none;
      color: slateblue;
      font-size: 13px;
      font-weight: bold;
      text-decoration: none;
}

.text_horoscopeBlu, .text_horoscopeRed, .text_horoscopeGrn, 
.text_horoscopeYel, .text_horoscopeGry {
			font-family: arial, sans-serif;
			font-size: 11px;
			font-weight: bold;
}

.text_horoscopeBlu {
      color: #0000BB;
}
.text_horoscopeRed {
      color: #BB0000;
}
.text_horoscopeGrn {
      color: #00BB00;
}
.text_horoscopeYel {
      color: yellow;
}
.text_horoscopeGry {
      color: #333366;
}


/*-----------------------------------------------------------------------------
		Sprites
-----------------------------------------------------------------------------*/
#img_asl_a, #img_asl_b, #img_asl_c, #img_asl_d, 
#img_asl_e, #img_asl_f, #img_asl_g, #img_asl_h, 
#img_asl_i, #img_asl_j, #img_asl_k, #img_asl_l, 
#img_asl_m, #img_asl_n, #img_asl_o, #img_asl_p, 
#img_asl_q, #img_asl_r, #img_asl_s, #img_asl_t, 
#img_asl_u, #img_asl_v, #img_asl_w, #img_asl_x, 
#img_asl_y, #img_asl_z {
	background-image: url( "/images/pages/aslSpriteSmall.gif" );
			margin: 0px 3px 0px 0px;   /* top right bottom left */
			width: 30px;  /* full size: 47px; 2/3 size: 30px */
			height: 52px;  /* full size: 80px; 2/3 size: 52px */
			border: 0px;
}

#img_asl_a {
			background-position: 0px 0px;
}
#img_asl_b {
			background-position: 0px -51px;
}
#img_asl_c {
			background-position: 0px -103px;
}
#img_asl_d {
			background-position: 0px -153px;
}
#img_asl_e {
			background-position: 0px -205px;
}
#img_asl_f {
			background-position: 0px -256px;
}
#img_asl_g {
			background-position: 0px -308px;
}
#img_asl_h {
			background-position: 0px -360px;
}
#img_asl_i {
			background-position: 0px -409px;
}
#img_asl_j {
			background-position: 0px -460px;
}
#img_asl_k {
			background-position: 0px -511px;
}
#img_asl_l {
			background-position: 0px -562px;
}
#img_asl_m {
			background-position: 0px -613px;
}
#img_asl_n {
			background-position: 0px -665px;
}
#img_asl_o {
			background-position: 0px -716px;
}
#img_asl_p {
			background-position: 0px -767px;
}
#img_asl_q {
			background-position: 0px -818px;
}
#img_asl_r {
			background-position: 0px -867px;
}
#img_asl_s {
			background-position: 0px -920px;
}
#img_asl_t {
			background-position: 0px -970px;
}
#img_asl_u {
			background-position: 0px -1021px;
}
#img_asl_v {
			background-position: 0px -1072px;
}
#img_asl_w {
			background-position: 0px -1123px;
}
#img_asl_x {
			background-position: 0px -1174px;
}
#img_asl_y {
			background-position: 0px -1225px;
}
#img_asl_z {
			background-position: 0px -1276px;
}


/*-----------------------------------------------------------------------------
		Nautical
-----------------------------------------------------------------------------*/
DIV.canvas {
			position: relative;
}

IMG.fauxBG { 
			width: 100%;
			height: auto;
			xdisplay: block; /* for testing only */
			xmin-width: 280px; /* for testing only */
			xmax-width: 560px; /* for testing only */
			xmargin: 0px auto; /* for testing only */
}

.img_horz { 
			display: inline-block;
}


DIV.clipperShipName, DIV.sailBoatName, DIV.pirateShipName {
			font-family: arial, sans-serif;
			font-size: 12px;
			font-weight: bold;
			position: absolute;
			top: 83%;
			left: 47%
}
DIV.sailBoatName, DIV.pirateShipName { top: 93%; }

DIV.flags {
			position: absolute; 
			top: 13%; 
			left: 54%
}
DIV.flagMsg {
			position: absolute; 
			top: 10%; 
			left: 15%;
			xborder: 3px solid red;
			width: 69%
}

.img_waves { 
			background: url( "/images/nauticalPage/bgNautical_waves.gif" ) repeat-x center left;
			height: 40px;
}

.img_obnBoat { 
			background: url( "/images/nauticalPage/bgNautical_obnBoat.gif" ) no-repeat center center; 
			height: 140px;
}

.img_waves2 { 
			background: url( "/images/nauticalPage/bgNautical_waves2.gif" ) repeat-x center left; 
			height: 40px;
}

.img_tableFlags { 
			display: inline-block;
			background: url( "/images/nauticalPage/tableFlagsSprite.png" ) no-repeat top left; 
			width: 30px; 
			height: 24px;
			margin: 0px;
} 
.img_tableFlags.a { background-position: 0 0; } 
.img_tableFlags.b { background-position: -30px 0; } 
.img_tableFlags.c { background-position: -60px 0; } 
.img_tableFlags.d { background-position: -90px 0; } 
.img_tableFlags.e { background-position: -120px 0; } 
.img_tableFlags.f { background-position: -150px 0; } 
.img_tableFlags.g { background-position: -180px 0; } 
.img_tableFlags.h { background-position: -210px 0; } 
.img_tableFlags.i { background-position: -240px 0; } 
.img_tableFlags.j { background-position: -270px 0; } 
.img_tableFlags.k { background-position: -300px 0; } 
.img_tableFlags.l { background-position: -330px 0; } 
.img_tableFlags.m { background-position: -360px 0; } 
.img_tableFlags.n { background-position: -390px 0; } 
.img_tableFlags.o { background-position: -420px 0; } 
.img_tableFlags.p { background-position: -450px 0; } 
.img_tableFlags.q { background-position: -480px 0; } 
.img_tableFlags.r { background-position: -510px 0; } 
.img_tableFlags.s { background-position: -540px 0; } 
.img_tableFlags.t { background-position: -570px 0; } 
.img_tableFlags.u { background-position: -600px 0; } 
.img_tableFlags.v { background-position: -630px 0; } 
.img_tableFlags.w { background-position: -660px 0; } 
.img_tableFlags.x { background-position: -690px 0; } 
.img_tableFlags.y { background-position: -720px 0; } 
.img_tableFlags.z { background-position: -750px 0; } 

.flag_space { 
			padding: 3px 2px;
			text-align: center;
}

.flagLg {
			width: 51px;
			height: 41px;
}
.flagMd {
			width: 37px;
			height: 30px;
}
.flagSm {
			width: 25px;
			height: 20px;
}


/*-----------------------------------------------------------------------------
		Hieroglyphics
-----------------------------------------------------------------------------*/
DIV.hieroglyphsObelisk {
			position: absolute; 
			top: 0; 
			left: 0;
			width: 100%;
}
DIV.hieroglyphsPaper {
			position: absolute; 
			top: 0; 
			left: 0;
			width: 76%;
}
DIV.hieroglyphsDisplay {
			margin: 11% auto 0px auto;
			/* width set based on type using other css */
}

.cartoucheMd_width, .nameMd_width { width: 60px; }
.cartoucheSm_width, .nameSm_width { width: 30px; }
.cartoucheCarvedMd_width { width: 66px; }
.cartoucheCarvedSm_width { width: 34px; }
.message_width { width: 70%; }


.img_edgeEye { 
			background: url( "/images/hieroPage/bgHiero_eye.gif" ) repeat-x center left;
			height: 28px;
}

.img_pyramids { 
			background: url( "/images/hieroPage/bgHiero_pyramidScene.gif" ) no-repeat center center; 
			height: 140px;
}


.img_tableHiero {
			display: inline-block;
			background: url( "/images/hieroPage/tableHieroglyphsSprite.png" ) no-repeat top left; 
			width: 30px;
			height: 30px;
			margin: 0px;
}
.img_tableHiero.a { background-position: 0 0; } 
.img_tableHiero.a2 { background-position: -30px 0; } 
.img_tableHiero.b { background-position: -60px 0; } 
.img_tableHiero.c { background-position: -90px 0; } 
.img_tableHiero.ch { background-position: -120px 0; } 
.img_tableHiero.d { background-position: -150px 0; } 
.img_tableHiero.e { background-position: -180px 0; } 
.img_tableHiero.f { background-position: -210px 0; } 
.img_tableHiero.g { background-position: -240px 0; } 
.img_tableHiero.h { background-position: -270px 0; } 
.img_tableHiero.h2 { background-position: -300px 0; } 
.img_tableHiero.i { background-position: -330px 0; } 
.img_tableHiero.j { background-position: -360px 0; } 
.img_tableHiero.k { background-position: -390px 0; } 
.img_tableHiero.kh { background-position: -420px 0; } 
.img_tableHiero.l { background-position: -450px 0; } 
.img_tableHiero.m { background-position: -480px 0; } 
.img_tableHiero.n { background-position: -510px 0; } 
.img_tableHiero.o { background-position: -540px 0; } 
.img_tableHiero.oo { background-position: -570px 0; } 
.img_tableHiero.p { background-position: -600px 0; } 
.img_tableHiero.q { background-position: -630px 0; } 
.img_tableHiero.qu { background-position: -660px 0; } 
.img_tableHiero.r { background-position: -690px 0; } 
.img_tableHiero.s { background-position: -720px 0; } 
.img_tableHiero.sh { background-position: -750px 0; } 
.img_tableHiero.t { background-position: -780px 0; } 
.img_tableHiero.u { background-position: -810px 0; } 
.img_tableHiero.v { background-position: -840px 0; } 
.img_tableHiero.w { background-position: -870px 0; } 
.img_tableHiero.x { background-position: -900px 0; } 
.img_tableHiero.y { background-position: -930px 0; } 
.img_tableHiero.z { background-position: -960px 0; }

.hiero_space { 
			padding: 3px 0px;
			text-align: center;
}

.hieroLg_a, .hieroLg_j, .hieroLg_m, .hieroLg_oo,
.hieroLg_x {
				width:75px;
				height:70px;
}
.hieroMd_a, .hieroMd_j, .hieroMd_m, .hieroMd_oo,
.hieroMd_x {
				width:50px;
				height:46px;
}
.hieroSm_a, .hieroSm_j, .hieroSm_m, .hieroSm_oo,
.hieroSm_x {
				width:25px;
				height:23px;
}
/********************/

.hieroLg_a2, .hieroLg_c, .hieroLg_k, .hieroLg_ch,
.hieroLg_d, .hieroLg_l, .hieroLg_r {
				width:75px;
				height:30px;
}
.hieroMd_a2, .hieroMd_c, .hieroMd_k, .hieroMd_ch,
.hieroMd_d, .hieroMd_l, .hieroMd_r {
				width:50px;
				height:20px;
}
.hieroSm_a2, .hieroSm_c, .hieroSm_k, .hieroSm_ch,
.hieroSm_d, .hieroSm_l, .hieroSm_r {
				width:25px;
				height:10px;
}
/********************/

.hieroLg_b, .hieroLg_o, .hieroLg_u, .hieroLg_w,
.hieroLg_p, .hieroLg_q {
				width:55px;
				height:70px;
}
.hieroMd_b, .hieroMd_o, .hieroMd_u, .hieroMd_w,
.hieroMd_p, .hieroMd_q {
				width:36px;
				height:46px;
}
.hieroSm_b, .hieroSm_o, .hieroSm_u, .hieroSm_w,
.hieroSm_p, .hieroSm_q {
				width:18px;
				height:23px;
}
/********************/

.hieroLg_e, .hieroLg_i, .hieroLg_h, .hieroLg_s {
				width:25px;
				height:70px;
}
.hieroMd_e, .hieroMd_i, .hieroMd_h, .hieroMd_s {
				width:17px;
				height:46px;
}
.hieroSm_e, .hieroSm_i, .hieroSm_h, .hieroSm_s {
				width:8px;
				height:23px;
}
/********************/

.hieroLg_f, .hieroLg_v, .hieroLg_sh {
				width:75px;
				height:25px;
}
.hieroMd_f, .hieroMd_v, .hieroMd_sh {
				width:50px;
				height:17px;
}
.hieroSm_f, .hieroSm_v, .hieroSm_sh {
				width:25px;
				height:8px;
}
/********************/

.hieroLg_g, .hieroLg_h2, .hieroLg_kh {
				width:55px;
				height:53px;
}
.hieroMd_g, .hieroMd_h2, .hieroMd_kh {
				width:36px;
				height:35px;
}
.hieroSm_g, .hieroSm_h2, .hieroSm_kh {
				width:18px;
				height:17px;
}
/********************/

.hieroLg_n, .hieroLg_z {
				width:75px;
				height:17px;
}
.hieroMd_n, .hieroMd_z {
				width:50px;
				height:11px;
}
.hieroSm_n, .hieroSm_z {
				width:25px;
				height:6px;
}
/********************/

.hieroLg_qu {
				width:75px;
				height:55px;
}
.hieroMd_qu {
				width:50px;
				height:36px;
}
.hieroSm_qu {
				width:25px;
				height:18px;
}
/********************/

.hieroLg_t {
				width:55px;
				height:30px;
}
.hieroMd_t {
				width:36px;
				height:20px;
}
.hieroSm_t {
				width:18px;
				height:10px;
}
/********************/

.hieroLg_y {
				width:47px;
				height:70px;
}

.hieroMd_y {
				width:31px;
				height:46px;
}

.hieroSm_y {
				width:16px;
				height:23px;
}
/********************/

.cartoucheLg_top {
				width:90px;
				height:49px;
}
.cartoucheMd_top {
				width:60px;
				height:32px;
}
.cartoucheSm_top {
				width:30px;
				height:16px;
}

DIV.cartoucheBlack_sides, DIV.cartoucheGold_sides {
        background-size: 100% auto;
		background-image: url( "/images/hieroglyphs/cartoucheBlackSides.png" );
		background-repeat: repeat-y;
		background-position: center top;
}
DIV.cartoucheGold_sides {
		background-image: url( "/images/hieroglyphs/cartoucheGoldSides.png" );
}

.cartoucheLg_bottom {
				width:90px;
				height:61px;
}
.cartoucheMd_bottom {
				width:60px;
				height:40px;
}
.cartoucheSm_bottom {
				width:30px;
				height:20px;
}
/********************/

.cartoucheCarvedLg_top {
				width:102px;
				height:55px;
}
.cartoucheCarvedMd_top {
				width:66px;
				height:32px;
}
.cartoucheCarvedSm_top {
				width:34px;
				height:18px;
}

DIV.cartoucheCarved_sides {
        background-size: 100% auto;
		background-image: url( "/images/hieroglyphs/cartoucheCarvedSides.png" );
		background-repeat: repeat-y;
		background-position: center top;
}

.cartoucheCarvedLg_bottom {
				width:102px;
				height:65px;
}
.cartoucheCarvedMd_bottom {
				width:66px;
				height:43px;
}
.cartoucheCarvedSm_bottom {
				width:34px;
				height:21px;
}
/********************/


/*-----------------------------------------------------------------------------
		GENERIC
-----------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------
		DIVs
-----------------------------------------------------------------------------*/
DIV.subDetails,
DIV.subDetailsLean,
DIV.subDetailsWCornerImage {
			padding: 10px;
			margin-bottom: 20px;
			overflow: auto;
}

DIV.subDetailsLean {
			padding-right: 2px;
			padding-left: 2px;
}

DIV.subDetailsWCornerImage {
			padding-right: 0px;
}

DIV.subDetailsWBottomCornerBGImage {
			padding-right: 70px;
}

DIV.subDetailsWCornerImageL {		
			padding: 10px 30px 0px 0px;
			margin-bottom: 0px;
			overflow: auto;			
}

DIV.subDetailsInScene {
			margin: 0px;
			margin-bottom: 20px;
			padding: 20% 16% 10% 21%;
			background-repeat: no-repeat;
			background-size: 100% 100%;
			overflow: hidden;
}

DIV.subDetailsFooter {
			width: 86%;
			font-family: arial, sans-serif;
			font-size: 11px;
			margin: 30px auto 20px auto;
			padding: 10px;
			border: 1px green dotted;
}

DIV.section, DIV.section2 {
			padding: 5px;
			overflow: auto;
}

DIV.noGap {
			margin: 0px;
			overflow: hidden;
}

DIV.indent {
			margin-left: 10px;
}

DIV.formBox, DIV.formBoxGoTo {
			margin: 0 auto 15px auto;
			padding: 10px 10px 5px 10px;
			border: 1px solid grey;
			background-color: lightgrey;
			overflow: hidden;
			xborder-radius: 10px;
}

DIV.formBoxGoTo {
			padding: 0px 10px 5px 10px;
}

DIV.hilightBox1 {
			padding: 10px;
			border: 3px solid blue;
}

DIV.hilightBox2 {
			display: inline-block;
			margin: 0px auto 0px auto;
			padding: 2px;
			border: 1px solid darkgrey;
}

DIV.hilightBox3 {
			width: 92%;
			font-family: arial, sans-serif;
			font-size: 11px;
			margin: 0px auto 10px auto;
			padding: 10px;
			border: 1px dotted salmon;
}

DIV.hilightBox4 {
			width: 70%;
			padding: 10px;
			margin: 0px auto 0px auto;
}

DIV.infoBox {
			/* horz. distance, vert. distance, blur, spread */
			-moz-box-shadow: 5px 5px 5px rgba(0,0,0,.5);  /* Mozilla Firefox 3.5 - 3.6 */
			-webkit-box-shadow: 5px 5px 5px rgba(0,0,0,.5);  /* Safari 3.1 - 5 */
			box-shadow: 5px 5px 5px rgba(0,0,0,.5);  /* All Else */	
			color: white;		
			xfont-family: Covered By Your Grace, cursive, arial, sans-serif;
			font-size: 21px;
			margin: 20px auto 20px auto;
			padding: 20px;
			background-color: #BF5E57; /* lemonchiffon */
}

DIV.infoBox2,
DIV.infoBox2L, DIV.infoBox2R {
			-moz-border-radius: 20px;
			-webkit-border-radius: 20px;
			border-radius: 20px;
			display: block;
			float: none;
			margin: 0px auto 20px auto;
			padding: 16px;
			background-color: white;
			border: 2px dotted #CCC
}

DIV.infoBox2L:last-child, DIV.infoBox2R:last-child {
			margin-bottom: 0px;
}

DIV.infoBoxGirl {
			border-color: #CA7672;
}

DIV.infoBoxBoy {
			border-color: #9DAAA6;
}

DIV.infoBoxUnisex {
			border-color: #9AAD35;
}

DIV.storeBoxL, DIV.storeBoxR {
			width: 240px;
			height: 310px;
			background-color: #FFE3E3; /*#FFCCCC;*/
			border: 5px double pink;
			border-radius: 100px 100px 15px 15px;
			/* horz. distance, vert. distance, blur, spread */
			-moz-box-shadow: 5px 5px 5px rgba(0,0,0,.5);  /* Mozilla Firefox 3.5 - 3.6 */
			-webkit-box-shadow: 5px 5px 5px rgba(0,0,0,.5);  /* Safari 3.1 - 5 */
			box-shadow: 5px 5px 5px rgba(0,0,0,.5);  /* All Else */	
			margin-left: auto;
			margin-right: auto;
			margin-bottom: 30px;
			display: block;
			float: none;
}

DIV.imgDivider {
			height: 28px;
			margin: 0px;
			padding: 0px;
			overflow: hidden;
			background-repeat: repeat-x;
}

DIV.dottedDivider {
			margin-top: 20px;
			margin-bottom: 20px;
			border-bottom: 1px #AAA dotted;
}

DIV.sectionGap, DIV.sectionGapSml {
			padding-top: 5px;
}

DIV.camelLinks {
			margin-right: 15px;
			margin-left: 15px;
}	
DIV.camelLinks A {
			padding-right: 20px;
}

DIV.girlLine, DIV.boyLine {
			width: 50%;
			border-bottom: 2px solid salmon;  /* width style color */	
			margin-bottom: 30px;		
}
DIV.boyLine {
			border-color: #7280FA;
}

DIV.qa, DIV.qaLrg, DIV.qaSml {
			-moz-border-radius: 50%;
			-webkit-border-radius: 50%;
			border-radius: 50%;
			background: rgba(226,226,226,1);
			background: -moz-linear-gradient(left, rgba(226,226,226,1) 0%, rgba(219,219,219,1) 50%, rgba(209,209,209,1) 51%, rgba(254,254,254,1) 100%);
			background: -webkit-gradient(left top, right top, color-stop(0%, rgba(226,226,226,1)), color-stop(50%, rgba(219,219,219,1)), color-stop(51%, rgba(209,209,209,1)), color-stop(100%, rgba(254,254,254,1)));
			background: -webkit-linear-gradient(left, rgba(226,226,226,1) 0%, rgba(219,219,219,1) 50%, rgba(209,209,209,1) 51%, rgba(254,254,254,1) 100%);
			background: -o-linear-gradient(left, rgba(226,226,226,1) 0%, rgba(219,219,219,1) 50%, rgba(209,209,209,1) 51%, rgba(254,254,254,1) 100%);
			background: -ms-linear-gradient(left, rgba(226,226,226,1) 0%, rgba(219,219,219,1) 50%, rgba(209,209,209,1) 51%, rgba(254,254,254,1) 100%);
			background: linear-gradient(to right, rgba(226,226,226,1) 0%, rgba(219,219,219,1) 50%, rgba(209,209,209,1) 51%, rgba(254,254,254,1) 100%);
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e2e2', endColorstr='#fefefe', GradientType=1 );
			-moz-box-shadow: 3px 3px 3px #333333;	/* horz. distance, vert. distance, blur, spread */
			-webkit-box-shadow: 3px 3px 3px #333333;
			display: inline-block;
			vertical-align: middle;
			box-shadow: 2px 2px 2px #333333;
			width: 26px;
			height: 26px;
			color: black;
			font-size: 19px;
			font-weight: bold;
			text-shadow: 1px 1px #333;
			text-align: center;
			border: 1px solid darkgray;
			margin: 0px 10px 5px 0px;
}

DIV.qaSml {
			width: 18px;
			height: 18px;
			font-size: 11px;
}

DIV.qaLrg {
			width: 36px;
			height: 36px;
			font-size: 26px;
}

DIV.prev {
			display: block;
			float: left;
}
DIV.next {
			display: block;
			float: right;
}

DIV.message1 {
			padding: 10px;
			margin: 10px auto 10px auto;
			border: 1px blue dotted;
			background-color: #B9D3EE;
}

DIV.hide {
			display: none;
}

DIV.show {
			display: block;
}

DIV.hideWhenLean {
			display: none;
}

DIV.showWhenLean {
			display: block;
}

DIV.showWhenNotMax {
			display: block;
}


/*-----------------------------------------------------------------------------
		Edges
-----------------------------------------------------------------------------*/
DIV.edge {
			background-repeat: repeat-x;
			padding: 0px;
			margin: 0px;
}


/*-----------------------------------------------------------------------------
		Styles
-----------------------------------------------------------------------------*/
.style_bgPink {
			background-color: pink;
}

.style_bgOrange {
			background-color: sandybrown;
}

.style_bgLightYellow {
			background-color: #FEF6AD;
}


/*-----------------------------------------------------------------------------
		Lists
-----------------------------------------------------------------------------*/
UL {
			margin: 0px;
			padding-left: 20px;
			list-style-type: bullet;
}

UL LI {
			xpadding-bottom: 10px;
			margin-top: 10px; 
}

UL LI:first-child {
			margin-top: 0px;
}

OL, DL {
			display: block;
			padding: 0px;
			margin: 0px auto 0px auto;
}

DD {
			margin-bottom: 15px;
}

OL > LI {
			margin: 10px;
			margin-top: 0px;
			margin-left: 30px;
}

UL.thumbsList {
			list-style-type: none;
			display: block;
			padding: 0px;
			margin: 0px auto 0px auto;
			width: 96%;
}

UL.thumbsList > LI {
			margin: 0px;
			margin-bottom: 10px;
			padding: 10px;
			overflow: auto;
			background: lightblue;
			border: 1px solid blue;
			height: 92px;
}

UL.thumbsList > LI:hover {
			background: #EEE;
			cursor: pointer;
			border: 1px solid grey;
}

UL.thumbsList > LI > A {
			display: block;  /* make whole area selectable */
			text-decoration: none;
			color: black;
			width: 100%;
			height: 92px;
}

UL.thumbsList > LI > A > IMG {
			-moz-box-shadow: 5px 5px 5px rgba(0,0,0,.5);  /* Mozilla Firefox 3.5 - 3.6 */
			-webkit-box-shadow: 5px 5px 5px rgba(0,0,0,.5);  /* Safari 3.1 - 5 */
			box-shadow: 5px 5px 5px rgba(0,0,0,.5);  /* All Else */			
			width: 105px;  /* 140 x 90 full size */
			height: 90px;
			float: left;
			margin: 0 15px 0 0;
}

UL.thumbsList > LI > A > H3 {
			display: inline;
			color: blue;
			font-size: 14px;
			font-weight: bold;
}

UL.thumbsList > LI > A > P {
			display: none;
			font-size: 13px;
}



UL.labelValueList {
			list-style: none;
			margin: 0;
			padding: 0;
}

LI.label, 
LI.value,
LI.valueWBotGap {
			display: inline-block;
			vertical-align: top;
}

LI.label {
			width: 5%;
			margin: 0px 10px 0px 0px;
			font-weight: bold;
}

LI.value,
LI.valueWBotGap {
			width: 90%;
}

LI.valueWBotGap {
			padding: 0px 0px 25px 0px;
}


/*-----------------------------------------------------------------------------
		Tables
-----------------------------------------------------------------------------*/
#controls {
			display: none;
}

TABLE.controls {
			padding: 0px;
			margin: 5px auto 10px auto;
}

TABLE.namesList {
			margin: 0px auto 0px auto;
			border-collapse: collapse;
			background-color: white;
}

TABLE.namesList TH, TABLE.namesList TD {
			text-align: center;
			padding: 8px;
			border: 1px solid black;
}

TABLE.namesList TH.left{
			text-align: right;
			background-color: #EAF2D3;
}



TABLE.tableDottedLean { 
			border-collapse: collapse;
			margin: 0px auto 0px auto;
			background-color: white;
}

TABLE.tableDottedLean TH,
TABLE.tableDottedLean TH.dark,
TABLE.tableDottedLean TD {
			border: 1px dotted #9CC089;
			padding: 4px;
}

TABLE.tableDottedLean TH {
			background-color: #D8F3C9;      
}

TABLE.tableDottedLean TH.dark {
			background-color: #99CC99;
}

TABLE.tableDottedLean TH.columnBreak, 
TABLE.tableDottedLean TD.columnBreak {
			border-left: 1px solid black;
}

TABLE.tableDottedLean TD.girlBG {
			background-color: #FFCCCC;
}

TABLE.tableDottedLean TD.boyBG {
			background-color: #CCCCFF;
}


TABLE.tableDotted { 
			width: 100%;
			border-collapse: collapse;
			margin: 0px auto 0px auto;
			background-color: white;
}

TABLE.tableDotted:last-child {
			margin-bottom: 15px;
}
        
TABLE.tableDotted TH,
TABLE.tableDotted TH.dark,
TABLE.tableDotted TD {
			border: 1px dotted #9CC089;
			padding: 8px;
}

TABLE.tableDotted TH {
			background-color: #D8F3C9;      
}

TABLE.tableDotted TH.dark {
			background-color: #99CC99;
}

TABLE.tableDotted TH A {
			white-space: nowrap;
}

TABLE.tableDotted TH.left{
			text-align: left;
			background-color: #D8F3C9;
			white-space: nowrap;
}

TABLE.tableDotted TD.leanPadding {
			padding: 6px;
}

TABLE.tableDotted TD.label {
			width: 90px;
			white-space: normal;
			vertical-align: top;
}

TABLE.tableDotted TD.hasDiv {
			padding: 0px;
			text-align: center;
}

TABLE.tableDotted DIV.fixedTheme,
TABLE.tableDotted DIV.fixedCelebrity,
TABLE.tableDotted DIV.fixedCelebrityKids,
TABLE.tableDotted DIV.fixedByOrigin,
TABLE.tableDotted DIV.fixedByTheme {
			float: left;
			padding: 8px;
			text-align: left;
}

TABLE.tableDotted DIV.fixedTheme {
			width: 90px;
}

TABLE.tableDotted DIV.fixedCelebrity,
TABLE.tableDotted DIV.fixedCelebrityKids {
			width: 180px;
}

TABLE.tableDotted DIV.fixedByOrigin,
TABLE.tableDotted DIV.fixedByTheme {
			width: 165px;
}

TABLE.tableDotted DIV.half {
			display: inline-block;
			padding: 8px;
}

TABLE.tableDotted TD.aboveAdHolder1,
TABLE.tableDotted TD.aboveAdHolder2 {
			border-bottom-style: none;
}

TABLE.tableDotted TD.belowAdHolder1,
TABLE.tableDotted TD.belowAdHolder2 {
			border-top-style: none;
}


TABLE.legacy TD {
			text-align: left;
			font-family: arial, sans-serif;
			font-size: 12px;
}

TABLE.legacy A {
			color: grey;
			font-family: arial, sans-serif;
			font-size: 12px;
			font-weight: normal;
			text-decoration: underline;
}


TABLE.external A {
			color: #7280FA;
}


TR.genShowNHideNar {
			display: table-row;
}

TR.genShowNHideWide {
			display: none;
}

TH.wideOnly, TD.wideOnly {
			display: none;
}

TD.widthFixed1 {
			width: 180px;
}

TD.widthFixed2 {
			width: 120px;
}

TH.widthFixed3, TD.widthFixed3 {
			width: 50px;
}

TD.right {
			text-align: right;
}

TH.colGirl, TD.colGirl,
TH.colBoy, TD.colBoy {
			display: table-cell;
}


/*-----------------------------------------------------------------------------
		General - Specific Elements
-----------------------------------------------------------------------------*/
/* legacy */
A.resultGirl, A.resultBoy, A.resultUnisex {
			color: blue;
}

A.resultGirl2 {
			color: salmon;
}

A.resultBoy2 {
			color: #7280FA;
}

A.resultUnisex2 {
			color: #72BA80;
}

A.external {
			color: #7280FA;
}

A.style2 {
			color: grey;
}


IMG.headerImage, IMG.blogImage,
IMG.sectionImage {
			display: block;
			margin: 0px auto 0px auto;
			width: 100%;
			height: auto;
}

IMG.portraitTop, IMG.landscapeTop {
      display: inline;
      float: right;
      margin: 0px 0px 10px 15px;
      width: 50%;
      height: auto;
}
IMG.portraitTop {
	width: 33%;
}

IMG.dropShadow,
IMG.xheaderImage, IMG.xblogImage,
IMG.portraitTop, IMG.landscapeTop,
IMG.portraitLeft, IMG.portraitRight {
			-moz-box-shadow: 5px 5px 5px rgba(0,0,0,.5);  /* Mozilla Firefox 3.5 - 3.6 */
			-webkit-box-shadow: 5px 5px 5px rgba(0,0,0,.5);  /* Safari 3.1 - 5 */
			box-shadow: 5px 5px 5px rgba(0,0,0,.5);  /* All Else */			
}

IMG.cornerImage, IMG.cornerImageVSml {
      display: inline;
      float: right;
      margin: 0px 0px 0px 15px;
      width: 37%;
      height: auto;
}

IMG.cornerImageVSml {
			width: 25%;
}

IMG.cornerImageR, IMG.portraitRight {
			display: inline;
			float: right;
			margin: 0px 0px 0px 15px;
			width: 45%;
			height: auto;
}

IMG.cornerImageL, IMG.portraitLeft {
      display: inline;
      float: left;
      margin: 0px 15px 0px 0px;
      width: 50%;
      height: auto;
}

IMG.portraitLeft, IMG.portraitRight {
			width: 50%;
			margin: 15px;
}

IMG.cornerImageAsIs {
			width: auto;
}

IMG.footerImage {
			display: block;
			margin: 30px auto 0px auto;
}

IMG.top {
		margin-top: 0px;
}

IMG.storeIcons {
			width:90px; 
			height:90px; 
			border-radius:50%; 
			border:2px solid pink; 
			margin-top:5px;
}

P.noGap {
			display: block;
			margin: 0px;
			padding: 0px;
}

P.noGapBottom {
			margin-bottom: 0px;
}

P.halfGap {
			display: block;
			margin: 0px;
			margin-bottom: 3px;
			padding: 0px;
}


/*-----------------------------------------------------------------------------
		Form related
-----------------------------------------------------------------------------*/
FORM.formBox {
			margin: 0px auto 15px auto;
			padding: 10px 0px 5px 0px;
			border: 1px solid grey;
			background-color: lightgrey;
			overflow: hidden;
			xborder-radius: 10px;
}

FORM > DIV, FORM > DIV > DIV {
			display: inline-block;
			white-space: normal;
			margin: 0px;
			margin-bottom: 4px;
}

FORM.fixedCol > DIV {
			width: 276px;
}

FORM.fixedColSml > DIV {
			width: 250px;
}

LABEL {
			display: inline-block;
			white-space: normal;
			width: 170px;
			font-weight: bold;
}

LABEL.radio {
			display: inline-block;
			width: auto;
			padding-left:0px;
			margin: 0px 0px 10px 0px;
}

.formLabelVLrg {
			width: 240px;
}

FORM.labelVVSml LABEL {
			display: inline-block;
			width: 100px;
			margin: 0px 0px 0px 20px;
}

FORM.labelVVVSml LABEL {
			width: 70px;
			margin: 0px 0px 0px 10px;
}

FORM.labelVLrg LABEL {
			width: 240px;
}

FORM.labelAsIs LABEL {
			display: inline-block;
			width: auto;
			margin: 0px 3px 0px 7px;
}

INPUT[TYPE="text"] {
			padding-top: 0px;
}

INPUT[TYPE="text"]:focus, TEXTAREA:focus, SELECT:focus {
			xborder-color: skyblue; /* SEEMS TO MAKE ITEMS VISUALLY SHIFT */
}

LABEL.radio, SELECT,
INPUT[TYPE="radio"], INPUT[TYPE="submit"] {
			cursor: pointer;
}

INPUT[TYPE="radio"] {
			margin-right: 0px;
			padding-right: 0px;
}

INPUT[TYPE="text"], TEXTAREA, SELECT {
      font-size: 16px;  /* min 16px PREVENTS auto input zoom */
      font-weight: normal;
      text-decoration: none;
}

INPUT[TYPE="text"], TEXTAREA { 
			width: 100%;
			vertical-align: top;
} 

INPUT[TYPE="text"] {
			max-width: 124px;
}

TEXTAREA { 
			max-width: 400px; 
			height: 150px; 
} 

.form_buttonMd{
			width: 150px;
}

.form_button{        
			display: block;
			white-space: nowrap;
			background-color: #ddd;
			background-image: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#ccc));
			background-image: -webkit-linear-gradient(top, #eee, #ccc);
			background-image: -moz-linear-gradient(top, #eee, #ccc);
			background-image: -ms-linear-gradient(top, #eee, #ccc);
			background-image: -o-linear-gradient(top, #eee, #ccc);
			background-image: linear-gradient(top, #eee, #ccc);
			-moz-border-radius: .2em;
			-webkit-border-radius: .2em;
			border-radius: .2em;
			-moz-box-shadow: 0 0 1px 1px rgba(255,255,255,.8) inset, 0 1px 0 rgba(0,0,0,.3);
			-webkit-box-shadow: 0 0 1px 1px rgba(255,255,255,.8) inset, 0 1px 0 rgba(0,0,0,.3);
			box-shadow: 0 0 1px 1px rgba(255,255,255,.8) inset, 0 1px 0 rgba(0,0,0,.3);

			xfont: bold 1em/2em Arial, Helvetica;
			color: #333;
			font-family: arial, helvetica, sans-serif;
			font-size: 15px;
			font-weight: bold;
			text-decoration: none;
			text-shadow: 0 1px 0 rgba(255,255,255,.8);
			border: 1px solid #777;
			padding: 5px 11px;
			margin: 10px auto 5px auto;
}

.form_button:hover {
			background-color: #eee;        
			background-image: -webkit-gradient(linear, left top, left bottom, from(#fafafa), to(#ddd));
			background-image: -webkit-linear-gradient(top, #fafafa, #ddd);
			background-image: -moz-linear-gradient(top, #fafafa, #ddd);
			background-image: -ms-linear-gradient(top, #fafafa, #ddd);
			background-image: -o-linear-gradient(top, #fafafa, #ddd);
			background-image: linear-gradient(top, #fafafa, #ddd);
}

.form_button:active {
			-moz-box-shadow: 0 0 4px 2px rgba(0,0,0,.3) inset;
			-webkit-box-shadow: 0 0 4px 2px rgba(0,0,0,.3) inset;
			box-shadow: 0 0 4px 2px rgba(0,0,0,.3) inset;
			position: relative;
			top: 1px;
}
    
.xform_button:focus {
			outline: 0;
			background: #fafafa;
}    

.form_buttonInline {
			display: inline;
			margin-left: 6px;
}

.form_buttonInlineFully {
			display: inline;
			margin: 5px 2px 0px 6px;
}


/*-----------------------------------------------------------------------------
		Text
-----------------------------------------------------------------------------*/
.text_neutral1,
.text_girl1, .text_boy1, .text_unisex1, 
.text_girlLrgB1, .text_boyLrgB1, .text_unisexLrgB1 {
			font-weight: bold;
			text-decoration: none;
			white-space: nowrap;
}

.text_girl2, .text_boy2, .text_unisex2 {
			font-weight: bold;
			text-decoration: none;
}

.text_girl3, .text_boy3, .text_unisex3 {
			font-weight: bold;
}

.text_girlLrgB1, .text_boyLrgB1, .text_unisexLrgB1 {
			font-size: 22px;
}

.neutral, .text_neutral1 {
			color: grey;
}

.girl, .text_girl1, .text_girl2, .text_girl3, .text_girlLrgB1 {
			color: salmon;
}

.boy, .text_boy1, .text_boy2, .text_boy3, .text_boyLrgB1 {
			color: #7280FA;
}

.unisex, .text_unisex1, .text_unisex2, .text_unisex3, .text_unisexLrgB1 {
			color: #72BA80;
}

.compareToGirl {
			color: pink;
}

.compareToBoy {
			color: powderblue;
}


.text_more1, .text_moreFooter1 {
			white-space: nowrap;
}

.text_more1 {
			color: green;
			font-weight: bold;
			text-decoration: none;
}

.text_moreFooter1 {
			color: green;
			font-size: 17px;
			font-weight: bold;
			display: block;
			text-align: center;
			text-decoration: none;			
}


.text_qaLabel1 {
			vertical-align: center;
			color: grey;
			font-weight: bold;
			font-size: 17px;
}

.text_qaLabel2 {
			vertical-align: center;
			color: black;
			font-weight: bold;
			font-size: 17px;
}

.text_hilight1 {
			color: grey;  /* #868686 */
			font-size: 19px;
			font-weight: bold;
}

.text_hilight2 {
			color: yellow;
			font-size: 26px;
			font-weight: bold;
			font-style: italic;
}

.text_hilight3 {
			color: grey;
			font-size: 26px;
			font-weight: bold;
			font-style: italic;
}

.text_hilight4 {
			color: #CC0000;
			font-size: 21px;
			font-weight:  bold;
}

.text_VsmallNote1 {
			color: black;
			font-size: 8px;
}

.text_smallNote1 {
			color: black;
			font-size: 10px;
}

.text_smallNote2,
.text_smallNoteBoy, .text_smallNoteGirl {
			font-family: arial, sans-serif;
			color: blue;
			font-size: 11px;
}

.text_smallNote2 {
      color: #0000BB;
}

.text_smallNoteGirl {
			color: red;
}

.text_smallNote3 {
			display: inline-block;
			color: gray;
			font-family: arial, sans-serif;
			font-size: 13px;
			font-style: italic;
			margin: 0px 0px 0px 7px;
}

.text_smallNote4 {
			 xfont-family: 'arial', 'arial narrow', 'sans serif'; 
			 font-style: italic;
			 color: #5C9AD8; 
			 font-size: 10px;
}

.text_smallNote5 {
			 font-style: italic;
			 color: burlywood; 
			 font-size: 11px;
			 text-decoration: none;
}


.text_title1 {
			color: black;
			font-size: 17px;
			font-weight: bold;
			text-decoration: underline;
			display: block;
}

.text_label1, .text_label2,
.text_labelFixed, .text_labelFixedLrg,
.text_labelFixedWhenWide {
			color: black;
			font-weight: bold;
}

.text_label1 {
			margin-right: 8px;
}

.text_label2 {
			display: block;
}

.text_labelFixed, .text_labelFixedLrg,
.text_labelFixedWhenWide {
			display: inline-block;
			width: 170px;
			white-space: nowrap;
			vertical-align: middle;
}

.text_labelFixedLrg {
			width: 230px;
}

.text_labelFixedWhenWide {
			font-size: 15px;
			margin: 0px;
			width: auto;
			display: block;
}


.text_bold {
			font-weight: bold;
}
.text_noWrap {
			white-space: nowrap;
}
.text_center {
			display: block;
			text-align: center;
}
.text_underline {
			text-decoration: underline;
}
.text_legacy {
			font-family: arial, sans-serif;
			font-size: 11px;
}


.text_size12 {
			font-size: 12px;
}	
.text_size17 {
			font-size: 17px;
}	
.text_size20 {
			font-size: 20px;
}
.text_size21 {
			font-size: 21px;
}
.text_size23 {
			font-size: 23px;
}
.text_size26 {
			font-size: 26px;
}


/*-----------------------------------------------------------------------------
		General - Any Elements
-----------------------------------------------------------------------------*/
.button {
      color: white;
      font-size: 12px;
      font-weight: bold;
      text-align: center;
      text-decoration: none;
      border: 1px solid white;
      cursor: pointer;
      padding: 1px;
      margin: 1px;
}

.hide {
			display: none;
}

.show {
			display: inline;
}

.showBlock {
			display: block;
}

.showInBlock {
			display: inline-block;
}

.noVerticalGap {
			margin-top: 0px;
			margin-bottom: 0px;
}


/*-----------------------------------------------------------------------------
		MARKER - MEDIA QUERIES
-----------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------
		320 IS SMALLEST OFFICIALLY SUPPORTED SIZE
-----------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------
		ROOM FOR PAGE ADS
-----------------------------------------------------------------------------*/
@media only screen and (min-width: 320px)
{
		/*cssCheck - set from obnStylesFramework.css*/

}


/*-----------------------------------------------------------------------------
		MORE COMFORTABLE FOR PAGE ADS
-----------------------------------------------------------------------------*/
@media only screen and (min-width: 390px)
{
		DIV.section, DIV.section2 {
			padding: 10px;
		}
}


/*-----------------------------------------------------------------------------
		old - ROOM FOR PAGE ADS
-----------------------------------------------------------------------------*/
@media only screen and (min-width: 390px)
{
		/*cssCheck - set from obnStylesFramework.css*/

		UL.thumbsList > LI > A > H3 {
			font-size: 16px;
		}
		
		UL.thumbsList > LI > A > IMG {
			width: 140px;
			height: 90px;
		}
		
		LABEL.radio {
			margin: 0px 10px 10px 0px;
		}
		
		TABLE.tableDotted TD.aboveAdHolder1,
		TABLE.tableDotted TD.aboveAdHolder2 {
			border-bottom-style: dotted;
		}

		TABLE.tableDotted TD.belowAdHolder1,
		TABLE.tableDotted TD.belowAdHolder2 {
			border-top-style: dotted;
		}
}


/*-----------------------------------------------------------------------------
		STACKED BANNER GETS A BIT WIDER
-----------------------------------------------------------------------------*/
@media only screen and (min-width: 480px)
{
		/*cssCheck - set from obnStylesFramework.css*/

		FORM > DIV, FORM > DIV > DIV {
			white-space: nowrap;
		}
		
		DIV.sectionGap {
			padding-top: 30px;
		}

		DIV.sectionGapSml {
			padding-top: 20px;
		}
		
		DIV.subDetailsInScene {
				padding-top: 13%;
		}

		UL.thumbsList > LI > A > P {
			display: block;
		}		

		TH.wideOnly, TD.wideOnly {
			display: table-cell;
		}

		.text_labelFixedWhenWide {
			width: 170px;
			display: inline-block;
		}
}


/*-----------------------------------------------------------------------------
		SPECIALTY SECTION TO PUT STORE DIVS SIDE BY SIDE
		JUST BEFORE SIDE BY SIDE BULLETINS AND DETAILS
		WHEN IT GOES BACK TO SINGLE FILE AGAIN UNTIL THERE
		IS ENOUGH ROOM TO DOUBLE UP.
-----------------------------------------------------------------------------*/
@media only screen and (min-width: 620px)
{
		DIV.storeBoxL, DIV.storeBoxR {
			display: inline-block;
			margin-left: 10px;
		}
		
		DIV.storeBoxL {
			float: left;
		}		
}


/*-----------------------------------------------------------------------------
		BULLETINS AND DETAILS GO SIDE BY SIDE		
-----------------------------------------------------------------------------*/
@media only screen and (min-width: 650px)
{
		/*cssCheck - set from obnStylesFramework.css*/

		TABLE.tableDotted TD.aboveAdHolder1 {
			border-bottom-style: none;
		}

		TABLE.tableDotted TD.belowAdHolder1 {
			border-top-style: none;
		}

		DIV.hideWhenLean {
			display: block;
		}

		DIV.showWhenLean {
			display: none;
		}
		
		DIV.storeBoxL, DIV.storeBoxR {
			display: block;
			margin-left: auto;
			float: none;
		}

}


/*-----------------------------------------------------------------------------
		TOP BANNER GOES HORIZONTAL
-----------------------------------------------------------------------------*/
@media only screen and (min-width: 700px)
{
		/*cssCheck - set from obnStylesFramework.css*/

		DIV.searchNameIntro {
				padding: 15px 70px 15px 20px;
		}
		
		DIV.subDetails, DIV.subDetailsWCornerImage, 
		DIV.subDetailsWBottomCornerBGImage,
		DIV.section {
			padding: 15px 20px 15px 20px;
		}

		DIV.subDetailsWCornerImage {
			padding-right: 0px;
		}
		
		TR.genShowNHideNar {
			display: none;
		}

		TR.genShowNHideWide {
			display: table-row;
		}

		IMG.cornerImage {
			width: 35%;
			height: 35%;
		}

		IMG.cornerImageR {
			width: 40%;
			height: 40%;
		}

		IMG.cornerImageAsIs {
			width: auto;
			height: auto;
		}

		.genShowNHide {
			display:none;
		}

		.genShowNHideWide {
			display:inline;
		}
}


/*-----------------------------------------------------------------------------
		SPECIALTY SECTION TO PUT STORE DIVS SIDE BY SIDE
		JUST BEFORE FULL SIZE ADS
		WHEN IT GOES BACK TO SINGLE FILE AGAIN UNTIL THERE
		IS ENOUGH ROOM TO DOUBLE UP.
-----------------------------------------------------------------------------*/
@media only screen and (min-width: 800px)
{
		DIV.storeBoxL, DIV.storeBoxR {
			display: inline-block;
			margin-left: 10px;
		}
		
		DIV.storeBoxL {
			float: left;
		}		
}


/*-----------------------------------------------------------------------------
		ROOM FOR FULL SIZE ADS
-----------------------------------------------------------------------------*/
@media only screen and (min-width: 850px)
{
		/*cssCheck - set from obnStylesFramework.css*/

		TABLE.tableDotted TD.aboveAdHolder2 {
			border-bottom-style: none;
		}
		
		TABLE.tableDotted TD.belowAdHolder2 {
			border-top-style: none;
		}
		
		DIV.storeBoxL, DIV.storeBoxR {
			display: block;
			margin-left: auto;
			float: none;
		}

}


/*-----------------------------------------------------------------------------
		SPECIALTY SECTION TO PUT STORE DIVS SIDE BY SIDE
		JUST BEFORE THE LAST (INIFINTIY AND BEYOND) SECTION
-----------------------------------------------------------------------------*/
@media only screen and (min-width: 980px)
{
		DIV.storeBoxL, DIV.storeBoxR {
			display: inline-block;
			margin-left: 10px;
		}
		
		DIV.storeBoxL {
			float: left;
		}		
}


/*-----------------------------------------------------------------------------
		TO INFINITY AND BEYOND...
-----------------------------------------------------------------------------*/
@media only screen and (min-width: 1000px)
{
		/*cssCheck - set from obnStylesFramework.css*/

		#chartDiv_numOf, #chartDiv_rank {
			display: inline-block;
			height: 350px;
			width: 260px;
		}

		#chartDiv_numOf {
			float: left;
			margin-right: 10px;
		}
		
		DIV.showWhenNotMax {
			display: none;
		}

		DIV.infoBox2L, DIV.infoBox2R {
			display: inline-block;
			height: 300px;
			width: 42%;
		}
		
		DIV.infoBox2L {
			float: left;
			margin-right: 12px;
		}

		DIV.storeBoxL, DIV.storeBoxR {
			margin-left: 20px;
		}
		
}
