/*
The stylesheet for catza.net by Heikki Siltala
palette = neutral 
*/
 
html { background-color: #c7c7c7; height: 100%; }

body {
 color: #1C1C1C;
 background-color: #c7c7c7;
 font-family: Verdana, Arial, sans-serif; 
 font-size: 91%;
 line-height: 139%;
 text-align: left;
 height: 100%;
}

.full { width: 100%; }

ul {
 margin-top: 0.2em;
 margin-bottom: 0.2em;
}

li {
 margin-left: 2.5em;
 margin-top: 0.5em;
 margin-bottom: 0.5em; 
 list-style: square outside;
}

/*  all forms are displayed inline */
form { display: inline; }

/*  pre texts inline, this is only for noscript warning */
pre { display: inline; }

/* text sizes */
.shrink { font-size: 88%; }
.shrinkmore { font-size: 68%; }
.shrinkless { font-size: 93%; }
.enlarge { font-size: 118%; }
.enlargemore { font-size: 133%; }

/* more room between lines */
.roomy { line-height: 160%; }

/* more room on around */
.pad { padding: 0.4em; }

/* text styling */
.heavy { font-weight: 600; }
.lean { font-style: italic; }
.sparse { letter-spacing: 1px; }

/* extra style used on site name presentation on the front page */
.xtra { font-weight: 800; color: #cc1515; }

/* error texts */
.error { color: #cc1515; }

/* the ablitity to set block & inline to any element */
.block { display: block; }
.inline { display: inline; }

/* the alignments */
.center { text-align: center; }
.left { text-align: left; }
.right { text-align: right; }
.top { vertical-align: top; }
.middle { vertical-align: middle; }
.bottom { vertical-align: bottom; }

/* makes sure that no floated elements overlap */
.clearbefore { clear: both; }

/* form input fields */ 
.field { 
 color: #000000;
 background-color: #FFFFFF;
}

/* spacing */

.aero { padding: 0 0.8em 0 0.8em ; }

.bar { padding: 0.5em 0.8em 0.5em 0.8em; } 

.stripetop {
 border-top: 1px;
 border-top-style: solid;
 border-top-color: #666666;
}

.stripebottom {
 border-bottom: 1px;
 border-bottom-style: solid;
 border-bottom-color: #666666;
}

.rounded {
 -moz-border-radius: 8px;
 -webkit-border-radius: 8px;
 border-radius: 8px;
}

.outer { margin: 0 12% 0 12%; }

.inner { margin: 0 17% 0 17%; }

.flag {
 border-style: solid;
 border-width: 1px;
 border-color: #666666; 
 height: 20px;
 margin: 1px;
 vertical-align: text-bottom; 
}

/* 
search pattern highlighting in the found text 
*/
.match { border-bottom: 2px dotted #666666;  }

#top, #topx, #bottom, .shade {
 color: #1C1C1C;
 background-color: #a2a2a2;   
}

#top { padding: 0; margin: 0 0 0.5em 0; }

#topx { padding: 0; margin: 0; }

#bottom { padding: 0; margin: 0.5em 0 0 0; }

/* headings, general */
h1,h2 { 
 font-size: 126%;
 display: inline;
 font-family: Verdana, Arial, sans-serif;
 letter-spacing: 0.25em;
 font-weight: 500;
}

/* special for h1 */ 
h1 {
 font-size: 149%;
 line-height: 145%;
}

h1.giga { font-weight: 700; }

h1.mini { font-size: 91%; }

/* links */
a:link, a:visited, a:active {
 color: #000000;
 font-weight: 700; 
 text-decoration: none;
} 

a:hover {
 text-decoration: underline;   
}

/* photo thumbnails */
.thumb {
 border: 0;
 border-style: none;
}

.ig {
 border: 0;
 border-style: none; 
 vertical-align: middle;
}
 
.middler { /* google plus button hacks part 1/3 */
 vertical-align: middle !important;
 display: inline !important;
}

.middler > div { /* google plus button hacks part 2/3 */
 vertical-align: middle !important;
 display: inline !important;
}

.middler > div > iframe { /* google plus button hacks part 3/3 */
 vertical-align: middle !important;
 display: inline !important;
}


.cca { float: right; padding: 2px; }

.cc {
 border: 0;
 border-style: none;
 overflow: hidden;
 vertical-align: middle;
}

.viz { float: right; margin: 7px; }

.vizl { float: left; margin: 7px; }

.box {
 border-style: solid;
 border-width: 2px;
 border-color: #cc1515;  
}

.slice {
 border-style: solid;
 border-width: 0 0 0 0.8em;
 border-color: #cc1515;  
}

.limit {
 max-width: 1000px;
 word-wrap: break-word;
}
