הבדלים בין גרסאות בדף "מדיה ויקי:Vector.css"
קפיצה לניווט
קפיצה לחיפוש
שורה 1,480: | שורה 1,480: | ||
} | } | ||
} | } | ||
− |
גרסה מ־12:04, 6 במרץ 2020
/* הסגנונות הנכתבים כאן ישפיעו על העיצוב Vector בלבד */
/* סכמה */
#scheme {
width: 100%;
direction: rtl;
position: relative;
display: block;
height: 400px;
}
#scheme-left {
float:left;
background: transparent;
width: 45%;
display:block;
position: relative;
min-width: 242px;
}
#scheme-header h2 {
text-align: center;
font-size: 4em;
color: gray;
text-shadow: black 3px 3px 3px;
}
.giluy {
display: block;
background-color: rgba(59, 164, 204, 0.95);
color: #fff;
position: relative;
padding:0.5em;
margin:1em 1em 2em 1em;;
border-radius:1em 4em;
min-height: 180px;
opacity:1 ;
}
.giluy h3{
/*text-align: center;
font-size: 3em;
padding: 0;
margin: 0;*/
opacity: 0;}
.giluy p{
text-align: justify;
padding: 0;
font-size: 1.5em;
margin: 1em;
opacity: 0;
display: none;}
.come-in {
-webkit-transform: translateX(-700px);
-moz-transform: translateX(-700px);
-o-transform: translateX(-700px);
transform: translateX(-700px);
-webkit-animation: come-in 2s ease forwards;
animation: come-in 2s ease forwards;
opacity:1 !important;
transition: all 2s ease;
}
.come-in:nth-child {
animation-duration: 3s;
/* So they look staggered */
}
@keyframes come-in {
to {
transform: translateX(0);
}
}
@-webkit-keyframes come-in {
to {
-webkit-transform: translateX(0);
}
}
.come-in2 {
-webkit-transform: translateX(700px);
-moz-transform: translateX(700px);
-o-transform: translateX(700px);
transform: translateX(700px);
opacity:1 !important;
animation: come-in 2s ease forwards;
-webkit-animation: come-in 2s ease forwards;
-moz-animation: come-in 2s ease forwards;
-o-animation: come-in 2s ease forwards;
transition: all 2s ease;
}
.come-in2:nth-child {
animation-duration: 3s;
/* So they look staggered */
}
@keyframes come-in2 {
to {
transform: translateX(0);
}
}
.intertext {
position:absolute;
display: block;
color: #fff;
padding:0.5em;
margin:2em 2em 5em 2em;
border-radius:1em 4em;
z-index: 9999;
width: 85%;
opacity: 1;}
.firstext {
margin-top: 2em;
}
.giluy h3, .intertext h3{
text-align: center;
font-size: 3em;
color: #fff;
line-height: 1.1em;
padding: 0;
margin: 0;}
.intertext p{
text-align: center;
padding: 0;
font-size: 1.5em;
margin: 1em 2em;}
.num {
background: #fff;
color: rgba(59, 164, 204, 0.95);
border-radius: 4em;
padding: 0.3em;
position: absolute;
margin: 0.5em;
top: 0em;
font-weight: bold;
font-size: 2em;
width: 1em;
height: 1em;
line-height: 1em;
text-align: center;
opacity:1 !important;}
/*טקסט רץ*/
.marquee a {
color: #fff;
text-decoration: none;
transition: all 0.5s ease;
}
/*.marquee a:hover {
font-size: 110%;
transition: all 0.3s ease;
}*/
.mwrapper {
width: 100%px;
margin: 0;
direction: rtl;}
.marquee {
width: 100%;
height: 10em;
margin: 0;
line-height: normal;
overflow: hidden;
position: absolute;
}
.marquee h2 {
position: absolute;
width: 100%;
height: 100%;
margin: 0;
text-align: center;
color: #fff;
text-shadow: 4px 3px 6px #000000;
/*filter: dropshadow(color=#000000, offx=1, offy=1*/
font-size: 3em;
font-weight: bold;
transform: translateX(100%);
-moz-transform: translateX(100%);
-webkit-transform: translateX(100%);
}
.marquee h2:nth-child(1) {
animation: left-one 25s ease infinite;
-moz-animation: left-one 25s ease infinite;
-webkit-animation: left-one 25s ease infinite;
}
.marquee h2:nth-child(2) {
animation: left-two 25s ease infinite;
-moz-animation: left-two 25s ease infinite;
-webkit-animation: left-two 25s ease infinite;
}
.marquee h2:nth-child(3) {
animation: left-three 25s ease infinite;
-moz-animation: left-three 25s ease infinite;
-webkit-animation: left-three 25s ease infinite;
}
.marquee h2:nth-child(4) {
animation: left-four 25s ease infinite;
-moz-animation: left-four 25s ease infinite;
-webkit-animation: left-four 25s ease infinite;
}
/*================================
Move the Marquee to the Left
==================================*/
/** Mozilla Firefox Keyframes **/
/*@-moz-keyframes left-one {
0% {
-moz-transform:translateX(100%);
}
10% {
-moz-transform:translateX(0);
}
40% {
-moz-transform:translateX(0);
}
50% {
-moz-transform:translateX(-100%);
}
100%{
-moz-transform:translateX(-100%);
}
}
@-moz-keyframes left-two {
0% {
-moz-transform:translateX(100%);
}
50% {
-moz-transform:translateX(100%);
}
60% {
-moz-transform:translateX(0);
}
90% {
-moz-transform:translateX(0);
}
100%{
-moz-transform:translateX(-100%);
}
}*/
/** Webkit Keyframes **/
@-webkit-keyframes left-one {
0% {
-webkit-transform:translateX(-100%);
}
2% {
-webkit-transform:translateX(0);
}
17% {
-webkit-transform:translateX(0);
}
21% {
-webkit-transform:translateX(100%);
}
100%{
-webkit-transform:translateX(100%);
}
}
@-webkit-keyframes left-two {
0% {
-webkit-transform:translateX(-100%);
}
26% {
-webkit-transform:translateX(-100%);
}
31% {
-webkit-transform:translateX(0);
}
46% {
-webkit-transform:translateX(0);
}
50%{
-webkit-transform:translateX(100%);
}
}
@-webkit-keyframes left-three {
0% {
-webkit-transform:translateX(-100%);
}
46% {
-webkit-transform:translateX(-100%);
}
51% {
-webkit-transform:translateX(0);
}
68% {
-webkit-transform:translateX(0);
}
73% {
-webkit-transform:translateX(100%);
}
100%{
-webkit-transform:translateX(100%);
}
}
@-webkit-keyframes left-four {
0% {
-webkit-transform:translateX(-100%);
}
73% {
-webkit-transform:translateX(-100%);
}
78% {
-webkit-transform:translateX(0);
}
96% {
-webkit-transform:translateX(0);
}
100%{
-webkit-transform:translateX(100%);
}
}
/* פייסבוק */
body.plugin {
width: 402px;}
div#content {
max-width: 720px;
margin: auto;
position: relative;
border: none;
border-left: none;
}
#right-navigation {
margin-top: 2.6em;
}
#left-navigation {
/*margin-right: 13.9em;*/
margin-top: 2.6em;
}
/*.slideshow {
top:0%;
height:150px;
float:left;
width:100%;
}
#flexiqo {
background: rgba(20, 20, 20, 0.2);
padding: 1em 0 0 3em;
margin-left: -3em;
border-radius: 1em;
box-shadow: 2px 2px 2px black;
transition: ALL 1000MS;
background: rgba(20, 20, 20, 0.2);
}*/
/*.ui-dialog,
.ui-widget-overlay {
z-index:9999 !important;}*/
div#footer #footer-icons li {
margin-left: 16.5em;}
div#mw-panel {
width: 12%;
margin-left: 1em;}
#right-navigation {
margin-top: -99em;
}
#left-navigation
{
display: none;
}
div#mw-head {
position: absolute;
top: 0;
left: inherit;
width: 77%;}
table.TUCOL > tbody > tr > td > div.thumb.tleft {
margin: .5em 1.4em 1.3em 0 !important;}
/* עמוד ראשי */
#icon, #icon2 {height: 52px;}
#icon2 {
background: url('/wiki/upload/doalogue/reyv.png') no-repeat 50% / 53px;
}
#tabpic1 {
background-image: url(/images/fog.jpg);
-moz-border-radius: 15px;
border-radius: 15px;
position: relative;
padding: 2em 2em 3em 3em;
background-size: cover;
vertical-align: top;
height: 250px;
margin: 1em;
-webkit-border-radius: 15px;
}
#tabpic2 {
background-image: url(images/bsmi.jpg);
border-radius: 15px;
padding: 1EM 0EM 3EM 2EM;
background-size: cover;
vertical-align: top;
height: 260px;
-webkit-border-radius: 15px;
background-size: cover;
}
/*#boxes1:after, .arrow_box:before {
right: 100%;
top: 50%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
}
#boxes1:after {
border-color: rgba(136, 183, 213, 0);
border-right-color: #88b7d5;
border-width: 30px;
margin-top: -30px;
}
#boxes1:before {
border-color: rgba(194, 225, 245, 0);
border-right-color: #c2e1f5;
border-width: 36px;
margin-top: -36px;
border-color: rgba(194,225,245,0);
border-right-color: #c2e1f5;
border-width: 36px;
margin-top: -36px;
content: "\25c0";
color: #fff;
position: absolute;
margin: 50% 80%;
} */
#boxes1:hover, #boxes2:hover, #boxes3:hover, #boxes4:hover {
opacity: 1;
}
/* דף ציטוט באמצע */
#boxes1:hover + #boxes11, #boxes11:hover {
opacity: 1;}
#boxes2:hover + #boxes22, #boxes22:hover {
opacity: 1;}
#boxes3:hover + #boxes33, #boxes33:hover {
opacity: 1;}
#boxes4:hover + #boxes44, #boxes44:hover {
opacity: 1;}
#mf-icon img, #icon img, #icon2 img {
border: none;
margin-top: -3px;
padding-top: 0px;
/* padding-bottom: 20px; */
/* padding-left: 41%; */
float: none;
clear: none;
text-align: center;
vertical-align: middle;
display: inline-block;
height: 52px;
width: auto;
}
/* סידור התיבות במקומן */
#boxes11 {
padding: 1em;
padding-bottom: 0.8em;
}
#boxes22 {
margin: -10em 19em -30em -28em;
padding: 0 1.5em 0.7em;
}
#boxes33 {
padding: 0 0.5em 3em;
margin-top: -24em;
}
#boxes44 {
margin: -9.5em -27.5em 0em 20em;
padding: 0em 1em 1em 1em;
}
#centerquote {
direction: ltr;
display: block;
margin-top: 15em;
margin-left: 2em;
margin-left: 26px;
-webkit-box-shadow: 0px 0px 40px 40px rgba(255, 255, 255, 0.8);
box-shadow: 1px 1px 80px 80px rgba(0, 0, 0, 0.8);
-webkit-border-radius: 90px;
border-radius: 140px;
background: rgba(255, 255, 255, 0.8);
text-shadow: 2px 2px 10px rgba(0, 0, 0, 1);
color: white;
padding: 1.4em;
background: -moz-radial-gradient(center, ellipse cover, rgba(255,255,255,0.89) 44%, rgba(255,255,255,0.11) 93%, rgba(255,255,255,0) 100%);
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(44%,rgba(255,255,255,0.89)), color-stop(93%,rgba(255,255,255,0.11)), color-stop(100%,rgba(255,255,255,0)));
background: -webkit-radial-gradient(center, ellipse cover, rgba(255,255,255,0.89) 44%,rgba(255,255,255,0.11) 93%,rgba(255,255,255,0) 100%);
background: -o-radial-gradient(center, ellipse cover, rgba(255,255,255,0.89) 44%,rgba(255,255,255,0.11) 93%,rgba(255,255,255,0) 100%);
background: -ms-radial-gradient(center, ellipse cover, rgba(255,255,255,0.89) 44%,rgba(255,255,255,0.11) 93%,rgba(255,255,255,0) 100%);
background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.44) 44%,rgba(131, 131, 131, 0.3) 93%,rgba(255, 255, 255, 0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e3ffffff', endColorstr='#00ffffff',GradientType=1 );
}
#centerquote p {
text-align: right;
direction: ltr;
}
#centerquote h3 {
direction: ltr;
font-size: 22px;
line-height: 1em;
text-indent: 2em;
color: rgb(223, 223, 223);
}
#centerquote:before {
content: open-quote;
font-size: 9em;
line-height: 0.8em;
margin-right: 0.25em;
position: absolute;
quotes: "\201C""\201D""\2018""\2019";
font-family: fantasy;
text-shadow: 2px 2px 30px rgba(255, 255, 255, 1);
}
#roundtable {
background-image: -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 114, color-stop(15%, rgb(238, 239, 255)), color-stop(100%, rgba(163, 163, 163, 0.88)));
background-image: -webkit-radial-gradient(center center, farthest-side circle, rgb(238, 239, 255) 15%, rgba(163, 163, 163, 0.88) 100%);
background-image: -moz-radial-gradient(center center, farthest-side circle, rgb(238, 239, 255) 15%, rgba(163, 163, 163, 0.88) 100%);
background-image: -ms-radial-gradient(center center, farthest-side circle, rgb(238, 239, 255) 15%, rgba(163, 163, 163, 0.88) 100%);
background-image: -o-radial-gradient(center center, farthest-side circle, rgb(238, 239, 255) 15%, rgba(163, 163, 163, 0.88) 100%);
background-image: radial-gradient(farthest-side circle at center center, rgb(238, 239, 255) 15%, rgba(163, 163, 163, 0.88) 100%);
position: relative;
display: block;
width: 100%;
background-image: url(http://wiki.doalogue.co.il/bak.jpg);
background-attachment: fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
/*padding: 0em 2em 2em 2em; */
padding-bottom: 3em;
display: block;
margin: 0 auto;
float: left;
height: 700px;
margin-right: 17%;}
#wrappr {
margin: 0 auto 0 auto;
width: 1000px;
display: block;
}
#gcol1 {
padding-bottom: 5EM;
-webkit-transform: none;
-ms-transform: none;
-o-transform: none;
transform: none;
-webkit-transition: all 500ms ease;
-o-transition: all 500ms ease;
transition: all 500ms ease;
width: 33%;
position: relative;
float: right;
}
#boxes1, #boxes2, #boxes3, #boxes4 {
background: rgba(0,0,0,1);
position: relative;
width: 66%;
font-size: 150%;
text-align: center;
opacity: 0.7;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
border-radius: 20px;
color: #fff;
-webkit-transition: all 500ms ease;
-o-transition: all 500ms ease;
transition: all 500ms ease;
padding: 2px 20px 2px 20px;
min-height: 170px;
max-height: 170px;
vertical-align: middle;
text-align: center;
top: 2em;
display: table;
z-index: 2;
margin-right: 12.5%;}
#boxes1 p, #boxes2 p, #boxes2 p, #boxes3 p, #boxes4 p {
font-size: 35px;
line-height: 1.1em;
font-style: normal;
font-weight: 700;
text-align: center;
letter-spacing: 1px;
display: table-cell;
vertical-align: middle;
}
#boxes3 {
margin-top: 10em;
}
#boxes2 {
margin-top: 10em;
}
#boxes11, #boxes22, #boxes33, #boxes44 {
position: absolute;
display: block;
background-color: rgba(41, 60, 139, 0.88);
color: #fff;
-webkit-transition: all 500ms ease;
-o-transition: all 500ms ease;
transition: all 500ms ease;
box-shadow: 3px 3px 6px 1px rgba(20,20,20,0.8);
-webkit-box-shadow: 3px 3px 3px 3px rgba(20,20,20,0.8);
-moz-box-shadow: 3px 3px 6px 6px rgba(20,20,20,0.8);
-ms-box-shadow: 3px 3px 6px 6px rgba(20,20,20,0.8);
-o-box-shadow: 3px 3px 6px 6px rgba(20,20,20,0.8);
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
border-radius: 20px;
opacity: 0;
z-index: 1;
border: solid 5px;
}
#boxes11 a, #boxes22 a, #boxes33 a, #boxes44 a {color: #fff;
font-weight: bold;
}
/* #boxes1:hover ~ #boxes11 {
visibility: visible;
background-color: rgba(59, 164, 204, 0.88);
color: #fff;
}
#boxes1:hover #boxes11 {
visibility: visible;
background-color: rgba(59, 164, 204, 0.88);
color: #fff;
}
#boxes1:hover > #boxes11 {
visibility: visible;
background-color: rgba(59, 164, 204, 0.88);
color: #fff;
} */
#boxes11 p, #boxes22 p, #boxes33 p, #boxes44 p {
color: rgb(54, 54, 54);
font-size: 22px;
line-height: 1.1em;
font-style: normal;
letter-spacing: 1px;
text-align: center;
}
#boxes11 h3, #boxes22 h3, #boxes33 h3, #boxes44 h3 {
color: rgb(54, 54, 54);
font-size: 24px;
line-height: 1em;
font-style: normal;
letter-spacing: 1px;
font-weight: 700;
padding: 1.2em 0.8em 0;
color: #fff;}
#boxes11 li, #boxes22 li, #boxes33 li, #boxes44 li {
list-style-image: none;}
/* הסגנונות הנכתבים כאן ישפיעו על כל העיצובים */
.tagcloud {
width: 98%;
text-align: center;
background-color: #FFF;
border: 1px solid #EEEEEE;
padding: 15px 10px 15px 10px;
}
.tagcloud a {
color: #0052CB;
margin-left: 10px;
margin-right: 10px;
font-weight: bold;
}
/* מסך הבית */
.mw-content-rtl dd, .mw-content-ltr .mw-content-rtl dd {
margin-right: 0.8em;
}
#mf-create-back {
width: 110%;
height: 50px;
position: absolute;
top: -9px;
left: -10px;
opacity: 1;
background: #A7A7A7;
-webkit-box-shadow: 7px 7px 5px rgba(50, 50, 50, 0.75);
-moz-box-shadow: 7px 7px 5px rgba(50, 50, 50, 0.75);
box-shadow: 7px 7px 5px rgba(50, 50, 50, 0.75);
}
#mf-create {
margin: 30px 25%;
padding: 5px;
position: relative;
width: 330px;
z-index: 1;
float: right;
font-size: 110%;
}
#mf-create input{
position: relative;
color:#333;
font-size: 14px
}
#mf-create #bodySearchInput,
#mf-create .searchboxInput {
width: 220px;
background: #FFF;
border:1px solid #B4B4B4;
padding: 4px;
}
.mw-body h2 {
font-size: 1.9em;}
.mw-body h3 {
font-size: 1.6em;
}
.mw-body-content li, .mw-body-content p, .mw-content-rtl {
font-size: 17.5px;
margin-bottom: 8px;
line-height: 1.4;
text-align: justify;
}
.mw-body-content li.gallerycaption {text-align:center;}
.references li {
font-size: 15px;
margin-bottom: 1px;
}
#content table:not(.TUCOL) tbody, #content table:not(.TUCOL) tbody P, #content table:not(.TUCOL) li:not(.TUCOL), #content table:not(.TUCOL) .mw-body-content p, #mw-content-text > table:not(.TUCOL) > tbody > tr > td > p, #content table:not(.TUCOL) tbody b {
text-align:right;
}
table caption {
margin: 1em auto;
}
body,html{
width:100%;
height:100%;
}
table {
width: 100%; /* or use table width="100" */
}
/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before,
.clearfix:after {
content: " ";
display: table;
}
.clearfix:after {
clear: both;
}
.clearfix {
*zoom: 1;
}
#slideshow {
position: relative;
width: 640px;
height: 310px;
padding: 15px;
border: 1px solid #ddd;
margin: 0 auto 2em;
background: #FFF;
background: -webkit-linear-gradient(#FFF, #FFF 20%, #EEE 80%, #DDD);
background: -moz-linear-gradient(#FFF, #FFF 20%, #EEE 80%, #DDD);
background: -ms-linear-gradient(#FFF, #FFF 20%, #EEE 80%, #DDD);
background: -o-linear-gradient(#FFF, #FFF 20%, #EEE 80%, #DDD);
background: linear-gradient(#FFF, #FFF 20%, #EEE 80%, #DDD);
-webkit-border-radius: 2px 2px 2px 2px;
-moz-border-radius: 2px 2px 2px 2px;
border-radius: 2px 2px 2px 2px;
-webkit-box-shadow: 0 0 3px rgba(0,0,0, 0.2);
-moz-box-shadow: 0 0 3px rgba(0,0,0, 0.2);
box-shadow: 0 0 3px rgba(0,0,0, 0.2);
}
/* avanced box-shadow : http://www.creativejuiz.fr/blog/les-tutoriels/ombre-avancees-avec-css3-et-box-shadow */
#slideshow:before,
#slideshow:after {
position: absolute;
display:block;
bottom:16px;
width: 50%;
height: 20px;
content: " ";
background: rgba(0,0,0,0.1);
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
-webkit-box-shadow: 0 0 3px rgba(0,0,0, 0.4), 0 20px 10px rgba(0,0,0, 0.7);
-moz-box-shadow: 0 0 3px rgba(0,0,0, 0.4), 0 20px 10px rgba(0,0,0, 0.7);
box-shadow: 0 0 3px rgba(0,0,0, 0.4), 0 20px 10px rgba(0,0,0, 0.7);
z-index: -10;
}
#slideshow:before {
left:0;
-webkit-transform: rotate(-4deg);
-moz-transform: rotate(-4deg);
-ms-transform: rotate(-4deg);
-o-transform: rotate(-4deg);
}
#slideshow:after {
right:0;
-webkit-transform: rotate(4deg);
-moz-transform: rotate(4deg);
-ms-transform: rotate(4deg);
-o-transform: rotate(4deg);
}
#slideshow .commands {
position: absolute;
top: 45%;
padding: 5px 13px;
border-bottom:0;
font-size: 1.3em;
color: #aaa;
text-decoration:none;
background-color: #eee;
background-image: -webkit-linear-gradient(#fff,#ddd);
background-image: -moz-linear-gradient(#fff,#ddd);
background-image: -ms-linear-gradient(#fff,#ddd);
background-image: -o-linear-gradient(#fff,#ddd);
background-image: linear-gradient(#fff,#ddd);
text-shadow: 0 0 1px #aaa;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
-webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
-moz-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
}
#slideshow .commands:after {
position: absolute;
bottom: 65px; left:-18px;
content: attr(title);
width: 50px;
padding: 12px;
background: #fff;
font-family: Georgia, Times, serif;
font-size: 14px;
text-align:center;
text-shadow: 0 0 0;
opacity: 0;
-webkit-border-radius: 12px;
-moz-border-radius: 12px;
border-radius: 12px;
-webkit-box-shadow: 1px 1px 4px rgba(0,0,0,0.4);
-moz-box-shadow: 1px 1px 4px rgba(0,0,0,0.4);
box-shadow: 1px 1px 4px rgba(0,0,0,0.4);
-webkit-transition: opacity 0.7s, bottom 0.7s;
-moz-transition: opacity 0.7s, bottom 0.7s;
transition: opacity 0.7s, bottom 0.7s;
}
#slideshow .commands:before {
position: absolute;
bottom: 55px; left: 13px;
content: " ";
width: 1px; height: 1px;
border-top: 10px solid #fff;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
z-index:100;
opacity: 0;
-webkit-transition: opacity 0.7s, bottom 0.7s;
-moz-transition: opacity 0.7s, bottom 0.7s;
transition: opacity 0.7s, bottom 0.7s;
}
#slideshow .commands:hover:before {
bottom: 35px;
opacity: 1;
}
#slideshow .commands:hover:after {
bottom: 45px;
opacity: 1;
}
#slideshow .commands:focus {
outline: 0;
-webkit-transform: translate(1px, 2px);
-moz-transform: translate(1px, 2px);
-ms-transform: translate(1px, 2px);
-o-transform: translate(1px, 2px);
transform: translate(1px, 2px);
}
#slideshow .commands:active {
-webkit-transform: translate(0, 1px);
-moz-transform: translate(0, 1px);
-ms-transform: translate(0, 1px);
-o-transform: translate(0, 1px);
transform: translate(0, 1px);
}
#slideshow .prev {
left: -48px;
}
#slideshow .next {
right: -48px;
}
#slideshow .prev,
#slideshow .next {
display:none;
}
#slideshow .prev,
#slideshow .next {
display:none;
}
#slideshow .commands1 {
display: block;
}
/* play/pause commands */
.play_commands {
position: absolute;
width: 22px; height: 22px;
top: 25px; right: 25px;
z-index: 10;
text-indent: -9999px;
border:0 none;
opacity: 0;
-webkit-transition: opacity 1s, right 1s;
-moz-transition: opacity 1s, right 1s;
transition: opacity 1s, right 1s;
}
.play { right: 55px; cursor: default; }
.pause:hover { border:0 none; }
.play_commands:focus { outline:0; }
#slideshow:hover .pause,
#sl_play:target ~ #slideshow:hover .pause,
.play_commands:focus {
opacity: 1;
}
.sl_command:target ~ #slideshow:hover .pause,
#sl_pause:target ~ #slideshow:hover .pause {
opacity: 0;
}
.pause:after,
.pause:before {
position: absolute;
display: block;
content: " ";
top:0;
width:38%;
height: 22px;
background: #fff;
background: rgba(255,255,255,0.5);
}
.pause:after {
right:0;
}
.pause:before {
left:0;
}
.play {
width: 1px;
height: 1px;
border-top: 10px solid transparent;
border-left: 20px solid #fff;
border-left: 20px solid rgba(255,255,255,0.5);
border-bottom: 10px solid transparent;
opacity: 0;
}
.play:hover,
.play:focus {
border-bottom: 10px solid transparent;
}
#slideshow .container {
position:relative;
width: 640px;
height: 310px;
overflow: hidden;
}
/* timeline base */
#slideshow .container:after {
position:absolute;
bottom: 0; left:0;
content: " ";
background: #999;
width: 100%;
height: 1px;
}
@-webkit-keyframes slider {
0%, 20%, 100% { left: 0 }
25%, 45% { left: -100% }
50%, 70% { left: -200% }
75%, 95% { left: -300% }
}
@-moz-keyframes slider {
0%, 20%, 100% { left: 0 }
25%, 45% { left: -100% }
50%, 70% { left: -200% }
75%, 95% { left: -300% }
}
@keyframes slider {
0%, 20%, 100% { left: 0 }
25%, 45% { left: -100% }
50%, 70% { left: -200% }
75%, 95% { left: -300% }
}
#slideshow .slider {
position: absolute;
left:0; top:0;
width: 400%;
height: 310px;
-webkit-animation: slider 32s infinite;
-moz-animation: slider 32s infinite;
animation: slider 32s infinite;
}
.sl_i:target ~ #slideshow .slider {
-webkit-transition: left 1s;
-moz-transition: left 1s;
transition: left 1s;
}
.sl_command:target ~ #slideshow .slider {
-webkit-transition: opacity 1s;
-moz-transition: opacity 1s;
transition: opacity 1s;
}
#slideshow .c_slider {
position: absolute;
left:0; top:0;
width: 400%;
height: 310px;
background: url(bak.jpg) 0 0 no-repeat, url(images/bsmi.jpg) 640px 0 no-repeat, url(bak.jpg) 1280px 0 no-repeat, url(images/bsmi.jpg) 1920px 0 no-repeat;
}
.sl_i:target ~ #slideshow .c_slider {
-webkit-transition: background 1s;
-moz-transition: background 1s;
transition: background 1s;
}
#slideshow figure {
position:relative;
padding:0; margin:0;
}
@-webkit-keyframes figurer {
0%, 25%, 50%, 75%, 100% { -webkit-box-shadow: 0 0 65px rgba(0,0,0, 0) inset; box-shadow: 0 0 65px rgba(0,0,0, 0) inset; }
5%, 20%, 30%, 45%, 55%, 70%, 80%, 95% { -webkit-box-shadow: 0 0 65px rgba(0,0,0, 0.5) inset; box-shadow: 0 0 65px rgba(0,0,0, 0.5) inset; }
}
@-moz-keyframes figurer {
0%, 25%, 50%, 75%, 100% { -moz-box-shadow: 0 0 65px rgba(0,0,0, 0) inset; box-shadow: 0 0 65px rgba(0,0,0, 0) inset; }
5%, 20%, 30%, 45%, 55%, 70%, 80%, 95% { -moz-box-shadow: 0 0 65px rgba(0,0,0, 0.5) inset; box-shadow: 0 0 65px rgba(0,0,0, 0.5) inset; }
}
@keyframes figurer {
0%, 25%, 50%, 75%, 100% { -moz-box-shadow: 0 0 65px rgba(0,0,0, 0) inset; box-shadow: 0 0 65px rgba(0,0,0, 0) inset; }
5%, 20%, 30%, 45%, 55%, 70%, 80%, 95% { -moz-box-shadow: 0 0 65px rgba(0,0,0, 0.5) inset; box-shadow: 0 0 65px rgba(0,0,0, 0.5) inset; }
}
#slideshow figure:after {
position: absolute;
display:block;
content: " ";
top:0; left:0;
width: 100%; height: 100%;
-webkit-box-shadow: 0 0 65px rgba(0,0,0, 0.5) inset;
-moz-box-shadow: 0 0 65px rgba(0,0,0, 0.5) inset;
box-shadow: 0 0 65px rgba(0,0,0, 0.5) inset;
-webkit-animation: figurer 32s infinite;
-moz-animation: figurer 32s infinite;
animation: figurer 32s infinite;
}
@-webkit-keyframes figcaptionner {
0%, 25%, 50%, 75%, 100% { bottom: -55px; }
5%, 20%, 30%, 45%, 55%, 70%, 80%, 95% { bottom: 5px; }
}
@-moz-keyframes figcaptionner {
0%, 25%, 50%, 75%, 100% { bottom: -55px; }
5%, 20%, 30%, 45%, 55%, 70%, 80%, 95% { bottom: 5px; }
}
@keyframes figcaptionner {
0%, 25%, 50%, 75%, 100% { bottom: -55px; }
5%, 20%, 30%, 45%, 55%, 70%, 80%, 95% { bottom: 5px; }
}
#slideshow figcaption {
position:absolute;
padding: 20px 20px; margin:0;
left:0; right:0; bottom: 5px;
text-align:center;
letter-spacing: 0.05em;
word-spacing: 0.05em;
font-family: Georgia, Times, serif;
background: #000;
background: rgba(255,255,255,0.7);
border-top: 1px solid rgb(225,225,225);
color: #555;
text-shadow: -1px -1px 0 rgba(255,255,255,0.3);
-webkit-animation: figcaptionner 32s infinite;
-moz-animation: figcaptionner 32s infinite;
animation: figcaptionner 32s infinite;
}
@-webkit-keyframes timeliner {
0%, 25%, 50%, 75%, 100% { width: 0; }
20%, 45%, 70%, 90% { width: 640px; }
}
@-moz-keyframes timeliner {
0%, 25%, 50%, 75%, 100% { width: 0; }
20%, 45%, 70%, 90% { width: 640px; }
}
@keyframes timeliner {
0%, 25%, 50%, 75%, 100% { width: 0; }
20%, 45%, 70%, 90% { width: 640px; }
}
#timeline {
position: absolute;
background: #999;
bottom: 15px;
left: 15px;
height: 1px;
background: rgb(214,98,13);
background: rgba(214,98,13,.8);
width: 0;
-webkit-animation: timeliner 32s infinite;
-moz-animation: timeliner 32s infinite;
animation: timeliner 32s infinite;
}
/* dots styles */
.dots_commands {
position: relative;
top: 32px;
padding:0; margin:0;
text-align:center;
}
.dots_commands li {
display:inline;
padding:0; margin:0;
list-style:none;
}
.dots_commands a {
position: relative;
display:inline-block;
height:8px; width: 8px;
margin: 0 5px;
text-indent: -9999px;
background: #fff;
border-bottom:0;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.55) inset;
-moz-box-shadow: 0 1px 2px rgba(0,0,0,0.55) inset;
box-shadow: 0 1px 2px rgba(0,0,0,0.55) inset;
z-index:25;
}
.dots_commands li + li a {
z-index:10;
}
@-moz-keyframes dotser {
0%, 100% { opacity: 1; left: 0; }
20% { opacity: 1; left: 0; }
22% { opacity: 0; left: 0; }
23% { opacity: 0; left: 18px; }
25% { opacity: 1; left: 18px; }
45% { opacity: 1; left: 18px; }
47% { opacity: 0; left: 18px; }
48% { opacity: 0; left: 36px; }
50% { opacity: 1; left: 36px; }
70% { opacity: 1; left: 36px; }
72% { opacity: 0; left: 36px; }
73% { opacity: 0; left: 54px; }
75% { opacity: 1; left: 54px; }
95% { opacity: 1; left: 54px; }
97% { opacity: 0; left: 54px; }
98% { opacity: 0; left: 0; }
}
@-webkit-keyframes dotser {
0%, 100% { opacity: 1; left: 0; }
20% { opacity: 1; left: 0; }
22% { opacity: 0; left: 0; }
23% { opacity: 0; left: 18px; }
25% { opacity: 1; left: 18px; }
45% { opacity: 1; left: 18px; }
47% { opacity: 0; left: 18px; }
48% { opacity: 0; left: 36px; }
50% { opacity: 1; left: 36px; }
70% { opacity: 1; left: 36px; }
72% { opacity: 0; left: 36px; }
73% { opacity: 0; left: 54px; }
75% { opacity: 1; left: 54px; }
95% { opacity: 1; left: 54px; }
97% { opacity: 0; left: 54px; }
98% { opacity: 0; left: 0; }
}
@keyframes dotser {
0%, 100% { opacity: 1; left: 0; }
20% { opacity: 1; left: 0; }
22% { opacity: 0; left: 0; }
23% { opacity: 0; left: 18px; }
25% { opacity: 1; left: 18px; }
45% { opacity: 1; left: 18px; }
47% { opacity: 0; left: 18px; }
48% { opacity: 0; left: 36px; }
50% { opacity: 1; left: 36px; }
70% { opacity: 1; left: 36px; }
72% { opacity: 0; left: 36px; }
73% { opacity: 0; left: 54px; }
75% { opacity: 1; left: 54px; }
95% { opacity: 1; left: 54px; }
97% { opacity: 0; left: 54px; }
98% { opacity: 0; left: 0; }
}
.dots_commands li:first-child a:after,
.dots_commands li:first-child a:before {
position: absolute;
top: 0; left: 0;
content: " ";
width: 8px; height: 8px;
background: #bd9b83;
z-index:20;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.55) inset;
-moz-box-shadow: 0 1px 2px rgba(0,0,0,0.55) inset;
box-shadow: 0 1px 2px rgba(0,0,0,0.55) inset;
}
.dots_commands li:first-child a:after {
-webkit-animation: dotser 32s infinite; /* webkit can't animate pseudo-element =_= :L: */
-moz-animation: dotser 32s infinite; /* thanks moz ! :D */
animation: dotser 32s infinite;
}
.dots_commands li:first-child a:before {
display:none;
}
/* need a stop ! */
/* actions when target ! */
.sl_command { display: none; }
.sl_command:target ~ #slideshow .slider,
.sl_command:target ~ #slideshow figure:after,
.sl_command:target ~ #slideshow figcaption,
.sl_command:target ~ #slideshow #timeline,
.sl_command:target ~ #slideshow .dots_commands li:first-child a:after {
-webkit-animation-play-state: paused;
-moz-animation-play-state: paused;
animation-play-state: paused;
}
#sl_play:target ~ #slideshow .slider,
#sl_play:target ~ #slideshow figure:after,
#sl_play:target ~ #slideshow figcaption,
#sl_play:target ~ #slideshow #timeline,
#sl_play:target ~ #slideshow .dots_commands li:first-child a:after {
-webkit-animation-play-state: running;
-moz-animation-play-state: running;
animation-play-state: running;
}
.sl_command:target ~ #slideshow .pause { opacity:0; }
.sl_command:target ~ #slideshow .play { opacity:1; right: 25px; cursor: pointer; }
#sl_play:target ~ #slideshow .pause { opacity:0; }
#sl_play:target ~ #slideshow .play { opacity:0; right: 55px; cursor: default;}
.sl_i:target ~ #slideshow .slider { visibility: hidden }
.sl_i:target ~ #slideshow .slider figcaption { visibility: hidden }
.sl_i:target ~ #slideshow .dots_commands li:first-child a:after { display:none; }
.sl_i:target ~ #slideshow .dots_commands li:first-child a:before { display:block; }
#sl_i1:target ~ #slideshow .commands { display: none; }
#sl_i1:target ~ #slideshow .commands1 { display: block; }
#sl_i1:target ~ #slideshow .c_slider { background-position: 0 0, 640px 0, 1280px 0, 1920px 0; }
#sl_i1:target ~ #slideshow .dots_commands li:first-child a:before { left:0; }
#sl_i2:target ~ #slideshow .commands { display: none; }
#sl_i2:target ~ #slideshow .commands2 { display: block; }
#sl_i2:target ~ #slideshow .c_slider { background-position: -640px 0, 0 0, 640px 0, 1280px 0; }
#sl_i2:target ~ #slideshow .dots_commands li:first-child a:before { left:18px; }
#sl_i3:target ~ #slideshow .commands { display: none; }
#sl_i3:target ~ #slideshow .commands3 { display: block; }
#sl_i3:target ~ #slideshow .c_slider { background-position: -1280px 0, -640px 0, 0 0, 640px 0; }
#sl_i3:target ~ #slideshow .dots_commands li:first-child a:before { left:36px; }
#sl_i4:target ~ #slideshow .commands { display: none; }
#sl_i4:target ~ #slideshow .commands4 { display: block; }
#sl_i4:target ~ #slideshow .c_slider { background-position: -1920px 0, -1280px 0, -640px 0, 0 0; }
#sl_i4:target ~ #slideshow .dots_commands li:first-child a:before { left:54px; }
/* חלונות קופצים בדף הראשי */
/* התאמת דף slider */
.page-משתמש_Office div#mw-head {
position: relative;
display: none;}
.page-משתמש_Office #catlinks {
display: none;
}
.page-משתמש_Office div#footer ul {
margin: 0 0 0 9em;}
.page-משתמש_Office #footer-info-lastmod, #footer-info-viewcount
{
display: none;
}
.page-משתמש_Office div#content {
border: none;
margin: 0;
padding: 0;
width: 100%;
box-shadow: none;
}
.page-משתמש_Office #mw-panel {
display: none;}
.page-משתמש_Office h1.firstHeading { display:none; }
.page-משתמש_Office #mw-head-base {
margin-top: -4em;
margin-right: 10em;
height: 0em;}
.page-משתמש_Office #mw-navigation, .page-משתמש_Office #footer, .page-משתמש_Office #mw-page-base {
display:none;
}
#mw-content-text > table.toccolours > tbody > tr > td > ul {
list-style-type: disc;
list-style-image: none;
}
/* פורטל */
.container {
border: 0px dashed #ccc;
position: relative;
max-width: 885px;
margin: auto;
overflow: hidden;
padding: 2em 0;
}
.container > div {
background: transparent;
height: 150px;
position: relative;
width: 150px;
float: right;
margin: 5px;
}
.container > div[data-ss-colspan='4'] { width: 150px; }
.container > div[data-ss-colspan='2'] {
width: 100%;
max-width: 309px;
height:309px;
}
#double {width: 309px;
height: 150px; background: transparent;}
.container .ss-placeholder-child {
background: #000;
opacity:0.1;
}
#gridcell h3, .gridcell > div > h3 {
margin: 0.2em;
text-align: center;
font-size: xx-large;
border: none;
font-weight: bold;
line-height: 1.1;
padding: 0;
background: #52a3f6;
padding: 7px;
}
@media only screen and (max-width: 767px) {
.container > div {
background: transparent;
height: 150px;
position: relative;
width: 150px;
float: none;
margin: 14px auto;
}
.container > div[data-ss-colspan='2'] {
width: 100%;
max-width: 400px;
}
}