/* GEMIST-sites CSS */

/*----------------------------------------------------------------
FONTS
----------------------------------------------------------------*/
@font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 300; src: local('Open Sans Light'), local('OpenSans-Light'), url(http://themes.googleusercontent.com/static/fonts/opensans/v8/DXI1ORHCpsQm3Vp6mXoaTXhCUOGz7vYGh680lGh-uXM.woff) format('woff'); }
@font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 400; src: local('Open Sans'), local('OpenSans'), url(http://themes.googleusercontent.com/static/fonts/opensans/v8/cJZKeOuBrn4kERxqtaUH3T8E0i7KZn-EPnyo3HZu7kw.woff) format('woff'); }
@font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 700; src: local('Open Sans Bold'), local('OpenSans-Bold'), url(http://themes.googleusercontent.com/static/fonts/opensans/v8/k3k702ZOKiLJc3WVjuplzHhCUOGz7vYGh680lGh-uXM.woff) format('woff'); }

/*----------------------------------------------------------------
RESET STYLES
----------------------------------------------------------------*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }
article, aside, details, figcaption, figure,  footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }
strong { font-weight: bold; }
i, em { font-style: italic; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

/*----------------------------------------------------------------
STANDAARD KLASSEN
----------------------------------------------------------------*/
html, body { height: 100%; }
html, body, table, select, input, button, textarea, a { font: 16px 'Open Sans', sans-serif; font-weight: 300; color: #2f2d31; letter-spacing: 0; }
body { overflow-x: hidden; background-color: #fff;  }
p { margin: 5px 0; padding: 5px 0; }
em, em a { font-style: italic; }
img { border: 0; vertical-align: middle; }
table { width: 100%; border-spacing: 0; border-collapse: collapse; }
td { padding: 2px 0; vertical-align: top; }
input[type="text"], input[type="email"], input[type="password"], textarea, select { width: 250px; padding: 10px; margin: 0 0 5px; border: solid 1px #dbdbdb; border-radius: 5px; background-color: #f9f9f9; box-sizing: border-box; }
textarea { height: 200px !important; }
input[readonly], input[disabled], textarea[readonly], textarea[disabled] { background-color: #efefef; color: #6a6a6a; }
::-webkit-input-placeholder { font-style: italic; color: #b0b0b0; }
::-moz-placeholder { font-style: italic; color: #b0b0b0; }
:-ms-input-placeholder { font-style: italic; color: #b0b0b0; }
input:-moz-placeholder { font-style: italic; color: #b0b0b0; }
button, .btn { cursor: pointer; display: inline-block; padding: 5px 10px; border: solid 1px #1698a0; border-radius: 5px; background-color: #00beca; font-weight: bold; color: #fff; text-align: center; }
button.disabled, .btn.disabled, button.disabled:hover, .btn.disabled:hover { border-color: #939393; background-color: #b8b8b8; text-decoration: none; }
a { outline: none; cursor: pointer; color: #2f2d31; text-decoration: none; }
a:hover { text-decoration: underline; }

/*----------------------------------------------------------------
LAYOUT KLASSEN
----------------------------------------------------------------*/
#site
{
}
    /* menu */
    #site #menu
    {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        background-color: #88c744;
        border-bottom: solid 1px #fff;
        z-index: 999;
    }
        #site #menu > div { width: 900px; margin: 0 auto; }
        #site #menu > div > ul { }
        #site #menu > div > ul > li { float: left; }
        #site #menu > div > ul > li a { display: block; padding: 38px 20px; color: #fff; }
        #site #menu > div > ul > li a:hover { background-color: #7abd32; text-decoration: none; }
        #site #menu > div > ul > li a.selected { background-color: #02a5c8; }

    /* banner */
    #site #banner
    {
        margin: 99px 0 0;
        background-position: center top;
        background-size: cover;
        background-repeat: no-repeat;
        background-color: #2f2d31;
    }
        #site #banner > div { position: relative; width: 900px; height: 360px; margin: 0 auto; }
        #site #banner > div a { position: absolute; top: 20px; right: 130px; }
    
    /* content */
    #site #content
    {
    }
        #site #content > div { width: 900px; margin: 0 auto; padding: 0 0 80px; }
        #site #content h1#headline { margin: 50px 0; font-size: 40px; font-weight: 300; line-height: 52px; letter-spacing: 1px; }
        #site #content #left { float: left; width: 430px; margin: 0 45px 0 0; }
        #site #content #right { float: right; width: 425px; }
        #site #content #full { }

    /* footer */
    #site #footer
    {
        background-color: #02a5c8;
        color: #fff;
    }
        #site #footer > div { width: 900px; margin: 105px auto 0; }
        #site #footer > div > img { margin: -105px 0 0; }
        #site #footer > div a { color: #fff; }
        #site #footer > div #contact { float: left; width: 390px; margin: 40px 30px; }
        #site #footer > div #contact p strong { font-size: 19px; }
        #site #footer > div #nav { float: left; width: 450px; margin: 40px 0; }
        #site #footer > div #nav ul { float: left; margin: 0 30px; }
        #site #footer > div #nav ul li { margin: 5px 0; }
        #site #footer > div #nav ul li a { font-size: 19px; font-weight: bold; }

/* animations */
a:hover { transition: background-color .3s ease-in-out, color .3s ease-in-out; -moz-transition: background-color .3s ease-in-out, color .3s ease-in-out; -webkit-transition: background-color .3s ease-in-out, color .3s ease-in-out; }

/*----------------------------------------------------------------
UTILITY STYLES
----------------------------------------------------------------*/
.clearer { clear: both; visibility: hidden; height: 0; }
.cropper { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; }

/* editor */
.formatted h1 { font-size: 20px; font-weight: bold; }
.formatted h2 { font-size: 20px; font-weight: bold; }
.formatted ul { margin: 10px 0; padding: 0 0 0 20px; }
.formatted ul li { padding: 0 0 0 5px; list-style-image: url('images/bullet.png'); }
.formatted a { color: #02a5c8; }

/* macros */
.googlemap { width: 100%; height: 370px; }

/* pages */
body.home #right ul { padding: 0; padding: 0; }
body.home #right ul li { padding: 10px 0 0 40px; background: url('images/bullet-large.png') no-repeat 0 5px; list-style: none; font-size: 15px; }
body.home #right ul li:first-letter { margin: 0 5px 0 -28px; color: #fff; }
body.home #right ul li:first-line { font-size: 16px; font-weight: bold; }