123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384 |
- *{
- box-sizing: border-box;
- }
- html, body, header{
- background: #f9f9f9fe;
- }
- body{
- #start{
- width: $Wi50;
- margin: $marg auto auto $marg;
- #text_figli{
- p {
- a{
- position: relative;
- &.marg{
- margin-right: $marg;
- }
- }
- }
- #item_list{
- width: 80vw;
- .card{
- width: calc((100% / 5) - ( #{$marg} * 2) );
- height: auto;
- // overflow: hidden;
- display: inline-block;
- vertical-align: top;
- line-height: 0;
- margin-right: $marg;
- position: relative;
- margin-top: $marg;
- a{
- display: block;
- }
- .card-header{
- display: none;
- & > *{
- font-size: 0.8rem;
- line-height: 1rem;
- margin-right: $marg;
- }
- }
- &:hover{
- .card-header{
- width: 100%;
- background: rgba(255, 255, 255, 0.5);
- padding: $marg;
- display: inline-flex;
- flex-wrap: wrap;
- position: absolute;
- transform: translateY(-100%);
- }
- }
- &:last-of-type{
- vertical-align: baseline!important;
- }
- #item{
- width: calc( 307% - #{$marg} );
- .content-title{
- margin: 30px auto;
- a{
- display: block;
- }
- }
- .e-content{
- margin: 30px auto;
- p{
- font-size: 1rem;
- line-height: 1rem;
- }
- }
- }
- }
- }
- }
- }
- &:not(.home){
- #start{
- margin-top: calc( 2rem + #{$Flhome});
- }
- }
- }
|