Keskustelu: Nettisivujen teko: Stylish-leikittelyä

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("www.ohjelmointiputka.net") {

/* nollataan otsikoiden Putka-asetuksia */
#sisalto h1,#sisalto h2,#sisalto h3,#sisalto h4,#sisalto h5,#sisalto h6 {
    background: inherit !important;
    border: 0 !important;
    font: 100%/125% 'Segoe UI','Trebuchet MS','Helvetica','Arial',sans-serif !important;
    letter-spacing: 0.125em !important;
}

/* linkkien alleviivaus häiritsee (minua) */
a:link,a:visited,a:active {
    text-decoration: none !important;
}

a:focus,a:hover {
    text-decoration: underline !important;
}

/* lomakkeet */
form dl {
    line-height: 150%;
}

form dt {
    clear: left !important;
    float: left !important;
    margin: 0 !important;
    padding: 5px 0 !important;
    width: 12em !important;
}

form dd {
    margin: 0 0 0 12em !important;
    padding: 5px 0 !important;
}

/* ensimmäinen oppaan sisällön kuvaava kappale */
#sisalto .opas > p:first-child,#sisalto .opas > ul.linkkilista + p {
    background: #CAD9E2;
    border: 1px solid #4080A3;
    border-radius: 19px;
    margin: 9px;
    padding: 15px !important;
}

/* lisää sisennystä oppaiden kappaleille */
#sisalto .opas > p {
    padding: 0 15px !important;
}

/* oppaiden sisällysluettelo */
#sisalto .sisallysluettelo {
    background: #FFD !important;
    border: 1px solid #A72 !important;
    border-radius: 15px;
    box-shadow: none !important;
    float: none !important;
    position: absolute !important;
    right: 25px !important;
}

/* tehdään tästä hienompi */
#sisalto .sisallysluettelo li {
    height: 0;
    -moz-transition: all 1s ease-in-out 0s;
    opacity: 0;
}

/* näytetään valittuna oleva artikkeli oletuksena */
#sisalto .sisallysluettelo li.valittu {
    height: 15px;
    opacity: 1;
}

/* ja sitten nopea listan avausanimaatio */
#sisalto .sisallysluettelo:hover li {
    height: 15px;
    margin: 4px 0 !important;
    -moz-transform: scale(1);
    -moz-transition: all .2s ease-in-out 0s;
    opacity: 1;
}

/* käyttäjien viestien kirjoittajat ja pvm */
#sisalto h3.h-linkit {
    font-size: 115% !important;
}

/* käyttäjien viestien lainauslinkki */
#sisalto h3 + p.h-linkit {
    background: inherit !important;
    background-image: -moz-linear-gradient(#EEE, #EFF4FA 15%, #FAFCFE 60%, #FFF) !important;
    border: 0 !important;
    border-top: 3px solid #DDD !important;
    font-size: inherit !important;
}

#sisalto .opas + .no-print,#sisalto .no-print + .no-print {
    margin-top: 35px !important;
}

#sisalto h1 {
    font-size: 200% !important;
}

#sisalto ul + h2 {
    margin-top: 35px !important;
}

#sisalto h2 {
    background-image: -moz-linear-gradient(#DEE, #F0F4F9 15%, #F7F9FC 35%, #FFF) !important;
    border-top: 2px solid #3B5E6E !important;
    border-radius: 19px 19px 0 0;
    box-shadow: 0 -4px 4px rgba(0,0,0,.075);
    color: #3B5E6E;
    font-size: 175% !important;
    margin: 5px 0 15px 0 !important;
    padding: 5px 0 0 9px !important;
}

#sisalto h3 {
    border-left: 3px solid #4080A3 !important;
    border-radius: 0 0 0 15px;
    color: #4080A3;
    font-size: 150% !important;
    line-height: 150% !important;
    padding-left: 15px !important;
}

#sisalto h4 {
    color: #4080A3;
    font-size: 135% !important;
}

#sisalto h5 {
    color: #4080A3;
    font-size: 125% !important;
}

#sisalto h6 {
    color: #4080A3;
    font-size: 110% !important;
}

}