@media all { .outer-container.story.highlighted { background-color: #DEDEDE; } .outer-container.story.gradient { background-image: linear-gradient(#DEDEDE, #ffffff); margin-top: -2px; } .storySection img { display: block; } #story_cta { position:absolute; bottom:2rem; right:4rem; } .storySection .leftColumn .teaser-img-container { overflow: hidden; position: relative; } .storySection .leftColumn .teaser-img-container img { -webkit-transition: all 1.5s ease; transition: all 0.5s ease; } .storySection .leftColumn .teaser-img-container:hover img { -webkit-transform: scale(1.05); transform: scale(1.05); } .storySection .teaser-title-container { display: inline-block; font-family: wuerthextra_bold_cond; font-size: 30px; line-height: 1.2; font-weight: normal; text-transform: uppercase; height: auto; position: absolute; top: 0px; padding: 2rem 2rem; width: 96%; } .storySection .rightColumnItem a { text-decoration: none; } .storySection .text-white { color: #fff; } .storySection .text-red { color: #cc0000 ; } .storySection .text-black { color: #000; } .grid-view .card-model .card-body, .grid-view .card-product .card-body { height: 17rem; } /*.storySection .leftColumn .text_left .teaser-title-container { text-align: left; top: 26px; left: 30px; }*/ .storySection .leftColumn .text_right .teaser-title-container { text-align: right; top: 26px; right: 30px; } .storySection .leftColumn .text_right .teaser-cta-container, .storySection .leftColumn .text_left .teaser-cta-container { bottom: 30px; right: 30px; } .storySection .leftColumn .teaser-cta-container span.btn_cta { text-align: center; padding: 0 20px; } .storySection .leftColumn .teaser-cta-container { display: inline-block; position: absolute; //right: 40px; top: auto; bottom: 20px; border: none; width: auto !important; text-align: center; } .webkit .storySection span.headlineh2, .storySection span.headlineh2 { font-family: wuerthbold, Arial, Helvetica, sans-serif; color: #cc0000 ; font-size: 20px; font-weight: normal; line-height: 1.2; padding: 0; margin: 0; display: inline-block; text-transform: none; } .storySection .leftColumn a { display: inline-block; } .storySection .rightColumn { width: calc(50% - 1.6rem); float: left; padding-bottom: 5px; padding-top: 2px; } .storySection .rightColumn .rightColumnItem { width: calc(50% - 1.5rem); float: left; } .storySection .rightColumn .rightColumnItem:first-child { margin-right: 2.7rem; } .storySection .rightColumn .rightColumnItem .rightColumnItemImg { width: 99.95%; border-top: 1px solid #dedede; border-left: 1px solid #dedede; border-right: 1px solid #dedede; text-align: center; background-color: #fff; } /* .storySection .rightColumn .rightColumnItem .rightColumnItemImg.external-img { padding-bottom: 20px; }*/ .storySection .rightColumn .rightColumnItem .rightColumnItemImg.external-img img { width: 100%; /* padding: 3%;*/ height: auto; } .storySection .rightColumn .rightColumnItem .rightColumnItemImg.internal-img img { width: 100%; //padding: 3%; height: auto; } .storySection .rightColumn .rightColumnItem .rightColumnItemText { padding: 20px; background-color: #ebebeb; border-top: solid 2px #cc0000 ; } .storySection .rightColumn .rightColumnItem .rightColumnItemText b {} .storySection .rightColumn .rightColumnItem .rightColumnItemText p { margin: 0; height: 68px; line-height: 24px; color: #000; } .storySection .rightColumn .rightColumnItem:hover { -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); -moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); } } @media screen and (max-width:992px) { .storySection .inner_wrapper { display: block; width: 100%; } .storySection .leftColumn, .storySection .rightColumn { width: 100%; margin-right: 0; max-width: 96%; float: none; margin: 0 auto; display: block; } .storySection .leftColumn { margin-bottom: 30px; display: inline-block; } .storySection .leftColumn .leftInnerContainer, .storySection .leftColumn .text_right, .storySection .leftColumn .text_left { width: 50%; float: left; } } @media screen and (max-width:768px) { #story_cta { bottom: 0; left: auto; right: 3rem; bottom: 2rem; } } @media screen and (max-width:576px) { .storySection .leftColumn .leftInnerContainer, .storySection .leftColumn .text_right, .storySection .leftColumn .text_left { width: 100%; float: none; } .storySection .rightColumn .rightColumnItem { width: 100%; } .storySection .rightColumn .rightColumnItem:first-child { margin: 0 0 2.4rem 0; } }