/* GENERAL */
/*
@font-face { font-family: "FreeSans"; src: url(fonts/FreeSans.otf) format("opentype"); }
@font-face { font-family: "FreeSans"; src: url(fonts/FreeSansOblique.otf) format("opentype"); font-style:italic; }
@font-face { font-family: "FreeSans"; src: url(fonts/FreeSansBold.otf) format("opentype"); font-weight:bold; }
@font-face { font-family: "FreeSans"; src: url(fonts/FreeSansBoldOblique.otf) format("opentype"); font-style:italic; font-weight:bold; }
*/

@font-face{
    font-family: 'Source Sans Pro';
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    src: local('☺'),
         url('fonts/source-sans-pro/EOT/SourceSansPro-Regular.eot') format('embedded-opentype'),
         url('fonts/source-sans-pro/WOFF/OTF/SourceSansPro-Regular.otf.woff') format('woff'),
         url('fonts/source-sans-pro/OTF/SourceSansPro-Regular.otf') format('opentype'),
         url('fonts/source-sans-pro/TTF/SourceSansPro-Regular.ttf') format('truetype');
}

@font-face{
    font-family: 'Source Sans Pro';
    font-weight: normal;
    font-style: italic;
    font-stretch: normal;
    src: local('☺'),
         url('fonts/source-sans-pro/EOT/SourceSansPro-It.eot') format('embedded-opentype'),
         url('fonts/source-sans-pro/WOFF/OTF/SourceSansPro-It.otf.woff') format('woff'),
         url('fonts/source-sans-pro/OTF/SourceSansPro-It.otf') format('opentype'),
         url('fonts/source-sans-pro/TTF/SourceSansPro-It.ttf') format('truetype');
}


@font-face{
    font-family: 'Source Sans Pro';
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    src: local('☺'),
         url('fonts/source-sans-pro/EOT/SourceSansPro-Semibold.eot') format('embedded-opentype'),
         url('fonts/source-sans-pro/WOFF/OTF/SourceSansPro-Semibold.otf.woff') format('woff'),
         url('fonts/source-sans-pro/OTF/SourceSansPro-Semibold.otf') format('opentype'),
         url('fonts/source-sans-pro/TTF/SourceSansPro-Semibold.ttf') format('truetype');
}

@font-face{
    font-family: 'Source Sans Pro';
    font-weight: bold;
    font-style: italic;
    font-stretch: normal;
    src: local('☺'),
         url('fonts/source-sans-pro/EOT/SourceSansPro-SemiboldIt.eot') format('embedded-opentype'),
         url('fonts/source-sans-pro/WOFF/OTF/SourceSansPro-SemiboldIt.otf.woff') format('woff'),
         url('fonts/source-sans-pro/OTF/SourceSansPro-SemiboldIt.otf') format('opentype'),
         url('fonts/source-sans-pro/TTF/SourceSansPro-SemiboldIt.ttf') format('truetype');
}
/*

@font-face{
    font-family: 'Source Sans Pro';
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    src: url('fonts/source-sans-pro/EOT/SourceSansPro-Bold.eot') format('embedded-opentype'),
         url('fonts/source-sans-pro/WOFF/OTF/SourceSansPro-Bold.otf.woff') format('woff'),
         url('fonts/source-sans-pro/OTF/SourceSansPro-Bold.otf') format('opentype'),
         url('fonts/source-sans-pro/TTF/SourceSansPro-Bold.ttf') format('truetype');
}

@font-face{
    font-family: 'Source Sans Pro';
    font-weight: bold;
    font-style: italic;
    font-stretch: normal;
    src: url('fonts/source-sans-pro/EOT/SourceSansPro-BoldIt.eot') format('embedded-opentype'),
         url('fonts/source-sans-pro/WOFF/OTF/SourceSansPro-BoldIt.otf.woff') format('woff'),
         url('fonts/source-sans-pro/OTF/SourceSansPro-BoldIt.otf') format('opentype'),
         url('fonts/source-sans-pro/TTF/SourceSansPro-BoldIt.ttf') format('truetype');
}

*/
* { margin:0; padding:0; }

body {
/*    font-family:"FreeSans"; font-size:12px; line-height:18px; */
    font-family:"Source Sans Pro"; font-size:12px; line-height:18px;

    background:#f6f6f6;
    color:#333;
    margin-top: 0px;
    /*
     * height maximised through js
     */
}

body.waiting * { cursor: wait !important }

h1 { font-size:20px; font-weight:normal; margin-left:45px; margin-right:45px; margin-bottom:10px; color:#999; }
h2 { font-size:14px; font-weight:normal; margin-left:45px; margin-right:45px; margin-top:16px; margin-bottom:6px; color:#999; }

p { margin-bottom:6px; margin-left:45px; margin-right:45px; }
#maincontainer { 
    margin:auto; 
    width:900px; 

    /* 100% of body */
    height: 100%;
}

#main { 
    /*
     * position:absolute; 
     */
    top:0px; 
    height:100%; 
    width:900px; 
    background:#fff; 
    border-left:solid #ddd 1px; 
    border-right:solid #ddd 1px; 
    border-bottom:solid #ddd 1px; 
}

#main.home, #main.browse { height:100%; border-bottom:none; }

#content { 
    margin-bottom:30px; 

    /* logo height = 124*/
    padding-top: 150px;

}

#content a { 
    color:#56a; 
    text-decoration:none; 
}

#content a:hover, #content a:active { 
    color: #333;
    text-decoration:none; 
    border-bottom:1px solid #ddd; 
}

#content a.search-go, a.search-go img {
    border:none; 
    cursor: pointer;
}

#content a:hover.search-go, a:hover.search-go img { 
    border:none; 
}

#content a:visited.search-go, a:visited.search-go img { 
     border:none; 
}

a { -webkit-transition:color 200ms ease-in; }

#toolbar {
    position: absolute;
    top: 99px;
    width: 865px;
    padding-left: 35px;
    height: 25px;
}

/* HEADER */

#menu {
    position: relative; 
    display: inline-block;
}

#menu ul { 
    font-size:11px; 
    line-height:15px; 
    list-style:none; 
}

#menu ul li { 
    text-align:left; 
    position:relative; 
    float:left; 
}

#menu ul li a { 
    display:block; 
    font-weight:bold; 
    background:transparent; 
    height:14px; 
    padding:5px 10px; 
} 

#menu ul li a:hover { 
    background:url(/images/menu_page_over.jpg) repeat-x right; 
}

#menu ul li a, #fontscaler span {
    text-decoration:none; 
    color:#bbb; 
}

#menu ul li a:hover, #fontscaler span:hover, .fontscaler-selected {
    color:#fff !important;
}

#fontscaler {
    display: none; /* only in browseview */
    float: right;
    margin-right: 4px;
    margin-top: 4px;
    height: 12px;
    top: 5px;
    color: #bbb;
    font-family:arial,sans-serif;
}

#fontscaler span {
    padding-right: 4px;
    cursor: pointer;
}

#fontscaler-a {
    font-size: 10px;
}
#fontscaler-aa {
    font-size: 12px;
}
#fontscaler-aaa {
    font-size: 14px;
}

#keyboard { 
    float: right;
    margin-right: 58px;
    height:12px; 
    width:18px; 
    cursor: pointer;
}

#keyboard img {
    margin:0px; 
    padding:0px; 
    border:none; 
}

#keyboard_content {
    white-space: nowrap;
    display:none; 
    position: absolute; 
    z-index: 20;
    width:340px; 
    top: 25px;
    right:0px;
    background:#f6f6f6;
    border-left:solid #ddd 1px; 
    border-bottom:solid #ddd 1px;
    padding:20px;
    font-size:17px;
    box-shadow:1px 1px 20px #999; 
}
#keyboard_content table{
  width:100%;
}
#keyboard_content td {
text-align:center ;
padding-bottom:10px;
}
#keyboard_content td span{
  font-size:28px;
}
.spacer {
    height: 40px;
}

.linklike {
    /*
    color: DarkCyan;
    */
    color: #b22;
    cursor: pointer !Important;
}

.linklike-normal, .linklike-dead {
    text-decoration: underline;
}

.linklike-dead {
    color: red !Important;
}

.linklike-normal {
    color: darkblue !Important;
    cursor: pointer !Important;
}

.red {
    color: red;
}

#etym-div, #parsveld-div {
    padding: 20px;
    width: 60%;
    background: white;
    margin: auto;
    min-height: 300px;
}

span.spinner, span.spinner-v {
    display: inline-block;
    background: url(/images/spinner.gif) no-repeat;
    background-position: 0px 0px;
    width: 18px;
}

/* spinner which starts out spinning. meant to be used with display
 * property. */
span.spinner:before, span.spinner-v:before {
    /* U+2002 */
    content: ' '; 
}

/* spinner which starts out hidden. meant to be used with visibility
 * property. */
span.spinner-v {
    visibility: hidden;
}

#spinner-main {
    display: none;
    position: absolute;
visibility: visible !important;
    /* pos set through js */
}

.search {
    white-space: nowrap;
}

.search-orig {
    color: #999;
}


#footer { 
    bottom:0px; 
    /*
    position:absolute; 
    */
    position:fixed;
    width: 900px; 
    height:20px; 
}

#footer p { 
    height:20px; 
    text-align:center; 
    background:white; 
    margin:0px; 
    padding:0px; 
    font-size:11px; 
    color:#999; 
}

#footer a {
    text-decoration: none;
    cursor: pointer;
    color:#999; 
}

#footer a:hover {
    color:#666; 
    text-decoration:none;
}

/* move is an ugly crosshair, used as fallback */
.cursor-closedhand {
    cursor: url(/images/closedhand.cur) 4 4, move;
}

.cursor-openhand {
    cursor: url(/images/openhand.cur) 4 4, move;
}

#header-container {
    position: relative;
}

#logo { 
    position:absolute; 
    width:900px; 
    height:124px; 
    background:url(/images/header.jpg) no-repeat; 
    cursor: pointer;
}


/* overwrite defaults from autocompleter*/
/* doesn't work here -- move to Autocompleter.css */
/*
ul .autocompleter-choices {
    width: 250px !Important;
}
*/