
body {
    background-image: url('/img/background.jpg');
    background-position: center top;
    background-repeat: no-repeat;
    background-color: #010914;
    margin: 0px; 
    padding: 0px;
    font-size: 0.9em;
    font-family: sans-serif;
    
}

@media all and (min-width: 771px) {
   
    div#header h1 {
        text-align: center;
        margin-top: 0px;
    }
    div#header img {
        margin-top: 15px;
    }

    div#footer-ad {
        display: none;
    }

    div#header {
        height: 57px;
        width: 480px;
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
        margin: 0 0 0 315px;
    }

    div#right-column {
        width: 100px;
        margin: 0 0 0 15px;
        float: left;
    }

    div#left-column {
        float: left;
        width: 300px;
        padding: 0 15px 0 0;
    }

     /**
     * Menu
     */
    nav#menu a,
    nav#menu a:link,
    nav#menu a:visited,
    nav#menu a:active {
        color: #000;
        text-decoration: none;
    }

     a.menu-item {
        width: 100%;
        margin: 0 70px 12px 0;
    }

    nav#menu {
        height: 140px;
        padding: 13px 0 10px 13px;
        border-radius: 5px;
        background-color: #ffffff;
        margin-bottom: 10px;
    }


    nav#menu a:hover {
        text-decoration: underline;
    }

    input#beschikbaar {
        border: 1px solid #b0b0b0;
        width: 319px;
        height: 56px;
        display: inline;
        margin-bottom: 5px;
    }

    input#zoeken {
        border: 1px solid #b0b0b0;
        width: 320px;
        height: 56px;
        border-right: 0px;
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }

    input#submit {
        border: none;
        border-top-right-radius: 3px;
        border-bottom-right-radius: 3px;
        width: 103px;
        height: 58px;
        color: #FFF;
        font-size: 2em;
    }

    div#wrapper {
        width: 910px;
        margin: auto auto;

    }

    div#middle-column { 
        width: 480px;
        float: left;
    } 
    #menu-link {
        display: none;
    }


}

@media screen and (min-width: 726px) and (max-width: 770px) {

    #menu-link {
        display: none;
    }

    div#header h1 {
        text-align: center;
        margin-top: 0px;
    }
    div#header img {
        margin-top: 15px;
    }

    div#footer-ad {
        text-align: center;
    }
    div#header {
        height: 57px;
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
    }

    div#right-column {
      display: none;
    }

    div#left-column:target {     
         width: auto ! important;
        position relative;
    }

    div#wrapper {
        margin: 5px 0 ! important;
        width: auto ! important;
    }

    body {
        background-image: none;
    }

  /**
     * Menu
     */
    nav#menu a,
    nav#menu a:link,
    nav#menu a:visited,
    nav#menu a:active {
        color: #000;
        text-decoration: none;
    }

    div#menu-ad {
        display: none;
    }

    a.menu-item {
        margin: 13px 0 0 20px;
    }

    nav#menu a:hover {
        text-decoration: underline;
    }

    nav#menu{
        list-style: none;
        height: 40px;
        padding: 0 0 0 3px;
        background-color: #ffffff;

    }

    div#middle-column { 
        /*max-width: 685px;
        min-width: 464px;*/
        width: 100% ! important;
        position: relative;
    }

    input#beschikbaar {
        border: 1px solid #b0b0b0;
        width: 319px;
        height: 56px;
        display: inline;
        margin-bottom: 5px;
        margin-right: 100px;
        
    }   

    input#zoeken {
        border: 1px solid #b0b0b0;
        width: 320px;
        height: 56px;
        border-right: 0px;
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
        
    }

    input#submit {
        border: none;
        border-top-right-radius: 3px;
        border-bottom-right-radius: 3px;
        width: 103px;
        height: 58px;
        color: #FFF;
        font-size: 2em;
        
    }
}

@media screen and (max-width: 725px) {

    #menu-link {
        text-decoration: none;
        color: #ffffff;
        margin: 0 0 0 10px;
        font-size: 2em;
    }

    div#footer-ad {
        display: none;
    }

    .open-menu, .close-menu { 
        float:left;
    }
   

    #left-column {
        margin: 13px 0 0 7px;
        z-index: 200;
        top: 0;
        position: absolute;
    }

    div#header h1 {
        text-align: center;
        margin: 0 0 0 60px;
    }
    div#header img {
        margin-top: 15px;
    }

    div#header {
        height: 57px;
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
    }

    div#right-column {
      display: none;
    }

    div#left-column:target {     
         width: auto ! important;
        position relative;
    }

    div#wrapper {
        margin: 5px 0 ! important;¡
        width: auto ! important;
    }

    body {
        background-image: none;
    }

     /**
     * Menu
     */
    nav#menu a,
    nav#menu a:link,
    nav#menu a:visited,
    nav#menu a:active {
        padding: 15px 0 15px 0;
        color: #000;
        text-decoration: none;
        height: 10px;
    }

     a.menu-item {
        width: 100%;
        background: #ffffff;
    }

    nav#menu:not(:target) {
        display: none;
    }


    nav#menu:target {
        z-index: 100;
        height: 190px;
        margin: 9px 0 0 0;
        padding: 10px 0 10px 0px;
        box-shadow: 0px 3px 5px #e1e1e1;
        background: none;
    }

    nav#menu a:hover {
        text-decoration: underline;
    }

    #menu-ad {

        display: none;
    }
    div#middle-column { 
        /*max-width: 685px;
        min-width: 464px;*/
        width: 100% ! important;
        position: relative;
    }

    input#beschikbaar {
        border: 1px solid #b0b0b0;
        width: 319px;
        height: 56px;
        display: inline;
        margin-bottom: 5px;
        margin-right: 100px;
        
    }   

    input#zoeken {
        border: 1px solid #b0b0b0;
        width: 320px;
        height: 56px;
        border-right: 0px;
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
        
    }

    input#submit {
        border: none;
        border-top-right-radius: 3px;
        border-bottom-right-radius: 3px;
        width: 103px;
        height: 58px;
        color: #FFF;
        font-size: 2em;
        
    }

}

input {
    padding: 0;
    margin: 0;
    border: 0px;
}


div#header, input[type=submit] {
    background-image: linear-gradient(bottom, rgb(1,83,103) 0%, rgb(0,173,212) 100%);
    background-image: -o-linear-gradient(bottom, rgb(1,83,103) 0%, rgb(0,173,212) 100%);
    background-image: -moz-linear-gradient(bottom, rgb(1,83,103) 0%, rgb(0,173,212) 100%);
    background-image: -webkit-linear-gradient(bottom, rgb(1,83,103) 0%, rgb(0,173,212) 100%);
    background-image: -ms-linear-gradient(bottom, rgb(1,83,103) 0%, rgb(0,173,212) 100%);

    background-image: -webkit-gradient(
        linear,
        left bottom,
        left top,
        color-stop(0, rgb(1,83,103)),
        color-stop(1, rgb(0,173,212))
    );
}


div#content {
    background-color: #FFF;
    padding: 20px;
    box-shadow: inset 0px 3px 5px #e1e1e1;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    margin-bottom: 10px;
}

div#content h1 {
    display: none !important;
}

input#beschikbaar,
input#zoeken {
    border-radius: 3px;
    font-size: 2em;
    box-shadow: inset 3px 3px 5px #e1e1e1;
    text-indent: 12px;
}

span.no-white-space {
    word-spacing: -0.33em;
}

/*
 * Rechterblok
 */

iframe.twitter-share-button,
div.fb-like {
    margin-bottom: 20px;
}

table.anagram-results,
table.results {
    margin-top: 15px;
    border-collapse: collapse;
}


table.anagram-results th,
table.results th {
    text-align: left;
}

table.anagram-results th.word,
table.results th.word {
    width: 288px;
    font-size: 1.4em;
}

table.anagram-results th.wide {
    width: 576px;
}

table.anagram-results tr.odd,
table.results tr.odd {
    background-color: #f0f0f0;
}

div#ad-search {
    margin-left: 52px;
    margin-top: 15px;
}


a.menu-item {
    float: left;
}

@-moz-document url-prefix() {
    input#submit {
        position: relative;
        top: 1px;
    }
}