﻿/* =========================================================================
 *
 * @filename /css/screen/homepage.css
 *
 * @author MAM Baby Felicki Przemysław
 * @copyright (c) 2009 Copyright by MAM Baby Felicki Przemysław
 *
 * ========================================================================= */
 
 
/* ========================================================== Promobox ===== */
   #promobox {
     margin: 0 20px 20px !important;
   }
   
   #promobox .content {
     width: 100%;
   }
   
   
/* ================================================ Pink Content Block ===== */
   .block.pink {
     background: #F3ECF2;
   }
   
   .block.pink .content {
     margin: 0 3px;
   }
   
   
/* ======================================================= Big Buttons ===== */
   .button.big {
     float: left;
   
     width: 230px;
     height: 285px;
     
     margin: 0 4px;
     
     background: #FFF;
     
     outline: none;
     cursor: pointer;
   }
   
   .button.big .content {
     display: block;
   
     width: 220px;
     height: 275px;
   }
   
   .button.big .top, 
   .button.big .bottom {
     position: relative;
     
     top: 0;
     left: 0;
   
     display: block;
   
     width: 229px;
     height: 5px;
   }
   
   .button.big .top .left, 
   .button.big .top .right, 
   .button.big .bottom .left, 
   .button.big .bottom .right  {
     display: block;
   
     width: 5px;
     height: 5px;
   }
   
   .button.big .top .left, 
   .button.big .bottom .left {
     float: left;
   }
   
   .button.big .top .right, 
   .button.big .bottom .right {
     float: right;
   }
   
   .button.big .top .left {
     background: url(/var/img/button/big/corner/top/left.png) no-repeat;
   }
   
   .button.big .top .right {
     background: url(/var/img/button/big/corner/top/right.png) no-repeat;
   }
   
   .button.big .bottom .left {
     background: url(/var/img/button/big/corner/bottom/left.png) no-repeat;
   }
   
   .button.big .bottom .right {
     background: url(/var/img/button/big/corner/bottom/right.png) no-repeat;
   }
   
   .button.big#akcesoria {
     background: url(/var/img/button/big/akcesoria.png) no-repeat;
   }
   
   .button.big#pielegnacja_jamy_ustnej {
     background: url(/var/img/button/big/pielegnacja_jamy_ustnej.png) no-repeat;
   }
   
   .button.big#butelki {
     background: url(/var/img/button/big/butelki.png) no-repeat;
   }
   
   .button.big#smoczki {
     background: url(/var/img/button/big/smoczki.png) no-repeat;
   }
   
   .button.big h2 {
     position: relative;
     
     z-index: 9;
   
     top: -5px;
     left: -3px;
     
     height: 31px;
   }
   
   .button.big h2 .left {
     display: block;
     
     float: left;
   
     width: 7px;
     height: 31px;
     padding: 0;
     
     background: url(/var/img/button/big/heading/left.png) no-repeat;
   }
   
   .button.big h2 .content {
     display: block;
     
     float: left;
     
     width: 190px !important;
     height: 31px;
     
     margin: 0;
     padding: 0;
     
     background: #FFF;
   }
   
   .button.big h2 .right {
     display: block;
     
     float: left;
     
     width: 7px;
     height: 31px;
     
     margin: 0;
     padding: 0;
     
     background: url(/var/img/button/big/heading/right.png) no-repeat;
   }
   
   
/* ==================================================== Middle Buttons ===== */
   #buttons {
     margin: 0 20px;
   }
   
   #buttons .button.middle {
     float: left;
   
     width: 33%;
     height: 180px;
     
     border-right: dashed 1px #D8C0DC;
     
     color: #2E2E2E;
     text-decoration: none;
     outline: none;
   }
   
   #buttons .button.middle#mam_sklep_online {
     background: url(/var/img/background/navigation/button/middle/mam_sklep_online.png) no-repeat left center;
   }
   
   #buttons .button.middle#mam_sklep_online .heading {
     display: block;
     
     position: relative;
     
     top: 10px;
     left: 160px;
   
     width: 140px;
     height: 15px;
     
     background: url(/var/img/heading/heading/mam-sklep-online.png) no-repeat;
     
     text-indent: -9999px;
   }
   
   #buttons .button.middle#mam_sklep_online .text {
     display: block;
   
     position: relative;
     
     top: 30px;
     left: 160px;
     
     width: 140px;
   }
   
   #buttons .button.middle#mam_sklep_online .text #icon_48h {
     display: block;
   
     position: relative;
     
     top: 0;
     left: 80px;
     
     width: 55px;
     height: 50px;
     
     background: url(/var/img/icon/48h.png) no-repeat;
     
     text-indent: -9999px;
   }
   
   #buttons .button.middle#zobacz_gdzie_kupisz_produkty_mam .heading {
     display: block;
     
     position: relative;
     
     top: 3px;
     left: 15px;
     
     width: 288px;
     height: 24px;
     
     background: url(/var/img/heading/heading/zobacz_gdzie_kupisz_produkt.png) no-repeat;
     
     text-indent: -9999px;
   }
   
   #buttons .button.middle#zobacz_gdzie_kupisz_produkty_mam .text {
     display: block;
     
     position: relative;
     
     top: 20px;
     left: 19px;
     
     width: 280px;
     height: 50px;
   }
   
   #buttons .button.middle#zobacz_gdzie_kupisz_produkty_mam .button {
     float: left;
   }
   
   #buttons .button.middle#zobacz_gdzie_kupisz_produkty_mam .button#apteki {
     display: block;
     
     position: relative;
     
     top: 10px;
     left: 60px;
     
     width: 85px;
     height: 65px;
     
     background: url(/var/img/logo/apteki.png) no-repeat;
     
     text-indent: -9999px;
     outline: none;
   }
#buttons .button.middle#zobacz_gdzie_kupisz_produkty_mam .button#kku {
     display: block;

     position: relative;

     top: 40px;
     left: 15px;

     width: 150px;
     height: 65px;

     background: url(/var/img/logotypy_gdzie_kupisz/logo-ursynow.png) no-repeat;

     text-indent: -9999px;
     outline: none;
   }
   
  
   

#buttons .button.middle#zobacz_gdzie_kupisz_produkty_mam .button#kkt {
     display: block;

     position: relative;

     top: 20px;
     left: 15px;

     width: 130px;
     height: 65px;

     background: url(/var/img/logotypy_gdzie_kupisz/logo-targowek.png) no-repeat;

     text-indent: -9999px;
     outline: none;
   }
      
#buttons .button.middle#zobacz_gdzie_kupisz_produkty_mam .button#kkp {
     display: block;

     position: relative;

     top: 10px;
     left: 5px;

     width: 77px;
     height: 65px;

     background: url(/var/img/logotypy_gdzie_kupisz/kkp.png) no-repeat;

     text-indent: -9999px;
     outline: none;
   }
   
   #buttons .button.middle#zobacz_gdzie_kupisz_produkty_mam .button#gagu_pl {
     display: block;
     
     position: relative;
     
     top: 10px;
     left: 70px;
     
     width: 85px;
     height: 65px;
     
     
     text-indent: -9999px;
     outline: none;
   }
   
   #buttons .button.middle#zarejestruj_swoja_apteke {
     background: url(/var/img/background/navigation/button/middle/zarejestruj_swoja_apteke.png) no-repeat center;
     
     text-indent: -9999px;
     outline: none;
   }
   
   
/* =========================================================== Content ===== */
   .content h1#witamy_w_nowym_swiecie_mam_ {
     width:                       100%;
   
     margin:                      10px 0 20px 0;
   
     background:                  url(/var/img/heading/h1/witamy_w_nowym_swiecie_mam_.png) 
                                  no-repeat 
                                  center;
   
     text-indent:                 -9999px;
   }
   
   
/* ------------------------------------------------------- Big Buttons ----- */
   .button.big h2 .content {
     text-indent: -9999px;
   }

   .button.big#smoczki h2 .content {
     background: #FFF url(/var/img/heading/h2/smoczki.png) no-repeat 5px 10px;
   }

   .button.big#butelki h2 .content {
     background: #FFF url(/var/img/heading/h2/butelki.png) no-repeat 5px 10px;
   }

   .button.big#pielegnacja_jamy_ustnej h2 .content {
     background: #FFF url(/var/img/heading/h2/pielegnacja_jamy_ustnej.png) no-repeat 5px 10px;
   }

   .button.big#akcesoria h2 .content {
     background: #FFF url(/var/img/heading/h2/akcesoria.png) no-repeat 5px 10px;
   }