body {
  margin: 0;
  padding: 0;
  background-color: #666666;
  font-family: Arial,Helvetica,Nimbus Sans,Verdana,sans-serif;
  font-size: 11px;
}

p {
  margin: 0;
}

img {
  border: 0;
}

a {
  text-decoration: none;
  color: #000000;
}

#wrapper {
  width: 320px;
  background: url(http://www.ubykotex.com/mobile/img/bg_gradient.jpg) no-repeat #C9C9C9;
}

#content {
  background: url(http://www.ubykotex.com/mobile/img/logo_black.gif) no-repeat 8px 13px;
  clear: left;
}

.content {
  padding: 0px 10px;
}

.headline {
  font-size: 12px;
  font-weight: bold;
}

.green_box {
  display: block;
  background-color: #8FD400;
  padding: 5px 8px;
  color: #000000;
  text-decoration: none;
  font-weight: bold;
}

a.green_box {
  background: url(http://www.ubykotex.com/mobile/img/arrow_green.gif) no-repeat 97% center #8FD400;
}

.yellow_box {
  display: block;
  background-color: #FED900;
  padding: 5px 8px;
  color: #000000;
  text-decoration: none;
  font-weight: bold;
}

a.yellow_box {
  background: url(http://www.ubykotex.com/mobile/img/arrow_yellow.gif) no-repeat 97% center #FED900;
}

.black_background {
  /*background: url(http://www.ubykotex.com/mobile/img/bg_black.gif) repeat-y;*/
  background-color: #000000;
}

.white_background {
  background-color: #FFFFFF;
  padding: 5px;
}

.divider_light {
  line-height: 1px;
  border-bottom: 2px dotted #CCCCCC;
  margin-bottom: 6px;
  padding-top: 6px;
  clear: both;
}

.divider_dark {
  line-height: 1px;
  border-bottom: 2px dotted #999999;
  margin-bottom: 6px;
  padding-top: 6px;
  clear: both;
}

#freebies {
  margin-top: 5px;
}

#freebies img {
  margin-left: 29px;
  padding: 10px 0px;
}

#youtube {
  background: url(http://www.ubykotex.com/mobile/img/youtube_icon.jpg) no-repeat 10px 0;
}

#youtube a {
  padding: 3px 0 3px 85px;
  display: block;
}

#youtube span {
  padding-right: 14px;
  font-size: 12px;
}

.pink { color: #E81E75; }
.green { color: #8FD400; }
.blue { color: #51B0F0; }
.yellow { color: #FED900; }

.pink_arrow { background: url(http://www.ubykotex.com/mobile/img/arrow_pink.gif) no-repeat right center; }
.green_arrow { background: url(http://www.ubykotex.com/mobile/img/arrow_green.gif) no-repeat right center; }
.blue_arrow { background: url(http://www.ubykotex.com/mobile/img/arrow_blue.gif) no-repeat right center; }
.yellow_arrow { background: url(http://www.ubykotex.com/mobile/img/arrow_yellow.gif) no-repeat right center; }
/* *********************
 *     Navigation      *
 **********************/

#header {
  background: url(http://www.ubykotex.com/mobile/img/nav/bg.gif) no-repeat;
  height: 27px;
}

#header a {
  display: block;
  float: left;
  padding: 5px 7px 10px;
  font-size: 10px;
  text-decoration: none;
  color: #FFFFFF;
}

#header a.last {
  border-right: none;
  padding-right: 10px;
}
#header img {
  float: left;
}
div.products #header .nav_products {
  background: url(http://www.ubykotex.com/mobile/img/nav/green_bg.gif) no-repeat;
  color: #000000;
}
div.get_real #header .nav_real {
  background: url(http://www.ubykotex.com/mobile/img/nav/pink_bg.gif) no-repeat;
  color: #000000;
}
div.real_answers #header .nav_answers {
  background: url(http://www.ubykotex.com/mobile/img/nav/blue_bg.gif) no-repeat;
  color: #000000;
}
div.mission #header .nav_mission {
  background: url(http://www.ubykotex.com/mobile/img/nav/yellow_bg.gif) no-repeat;
  color: #000000;
}


/* *********************
 *      HOMEPAGE       *
 **********************/
#homepage_overview {
  background: url(http://www.ubykotex.com/mobile/img/homepage/header_background.jpg) no-repeat left top;
  height: 240px;
  width: 320px;
}

#homepage_overview p {
  width: 280px;
  font-size: 12px;
  padding: 135px 10px 0px;
}

#homepage_overview .social_media_icons {
  list-style: none;
  margin: 0 36px;
  padding: 0;
}

#homepage_overview .social_media_icons li {
  display: inline-block;
  margin: 10px 5px;
}

#homepage_sections {
  color: #FFFFFF;
  padding: 0;
}

#homepage_sections a {
  text-decoration: none;
  color: #FFFFFF;  
}

#homepage_sections .black_background {
  padding: 10px 9px;
}

.section {
  height: 90px;
  margin-bottom: 4px;
}

.section h2 {
  margin: 0px;
  font-size: 14px
}

.section h3 {
  margin: 0 0 2px 0;
  font-size: 12px;
}

.section h3 span {
  padding-right: 15px;
}

.section img {
  float: left;
}

.section div {
  float: left;
  height: 75px;
  width: 140px;
  margin-left: 12px;
  padding-top: 6px;
  padding-bottom: 9px;
  border-bottom: 2px dotted #999999;
}

/*.section_facebook {
  height: 24px;
  margin: 10px 0px 0px 2px;
  padding-bottom: 5px;
}

.section_facebook img {
  float: left;
}

.section_facebook div {
  float: left;
  width: 250px;
  margin-left: 10px;
}

.section_facebook div p {
  margin-top: -4px; 
}*/

/* *********************
 *      PRODUCTS       *
 **********************/

#products_overview {
  background: url(http://www.ubykotex.com/mobile/img/products/overview.jpg) no-repeat right top;
  padding: 155px 8px 0px 12px;
}

#products_overview span.green_box {
  position: absolute;
  left: 212px;
  top: 36px;
  font-size: 11px;
  padding: 5px 5px;
}

#products_lineup {
  background: url(http://www.ubykotex.com/mobile/img/products/lineup.jpg) no-repeat;
  height: 134px;
}

#products_lineup a {
  display: block;
  float: left;
  padding-top: 112px;
}

#products_lineup a span {
  padding-right: 12px;
  font-weight: bold;
}

#products_lineup a.pads {
  width: 125px;
}

#products_lineup a.liners {
  width: 80px;
}

#products_lineup a.tampons {
  width: 95px;
}
#products_lineup a.pads span {
  padding-left: 40px;
}

#products_lineup a.liners span {
  padding-left: 20px;
}

#products_lineup a.tampons span {
  padding-left: 25px;
}

#products_detail {
  padding: 43px 8px 10px 65px;
  font-size: 12px;
}

#products_detail.long_description {
  padding-top: 28px;  
}

#products_detail span.green_box {
  position: absolute;
  left: 212px;
  top: 36px;
  font-size: 11px;
  padding: 5px 5px;
}
.product {
  height:116px;
}
.product img {
  float: left;
  margin-right: 5px;
}
.product .product_name {
  padding-top: 20px;
  font-weight: bold;
}
.product_name_multiple {
  padding-top: 4px;
  font-weight: bold;
}

.product .product_description {
  float:left;
  font-size:10px;
  margin-top:4px;
  padding-bottom:16px;
  padding-left:2px;
  width:34%;
}

.pink_dots { background: url(http://www.ubykotex.com/mobile/img/products/dots_pink.gif) no-repeat left bottom; }
.blue_dots { background: url(http://www.ubykotex.com/mobile/img/products/dots_blue.gif) no-repeat left bottom; }
.yellow_dots { background: url(http://www.ubykotex.com/mobile/img/products/dots_yellow.gif) no-repeat left bottom; }
.green_dots { background: url(http://www.ubykotex.com/mobile/img/products/dots_green.gif) no-repeat left bottom; }
.purple_dots { background: url(http://www.ubykotex.com/mobile/img/products/dots_purple.gif) no-repeat left bottom; }
.orange_dots { background: url(http://www.ubykotex.com/mobile/img/products/dots_orange.gif) no-repeat left bottom; }

#product_sample_ty {
  padding: 43px 8px 10px 65px;
}
#product_sample_ty .headline {
  font-size: 14px;
}

#privacy p{
  padding-bottom: 8px;
}
/* *********************
 *      GET REAL       *
 **********************/

#get_real_overview {
  padding: 20px 8px 0px 66px;
}

.get_real a.large_video {
  display: block;
  margin-top: 10px;
}

.get_real a.large_video img {
  float: left;
}

.get_real a.large_video p {
  float: left;
  width: 100px;
  margin-left: 8px;
}

.get_real a.large_video p span.pink_arrow {
  padding-right: 14px;
}

a.small_video {
  float: left;
  margin-right: 6px;
}

a.small_video p {
  width: 135px;
}

a.small_video p span.pink_arrow {
  padding-right: 14px;
}

.get_real #youtube {
  background-position: 10px 6px;
}

.get_real #youtube a {
  padding: 0 0 0 85px;
}

/* *********************
 *    REAL ANSWERS    *
 **********************/
#real_answers_overview {
  padding: 33px 8px 0px 66px;
}

.question_bullet, #real_answers_list a.question {
  display: block;
  float: left;
  padding-top: 2px;
}

#real_answers_list a.question {
  width: 90%;
  margin-left: 4px; 
}

#real_answers_list p {
  clear: left;
}

#real_answers_list p span.blue_arrow {
  padding-right: 14px;
}

#real_answers_video_overview {
  padding: 44px 8px 10px 66px;
}

#real_answers_video p {
  margin-bottom: 4px;
}

#real_answers_video a.large_video img {
  float: left;
  margin-right: 6px;
}

#real_answers_question_overview {
  padding: 32px 8px 0px 66px;
}

#real_answers_question .responders {
  margin-top: 4px;
}

#real_answers_question .responders a {
  display: block;
  float: left;
  padding: 7px;
  height: 125px;
}

#real_answers_question .responders a img {
  border: 1px solid #666666;
}

#real_answers_question .responders .responder_title {
  font-size: 10px;
  font-weight: bold;
}

#real_answers_question .responders .responder_name {
  font-weight: bold;
  color: #999999;
  width: 75px;
}

#real_answers_question .responses {
  clear: left;
  padding: 10px;
  color: #CCCCCC;
  width: 275px;
}

#real_answers_question .responses #mom_response, #real_answers_question .responses #peer_response {
  display: none;
}

.responses a {
  color: #CCCCCC;
  text-decoration: underline;
}

/* *********************
 *       MISSION       *
 **********************/

#mission_overview {
  min-height: 90px;
}

#mission_overview img.logo {
  float: left;
  padding: 0 8px 8px 0;
  margin: 13px 0 0 -2px;
}

#mission_overview p {
  margin-bottom: 8px;
}

#mission_overview p.headline, #mission_overview p.no_margin {
  margin-bottom: 0px;
}

#mission_button {
  padding: 15px;
  text-align: center;
}

#mission_overview #mission_button .headline{
  margin-bottom: 5px;
}

input.mission_submit {
  background: url(http://www.ubykotex.com/mobile/img/arrow_yellow.gif) no-repeat 97% center #FED900;
  width: 265px;
  font-family: Arial;
  font-size: 11px;
  border: none;
  font-weight: bold;
  padding: 5px;
  cursor: pointer;
}