/* reset and basic setting */

/* BASIC =====================================================================*/
body,code,div,h1,h2,h3,h4,h5,h6,img,li,ol,span,table,th,td,ul {padding:0px; margin:0px; border:0px}
body {font-family:Georgia, serif; font-size:12px; line-height:22px;text-align:center;}
body {background:#fff url('img/image_02.png') repeat-x top left}
/* links */
a {color:#0092B2; text-decoration:underline;}
a:hover {color:#333; text-decoration:underline;}

/* headings etc. */
h1,h2,h3,h4,h5,h6 {font-weight:bold; line-height:30px}
h1 {font-size:11px; margin-left:-5000px; float:left}
h2 {font-size:20px; margin-bottom:0px; color:#0092B2;font-family:'Arial',sans-serif;}
h3 {font-size:17px; margin-bottom:0px; color:#0092B2;font-family:'Arial',sans-serif;}

/* paragraphs */
p {line-height:24px; margin-bottom:10px;margin-top: 0px;}

/* tables */
table {border-collapse: collapse}
th,td {font-size: 11px;}

/* lists */
ul,ol		{list-style: none}
ul,ol    {margin-bottom: 22px;}
ol       {list-style: decimal}

/* other */
hr        {border:0px; border-top:2px solid #cccccc; height:0px; margin-top:20px;margin-bottom:20px}
hr.cleaner {border:0px; clear:both; height:0px; margin:0px; padding:0px; visibility:hidden}
hr.left {clear:left;}
hr.right {clear:right;}
hr.line {border-bottom:3px solid #F0F0F0;margin-bottom:30px; visibility:visible;}
img         {border:0px;}
sub, sup {position:relative; vertical-align:baseline;}
sub {top:0.4em;}
sup {bottom:0.4em;}

/* body container */
#body {width:620px; margin:0px auto; text-align:left;}

/* header section  */
#header {height:100px;}
#header #logo {width:320px;height:100px;background:url('img/image_04.png') no-repeat top left;float:left}
#header #logo a {display:block; width:320px;height:80px;}

/* subtitle stripe */
#subtitle {width:260px;float:left;padding:35px 0 0 0;color:#fff;line-height:30px;font-size:16px;font-style:italic;font-family:'Trebuchet MS',sans-serif}

/* slider */
#preview {margin-left:320px;height:150px;padding-top:20px}
#tabs-image {display:none}
.tabs-image {margin:0 10px 0 10px;overflow:hidden}
.tabs-image div {text-align:center;overflow:hidden;display:none}
.tabs-image img {margin:0 5px 0 5px;border:1px solid #ccc}
.backward,
.forward {width:25px;background:no-repeat center center;height:130px;cursor:Pointer}
.backward {float:left;background-image:url('img/button-prev.png')}
.forward {float:right;background-image:url('img/button-next.png')}

/* content section */
#content {margin:20px 0 0 0; clear:both}
#content #min-height {float:right; background:#fff; width:1px;height:500px}

#content .box {color:#333;background:#fff;margin-bottom:30px}
#content .box h2 {color:#0092B2; padding:2px 0px 0px 0px; font-size:18px; line-height:25px;font-weight:bold}
#content .box h3 {color:#0092B2; padding:2px 0px 4px 0px; font-size:14px; line-height:25px;font-weight:bold}
#content .box p,
#content .box ul,
#content .box form {padding:0; margin-bottom:12px}
#content .box p.empty {height:27px;padding:0px}

#content .box span.left {display:block; width:360px}
#content .box span.right {display:block; float:right; width:220px; text-align:left}

#content .box-left,
#content .box-right {width:280px}
#content .box-left {float:left; margin:0 30px 40px 0px}
#content .box-right {float:right; margin:0 0 20px 0}
#content .box-full {width:600px;display:block;clear:left}

/* tables */
#content .box table {margin:10px 0 0 0}
#content .box table th,
#content .box table td {line-height:22px;padding:0 5px; font-size:12px; text-align:left; border-bottom:1px solid #ccc; border-top:1px solid #ccc}

/* lists */
#content .box ul {line-height:24px;margin:0 0 10px 0}
#content .box ol {line-height:24px;margin:0 0 10px 22px}
#content .box ul li {padding-left:22px; background: url('img/list.png') no-repeat 0px 3px}
#content .box ul li a,
#content .box ol li a {padding:0px}
#content .box ul.advantage li {background: url('img/ok.png') no-repeat 0px 5px}

/* download */
#content .box p.download {background:#CCFF99; border:1px solid #eee; padding:10px; text-align:center}
#content .box p.download a {color:#333;display:inline-block; padding-left:22px; background: url('img/download.png') no-repeat 0px 3px}
#content .box p.download a {font-weight:bold; text-decoration:none;font-family:'Arial',sans-serif; letter-spacing:-1px}
#content .box p.download a:hover {color:#0092B2}
#content .box p.download em {display:block; font-size:11px; font-style:italic}

/* code */
#content .box p.code {background:#f3f3f3; font-size:11px; padding:10px; border:1px solid #ddd}

/* images */
#content .box p.image {width:280px; margin-left:30px; padding-bottom:20px; float:right; text-align:right}
#content .box .preview {border:1px solid #000; margin:0px}

/* form - contact */
.contact {padding:0px; margin-top:5px}
.contact label {display:block; font-weight:bold; color:#222; font-size:12px; line-height:25px; text-align:left}
.contact input,
.contact select,
.contact textarea {font-family:'Tahoma'; font-size:12px; color:#222; width:260px; padding:5px; display:block; line-height:22px; height:15px; margin-bottom:10px}

.contact input						{border:1px solid #ccc}
.contact input.spam 				{width:50px}
.contact input:focus 			{border:1px solid #2BAEE6}
.contact input[type=file] 		{border:1px solid #ccc; height:25px}
.contact input.submit 			{margin-top:20px; width:270px; height:40px; margin-left:0px; background:#eee; color:#333; cursor:pointer}
.contact input.submit:hover 	{background:#333; color:#eee}
.contact textarea 				{border:1px solid #ccc; height:120px; width:260px}
.contact textarea:focus 		{border:1px solid #2BAEE6}
.contact p 							{margin-top:0px;}



/* footer */
#footer {background:#282A2D url('img/image_02f.png') repeat-x top left; margin-top:30px; padding:20px 15px 5px 15px; color:#fff;}
#footer *,
#footer a {color:#fff; font-size:11px}
#footer a {text-decoration:underline}
#footer a:hover {color:#2BAEE6}

/* confirm boxes */
div.confirm {background:#E0FFC0 url('img/icon/state-ok.png') 10px 7px  no-repeat; margin-top:5px}
div.confirm {line-height:18px; margin-bottom:20px; padding:10px; padding-left:45px; text-align:left;}
div.red {background-color:#fce8e8; background-image:url('img/icon/state-nok.png');}

/* rules */
.main {margin-top:20px;}
.top {margin-top:10px;}
.no-top {margin-top:0px;}
.no-bottom {margin-bottom:0px;}

.center {text-align:center;}
.left {text-align:left;}
.right {text-align:right;}
.middle {vertical-align:middle;}
.top {vertical-align:top;}

.clear-left {clear:left}
.clear-right{clear:right}
.clear-both{clear:both}