body 
{
    padding : 0px;
    margin : 0px;
}
.template-body 
  { 
    text-align : center;
    overflow : visible;
  }
#template-main-div 
  {
    position      : relative;
    width         : 80%; /* use percentage instead*/
    min-width     : 800px;
    min-height    : 400px;
    height        : 100%;
    margin-left   : auto;
    margin-right  : auto;
    /*border : solid thin black;*/
  }                            
/*********************************************************************
 * SIDEBAR 
 *********************************************************************/

#template-sidebar
{
    width            : 100%;
    height           : 100%;
    position         : absolute;
    left             : -1px;
    top              : 0px
    visibility       : visible;
    background-color : white;
    display          : none;    
}

#template-sidebar-content-frame
  {
      overflow   : scroll;
      height     : 100%;
      max-height : 100%;
      font-size  : smaller;

      text-decoration : none;
      font-family : sans-serif;
      color : rgb(64,64,64);
  }


.sidebar-content-tree
{
    padding-left : .2em;    
}

.sidebar-content-tree-head
{
    white-space : nowrap;    
}

.sidebar-content-tree-number
{
    display : inline-block;
    vertical-align : top;
}

.sidebar-content-tree-link
{
    display : inline-block;
    vertical-align : top;    
}

.sidebar-content-tree-link a
{
    text-decoration : none;
    color : inherit;
}

.sidebar-content-tree-toggle-container { display : none; }
.sidebar-content-tree-lvl-1 .sidebar-content-tree-toggle-container
{
    max-width  : 0px; 
    max-height : 0px;
    position   : relative;
    left       : -13px;
    display    : block;
}

.sidebar-content-tree-lvl-2 .sidebar-content-tree-body { display : none; }

.sidebar-content-tree-toggle-dummy
{
    position     : relative;
    height       : 0px;
    width        : 12px;
    border-style : solid;
    border-color : rgb(200,200,200);
    border-width : 1px 0px 0px 0px;
    top          : .7em;
}

.sidebar-content-tree-toggle
{
    height     : 7px;
    width      : 7px;
    position   : relative;        
    top        : .2em;
    border     : solid 2px;
    border-color : #d2d2d2 #d2d2d2 #808080 #808080;
    
}
.sidebar-content-tree-toggle:hover
{
    background   : rgb(200,200,200);
    border-color : #808080 #808080 #d2d2d2 #d2d2d2;
    margin-right : 2px;    
}


.sidebar-content-tree-body
{
   margin-left : 10px;    
   padding-left  : 10px;
   border-left : solid thin rgb(200,200,200);
}


#template-sidebar-index-frame
  {
      overflow   : scroll;
      height     : 100%;
      max-height : 100%;
      font-size  : smaller;
  }

/*********************************************************************
 * VIEWING AREA
 *********************************************************************/

#template-main-body
  {
    position : absolute;
    right    : 0px;
    /*top      : 74px;*/
    border   : solid thin rgb(232,232,232);
    width    : 695px;
    height   : 100%;
    max-height   : 100%;
  }


#template-main-body-scroller 
  {
    width          : 100%;
  }


#template-main-body-content
    {
        margin-left: 1em; 
        margin-right : 1em; 
    }

#template-toc-div
{
        margin-left: 1em; 
        margin-right : 1em;         
        max-width    : 798px;
        overflow     : hidden;        
}
.template-dead-link 
    {
        color : rgb(192,192,192);
    }

.template-homelink
    {
        text-decoration : none;
        font-weight : bolder;
        font-family : sans-serif;
        color : white;
        font-size : larger;
    }


/*********************************************************************
 * HEADER & FOOTER
 *********************************************************************/

.null-block
{
    max-height : 0px;
    max-width : 0px;
}


#template-header
  {
    width : 800px; 
    min-width : 800px;
    max-height : 50px; 
    height : 50px; 

    text-align : center;
    color : white;
    font-weight : bold;
    font-family : sans-serif;

    background-color : #02456f;

    display : table-cell;
  }

#template-header-site-link
{
    width : 160px; 
    height : 50px; 
    position : relative; 
    left : -25px;
}

.template-header-site-link-img
{
    width : 160px; 
    height : 50px; 
    background-image : url("../graphics/mosek-site-button-bright.png");
}
#template-header-site-link a
{
    text-decoration : none;
    color : inherit;
}
#template-header-site-link a:visited
{
    text-decoration : none;
    height : 50px; 
    color : inherit;
}



#template-header-end-left
{
    background-color : #02456f;
    position : relative;    
    left : -25px;
    border-radius : 25px 0px 0px 25px;
    width : 25px; 
    height  : 50px;
}
#template-header-end-right
{
    background-color : #02456f;
    position : relative;    
    left : 800px;
    border-radius    : 0px 25px 25px 0px;
    width            : 25px; 
    height           : 50px;
}

#template-footer
  {
    width : 800px;
    font-size : smaller;
    color : rgb(128,128,128);

    max-height : 20px; 
    height : 20px; 
    text-align : right; 
  }


#template-mask 
    {
        width      : 800px;
        height     : 100%; /* 1000px */
        min-height : 500px;
        max-width  : 800px;       
       
    }

#template-vertical-main
{
    width : 800px; 
    height : 500px; 

    position : absolute; 
    top : 73px;
    left : 0px;
    visibility : hidden
}
#template-vertical-main * { visibility : visible; }

#template-main-container
{
    border    : solid thin #02456f;
    max-width : 798px;
    width     : 798px;
    min-width : 798px;
    color : black;
    text-align : left;

    
}

#template-main-view 
{
    width    : 800px;
    height   : 100%;    
    position : absolute;
    right    : -0px;
    border   : solid thin rgb(232,232,232);
    visibility : hidden;
}
#template-main-view * { visibility : visible; }

#template-main-view-border-top
{
    border-top : solid thin #02456f; /*rgb(232,232,232); */
    position : absolute;
    top      : -1px;
    height   : 0px;
    width : 100%;
}
#template-main-view-border-bottom
{
    border-bottom : solid thin #02456f;/* rgb(232,232,232);*/
    position : absolute;
    bottom   : -1px;
    height   : 0px;
    width : 100%;
}
#template-main-view-border-left
{
    border-left : solid thin #02456f; /* rgb(232,232,232);*/ 
    position : absolute;
    left     : -1px;
    width    : 0px;
    height   : 100%;
}
#template-main-view-border-right
{
    border-right : solid thin #02456f;/* rgb(232,232,232); */
    position : absolute;
    right    : -1px;
    width    : 0px;
    height   : 100%;
}

.template-top-button-bar 
{
    height      : 20px;
    max-height  : 20px;
    width       : 800px;
    max-width   : 800px;
    
    font-size   : 14px;
    display     : inline-block;
    font-family : sans-serif;
    color       : #427493;
    position    : relative;
    top         : -21px;
    left        : -1px;

    visibility : hidden;
}
.template-top-button-bar .template-button { visibility : visible; }


.template-top-left-button-bar
{
    text-align : left;
}
.template-top-right-button-bar
{
    text-align : right;
}

.template-top-button-bar a { text-decoration : none; }
.template-top-button-bar a:visited { color : inherit; }
.template-top-button-bar a:link { color : inherit; }

.template-button 
{
    border           : solid thin #02456f; /*rgb(232,232,232);*/
    background-color : white;
    border-style     : solid solid none solid;
    border-radius    : 10px 10px 0px 0px;
    text-align       : left;
    padding          : 0px 10px 0px 10px;
    display          : inline-block;    
    height           : 19px;
}



.template-button:hover
{
    background-color : rgb(232,232,232);
    cursor : pointer;
}


.template-left-button-bar
{
    position  : absolute;
    left      : -25px;
    top       : 25px;
    width     : 25px;
    max-width : 25px;
    background-color : white;
}


.template-left-button-div .template-left-button
{
    border           : solid thin #02456f; /*rgb(232,232,232);*/
    border-style     : solid solid solid solid;
    border-right-color : white;
    border-radius    : 10px 0px 0px 10px;
    height           : 100px;
}

#template-toggle-sidebar-div .template-left-button
{
    background-image : url("../images/contents-vert.png");
}