/**** homepage redesign 2014 Dec (Ken Mowry Home Page = KHP) ****
 * In order to achieve a flexible tiled design, we have several different sizes of rectangles that can be flowed in the container.
 * We only float in older browsers that don't understand the inline-block display type, because floats often lead to problems.
 * Standard distance between elements: 40px
 * Standard Tiles: 
 *   288px x 192px
 *   288px x 424px (192 + 40 + 192)
 *   616px x 192px (288 + 40 + 288)
 *   944px wide, variable height (288 + 40 + 288 + 40 + 288)
 *   
 * Live Text with font substitution - header-type elements in RobotoCondensed, subheads in Lora
 * Text shadow only works in newer browsers.
 * Rollovers can be done within tiles using the a tag as a container for the image.
*****/

/* container to hold the document flow */
.KHP_rectCont { width: 1000px; position:relative; margin: 20px auto; padding: 0; border: 0; }

/* standard widths */
.KHP_fullWidth { width: 944px; position:relative; margin: 20px; display: inline-block; border: 0; }
.KHP_narrowW { width: 288px; position:relative; margin: 20px; display: inline-block; border: 0; }
.KHP_wideW { width: 616px; position:relative; margin: 20px; display: inline-block; border: 0; }

/* for older browsers that don't understand the nth-child selector */
.KHP_wideW .KHP_narrowW { margin: 10px; }

/* adjust the margin for tiles that are grouped in a block of four */
.KHP_wideW>.KHP_narrowW:nth-child(1) { margin: 0 20px 20px 0; }
.KHP_wideW>.KHP_narrowW:nth-child(2) { margin: 0 0 20px 20px; }
.KHP_wideW>.KHP_narrowW:nth-child(3) { margin: 20px 20px 0 0; }
.KHP_wideW>.KHP_narrowW:nth-child(4) { margin: 20px 0 0 20px; }

/* standard heights - we vertical align top for Safari, in cases where one tall element is next to a block of four smaller ones. */
.KHP_shortH { height: 192px; overflow: hidden; vertical-align: top; }
.KHP_medH { height: 217px; overflow: hidden; vertical-align: top; }
.KHP_tallH { height: 424px; overflow: hidden; vertical-align: top; }

/* to correct weirdness in alignment in Safari/iPad2 with the block of four */
.KHP_tallH>.KHP_shortH { vertical-align: inherit; }

/* "lookbook" type element with persona-related photos on top of ruled text */
.KHP_looks {
  height: 217px;
  width: 944px;
  position: relative;
  margin: 20px auto 0;
}

/* the ruled text for the "lookbook" type element */
.KHP_wideText {
  width: 944px;
  border: 0 solid black;
  border-width: 2px 0;
  color: black;
  font-family: RobotoCondensed, sans-serif;
  font-size: 33pt;
  letter-spacing: 2px;
  text-transform: uppercase;
  margin: 0 auto 20px auto;
}
/* keep it from blowing out the rules */
.KHP_wideText p, .KHP_wideText a {
  margin: 0;
  text-decoration: none;
}
/* the images for the "lookbook" type element */
.KHP_flexImage {
  position: relative;
  display: inline-block;
  margin: 0;
}

/* <=IE7 Hacks - float, because the inline-block doesn't flow properly. */
*+html .KHP_narrowW, * html .KHP_narrowW { float: left; }
*+html .KHP_wideW, * html .KHP_wideW { float: left; }
*+html .KHP_flexImage, * html .KHP_flexImage { float: left; }


/* basic live text for header-type elements */
.KHP_liveText {
  position: absolute;
  margin: auto;  
  text-align: center;
  font-family: RobotoCondensed, sans-serif;
  font-size: 33pt;
  letter-spacing: 2px;
  text-transform: uppercase;
  display: block;
  margin: auto;
  width: auto;
}
/* live text for "lookbook" element - subhead style */
.KHP_flexImage>.KHP_liveText {
  color: white;
  margin: 0;
  width: 100%;
  text-align: center;
  font-family: Lora, serif;
  font-size: 16pt;
  text-shadow:1px 1px 13px rgba(64,64,64,1),-1px -1px 13px rgba(64,64,64,1);
}

/* placement of live text in standard elements */
.KHP_narrowW>.KHP_liveText {
  color: white;
  width: 230px;
  margin: 76px 29px;
  font-size: 28pt;
  text-shadow:1px 1px 13px rgba(64,64,64,1),-1px -1px 13px rgba(64,64,64,1);
}
.KHP_wideW>.KHP_liveText {
  color: white;
  width: 500px;
  margin: 76px 58px;
  font-size: 28pt;
  text-shadow:1px 1px 13px rgba(64,64,64,1),-1px -1px 13px rgba(64,64,64,1);
}
.KHP_fullWidth>.KHP_liveText {
  color: white;
  width: 800px;
  margin: 76px 72px;
  font-size: 28pt;
  text-shadow:1px 1px 13px rgba(64,64,64,1),-1px -1px 13px rgba(64,64,64,1);
}

/* so that we can link the live text and have it be the right color and style */
.KHP_liveText a {
  color: inherit !important; 
  text-decoration: none;
  display: block;
  width: 100%;
}

/********************* end homepage redesign 2014 Dec *************************/

/* Begin RO  */
.RO_homepagemessage {
position:relative;
left:15px;
top:-80px;
}
.RO_belowMenuBottom
{
	display: none;	
}
.newsite {
	position:relative;
	left: 15px;
	top: 10px;
	z-index: 1000;
}
.PageNoNav { 
	overflow-x: hidden; 
	position:relative;
	min-width: 1000px;
	} /* no horizontal scroll bar */


/**** Tile Rollovers     ****/
.RO_Tile_roll {
	position:relative;
	width: 312px;
	height: 170px;
	overflow: hidden;
	display: block;
}
.RO_Tile_roll img {
	position:absolute;
	top: 0px;
	left: 0px;
	display: block;
}

.RO_Tiles_BG:hover>.RO_Tile_roll img
{
	top: -170px;
	left: 0px;
}
.RO_ThirdRowTiles:hover>.RO_Tile_roll img
{
	top: -170px;
	left: 0px;
}
.RO_ThirdRowTiles:hover {
	zoom: 1;
}

/* this is so IE7 will do the rollovers correctly. 
http://css-class.com/articles/explorer/sticky/
http://www.satzansatz.de/cssd/pseudocss.html#hoverdesc */
.RO_Tiles_BG:hover { position: static; }

/*
.RO_Tile_roll a:link>img {
	top: 170px;
	left: 0px;
	border: solid 1px red;
}
.RO_Tile_roll a:hover>img {
	top: -170;
	left: 0px;
	border: solid 1px blue;
} 

.RO_Tiles_BG:hover>.RO_Tile_roll a img {
	top: -170;
	left: 0px;
}
*/

.RO_Tiles_BG:hover>.RO_Tile_LiveText_Tile1 a ,
.RO_Tiles_BG:hover>.RO_Tile_LiveText_Tile2 a ,
.RO_Tiles_BG:hover>.RO_Tile_LiveText_Tile3 a ,
.RO_Tiles_BG:hover>.RO_Tile_LiveText_Tile4 a ,
.RO_Tiles_BG:hover>.RO_Tile_LiveText_Tile5 a, 
.RO_Tiles_BG:hover>.RO_Tile_LiveText_Tile6 a, 
.RO_Tiles_BG:hover>.RO_Tile_LiveText_Tile7 a ,
.RO_Tiles_BG:hover>.RO_Tile_LiveText_Tile8 a ,
.RO_Tiles_BG:hover>.RO_Tile_LiveText_Tile9 a ,
.RO_ThirdRowTiles:hover>.RO_Tile_LiveText_Tile9 a 
{ color: #f7dc61; }

/**** Tile Rollovers End ****/



/*.RO_topMenu
{
	BACKGROUND-COLOR: #f5f4ef;
	background-image:url('/orvis_assets/images/RO_GreenGradient.gif');
	background-repeat:repeat-x;
}
*/

.rectangles {
	width:943;
	margin:0 auto;
	padding: 42px 0 30px 0;
}
.HPWomen {
	background-image: url('/orvis_assets/images/parallel.jpg');
	background-repeat:repeat-x;
	background-position: center bottom; 
	padding-bottom:20px;
}

.hide_me { display: none; }