/*---------------------
 style for dinair header: March 15, 2010
 ----------------------*/

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* main body */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
body {
  padding:0;
  margin:0;
  background-image: url('/images/background_floral2.jpg');
   z-index:-100px;
	background-position: center top;
	background-repeat: no-repeat;
}

/* container div: */
/* set width and alignment */
/* inherited by all elements */
.container {
  float:none;
  margin-left:auto;
  margin-right:auto;
  padding-top:0; 
  margin-top:0;
  width: 968px;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* top nav: div holding 'top' menu */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
.top_nav {
  float:right;
  margin:0;
  padding-top: 5px;
  line-height: 25px;
  font-weight:normal;  
  text-align:center;
  font-size:11px; 
  color:#666666;

  background: white url('/img/line_single_img.jpg') repeat-x bottom left;
  /*position: relative;*/
  /*overflow:auto;*/
}

/* top nav links */
.top_nav a:link, a:visited {
  text-decoration:none;
  /*display:block;*/
  color:#888888;
}
.top_nav a:hover {
  text-decoration:none;
  color:#333333;
}
.top_nav a {
  display:inline-block;
}

.top_nav ul {
  margin:0px;
  padding:0px;
  margin-top:5px;
  margin-bottom:5px;
  list-style:none outside none;
  display:block;
}

.top_nav li {
  /*display:inline-block;*/
  display:inline;
  vertical-align:middle;
}

/* abrev is: top, right, bot, left*/
.top_nav_btns {
  margin: 3px 16px 3px 16px;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* second top nav: next below top nav */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
.second_top_nav {
  /*width: 100%;*/
  float:right;
  clear: right;
  padding-top: 8px;
  padding-bottom: 10px;
}

/* searchfield inside second top nav */
.navsearch {
  display:block;
  /*float:right;*/
  margin-top: 17px;
  margin-bottom: 17px;
}

.searchform {
  padding:0;
  margin:0;
  float:right;
}

.searchfield {  
  font-size: 11px;
  padding: 3px 0 0 5px;
  border:1px solid #666666;
  height: 17px;
  width: 145px;
  float: left;
}

/* wrap this around small */ 
/* separator images */
.separator {
  margin:0;
  padding:0;
}

/* wrap this around submit */
/* form 'go' buttons for */
/* consistency */
.go_button {
  float: left;
  padding: 3px 0 0 10px;
  margin:0;
  width:25px;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* MAIN LOGO */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
.main_logo {
  float:left;
  clear:none;
}

/* MAIN LOGO */
.main_logo img {
  border:0;
  margin:0;
  padding:0;
  margin-top: 10px;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* MAIN NAVIGATION MENU: above main content */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
.main_menu_nav {
  background: white  url('/images/header/bg_header.gif') repeat-x bottom left;
  z-index:1000px;
  padding-top:35px;
  margin:0px;
  width:964px;
  padding:0;
  border: 1px solid #cccccc; 
  border-top: 1px solid #e1e1e1; 
  font-weight:bold;
  align:left;
  font-size:12px;    
  color:#333333;
  /*clear:both;*/
  clear:right;
}


/* was not previously here */
.main_menu_nav a {
  display:inline-block;
}

/* links styled globally for IE */
.main_menu_nav a:link, .main_menu_nav a:visited {
  text-decoration:none;
  /*it switches to this color on rollout  */
  color:#666666;
  border:none;
}
.main_menu_nav a:hover {
  text-decoration:none;
  color:#666666;
}
.main_menu_nav img {
  border:0;
}

.main_menu_nav ul {
  line-height:30px;
  padding:0 0 0 10px;
  margin:0;
  list-style:none outside none;
  color:#666666;
  width: 960px;
}

.main_menu_nav li {
  /* display:inline-block; */
  display:inline;
  text-align:center;
  padding: 0px;
}

/* wrap around small image spacers */
.menu_elem_spcr {
  vertical-align: middle;
  padding-top: 3px;
}

/* wrap around menu links */
.menu_elem {
  vertical-align: middle;
  /* BE CAREFUL changing these; */
  /* font-size will affect width */
  /* of menu-elements. Can't know */
  /* what font the client browser */
  /* will use. Be conservative*/
  margin: 6px 4px 6px 4px;
}



/* .menu_elem a:link {color: ff0000;}
.menu_elem a:hover {color: #ffffff;}*/
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* MAIN CONTENT: main content of site div */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
.main_content {
  padding:0;
  margin:0;
  background-color:black;
  text-align:center;
  clear:both;
  width:100%;

  display:inline;
  position:inherit;
  /* display: block; */
  /* position: absolute; */
  
}


/* general: for centering elements*/
.ctr_img {
  width:100%;
  text-align:center;
  padding-top:5px;
  height:40px;
}


.menu1 a:hover {
  background: #DDDDDD;
}


/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* SUB SECTIONS */
/* */
/* sub-sections: */
/* each of these occupies space */
/* in a unique div and presents */
/* unique informations */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */


/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* small info box style */
/* a general style used by all */
/* sub-section boxes */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

.small_info_box_style {
  padding:15px;
  text-color:#DDDDDD;
  background-color: white;
  background-image: url(/img/transparent_bg.gif);
  
  /*background: white url(/img/boxbg.gif) repeat-x bottom left;*/
  /*height:400px;*/
}

.small_info_box_style h3 {
  font-size:12px;
  font-weight:bold;
  color:#888888;
  padding:0;
  margin:0;
  margin-bottom:4px;
}

.small_info_box_style p {
  line-height:18px;
  font-size:11px;
  font-weight:normal;
  padding:0;
  margin:0;
  color:#999999;
}

.small_info_box_style a {
  /*display:inline-block;*/
  display:inline;
}

.small_info_box_style a:link, a:visited {
  text-decoration:none;
  color:#555555; 
}

.small_info_box_style a:hover {
  text-decoration:none;
  color:#CCCCCC;
}

.small_info_box_style img {
  border: 0;
  padding:0;
  margin: 0;
  /*display:inline;*/
}


/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* about us */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

#aboutusbox {
  top:30px;
  left:-20;
  display:block;
  z-index: 9999;
  /*position:fixed;*/
  position:absolute;
  display:none; /*makes invisible by default*/
}

#aboutuscontent {
  border: 4px solid #DDDDDD;
  background-color:#FFFFFF;
  position:relative;
  /* IE shrinks this box if */
  /* height not specified */
  /*height:300px;*/ 
}

#aboutdinair.hover {
  background-color:#DDDDDD;
  color:#333333;
}


/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* need help */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

#needhelpbox {
  top:30px;
  left:-20;
  position:absolute;
  z-index: 9999;
  display:block;
  display:none; /*makes invisible by default*/
}

#needhelp.hover {
  background-color:#DDDDDD;
  color:#333333;
}

#needhelp {
 color:#555555;
 display:inline-block; 
}

#needhelpcontent {
  border: 4px solid #DDDDDD;
  background-color:#FFFFFF;
}


/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* sign up */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#signupbox {
  top:30px;
  left:-20;
  display:block;
  z-index: 9999;
  position:absolute;
  display:none; /*makes invisible by default*/
}

#signup.hover {
  background-color:#DDDDDD;
  color:#333333;
}

#signup {
 color:#555555;
 display:inline-block; 
}

#signupcontent {
  border: 4px solid #DDDDDD;
  background-color:#FFFFFF;
  /* IE shrinks this box if */
  /* height not specified */
  /*height:275px;*/ 
}


/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* signin */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

/* sign-in link has no js items: style is small */
#signinbox {
  top:30px;
  display:block;
  position:absolute;
  z-index: 9999;
}

#signincontent {
  /*background: #888888;*/
  border: 4px solid #cccccc;
  background-color:#FFFFFF;
}
/*
#signin {
 color:#555555;
 display:inline-block; 
}*/

#signup.hover {
  background-color:#DDDDDD;
  color:#333333;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* colors used by main menu nav items */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
.hover_pink a:hover {
  background: #FF66FF;
  color: #FFFFFF;
  display:inline-block;
}

.hover_red a:hover {
  background-color: #FF0033;
  color: #FFFFFF;
  display:inline-block;
}

.hover_black a:hover {
  background: #00CC33;
  color: #FFFFFF;
  display:inline-block;
}

.hover_blood a:hover{
  background: #FF9900;
  color: #FFFFFF;
  display:inline-block;
}

.hover_brown a:hover {
  background: #FF00FF;
  color: #FFFFFF;
  display:inline-block;
}


.hover_blue a:hover{
  background: #0000FF;
  color: #FFFFFF;
  display:inline-block;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* SUB SECTIONS */
/* */
/* sub-sections: */
/* each of these occupies space */
/* in a unique div and presents */
/* unique informations */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

.box_content {
  height: 282px;
  width:100%;
  background-color:#FFFFFF;
  background-image: url(/store/img/transparent_bg.gif);
}



/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* professional section */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

/* for js to style the button activating this section */
a#prof_btn.hover {
  background-color:#00CC33;
  text-color:#FFFFFF;
  color:#FFFFFF;
}

#professional_box {
  left:-20;
  display:inline-block;
  z-index: 9999;
  position:absolute;
  display:none; /*makes invisible by default*/
  border-bottom:1px solid #888888;
  width:745px;
}

#professional_content {
  /* black bg border */
  border: 4px solid #cccccc;
}

#btn_professional {
  display:inline-block;
}

#btn_professional.hover {
  /* black bg */
  background-color: #cccccc;
  color: #FFFFFF;
}
/* workshops section */

a#works_btn.hover {

  background-color:#FF9900;

  color:#FFFFFF;

}


#workshops_box {

  left:-20;

  display:inline-block;

  z-index: 9999;

  position:absolute;

  display:none; /*makes invisible by default*/

  border-bottom:1px solid #888888;

  width:745px;

}

#workshops_content {

  /* black bg border */

  border: 4px solid #cccccc;

}



#btn_workshops {

  display:inline-block;

}



#btn_workshops.hover {

  /* black bg */

  background-color: #cccccc;

  color: #FFFFFF;

}



/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* makeup section */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

a#mkup_btn.hover {
  background-color:#FF9900;
  color:#FFFFFF;
}

#make_up_box {
  left:-20;
  display:inline-block;
  z-index: 9999;
  position:absolute;
  display:none; /*makes invisible by default*/
  border-bottom:1px solid #888888;
  width:465px;
}

#make_up_content {
  /* dull pink border */
  border: 4px solid #CCCCCC;  
}

#btn_make_up {
  display:inline-block;
}

#btn_make_up.hover {
  /* dull pink bg */
  background-color: #CCCCCC;
  color: #FFFFFF;
}












/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* gift section */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

a#gift_btn.hover {
  background-color:#FF9900;
  color:#FFFFFF;
}

#gift_box {
  left:-20;
  display:inline-block;
  z-index: 9999;
  position:absolute;
  display:none; /*makes invisible by default*/
  border-bottom:1px solid #888888;
  width:465px;
}

#gift_content {
  /* dull pink border */
  border: 4px solid #CCCCCC;  
}

#btn_gift {
  display:inline-block;
}

#btn_gift.hover {
  /* dull pink bg */
  background-color: #CCCCCC;
  color: #FFFFFF;
}














/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* personal section */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

a#prsn_btn.hover {
  background-color:#FF0033;
  color:#FFFFFF;
}

#personal_box {
  left:-20;
  display:inline-block;
  position:absolute;
  z-index: 9999;
  display:none; /*makes invisible by default*/
  border-bottom:1px solid #888888;
  width:231px;
}

#personal_content {
  /* dull pink border */
  border: 4px solid #CCCCCC;
}

#btn_personal {
  display:inline-block;
}

#btn_personal.hover {
  /* dull pink bg */
  background-color: #CCCCCC;
  color: #FFFFFF;
}


/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* tanning section */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

a#tann_btn.hover {
  background-color:#FF00FF;
  color:#FFFFFF;
}

#tanning_box {
  left:-20;
  display:inline-block;
  position:absolute;
  z-index: 9999;
  display:none; /*makes invisible by default*/
  border-bottom:1px solid #888888;
  width:240px;
}

#tanning_content {
  /* dull brown border */
  border: 4px solid #CCCCCC;
}

#btn_tanning {
  display:inline-block;
}

#btn_tanning.hover {
  /* dull brown bg */
  background-color: #CCCCCC;
  color: #FFFFFF;
}


/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* whyairbrush section */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

a#whya_btn.hover {
  background-color:#FF66FF;
  /*color:#FFFFFF;*/
}

#why_airbrush_box {
  left:-20;
  display:inline-block;
  position:absolute;
  z-index: 9999;
  display:none; /*makes invisible by default*/
  border-bottom:1px solid #888888;
  width:647px;
}

#why_airbrush_content {
  /* light pink border */
  border: 4px solid #cccccc;
}

#btn_why_airbrush {
  display:inline-block;
}

/*#btn_why_airbrush a:link {color: #09f85d;}
#btn_why_airbrush a:hover {color: #cccccc;}*/

#btn_why_airbrush.hover {
  /* light pink bg */
  background-color: #CCCCCC;
  /* turned o0ff because it doesnt change anything color: #FF0000; */ 
}




/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* howto section */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

a#hwto_btn.hover {
  background-color:#0000FF;
  color:#FFFFFF;
}

#how_to_box {
  left:-20;
  display:inline-block;
  position:absolute;
  z-index: 9999;
  display:none; /*makes invisible by default*/
  border-bottom:1px solid #888888;
  width:662px;
}

#how_to_content {
  /* dull blue border */
  border: 4px solid #CCCCCC;
}

#btn_how_to {
  display:inline-block;
}

#btn_how_to.hover {
  /* dull blue bg */
  background-color: #CCCCCC;
}



#help_box {
  left:-20;
  display:inline-block;
  position:absolute;
  z-index: 9999;
  display:none; /*makes invisible by default*/
  border-bottom:1px solid #888888;
  width:662px;
}

#help_content {
  /* dull blue border */
  border: 4px solid #CCCCCC;
}

#btn_help {
  display:inline-block;
}

#btn_help.hover {
  /* dull blue bg */
  background-color: #CCCCCC;
}

#btn_buy_kit {
  display:inline-block;
}

#btn_buy_kit.hover {
  /* black bg */
  background-color:#CCCCCC;
}


#btn_view_cart {
  display:inline-block;
}

#btn_view_cart.hover {
  /* black bg */
  background-color:#CCCCCC;
}


/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* general styles for subsections above */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

.deep_list {
  text-align:left;
  font-size:12px;
}

.deep_list h3 {
  padding:0;
  margin:0;
}

.deep_list ul {
  list-style-type:none; /* no bullet */
  padding:0;
  margin:0;
}

.deep_list li {
  list-style-type:none;
  font-weight:normal;
  line-height:23px;
  /*color:#333333;*/  
  display:block;     
  padding:0;
  margin:0;

}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* menu column establishes column */
/* that occupies its own vertical */
/* space within the parent elem   */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
.menu_column {
  float:left;
  padding:0;
  margin:0;
  padding-left:8px;
  padding-right:8px;
}

.menu_section {
  padding-top:8px;
  text-align:left;
}

.menu_title {
  padding:0;
  margin:0;
  padding-bottom:4px;
  border-bottom:1px solid #BBBBBB;
}

.headerH  {
  font-weight:bold;
  font-size:12px;
  color: #000000;
  background-color: #fce8fc;
}

.menu_title h3 {
  font-weight:bold;
  font-size:13px;
  color: #000000;
  padding:0;
  margin:0;
}
.menu_title h3 a:link {
	color: #000000;
}
.menu_title h3 a:visited {
	color: #000000;
}

.menu_full {
  /*padding-right:8px;
  padding-left:8px;*/
  padding:0;
  font-weight:normal;  
  font-size:12px;
  height:175px;
  color: #666666;  
}

.menu_full a:link, .menu_full a:visited {
  text-decoration:none; 
  /* LINKS color for main boxes links */
  color:#666666;
}

.menu_full a:hover {
  text-decoration:none;
  /* HOVER for main boxes links */
  color:#444444;
}

.menu_full ul {
  display:block;
  line-height: 30px;
  list-style: none outside none;
  padding:0;
  margin:0;
}

.list_section {
  padding:0;
  margin:0;
  float:left;
}

.menu_icons {
  /*padding-left:8px;
  padding-right:8px;*/
  padding:0;

}

.menu_icons img {
  border:0;
  padding:0;
  margin:0;
  margin-left:0px;
  margin-right:0px;

}

.menu_icons a {
  display:inline;
}


/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* these classes load images that */
/* are found in hidden divs. IE7  */
/* needs css to load these images */
/* or it will not display them    */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

.call_bg {
  width: 149px;
  height: 36px;
  display: inline-block;
  background: white url(/img/call_bg.jpg); /*repeat-x bottom left;*/
  background-repeat: no-repeat;
}

.signin_form {
  margin:0;
  padding:0;
  margin-top:15px;
}

.signin_form fieldset {
  border:0;
  padding:0;
  margin:0;
  margin-bottom:5px;
}

.signin_form input {

}

.signin_form label {
  margin:0;
  padding:0;
  font-size:11px;
  color:#999999;
  text-align:right;
  float:left;
  width:95px;
  display:inline-block;
  clear:left;
  line-height:23px;
}