/* -------------------------------------------
project:	CSS Frame Generator
author:		Michał Stempień <info(a)xms.pl>
date:		2008/04/05
------------------------------------------- */

html { min-height: 100%; margin-bottom: 1px; font-size: 100.01%; }
body { margin: 0; padding: 0; background: #6b9ec5 url(/prx/000/http/lab.xms.pl/css-generator/images/bg.jpg) repeat-x; color: #555; font: 62.5%/1.3 Tahoma,Arial,Helvetica,sans-serif; }
textarea, input, select, option, optgroup, button, code { font: 1em/1.3 Tahoma,Arial,Helvetica,sans-serif; }

/* RE-SETS
------------------------------------------- */
* { margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; }

li, dt, dd, p, th, td, caption { font-size: 1.1em; }
ul, ol, dl { margin-bottom: 1.5em; }
p { margin-bottom: 1.25em; }
li *, dt *, dd *, p * { font-size: 1em; }

fieldset, img { border: none; }
button { overflow: visible; cursor: pointer; }
legend { display: none; }

pre { white-space: pre-wrap; /* css-3 */ white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */ white-space: -pre-wrap; /* Opera 4-6 */ white-space: -o-pre-wrap; /* Opera 7 */ word-wrap: break-word; /* Internet Explorer 5.5+ */ }

a { color: #369; text-decoration: none; }
a:hover, a:focus, a:active { color: #000; text-decoration: underline; }

/* HEADINGS
------------------------------------------- */
h1, h2, h3, h4, h5, h6 { margin: 0 0 10px; font: bold 2.4em/1.2 Tahoma,Arial,Helvetica,sans-serif; color: #ab3a3a; }
h1 { font-size: 2.2em; }
h2 { font-size: 2.0em; }
h3 { font-size: 1.8em; }
h4 { font-size: 1.2em; }
h5 { font-size: 1.2em; }
h6 { font-size: 1.0em; }

/* HELPERS
------------------------------------------- */
.wrapper { width: 100%; overflow: hidden; }
.center { margin-left: auto; margin-right: auto; text-align: center; }
.offset { position: absolute; left: -10001em; overflow: hidden; height: 0; margin: 0; line-height: 0; }

legend.offset { display: none; }

/* LAYOUT
------------------------------------------- */
#root { overflow: hidden; width: 915px; margin: 0 auto; }
 #content { float: left; width: 750px; }
  #top { position: relative; padding: 82px 0 0 245px; background: url(/prx/000/http/lab.xms.pl/css-generator/images/guy.jpg) 15px 0 no-repeat; }
   #logo { position: absolute; top: 22px; right: 15px; width: 298px; height: 43px; margin: 0; background: url(/prx/000/http/lab.xms.pl/css-generator/images/logo.png) no-repeat; }
    #logo a { display: block; overflow: hidden; width: 298px; height: 43px; text-indent: -10001em; }
   #top p.version { position: absolute; top: 47px; right: 335px; color: #f3f3f3; }
   #top div.balloon { position: relative; width: 100%; padding: 0 0 1px; }
    #top div.balloon h2 { position: absolute; z-index: 10; left: -60px; top: 15px; width: 65px; height: 46px; background: url(/prx/000/http/lab.xms.pl/css-generator/images/balloon-a.png) no-repeat; text-indent: -10001em; }
    #top div.balloon p { position: relative; z-index: 1; margin: 0 0 14px; padding: 15px 13px; border: 5px solid #567e9e; background: #fff; font: 1.4em "Lucida Sans Unicode",sans-serif; }
    * html #top div.balloon p { height: 1%; }
     #top div.balloon p em { border-bottom: 1px solid #555; font-style: normal; }
     #top div.balloon p a.more { position: absolute; right: 10px; bottom: 16px; overflow: hidden; width: 12px; height: 11px; background: url(/prx/000/http/lab.xms.pl/css-generator/images/more-a.gif) no-repeat; text-indent: -10001em; }
 #side { float: right; width: 150px; padding: 82px 0 0; }
  #side div.partner { padding: 5px 0 7px; text-align: center; }
   #side div.partner p { margin: 0; }
  #side div.utils { }
   #side div.utils ul { list-style: none; margin: 0 0 10px; padding: 0 0 0 15px; }
    #side div.utils ul li { float: left; width: 100%; margin: 0 0 3px; }
     #side div.utils ul li a { float: left; padding: 2px 0 2px 23px; background: url(/prx/000/http/lab.xms.pl/css-generator/images/bookmarks.png) no-repeat; color: #fff; }
     #side div.utils ul li.digg a { background-position: 0 1px; }
     #side div.utils ul li.delicious a { background-position: 0 -29px; }
     #side div.utils ul li.rss a { background-position: 0 -59px; }
    #side div.utils ul li.author { padding-top: 8px; }
     #side div.utils ul li.author a { background: none; }
     #side div.utils ul li.author span { float: left; margin: 2px -23px 0 3px; color: #fff; text-decoration: none; }
    #side div.utils ul li.partner { margin-top: -5px; }
     #side div.utils ul li.partner a { background: none; }

/* SKIP LINKS
------------------------------------------- */
#skip-links { position: absolute; top: 0; left: -10001px; list-style: none; margin: 0; padding: 0; }
 #skip-links li a:focus, #skip-links li a:active { display: block; position: absolute; left: 10001px; top: 0; z-index: 10001; width: 750px; padding: 2px 0; background: #579; color: #fff; font-size: 1.4em; text-align: center; }
   
/* GENERAL
------------------------------------------- */
div.box { margin: 0 0 15px; padding: 10px 10px 1px; border: 5px solid #567e9e; background: #fff; }

textarea { font: 1.2em "Courier New",sans-serif; }

ol.properties { list-style: none; margin: 0 0 9px; padding: 0; }
 ol.properties li { display: inline; padding: 0 8px 0 0; }
 ol.properties li.a { color: #bd2626; }
 ol.properties li.b { color: #2662bd; }
 ol.properties li.c { color: #26bd3b; }
 ol.properties li.d { color: #bd9426; }
 ol.properties li.e { color: #b426bd; }

/* ELEMENTS
------------------------------------------- */
#more { position: relative;  z-index: 5; font-family: "Lucida Sans Unicode",sans-serif }
 #more h2 { position: absolute; right: 135px; top: -25px; width: 53px; height: 25px; background: url(/prx/000/http/lab.xms.pl/css-generator/images/balloon-b.png) no-repeat; text-indent: -10001em; }
 #more p { margin: 0 0 9px; font-size: 1.2em; }
 #more li { font-size: 1.1em; line-height: 16px; }

#insert { position: relative; width: 100%; margin: 0; padding: 0; }
 #insert p.label { position: absolute; left: 14px; top: 15px; width: 9px; height: 37px; background: url(/prx/000/http/lab.xms.pl/css-generator/images/labels.png) no-repeat; }
  #insert p.label label { display: block; width: 9px; height: 37px; text-indent: -10001em; }
 #insert p.sample { position: absolute; left: 14px; top: 283px; width: 9px; height: 109px; background: url(/prx/000/http/lab.xms.pl/css-generator/images/labels.png) -9px 0 no-repeat; text-indent: -10001em; cursor: pointer; }
 #insert div.box { padding: 2px 2px 1px; }
  #insert div.box textarea { width: 709px; height: 395px; padding: 0 0 0 27px; border: none; background: url(/prx/000/http/lab.xms.pl/css-generator/images/stripe-a.gif) repeat-y; }
 #insert button { display: block; overflow: hidden; width: 312px; height: 36px; margin: 0 0 0 auto; border: none; background: url(/prx/000/http/lab.xms.pl/css-generator/images/button-a.png) no-repeat; text-align: left; text-indent: -10001em; }
 
#result { position: relative; width: 100%; margin: 0; padding: 0; }
 #result h2 { position: absolute; left: 14px; top: 15px; width: 9px; height: 56px; background: url(/prx/000/http/lab.xms.pl/css-generator/images/labels.png) -18px 0 no-repeat; text-indent: -10001em; }
 #result p.copy { position: absolute; left: 14px; top: 268px; width: 9px; height: 104px; background: url(/prx/000/http/lab.xms.pl/css-generator/images/labels.png) -27px 0 no-repeat; text-indent: -10001em; cursor: pointer; }
 #result div.box { padding: 2px 2px 1px; }
  #result div.box textarea { width: 709px; height: 375px; padding: 0 0 0 27px; border: none; background: url(/prx/000/http/lab.xms.pl/css-generator/images/stripe-b.gif) repeat-y; }
 
#content div.sense { padding: 10px 4px 6px 8px; }

/* HACKS
------------------------------------------- */
