@charset "UTF-8";

/*
Theme Name: Twenty Twenty-One
Theme URI: https://wordpress.org/themes/twentytwentyone/
Author: the WordPress team
Author URI: https://wordpress.org/
Description: Twenty Twenty-One is a blank canvas for your ideas and it makes the block editor your best brush. With new block patterns, which allow you to create a beautiful layout in a matter of seconds, this theme’s soft colors and eye-catching — yet timeless — design will let your work shine. Take it for a spin! See how Twenty Twenty-One elevates your portfolio, business website, or personal blog.
Requires at least: 5.3
Tested up to: 6.4
Requires PHP: 5.6
Version: 2.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentytwentyone
Tags: one-column, accessibility-ready, custom-colors, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready

Twenty Twenty-One WordPress Theme, (C) 2020 WordPress.org
Twenty Twenty-One is distributed under the terms of the GNU GPL.
*/

/**
 * SETTINGS
 * File-header..........The file header for the themes style.css file.
 * Fonts................Any font files, if the project needs specific fonts.
 * Global...............Project-specific, globally available variables.
 *
 * TOOLS
 * Functions............Global functions.
 * Mixins...............Global mixins.
 *
 * GENERIC
 * Normalize.css........Normalise browser defaults.
 * Breakpoints..........Mixins and variables for responsive styles
 * Vertical-margins.....Vertical spacing for the main components.
 * Reset................Reset specific elements to make them easier to style in other contexts.
 * Clearings............Clearings for the main components.
 *
 * ELEMENTS
 * Blockquote...........Default blockquote.
 * Forms................Element-level form styling.
 * Headings.............H1–H6
 * Links................Default links.
 * Lists................Default lists.
 * Media................Images, Figure, Figcaption, Embed, iFrame, Objects, Video.
 *
 * BLOCKS
 * Audio................Specific styles for the audio block.
 * Button...............Specific styles for the button block.
 * Code.................Specific styles for the code block.
 * Columns..............Specific styles for the columns block.
 * Cover................Specific styles for the cover block.
 * File.................Specific styles for the file block.
 * Gallery..............Specific styles for the gallery block.
 * Group................Specific styles for the group block.
 * Heading..............Specific styles for the heading block.
 * Image................Specific styles for the image block.
 * Latest comments......Specific styles for the latest comments block.
 * Latest posts.........Specific styles for the latest posts block.
 * Legacy...............Specific styles for the legacy gallery.
 * List.................Specific styles for the list block.
 * Media text...........Specific styles for the media and text block.
 * Navigation...........Specific styles for the navigation block.
 * Paragraph............Specific styles for the paragraph block.
 * Pullquote............Specific styles for the pullquote block.
 * Quote................Specific styles for the quote block.
 * Search...............Specific styles for the search block.
 * Separator............Specific styles for the separator block.
 * Table................Specific styles for the table block.
 * Verse................Specific styles for the verse block.
 * Video................Specific styles for the video block.
 * Utilities............Block alignments.
 *
 * COMPONENTS
 * Header...............Header styles.
 * Footer...............Footer styles.
 * Comments.............Comment styles.
 * Archives.............Archive styles.
 * 404..................404 styles.
 * Search...............Search styles.
 * Navigation...........Navigation styles.
 * Footer Navigation....Footer Navigation styles.
 * Pagination...........Pagination styles.
 * Single...............Single page and post styles.
 * Posts and pages......Misc, sticky post styles.
 * Entry................Entry, author biography.
 * Widget...............Widget styles.
 * Editor...............Editor styles.
 *
 * UTILITIES
 * A11y.................Screen reader text, prefers reduced motion etc.
 * Color Palette........Classes for the color palette colors.
 * Editor Font Sizes....Editor Font Sizes.
 * Measure..............The width of a line of text, in characters.
 */

/* Categories 01 to 03 are the basics. */

body {
	padding: 0;
	margin: 0;
	color: #303030;
	font-weight: 400;
	font-style: normal;
	background: #fff;
	font-family: "roc-grotesk", sans-serif;
  }
  
  img {
	max-width: 100%;
  }
  
  a {
	color: #F94F4A;
  }
  
  a:hover {
	color: #2D2D2D;
  }
  
  a, i {
	transition: all 0.4s;
	text-decoration: none;
  }
  
  li {
	margin-bottom: 16px;
  }
  
  b, strong {
	font-weight: 600;
  }
  
  p {
	color: #2D2D2D;
	font-size: 16px;
	font-weight: 400;
	font-family: "roc-grotesk", sans-serif;
	font-style: normal;
  }
  

  @font-face {
	font-family: "segoe_uiitalic";
	src: url("../fonts/segoe_ui_italic-webfont.woff2") format("woff2"), url("../fonts/segoe_ui_italic-webfont.woff") format("woff");
	font-weight: normal;
	font-style: normal;
  }
  @font-face {
	font-family: "segoe_uiregular";
	src: url("../fonts/segoe_ui-webfont.woff2") format("woff2"), url("../fonts/segoe_ui-webfont.woff") format("woff");
	font-weight: normal;
	font-style: normal;
  }
  @font-face {
	font-family: "segoe_uibold_italic";
	src: url("../fonts/segoe_ui_bold_italic-webfont.woff2") format("woff2"), url("../fonts/segoe_ui_bold_italic-webfont.woff") format("woff");
	font-weight: normal;
	font-style: normal;
  }
  @font-face {
	font-family: "segoe_uibold";
	src: url("../fonts/segoe_ui_bold-webfont.woff2") format("woff2"), url("../fonts/segoe_ui_bold-webfont.woff") format("woff");
	font-weight: normal;
	font-style: normal;
  }
  .cmnbtn {
	border: 1px solid #F94F4A;
	border-radius: 33px;
	padding: 10px 25px;
	margin-top: 10px;
	text-decoration: none;
	text-align: center;
	font-size: 16px;
	color: #000;
	position: relative;
	overflow: hidden;
	font-weight: 500;
	transition: all 0.4s;
	display: inline-block;
  }
  .cmnbtn:hover {
	color: #fff;
	transition: 0.3s all;
	background: transparent linear-gradient(180deg, #414042 0%, #000000 100%) 0% 0% no-repeat padding-box;
  }
  
  .cmn-heading {
	text-align: center;
	margin-bottom: 30px;
	width: 60%;
	margin: 0 auto;
	margin-bottom: 40px;
  }
  .cmn-heading small {
	font-size: 18px;
	color: #F94F4A;
  }
  .cmn-heading .text-head {
	position: relative;
	text-align: center;
	font-size: 32px;
	color: #2D2D2D;
	font-weight: 700;
	margin-bottom: 25px;
	padding-bottom: 25px;
  }
  .cmn-heading .text-head:after {
	background: #F94F4A;
	content: "";
	width: 95px;
	height: 4px;
	bottom: 0;
	left: 0;
	right: 0;
	position: absolute;
	margin: auto;
  }
  .cmn-heading .text-head span {
	color: #F94F4A;
  }
  
  .cmn-heading.leftheading {
	text-align: left;
  }
  .cmn-heading.leftheading .text-head {
	text-align: left;
  }
  .cmn-heading.leftheading .text-head:after {
	margin: 0;
  }
  
  .form-group {
	margin-bottom: 20px;
  }
  .form-group textarea {
	height: 115px;
    border-radius: 0px;
    color: #000;
    background: #FFFFFF 0% 0% no-repeat padding-box;
    /* border: 1px solid #FBFBFB; */
    border: 1px solid #c1bbbb;
  }
  .form-group input, .form-group select {
	height: 40px;
    border-radius: 0px;
    color: #000;
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 1px solid #c1bbbb;
  }
  .form-group input::-moz-placeholder, .form-group textarea::-moz-placeholder {
	color: #000000;
	font-size: 16px;
  }
  .form-group input:-ms-input-placeholder, .form-group textarea:-ms-input-placeholder {
	color: #000000;
	font-size: 16px;
  }
  .form-group input::placeholder, .form-group textarea::placeholder {
	color: #000000;
	font-size: 16px;
  }
  
  .our-services .services-box {
	border: 1px solid #878787;
	display: block;
	padding: 20px 20px;
	text-align: left;
	border-radius: 15px;
  }
  .our-services .services-box .service-icon span {
	font-size: 30px;
  }
  .our-services .services-box .service-text {
	color: #000;
	font-size: 22px;
	font-weight: 600;
	font-family: "Lora", serif;
  }
  .our-services .services-box .box-content{
    min-height: 139px;
  }
  .our-services .services-box .arrowbtn a {
	color: #2D2D2D;
	font-size: 20px;
	font-weight: 700;
	font-family: "Lora", serif;
  }
  
  .calculator-section {
	background: #FBFBFB;
	padding: 50px 0px;
  }
  .calculator-section .calculatoer-main {
	display: flex;
	position: relative;
  }
  .calculator-section .calculatoer-main h4{
	font-weight: 800;
  }
  .calculator-section .calculatoer-main .calculator-box {
	padding: 70px 50px;
  }
  .calculator-section .calculatoer-main .calculator-box.cal-left {
	background: #FFEFE2 0% 0% no-repeat padding-box;
	width: 50%;
	padding-right: 18%;
  }
  .calculator-section .calculatoer-main .calculator-box.cal-right {
	background: #DCF4FF 0% 0% no-repeat padding-box;
	width: 50%;
	padding-left: 18%;
  }
  .calculator-section .calculatoer-main .cost-calculator {
	position: absolute;
	background: #fff;
	width: 300px;
	height: 300px;
	border-radius: 50%;
	left: 0;
	right: 0;
	margin: auto;
	top: 0;
	bottom: 0;
	display: flex;
	align-items: center;
	box-shadow: 0px 3px 15px 0px rgba(1, 1, 1, 0.2784313725);
	justify-content: center;
  }
  .calculator-section .calculatoer-main .cost-calculator .content-calc {
	margin-top: 20px;
  }
  .calculator-section .calculatoer-main .cost-calculator .content-calc h5 {
	text-align: center;
	font-size: 30px;
	font-weight: 700;
	line-height: 30px;
	position: relative;
	padding-bottom: 8px;
  }
  .calculator-section .calculatoer-main .cost-calculator .content-calc h5:after {
	background: #F94F4A;
	content: "";
	width: 95px;
	height: 4px;
	bottom: 0;
	left: 0;
	right: 0;
	position: absolute;
	margin: auto;
  }
  
  .counterbg {
	background: #fff;
	padding: 42px 50px;
  }
  .counterbg .counter {
	text-align: center;
  }
  .counterbg .counter h3 {
	font-size: 22px;
	font-weight: 700;
  }
  .counterbg .counter img{
   width: 80px;
  }
  
  .banner-section .bannerbg {
	position: relative;
  }
  .banner-section .bannerbg .bannerbg-content {
	position: absolute;
	top: 0;
	align-items: center;
	height: 100%;
	width: 100%;
  }
  .banner-section .bannerbg .bannerbg-content .headermini-content span {
	font-size: 28px;
  }
  .banner-section .bannerbg .bannerbg-content .headermini-content h2 {
	font-size: 36px;
	font-weight: 700;
	letter-spacing: 2px;
	position: relative;
  }
  .banner-section .bannerbg .bannerbg-content .swiper.banner-slider {
	height: 100%;
  }
  .banner-section .bannerbg .bannerbg-content .row {
	height: 100%;
	align-items: center;
	padding: 60px;
  }
  .banner-section .bannerbg .bannerbg-content .swiper-button-prev {
	right: 14px;
	left: auto;
	transform: rotate(90deg);
  }
  .banner-section .bannerbg .bannerbg-content .swiper-button-next {
	right: 14px;
	left: auto;
	transform: rotate(90deg);
	margin-top: 35px;
  }
  .banner-section .bannerbg .bannerbg-content .swiper-button-prev, .banner-section .bannerbg .bannerbg-content .swiper-button-next {
	width: 35px;
	height: 35px;
	background: #fff;
	border-radius: 50%;
	color: #000;
  }
  .banner-section .bannerbg .bannerbg-content .swiper-button-prev:after, .banner-section .bannerbg .bannerbg-content .swiper-button-next:after {
	font-size: 14px;
	font-weight: 700;
  }
  .banner-section .bannerbg .bannerbg-content .swiper-button-prev:hover, .banner-section .bannerbg .bannerbg-content .swiper-button-next:hover {
	background: #F94F4A;
	color: #fff;
  }
  
  .our-services {
	padding: 50px 0px;
  }
  .our-services .services-box {
	margin-bottom: 30px;
  }
  .our-services .services-box:hover{
	border-color: #e44c49;
  }
  .our-services .services-box:hover .arrowbtn a{ 
color: #e44c49;
  }
  
  .getbtn {
	text-align: center;
  }
  
  .section-reviews {
	padding: 50px 0px;
  }
  .section-reviews .customer-profile {
	background: #FBFBFB 0% 0% no-repeat padding-box;
	border: 1px solid #EEDAD3;
	padding: 20px;
	position: relative;
	margin-bottom: 30px;
	min-height: 310px;
  }
  .section-reviews .customer-profile .pro-img {
	display: flex;
	align-items: center;
	margin-bottom: 10px;
  }
  .section-reviews .customer-profile .pro-img .proimg {
	width: 60px;
  }
  /* .section-reviews .customer-profile .rws_ttl_slf {
	padding-left: 20px;
  } */
  .section-reviews .customer-profile .rws_ttl_slf h5 {
	margin-bottom: 0;
	font-weight: 700;
  }
  .section-reviews .customer-profile .googleimg {
	position: absolute;
	top: 12px;
	right: 15px;
	width: 37px;
  }
  .contact-listheader a{
font-size: 24px;
color: #000000;
  }
  .contact-listheader a:hover{color: #F94F4A;}
  
  .contact-listheader a i{
color: #F94F4A;
  }
  
  /** about page section **/
  .innersection .innersection-bg {
	padding: 40px 0px;
	background: #DCF4FF 0% 0% no-repeat padding-box;
	border: 1px solid #DCF4FF;
	text-align: center;
  }
  .innersection .banner-inner-head h1 {
	font-size: 35px;
	font-weight: 700;
  }
  .innersection .banner-inner-head h1 span {
	color: #F94F4A;
  }
  
  .about-section {
	padding: 50px 0px;
	padding-bottom: 0px;
  }
  
  .recent-projects {
	background: #FFF9F5 0% 0% no-repeat padding-box;
	padding: 50px 0px;
  }
  .recent-projects .project-contenttop {
	display: flex;
  }
  .recent-projects .project-contenttop .cmn-heading {
	width: 35%;
  }
  .recent-projects .project-contenttop .cmn-heading .text-head {
	text-align: left;
  }
  .recent-projects .project-contenttop .cmn-heading .text-head:after {
	margin: 0;
  }
  .recent-projects .project-contenttop .pro-para {
	width: 65%;
	position: relative;
  }
  .recent-projects .project-contenttop .pro-para .leftserivce-btn {
	width: 35px;
	height: 35px;
	background: #fff;
	text-align: center;
	line-height: 35px;
	font-size: 30px;
	border-radius: 50%;
	top: 0;
	position: absolute;
	right: 60px;
  }
  
 
  .recent-projects .project-contenttop .pro-para .rightservice-btn {
	width: 35px;
	height: 35px;
	background: #fff;
	text-align: center;
	line-height: 40px;
	font-size: 30px;
	border-radius: 50%;
	position: absolute;
	top: 0;
	right: 0;
  }
 
  .recent-projects .project-contenttop .pro-para .smllpara-ct {
	width: 80%;
  }
  
  .recent-projects .project-contenttop .pro-para i {
	font-size: 18px;
	font-weight: 700;
	color: #000;
  }
  .recent-projects .project-content a {
	display: block;
	position: relative;
  }
  .recent-projects .project-content a .projectname {
	position: absolute;
	background: #fff;
	top: auto;
	bottom: 18px;
	padding: 5px;
	left: 18px;
  }
  .recent-projects .project-content a .projectname h2 {
	font-size: 20px;
	color: #000;
	font-weight: 800;
	margin: 0;
  }
  
  /** about page section end here **/
  /** contact page section end here **/
  .location-ctbox {
	background: #FFFFFF 0% 0% no-repeat padding-box;
	box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.16);
	text-align: center;
	padding: 35px 15px;
	min-height: 247px;
  }
  .location-ctbox span {
	background: #F94F4A 0% 0% no-repeat padding-box;
	width: 52px;
	height: 52px;
	display: inline-block;
	font-size: 24px;
	color: #fff;
	line-height: 62px;
  }
  .location-ctbox strong {
	display: block;
	position: relative;
	margin: 10px 0px;
	padding-bottom: 8px;
  }
  .location-ctbox strong:after {
	background: #F94F4A;
	position: absolute;
	content: "";
	width: 80px;
	height: 2px;
	left: 0;
	right: 0;
	margin: auto;
	bottom: 0px;
  }
  .location-ctbox a {
	color: #191919;
  }
  .location-ctbox a:hover{
	color: #e44c49;
  }
  .location-ctbox p {
	margin-bottom: 0px;
  }
  
  .contactpage-section {
	padding: 50px 0px;
	margin-top: -160px;
	position: relative;
  }
  
  .footer-formsection {
	padding: 50px 0px;
  }
  .footer-formsection .row {
	align-items: center;
  }
  .footer-formsection .row .col-lg-5 {
	padding-left: 0px;
  }
  .footer-formsection .row .col-lg-7 {
	padding-right: 0px;
  }
  .footer-formsection .footerform {
	background: #F6F6F6 0% 0% no-repeat padding-box;
	box-shadow: 0px 3px 66px rgba(220, 205, 205, 0.2);
	padding: 50px;
  }
  .footer-formsection .footerform h2 {
	color: #F94F4A;
	font-size: 36px;
	font-weight: 600;
  }
  .footer-formsection button.submit {
	background: #F94F4A 0% 0% no-repeat padding-box;
	border: 1px solid #F94F4A;
	border-radius: 33px;
	color: #fff;
	font-size: 18px;
	padding: 7px 40px;
  }
  
  .map {
	padding: 50px 0px;
  }
  
  /** contact page section end here **/
  /** gallery css start here **/
  .gallery-section {
	padding: 50px 0px;
  }
  
  /** gallery css end here **/
  .numbers,
  .slider {
	display: flex;
	justify-content: space-between;
  }
  
  .numbers span,
  .slider span {
	width: 0;
	flex-grow: 1;
	text-align: center;
  }
  
  .slider span {
	flex-grow: 1;
  }
  
  .slider input {
	flex-grow: 24;
	margin-left: -2px; /* account for UI sizing */
	margin-right: -2px; /* account for UI sizing */
  }
  
  input[type=range] {
	accent-color: #F94F4A;
	width: 100%;
	height: 4px;
	border: none;
	outline: none;
  }
  
  .sliderbar {
	position: relative;
  }
  .desk-calc-bg {
	background: #FBFBFB 0% 0% no-repeat padding-box;
	border: 1px solid #EEDAD3;
	padding: 50px;
  }
  .desk-calc-bg .desk-clchead {
	text-align: center;
	width: 80%;
	margin: 0 auto;
  }
  .desk-calc-bg .desk-clchead h2 {
	font-size: 36px;
	font-weight: 700;
  }
  .desk-calc-bg .desk-clchead h2 span {
	color: #F94F4A;
  }
  
  .desk-calc {
	padding: 50px 0px;
  }
  .desk-calc select {
	background: #F5F3F3 0% 0% no-repeat padding-box;
	border-radius: 5px;
	height: 50px;
  }
  .ranevalue {
	display: flex;
	align-items: center;
	justify-content: space-between;
  }
  
  .range-slider__value {
	display: inline-block;
	position: relative;
	width: 46px;
	color: #fff;
	line-height: 16px;
	text-align: center;
	border-radius: 3px;
	background: #e44c49;
	padding: 5px 10px;
	font-weight: 600;
	margin-left: 8px;
  }
  
  .range-slider__value:after {
	position: absolute;
	top: 8px;
	left: -7px;
	width: 0;
	height: 0;
	border-top: 7px solid transparent;
	border-right: 7px solid #e44c49;
	border-bottom: 7px solid transparent;
	content: "";
  }
  
  ::-moz-range-track {
	background: #d7dcdf;
	border: 0;
  }
  
  input::-moz-focus-inner,
  input::-moz-focus-outer {
	border: 0;
  }
  
  .check-marge {
	display: flex;
  }
  
  .check-marge .checks {
	margin-right: 15px;
  }
  
  .decking-type {
	margin-top: 35px;
  }
  
  .checkboxes {
	margin-top: 35px;
  }
  
  .headdick h2 {
	color: #F94F4A;
	font-weight: 700;
	position: relative;
  }
  .headdick h2:after {
	position: absolute;
	width: 100%;
	content: "";
	background: #d1d1d1;
	height: 1px;
	width: 70%;
	bottom: 0;
	top: 0;
	margin: auto;
	right: 0;
  }

  
  .price-exculed {
	margin-top: 10px;
	padding-top: 20px;
	border-top: 1px solid gray;
  }
  
  .estimate {
	padding-left: 20px;
  }
  .estimate .estimate-head h2 {
	color: #F94F4A;
	font-weight: 700;
	position: relative;
  }
  .estimate .estimate-head h2:after {
	position: absolute;
	width: 100%;
	content: "";
	background: #d1d1d1;
	height: 1px;
	width: 65%;
	bottom: 0;
	top: 0;
	margin: auto;
	right: 0;
  }
  .estimate ul {
	padding: 0;
  }
  .estimate ul li {
	list-style: none;
	display: flex;
	justify-content: space-between;
	margin-bottom: 20px;
  }
  
  .button-submit {
	text-align: right;
  }
  



  footer .footerlinks {
	background-image: url(assets/images/footerbg.png);
	padding: 50px 0px;
	background-size: cover;
	padding-bottom: 0px;
  }
  footer .footerlinks .container {
	position: relative;
  }
  footer .footerlinks .container::after {
	position: absolute;
	content: "";
	width: 100%;
	background: #F94F4A;
	height: 18px;
	top: -68px;
  }
  footer .footer-socails h5 {
	font-size: 40px;
	font-weight: 700;
	color: #fff;
  }
  footer .footer-socails h5 span {
	color: #F94F4A;
  }
  footer .footer-socails p {
	color: #fff;
  }
  footer .ft-head {
    color: #fff;
    font-size: 28px;
    position: relative;
    padding-bottom: 10px;
    margin-bottom: 20px;
  }
  footer .ft-head:after{
	position: absolute;
    width: 100px;
    content: "";
    height: 2px;
    background: #fff;
    bottom: 0;
    left: 0;
}
  footer .contactlist-ft ul {
	list-style: none;
	padding: 0;
  }
  footer .contactlist-ft ul li a {
	color: #fff;
  }
  footer .contactlist-ft ul li a:hover {
    color: #e44c49;
}
  footer .contactlist-ft ul li a span {
	margin-right: 6px;
	background: #fff;
	width: 27px;
	height: 27px;
	display: inline-block;
	text-align: center;
	line-height: 32px;
	border-radius: 50%;
  }
  footer .contactlist-ft ul li a span i {
	color: #F94F4A;
	font-size: 14px;
  }
  footer .socail-links ul {
	padding: 0;
	list-style: none;
	display: flex;
  }
  footer .socail-links ul li {
	list-style: none;
	margin-bottom: 0;
	margin-right: 12px;
  }
  footer .socail-links ul li a {
	color: #fff;
	display: inline-block;
	width: 40px;
	height: 40px;
  }
  footer .useful-links {
	padding-left: 20px;
  }
  footer .useful-links ul {
	padding: 0;
	list-style-type: square;
	color: #fff;
	padding-left: 20px;
  }
  footer .useful-links ul li a {
	color: #fff;
  }
  footer .useful-links ul li a:hover{
	color: #e44c49;
  }
  footer .drop-message .form-gorup {
	margin-bottom: 20px;
  }/*# sourceMappingURL=style.css.map */


/*  service page start here*/
.service-section{
	padding: 50px 0px;
}
.service-extra-ct{
	margin-top: 50px;
}
.service-icon span img{
width: 60px;
}

.serviceimages-slider .swiper-button-next ,.serviceimages-slider .swiper-button-prev{
	width: 35px;
    height: 35px;
    background: #fff;
	border-radius: 50%;
}
.serviceimages-slider .swiper-button-next:hover ,.serviceimages-slider .swiper-button-prev:hover{
    background: #F94F4A;
    color: #fff;
}
.serviceimages-slider .swiper-button-next:hover:after ,.serviceimages-slider .swiper-button-prev:hover:after{
	color: #fff;
	}
.serviceimages-slider .swiper-button-next:after ,.serviceimages-slider .swiper-button-prev:after{
font-size: 18px;
color: #000;
}
/*  service page end here*/

.main_header .header-socail ul {
	padding: 0;
	list-style: none;
	display: flex;
	margin-bottom: 0px;
	position: relative;
	z-index: 2;
  }
  .main_header .header-socail ul li {
	margin-bottom: 0px;
  }
  .main_header .header-socail ul li a {
	display: inline-block;
	width: 35px;
	height: 35px;
	margin-right: 10px;
  }
  .navbar-nav .sub-menu-toggle{
	background: transparent;
    border: none;
}
.error-page{
	padding: 50px 0px;
}
.errorcontent span{
 font-size: 20px;
 font-weight: bold;
}
.errorcontent{
	text-align: center;
}
.errorcontent h2{
font-size: 100px;
font-weight: bold;
color: #F94F4A;
}
.errorimg{
	width: 300px;
    margin: 0 auto;
}
.errorbot{
	margin-top: 35px;
}
.errorbot h5{
	font-weight: 700;
    font-size: 30px;
}
  .drop-message .dropbtn-submit{
    border: 1px solid #F94F4A;
    border-radius: 33px;
    padding: 10px 47px;
    margin-top: 10px;
    text-decoration: none;
    text-align: center;
    font-size: 16px;
    color: #fff;
    position: relative;
    overflow: hidden;
    font-weight: 500;
    transition: all 0.4s;
    display: inline-block;
    background: #F94F4A;
  }
  .drop-message .dropbtn-submit:hover{
background: transparent;	
transition: .3s all;
  }
  .service-img{
	height: 100%;
  }
  .service-img  , .serviceimages-slider , .swiper-sliderimages{
height: 100%;
  }
  .swiper-sliderimages img{
	height: 100%;
    object-fit: cover;
    object-position: center;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
  }
  .about-extra-ct{
	margin-top: 30px;
  }

  .pergolalist ul{
	list-style: none;
	padding: 0;
	
  }
  .custompergolafileds .form-control{
    background: #F5F3F3 0% 0% no-repeat padding-box;
    border-radius: 5px;
    height: 50px;
  }
.custompergolafileds{
	margin: 30px 0px;
}
.pergolaimg{
	background: #ffff;
    padding: 20px;
}
.pergolaimg img{
    position: absolute;
    height: 100%;
    object-fit: cover;
    width: 100%;
    object-position: center;
}
.pergolaimgdiv {
    min-height: 320px;
    position: relative;
    margin-bottom: 10px;
}
.radiobtns{
	margin-top: 26px;
    display: flex;
}

.radiobtns div{
	margin-right: 20px;
}
.totalcost{
	margin-top: 20px;
    font-size: 30px;
}
.sminput {
    display: inline-block;
    margin-right: 15px;
}
.ftcopy{
	padding: 19px 0px;
    border-top: 1px solid #414141;
    margin-top: 40px;
}
.ftcopy p{
	color: #ffff;
    text-align: center;
    margin-bottom: 0;
}
.topbtn{
	position: fixed;
    right: 15px;
    bottom: 33px;
}
.topbtn ul{
	list-style: none;
}
.topbtn a{
    background: 0% 0% no-repeat padding-box padding-box rgb(79, 79, 79);
    color: rgb(255, 250, 245);
    padding: 8px;
    font-size: 20px;
}
.topbtn a:hover{
	background: #F94F4A;
}

.calculator_form{
	background: #efefef;
    padding: 20px;
    width: 100%;
}
.map-location iframe{
	width: 100%;
    height: 300px;
}
.whatsappiconmobile{
	display: none;
}

.section-reviews .swiper-pagination {
	bottom: 0px;
}
.section-reviews .swiper-pagination .swiper-pagination-bullet{
width: 10px;
height: 10px;
}
.section-reviews .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{
background: #F94F4A;
}

.drop-form .error{
color: #F94F4A;
}

  /******** Responsive css start **********/
  @media (min-width: 992px) {
	body .main_header.header_fixd {
		position: fixed;
		width: 100%;
		background: #fff;
		margin-top: 0;
		padding: 0px 0;
		box-shadow: 1px 1px 35px -29px;
		top: 0;
		left: 0;
		right: 0;
		z-index: 9999;
	}
	body .main_header.header_fixd .navbar-expand-lg:after{
        display: none;
	}
	body .main_header.header_fixd .container-fluid .hdr_mnu_rt ul{
		padding: 2px 0;
	}
	header.main_header {
	  background-image: url(assets/images/headerbg.jpg);
	  background: #fff;
	  padding: 0px 0px;
	  background-size: cover;
	  z-index: 100;
	  top: 0;
	  width: 100%;
	  top: 0;
	  box-shadow: 1px 1px 21px -30px;
	  transition: all 0.4s;
	}
	header.main_header .dropdown-menu > li:hover {
	  background-color: transparent;
	}
	header.main_header .dropdown-toggle::after {
	  content: "\f285";
	  font-family: "bootstrap-icons";
	  left: 0;
	  font-size: 13px;
	  vertical-align: middle;
	  margin: 0 6px 0 0;
	  border: none;
	  transform: rotate(90deg);
	}
	header.main_header .navbar-light .nav-link.show {
	  background: transparent;
	}
	header.main_header .navbar-expand-lg {
	  justify-content: space-between;
	  padding: 10px 0px;
	  position: relative;
	  width: 100%;
	}
	header.main_header .navbar-expand-lg:after {
	  position: absolute;
	  content: "";
	  background-image: url(assets/images/header-transprent.png);
	  width: 300px;
	  height: 261px;
	  top: 0;
	  left: 0;
	  z-index: 1;
	  background-repeat: no-repeat;
	  background-size: 302px;
	}
	header.main_header .navbar-expand-lg .hdr_logo {
	display: none;
	}
	.barndname-header a{
color:  inherit;
	}
	header.main_header .container-fluid {
	  align-items: center;
	  display: flex;
	  justify-content: space-between;
	}
	header.main_header .container-fluid .hdr_mnu_rt .hdr_mnu_tp {
	  border-bottom: 1px solid #e7e7e7;
	  transition: all 0.4s;
	}
	header.main_header .container-fluid .hdr_mnu_rt .hdr_mnu_tp ul li a {
	  font-size: 14px;
	}
	header.main_header .container-fluid .hdr_mnu_rt .hdr_mnu_btm {
	  justify-content: center;
	}
	header.main_header .container-fluid .hdr_mnu_rt .hdr_mnu_btm ul li {
	  padding: 0px 14px;
	  position: relative;
	}
	header.main_header .container-fluid .hdr_mnu_rt ul {
	  list-style: none;
	  padding: 10px 0;
	  display: flex;
	  margin: 0;
	  z-index: 9;
	  align-items: center;
	}
	header.main_header .container-fluid .hdr_mnu_rt ul li {
	  margin: 0;
	  padding: 3px 10px 3px 10px;
	}
	header.main_header .container-fluid .hdr_mnu_rt ul li a {
	  color: #2D2D2D;
	  padding: 0px;
	  position: relative;
	}
	header.main_header .container-fluid .hdr_mnu_rt ul li a:hover {
	  color: #F94F4A;
	}
	header.main_header .container-fluid .hdr_mnu_rt ul li a.nav-link.cmnbtn {
	  padding: 10px 22px !important;
	  color: white;
	  font-weight: 600;
	}
	header.main_header .container-fluid .hdr_mnu_rt ul li a.cmn_btn_primary:hover {
	  color: #2D2D2D;
	}
	header.main_header .container-fluid .hdr_mnu_rt ul li:last-child {
	  border: none;
	  padding-right: 0;
	}
	header.main_header .container-fluid .hdr_mnu_rt ul li.active a {
	  color: #F94F4A;
	}
	header.main_header.scrolled {
	  box-shadow: 1px 1px 17px -11px;
	  padding: 5px 0;
	}
	header.main_header.scrolled .hdr_mnu_tp {
	  opacity: 0;
	  visibility: hidden;
	  height: 0;
	}
	header.main_header.scrolled .container .hdr_logo {
	  width: 300px;
	}
	
	.main_header .hdr_mnu_rt .barndname-header h2 {
	  font-size: 34px;
	  font-weight: 700;
	  letter-spacing: 2px;
	}
	.main_header .hdr_mnu_rt .barndname-header h2 span {
	  color: #F94F4A;
	}


    header.main_header .container-fluid .hdr_mnu_rt ul li ul.sub-menu {
		padding: 0;
		list-style: none;
		display: block;
		opacity: 0;
		visibility: hidden;
		margin-top: 0;
		position: absolute;
		width: 272px;
		background: #f8f8f8;
		max-width: 320px;
		top: 28px;
		border-radius: 10px;
	}
	header.main_header .container-fluid .hdr_mnu_rt ul li.menu-item-has-children:hover ul.sub-menu {
		opacity: 1;
		visibility: visible;
		transition: .3s all;
	}
	
	header.main_header .container-fluid .hdr_mnu_rt ul li.menu-item-has-children ul.sub-menu li {
		margin-bottom: 6px;
		margin-right: 0;
		margin-left: 0px;
		padding: 0px;
	}
	header.main_header .container-fluid .hdr_mnu_rt ul li.menu-item-has-children ul.sub-menu li a {
		padding: 8px 14px;
		display: block;
		border-bottom: 1px solid #dedede;
	}


  }
 
  @media (min-width: 1300px) {
	.container-fluid {
	  width: 95%;
	}
  }
  @media (min-width: 1900px) {
	.container {
	  max-width: 1550px;
	}
  }
  @media (max-width: 1199px) {
	.our-services .services-box .box-content{
		min-height: auto;
	}
	.our-services .services-box{
		min-height: 336px;
	}
	.location-ctbox a{
		font-size: 13px;
	}
	.location-ctbox p{
		font-size: 13px;
	}
  }
  @media (max-width: 991px) {
	header.main_header .navbar-expand-lg .hdr_logo {
		display: block;
	}
	ul.navbar-nav li ul.sub-menu li a {
		padding: 10px 20px !important;
		font-size: 16px !important;
	}
	.cmn-heading{
        width: 100%;
	}
	.main_header nav .navbar-collapse {
		position: fixed;
		background: #fff;
		left: 0;
		right: 0;
		top: 77px;
		bottom: 0;
		overflow: scroll;
	}
	ul.navbar-nav li ul.sub-menu {
		display: none;
		padding: 0;
		list-style: none;
		background: #f1f1f1;
		padding: 10px 0px;
	}
	.main_header nav .navbar-collapse ul.navbar-nav {
		display: flex;
		flex-direction: column;
		padding: 0 20px;
	}
	.main_header nav .navbar-collapse ul.navbar-nav li {
		width: 100%;
		margin: 0;
		position: relative;
	}
	.main_header nav .navbar-collapse ul.navbar-nav li a {
		display: inline-block;
		font-size: 18px;
		text-align: left;
		width: 100%;
		margin: 0;
		padding: 10px 0;
		color: #000;
		border-bottom: 1px solid #efefef;
	}
	.main_header nav .navbar-collapse ul.navbar-nav li button.sub-menu-toggle {
		position: absolute;
		right: 0;
		top: 8px;
		padding: 4px 10px;
		font-size: 22px;
		background: transparent;
		border: none;
		transition: all 0.4s;
		width: 100%;
		text-align: right;
	}
	.main_header nav .navbar-collapse ul.navbar-nav li button.sub-menu-toggle i{
text-align: right;
	}
	
	.main_header nav .navbar-collapse ul.navbar-nav li button.sub-menu-toggle[aria-expanded="true"] > i.bi.bi-chevron-down:before {
		transform: rotate( 
	180deg
	 );
	 transition: .3s all;
	}
	.main_header nav .navbar-collapse ul.navbar-nav li button.sub-menu-toggle[aria-expanded="true"] + ul.sub-menu {
		display: inline-block;
		width: 100%;
	}
	.main_header {
		position: fixed;
		top: 0;
		width: 100%;
		left: 0;
		right: 0;
		z-index: 9;
		background: #000000;
	}
	.navbar-light .navbar-toggler-icon{
		filter: invert(100%);
	}
	.banner-section{
		margin-top: 78px;
	}
	.barndname-header h2{
		color: #fff;
	}
	footer .footerlinks .container::after{
		display: none;
	}
	footer .footer-socails h5{
		font-size: 24px;
	}
	.innersection{
		margin-top: 78px;
	}
	.service-img {
		margin-bottom: 22px;
		height: auto;
	}
	.service-section{
		padding-bottom: 20px;
	}
	.about-ct{
       margin-top: 50px;
	}
	.location-ctbox{
		min-height: auto;
		margin-bottom: 30px;
	}
	.location-ctbox p {
		margin-bottom: 0px;
		font-size: 16px;
		text-align: center;
	}
	.location-ctbox a{
		font-size: 16px;
	}
	.footer-formsection .row .col-lg-7{
		padding-right: 15px;
	}
	.ct-bgimg{
		display: none;
	}
	.footer-formsection .footerform{
		padding: 30px 18px;
	}
	.contactpage-section{
		padding-bottom: 0px;
	}
	
  }
  @media (max-width: 767px) {
	
	body {
	  font-size: 14px;
	}
	p {
	  font-size: 14px;
	  text-align: justify;
	}
	.calculator-section .calculatoer-main .calculator-box.cal-left{
		background: #FFEFE2 0% 0% no-repeat padding-box;
		width: 100%;
		padding-right: 20px;
	}
	.calculator-section .calculatoer-main .calculator-box{
		padding: 20px 20px;
	}
	.calculator-section .calculatoer-main .calculator-box.cal-right{
		width: 100%;
		padding-left: 20px; 
		
	}
	.banner-section .bannerbg{
		height: auto;
	}
	.banner-section .bannerbg img{
		height: 100%;
		position: absolute;
		object-fit: cover;
		width: 100%;
	}
	.bannermini-img{
		display: none;
	}
	.banner-section .bannerbg .bannerbg-content .row{
		height: auto;
		padding: 0px;
	}
	.banner-section .bannerbg .bannerbg-content{
		height: 100%;
		position: initial;
	}
	.headermini-content{
		padding: 30px 20px;
	}
	.banner-section .bannerbg .bannerbg-content .headermini-content span{
		font-size: 20px;
	}
	.banner-section .bannerbg .bannerbg-content .headermini-content h2{
		font-size: 23px;
	}
	.cmnbtn{
		padding: 7px 15px;
		margin-top: 5px;
	}
	
		.contact-listheader{
			display:  none;
		}
		
		.barndname-header h2{
			text-align: center;
			font-size: 20px;
			font-weight: bold;
			margin-bottom: 0;
			margin-top: 8px;
		}
		.barndname-header h2 span{
			color: #e44c49;
		}
	.hdr_mnu_rt{
		width: 100%;
    order: 2;
	}
	.header-socail{
		order: 1;
	}
	.hdr_logo{
		order: 2;
	}
	.main_header .header-socail ul li a{
		width: 28px;
		height: 28px;
	}
	.navbar-light .navbar-toggler{
		border: none;
		padding: 0px;
	}
	.banner-section .bannerbg .bannerbg-content .swiper-button-prev, .banner-section .bannerbg .bannerbg-content .swiper-button-next{
		width: 30px;
    height: 30px;
	}
	.banner-section .bannerbg .bannerbg-content .swiper-button-prev{
		bottom: 30px;
		right: 60px;
		left: auto;
		top: auto;
		transform: initial;
	}
	.banner-section .bannerbg .bannerbg-content .swiper-button-next{
		right: 14px;
		left: auto;
		bottom: 30px;
    top: auto;
	transform: initial;
	}
	.cmn-heading .text-head{
		font-size: 26px;
		margin-bottom: 16px;
		padding-bottom: 10px;
	}
	.cmn-heading .text-head:after{
		height: 3px;
	}
	.calculator-section .calculatoer-main .cost-calculator{
      display: none;
	}
	.calculator-section .calculatoer-main{
		display: block;
	}
	footer .socail-links ul li a{
		width: 30px;
        height: 30px;
	}
	.main-counter{
		padding: 50px 0px;
	}
	.counterbg{
		background: transparent;
		padding: 0px;
	}
	.counter{
		text-align: center;
	}
	.counterhead{
		background: #f7f7f7;
		padding: 15px;
		margin-bottom: 20px;
	}
	.counterhead p{
		text-align: center;
	}
	.desk-calc-bg{
		padding: 20px 15px;
	}
	.desk-calc-bg .desk-clchead{
		width: 100%;
	}
	.desk-calc-bg .desk-clchead h2{
		font-size: 26px;
	}
	.radiobtns{
		display: block;
	}
	.custompergolafileds .form-control{
		margin-bottom: 20px;
	}
	.section-reviews .customer-profile{
		min-height: auto;
	}
	.section-reviews .customer-profile .rws_ttl_slf h5{
		font-size: 18px;
	}
	.our-services .services-box{
		min-height: auto;
	}
	.innersection .banner-inner-head h1{
		font-size: 26px;
	}
	footer .useful-links{
		padding-left: 0px;
		margin-bottom: 30px;
		margin-top: 30px;
	}
	footer .ft-head{
		font-size: 20px;
	}
	.decking-type{
		margin-bottom: 30px;
	}
	.estimate{
		padding-left: 0px;
	}
	.headdick h2:after{
		width: 60%;
	}
	.estimate .estimate-head h2:after{
		width: 60%;
	}
.gallery-section{
	padding-bottom: 0px;
}
.whatsappiconmobile{
	display: block;
}
  }
  /******** Responsive css end **********/
