/*
    Created on : Nov 29, 2013, 2:22:05 PM
    Author     : sergkam
*/

html, body, section, div {
    margin: 0;
    padding: 0;
}


body {
    background: rgb(89, 107, 134);
    color: wheat;
    text-shadow: 1px 1px black;
    font-size: 2em;
    font-family: Arial;
}

a {
    color: white;
    text-decoration: none;
}

a:hover {
    text-shadow: 1px 1px black;
    text-decoration: underline;
}

.level {
    display: inline-block;
    height: 5em;
    vertical-align: top;
}

.start {
    padding: 10px;
    font-weight: bold;
    font-size: 200%;
    border-radius: 5px;
    text-shadow: 1px 1px white;
    background: -webkit-linear-gradient(#eee , rgb(209, 175, 139) );
    background: -moz-linear-gradient(#eee , rgb(209, 175, 139) );
    color: rgb(44, 58, 27);
}

.start.done {
    text-shadow: -1px -1px black;
    background: -webkit-linear-gradient(#999 , #eee);
    background: -moz-linear-gradient(#999 , #eee);
    color: white;
}


footer {
    position: fixed;
    bottom: 1%;
    right: 1%;
    font-size: 0.5em;
}

.main {
    height: 90%;
    vertical-align: top;
}

.main-container {
    text-align: center;
}
.main-container button {
    padding-right: 50px;
    padding-left: 50px;
}

div.left, div.right {
    width: 45%;
    height: 90%;
    display: inline-block;
    margin: 0.3em;
    border: 1px solid activeborder;
    box-shadow:  0 0 10px black;
    border-radius: 5px;
    vertical-align: top;
}

.word {
    padding: 0.2em 1em;
    font-weight: bold;
    font-size: 150%;
    border-radius: 5px;
    text-shadow: 1px 1px white;
    background: -webkit-linear-gradient(#eee , rgb(209, 175, 139) );
    background: -moz-linear-gradient(#eee , rgb(209, 175, 139) );
    color: rgb(44, 58, 27);
    margin: 0.3em;
    left: 50%;
    top: 50%;
    cursor: pointer;
}

.word.selected {
    text-shadow: -1px -1px black;
    background: -webkit-linear-gradient(#999 , #eee);
    background: -moz-linear-gradient(#999 , #eee);
    color: white;
}

.word.selected.wrong {
    background: -webkit-linear-gradient(red , #eee);
    background: -moz-linear-gradient(red , #eee);
}