/* CSS Document */

/*##############################################################
  Eric Meyer's Latest version of Reset.css (includes Baseline)
##############################################################*/ 

html, body, div, span,
applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dd, dl, dt, li, ol, ul,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	line-height: 1;
	font-family: inherit;
	text-align: left;
	vertical-align: baseline;
}
a img, :link img, :visited img {border: 0}
a.tip {
	position: relative;
}

a.tip span {
	display: none;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 155px;
	height: 87px;
	margin-top: 0px;
	z-index: 100;
	cursor:pointer;
	font-size:1.00em;
	line-height: 1.15em;
	font-family:Arial,Helvetica, Verdana, sans-serif;
	text-align:center;
	text-shadow:  #505050 2px 3px 3px; 
	color: #a8a398;
	vertical-align: top;
	background: url(../images/tip.png) top left no-repeat;
	-moz-border-radius: 5px; /* this works only in camino/firefox */
	-webkit-border-radius: 5px; /* this is just for Safari */
}

a:hover.tip {
	font-size: 99%; /* this is just for IE */
}

a:hover.tip span {
	display: block;
}
		
table {border-collapse: collapse; border-spacing: 0}
ul {list-style: none}
q:before, q:after,
blockquote:before, blockquote:after {content: ""}

/*#######################
  Element Styles 
#######################*/

body {font-size:16px; font-family:Helvetica, Verdana, sans-serif; color:#ffffff; 
background:#000000 ;background-attachment:fixed;}

h2, h3, h4, h5, p, ul, ol, dl {margin:15px 0}
h2, h3, h4, h5 {font-weight:bold; color:#fff }
h2 {font-size:1.65em; text-align:center;padding-top:8px;padding-right:18px;line-height: .55em;font-family:Arial,Helvetica, Verdana, sans-serif;  }
h3 {font-size:1.25em}
h4 {font-size:.95em;line-height: .85em;text-align:center;padding-right:15px;font-family:Arial,Helvetica, Verdana, sans-serif;  }
h5 {font-size:1.0em;line-height: 1.25em;text-align:center; color:#d8b48f;font-family:Arial,Helvetica, Verdana, sans-serif; }
h6 {font-size:.8em;line-height: 1.45em; text-align:right;font-style:italic; color:#cc9966;font-family:Arial,Helvetica, Verdana, sans-serif; }

a {color:#0fb7e4; outline:none}
	a:hover {text-decoration:none}
dt {margin:15px 0; font-weight:bold}
dd {margin:5px 0 5px 15px}
ol {margin-left:35px}

.right {float:right; display:inline; margin-left:12px;margin-right:2px}
.right2 {float:right; display:block; margin-left:1px;margin-right:2px}}
.left {float:left; display:inline; margin-right:12px}

/*#######################
  Layout Styles <img src="images/PurchaseOptions.png" >
#######################*/

#wrapper {width:982px; padding-top:10px; margin:0 auto; }


	h1 {width:982px; height:96px; margin-top:1px; font-size:1.5em; text-transform:uppercase; color:#fff; background:url(../images/wings.png) center 1px no-repeat }

#navigation {width:100%; height:52px; margin:0; border-right:0px solid #000; border-left:0px solid #000; border-top:0px solid #000;}
	#navigation li {float:left; display:inline; height:35px; font-size:.9em; text-transform:uppercase; border-left:0px solid #000; border-right:1px solid #1f1d1d}
		#navigation li a {display:block; height:22px; padding: 15px 35px; text-align:center; text-decoration:none; color:#d7d4d4}
			#navigation li a:hover 
            {color:#89c3fa; font-weight:bold; 
            background: url(../images/bubble2.png) center middle no-repeat; 
            text-shadow: 5px 5px 10px #E2E2F1; 
            border-right:1px solid #333333; border-left:1px solid #333333; border-top:1px solid #333333;
             
             }	

#nojs {
padding-left:20px;
text-align: center;
margin-left: auto;
margin-right: auto;
font-weight: bold;
color:gray;
font-size: 12px;
width: 982px;
height: 25px;
float:left;
padding-top: 10px;
}
			 
#slides {clear:both; float:left; width: 982px; height:96px;  padding-top:10px;  color:#fff;}

#content {clear:both; float:left; padding:0px; width:982px; height:444px; border:0px; margin-top:1px; 
 background: url(../images/BGF3.jpg) center top no-repeat; overflow:hidden; }	
	#content p2 {line-height:1.20em;  margin-left:12px; margin-right:12px; overflow:hidden;}
	#content ul {margin-left:25px; list-style-type:disc}
		#content li {margin:10px 0px}	
	#content .three_columns {float:left; display:inline; width:300px; height:420px; margin:5px 2px 10px 10px; padding-left:10px; text-align:center;
								 background: url(../images/ccbg.png) center 10px no-repeat; }   
   		#content .three_columns img {  margin-top:6px; margin-left:6px}	
	#content .two_columns {float:left; display:inline; width:465px; margin-right:5px; margin-left:5px} 


	
.LRinfo{float:left; display:block;line-height:1.20em; margin-top:5px; margin-left:12px; margin-right:12px;  overflow:hidden;}

.LinfoAf {float:left; display:block; margin-top:8px; margin-left:5px;width:260;height:60;background: url(../images/AffiliateNr.png) top left no-repeat;}
.LinfoAf a{}
.LinfoAf a:hover { background: url(../images/AffiliateHov.png) center left no-repeat;}
	
	
	
.LRinfoP {float:left; display:block; margin-top:17px; margin-left:15px;width:260;height:60;background: url(../images/PurchaseOptions.png) top left no-repeat;}
.LRinfoP a{ }
.LRinfoP a:hover
{ background: url(../images/PurchaseOption.png) center left no-repeat;}


	
.Centerinfo {
line-height:1.15em;font-size:.95em; text-align:justify; margin-left:10px; padding-right:21px; overflow:hidden;
margin-top:5px;}	


.SeeNow
{
float:left; display:block; 
  margin-left:17px;
  margin-top:20px;
  margin-right:15px;
  background: url(../images/seeitnowG.png)  top left no-repeat;
  width:260px;
  height: 163px;
}       
.SeeNow a{}
.SeeNow a:hover
{ background: url(../images/seeithnowG.png) center left no-repeat;}

.BuyNow
{
float:left; display:block; 
  margin-left:17px;
  margin-top:20px;
  margin-right:15px;
  background: url(../images/BuyitNowG.png)  top left no-repeat;
  width:260px;
  height: 163px;
}       
.BuyNow a{}
.BuyNow a:hover
{ background: url(../images/BuyitNowG.png)  top center no-repeat;}



	
#textfill  
{	
margin-right:5px; margin-left:5px;
color:#ffffff;
background: url(../images/macFFBgHack.png) center middle no-repeat;} 
}
	
#footer {clear:left; padding:10px 0 10px 0; font-size:0.8em; font-style:italic; color:gray}

#paddiv {margin-left:8px; padding-left:10px; }
/* the overlayed element */
div.overlay {
	
	position:fixed;
	/* growing background image */
	background-image:url(../images/brnovl2.png);
	 
	/* dimensions after the growing animation finishes  */
	
	margin-top:135px;
	margin-left:-8px;
    width:945px;	
	height:420px;
	/* initially overlay is hidden */
	display:none;
	 z-index:10000; 
	/* some padding to layout nested elements nicely  */
	padding-top:25px;
	padding-bottom:10px;
	padding-right:5px;
	padding-left:20px;
	overflow:hidden; 
}

/* default close button positioned on upper right corner */
div.overlay div.close {
	background-image:url(../images/close.png);
	position:absolute;
	right:280px;
	top:-5px;
	cursor:pointer;
	height:35px;
	width:35px;
}

 
#apple { 
    background-image:url(../images/applem.png); 
    color:#fff; 
}

div.contentWrap { 
 
  height:500px;
  
  overflow:hidden; 
  
}

.pics {  
    height:  160px;  
    width:   283px;  
    padding: 0;  
    margin:  0;  
} 

 
.pics img {  
    padding: 2px;  
    border:  0px solid #ccc;  
    background-color: #000;  
    width:  285px; 
    height: 160px; 
    top:  0; 
    left: 0 
} 
#exposeMask { 
    /* use a custom background color and image on the mask*/
    background:#201717  url(../images/wingsovl.png) center 12px no-repeat ;  
	
	overflow:hidden; 
}




/* --- Grid --- */

.grid {
  width: 982px;
  margin: auto;
  margin-left:2px;
  
}

grid a.info{
    position:relative; /*this is the key*/
    z-index:24; background-color:#505050;
    color:#FFF;
    text-decoration:none}

grid a.info:hover{z-index:25;}

grid a.info span{display: none}

grid a.info:hover span{ /*the span will display just on :hover state*/
    display:block;
    position:absolute;
    top:2em; left:2em; width:15em;
    border:1px solid #0cf;
    background-color:#505050; color:#FFF;
    text-align: center}
	

.grid-m1 {
  float: left;
  width: 2px;
  height: 1px;
}

.grid-c1 {
  float: left;
  width: 155px;
}

.grid-m2 {
  float: left;
  width: 9px;
  height: 1px;
}

.grid-c2 {
  float: left;
  width: 155px;
}

.grid-m3 {
  float: left;
  width: 9px;
  height: 1px;
}

.grid-c3 {
  float: left;
  width: 155px;
}

.grid-m4 {
  float: left;
  width: 9px;
  height: 1px;
}

.grid-c4 {
  float: left;
  width: 155px;
}

.grid-m5 {
  float: left;
  width: 9px;
  height: 1px;
}

.grid-c5 {
  float: left;
  width: 155px;
}

.grid-m6 {
  float: left;
  width: 9px;
  height: 1px;
}

.grid-c6 {
  float: left;
  width: 155px;
}