/* 
    Document   : screen
    Created on : Feb 3, 2010, 11:58:51 AM
    Author     : Timc
    Description:
        Purpose of the stylesheet follows.
*/

/* 
   Css Selectors (are case sensitive)
1- Elememt selector - you declare the element name (e.g. body)
2- ID selector - it controls elements that have an id attribute (e.g. #header)
3- Context selector - based on the parent and inheritance of children
4- Class selector - contorls elements and is reusable (e.g. .red)
*/

#tagline{

}
.nolist{
  list-style-type: none;
}
.sublist{
  list-style-type: square;
  list-style-position: inside;
}
#contactform label{
  float: left;
  margin-right: 10px;
  width: 120px;
}
#regform label{
  float: left;
  margin-right: 10px;
  width: 120px;
}
#editform label{
  float: left;
  margin-right: 10px;
  width: 120px;
}
#addcomic label{
  float: left;
  margin-right: 10px;
  width: 170px;
}
#editcomic label{
  float: left;
  margin-right: 10px;
  width: 170px;
}

img{
  border-style: none; /* to remove border on all image links */
}

.comic{
  background-color: white;
}

.subnav{
  font-weight: bold;
}

#header ul,
#nav ul,
#footer ul,
#content h1{
  margin-bottom: 0;
  margin-top: 0;
}

body{
  margin: 0;
  padding: 0;
  max-width: 1024px;
  min-width: 800px;
  background-color: #BFBFBF;
}

#header{
  height: 1.05in;
  padding-left: .5em;
  background-color: #7F7B7A;
  position: relative;
}

#header #tools{
  position: absolute;
  top: 0;
  right: .5em;
  width: auto;
  text-align: right;
}

#nav{
  height: .26in;
  background-color: #BFBFBF;
}

#subnav ul,
#nav ul{
  list-style-type: none;
}

#nav li{
  display: inline;
  text-indent: 15px;
}

#centerbox{
  background-color: #EFEFEF;
  max-width: 1024px;
  min-width: 700px;
  min-height: 6in;
  position: relative;
}

#subnav{
  width: 15%;
  min-height: 7.07in;
  overflow: hidden;
  background-color: #BFBFBF;
  position: absolute;
  top: 0;
  left: 0;
}

#content{
  width: 75%;
  max-height: 7in;
  overflow: auto;
  position: relative;
  top: 0;
  left: 15%;
  padding-bottom: .5ex;
}

#content div,
#subnav div,
#aside div{
  min-height: 1in;
  padding-left: .5em;
  padding-right: .5em;
}

#aside{
  width: 10%;
  position: absolute;
  top: 0;
  left: 90%;
}

#footer{
  position: relative;
  padding-left: .5em;
  padding-bottom: .5ex;
  background-color: #D6D3CE;
}

a.squarebutton{
  background: transparent url('/images/square-gray-left.gif') no-repeat top left;
  display: block;
  float: left;
  font: normal 12px Arial; /* Change 12px as desired */
  line-height: 15px; /* This value + 4px + 4px (top and bottom padding of SPAN) must equal height of button background (default is 23px) */
  height: 23px; /* Height of button background height */
  padding-left: 9px; /* Width of left menu image */
  text-decoration: none;
}

a:link.squarebutton, a:visited.squarebutton, a:active.squarebutton{
  color: #494949; /*button text color*/
}

a.squarebutton span{
  background: transparent url('/images/square-gray-right.gif') no-repeat top right;
  display: block;
  padding: 4px 30px 4px 0; /*Set 9px below to match value of 'padding-left' value above*/
}

a.squarebutton:hover{ /* Hover state CSS */
  background-position: bottom left;
}

a.squarebutton:hover span{ /* Hover state CSS */
  background-position: bottom right;
  color: black;
}

.buttonwrapper{ /* Container you can use to surround a CSS button to clear float */
  overflow: hidden; /*See: http://www.quirksmode.org/css/clearing.html */
  margin-left: auto;
  margin-right: auto;
  width: 70%;
  min-width: 600px;
}
