/*	CSS-Framework

	Version		: 0.21
	File name	: cssf-base.css
	Description	: Styles for webdewelopers
	Author		: Aleksej Romanovskij (http://css-framework.ru)
	
------------------------------ */

/* Utilites
------------------------------ */

* { margin: 0; padding: 0; }

*:focus { outline: none; }
.hidden { display: none; }
.show { display: block!important; }
.no-margin { margin: 0!important; }
.no-padding { padding: 0!important; }
.no-bg { background: none!important; }
.no-border, img { border: none!important; }

.container { overflow: hidden; }
.img-repl { text-indent: -9999px; overflow: hidden; display: block; }

/* Main custom rules
------------------------------ */

html { background: #073755; font: .75em/1.5 Verdana, Arial, Helvetica, sans-serif; }
body { padding: 20px; }

a { color: #0066cc; }
a:visited {  }
a:hover {  }
a:active {  }

/* Demo Template
------------------------------ */

#site { width: 780px; margin: 0 auto; padding: 20px; background: #F6F6E1; border: 1px solid #ccc; }
#header { padding-bottom: 1em; margin-bottom: 1em; }
#col-left { float: left; width: 30%; }
#content { width: 68%; float: right; }
#footer { clear: both; padding-top: 1em; border-top: 2px solid #ccc; }

/* Horizontal Menu
------------------------------ */

.menu-h { overflow: hidden; border: 1px solid #ccc; background: #fff; overflow: hidden; }
.menu-h li { float: left; list-style: none; padding: .4em .8em; border-right: 1px solid #ccc; }

/* Horizontal Drop Down Menu
------------------------------ */

.menu-h-d { min-height: 24px; border-left: 1px solid #ccc; }
.menu-h-d li { float: left; display: block; position: relative; border: 1px solid #ccc; border-width: 1px 1px 1px 0px; list-style: none; }
.menu-h-d a { text-decoration: none; padding: 2px 10px; display: block; }

.menu-h-d ul { display: none; position: absolute; top: 22px; left: -1px; width: 160px; background: #fff; border: 0; border-bottom: 1px solid #ccc; }
.menu-h-d ul ul { left: 100%; top: -1px; }

.menu-h-d li li { float: none; border-width: 1px 1px 0px 1px; }

.menu-h-d li:hover { background: #ccc; }
.menu-h-d a:hover { color: #fff; }

.menu-h-d li:hover ul ul,
.menu-h-d li:hover ul li:hover ul ul { display: none; }

.menu-h-d li:hover ul,
.menu-h-d li:hover ul li:hover ul,
.menu-h-d li:hover ul li:hover ul li:hover ul { display: block; }

/* Horizontal Drop Up Menu
------------------------------ */

.menu-h-d.d-up ul { bottom: 22px; }
.menu-h-d.d-up ul ul { bottom: -1px; }

/* Vertical Menu
------------------------------ */

.menu-v a, .menu-h a { text-decoration: none; display: block; }
.menu-v a:hover, .menu-h a:hover { text-decoration: underline; }

.menu-v { border-top: 1px solid #ccc; }
.menu-v li { padding: 2px 0; list-style: none; border-bottom: 1px solid #ccc; }
.menu-v li ul { padding-left: 1em; margin-top: 2px; }
.menu-v li li { border: none; border-top: 1px solid #ccc; }

/* Vertical Drop Down Menu
------------------------------ */

.menu-v-d { border-top: 1px solid #ccc; }
.menu-v-d li { padding: 2px 0; display: block; position: relative; border: 1px solid #ccc; border-width: 0px 1px 1px 1px; list-style: none; }
.menu-v-d li a { display: block; position: relative; text-decoration: none; padding-left: 10px; }

.menu-v-d li:hover { background: #ccc; }
.menu-v-d a:hover { color: #fff; }

.menu-v-d li ul { display: none; position: absolute; top: -1px; border-top: 1px solid #ccc; left: 100%; width: 100%; background: #fff; }
.menu-v-d li ul li { background: #fff; }

.menu-v-d li:hover ul ul,
.menu-v-d li:hover ul li:hover ul ul { display: none; }

.menu-v-d li:hover ul,
.menu-v-d li:hover ul li:hover ul,
.menu-v-d li:hover ul li:hover ul li:hover ul { display: block; }

.menu-v-d ul ul { left: 100%; }

/* Content elements
------------------------------ */

h1, h2, h3, .content h4 { font: 1.7em Verdana, Arial, Helvetica, sans-serif; margin-bottom: .5em;}
h1 { color: #1B1B1B; font-weight: bold;}
h2 { font-size: 1.5em; color: #038AE0; }
h3 { font-size: 1.0em; color: #038AE0; font-weight: bold;}
.content h4 { font-size: 1.1em; font-weight: bold; }

#col-left .side a { padding-bottom: 20px; }
blockquote { margin-left: 10em; padding-left: 1em; border-left: 2px solid #ccc; }
pre, code { font: 1.2em/1.8 "Courier New", Courier, monospace; border: 1px dashed #aaa; padding: 1em; background: #eee; }
code { padding: .2em .5em; }

.content ul, .content ol { margin-left: .5em; line-height: 1.3em; }
.content ul li, .content ol li { margin-bottom: .2em; }


.content ul li { list-style: none; }
.content ol li { list-style-position: inside; }
.icons a, .icon { padding-left: 20px; background-repeat: no-repeat; background-position: left center; }

.content p, .content ul, .content ol, .content table, blockquote, pre, .columns, .content img, .radio { margin-bottom: 1em; }
.content fieldset hr { margin: 100px 0 20px 0; }


#header address { margin-bottom: .6em; }
.content hr { border: 0; width: 90%; height: 1px; color: #038AE0;
background-color: #038AE0; margin: .5em auto 1em auto; }

.red { color: #900}
.small {font-size: 0.8em; }
/* Text align & Float
------------------------------ */

.a-left { text-align: left; }
.a-center { text-align: center; }
.a-right { text-align: right; }

.f-left { float: left; }
.f-right { float: right; }

/*	Tables
------------------------------ */

table { border-collapse: collapse; width: 100%; }
table th, table td { border: 1px solid #ccc; padding: 2px 3px; vertical-align: top; text-align: center;}
table th { background: #f4f4f4; }
table td {  }


/*	Table - catalogue
------------------------------ */
.content .cat img { margin: 0; padding: 0; width:60px; height:60px; border: none;}
.cat_head { background: #f4f4f4; font-weight: bold;}
.content .cat .digi { height: 90px; }

/* Images
------------------------------ */

.content img { padding: 5px; border: 1px solid #ccc!important; margin-top: .4em; }
.content img.null-image { padding: 0!important; border: none!important; margin: 0!important; }
#header img { padding: 5px; border: 1px solid #ccc!important; background: #fff;  }
img.f-left { margin-right: 1em; }
img.f-right { margin-left: 1em; }

#col-left img {padding: 5px; border: 1px solid #ccc!important; margin-top: .4em;}
/* Content Form
------------------------------ */

.content form { padding: .5em 0; }
.content fieldset, #col-left fieldset { margin-bottom: 1em; border: 1px solid #ccc; padding: 1em; background: #fff; }
fieldset legend { margin: -1px 0 0 15px; padding: 0 10px; font-size: 1.1em; font-weight: bold; border: 1px solid #ccc; border-bottom: none; color: #073755; background: #fff; }
#col-left fieldset h3 { margin-top: 10px; padding-top:10px; border-top: 1px solid #900; }

.content .f-row { overflow: hidden; margin-bottom: .5em; }
.content label { float: left; text-align: right; width: 25.99%; padding: 0 2%; }
.content .f-inputs { padding-left: 30%; }

.f-actions { padding-top: 1em; border-top: 1px solid #ccc; }

/* Inputs
------------------------------ */
input { vertical-align: middle; margin-left: 1em; }
.field { display: inline;}

.i-checkbox { margin-top: 3px; }
.i-text { width: 200px; padding: 0 1px; font: 1em sans-serif; }

.submit {background-color: #fff; color: #454317; font-weight: bold; margin-right: 10px; border: 1px solid #454317; cursor: pointer; text-decoration: none; padding: 0 .25em; }

/* Order Block
------------------------------ */
.pay-block { margin: 5px; padding: 10px; border: 1px solid #ccc; width: 220px;}
.pay-block form { background: #E9E9E9; font-size: 0.8em; padding: 10px;}
.pay-block .order { background: #E9E9E9 url(../skin/paypal.gif) no-repeat bottom right; }