/* DEFAULT */
html, body{margin: 0; padding: 0; width: 100%; height: 100%;  font-family: Tahoma; font-size: 12px; }
* {margin: 0; padding: 0; border: none; list-style-type: none; font-weight: normal;}
table {border-collapse: collapse;}
/* DEFAULT */


/* COMMON */
.clear{clear: both; width: 100%;}

#layout{position: relative; width: 100%; height: 100%;  overflow: hidden;}
.sides{position: absolute; width: 50%; height: 100%;  top: 0; background-repeat: repeat-x;}
#leftside{left:0; z-index: 1; background: #ffcc00;}
#rightside{left: 50%; z-index: 2; background: #ff6600;}



#site{position: relative; margin: 0 auto; width: 1024px; height: 100%; z-index: 3; background: url(/images/bg_site.jpg) repeat-y; }
#header{position: relative; width: 100%; height: 510px; background: url(/images/bg_header.jpg) 160px 40px no-repeat; z-index:6;}
#content{margin: 20px 30px; }
#left{position: relative; width: 634px; margin: 0 30px 0 0; float: left; z-index:4;}
#right{position: relative; width: 240px;  margin: 0; float: left;z-index:5;}

#footer{position: relative;  height: 100px; margin: 0 30px; }

/* COMMON */

/* ROUNDCORNERS aka ACTIVE */
.roundCorner{position: absolute; display: block; width: 10px; height: 10px;}
.side{position: absolute; display: block;}

.top{width: 100%; left: 0; top: -10px; background: white; height: 10px; }
.left{width: 10px; left: -10px; top: 0; height: 100%; background: white;}
.right{width: 10px; right: -10px; top: 0; height: 100%; background: white;}
.bottom{width: 100%; left: 0; bottom: -10px; background: white; height: 10px;}

.topLeft{top: -10px; left: -10px; background:url(/images/roundcorners.png) 0 0 no-repeat;}
.topRight{top: -10px; right: -10px; background:url(/images/roundcorners.png) -10px  0 no-repeat;}
/**|html[xmlns*=""]  .topRight{right: -10px;} */
.bottomLeft{bottom: -10px; left: -10px; background:url(/images/roundcorners.png)  0 -10px no-repeat;}
.bottomRight{bottom: -10px; right: -10px; background: url(/images/roundcorners.png) -10px -10px no-repeat;}
/**|html[xmlns*=""] .bottomRight{right: -10px;} */
/* ROUNDCORNERS aka ACTIVE */


/* SHADOWS */
.dropShadow{position: absolute; width: 5px; height: 5px;}
.dropShadowCorner{position: absolute; width: 7px; height: 7px;}

.dropShadows{display: block;}
.dropShadows .topLeft{top: -5px; left: -4px; background:url(/images/shadows_corners.png) 0 0 no-repeat;}
.dropShadows .topRight{top: -4px; right: -3px; background:url(/images/shadows_corners.png) -7px  0 no-repeat;}
.dropShadows .bottomLeft{bottom: -2px; left: -3px; background:url(/images/shadows_corners.png)  0 -7px no-repeat;}
.dropShadows  .bottomRight{bottom: -2px; right: -3px; background: url(/images/shadows_corners.png) -7px -7px no-repeat;}


.dropShadows .sideLeft{width: 7px; height: 100%; top: 0; left: -7px; background:url(/images/shadows_sideleftright.png) 0 0 repeat-y;}
.dropShadows .sideRight{width: 7px; height: 100%; top: 0; right: -7px; background:url(/images/shadows_sideleftright.png) -7px  0 repeat-y;}
.dropShadows .sideTop{height: 5px; width: 100%; top: -5px; left: 0; background:url(/images/shadows_sidetopbottom.png) 0  0px repeat-x;}
.dropShadows .sideBottom{height: 5px; width: 100%; bottom: -3px; left: 0; background:url(/images/shadows_sidetopbottom.png) 0  -5px repeat-x;}
/*


.dropShadows  .sideBottom{bottom: -2px; right: -3px; background: url(/images/shadows.png) -7px -7px no-repeat;}
*/
/* SHADOWS */

/* POPUP */
.underPop {position: absolute; display: none; left: 0; top: 0; background: white; filter:progid:DXImageTransform.Microsoft.alpha(opacity=50); -moz-opacity: .5; opacity: .5; z-index: 99999999999;}
.popup {position: absolute; display: none; padding: 35px 20px 20px; text-align: center; background: white; border: 2px solid #8e8686; z-index: 999999999999;}
.popup p, .popup img {margin: 0; padding: 0; max-width: 1024px;}

.popup p.close {position: absolute; right: 20px; top: 8px; font-size: 12px;}
.popup p.close a {color: black;}

.popup #bigImgDescr{margin-top: 15px; color: black;}
/* POPUP */


/* HEADER */
#logo{position: absolute; top: 60px; left: 160px;}
#logo img{width: 218px; height: 54px;}


#header h1{position: absolute; font-size: 14px; left: 163px; top: 120px;}
#phone{position: absolute; font-size: 31px; color: white; right: 200px; top: 63px;}
#icq{position: absolute; font-size: 20px; color: white; right: 275px; top: 119px;}

#menu li{position: absolute; bottom: 0;}
#menu li{position: absolute;}
#menu li a{color: white; font-size: 20px; text-decoration: none;}
#menu li.big a{font-size: 30px;}
#menu li.about {bottom: 65px; left: 160px;}
#menu li.actions {bottom: 28px; left: 268px;}
#menu li.contacts {bottom: 80px; left: 354px;}
#menu li.portfolio {bottom: -5px; left: 408px;}
#menu li.blog {bottom: 38px; left: 600px;}
#menu li.prices {bottom: 105px; left: 677px;}
#menu li.cms {bottom: 180px; left: 772px;}
/* HEADER */
/* HEADER */

/* CONTENT */
#content  p{margin: 10px 0; }
#content  h2, #content  .h2{font-size: 25px; margin: 15px 0 15px 0 !important; clear: both;}
#content  h3, #content  .h3{font-size: 20px; margin: 15px 0 5px 0 !important; clear: both;}
#content  h4, #content  .h4{font-size: 16px; margin: 15px 0 -5px 0 !important; clear: both;}
#content  p strong{font-weight: bold;}
#content  a{color: white;}
#breadCrumbs {margin: -10px 0 25px 0 !important;}

.portfolioBlock {margin: 15px 0; }
.portfolioBlock p.blockHeader{font-size: 20px; margin: 0 !important; }
.portfolioBlock p.blockHeader a{color: white; font-size: 11px; text-decoration: none; vertical-align: middle;}

.portfolioBlock div{background: white; text-align: center; width: 250px; margin: 30px 28px; padding: 5px; }
* html .portfolioBlock div{width: 250px; padding: 15px; margin: 30px 10px; }
.portfolioBlock div img{width: 100%; height: 200px; border: 1px solid #eff0f3;}
.portfolioBlock div p{margin: 10px 0 0 0 !important; text-align: center;}
.portfolioBlock div p a{color: black !important; text-decoration: none;}
.portfolioBlock div p small{display: block; color: #7a7a7a; margin-top: 5px; font-size: 11px;}
.portfolioBlock div p small a{color: #7a7a7a !important;}

.portfolioBlock p.more {text-align: right; }

.portfolioItem p.blockHeader{font-size: 20px;}
.portfolioItem p.blockTitle{font-size: 16px;}
.portfolioItem div.img{text-align: center; margin-top: 30px !important;  }

.portfolioItem div.img .browserTop{height: 47px; width: 634px;background: url(/images/browser.png) no-repeat;} 

.portfolioItem div.img .browserBottom{height: 15px; width: 634px; background:#c6c6c6;}

/*.portfolioItem p.img{text-align: center; margin-top: 30px !important; background: white;}*/
.portfolioItem div.img img{width: 630px; margin-left:1px; margin-bottom:-2px; border: 1px solid #c6c6c6;}


p.blogItem{margin-bottom: 30px !important;}
p.blogItem small, p.blogItem a.more{display: block;}
p.blogItem a.more {text-align: left; margin-top: 3px; font-size: 11px;}
p.blogItem small {margin-bottom: 3px; color: black; font-size: 10px;}

p.icq img{vertical-align: middle;}
/* CONTENT */

/* RIGHT */
#right  p{margin: 10px 0;}
#right  p.blockHeader{font-size: 25px; margin: 15px 0;}
#right  ul.blogRubrics {margin: 15px 0;}
#right  ul.blogRubrics li{margin: 7px 0 7px 10px;}
#right  a{color: white;}
#right  div.block{margin-bottom: 30px;}
/* RIGHT */

/* FOOTER */
#counters{position: absolute; top: 40px; left: 0; width: 100%;}
#counters img{float: left; margin-right: 30px;}

#copyright{position: absolute; color: white; top: 40px; right: 0; text-align: right;}
#copyright a{color: white; display: block; text-decoration: none;}
/* FOOTER */