@import url(//fonts.googleapis.com/css?family=Roboto:400,300,300italic,400italic,500,500italic,700,700italic,900,900italic);
@import url(//fonts.googleapis.com/css?family=Roboto+Condensed:300italic,400italic,700italic,400,300,700);
@import url(//fonts.googleapis.com/css?family=Droid+Sans+Mono);

@import 'font-awesome.css';


/* ********* YLEISET ************ */

body {
    font: 12px/16px 'Roboto', sans-serif;
    color: #000;
    font-weight: 400;
    overflow-x: hidden;

}

body.sidebar-first::after {
    display: block;
    position: fixed;
    bottom: 0px;
    right: 0px;
    text-align: right;
    text-shadow: 1px 1px rgba(0,0,0,1);
    vertical-align: bottom;
    width: 100%;
    background-color: rgba(0,0,0,0.35);
    color: rgba(170,170,170, 1);
    font: 11px Roboto Condensed;
    content: "\00A9  Marskin Nyrkki 2014";
    padding: 4px 10px;
    z-index: -1000;
}


body.sidebar-first {
    min-width: 600px;
}

#wrapper #container #header #logo-floater {
}

a:link, a:visited, #wrapper #container .breadcrumb, #wrapper #container .breadcrumb a, th a, th a:link, th a:visited {
    /*color: #7a2600;    */
    color: #00168a;
    font-weight: 700;
}


img#logo {
    height: 96px;
    margin-top: 32px;
    
}


h1, h2, h3, h4, h5 {
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 900;
}
h1 {
        text-shadow: 1px 1px rgba(0,0,0,0.3);

}

html {
    background: #444444 url(../images/main-bg.jpg);
    background-attachment: fixed;
    background-size: cover;

}

body {
    background: transparent none;
}


#wrapper {
    padding-left: 32px;
    padding-right: 32px;
    background: transparent none;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 50px;
/*    max-width: 1600px;*/
}

body.fluid-width #wrapper #container {
    position: relative;
    min-height: 100%;
    width: auto;
    margin-left: auto;
    margin-right: auto;
    max-width: inherit;
    padding-left: 0;
    padding-right: 0;

}

#wrapper #container #center {
    float: left;
    width: 100%;
}

ul {
    list-style-image: none;
}

#wrapper #container .region-footer {
    margin-top: 0;

}


fieldset {
    background: transparent;
    border: none;
}

/* ********* YLÄREUNAN VALIKOT ************ */


ul.main-menu li a,  ul.main-menu li a.active, ul.main-menu li a:link, ul.secondary-menu li a, ul.secondary-menu li a:link, ul.secondary-menu li a:visited {
    background: transparent none;
    line-height: 28px;
    text-shadow: 1px 1px #000;
    list-style-type: none;
    display: inline-block;
    margin: 0;
    padding: 0 0 0 1em;
}

ul.main-menu li, ul.secondary-menu li {
    border-right: inset 2px rgba(30,30,30,0.7);
}

ul.main-menu li:last-of-type, ul.secondary-menu li:last-of-type {
    border-right: none;
}

/* Vasen puoli (main menu) */

ul.links.inline.main-menu {
    height: 32px;
    left: 0px;
    position: fixed;
    width: 100%;
    background: transparent url(../images/metalbar-dark2.jpg) repeat-x;

    z-index: 10;
}

/* Oikea puoli (secondary menu) */

ul.secondary-menu {
    padding-top: 0;
    height: 32px;
    right: 0px;
    position: fixed;
    z-index: 20;
}

ul.secondary-menu li a, ul.secondary-menu li a:link, ul.secondary-menu li a:visited {
    color: #fff;

}

/* ********* SIVUPALKKI ************ */

.sidebar {
}

#wrapper #container #header {
    height: 160px;
}

#wrapper #container .sidebar {
    margin-top: 0px;
    margin-bottom: 10px;
}

#wrapper #container .sidebar .block {
    padding-right: 0px;
    background-color: rgba(255, 255, 255, 0.75);
    padding: 5px 10px 5px 10px;
    border: 1px solid rgba(80,80,80,0.5);
}

.block-menu ul, ul li.leaf, ul li.collapsed, ul li.expanded, .view-sivulista ul {
    list-style-image: none;
    list-style-type: none;
}

li.expanded ul {
    padding-left: 15px;
    font-size: 85%;
}

.block-menu ul, ul.menu, dir {
    list-style-type: none;
    padding-left: 0;
}

.sidebar .block h2 {
    border-bottom: solid 1px rgba(0, 0, 0, 0.2);;
}


/* *************** FOORUMIBOKSI *************** */


ul.phpbb-box {
    list-style-type: none;
    padding: 0;
    line-height: 14px;
}

li.phpbb-inbox {
    font-weight: bold;
}

/* *************** SISÄÄNKIRJAUTUMISLAATIKKO *************** */

#user-login-form {
    text-align: left;
}

.form-submit {
    padding: 5px 10px;
}


input[type=text], input[type=password], input[type=email], input[type=number], textarea, select {
    border: 1px solid rgba(0,0,0,0.5);
    background-color: rgba(255,255,255,0.5); 
    padding: 4px 4px 3px 4px;
    margin: 1px;
    font-family: Roboto;
}

input[type=button], button {
    font-family: Roboto;
    background-color: rgba(0,0,0,0.1);
}

select {
    padding: 3px 4px 2px 4px;

}

/*input#edit-name, input#edit-pass {
    width: 90%;
}*/

.resizable-textarea .grippie {
    border: 1px solid #bbb;
    border-top: none;
}


form#user-register-form div.form-item-name label::after {
    content: "Käytä mieluiten pelinimeäsi käyttäjätunnuksena";
    font-weight: 400;
    display: block;
}


/* ********* SISÄLTÖPALSTA ************ */




#wrapper #container #center #squeeze, #wrapper #container #center .right-corner, #wrapper #container #center .right-corner .left-corner {
    background: transparent none;
}


#wrapper #container #center #squeeze {
    max-width: 1100px;
    background-color: rgba(240, 240, 240, 0.83);
    border: 1px solid rgba(80,80,80,0.5);
    padding: 0px 0px;
    margin: 0 0 0 225px;
}


#wrapper #container #center .right-corner {
    left: 0px;
    padding: 0;
    margin: 0;
}

#wrapper #container #center .right-corner .left-corner {
    padding: 0;
    margin: 0;
    left: 0px;
}




/* Murupolku */

#wrapper #container .breadcrumb {
    position: static;
    width: auto;

    background-color: rgba(0,0,0,0.1);
    border-bottom: 1px solid #999;
    padding: 5px 20px 5px 20px;
    margin: 0px 0px;
}

/* Status/virheviestit */

div.messages {
    margin: 30px 5px;
}

ul.action-links { 
    float: right;
    padding: 0.5em 0 30px;
    margin-right: 30px;
    border-collapse: collapse;
    height: auto;
    line-height: normal;
    list-style: none;
}

ul.action-links li {
    display: inline-block;
    list-style-type: none;
    list-style-image: none;
    background-color: rgba(0,0,0,0.1);
    padding: 4px 12px;
    margin: 0px 0px 0px 10px;
    border: 1px solid rgba(0,0,0,0.15);
}
/* Highlighted-alue */

#highlighted {
    background-color: rgba(50, 15, 0, 0.7);
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: 1px solid rgba(80,80,80,0.5);
}

/* Sivun otsikko ja muokkausnappi */

#center h1 {
    font-size: 30px;
    font-weight: bold;
}


#tabs-wrapper {
    padding: 0px 30px;
    margin: 20px 0px;
    border: none;
}

ul.tabs {
    float: right;
}


ul.tabs li {
    display: inline-block;
    list-style-type: none;
    list-style-image: none;
    background-color: rgba(0,0,0,0.1);
    padding: 0;
    margin: 0px 0px 0px 10px;
    border: 1px solid rgba(0,0,0,0.15);
}

ul.tabs li a, ul.tabs li.active a.active, ul.tabs li a:hover {
    margin: 0;
    top: 0;
}

ul.tabs li.active {
}


/* Sivun sisältö */

#block-system-main {
    padding: 0px 30px 0px 30px;
    margin-bottom: 30px;
}

#cke_1_contents {
    height: 100px !important; 
}

div#comments {
    margin-top: 50px;
}

#comments h2.title {
    border-top: 1px solid rgba(0,0,0,0.15);
}

#block-system-main .node .content {
    font-size: 13px;
    line-height: 21px;
}

#block-system-main .node .content h2 {
    padding: 10px 0px;
}

#block-system-main .node .content h3 {
    padding: 10px 0px;
}

#block-system-main .node .content h4 {
    padding: 10px 0px;
}

#block-system-main .node .content blockquote {
    padding: 0px 10px;
    margin: 10px 20px;
    border-width: 1px 1px 1px 1px;
    border-style: dotted;
    border-color: rgba(0,0,0,0.2);
    background-color: rgba(255,255,255,0.5);
    color: #555;
}


div.comment {
    border: 1px solid rgba(0,0,0,0.15);
    background-color: rgba(255,245,200,0.35);
    margin: 10px 0px;
    padding: 10px 10px 30px 10px;
}

div.comment ul.links {
    float: right;
    margin: 0px;
    text-align: right;
}

div.comment ul.links li {
    padding: 5px 10px 5px 10px;
    margin: 0px 0px 0px 5px;
    background-color: rgba(0,0,0,0.1);
    border: 1px solid rgba(0,0,0,0.15);
}


/* Osaston juurisivun jutut */

#block-views-sivut-block {
    padding: 0px 30px;
}

ul.primary li.active a, ul.primary li.active a:link {
    background-image: none;
    background-color: rgba(0,0,0,0.1);
}

ul.primary li.active a, ul.primary li a:hover {
    background-image: none;
    background-color: rgba(0,0,0,0.1);
}

.block-views {
    margin: 20px 0px;
    padding: 0;
}

.node {
    border-bottom: none;
}

.node-teaser {
    margin: 10px 0;
    padding: 0;
}

.node-sticky {
    padding: 5px 0px;
    background-color: transparent;
    border: none;
    margin-bottom: 0;
}

.item-list ul {
    list-style-type: none;
    padding: 0;
}

.view-sivut .item-list ul li {
    margin: 0px;
    padding: 0px;
    margin-bottom: 20px;
    padding-top: 10px;
}

.view-sivut .item-list ul li:last-child {
    border-bottom: none;
}

.view-sivut .views-row.views-row-odd {
    margin-right: -10px;
    margin-left: -10px;
    padding-right: 10px;
    padding-left: 10px;
    background-color: rgba(0,0,0,0.05);
    padding-bottom: 5px;
}




.field-name-field-osaston-logo {
    float: left;
    padding-right: 30px;
}

p.copyright {
    text-align: right;
    font-size: 9px;
    color: rgba(0,0,0,0.3);
    padding: 0px 10px 0px 0px;
    margin: 0;

}



/* ************ ETUSIVUN ERIKOISUUDET ********* */

.view-etusivu2 table {
    border-collapse: separate;
    border-spacing: 5px;
    width: 100%;
}

.view-etusivu2 li.views-fluid-grid-item {
    vertical-align: top;
    text-align: center;
    margin: 5px;
    border: 1px solid rgba(0,0,0,0.15);
    background-color: rgba(255,255,255,0.2);     
    width: 210px;
    height: 150px;
    padding: 20px;

}

.view-etusivu2 li.views-fluid-grid-item a {
    display: block;
    font-weight: 900;
    text-shadow: 1px 1px rgba(0,0,0,0.3);
    font-size: 24px;
    font-family: Roboto Condensed;
}


.view-etusivu2 li .node {
    text-align: center;
    border: 1px solid rgba(0,0,0,0.15);
    background-color: rgba(255,255,255,0.2);     
    width: 200px;
    height: 150px;
    margin: auto;
}



.view-etusivu2 .links {
    display: none;
}

.view-etusivu2 .views-row {
    margin-bottom: 20px;
    padding-top: 10px;
}

.view-etusivu2 .views-row.views-row-odd {
    margin-right: -10px;
    margin-left: -10px;
    padding-right: 10px;
    padding-left: 10px;
    background-color: rgba(0,0,0,0.05);
    padding-bottom: 5px;
}

.view-etusivu2 .views-row.sticky {
    margin-right: -10px;
    margin-left: -10px;
    padding-right: 10px;
    padding-left: 10px;

    border: 1px solid rgba(0,0,0,0.15);
    background-color: rgba(255,255,30,0.1);

}


/* ************ FOORUMI ********* */

body.page-phpbbforum #wrapper #container #center #squeeze {
    background: none;
    border: none;
}


body.page-phpbbforum #wrapper #container .breadcrumb,
body.page-phpbbforum #wrapper #container .breadcrumb a,
body.page-phpbbforum #tabs-wrapper,
body.page-phpbbforum #tabs-wrapper h1,
body.page-phpbbforum .element-invisible,
body.page-phpbbforum a#main-content  {
    visibility: hidden;
    height: 0;
    padding: 0;
    margin: 0;
    width: 0;
    border: none;
}



body.page-phpbbforum #block-system-main {
    padding: 0;
}

body.page-phpbbforum #block-system-main .content {
    padding: 0;
    margin: 0;
    position: absolute;
    top: 0px;
    width: 100%;
}

#phpbbforum-page .breadcrumb-table {
    border: none;
    margin-top: 0px !important;

}

div#phpbbforum-page {
    position: absolute;
    top: 0px;
    width: 100%;
    background-color: rgba(240, 240, 240, 0.83);
    border: 1px solid rgba(80,80,80,0.5);
    margin-bottom: 50px;

}


#phpbbforum-page .breadcrumb-table .row1 {
    background-color: transparent;
    border-bottom: 1px solid #ccc;
    padding: 0px 0px 5px 0px;
}



/* ************** RESPONSIIVISUUS (mobiili/kapea layout) **************** */


@media (max-width: 1000px) {
    #wrapper {
        padding-left: 5px;
        padding-right: 5px;
    }


    ul, ul li.leaf {
        display: inline-block;
    }

    ul, ul.menu, dir {
        display: inline-block;
        margin: 0;
        line-height: 14px;
    }

    #wrapper #container .sidebar {
        margin: 0 auto 0 auto;
        width: 100%;
        clear: both;
    }

    .sidebar .block h2 {
        display: none;
    }


    #wrapper #container .sidebar .block {
        padding: 0px 5px;
        margin: 5px 0;
    }

    #wrapper #container #center #squeeze { 
        margin-left: 0;
        margin-right: 0;
        width: auto;
        margin-bottom: 30px;

    }

    #wrapper #container #center {
        margin-left: auto;
        margin-right: auto;
        width: 100%;
        clear: both;
    }


}