img { border: 0px; }
img.preload { display: none; }
img.hidden { visibility: hidden; }
img.preview { border: 1px solid #ffffff; margin-top: 3px;  margin-right: 10px; width: 200px; height: 150px; cursor: pointer;}
img.big { border: 1px solid #ffffff; cursor: pointer; z-index: 6;}

body { margin: 0 0 0 0; text-align: center; background: url("/img/bg-sky.jpg"); overflow: hidden; }

table { border: #374f63 1px solid;border-collapse: collapse; margin-top: 3px;}
table td { border: #374f63 1px solid; background: url("/img/td-bg.png"); padding: 5px}
table td.header { border: #374f63 1px solid; background: url("/img/td-bg-header.gif"); padding: 5px}

table.noborder { border: 0; border-collapse: collapse; }
td.noborder { border: 0; background: none; padding: 0px}


td, p, li, font, a, h1, h2, h3, h4, h5, h6, div { font-family: arial, tahoma; font-size: 14px; line-height: 1.3; margin: 0;}
td, p, li, a, h1, h2, h3, h4, h5, h6, div { color: #ccd0d3; }
h1, h2, h3, h4, h5, h6 { color: #FFFFFF; }

ul { margin-left: 0px; margin-right: 0px; padding: 0px; list-style-type: none;}
ul li { padding: 0px;background: url("/img/li.gif") no-repeat; text-indent: 16px; }

span.font20, p.font20, a.font20 { font-size: 20px; color: #FFFFFF;}
span.font11, p.font11, a.font11 { font-size: 11px; color: #FFFFFF;}
span.hint { font-size: 12px; color: #FFFFFF; cursor: pointer;}
span.month { font-size: 11px; color: #9a9a9a;}

font.hint { font-size: 12px; color: #808080;}

h1 {font-size: 16px;}
h2 {font-size: 14px;}
h3 {font-size: 12px;}
h4 {font-size: 11px;}
h5 {font-size: 10px;}
h6 {font-size: 9px;}

a{color: #FFFFFF; text-decoration: underline;}
a:hover{color: #FFFFFF; text-decoration: none;}

hr.h { color: #2b3841; background-color:#2b3841; border: 0px none; height: 1px;clear: both; }

div#main { width: 1004px; height: 740px; position:absolute; background: url("/img/bg-body1.jpg") no-repeat; /*border: 1px solid white; */ z-index: 0;}

div#create-site-page { width: 1004px; height: 586px; position:absolute; z-index: 0;cursor: default; }
div#services-page { width: 1004px; height: 586px; position:absolute; z-index: 0;cursor: default; }
div#portfolio-page { width: 1004px; height: 586px; position:absolute; z-index: 0; cursor: default; }
div#about-company-page { width: 1004px; height: 586px; position:absolute; z-index: 0;cursor: default; }

div.page-text { text-align: left; background: red;}
div.page-footer-left { text-align: left; width: 406px; left: 0px; top: 5px; position: absolute; }
div.page-footer-right { text-align: right; width: 406px; left: 406px; top: 5px; position: absolute; }

div#logo { width: 50px; height: 20px; left: 50%; top: 50%; margin-left: -25px; margin-top: -30px; position: absolute; }

div#create-site-logo-webio { width: 108px; height: 83px; left: 50; top: 15px; position: absolute; }
div#services-logo-webio { width: 108px; height: 83px; left: 50; top: 33; position: absolute; }
div#portfolio-logo-webio { width: 108px; height: 83px; left: 50; top: 53px; position: absolute; }
div#about-company-logo-webio { width: 108px; height: 83px; left: 50; top: 33; position: absolute; }

div#create-site-page-header { left: 188px; top: 54px; position: absolute; }
div#services-page-header { left: 188px; top: 72px; position: absolute; }
div#portfolio-page-header { left: 188px; top: 92px; position: absolute; }
div#about-company-page-header { left: 188px; top: 72px; position: absolute; }

div#create-site-page-text { left: 96px; top: 104px; width: 610px; position: absolute; text-align: justify;}
div#services-page-text { left: 96px; top: 122px; width: 610px; position: absolute; text-align: justify;}
div#portfolio-page-text { left: 96px; top: 142px; width: 812px; position: absolute; text-align: justify;}
div#about-company-page-text { left: 96px; top: 122px; width: 610px; position: absolute; text-align: justify;}

div#create-site-page-menu { left: 718px; top: 104px; width: 190px; position: absolute; }
div#services-page-menu { left: 718px; top: 122px; width: 190px; position: absolute; }
div#portfolio-page-menu { left: 96px; top: 142px; width: 812px; position: absolute; }
div#about-company-page-menu { left: 718px; top: 122px; width: 190px; position: absolute; }

div#create-site-page-hr { left: 96px; top: 474px; width: 812px; position: absolute; }
div#services-page-hr { left: 96px; top: 507px; width: 812px; position: absolute; }
div#portfolio-page-hr { left: 96px; top: 514px; width: 812px; position: absolute; }
div#about-company-page-hr { left: 96px; top: 507px; width: 812px; position: absolute; }

div#create-site-page-footer { left: 96px; top: 487px; position: absolute; }
div#services-page-footer { left: 96px; top: 520px; position: absolute; }
div#portfolio-page-footer { left: 96px; top: 525px; position: absolute; }
div#about-company-page-footer { left: 96px; top: 520px; position: absolute; }

div#create-site { width: 231px; height: 197px; left: 364px; top: 54px; position: absolute; }
div#services { width: 163px; height: 236px; left: 117px; top: 252px; position: absolute; }
div#portfolio { width: 226px; height: 132px; left: 418px; top: 507px; position: absolute;}
div#about-company { width: 168px; height: 172px; left: 738px; top: 270px; position: absolute;}

div#create-site-block { width: 335px; height: 200px; left: 364px; top: 53px; position: absolute; z-index: 4; cursor: pointer;}
div#services-block { width: 228px; height: 259px; left: 53px; top: 229px; position: absolute; z-index: 4; cursor: pointer;}
div#portfolio-block { width: 329px; height: 160px; left: 418px; top: 507px; position: absolute; z-index: 4; cursor: pointer;}
div#about-company-block { width: 213px; height: 184px; left: 738px; top: 258px; position: absolute; z-index: 4; cursor: pointer;}

div#create-site-header { width: 211px; height: 15px; left: 580px; top: 79px; position: absolute; z-index: 3; background: url("/img/create-site-header-hover.png") no-repeat; filter:alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0;}
div#services-header { width: 124px; height: 16px; left: 60px; top: 225px; position: absolute; z-index: 3; background: url("/img/services-header-hover.png") no-repeat; filter:alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0;}
div#portfolio-header { width: 99px; height: 16px; left: 654px; top: 635px; position: absolute; z-index: 3; background: url("/img/portfolio-header-hover.png") no-repeat; filter:alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0;}
div#about-company-header { width: 88px; height: 13px; left: 861px; top: 254px; position: absolute; z-index: 3; background: url("/img/about-company-header-hover.png") no-repeat; filter:alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0;}

div#create-site-header-text { width: 211px; height: 15px; left: 580px; top: 79px; position: absolute; z-index: 2; background: url("/img/create-site-header.png") no-repeat; }
div#services-header-text { width: 124px; height: 16px; left: 60px; top: 225px; position: absolute; z-index: 2; background: url("/img/services-header.png") no-repeat; }
div#portfolio-header-text { width: 99px; height: 16px; left: 654px; top: 635px; position: absolute; z-index: 2; background: url("/img/portfolio-header.png") no-repeat; }
div#about-company-header-text { width: 88px; height: 13px; left: 861px; top: 254px; position: absolute; z-index: 2; background: url("/img/about-company-header.png") no-repeat; }

div#create-site-arrow { width: 60px; height: 33px; left: 470px; top: 20px; position: absolute; filter:alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; }
div#services-arrow { width: 33px; height: 60px; left: 20px; top: 319px; position: absolute; filter:alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; }
div#portfolio-arrow { width: 60px; height: 33px; left: 470px; top: 667px; position: absolute; filter:alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; }
div#about-company-arrow { width: 33px; height: 60px; left: 951px; top: 319px; position: absolute; filter:alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; }

div#create-site-main-arrow { width: 60px; height: 33px; left: 470px; top: 533px; position: absolute; }
div#portfolio-main-arrow { width: 60px; height: 33px; left: 470px; top: 20px; position: absolute; }
div#about-company-main-arrow { width: 33px; height: 60px; left: 20px; top: 263px; position: absolute; }
div#services-main-arrow { width: 33px; height: 60px; left: 951px; top: 263px; position: absolute; }

div#line-1 {width: 251px; height: 40px; left: 540px; top: 95px; position: absolute; z-index: 1; background: url("/img/line-1.gif") no-repeat;}
div#line-2 {width: 129px; height: 40px; left: 820px; top: 270px; position: absolute; z-index: 1; background: url("/img/line-2.gif") no-repeat;}
div#line-3 {width: 166px; height: 41px; left: 612px; top: 612px; position: absolute; z-index: 1; background: url("/img/line-3.gif") no-repeat;}
div#line-4 {width: 162px; height: 40px; left: 60px; top: 242px; position: absolute; z-index: 1; background: url("/img/line-4.gif") no-repeat;}

div#create-site-hint, div#services-hint, div#portfolio-hint, div#about-company-hint 
{ width: 222px; height: 137px; position: absolute; z-index: 4; background: url("/img/window.png") no-repeat; filter:alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; padding-bottom: 12px; padding-left: 12px; padding-right: 12px; padding-top: 14px; text-align: left;}
div#create-site-hint { left: 541px; top: 134px; }
div#services-hint { left: 221px; top: 282px; }
div#portfolio-hint { left: 391px; top: 476px; }
div#about-company-hint { left: 599px; top: 310px; }

div#preload-start, div#preload-end { left: -9999px; top: -9999px; position: absolute; }

a.create-site { background: url("/img/create-site.jpg") no-repeat; width: 231px; height: 197px; float: left; }
a.create-site-hover { background: url("/img/create-site-hover.jpg") no-repeat; }
a.services { background: url("/img/services.jpg") no-repeat; width: 163px; height: 236px; float: left; }
a.services-hover { background: url("/img/services-hover.jpg") no-repeat; }
a.portfolio { background: url("/img/portfolio.jpg") no-repeat; width: 226px; height: 132px; float: left; }
a.portfolio-hover { background: url("/img/portfolio-hover.jpg") no-repeat; }
a.about-company { background: url("/img/about-company.jpg") no-repeat; width: 168px; height: 172px; float: left; }
a.about-company-hover { background: url("/img/about-company-hover.jpg") no-repeat; }

a.create-site-header { background: url("/img/create-site-header.png") no-repeat; width: 211px; height: 15px; float: left; }
a.create-site-header-hover { background: url("/img/create-site-header-hover.png") no-repeat; }
a.services-header { background: url("/img/services-header.png") no-repeat; width: 124px; height: 16px; float: left; }
a.services-header-hover { background: url("/img/services-header-hover.png") no-repeat; }
a.portfolio-header { background: url("/img/portfolio-header.png") no-repeat; width: 99px; height: 16px; float: left; }
a.portfolio-header-hover { background: url("/img/portfolio-header-hover.png") no-repeat; }
a.about-company-header { background: url("/img/about-company-header.png") no-repeat; width: 88px; height: 13px; float: left; }
a.about-company-header-hover { background: url("/img/about-company-header-hover.png") no-repeat; }

a.create-site-arrow, a.portfolio-main-arrow { background: url("/img/create-site-arrow.gif") no-repeat; width: 60px; height: 33px; float: left; }
a.create-site-arrow:hover, a.portfolio-main-arrow:hover { background: url("/img/create-site-arrow-hover.gif") no-repeat; }
a.services-arrow, a.about-company-main-arrow { background: url("/img/services-arrow.gif") no-repeat; width: 33px; height: 60px; float: left; }
a.services-arrow:hover, a.about-company-main-arrow:hover { background: url("/img/services-arrow-hover.gif") no-repeat; }
a.portfolio-arrow, a.create-site-main-arrow { background: url("/img/portfolio-arrow.gif") no-repeat; width: 60px; height: 33px; float: left; }
a.portfolio-arrow:hover, a.create-site-main-arrow:hover { background: url("/img/portfolio-arrow-hover.gif") no-repeat; }
a.about-company-arrow, a.services-main-arrow { background: url("/img/about-company-arrow.gif") no-repeat; width: 33px; height: 60px; float: left; }
a.about-company-arrow:hover, a.services-main-arrow:hover { background: url("/img/about-company-arrow-hover.gif") no-repeat; }

span.white { color: white; }

/* Подсказка */
a.hint { cursor: pointer; text-decoration: none; border-bottom: 1px dashed #FFF; }
a.hint:hover { cursor: pointer; text-decoration: none; border: 0px;}
div#hint { width: 400px;	background: url("/img/bg-sky.jpg"); position: absolute; z-index: 4; border: 1px solid #FFFFFF; visibility: hidden; padding: 10px; text-align: left; font-size: 12px;}
div#hint li {font-size: 12px;}
div#hint-img { width: 500px;	position: absolute; z-index: 0; border: 0px ; visibility: hidden; margin-top: 3px;}