section.page_cat_list { display: block; } .page_cat_list { a { background-color: transparent; color: #337ab7; text-decoration: none; &:active { outline: 0; text-decoration: none; } &:hover { outline: 0; text-decoration: none; color: #23527c; } &:focus { color: #23527c; outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px; } } img { border: 0; vertical-align: middle; } * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; &:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } &:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } } h3 { font-family: inherit; font-weight: 500; line-height: 1.1; color: inherit; margin-top: 20px; margin-bottom: 10px; font-size: 20px; } h4 { font-family: inherit; font-weight: 500; line-height: 1.1; color: inherit; margin-top: 10px; margin-bottom: 10px; font-size: 18px; } p { margin: 0 0 10px; text-indent: 1em; font-size: 14px; text-indent: 0px; } .container { margin-right: auto; margin-left: auto; padding-left: 0px; padding-right: 0px; &:before { content: " "; display: table; } &:after { content: " "; display: table; clear: both; } } .row { margin-left: -15px; margin-right: -15px; &:before { content: " "; display: table; } &:after { content: " "; display: table; clear: both; } } .col-sm-4 { position: relative; min-height: 1px; padding-left: 15px; padding-right: 15px; } .col-xs-12 { position: relative; min-height: 1px; padding-left: 15px; padding-right: 15px; float: left; width: 100%; } .btn { display: inline-block; margin-bottom: 0; font-weight: normal; text-align: center; vertical-align: middle; touch-action: manipulation; cursor: pointer; background-image: none; border: 1px solid transparent; white-space: nowrap; padding: 6px 12px; font-size: 14px; line-height: 1.42857; border-radius: 4px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; &:focus { outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px; color: #333; text-decoration: none; } &:active { &:focus { outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px; } outline: 0; background-image: none; -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); } &:hover { color: #333; text-decoration: none; } } .btn-default { color: #333; background-color: #fff; border-color: #ccc; &:focus { color: #333; border-color: #8c8c8c; } &:hover { color: #333; border-color: #e00626; } &:active { color: #333; border-color: #adadad; background-image: none; &:hover { color: #333; border-color: #8c8c8c; } &:focus { color: #333; border-color: #8c8c8c; } } } .btn-sm { padding: 5px 10px; font-size: 12px; line-height: 1.5; border-radius: 3px; } .pull-left { float: left !important; float: left; } .visible-lg { display: none !important; display: none !important; } } .page_cat_list { min-height: 27px; background: #d9dde0; padding: 0px; padding-bottom: 20px; background: url('https://auto-sputnik.ru/images/style/cat_bg.jpg') center top no-repeat; background: url(https://auto-sputnik.ru/rk/templates/default/img/cat_bg1.jpg) center top no-repeat; background-size: cover; background: none; .animation-block-gsap { display: block; margin: 2px; position: relative; overflow: hidden; border: 1px solid #fff; background: rgba(255,255,255,0.5); border-radius: 6px; box-shadow: rgba(0, 0, 0, 0.1) 0px 0.0666667px 0.133333px 0px, rgba(0, 0, 0, 0.1) 0px 2px 10px 0px; border: 1px solid rgba(0,0,0,0.1); margin: 3px; img { display: block; position: absolute; float: right; width: auto; max-height: 174px; top: 0px; right: 0px; height: auto; transition: .3s; } } h4 { text-shadow: none; color: #000; width: 100% !important; font-weight: 500; } .custom_inside { padding: 8px 12px; width: 100%; height: 170px; background: #fff; transition-duration: .5s; .btn { left: 12px; bottom: 8px; box-shadow: rgba(0, 0, 0, 0.1) 0px 0.0666667px 0.133333px 0px, rgba(0, 0, 0, 0.1) 0px 2px 10px 0px; font-weight: bold; color: #000; border-color: #ececec; transition-duration: .3s; } &:hover { background: @primary-color; box-shadow: 0 16px 48px 0 rgba(201, 7, 0, 0.35); p { color: #fff; } h3 { color: #fff; } h4 { color: #fff; } .btn { color: #000; } } p { color: #000; width: 60%; font-size: 14px; line-height: 16px; transition-duration: .3s; } h3 { transition-duration: .3s; } h4 { transition-duration: .3s; } } } .page_cat_list{ .custom_inside { position: absolute; top: 0; left: 0; padding: 5px 15px; height: 100%; position: relative; .btn { position: absolute; left: 15px; bottom: 5px; } p { color: black; font-size: 10px; line-height: 1em; margin: 10px 0; } } .custom_inside_h3 { text-transform: uppercase; font-size: 18px; margin: 3px 0; color: black; font-weight: bold; } .portrait { .custom_inside_h4 { width: 100%; } .custom_inside { p { width: 100%; } } } .custom_inside_h4 { margin: 3px 0px; font-weight: bold; font-size: 16px; line-height: 15px; text-shadow: 1px 1px 2px #fff; } .color_yellow { color: #f3bd61; text-shadow: 1px 1px 2px #000; } .color_brown { color: #726465; } .color_brown2 { color: #4b4b4b; } .color_blue { color: #475d7c; } .color_gray { color: #434343; } .color_violet { color: #575d75; } .color_gray2 { color: #5f5a56; } .color_brand { color: #44495d; } @media print { * { background: transparent !important; color: #000 !important; box-shadow: none !important; text-shadow: none !important; &:before { background: transparent !important; color: #000 !important; box-shadow: none !important; text-shadow: none !important; } &:after { background: transparent !important; color: #000 !important; box-shadow: none !important; text-shadow: none !important; } } a { text-decoration: underline; &:visited { text-decoration: underline; } } a[href] { &:after { content: " (" attr(href) ")"; } } img { page-break-inside: avoid; max-width: 100% !important; } p { orphans: 3; widows: 3; } h3 { orphans: 3; widows: 3; page-break-after: avoid; } } @media (min-width: 768px) { .container { width: 750px; } .col-sm-4 { float: left; width: 33.33333%; } } @media (min-width: 992px) { .container { width: 970px; } } @media (min-width: 1200px) { .container { width: 1170px; } .visible-lg { display: block !important; display: block !important; } } } @media (max-width: 768px) { .page_cat_list { .custom_inside { p { display: block !important; font-size: 16px; } margin-top: 0px; .btn { font-size: 14px; } } margin-top: 16px; } }