~firefoxphpworknotescss
3 itemsDownload ./*

..
calc.css
clock.css
style.css


cssclock.css
6 KB• 3•  1 day ago•  DownloadRawClose
1 day ago•  3

{}
/* clock and cal */

.boxcal { display: inline-block; /*position: absolute; top: 0; left: 0; min-width: 200px;*/ user-select: none; }
.calendar {  /*border: 1px solid #f0f;*/ }
.calendar * { font-size: 10pt; font-weight: normal; font-family: Helvetica, Geneva, Arial, sans-serif;
 /*border: 1px solid #0f0;*/ box-sizing: border-box; }
/*.calendar a:link, .calendar a:visited { golor: #000066; text-decoration: none; border: 2px solid #
000066; border-radius: 64px; width: 16px; height: 16px; }*/
/*.calendar a:link::before { content: ''; display: inline-block; position: absolute; top: 0px; left:
 0px; width: 32px; height: 32px; border: 1px solid #000; border-radius: 64px; margin-left: -1px; mar
gin-top: -1px; /*z-index: -1;*/
.calendar a:hover, .calendar a:active { color: /*#ff7bbc*/ #000099; }
.calendar .tbl { display: table; table-layout: fixed; }
.calendar .tr { display: table-row; }
.calendar .td { display: table-cell; vertical-align: top; /*border: 1px solid #606163; box-shadow: i
nset 0 0 2px 2px #000;*/ }
.calendar .sidebar { width: 100%; min-width: 100px; }
.calendar .wide { width: 100%; }
/*.calendar .wide .td .cal_lnk { display: inline-block; }*/
/*.calendar .pad .cal_lnk { padding: 0 8px; }*/
/*.calendar .td a:link { width: 100% !important; padding: 8px 0 !important; }*/
.calendar .cal_lnk { position: relative; padding: 4px 0; display: inline-block; cursor: pointer; color: #000066; text-decoration: none; border: 2px solid #000066; border-radius: 64px; width: 100%; height: 100%; max-width: 100%; }
/*.calendar .markselected { color: #F00 !important; }*/.calendar .marktoday { background: #006; border-radius: 64px; color: #FCBF62 !important; border-color: #FCBF62 !important; }
.calendar .markselected { border: 2px solid #f00 !important; /*color: #F0F !important #FCBF62 !important;*/ }
.calendar .nbtn { /*background: transparent;*/background: rgba(255,255,255,.5); /*color: #a28d8a;*/c
olor: #000099; font-weight: bold; cursor: pointer; border: 0; }
.calendar .nbtn:hover { color: /*#ff7bbc*/ #FCBF62; }
.calendar .nbtn.nleft { border-top-right-radius: 10px; border-bottom-right-radius: 10px; }
.calendar .nbtn.nright { border-top-left-radius: 10px; border-bottom-left-radius: 10px; }
.calendar .nbtn.dummy { visibility: hidden; cursor: default; }

#cwlong_wrap {
    width: 180px; height: 180px;
    position: absolute; top: 50%; left: 50%;
    margin-left: -93px; margin-top: -90px;
    display: inline-block;
    transform: rotateZ(0deg);
    /*transition: transform .5s ease;*/
    /*outline: 1px solid #f00;*/
    z-index: 110;
}
#cwlong {
    width: 10px; height: 90px; background: #000; opacity: .76;
    border: 1px solid #fc0;
    box-shadow: 0 0 3px #000;
    border-radius: 10px;
    display: inline-block;
    position: absolute;top: 0; left: 50%;
    margin-left: -5px; margin-top: 0px;
}

#cwshort_wrap {
    width: 180px; height: 180px;
    position: absolute; top: 50%; left: 50%;
    margin-left: -93px; margin-top: -90px;
    display: inline-block;
    transform: rotateZ(0deg);
    /*transition: transform .5s ease;*/
    /*outline: 1px solid #00f;*/
    z-index: 109;
}
#cwshort {
    width: 12px; height: 55px; background: #000; opacity: .76;
    border: 1px solid #f0a;
    box-shadow: 0 0 3px #000;
    border-radius: 10px;
    display: inline-block;
    position: absolute; top: 40px; left: 50%;
    margin-left: -7px; margin-top: -4px;
}

#cwsec_wrap {
    width: 180px; height: 180px;
    position: absolute; top: 50%; left: 50%;
    margin-left: -93px; margin-top: -90px;
    display: inline-block;
    transform: rotateZ(45deg);
    /*transition: transform .5s ease;*/
    /*outline: 1px solid #0f0;*/
    z-index: 111;
}
#cwsec {
    width: 5px; height: 100px; background: #0cc; opacity: 0.59;
    box-shadow: 0 0 3px #000;
    border-radius: 10px;
    display: inline-block;
    position: absolute; top: -5px; left: 50%;
    margin-left: -3px; margin-top: -4px;
}

#cwknob {
    display: inline-block;
    background: url('../img/heart.png') no-repeat center center transparent;
    width: 32px; height: 32px;
    position: absolute; top: 50%; left: 50%;
    margin-left: -20px; margin-top: -16px; /*opacity: .59;*/
    transform: rotateZ(0deg);
    z-index: 112;
}
#tdesc {
    width: 180px; text-align: center;
    position: absolute; /*top: 50%; left: 50%;*/
    margin-left: -96px; margin-top: -24px;
    display: inline-block;
    z-index: 108;
}
#tdescb {
    width: 180px; text-align: center;
    position: absolute; /*top: 50%; left: 50%;*/
    margin-left: -96px; margin-top: 24px;
    display: inline-block;
    z-index: 108;
}

#cal_photo {
    width: 100%;
    /*height: calc( 200px / 1.777 );*/
    height: 200px;
    cursor: pointer;
    border-top-right-radius: 8px;
    border-top-left-radius: 8px;
    display: none;
}

.calendar .clock {
    display: inline-block;
/*outline: 1px solid #f00;*/
    width: 100%; height: 250px;
    overflow: hidden;
    position: relative;
}

.calendar .citem {
    /*width: 10px; height: 10px; font-size: 10px;*/
    position: absolute; /*transition: .2s ease; glitch effect*/
    padding: 4px 0; display: inline-block; cursor: default; color: #000066; text-decoration: none; border: 2px solid #000066; border-radius: 64px; width: 16px; height: 16px;
    text-align: center;
}

.cumday {
    position: absolute; top: -3px; left: 0;
    z-index: 10; pointer-events: none;
    background: url('/img/cumday201.png') no-repeat center center transparent;
    width: 40px; height: 32px;
}

/*::-webkit-scrollbar { width: 8px; height: 8px; background: transparent; cursor: pointer; }
::-webkit-scrollbar-track {  border-radius: 2px; }
::-webkit-scrollbar-thumb { background: #ff7bbc;  border-radius: 2px; }
::-webkit-scrollbar-thumb:hover { background: #FCBF62; }
::-webkit-scrollbar-corner { background: transparent; }*/

Top
©twily.info 2013 - 2025
twily at twily dot info



2 530 898 visits
... ^ v