/*--------------------- Banner -----------------------*/ .blog { padding-bottom: 55px; } .banner__item { position: relative; overflow: hidden; &:hover { .banner__item__text { a { &:after { width: 40px; background: $primary-color; } } } } &.banner__item--middle { margin-top: -75px; .banner__item__pic { float: none; } .banner__item__text { position: relative; top: 0; left: 0; max-width: 100%; padding-top: 22px; } } &.banner__item--last { margin-top: 100px; } } .banner__item__pic { float: right; } .banner__item__text { max-width: 300px; position: absolute; left: 0; top: 140px; h2 { color: #111111; font-weight: 700; line-height: 46px; margin-bottom: 10px; } a { display: inline-block; color: $heading-color; font-size: 13px; font-weight: 700; letter-spacing: 4px; text-transform: uppercase; padding: 3px 0; position: relative; &:after { position: absolute; left: 0; bottom: 0; width: 100%; height: 2px; background: $heading-color; content: ""; @include transition(all, .3s); } } } /*--------------------- Categories -----------------------*/ .categories { background: #f3f2ee; overflow: hidden; padding-top: 150px; padding-bottom: 125px; } .categories__text { padding-top: 40px; position: relative; z-index: 1; &:before { position: absolute; left: -485px; top: 0; height: 300px; width: 600px; background: $white-color; z-index: -1; content: ""; } h2 { color: #b7b7b7; line-height: 72px; font-size: 34px; span { font-weight: 700; color: $heading-color; } } } .categories__hot__deal { position: relative; z-index: 5; img { min-width: 100%; } } .hot__deal__sticker { height: 100px; width: 100px; background: $heading-color; border-radius: 50%; padding-top: 22px; text-align: center; position: absolute; right: 0; top: -36px; span { display: block; font-size: 15px; color: $white-color; margin-bottom: 4px; } h5 { color: $white-color; font-size: 20px; font-weight: 700; } } .categories__deal__countdown { span { color: $primary-color; font-size: 14px; font-weight: 700; text-transform: uppercase; letter-spacing: 2px; margin-bottom: 15px; display: block; } h2 { color: $heading-color; font-weight: 700; line-height: 46px; margin-bottom: 25px; } .categories__deal__countdown__timer { margin-bottom: 20px; overflow: hidden; margin-left: -30px; .cd-item { width: 25%; float: left; margin-bottom: 25px; text-align: center; position: relative; &:after { position: absolute; right: 0; top: 7px; content: ":"; font-size: 24px; font-weight: 700; color: #3d3d3d; } &:last-child { &:after { display: none; } } span { color: $heading-color; font-weight: 700; display: block; font-size: 36px; } p { margin-bottom: 0; } } } } /*--------------------- Instagram -----------------------*/ .instagram { padding-bottom: 0; } .instagram__pic__item { width: 33.33%; float: left; height: 261px; background-position: center center; } .instagram__text { padding-top: 130px; h2 { color: $heading-color; font-weight: 700; margin-bottom: 30px; } p { margin-bottom: 65px; } h3 { color: $primary-color; font-weight: 700; } }