﻿/* NETTIPAIVAKIRJAN CCS - np_merkintasivu.css
*
* div lootien taustakuvat ja systeemit */



/* Parittomat kappaleet (1, 3, 5...) */
div.maksalaatikko p:nth-child(odd) {
    color: #dde3ff;
}

/* Parilliset kappaleet (2, 4, 6...) */
div.maksalaatikko p:nth-child(even) {
    color: #e8ffe5;
}


/* Parittomat kappaleet (1, 3, 5...) */
div.lanttulaatikko p:nth-child(odd) {
    color: #ffd9e0;
}

/* Parilliset kappaleet (2, 4, 6...) */
div.lanttulaatikko p:nth-child(even) {
    color: #FFF;
}


/* Parittomat kappaleet (1, 3, 5...) */
div.perunalaatikko p:nth-child(odd) {
    color: #e8ffe5;
}

/* Parilliset kappaleet (2, 4, 6...) */
div.perunalaatikko p:nth-child(even) {
    color: #FFF;
}

.yollinen {
    background-color: #000000;
    padding: 20px;
    margin: 15px 0;
    border-radius: 5px;
    line-height: 1.6;
    border-left: 5px solid #151634;
    box-shadow: inset 0 0 10px #000000;
}


.kelikam {
    background-color: #000000;
    background-image: url('taus-redplate9459_mirror.jpg');
    background-repeat: repeat;
    background-size: auto;
    color: #ffffff;
    padding: 20px;
    margin: 15px 0;
    border-radius: 5px;
    line-height: 1.6;
    border-left: 4px solid #37413a;
    box-shadow: inset 0 0 19px #413a03;
}

.tilanne {
    background-color: #000000;
    background-image: url('nptausta_marras062.jpg');
    background-repeat: repeat;
    background-size: auto;
    color: #ffffff;
    padding: 20px;
    margin: 15px 0;
    line-height: 1.6;

    border: 2px solid #6c001d;
    border-radius: 15px;
       box-shadow: inset 0 0 59px #4b010e;

}

.tilanne1 {
        background-color: #000000;
        background-image: url('nptausta_loka12.jpg');
        background-repeat: repeat;
        background-size: auto;
        color: #ffffff;
        padding: 20px;
        margin: 15px 0;
        line-height: 1.6;

        border: 3px solid #0e4d03;
        border-radius: 15px;


        border-left: 4px solid #0c3912;
        box-shadow: inset 0 0 59px #062800;



}

.tilanne2 {
    background-color: #000000;
    background-image: url('nptausta_heina07.jpg');
    background-repeat: repeat;
    background-size: auto;
    color: #ffffff;
    padding: 20px;
    margin: 15px 0;
    line-height: 1.6;
    border: 2px solid #14546f;
    border-radius: 15px;
   box-shadow: inset 0 0 99px #260229;

}



.tilanne3 {
    background-color: #000000;
    background-image: url('taus19941_mirror2.jpg');
    background-repeat: repeat;
    background-size: auto;
    color: #ffffff;
    padding: 20px;
    margin: 15px 0;
    line-height: 1.6;
    border: 3px solid #808009;
    border-radius: 15px;
    box-shadow: inset 0 0 99px #29020e;

}



.tilanne4 {
    background-color: #000000;
    background-image: url('nptausta_marras07.jpg');
    background-repeat: repeat;
    background-size: auto;
    color: #ffffff;
    padding: 20px;
    margin: 15px 0;
    line-height: 1.6;

    border: 2px solid #00cb24;
    border-radius: 15px;
    box-shadow: inset 0 0 99px #0c2c00;

}


.tilanne5 {
    background-color: #000000;
    background-image: url('nptausta_maalis08.jpg');
    background-repeat: repeat;
    background-size: auto;
    color: #ffffff;
    padding: 20px;
    margin: 15px 0;
    line-height: 1.7;

    border: 2px solid #61006d;
    border-radius: 15px;
    box-shadow: inset 0 0 49px #580060;

}


.tilanne6 {
    background-color: #000000;
    background-image: url('tausta2026-ble.jpg');
    background-repeat: repeat;
    background-size: auto;

    padding: 20px;
    margin: 15px 0;
    line-height: 1.6;
    border: 3px solid #24025d;
    border-radius: 15px;

    border-left: 4px solid #000d6e;
    box-shadow: inset 0 0 99px #260000;
}


.tilanne7 {
    background-color: #000000;
    background-image: url('BGsalama.jpg');
    background-repeat: repeat;
    background-size: auto;

    padding: 20px;
    margin: 15px 0;
    line-height: 1.6;
    border: 3px solid #003c08;
    border-radius: 15px;

    border-left: 4px solid #0c3912;
    box-shadow: inset 0 0 99px #001068;
}




.tila1 {

    background-image: url('TauOIss20.jpeg');
    background-repeat: repeat;

    background-size: auto;
    background-position: top left;


    padding: 12px;
    border-radius: 8px;
    min-height: 3px;

    align-items: center;
    justify-content: center;

}

.tila2 {

    background-image: url('longtaus3.jpeg');
    background-repeat: repeat;
    background-size: auto;
    background-position: top left;
    padding: 10px 10px;
    border-radius: 8px;
    min-height: 5px;

    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    box-shadow:
    inset 00 00 88px #0f0000,
    0px 15px 40px 0px rgba(0, 0, 0, 0.7);


}

.tila3 {

    background-color: #131704;

    background-image:

    linear-gradient(rgba(155,155,255,0.05) 2px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,155,0.05) 1px, transparent 2px),

    linear-gradient(180deg, #000350 10%, #000000 90%);

    background-size: 15px 20px, 10px 20px, 100% 100%;

    padding: 40px;
    border: 2px solid #444444;
}

.tila32 {

    background-color: #131704;

    background-image:

    linear-gradient(rgba(155,155,255,0.05) 2px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,155,0.05) 1px, transparent 2px),

    linear-gradient(180deg, #000000 0%, #000a25 98%, #000000 20%);

    background-size: 15px 20px, 10px 20px, 100% 100%;

    padding: 40px;
    border: 2px solid #444444;
}


.tliuku {

    background-image: linear-gradient(to bottom, #00000000 0%,  #320000ff 100%);
    background-size: 100% 100%;
    padding: 40px;
    border: 2px solid #00540f;
}


.tilapiru {

    background-color: #00071a;

    background-image:

    linear-gradient(rgba(255,255,255,0.05) 2px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.05) 1px, transparent 1px),

    linear-gradient(180deg, #000000 0%, #310000 100%);

    background-size: 15px 20px, 15px 20px, 100% 100%;

    padding: 40px;
    border: 2px solid #2e1500;


}



.tilapiru2 {

    background-color: #00071a;

    background-image:

    linear-gradient(rgba(255,255,255,0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,155,255,0.05) 1px, transparent 1px),

    linear-gradient(180deg, #310000 0%, #000000 100%);

    background-size: 15px 25px, 10px 20px, 50% 100%;

    padding: 20px;
    border: 3px solid #2e1500;

}


    .tila4 {
        background-color: #000000;
        background-image: url('taccsOIG.jpeg');
        background-repeat: repeat;
        background-size: auto;

        padding: 20px;
        margin: 15px 0;
        border-radius: 6px;
        line-height: 1.2;
        border-left: 4px solid #5c5a03;
        box-shadow: inset 0 0 39px #035c04;
    }

    .tila5 {
        background-color: #000000;
        background-image: url('rinng45.jpg');
        background-repeat: repeat;
        background-size: auto;

        padding: 20px;
        margin: 15px 0;
        border-radius: 6px;
        line-height: 1.2;
        border-left: 4px solid #00393d;
        box-shadow: inset 0 0 99px #000245;
    }

}


#backToTop {
position: fixed;
bottom: 20px;
right: 5px;
z-index: 99;
display: none;
cursor: pointer;
border: none;
outline: none;
}

#topBtnImg {
width: 40px;
height: auto;
opacity: 0.3;
transition: 0.3s;
}


#topBtnImg:hover {
opacity: 1.0;
}
