Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- @import "begin_reset.css";
- @import url('https://fonts.googleapis.com/css?family=Hind|Roboto+Condensed:700|Titillium+Web:300,400,600,700');
- @font-face {
- font-family: IconFont;
- src: url("../font/fontello.ttf");
- }
- .header_top {
- border-bottom: 1px solid #dcdcdc;
- }
- .header_top_inner .top_information {
- float: left;
- font-family: "Titillium Web",sans-serif;
- font-size: 13px;
- color: #3d3d47;
- font-weight: 600;
- padding-top: 12px;
- }
- .top_information .location {
- display: inline-block;
- margin-right: 25px;
- padding: 0;
- }
- .top_information .location:before {
- font-family: IconFont;
- content: "\e800";
- margin-right: 10px;
- color: #ffb81e;
- font-size: 15px;
- }
- .top_information .email {
- display: inline-block;
- padding: 0;
- }
- .top_information .email:before {
- font-family: IconFont;
- content: "\e801";
- margin-right: 10px;
- color: #ffb81e;
- font-size: 15px;
- }
- .header_top_inner .call_us {
- float: right;
- font-size: 20px;
- padding: 12px 20px 12px 40px;
- background: #ffbf11;
- font-family: "Titillium Web",sans-serif;
- color: #262626;
- font-weight: 700;
- position: relative;
- }
- .header_top_inner .call_us:before {
- font-family: IconFont;
- content: "\e802";
- color: #ffffff;
- font-size: 18px;
- position: absolute;
- left: 15px;
- }
- .header_bottom {
- padding-top: 25px;
- padding-bottom: 28px;
- }
- .header_bottom .logo {
- float: left;
- }
- .header_bottom .request {
- float: right;
- margin-top: 6px;
- margin-left: 25px;
- }
- .header_bottom .request a {
- color: #ffba13;
- text-decoration: none;
- font-family: "Titillium Web",sans-serif;
- font-weight: 700;
- text-transform: uppercase;
- display: block;
- padding: 14px 18px;
- font-size: 14px;
- line-height: 14px;
- background: #005c8c;
- border-radius: 5px;
- transition: opacity 0.3s ease;
- }
- .header_bottom .request a:hover {
- opacity: 0.8;
- }
- .header_bottom .search {
- float: right;
- margin-left: 27px;
- position: relative;
- }
- .header_bottom .search_block.no-active {
- opacity: 0;
- visibility: hidden;
- position: absolute;
- top: 0;
- left:0;
- transition: opacity 0.5s, visibility 0.5s ease;
- }
- .header_bottom .search_block.no-active input {
- width: 0;
- transition: width 0.3s ease;
- border: 1px solid #dcdcdc;
- height: 30px;
- margin-top: 14px;
- padding: 0 10px;
- font-family: Hind, sans-serif;
- color: #000000;
- font-size: 14px;
- }
- .header_bottom .search_block.no-active input::placeholder {
- font-family: Hind, sans-serif;
- color: #000000;
- font-size: 14px;
- }
- .search-cancel {
- position: absolute;
- top: 65%;
- right: 5px;
- transform: translate(-50%, -50%);
- background: none;
- border: 0;
- cursor: pointer;
- }
- .search-cancel:before {
- content: "";
- width: 8px;
- height: 1px;
- background: #898a8d;
- transform: rotate(45deg);
- position: absolute;
- }
- .search-cancel:after {
- content: "";
- width: 8px;
- height: 1px;
- background: #898a8d;
- transform: rotate(-45deg);
- position: absolute;
- }
- .header_bottom .search_block.active {
- opacity: 1;
- visibility: visible;
- position: relative;
- }
- .header_bottom .search_block.active input {
- width: 150px;
- }
- .header_bottom .search a.active {
- display: block;
- text-decoration: none;
- color: #ffc23f;
- transition: opacity 0.3s ease;
- margin-top: 20px;
- }
- .header_bottom .search a.active:hover {
- opacity: 0.8;
- }
- .header_bottom .search a.no-active {
- opacity: 0;
- visibility: hidden;
- transition: opacity 0.3s, visibility 0.3s ease;
- }
- .header_bottom .search a.active .icon-search:before {
- font-style: normal;
- font-family: IconFont;
- content: "\e803";
- }
- .header_bottom .main_menu {
- float: right;
- margin-top: 21px;
- }
- .header_bottom .main_menu ul {
- padding: 0;
- margin: 0;
- }
- .header_bottom .main_menu li {
- float: left;
- margin-right: 20px;
- padding-top: 0;
- padding-bottom: 5px;
- border-bottom: 3px solid transparent;
- transition: border 0.3s ease;
- position: relative;
- }
- .header_bottom .main_menu li:last-child {
- margin-right: 0;
- }
- .header_bottom .main_menu li a {
- font-size: 16px;
- font-family: "Titillium Web",sans-serif;
- font-weight: 700;
- color: #3d3d47;
- text-decoration: none;
- text-transform: uppercase;
- display: block;
- transition: color 0.3s ease;
- }
- .header_bottom .main_menu li:hover {
- border-bottom: 3px solid #ffba13;
- }
- .header_bottom .main_menu li:hover a {
- color: #005581;
- }
- .header_bottom .main_menu li>ul {
- position: absolute;
- top: 100%;
- left: 0;
- background: #ffffff;
- z-index: 2;
- width: 200px;
- opacity: 0;
- visibility: hidden;
- transition: opacity 0.3s, visibility 0.3s ease;
- }
- .header_bottom .main_menu li>ul li {
- margin-right: 0;
- padding: 5px 15px;
- width: 100%;
- }
- .header_bottom .main_menu li:hover>ul {
- visibility: visible;
- opacity: 1;
- }
- #row_headline {
- background: url("../img/headline_row_bg.jpg") center center no-repeat;
- background-size: cover;
- padding-top: 155px;
- padding-bottom: 110px;
- }
- .shortcode_headline h1 {
- color: #ffffff;
- margin: 0;
- }
- .shortcode_headline h1 p {
- padding: 0;
- }
- .shortcode_headline .headline {
- margin-bottom: 32px;
- }
- .shortcode_headline .headline:after {
- display: block;
- background: #ffc11a;
- width: 50px;
- height: 6px;
- content: "";
- margin-top: 10px;
- }
- .shortcode_headline .request_btn {
- display: inline-block;
- padding: 19px 20px;
- font-size: 16px;
- line-height: 16px;
- border-radius: 5px;
- background: #ffffff;
- text-decoration: none;
- text-transform: uppercase;
- color: #005c8c;
- font-family: "Titillium Web",sans-serif;
- font-weight: 700;
- transition: opacity 0.3s ease;
- margin-right: 14px;
- }
- .shortcode_headline .contact_us_btn {
- display: inline-block;
- padding: 19px 20px;
- font-size: 16px;
- line-height: 16px;
- border-radius: 5px;
- background: #ffc11a;
- text-decoration: none;
- text-transform: uppercase;
- color: #1c1c1c;
- font-family: "Titillium Web",sans-serif;
- font-weight: 700;
- transition: opacity 0.3s ease;
- }
- .shortcode_headline .request_btn:hover,
- .shortcode_headline .contact_us_btn:hover {
- opacity: 0.8;
- }
- #row_services {
- padding-top: 70px;
- padding-bottom: 30px;
- background: url("../img/row_services_bg.jpg") no-repeat;
- background-size: cover;
- }
- .shortcode_plumbing,
- .shortcode_electrical,
- .shortcode_renovation,
- .shortcode_carpentry,
- .shortcode_roofing,
- .shortcode_flooring,
- .shortcode_painting,
- .shortcode_windows{
- width: 100%;
- padding: 85px 0;
- text-align: center;
- background-size: cover;
- }
- .shortcode_plumbing {
- background: url("../img/plumbing.jpg") no-repeat;
- }
- .shortcode_electrical {
- background: url("../img/electrical.jpg") no-repeat;
- }
- .shortcode_renovation {
- background: url("../img/renovation.jpg") no-repeat;
- }
- .shortcode_carpentry {
- background: url("../img/carpentry.jpg") no-repeat;
- }
- .shortcode_roofing {
- background: url("../img/roofing.jpg") no-repeat;
- }
- .shortcode_flooring {
- background: url("../img/flooring.jpg") no-repeat;
- }
- .shortcode_painting {
- background: url("../img/painting.jpg") no-repeat;
- }
- .shortcode_windows {
- background: url("../img/windows.jpg") no-repeat;
- }
- .shortcode_plumbing a,
- .shortcode_electrical a,
- .shortcode_renovation a,
- .shortcode_carpentry a,
- .shortcode_roofing a,
- .shortcode_flooring a,
- .shortcode_painting a,
- .shortcode_windows a{
- display: inline-block;
- text-decoration: none;
- text-transform: uppercase;
- color: #ffffff;
- font-family: "Titillium Web", sans-serif;
- font-weight: 700;
- font-size: 24px;
- line-height: 24px;
- transition: color 0.3s ease;
- }
- .shortcode_plumbing a::after,
- .shortcode_electrical a::after,
- .shortcode_renovation a::after,
- .shortcode_carpentry a::after,
- .shortcode_roofing a::after,
- .shortcode_flooring a::after,
- .shortcode_painting a::after,
- .shortcode_windows a::after{
- content: "";
- width: 100%;
- height: 2px;
- margin-top: 4px;
- background: transparent;
- opacity: 0.5;
- display: block;
- transition: background 0.2s ease;
- }
- .shortcode_plumbing a:hover,
- .shortcode_electrical a:hover,
- .shortcode_renovation a:hover,
- .shortcode_carpentry a:hover,
- .shortcode_roofing a:hover,
- .shortcode_flooring a:hover,
- .shortcode_painting a:hover,
- .shortcode_windows a:hover
- {
- color: #ffb617;
- }
- .shortcode_plumbing a:hover::after,
- .shortcode_electrical a:hover::after,
- .shortcode_renovation a:hover::after,
- .shortcode_carpentry a:hover::after,
- .shortcode_roofing a:hover::after,
- .shortcode_flooring a:hover::after,
- .shortcode_painting a:hover::after,
- .shortcode_windows a:hover::after {
- background: #ffb617;
- }
- .shortcode_title_services {
- margin-bottom: 20px;
- }
- #row_static {
- padding-top: 65px;
- padding-bottom: 25px;
- }
- .shortcode_static {
- font-size: 0;
- }
- .shortcode_static .static_block {
- width: 16%;
- text-align: center;
- display: inline-block;
- margin: 0 2%;
- }
- .shortcode_static .static_block p {
- color: #3a3a3a;
- font-family: "Titillium Web", sans-serif;
- font-size: 14px;
- font-weight: 700;
- text-transform: uppercase;
- margin-top: 10px;
- padding: 0;
- }
- .shortcode_static .static_block .number {
- color: #ffba13;
- font-size: 46px;
- line-height: 46px;
- margin-top: 0;
- }
- #row_section_about {
- padding-top: 75px;
- padding-bottom: 25px;
- border-top: 2px solid #e8e8e8;
- background: url("../img/about_row_bg.jpg") center center no-repeat;
- background-size: cover;
- }
- .shortcode_title_about p {
- padding: 0;
- margin-bottom: 4px;
- font-family: "Titillium Web", sans-serif;
- font-weight: 300;
- color: #1c1c1c;
- font-size: 20px;
- }
- .shortcode_title_about h2 {
- margin: 0;
- }
- .shortcode_title_about h2:after {
- display: block;
- background: #f2a61f;
- width: 50px;
- height: 4px;
- content: "";
- margin-top: 15px;
- }
- .shortcode_about_static .big_number {
- font-family: "Titillium Web", sans-serif;
- font-size: 100px;
- line-height: 81px;
- color: #ffbf11;
- font-weight: 700;
- float: left;
- margin-right: 22px;
- }
- .shortcode_about_static .big_number_right {
- overflow: hidden;
- font-family: "Titillium Web", sans-serif;
- font-size: 22px;
- color: #000001;
- font-weight: 300;
- }
- .shortcode_about_static p {
- padding: 0;
- }
- .shortcode_about_static .big_number_right span {
- display: block;
- font-size: 30px;
- line-height: 36px;
- font-weight: 700;
- color: #005c8c;
- margin-bottom: 3px;
- }
- .shortcode_title_about {
- margin-bottom: 55px;
- }
- .shortcode_about_block {
- padding-left: 55px;
- position: relative;
- }
- .shortcode_about_block h4 {
- margin-bottom: 15px;
- }
- .shortcode_about_block p {
- color: #454545;
- }
- .shortcode_about_block p:last-of-type {
- padding: 0;
- }
- .time_revers:before {
- position: absolute;
- width: 32px;
- height: 27px;
- background: url("../img/time-reverse.svg") no-repeat;
- content: "";
- left:0;
- }
- .stop_watch:before {
- position: absolute;
- width: 30px;
- height: 32px;
- background: url("../img/stopwatch.svg") no-repeat;
- content: "";
- left:0;
- }
- .trophy:before {
- position: absolute;
- width: 36px;
- height: 32px;
- background: url("../img/trophy.svg") no-repeat;
- content: "";
- left:0;
- }
- .wallet:before {
- position: absolute;
- width: 32px;
- height: 29px;
- background: url("../img/wallet.svg") no-repeat;
- content: "";
- left:0;
- }
- .eye:before {
- position: absolute;
- width: 32px;
- height: 19px;
- background: url("../img/eye.svg") no-repeat;
- content: "";
- left:0;
- }
- .shortcode_about_contact {
- width: 100%;
- background: #005c8c;
- padding: 25px 20px;
- }
- #row_about {
- padding-top: 15px;
- }
- .shortcode_about_contact h4 {
- color: #ffba13;
- margin-bottom: 20px;
- }
- .shortcode_about_contact input[type="text"] {
- width: 100%;
- height: 42px;
- margin-bottom: 15px;
- background: #1a6c97;
- border: 1px solid #4085a9;
- padding: 0 14px;
- font-family: Hind, sans-serif;
- color: #ffffff;
- font-size: 14px;
- transition: border 0.3s ease;
- }
- .shortcode_about_contact input[type="text"]::placeholder {
- font-family: Hind, sans-serif;
- color: #ffffff;
- font-size: 14px;
- }
- .shortcode_about_contact input[type="text"]:focus {
- border: 1px solid #4DC8ED;
- }
- .shortcode_about_contact input[type="submit"] {
- font-family: "Roboto Condensed", sans-serif;
- font-size: 14px;
- text-transform: uppercase;
- border: 0;
- border-radius: 5px;
- padding: 10px 25px;
- color: #1c1c1c;
- background: #ffb413;
- transition: opacity 0.3s ease;
- }
- .shortcode_about_contact input[type="submit"]:hover {
- opacity: 0.8;
- }
- .shortcode_about_contact textarea {
- width: 100%;
- height: 94px;
- margin-bottom: 15px;
- background: #1a6c97;
- border: 1px solid #4085a9;
- font-family: Hind, sans-serif;
- color: #ffffff;
- font-size: 14px;
- padding: 15px 14px;
- transition: border 0.3s ease;
- }
- .shortcode_about_contact textarea::placeholder {
- font-family: Hind, sans-serif;
- color: #ffffff;
- font-size: 14px;
- }
- .shortcode_about_contact textarea:focus {
- border: 1px solid #4DC8ED;
- }
- .shortcode_about_contact input.name {
- width: 46%;
- margin-right: 6.5%;
- }
- .shortcode_about_contact input.email {
- width: 46%;
- }
- #row_discount {
- padding-top: 40px;
- background: url("../img/discount-bg.jpg") center center no-repeat;
- background-size: cover;
- }
- .shortcode_discount {
- display: flex;
- align-items: center;
- justify-content: space-between;
- }
- .shortcode_discount .text_block {
- font-family: "Titillium Web",sans-serif;
- font-size: 26px;
- color: #0e5377;
- font-weight: 700;
- }
- .shortcode_discount .text_block p {
- padding: 0;
- }
- .shortcode_discount .request {
- color: #ffba13;
- text-decoration: none;
- font-family: "Titillium Web",sans-serif;
- font-weight: 700;
- text-transform: uppercase;
- display: block;
- padding: 14px 35px;
- font-size: 15px;
- line-height: 15px;
- background: #005c8c;
- border-radius: 5px;
- transition: opacity 0.3s ease;
- margin-left: 10px;
- white-space: nowrap;
- }
- .shortcode_discount .request:hover {
- opacity: 0.8;
- }
- .clearfix:after {
- content: "";
- display: table;
- clear: both;
- }
Add Comment
Please, Sign In to add comment