style_to_anim_boxes

This commit is contained in:
Mariano Rodriguez 2014-11-05 11:47:46 -03:00
commit abba5e1ea8
3 changed files with 56 additions and 22 deletions

View file

@ -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;