/*****************************************************************************************/
/* BLUEBELL COTTAGE GARDENS AND NURSERY 2014                                             */
/*****************************************************************************************/
HTML
  {
  background: #eeddff;
  background-image: linear-gradient( top, #EEDDFF, #9D8BBA );
  background-image: -moz-linear-gradient( top, #EEDDFF, #9D8BBA );
  background-image: -webkit-linear-gradient( top, #EEDDFF, #9D8BBA );
  padding: 0;
  overflow-y: scroll;
  }

:FOCUS
  {
  outline: 0;
  }

BODY
  {
  width: 960px;
  min-height: 800px;
  min-height: 100vh;
  margin: 0 auto ;
  padding: 0;
  color: #333333;
  background:white;
  }

.portrait
  {
  display: none ;
  }

/*****************************************************************************************/
/* PRINTED PAGE HEADER ONLY                                                              */
/*****************************************************************************************/
DIV.printheader
  {
  display: none;
  padding: 8px;
  color: white;
  background: #0084B5;
  text-align: center;
  font-family: Tahoma, Arial, Helvetica, sans-serif ;
  font-size: 11pt;
  font-weight: bold;
  }

/*****************************************************************************************/
/* OVERALL HORIZONTAL STRUCTURE OF PAGE                                                  */
/*****************************************************************************************/
TD.sidebar
  {
  width: 240px;
  }

TD.main
  {
  padding: 16px 16px 36px 6px;
  }

.spacer
  {
  width: 24px;
  }


/*****************************************************************************************/
/* PAGE CONTENT                                                                          */
/*****************************************************************************************/
TD.main
  {
  font-family: Tahoma, Arial, Helvetica, sans-serif ;
  font-size: 11pt;
  }

H1
  {
  color: #0084B5;
  font-family: Georgia, "Times New Roman", Times, Serif;
  font-weight: normal;
  margin-top: 0;
  font-size: 150%;
  line-height: 150%;
  } 

H2
  {
  color: #6C669D;
  font-family: Georgia, "Times New Roman", Times, Serif;
  font-weight: normal;
  font-size: 133%;
  line-height: 150%;
  }

H3 
  {
  font-size: smaller;
  font-weight: bold;
  font-family: arial,helvetica;
  padding: 4px;
  border-bottom: solid #9088BA 1px;
  background: #E0CEF3;
  margin: 24px 0 4px 0;
  }

UL
  {
  padding-left: 0.1em ;
  margin-left: 1em;
  }

TD.main P
  {
  line-height: 150%;
  }

TD.main A, TD.main A:VISITED
  {
  color: navy;
  color: #577191;
  }

TD.main A:HOVER
  {
  color: red;
  }

A.quiet
  {
  text-decoration: none;
  }

A.quiet:HOVER
  {
  text-decoration: underline;
  }

.intro
  {
  color: #4D6C4D;
  }

.caption
  {
  font-size: smaller;
  color: #4D6C4D;
  }

.smaller
  {
  font-size: smaller;
  }

p.suesig
  {
  font-family: "Comic Sans MS", cursive, sans-serif;
  }

TD.rightsidepics
  {
  width: 200px;
  }

DIV.mobile
  {
  display: none;
  }

/*****************************************************************************************/
/* TOP  MENU                                                                            */
/*****************************************************************************************/
DIV.topmenu
  {
  background: #0084B5;
  margin-bottom: 16px;
  padding: 0 16px;
  }

DIV.topmenu A, DIV.topmenu A:VISITED
  {
  display: inline-block;
  padding: 8px 6px;
  color: white;
  font-family: Calibri, Arial, Helvetica;
  font-size: 11pt;
  font-weight: bold;
  text-decoration: none;
  }

DIV.topmenu A:HOVER
  {
  color: white;
  background: #968DCD ;
  }

DIV.topmenu A.menushortcut
  {
  font-weight: bold;
  display: none;
  }
  
/*****************************************************************************************/
/* SIDE  MENU                                                                            */
/*****************************************************************************************/ 
DIV.menu
  {
  width: 240px;
  padding: 0 0 6px 0;
  margin-right:16px;
  text-align: left;
  }

DIV.mainhead
  {
  padding: 12px 0 8px 0;
  }

DIV.menu IMG
  {
  display: block;
  width:230px;
  padding-left:10px;
  }

DIV.subhead
  {
  color: #6C669D;
  font-family: Georgia, "Times New Roman", Times, Serif;  
  font-size: 110%;
  margin: 16px auto 2px auto;
  padding: 4px 0 6px 10px;
  border-bottom: solid #564BAB 2px;
 }

DIV.menu A, DIV.menu A:VISITED
  {
  display: block;
  padding: 2px 0 2px 10px;
  color: black;
  text-decoration: none;
  font-size:75%;
  font-family: Tahoma, Arial, Helvetica, sans-serif ; 
  }

DIV.menu A:ACTIVE, DIV.menu A:HOVER
  {
  color:#564BAB;
  }

DIV.menu A:BEFORE
  {
  content: "\25B6\0020";
  color:#564BAB;
  }

/*****************************************************************************************/
/* HOME PAGE BOXES                                                                       */
/*****************************************************************************************/
DIV.homepagebox
  {
  position: relative;
  }

DIV.homepagebox IMG
  {
  display: block;
  width: 147px;
  height: 110px;
  }

DIV.homepagebox DIV.overlay
  {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 147px;
  color: white;
  background: #393173;
  text-align: center;
  padding: 4px 0 6px 0;
  font-family: Calibri, Arial, Helvetica;
  font-weight: bold;
  opacity:0.75;
  line-height: 100%;
  }


/*****************************************************************************************/
/* IMAGE CONTAINER FOR SLIDING IMAGES (GARDEN PAGE)                                      */
/*****************************************************************************************/
DIV.photocontainer
  {
  position: relative;
  top: 1px;
  width: 648px;
  height: 459px;
  border: solid #CCCCCC 1px;
  overflow: hidden;
  background: #EEEEEE;
  margin-bottom: 24px;
  }

DIV.photocontainer IMG
  {
  display: block;
  margin: 0 auto 0 auto ;
  }

DIV.photocontainer A,
DIV.photocontainer A:active,
DIV.photocontainer A:visited,
DIV.photocontainer A:hover
  {
  font-family: "Arial Unicode MS" ;
  font-size: 48pt;
  font-weight: bold;
  color: #ddddff;
  text-shadow: 0 0 12px black;
  text-decoration: none;
  position: absolute;
  bottom: 0;
  width: 80px;
  text-align: center;
  z-index: 99;
  padding: 16px 0px 32px 0px;
  outline: none;
  }

DIV.photocontainer A:HOVER
  {
  color: #ffffee;
  }

DIV.photocontainer A.leftarrow
  {
  left: 0;
  }

DIV.photocontainer A.rightarrow
  {
  right: 0;
  }

/*****************************************************************************************/
/* SHOP FRONT                                                                            */
/*****************************************************************************************/
TABLE.shopfront TD
  {
  line-height: 166%;
  }

TABLE.shopselection TD
  {
  font-size: smaller;
  padding-bottom: 24px;
  }

TABLE.shopselection TD IMG
  {
  display: block;
  width: 156px;
  height: 156px;
  border: 0;
  margin-bottom: 4px;
  }

TABLE.shopselection TD A , TABLE.shopselection TD A:VISITED
  {
  color: black;
  font-weight: bold;
  text-decoration: none ;
  }

TABLE.shopselection TD A:ACTIVE , TABLE.shopselection TD A:HOVER
  {
  color: #CC0000 ;
  text-decoration: underline;
  }

TD.shopfilter P
  {
  font-size: smaller;
  }
  

/*****************************************************************************************/
/* FEATURED PLANTS IN SHOP PAGES                                                         */
/*****************************************************************************************/
A.featuredplant
  {
  display: block;
  position: relative;
  text-decoration: none;
  }

A.featuredplant IMG
  {
  display: block;
  width: 100%;
  border: 0;
  margin-bottom: 4px;
  }

DIV.featuredtitle
  {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  padding: 4px 0;
  color: white;
  background: rgba( 0,0,0,0.25 ) ;
  text-align: center;
  text-shadow: 0 0 4px black;
  white-space: nowrap;
  overflow: hidden;
  }

DIV.featurednotes
  {
  height: 64px;
  overflow: hidden;
  font-size: 10pt;
  line-height: 12pt;
  }


/*****************************************************************************************/
/* ALPHABET BUTTONS AND SEARCH SIDEBARS                                                  */
/*****************************************************************************************/
TD.main A.alphabutton, TD.main A.alphabutton:VISITED
  {
  display: inline-block;
  width: 16px;
  overflow: hidden;
  padding: 3px;
  margin-right: 2px;
  text-align:center;
  text-decoration: none;
  font-family: "Arial Rounded", Arial, Helvetica;
  font-size: 10pt;
  border: solid #6C669D 1px;
  border-radius: 4px 4px 0 0;
  color: #6C669D;
  background: #D2CEE3;
  }

TD.main A.alphabutton:HOVER
  {
  color: #6C669D;
  background: white;
  }

TABLE.catalog TD
  {
  padding: 6px 4px;
  border-bottom: solid #BCC9FD 1px;
  }

DIV.sidebardivider
  {
  padding: 4px;
  font-family: arial, helvetica;
  font-weight: bold;
  font-size: smaller;
  color: black;
  background: #E0CEF3;
  border-radius: 0 4px 0 0 ;
  }


/*****************************************************************************************/
/* PLANTS LAYOUT TABLES                                                                  */
/*****************************************************************************************/
TABLE.plants
  {
  margin-bottom: 16px;
  }

TABLE.plants TD
  {
  font-family: arial;
  font-size: small;
  padding: 6px 0 6px 0;
  border-bottom: solid #9D8BBA 1px;
  }


/*****************************************************************************************/
/* SHOP                                                                                  */
/*****************************************************************************************/
TABLE.basket TD
  {
  padding: 6px 2px ;
  border-bottom: solid #666666 1px;
  }

TABLE.basket TR.header TD
  {
  background: #DDDAEF ;
  }

TABLE.basket TR.total TD
  {
  background: #F7F5FE ;
  }

TABLE.basket A, TABLE.basket A:VISITED
  {
  text-decoration: none;
  }

TABLE.basket A:HOVER
  {
  text-decoration: underline;
  }

/*****************************************************************************************/
/* SITE SEARCH BAR                                                                       */
/*****************************************************************************************/
DIV.sitesearch
  {
  display: inline-block;
  float: right;
  margin: 2px 2px 0 8px;
  }

DIV.sitesearch FORM
  {
  display: inline-block;
  }

#sitesearchbox
  {
  border: none;
  border-radius: 2px;
  margin: 0;
  padding: 0;
  font-size: 10pt;
  width: 100px;
  padding: 2px 2px 2px 8px;
  background: #968DCD;
  color: #464bab;
  }

#sitesearchbutton
  {
  position: relative;
  top: 4px;
  }

/*****************************************************************************************/
/* SITE SEARCH ON PAGE                                                                   */
/*****************************************************************************************/
#searchbox
  {
  width: 360px;
  }

#searchbutton
  {
  background: #cccccc;
  padding: 4px;
  border: solid silver 1px;
  border-bottom: solid #999999 1px;
  border-right: solid #AAAAAA 1px;
  border-radius: 4px;
  }

P.xref
  {
  column-count: 4;
  column-gap: 2em;
  column-rule: solid #999999 1px;
  -ms-column-count: 4;
  -ms-column-gap: 2em;
  -ms-column-rule: solid #999999 1px;
  -moz-column-count: 4;
  -moz-column-gap: 2em;
  -moz-column-rule: solid #999999 1px;
  -webkit-column-count: 4;
  -webkit-column-gap: 2em;
  -webkit-column-rule: solid #999999 1px;
  -webkit-box-align: top; 
  }


/*****************************************************************************************/
/* FORMS                                                                                 */
/*****************************************************************************************/
INPUT.modern, TEXTAREA.modern
  {
  width: 90%;
  border: solid green 1px;
  border-radius: 4px;
  padding: 4px;
  font-family: arial;
  font-size: 100%;
  background: #f7fff7 ;
  }

INPUT.modernbutton
  {
  padding: 8px;
  border-top: 0;
  border-left: 0;
  background-image: linear-gradient( top, #EEEEEE, #CCCCCC );
  background-image: -ms-linear-gradient( top, #EEEEEE, #CCCCCC );
  background-image: -moz-linear-gradient( top, #EEEEEE, #CCCCCC );
  background-image: -webkit-linear-gradient( top, #EEEEEE, #CCCCCC );
  }

INPUT.orderform, TEXTAREA.orderform
  {
  width: 96%;
  padding: 4px;
  font-family: arial;
  font-size: 90%;
  color: black;
  background: #ddffdd;
  border: 0;
  border-bottom: solid #99cc99 1px;
  }

INPUT.orderform:FOCUS, TEXTAREA.orderform:FOCUS
  {
  background: #eeffee;
  }

DIV.orderform
  {
  margin-top: 32px;
  border: solid grey 1px;
  border-radius: 4px;
  padding: 8px;
  background: #F7FFF7;
  }  

DIV.orderform H2
  {
  margin-top: 0;
  width: 96%;
  padding: 4px;
  border-bottom: solid #aa99aa 1px;
  }

DIV.orderform LABEL
  {
  font-size: smaller;
  font-weight: bold;
  color: gray;
  }

/*****************************************************************************************/
/* OREINTATION MODIFICATIONS                                                             */
/*****************************************************************************************/
@media screen and ( orientation:portrait )
  {
  .landscape
    {
    display: none ;
    }

  .portrait
    {
    display: block;
    }

  TD.sidebar
    {
    display: none;
    }

  DIV.topmenu
    {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    }

  TD.main
    {
    padding-top: 80px;
    }

  DIV.topmenu A, DIV.topmenu A:VISITED 
    {
    font-family: arial;
    font-size: 12pt;
    padding: 12px;
    }

  DIV.topmenu A.menushortcut
    {
    display: inline-block;
    }

  TD.main
    {
    font-size: 16pt;
    }

  TABLE.shopfront TD, TABLE.shopfront TD A, TABLE.shopfront TD A:VISITED
    {
    font-size: 20pt;
    line-height: 36pt;
    }

  TD.shopfilter P
    {
    font-size: larger;
    line-height: 166%;
    }

  TABLE.plants TD
    {
    font-size: 28pt;
    }

  TD.rightsidepics
    {
    width: 360px;
    }

  INPUT.modern, INPUT.orderform
    {
    font-size: 24pt;
    }

  INPUT.modernbutton
    {
    font-size: 14pt;
    padding: 8px;
    }

  DIV.mobile
    {
    display: block;
    }

  }


/*****************************************************************************************/
/* PRINT MIODIFICATIONS                                                                  */
/*****************************************************************************************/
@media print
  {
  HTML
    {
    background: none;
    }

  .noprint
    {
    display: none;
    }

  DIV.printheader
    {
    display: block;
    }

  TD.sidebar, DIV.topmenu
    {
    display: none;
    }
  }