style_to_anim_boxes
This commit is contained in:
parent
9297d92488
commit
abba5e1ea8
3 changed files with 56 additions and 22 deletions
|
|
@ -1409,16 +1409,19 @@ a.text-warning:hover {color: #FD7262;}
|
|||
|
||||
/*-----------------------------------------------------------------*/
|
||||
|
||||
.ca-menu{
|
||||
.w-popup-menu{
|
||||
padding:0;
|
||||
}
|
||||
.ca-menu li{
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
.w-popup-menu li{
|
||||
width: 180px;
|
||||
height: 180px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
float: left;
|
||||
background: #213140;
|
||||
-webkit-border-radius: 2px;
|
||||
-moz-border-radius: 2px;
|
||||
border-radius: 2px;
|
||||
-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);
|
||||
|
|
@ -1429,10 +1432,10 @@ a.text-warning:hover {color: #FD7262;}
|
|||
-ms-transition: all 300ms linear;
|
||||
transition: all 300ms linear;
|
||||
}
|
||||
.ca-menu li:last-child{
|
||||
.w-popup-menu li:last-child{
|
||||
margin-right: 0px;
|
||||
}
|
||||
.ca-menu li a{
|
||||
.w-popup-menu li a{
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
|
@ -1440,7 +1443,7 @@ a.text-warning:hover {color: #FD7262;}
|
|||
color: #333;
|
||||
position: relative;
|
||||
}
|
||||
.ca-icon{
|
||||
.w-popup-icon{
|
||||
font-family: 'WebSymbolsRegular', cursive;
|
||||
color: #c5e4f4;
|
||||
font-size: 90px;
|
||||
|
|
@ -1458,26 +1461,28 @@ a.text-warning:hover {color: #FD7262;}
|
|||
-ms-transition: all 200ms linear;
|
||||
transition: all 200ms linear;
|
||||
}
|
||||
.ca-content{
|
||||
.w-popup-content{
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
width: 100%;
|
||||
height: 50%;
|
||||
top: 50%;
|
||||
}
|
||||
.ca-main{
|
||||
.w-popup-main{
|
||||
color: #FFFFFF;
|
||||
opacity: 0.6;
|
||||
text-align: center;
|
||||
-webkit-transition: all 200ms linear;
|
||||
-moz-transition: all 200ms linear;
|
||||
-o-transition: all 200ms linear;
|
||||
-ms-transition: all 200ms linear;
|
||||
transition: all 200ms linear;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
.ca-sub{
|
||||
.w-popup-sub{
|
||||
text-align:center;
|
||||
color: #FFFFFF;
|
||||
line-height: 40px;
|
||||
line-height: 20px;
|
||||
opacity: 0.8;
|
||||
-webkit-transition: all 200ms linear;
|
||||
-moz-transition: all 200ms linear;
|
||||
|
|
@ -1485,23 +1490,23 @@ a.text-warning:hover {color: #FD7262;}
|
|||
-ms-transition: all 200ms linear;
|
||||
transition: all 200ms linear;
|
||||
}
|
||||
.ca-menu li:hover{
|
||||
background-color: #3C4E60;
|
||||
.w-popup-menu li:hover{
|
||||
background-color: #34B191;
|
||||
}
|
||||
.ca-menu li:hover .ca-icon{
|
||||
.w-popup-menu li:hover .w-popup-icon{
|
||||
text-shadow: 0px 0px 20px #c5e4f4;
|
||||
color: transparent;
|
||||
-webkit-animation: moveFromTop 400ms ease;
|
||||
-moz-animation: moveFromTop 400ms ease;
|
||||
-ms-animation: moveFromTop 400ms ease;
|
||||
}
|
||||
.ca-menu li:hover .ca-main{
|
||||
.w-popup-menu li:hover .w-popup-main{
|
||||
color: #FFFFFF;
|
||||
-webkit-animation: moveFromTop 300ms ease;
|
||||
-moz-animation: moveFromTop 300ms ease;
|
||||
-ms-animation: moveFromTop 300ms ease;
|
||||
}
|
||||
.ca-menu li:hover .ca-sub{
|
||||
.w-popup-menu li:hover .w-popup-sub{
|
||||
color: #FFFFFF;
|
||||
-webkit-animation: moveFromBottom 500ms ease;
|
||||
-moz-animation: moveFromBottom 500ms ease;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue