@import url('common.css');
html, body{
 margin:0;
 padding:0;
 text-align:center;
 background: #FFF;
}

#pagewidth{
 width:780px;
 text-align:left;
margin-left:auto;
 margin-right:auto;
}

#header{
 position:relative;
 height:129px;
 width:100%;
}

#sidecol{
 width:220px;
 float:left;
 position:relative;
  }

#maincol{
 float: right;
 display:inline;
 position: relative;
 width:560px;
 }

.clearfix:after {
 content: ".";
 display: block;
height: 0;
 clear: both;
 visibility: hidden;
 }

.clearfix{display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix{height: 1%;}
.clearfix{display: block;}
/* End hide from IE-mac */


body{
    background: #FCFCFC url('bg.gif');
}


/*******************/
/*layout switch*/
#switch #maincol{
    float: left;
    width: 486px;
}
#switch #sidecol{
    float: right;
    width: 294px;
    padding: 20px 0 0 0;
    overflow: hidden;
    text-align: center;
}
#switch #sidecol .box{
    margin-left: auto;
    margin-right: auto;
    text-align: left;
    float: none !important;
    margin-bottom: 24px;
}

a{
    color: #000;
}
a:hover{
    text-decoration: underline;
    color: orange;
}
a img{
    border: none;
}

h1{
    border-bottom: 1px solid #CCC;
    font: bold 14px Arial;
    letter-spacing: 2px;
    margin-top: 1em;
    /*height: 1%;*/
}
h2{
    font: bold 13px Arial;
    letter-spacing: 2px;
}
h3{
    border-bottom: 1px solid #CCC;
    margin: 1em 0;
}
h4{
    font-weight: bold;
    margin: 2em 0 1em 0;
}

.hr{
    border-bottom: 3px solid #B84936;
    margin-bottom: 10px;
}

#wrapper ul, .txt ul{
    height: 1%;
    list-style: none;
    margin-left: 1em;
}
#wrapper ul li, .txt ul li {
    padding-left: 12px;
    background: url('li.gif') 0px .45em no-repeat;
    line-height: 18px;
}

#wrapper ul li span, .txt ul li span{
    display: block;
    float: left;
    width: 300px;
}

#pagewidth{
    background: #E8E8E8;
    overflow: hidden;
}

#header{
    background: #933 url('bg_top.jpg') repeat-x;
}
#logo{
    position: absolute;
    left: 35px;
    top: 26px;
    background: url('logo.gif') no-repeat;
    width: 182px;
    height: 40px;
    line-height: 40px;
    padding-left: 50px;
    font-size: 15px;
    font-weight: bold;
    letter-spacing: 1px;
    text-decoration: none;
    color: #FFF;
}
#hotline{
    position: absolute;
    left: 11px;
    top: 79px;
    width: 193px;
    height: 44px;
    background: url('tel.jpg') no-repeat;
}
#hotline span{
    display: none;
}

#lngs {
    position: absolute;
    left: 680px;
    top: 4px;
}
#lngs a{
    color: #AAA;
    padding-right: 5px;
    text-decoration: none;
}
#lngs a:hover{
    text-decoration: underline;
    color: orange;
}

#maincol, #sidecol{
    margin-top: 1em;
}

#maincol p{
    font-size: 13px;
    text-align: justify;
    line-height: 1.5em;
    padding: 1em 1em 0 0;
}
#pagewidth{
    /*
    border-right: 2px solid #CCC;
    border-left: 2px solid #CCC;
    */
}
.txt{
    padding-left: 20px;
}

/******** HEADER ***********/
#menu{
    position: absolute;
    left: 275px;
    top: 45px;
    overflow: hidden;
}
#menu li{
    display: block;
    float: left;
}
#menu li a{
    color: #FFF;
    display: block;
    width: 100px;
    height: 80px;
    text-align: center;
    text-decoration: none;
    background-repeat: no-repeat;
    background-position: center bottom;
}
#menu li a span{
    text-align: center;
    /*background: red;*/
    width: 100px;
    height: 100px;
}
#menu li a:hover{
    text-decoration: underline;
}

#mindex{
    background-image: url('mindex.jpg');
}
#mhome{
    background-image: url('mhome.jpg');
}
#mweb{
    background-image: url('mweb.jpg');
}
#moffice{
    background-image: url('moffice.jpg');
}
#mabout{
    background-image: url('mabout.jpg');
}
#mtips{
    background-image: url('mtips.jpg');
}

#flashlink{
    width: 779px;
    height: 47px;
    background: url('pattern.gif');
}
#flashlink a{
    float: right;
    width: 264px;
    height: 43px;
    background: url('flashlink.gif');
}
#flashlink a span{
    display: none;
}

/******** FOOTER ***********/
/*service, antivirus, webpages*/
.box{
    background: #FFF url('bg_box.gif') repeat-x;
    padding: 0px 0 0 6px;
    border: 1px solid #FFF;
    width: 252px;
    height: 110px;
    float: left;
}
.box h2{
    font: bold 13px Arial;
    letter-spacing: 2px;
    padding-top: 10px;
}
.box p{
    font-style: italic;
    line-height: 18px;
    margin: 5px 0 0 1em;
    font-size: 10px;
}
.box div{
    background-position: top right;
    background-repeat: no-repeat;
    width: 100%;
    height: 100%;
}
#bservice{
    background-image: url('bservice.jpg');
}
#bantivirus{
    background-image: url('bantivirus.jpg');
}
#bwebpages{
    background-image: url('bwebpages.jpg');
}
#bpricelist{
    background-image: url('bpricelist.jpg');
}
#bprinters{
    background-image: url('bprinters.jpg');
}

/*contact, last projects*/
.box1{
    margin-top: 1px;
}
.box1 div{
    background-position: top left;
    background-repeat: no-repeat;
    padding: 8px 0 0 30px;
    float: left;
}
.box1 h2{
    margin-left: 12px;
}
/* datum */
.box1 strong{
    font-size: 10px;
    line-height: 14px;
}
.box1 p{
    margin: 18px 0 0 12px;
    font-size: 12px;
}

#bcontact{
    background-image: url('bcontact.jpg');
    width: 228px;
}
#bcontact img{
    vertical-align: middle;
}

#bnews{
    background-image: url('bnews.jpg');
    padding-left: 34px;
    padding-bottom: 1em;
    width: 487px;
    line-height: 18px;
    font-size: 10px;
}
#bnews .pics{
     float: right;
     width: 67px;
     margin-right: 10px;
}
#bnews .pics img{
    margin: 2px 0;
}

#bpricelist{
    cursor: pointer;
}


/*date*/
#bnews h6{
    font-weight: bold;
    font-size: 10px;
    margin-bottom: 3px;
}

/*partners*/
#bpartners{
    background-image: url('bpartners.jpg');
}
#bpartners img{
    margin: 0 0 0 20px;
}

/*custom left footer*/
.box2{
    margin-top: 1px;
    width: 255px;
    _width: 259px;
    float:left;
}
.box2 div{
    padding: 8px 8px 8px 8px;
    float: left;
}
.box2 h2{
    margin-left: 12px;
    margin-bottom: 12px;
}
#bleftfoot img{
    float: left;
    margin-right: 8px;
}
#bleftfoot div {
    font-size: 10px !important
}


.fullhref{
    text-decoration: none;
}
.fullhref:hover{
    text-decoration: none;
}
.pricelist{
    width: 100%;
}
.pricelist span{
    color: #888;
}
.pricelist th{
    background: #FFF;
    line-height: 20px;
}

/*service pc - footer*/
#servicefoot div{
    width: 181px;
    margin: 0 6px 16px 6px ;
    text-align: center;
    float: left;
}
#servicefoot h5{
    font-weight: bold;
    font-size: 11px;
    margin: 10px 0;
    height: 45px;
    vertical-align: middle;
}

/*tips*/
#tips #maincol{
    width: 100% !important;
}

#tipslist{
    list-style: none;
}
#tipslist li{
    background-image: none !important;
    margin-top: 2em;
}
#tipslist li li{
    margin-top: 0.2em;
    margin-left: 1em;

}
#tipslist li img{
    margin-right: 4px;
    vertical-align: middle;
}


#TB_ajaxContent ul{
    list-style-position: inside;
}



