html,body {
    margin:0;
    padding:0;
    font-family: arial;
}

.background {
}
.background_black {
}
.background_dark {
}
.book_wide {
   width: 100%;
   position: absolute;
   top: 35px;
   left: 0px;
   right: 0px;
   bottom: 0px;

   /* overflow:hidden;   */
}
.book_wide_narrow {
   width: 100%;
   position: absolute;
   top: 50px;
   left: 0px;
   right: 0px;
   bottom: 37px;
}
.book_wide_content {
   position: absolute;
   color: BLACK;


overflow: scroll;
-webkit-overflow-scrolling: touch;
}
.book_wide_note_content {
   position: absolute;
   top: 3.7%;
   left: 8.5%;
   right: 8%;
   bottom: 4%;
   color: BLACK;


overflow: scroll;
-webkit-overflow-scrolling: touch;
}

.book_wide_left_content {

   position: absolute;

overflow: scroll;
-webkit-overflow-scrolling: touch;
}
.book_wide_right_content {
   position: absolute;

overflow: scroll;
-webkit-overflow-scrolling: touch;
}
.book_wide_title {
   position: absolute;
}

.book_part_right {
   position: absolute;
   top: 25px;
   width:56%;
   right: 0px;
   bottom: 0px;
  z-index: -1;
}
.book_part_right_desk {
   position: absolute;
   top: 0px;
   left:220px;
   right: 0px;
   bottom: 0px;
  z-index: -1;
}
.book_part_left {
   position: absolute;
   top: 25px;
   width:44.1%;
   left: 0px;
   bottom: 0px;
  z-index: -1;
}
.book_page_left {
   position: absolute;
   top: 25px;
   width:60%;
   left: 0px;
   bottom: 0px;
overflow: scroll;
-webkit-overflow-scrolling: touch;
}
.book_page_right {
   position: absolute;
   top: 25px;
   width:40%;
   right: 0px;
   bottom: 0px;
overflow: scroll;
-webkit-overflow-scrolling: touch;
}
.book_part_left_sidebar {
   position: absolute;
   top: 0px;
   width: 220px;
   left: 0px;
   bottom: 0px;
  z-index: -1;
}

.book_wide_right_content.header_norm {
   top: 9%
}
.book_wide_right_content.header_big {
   top: 14%
}
.book_wide_left_content.header_norm {
   top: 9%
}
.book_wide_left_content.header_big {
   top: 14%
}
.book_wide_content.header_norm {
   top: 9%
}
.book_wide_content.header_big {
   top: 14%
}
.goals,
.goals td,
.goals tr
{
  border-width: 2px;
  border-color: #6699FF;
  border-style: solid;
}
a
{
 text-decoration:none;
 color: BLACK;
}
.fullscreen
{
width: 100%;
padding-top:5px; padding-right:15px; padding-bottom:5px; padding-left:5px;
}
.full
{
width: 100%;
}
.pseudo_full
{
width: 99%;
}
.nearly_full
{
width: 97%;
}
.btn_full
{
width: 96%;
}
.half_width {
  width: 47%;
}
.semi_full
{
 /* width: 76%;
  margin-left: auto ;
  margin-right: auto ; */
}
.full_height
{
height: 100%;
}
.bold
{
 font-weight:bold;
}
.referenz
{
 width: 98%;
 color: BLACK;
 font-family: arial;
 font-size: 75%;
}
.ref_head
{
 width: 98%;
 color: WHITE;
 font-family: arial;
 font-size: 75%;
}
.ref_head tr td {
  vertical-align: bottom;
}
.ref {  padding-top:0px; padding-right:0px; padding-bottom:0px; padding-left:0px; }
.sel {
        padding-top:0px;
        padding-right:0px;
        padding-bottom:0px;
        padding-left:0px;
        width: 90%;
}
.cleared {
    margin:0;
    padding:0;
    border-collapse:collapse;
}
.clear {
 clear:both;
}
.red { color: RED; }
.green { color: GREEN }
.white { color: WHITE }
.black { color: BLACK }
.gray { color: rgb(110, 110, 110); }
.c_light_gray { color: rgb(190, 190, 190); }
.orange { color: ORANGE }
.gold { color: GOLD }

.center {
  width: 90%;
  max-width:380px;
  min-width:50px;
  text-align:center;
  margin-left: auto ;
  margin-right: auto ;
}
.inline{
  display: inline;
}
.left {
  text-align:left;
}
.right {
  text-align:right;
}
.valign_mid {
   vertical-align: middle;
}
.valign_top {
   vertical-align: top;
}

.float_left {
  float:left;
}
.float_right {
  float:right;
}
.center_big {
  width: 100%;
  max-width:450px;
  min-width:60px;
  text-align:center;
  margin-left: auto ;
  margin-right: auto ;

}
.center_big2 {
  width: 100%;
  max-width:450px;
  min-width:60px;
  text-align:center;
  margin-left: auto ;
  margin-right: auto ;

}
.header {

}
.nav_bar {
}
.bottom-right
{
right: 0;
bottom: 0;
position: absolute;
}
.bottom-right-relative
{
right: 0;
bottom: 0;
position: relative;
}

.bottom-left
{
right: 0;
bottom: 0;
position: absolute;
}
.top
{
top: 0;
position: absolute;

}
.top-left
{
left: 0;
top: 0;
position: absolute;

}
.top-right
{
right: 0;
top: 0;
position: absolute;

}
.right-side
{
right: 0;
position: absolute;

}
.top-right-confirm
{

}
.back_btn {
  position:relative;

  height: 34px;
  border: 0px solid ;
 z-index: 9003;
}
.foreground {
 z-index: 8002;
}
.center_image {
  max-width:100%;
  display: block;
  text-align:center;
  margin-left: auto ;
  margin-right: auto ;
}
.center_div {
 width: 100%;
 max-width:700px;
  margin-left: auto ;
  margin-right: auto ;
}
.title_row {

}
.scrollable_main {
position: absolute;
top: 100px;
left: 10px;
right: 10px;
bottom: 20px;

overflow: scroll;
-webkit-overflow-scrolling: touch;
}
.panel_sidebar {
position: absolute;
top: 50px;
left: 2px;
width: 192px;
bottom: 10px;

}
.panel_main {
position: absolute;

overflow: scroll;
-webkit-overflow-scrolling: touch;
}
#containment-wrapper {
  -webkit-user-select: none;  /* Chrome all / Safari all */
  -moz-user-select: none;     /* Firefox all */
  -ms-user-select: none;      /* IE 10+ */

}

.panel_note {
  /* max-height:150px; */
position: absolute;
top: 22em;
bottom: 0px;
width:100%;
overflow: scroll;
-webkit-overflow-scrolling: touch;
}
.panel_assist {
  /* max-height:150px; */
position: absolute;
top: 15.4em;
bottom: 0px;
width:100%;
overflow: scroll;
-webkit-overflow-scrolling: touch;
}
.panel_assist_pic {
 max-width:100%;
 height: 72px;
 padding:1px;
 margin:0px;
}

.panel_node_corner
{
 cursor:crosshair;
}
.title_right {
position: absolute;
top: 10px;
left: 44%;
right: 3%;
color: rgb(204, 204, 204);
}
.scrollable_right_short {
position: absolute;
top: 45px;
left: 44%;
right: 4%;
bottom: 150px;

overflow: scroll;
-webkit-overflow-scrolling: touch;
}
.scrollable_right {
position: absolute;
top: 45px;
left: 44%;
right: 4%;

overflow: scroll;
-webkit-overflow-scrolling: touch;
}
.title_left {
position: absolute;
top: 232px;
width:40%;
left: 10px;

}
.scrollable_left {
position: absolute;
top: 275px;
left: 10px;
width:40%;
bottom: 36px;

overflow: scroll;

-webkit-overflow-scrolling: touch;
}
.textarea_left {
position: absolute;
top: 45px;
left: 10px;
width:40%;

}

.bottom_button
{
left: 10px;
width:40%;
height:35px;
bottom: 0px;
position: absolute;

}
.bottom_list
{
text-align:right;
left: 44%;
right: 4%;
height:130;
bottom: 19px;
position: absolute;
color: rgb(60, 60, 60);
overflow: scroll;
-webkit-overflow-scrolling: touch;
}
.mid
{
text-align:center;
align: center;
}
.bigger
{
 font-size: 200%;
}
.big
{
/* font-size: 150%; */
}
.a_little_small
{
/* font-size: 88%;  */
}
.small
{
/* font-size: 70%; */
}
.tiny
{
/* font-size: 35%;  */
}
.narrow
{
/* width:33%; */
}
.xnarrow
{
/* width:10%;  */
}

.btn_glow {

}

.btn_gray {

}

.shiny {

}
.shiny:hover {
}

.block{
  display: block;
}

.select_btn{
 /* display: block; */
  padding: 4px;
  margin-left:3em;
  margin-top:2px;
  width: 11em;
  font-size: 105%;
  text-align:left;
  float:left;
  cursor: pointer;
}
.hidden {
display: none;
}
.popup {
position:absolute;
display: none;
        /* background: WHITE;
        background:url("img_unit/1.jpg") no-repeat;
        background-size: 100%; */
        width:100%;
        text-align:center;
        /* border:5px solid #000; */
        z-index: 9002;
        top:20%;
}

#popup_panel {
 position:block;
  margin-left: auto ;
  margin-right: auto ;
 text-align:left;
}

.shiny {
 cursor: pointer;
}

.btn {
 cursor: pointer;
}

.monster_block {
        margin:none;
        padding:0px;
        width:100%;
        max-width:700px;
        border-collapse:collapse;
        /* font-size: 60%; */
}
.monster_block table{
        /* width:80%;
         height:100%;
        margin:0px;padding:2px;
        border: 2px solid #56ff56;
        border-width:2px;    */

}
.monster_block tr:last-child td:last-child {

}
.monster_block table tr:first-child td:first-child {

}
.monster_block table tr:first-child td:last-child {

}
.monster_block tr:last-child td:first-child{

}
.monster_block tr:hover td{

}
.monster_block tr:nth-child(odd){ background-color:#6dbc93; }
.monster_block tr:nth-child(even)    { background-color:#abf4ab; }
.monster_block td{

        /*border:0px solid #56ff56;
         border-width:0px 0px 0px 0px; */
        padding:4px;
       /*  font-size:100%; */
        font-family:Arial;
        font-weight:normal;
        color:#000000;
}
.monster_block tr:last-child td{
        /* border-width:0px 0px 0px 0px; */
}
.monster_block tr td:last-child{
       /*  border-width:0px 0px 0px 0px; */
}
.monster_block tr:last-child td:last-child{
      /*   border-width:0px 0px 0px 0px;      */
}
.monster_block tr:first-child td{
        background:-o-linear-gradient(bottom, #007f3f 5%, #007f00 100%);
        background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #007f3f), color-stop(1, #007f00) );
        background:-moz-linear-gradient( center top, #007f3f 5%, #007f00 100% );
        filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#007f3f", endColorstr="#007f00");
        background: -o-linear-gradient(top,#007f3f,007f00);

        background-color:#007f3f;
        /* border:0px solid #56ff56; */

       /*  border-width:0px 0px 0px 0px; */
        /* font-size:125%; */
        font-family:Arial;
        font-weight:bold;
        color:#ffffff;
}
.monster_block tr:first-child:hover td{
        background:-o-linear-gradient(bottom, #007f3f 5%, #007f00 100%);
        background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #007f3f), color-stop(1, #007f00) );
        background:-moz-linear-gradient( center top, #007f3f 5%, #007f00 100% );
        filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#007f3f", endColorstr="#007f00");
        background: -o-linear-gradient(top,#007f3f,007f00);

        background-color:#007f3f;
}
.monster_block tr:first-child td:first-child{
       /* border-width:0px 0px 0px 0px; */
}
.monster_block tr:first-child td:last-child{
 /*        border-width:0px 0px 0px 0px;     */
}

.monster_block_5e {
        margin:none;
        padding:0px;
        width:100%;
        max-width:700px;
        border-collapse:collapse;
        /* font-size: 60%; */
		border-top: medium double #401000;
		border-bottom: medium double #401000 ;
		border-left: thin solid  #ACAC9D;
		border-right: thin solid  #ACAC9D;
}
.monster_block_5e td{

        /*border:0px solid #56ff56;
         border-width:0px 0px 0px 0px; */
        padding:4px;
       /*  font-size:100%; */
        font-family:Arial;
        font-weight:normal;
        color:#000000;
		
}

.monster_block_5e tr:first-child td{
	font-weight:bold;
	color:#8C0000;
}

.monster_block_5e tr:first-child td:first-child{
	font-family:Georgia, serif;
}

.monster_block_5e .monster_header {
	border-bottom: medium solid #8C0000;   
}
.monster_block .hint {
	color: GREEN;
}
.monster_block_5e .hint {
	color: #ACAC9D;
}

.monster_block .monster_subtitle {
        background:-o-linear-gradient(bottom, #0AA859 5%, #109C10 100%);
        background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #0AA859), color-stop(1, #109C10) );
        background:-moz-linear-gradient( center top, #0AA859 5%, #109C10 100% );
        filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#0AA859", endColorstr="#109C10");
        background: -o-linear-gradient(top,#0AA859,109C10);

        background-color:#0AA859;
        /* border:0px solid #56ff56; */

       /*  border-width:0px 0px 0px 0px; */
        /* font-size:125%; */
        font-family:Arial;
        font-weight:bold;
        color:WHITE;
}

.monster_block_5e .monster_subtitle  td{
	border-bottom: thin solid #8C0000;   
	font-size:110%;
	color:#8C0000;
	padding-top:0.5em;
}

.monster_note {
        background-color:#F4E06C;
        cursor: n-resize ;
}
.monster_note_btn {
        margin:none !important;
        padding:0px !important;
        border: 0px !important;
}

.power_table_4e tr:nth-child(odd){ background-color:#6dbc93; }
.power_table_4e tr:nth-child(even) { background-color:#abf4ab; }

.power_table_5e tr:nth-child(odd){  font-weight:bold; }
.power_table_5e tr:nth-child(even) {  }
.power_table_5e tr:nth-child(odd) td { border-top:thin solid #8C0000; }
.power_table_5e tr:nth-child(even)  td {  }

.list_odd { height: 32px;  }
.list_even { height: 32px;  }

.attr_table { width: 100%; display: table; }

.attr_Row {/*width: 100%;  height: 100%; */display: table-row;}

.attr_Cell { /* height: 100%;*/ display: table-cell;}

input[type="text"]{
   -moz-box-sizing:    border-box;
   -webkit-box-sizing: border-box;
    box-sizing:        border-box;
}

.edit_area {
  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;

background-color:#ffffff;
width: 98%;
margin: 0 auto;
overflow: scroll;
-webkit-overflow-scrolling: touch;
border: 1px solid #555555;
padding: 2px;
text-align: justify;

}

.dragHover {
  border:2px solid orange;
}
.draggable {
  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
 cursor: move;
 font-size: 70%;

}

.bg_encounter {
 color: Black;
  width: 80px;
  height: 80px;
  padding: 0.5em;
  background-color:#abf4ab;
  border: 1px solid #555555;
}
.bg_note {
 color: Black;
  width: 80px;
  height: 80px;
  padding: 0.5em;
  background-color:#ffffff;
  border: 1px solid #555555;
}
.bg_note_detail {
 color: Black;
  width: 80px;
  height: 80px;
  padding: 0.5em;
  background-color:#EAEAEA;
  border: 1px solid #555555;
}
.bg_desk {
 color: Black;
  width: 80px;
  height: 80px;
  padding: 0.5em;
  background-color:#C94604;
  border: 1px solid #555555;
}
.bg_card {
 color: Black;
  width: 80px;
  height: 80px;
  padding: 0.5em;
  background-color:orange;
  border: 1px solid #555555;
}
.bg_music {
 color: Black;
  width: 80px;
  height: 80px;
  padding: 0.5em;
  background-color:#E599FF;
  border: 1px solid #555555;
}
.bg_pic {
  width: 80px;
  height: 80px;
  border: 1px solid #555555;
}
.bg_mp_z1_x1 { width: 10px; }
.bg_mp_z1_y1 { height: 10px; }
.bg_mp_z1_x2 { width: 20px; }
.bg_mp_z1_y2 { height: 20px; }
.bg_mp_z1_x3 { width: 30px; }
.bg_mp_z1_y3 { height: 30px; }
.bg_mp_z1_x4 { width: 40px; }
.bg_mp_z1_y4 { height: 40px; }
.bg_mp_z1_x8 { width: 80px; }
.bg_mp_z1_y8 { height: 80px; }
.bg_mp_z1_x10 { width: 100px; }
.bg_mp_z1_y10 { height: 100px; }

.bg_mp_z2_x1 { width: 20px; }
.bg_mp_z2_y1 { height: 20px; }
.bg_mp_z2_x2 { width: 40px; }
.bg_mp_z2_y2 { height: 40px; }
.bg_mp_z2_x3 { width: 60px; }
.bg_mp_z2_y3 { height: 60px; }
.bg_mp_z2_x4 { width: 80px; }
.bg_mp_z2_y4 { height: 80px; }
.bg_mp_z2_x8 { width: 160px; }
.bg_mp_z2_y8 { height: 160px; }
.bg_mp_z2_x10 { width: 200px; }
.bg_mp_z2_y10 { height: 200px; }

.bg_mp_z3_x1 { width: 30px; }
.bg_mp_z3_y1 { height: 30px; }
.bg_mp_z3_x2 { width: 60px; }
.bg_mp_z3_y2 { height: 60px; }
.bg_mp_z3_x3 { width: 90px; }
.bg_mp_z3_y3 { height: 90px; }
.bg_mp_z3_x4 { width: 120px; }
.bg_mp_z3_y4 { height: 120px; }
.bg_mp_z3_x8 { width: 240px; }
.bg_mp_z3_y8 { height: 240px; }
.bg_mp_z3_x10 { width: 300px; }
.bg_mp_z3_y10 { height: 300px; }

.bg_mp_z4_x1 { width: 40px; }
.bg_mp_z4_y1 { height: 40px; }
.bg_mp_z4_x2 { width: 80px; }
.bg_mp_z4_y2 { height: 80px; }
.bg_mp_z4_x3 { width: 120px; }
.bg_mp_z4_y3 { height: 120px; }
.bg_mp_z4_x4 { width: 160px; }
.bg_mp_z4_y4 { height: 160px; }
.bg_mp_z4_x8 { width: 320px; }
.bg_mp_z4_y8 { height: 320px; }
.bg_mp_z4_x10 { width: 400px; }
.bg_mp_z4_y10 { height: 400px; }

.bottom_border_white {
   border-bottom-width:2px;
   border-bottom-color:White;
   border-bottom-style: solid;
}
.bottom_border_blue {
   border-bottom-width:4px;
   border-bottom-color:blue;
   border-bottom-style: solid;
}
.bottom_border_black {
   border-bottom-width:4px;
   border-bottom-color:black;
   border-bottom-style: solid;
}

.card_block_white {
  color: BLACK;
  background-color:#ffffff;
  padding-top:0.5%; padding-right:2%; padding-bottom:0; padding-left:2%;
}
.card_block_pic {
  color: BLACK;
  background-color:#ffffff;
  padding:0;
}
.card_block_yellow {
  color: white;
  background-color:orange;
  padding-top:0.5%; padding-right:1%; padding-bottom:0.2%; padding-left:1%;
}
.card_block_gray {
  color: white;
  background-color:gray;
  padding-top:0.5%; padding-right:1%; padding-bottom:0.2%; padding-left:1%;
}
.card_block_red {
  color: white;
  background-color:red;
  padding-top:0.5%; padding-right:1%; padding-bottom:0.2%; padding-left:1%;
}
.card_block_green {
  color: white;
  background-color:green;
  padding-top:0.5%; padding-right:1%; padding-bottom:0.2%; padding-left:1%;
}
.card_block_blue {
  color: white;
  background-color:blue;
  padding-top:0.5%; padding-right:1%; padding-bottom:0.2%; padding-left:1%;
}
.card_block_violett {
  color: white;
  background-color:#800080;
  padding-top:0.5%; padding-right:1%; padding-bottom:0.2%; padding-left:1%;
}
.card_block_italic{
  color: #888888;
  background-color:#ffffff;
  font-style: italic;  
  padding-top:0.5%; padding-right:1%; padding-bottom:0.2%; padding-left:1%;
}
.card_block_gradient {
  color: BLACK;
  padding-top:0; padding-right:2%; padding-bottom:0; padding-left:2%;

filter: progid:DXImageTransform.Microsoft.gradient(GradientType = 1, startColorstr = '#bababa', endColorstr = '#ffffff');
/*INNER ELEMENTS MUST NOT BREAK THIS ELEMENTS BOUNDARIES*/
/*Element must have a height (not auto)*/
/*All filters must be placed together*/
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType = 1, startColorstr = '#bababa', endColorstr = '#ffffff')";
/*Element must have a height (not auto)*/
/*All filters must be placed together*/
background-image: -moz-linear-gradient(left, #bababa, #ffffff);
background-image: -ms-linear-gradient(left, #bababa, #ffffff);
background-image: -o-linear-gradient(left, #bababa, #ffffff);
background-image: -webkit-gradient(linear, left top, right top, from(#bababa), to(#ffffff));
background-image: -webkit-linear-gradient(left, #bababa, #ffffff);
background-image: linear-gradient(left, #bababa, #ffffff);
/*--IE9 DOES NOT SUPPORT CSS3 GRADIENT BACKGROUNDS--*/
   border-bottom-width:2px;
   border-bottom-color:White;
   border-bottom-style: solid;

}
.card_block_fluff {
  color: BLACK;
  font-style: italic;
  padding-top:0; padding-right:2%; padding-bottom:0; padding-left:2%;

filter: progid:DXImageTransform.Microsoft.gradient(GradientType = 1, startColorstr = '#bababa', endColorstr = '#ffffff');
/*INNER ELEMENTS MUST NOT BREAK THIS ELEMENTS BOUNDARIES*/
/*Element must have a height (not auto)*/
/*All filters must be placed together*/
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType = 1, startColorstr = '#bababa', endColorstr = '#ffffff')";
/*Element must have a height (not auto)*/
/*All filters must be placed together*/
background-image: -moz-linear-gradient(left, #bababa, #ffffff);
background-image: -ms-linear-gradient(left, #bababa, #ffffff);
background-image: -o-linear-gradient(left, #bababa, #ffffff);
background-image: -webkit-gradient(linear, left top, right top, from(#bababa), to(#ffffff));
background-image: -webkit-linear-gradient(left, #bababa, #ffffff);
background-image: linear-gradient(left, #bababa, #ffffff);
/*--IE9 DOES NOT SUPPORT CSS3 GRADIENT BACKGROUNDS--*/
   border-bottom-width:2px;
   border-bottom-color:White;
   border-bottom-style: solid;

}

.card_to_print {
  display: block;
   float:left;
  margin: 0.1cm;
  width: 6.3cm;
  height: 8.6cm;
  font-size:70%;

}

.clickthrough {
 pointer-events:none;
  -webkit-user-select: none;  /* Chrome all / Safari all */
  -moz-user-select: none;     /* Firefox all */
  -ms-user-select: none;      /* IE 10+ */

}
.icon_btn {
 padding-left: 0.3em;
 padding-right: 0.3em;
 padding-top: 0.1em;
 padding-bottom: 0.1em;

}


.active_glow {
    z-index:1020;
    /* border-color: #9ecaed;
    transition: box-shadow 2s ease-out; */
     box-shadow: 0 0 8px 8px  #9ecaed;
     -webkit-box-shadow: 0 0 8px 8px  #9ecaed;
    /*box-shadow: 0 0 0.5em 0.5em  #9ecaed inset; */
   border-width:3px;
   border-color:#9ecaed;
   border-style: solid;


}

.touch_handle {
}

._jsPlumb_connector { z-index:400; }
._jsPlumb_endpoint { z-index:410; }
._jsPlumb_overlay { z-index:420; }

.login_box {
border: 1px solid #0064ec;
border-radius: 26px;
-moz-border-radius: 13px;
-khtml-border-radius: 13px;
-webkit-border-radius: 13px;
overflow:hidden;
padding: 10px;
background-color:white;
color: Black;
 font-family: arial;
}

.info_box {
border: 1px solid #0064ec;
border-radius: 7px;
-moz-border-radius: 7px;
-khtml-border-radius: 7px;
-webkit-border-radius: 7px;
overflow:hidden;
margin:10px;
padding: 10px;
background-color:white;
color: Black;
 font-family: arial;
float: left;
width: 5cm;
max-width: 100%;
min-height: 5cm;
}

.info_box_pic {
 height: 2.5cm;
 max-width: 100%;
}
.highlight_box {
border: 1px solid #0064ec;
margin:5px;
padding: 5px;
}

.zoom_btn {
 height: 2.7em;
 width: 3.6em;
 background:url("pics/zoom_btn.svg") no-repeat ;
 background-size: 60% 90%;
-webkit-appearance: none;
-moz-appearance: window;
appearance: none;
vertical-align:middle;
  border: 0px solid ;

}
.zoom_box {
  height:2.8em;
  line-height: 2.8em;

}

.desk_level_btn {
  line-height: 2.7em;
  border: 0px solid ;
  width: 2.2em;
  height: 2.5em;
  vertical-align:middle;

}

/*  Layout for Version 2.0  */

#top_bar {
   position: absolute;
   top: 0px;
   left: 0px;
   right: 0px;
   heigth: 2em;

}
#top_general {
   position: absolute;
   top: 0px;
   left: 0px;

}
#top_specific {
   position: absolute;
   top: 0px;
   right: 0px;

}
#top_title {
   margin-top:0em;
   height: 2em;
   width:40%;
   text-align:center;
   margin-left: auto ;
   margin-right: auto ;

}

#left_frame {
   position: absolute;
   top: 2em;
   left: 0px;
   width: 40%;
   bottom: 0px;

}
#left_inner_frame {
position: absolute;
overflow: scroll;
-webkit-overflow-scrolling: touch;
}

#right_frame {
   position: absolute;
   top: 2em;
   width: 60%;
   right: 0px;
   bottom: 0px;

}
#content {
position: absolute;
/*overflow: scroll;
-webkit-overflow-scrolling: touch;*/
}

.content_wrapper {
   position: absolute;
   top: 0px;
   left: 0px;
   right: 0px;
   height: 20em;
overflow: scroll;
-webkit-overflow-scrolling: touch;

}