body {
  background-color: #333;
  color: #eee;
  background-image: url('../img/back.png');
  overflow-y: scroll;
}


a img {border: none;}
img   {margin:0;}

div.body {
  margin-top: -280px;
  margin-left: -330px;
  padding: 0;
  width: 660px;
  position: absolute;
  top: 50%;
  left: 50%;
}


div.menu   { float: left;  width: 220px; height: 560px;}
/*div.image  { float: left;  width: 220px; height: 560px; overflow: hidden;}*/
div.text   { float: right; width: 220px; height: 560px; position: relative; z-index: 1;}

div.page   { 
    float: left;  
    width: 0px; 
    height: 560px; 
    margin-left: 220px; 
    background-image: url('../img/page-back.jpg'); 
    overflow: hidden; 
    position: absolute; 
    z-index: 2;      
    text-align: center;       
}

div.page div.container {
    width: 220px;
}
div.page div.container1 {
    width: 220px;
}


div.page#page_default { width: 220px;}
div.page#page_comic   {}
div.page#page_art     {}
div.page#page_default {}

div#page_comic a { 
  background-image: url('../img/lang.png');
  width: 69px;
  height: 27px;
  margin-top: 20px;
  display: block;
  margin-left: 27px;
  margin-right: 0px;
}

div.page#page_comic a#select_ru, div.page#page_comic a#select_ru:visited{ background-position: bottom left; float: left;}
div.page#page_comic a#select_en, div.page#page_comic a#select_en:visited {background-position: top left; float: left;}

div.page#page_comic a#select_ru:hover {background-position: bottom right;}
div.page#page_comic a#select_en:hover {background-position: top right;}


div.page#page_comic a#select_ch1ru, div.page#page_comic a#select_ru_ch1:visited{ background-position: bottom left; float: left;}
div.page#page_comic a#select_ch1en, div.page#page_comic a#select_en_ch1:visited {background-position: top left; float: left;}

div.page#page_comic a#select_ch1ru:hover {background-position: bottom right;}
div.page#page_comic a#select_ch1en:hover {background-position: top right;}

div#page_chars a { 
  background-image: url('../img/char_select.png');
  width: 140px;
  height: 54px;
  margin-top: 50px;
  display: block;
  margin-left: 39px;
  margin-right: 39px;
}

div.page#page_chars a#select_prologue, div.page#page_chars a#select_prologue:visited{ background-position: bottom left; float: right;}
div.page#page_chars a#select_main, div.page#page_chars a#select_main:visited {background-position: top left; float: left;}

div.page#page_chars a#select_prologue:hover {background-position: bottom right;}
div.page#page_chars a#select_main:hover {background-position: top right;}





.kid {/*display: none;*/ position: absolute; width: 220px; height: 560px;}

div.menuc {
  float: right;
  margin-top: 70px;
}

div.menuc a {
  display: block;
  width: 124px;
  height: 27px;
  background-image: url('../img/menu.png');
  background-position: top left;
}

div.menuc a:hover {
  display: block;
  width: 124px;
  height: 27px;
  background-image: url('../img/menu.png');
  background-position: top right;
}
a{
  outline: none;
}

a#comic:hover,a.active#comic { background-position: 100% 0%;}
a#chars:hover,a.active#chars { background-position: 100% 33%;}
a#art:hover,a.active#art     { background-position: 100% 66%;}
a#about:hover,a.active#about { background-position: 100% 100%;}

a#comic { background-position: 0% 0%;}
a#chars { background-position: 0% 33%;}
a#art   { background-position: 0% 66%;}
a#about { background-position: 0% 100%;}

div#lang {
  width: 220px;
  height: 560px;
  background-image: url('../img/kids-back.png');
  display: none;
  position: absolute;
  z-index: 2;
  text-align: center;
}


div#lang a { 
  background-image: url('../img/lang.png');
  width: 69px;
  height: 27px;
  margin-top: 50px;
  display: block;
  margin-left: 10px;
  margin-right: 10px;
}

div#lang a#select_ru, div#lang a#select_ru:visited{ background-position: bottom left; float: right;}
div#lang a#select_en, div#lang a#select_en:visited {background-position: top left; float: left;}

div#lang a#select_ru:hover {background-position: bottom right;}
div#lang a#select_en:hover {background-position: top right;}

div#lang a#select_ch1ru, div#lang a#select_ru_ch1:visited{ background-position: bottom left; float: right;}
div#lang a#select_ch1en, div#lang a#select_en_ch1:visited {background-position: top left; float: left;}

div#lang a#select_ch1ru:hover {background-position: bottom right;}
div#lang a#select_ch1en:hover {background-position: top right;}

div.pager { margin: 5px auto; width: 800px; text-align: center; z-index: 95; position: absolute;}
div.pager a, div.pager a:visited, div.pager a:visited:hover {color: #eee; text-decoration: none;}


#page_charsprologue a {
    display: block; 
    height: 100%; 
    width: 50%;  
    position: absolute;
    z-index: 5;
}

#page_charsprologue a#chars-right {
    margin-left: 185px;
    
}

#page_charsprologue a#chars-right:visited,
#page_charsprologue a#chars-left:visited,
#page_charsprologue a#chars-right,
#page_charsprologue a#chars-left {
    background: none;
}

#page_charsprologue a#chars-right:hover {background: url(../img/next.png) right 50% no-repeat;}
#page_charsprologue a#chars-left:hover {background: url(../img/prev.png) left 50% no-repeat;}


#page_charsmain a {
    display: block; 
    height: 100%; 
    width: 50%;  
    position: absolute;
    z-index: 5;
}

#page_charsmain a#chars-right {
    margin-left: 185px;
    
}

#page_charsmain a#chars-right:visited,
#page_charsmain a#chars-left:visited,
#page_charsmain a#chars-right,
#page_charsmain a#chars-left {
    background: none;
}

#page_charsmain a#chars-right:hover {background: url(../img/next.png) right 50% no-repeat;}
#page_charsmain a#chars-left:hover {background: url(../img/prev.png) left 50% no-repeat;}



#slider {
    width: 738px;
    text-align: left;
}

#slider1 {
    width: 738px;
    text-align: left;
}
