html,body,div,span,h1,h2,h3,h4,h5,h6,p,a,img,strike,b,i,label,ul,table,thead,tr,th,td,article,canvas,footer,header {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
    text-align: left;
}

td, th, label {
font-family: 'Open Sans', Georgia, Times, serif;
font-size: 0.9rem;
}

article,footer,header {
    display: block;
}

body {
    line-height: 1;
    height:100%;
}

ul {
    list-style: none;
    text-align: center;
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

body {
    background: #ffffff;
    font-size: 1em;
}

li {
    line-height: 1.4;
}

p {
    font-family: 'Open Sans', Georgia, Times, serif;
    padding: .75em 0;
    line-height: 1.7em;
    color: #000;
    max-width: 750px;
    margin-left: auto;
    margin-right: auto;
}

h1 {
    max-width: 750px;
    margin-left: auto;
    margin-right: auto;
}

blockquote {
    font-style: italic;
}


#alattip {
    width: 11em;
    height: 17em
}

#slika_igraca {
    width: 150px;
}


#povjesni {
    max-width: 40em;
    max-height: 40em;
}

#myChart{
    max-width: 45em;
}


#news, .entry h1, .date-stamp, #question, .nav-buttons, footer p, footer a:link {
    font-family: 'Open Sans', Verdana, Helvetica, Arial, sans-serif;
}

a:link {
    color: #2D2D2D;
    text-decoration: underline;
    font-weight: 700;
}

a:visited {
    color: #000;
}

header img {
/*    display: block;*/
    height: 6em;
    max-width: 100%;
    margin: 0 auto;
    padding: 3em 0em 1em 4em;
}

.logo {
    float: left;
}

.social {
    float: right;
    height: 2em;
    max-width: 100%;
    margin: 0 auto;
    padding: 5.7em 4em 0em 3em;
}

#entry-wrapper {
    margin: 0 auto;
    margin-top: 2em;
    width: 70%;
    border-radius: 0em;
    background: #fff;
    padding: .5em 2em;
}

.entry {
    background: #fff;
    padding: 1.5em;
/*    border: 1px solid #005994;*/
    margin: .5em 0;
/*    background: url('/imgs/graph-tile.png');*/
    border-radius: 0em;
}

.entry h1 {
    font-size: 1.5em;
    line-height: 1.1em;
    font-weight: 700;
}

.illustration {
    max-width: 100%;
    margin: 0 auto;
    padding: 0.7em 0;
}

#footer-wrapper, #header-wrapper {
    overflow: hidden;
    display: block;
    width: 70%;
    background: #fff;
    margin: 0 auto;
    margin-top: 0em;
    margin-bottom: 0em;
    padding-left: 2em;
    padding-right: 2em;
    border-radius: 0em;
    -moz-border-radius: 0em;
}


#header-wrapper {
    margin-top: -2em;
    min-height: 200px;
}

footer {
    height: 100%;
}

#footer-links, #book-links {
    height: 100%;
    font-size: .9em;
    text-transform: uppercase;
    padding: 1em;
    text-align: center;
    line-height: 1.5;
    font-weight: 700;
}

#footer-links {
    border-bottom: 1px dotted #ccc;
}

#footer-links li, #book-links li {
    display: inline;
    margin: 1em 0;
    padding: 0 1.5em;
}

#submit {
    display: box;
    margin: 1.5em auto;
    text-align: center;
    font-weight: 600;
    padding: 1em;
    vertical-align: middle;
}

#question {

}

#copyright {
    clear: both;
    border-top: 1px dotted #ccc;
    padding: 1em 0;
    text-align: center;
    font-size: .7em;
}

img.opac:hover {
    opacity: 1;
}
img.opac {
    opacity: .9;
}

.igrac:hover {
    opacity: .8
}

/* fusnote  style*/

.ref {
    position: relative;
    vertical-align: baseline;
}

.refnum {
    position: relative;
    left: 2px;
    bottom: 1ex;
    font-family: 'Open Sans', Verdana, sans-serif;
    color: #666;
    font-size: .7em;
    font-weight: bold;
    text-decoration: underline;
    cursor: pointer;
}

.refbody {
    font-family: 'Open Sans', Verdana, sans-serif;
    font-size: .7em;
    line-height: 1.1;
    display: block;
    min-width: 6em;
    position: absolute;
    left: 25px;
    bottom: 5px ;
    border: 1px solid;
    padding: 5px;
    background-color: #fff;
    word-wrap: break-word;
    z-index: 9999;
    overflow: auto;
}

/* cont style */

#cont-wrapper {
    margin: auto;
    padding: 3em 2em 2em 2em;
    border-radius: 0em;
    background: #fff;
    width: 70%;
    text-align: center;
}

#cont-wrapper:after {
    content: " ";
    display: block;
    height: 0;
    clear: both;
}

.cont-entry {
    display: inline-block;
    height: 27em;
    width: 20em;
    vertical-align: middle;
    margin: 2em .9em 2em .9em;
}

h1.cont-title a {
    text-decoration: none;
}

.cont-entry a:visited {
    color: #999;
}

a:visited .archive-image {
/*    border: 1px solid #999;*/
}

.cont-image {
    height: 20em;
    width: 20em;
/*    border: 1px solid #005994;*/
    margin: .5em auto;
}

.cont-title {
    font-family: 'Open Sans', Verdana, Helvetica, Arial, sans-serif;
    font-size: 1.0em;
    line-height: 1.0;
}

.cont-date {
    font-size: .9em;
    padding-top: .4em;
    font-family: 'Open Sans', Verdana, Helvetica, Arial, sans-serif;
}





/*DODAO NA ISOTYPE*/

.isotype {
    height: 50px; 
}


.small_icon{
    height: 40px;
}

.thrill {
        display: block;
        padding: 0em;
        margin-left: auto;
        margin-right: auto;
        max-width: 30em;
}


#hrv_mob {
    display: none;
}

/* #Media Queries
================================================== */

/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {

}

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-device-width: 480px) {*/
    header img {
        width: 100%;
        height: 100%;
    }

    #hrv_desk {
    display: none;
    }
    #hrv_mob {
    display: inline;
    }
    
    .refbody {
        min-width: 0
    }
    
    .illustration {
        display: block;
        padding: 0em;
        margin: 0em;
        width: 120%;

    }

    .logo {
        display: block;
        float: none;
        max-width: 80%;
        margin: 0 auto;
        padding: 3em 0 1em 0em;
        margin-left: auto;
        margin-right: auto;
    }

    .social {
    display: block;
    height: 4em;
    width: 11.7em;
    margin-left: auto;
    margin-right: auto;
    padding: 3em 0em 0em 0em;

    transform: scale(3);
    -webkit-transform: scale(3);
    -moz-transform: scale(3);
    -ms-transform: scale(3);
    }

    p {
        max-width: none;
    }

    body {
        font-size: 2em;
    }

    #question {
        width: 100%;
    }

    
    #entry-wrapper {
        padding: .5em 1em;
        width: 80%;
    }
    
    #book-wrapper {
        padding: 0;
    }
    
    .entry {
        padding: 1em;
    }
    
    #alattip {
    width: 15em;
    height: 19em;
    font-size: 0.2em
}

#slika_igraca {
    width: 70px;
}

    
    #footer-links {
        height: 100%;
        font-size: 1.2em;
        text-transform: uppercase;
        padding: 0 1em;
        text-align: center;
        line-height: 1.5;
        font-weight: 700;
        border-bottom: 2px solid #005994;
    }
    
    #footer-links li {
        display: block;
        vertical-align: middle;
        padding: .5em;

        margin: 0;

    }
    
    #footer-links li:first-child {
        border-top: none;
    }
    
    #submit {
        font-size: 1.5em;
        width: 70%;
        padding: 0em;
    }
    
    #copyright {
        border-top: 2px solid #005994;
    }

    #footer-wrapper, #header-wrapper {
    width: 100%;
    }

    #cont-wrapper {
    width: 100%;
    padding: 1em 2em 1em 2em;
    }

    .cont-title {
        font-size: 1.5em;
    }

    /*DODAO NA ISOTYPE*/

    .isotype {
        height: 150px; 
    }

}