مستخدم:Antime/common.css

/*class antimemovingbox*/
.antimemovingbox
{
width:99%;
height:3px;
background:grey;
position:relative;
/* General: */
animation-name:antimemovingbox;
animation-duration:3s;
animation-timing-function:ease;
animation-delay:2s;
animation-iteration-count:1;
animation-direction:alternate;
animation-play-state:running;
/* Firefox: */
-moz-animation-name:antimemovingbox;
-moz-animation-duration:3s;
-moz-animation-timing-function:linear;
-moz-animation-delay:2s;
-moz-animation-iteration-count:1;
-moz-animation-direction:alternate;
-moz-animation-play-state:running;
/* Safari and Chrome: */
-webkit-animation-name:antimemovingbox;
-webkit-animation-duration:3s;
-webkit-animation-timing-function:linear;
-webkit-animation-delay:2s;
-webkit-animation-iteration-count:1;
-webkit-animation-direction:alternate;
-webkit-animation-play-state:running;
/* Opera: */
-o-animation-name:antimemovingbox;
-o-animation-duration:3s;
-o-animation-timing-function:linear;
-o-animation-delay:2s;
-o-animation-iteration-count:1;
-o-animation-direction:alternate;
-o-animation-play-state:running;
/* Iexplorer */
-ms-animation-name:antimemovingbox;
-ms-animation-duration:3s;
-ms-animation-timing-function:linear;
-ms-animation-delay:2s;
-ms-animation-iteration-count:1;
-ms-animation-direction:alternate;
-ms-animation-play-state:running;
}

@keyframes antimemovingbox
{
0%   {background:red; left:0px; top:0px;}
25%  {background:yellow; left:50px; top:0px;}
50%  {background:blue; left:50px; top:50px;}
75%  {background:green; left:0px; top:50px;}
100% {background:red; left:0px; top:0px;}
}
@-moz-keyframes antimemovingbox /* Firefox */
{
0%   {background:red; left:0px; top:0px;}
25%  {background:yellow; left:50px; top:0px;}
50%  {background:blue; left:50px; top:50px;}
75%  {background:green; left:0px; top:50px;}
100% {background:red; left:0px; top:0px;}
}
@-webkit-keyframes antimemovingbox /* Safari and Chrome */
{
0%   {background:red; left:0px; top:0px;}
25%  {background:yellow; left:50px; top:0px;}
50%  {background:blue; left:50px; top:50px;}
75%  {background:green; left:0px; top:50px;}
100% {background:red; left:0px; top:0px;}
}
@-o-keyframes antimemovingbox /* Opera */
{
0%   {background:red; left:0px; top:0px;}
25%  {background:yellow; left:50px; top:0px;}
50%  {background:blue; left:50px; top:50px;}
75%  {background:green; left:0px; top:50px;}
100% {background:red; left:0px; top:0px;}
@-ms-keyframes antimemovingbox /* Iexplorer */
{
0%   {background:red; left:0px; top:0px;}
25%  {background:yellow; left:50px; top:0px;}
50%  {background:blue; left:50px; top:50px;}
75%  {background:green; left:0px; top:50px;}
100% {background:red; left:0px; top:0px;}
}
/*done*/

/*class antimefadebox*/
.antimefadebox
{
width:100px;
height:100px;
background:blue;
animation:antimefadebox 5s;
-moz-animation:antimefadebox 5s; /* Firefox */
-webkit-animation:antimefadebox 5s; /* Safari and Chrome */
}

@keyframes antimefadebox
{
from {background:blue;}
to {background:grey;}
}
@-moz-keyframes antimefadebox /* Firefox */
{
from {background:blue;}
to {background:grey;}
}
@-webkit-keyframes antimefadebox /* Safari and Chrome */
{
from {background:blue;}
to {background:grey;}
}
@-0-antimefadebox /* Opera */
{
from {background:blue;}
to {background:grey;}
}
@-ms-keyframes antimefadebox /* Iexplorer */
{
from {background:blue;}
to {background:grey;}
}
/* done */
/* clas antimecolcss3*/
.antimecolcss3
{
column-count:3;
-moz-column-count:3; /* Firefox */
-webkit-column-count:3; /* Safari and Chrome */
-o-column-count:3; 
-ms-column-count:3;

column-gap:40px;
-moz-column-gap:40px; /* Firefox */
-webkit-column-gap:40px; /* Safari and Chrome */
-o-column-gap:40px;
-ms-column-gap:40px;

column-rule:4px outset #ff00ff;
-moz-column-rule:4px outset #ff00ff; /* Firefox */
-webkit-column-rule:4px outset #ff00ff; /* Safari and Chrome */
-o-column-rule:4px outset #ff00ff;
-ms-column-rule:4px outset #ff00ff;
}
/* done */
/* class antimeresbox */
.antimeresbox
{
border:2px solid;
padding:10px 40px; 
width:300px;
resize:both;
overflow:auto;
}
/* done */
/* class antimecontainer*/
.antimecontainer
{
width:30em;
border:1em solid;
}
.antimebox
{
box-sizing:border-box;
-moz-box-sizing:border-box; /* Firefox */
-webkit-box-sizing:border-box; /* Safari */
-o-box-sizing:border-box;
-ms-box-sizing:border-box;
width:50%;
border:1em solid red;
float:left;
}
/* done */


.antimeboxshadow
{
box-shadow: 4px 4px 4px #CCC; 
-moz-box-shadow: 4px 4px 4px #CCC; 
-webkit-shadow: 4px 4px 4px #CCC; 
-o-shadow: 4px 4px 4px #CCC; 
-ms-shadow: 4px 4px 4px #CCC; 
}

.antimetextshadow
{
text-shadow: 5px 5px orange;

}

.antimedisplaytitle
{
font-family:andalus;
color:#DDCEF2; 
background:#dddddd;
font-size:110%; 
font-stretch:expanded;
border-style:outset;
border-bottom-right-radius:1em;
border-bottom-left-radius:1em;
border-right-color:lavender;
border-left-color:lavender;
-moz-font-stretch:expanded;
-moz-border-style:outset;
-moz-border-bottom-right-radius:1em;
-moz-border-bottom-left-radius:1em;
-moz-border-right-color:lavender;
-moz-border-left-color:lavender;
-webkit-font-stretch:expanded;
-webkit-border-style:outset;
-webkit-border-bottom-right-radius:1em;
-webkit-border-bottom-left-radius:1em;
-webkit-border-right-color:lavender;
-webkit-border-left-color:lavender;
-o-font-stretch:expanded;
-o-border-style:outset;
-o-border-bottom-right-radius:1em;
-o-border-bottom-left-radius:1em;
-o-border-right-color:lavender;
-o-border-left-color:lavender;
-ms-font-stretch:expanded;
-ms-border-style:outset;
-ms-border-bottom-right-radius:1em;
-ms-border-bottom-left-radius:1em;
-ms-border-right-color:lavender;
-ms-border-left-color:lavender;
}


.antimetransition
{
width:100px;
height:100px;
background:silver;
transition:width 2s, height 2s;
-moz-transition:width 2s, height 2s, -moz-transform 2s; /* Firefox 4 */
-webkit-transition:width 2s, height 2s, -webkit-transform 2s; /* Safari and Chrome */
-o-transition:width 2s, height 2s, -o-transform 2s; /* Opera */
-ms-transition:width 2s, height 2s, -o-transform 2s; 
}
.antimetransition:hover
{
width:200px;
height:200px;
transform:rotate(180deg);
-moz-transform:rotate(180deg); /* Firefox 4 */
-webkit-transform:rotate(180deg); /* Safari and Chrome */
-o-transform:rotate(180deg); /* Opera */
-ms-transform:rotate(180deg);
}