:root{
    --primary-color: #3f6b8d;
    --dark-color: #000;
}

*{
    box-sizing: border-box;
    margin:0;
    padding: 0;
}

body{
    font-family: "Raleway", sans-serif;
}

a{
    text-decoration: none;
}

img{
    max-width: 100%;
}

.full{
    width: 100%;
}

.bg-theme{
    background: var(--primary-color);
}

.bg-dark{
    background: var(--dark-color);
}

.text-center{
    text-align: center;
}

.container{
    width: 100%;
    max-width: 1500px;
    margin: auto;
    padding: 0 15px;
}

header{
    padding: 60px 38px;
}

.innerHeader{
    display: flex;
    align-items: center;    
}

.navbar {
    display: block;
}

.mobile-menu{
    display: none;
}

.navigation ul {
    list-style: none;
    display: flex;
    gap: 30px;
    justify-content: center;
    margin-top: 30px;
}

.navigation ul li{

}

.navigation ul li a{
    font-size: 22px;
    color: var(--dark-color);
    font-weight: 700;
    transition: all ease 0.3s;
}

.navigation ul li a:hover{
    color: var(--primary-color);
}

.socialLinks{
    display: flex;
	justify-content:center;
}

.actionLinks{
    display: flex;
}

.actionLinks li+li{
    margin-left: 20px;
}

.actionLinks li a.btn{
    font-size: 13px;
    padding: 12px 20px;
}

.actionLinks li a.btn.cart{
    padding: 10px 12px;
}

.brandLogo{
    display: block;
    max-width: 750px;
    width: 100%;
}

.leftHeader{
    flex: 0 1 25%;
    max-width: 25%;
}

.centerheader{
    flex: 0 0 50%;
}

.rightheader{
    flex: 0 1 25%;
    max-width: 25%;
}

.actionLinks{
    justify-content: flex-end;
    list-style: none;
    padding: 0;
    margin: 0;
    align-items: center;
}

.simpleLink{
    color: #000;
}

.socialLink{
    width: 25px;
    height: 25px;
}

.socialLink+.socialLink{
    margin-left: 25px;
}

.socialLink svg{
    width: 100%;
    height: 100%;
}


.btn{
    padding: 16px 26px;
    font-size: 16px;    
    color: #FFF;
    display: inline-block;
    border-radius: 300px;    
    text-transform: uppercase;
}

.btn-theme{
    background: var(--primary-color);    
}
.btn-theme:hover{
    background: var(--primary-color);    
    opacity: 0.9;
    color: #FFF;
}

.subheader{
    padding: 70px 0;

}

.subheader h1{
    color: #FFF;
    font-size: 57px;
}

.heroSlider-outer{
    padding-bottom: 165px;
    background: var(--primary-color);
    margin-bottom: 15px;
}

.heroSlider {    
}

.heroSlider .element {
    height: 75vh;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.heroSlider .element img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 50%;
}

.slick-prev,
.slick-next {
  position: absolute;
  right: 10%;
  background:var(--primary-color);
  border: none;
  color: transparent;
  width: 60px;
  height: 60px;
  border-radius: 100%;
  top: 50%;
  line-height: 72px;
  transform: translateY(-50%);
  text-align: center;
  transition: all ease 0.3s;
  opacity: 0.8;
  cursor: pointer;
}

.slick-prev:before,
.slick-next:before {
  content: "";
  width: 36px;
  height: 20px;
    display: inline-block;
    background-repeat: no-repeat;
}

.slick-prev {
    left: 10%;
  }

.slick-prev:before {    
    background-image: url(../images_home/leftarrow.svg);
}

.slick-next:before {    
    background-image: url(../images_home/rightarrow.svg);
}

.slick-prev:hover, .slick-next:hover{
    opacity: 1;
}

.heroSlider .btn {
    position: absolute;
    /* top: 0;
    left: 0;
    right: 0;
    max-width: 338px; */
    margin: auto;
    background: var(--dark-color);
    border: white solid thin;
    font-weight: 600;
    text-transform: capitalize;
    padding: 50px 100px;
    transition: all ease 0.4s;
}

.heroSlider .btn:hover{
    background: rgb(0 0 0 / 73%);
}

.ourServices{
    padding: 0 40px;
}

.sectionHeading{
    color: #FFF;
    font-size: 42px;
	padding: 0px 0 23px 0;
   /* padding: 63px 0; */
}
#home_header .sectionHeading, footer .sectionHeading{padding: 63px 0;}

.serviceCard{
    background: #FFF;
}

.ourServices{
    padding-bottom: 100px;
    border-bottom: 15px solid var(--primary-color);
}

.ourServices ul{
    list-style: none;
    grid-template-columns: repeat(4, 1fr);
    padding: 25px;
    display: grid;
    grid-gap: 30px 20px;
}

.ourServices ul li{
    padding: 26px;
    text-align: left;
    display: flex;
    flex-flow: column;
}

.ourServices ul li h3{
    font-size: 25px;
    color: #000;
    width: 100%;
}

.ourServices ul li>img{
    max-width: 55px;
    margin-bottom: 30px;
}

.ourServices ul li p{
    font-size: 16px;
    margin-top: 10px;
    line-height: 25px;
    margin-bottom: 20px;
}

.ourServices ul li .btn{
    font-size: 15px;
    letter-spacing: 0.5px;
    margin-top: auto;
    place-self: flex-start;
}

.modal-body img{
    float: left;
}

.modal-body table tr td {
    padding: 5px 0;
    font-weight: 600;
    font-variant: lining-nums;
}

.offering{
    padding-bottom: 0;
}

.offerings .slick-track{
    display: flex;
}

.offerings .slick-slide{
    height: auto;
}

.offerdata{
    display: flex;
    flex-flow: column;
    height: 100%;
	justify-content:center; align-items:center;
}

.offerthumb{
    width: 75%;
    height: 100%;
}

.offerthumb img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.offerdata h3{
    font-size: 19px;
    margin-top: 10px;
    text-align: left;
}

.offering .slick-prev, .offering .slick-next{
    position: static;
    display: inline-block !important;
    margin: 70px 10px 0 10px;
}

.offering h2{
    color: #000;
}

.vision{
    padding: 144px 0;
	border-bottom:15px solid #fff;
	border-top:15px solid #000;
	
	
}

.visionOuter{
    display: flex;
    flex-flow: wrap;
}

.visionImg{
    max-width: 550px;
    width: 100%;
}

.visionImg img {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.visionDesc{
    max-width: calc(100% - 550px);
    padding-left: 200px;
    padding-top: 50px;
}

.visionOuter h2{
    color: #000;
    font-size: 40px;    
    margin-bottom: 30px;
}

.visionOuter p{
    color: #FFF;
    font-size:17px;
    line-height: 28px;
    margin-bottom: 60px;
}

.btn-border{
    border: #FFF solid thin;    
}

.btn-border:hover{
    border: #FFF solid thin;    
    opacity: 0.8;
    color: #FFF;
}

.ourGoal{
    padding: 50px 0 145px;
}

.goalWrapper{
    background: #FFF;
    padding: 35px;
    width: 100%;
    max-width: 875px;
    margin: auto;
}

.goalWrapper h2{
    font-size: 25px;    
}

.goalWrapper p{
    font-size: 16px;
    line-height: 25px;
    margin: 5px 0 65px 0;
}

.faq{
    border-top: 15px solid #FFF;
    /*padding: 80px 0 125px 0;*/
	padding: 40px 0 75px 0; 
    border-bottom: var(--primary-color) 15px solid;
	float:left; width:100%;
}

.faq h2{
    font-size: 46px;
    color: var(--primary-color);
}

.faqcontainer{
    max-width: 990px;
    width: 100%;
    margin: auto;
}

.faq h3, .faq h3.kelson span{
    font-size: 24px;
    color: var(--primary-color);
	margin-bottom:10px;
    /*margin-bottom: 25px;*/
	
}

.faq p{
    font-size: 18px;
    line-height: 28px;
    color: #FFF;
    margin-bottom: 35px;
}

.faq span, .faq ul{
    color: #FFF;
    list-style: none;
}

.faq span{
    font-size: 18px;
}

.faq ul{
    /*margin-top: 15px;*/
	margin-top:0px;
    margin-bottom: 35px;
}

.faq ul li {
    font-size: 18px;
    padding: 10px 0;
}

.faq ul li span{
    display: inline-block;
    position: relative;
}

/*.faq ul li span::before{
    content: "\2022";
    font-size: 18px;
    color: #FFF;
    margin-right: 10px;
}*/





footer{
 padding-bottom: 70px;
}

footer h2.sectionHeading{
    color: var(--primary-color);
    font-size: 41px;
}

footer p{
    padding: 16px 0;
    display: block;
    margin: 0;
}

footer .btn{
    margin-top: 50px;
}

.contact_form{width: 26rem; margin: 0px auto; color: #fff; max-width:100%;}
.two_one{ float:left; color:#fff;  width:50%; padding-left:8%;}
.two_one.nomr {padding-left:0px; padding-right:8%;}
.two_one.center_box {float:none !important; padding-left:0px; margin:0px auto;}
.two_one table td.dis-inline, .two_one table td.dis-inline div{display:inline !important;}


.two_one input[type=text], .two_one input[type=password], .two_one input[type=tel], .two_one select, #forgot_password_box input[type=text], input[type=text], input[type=tel], input[type=password], #address_book select, select {
	    display: block;
    width: 100%;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--bs-body-color);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: var(--bs-body-bg);
    background-clip: padding-box;
    border: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
	max-width:350px;
	width:100%;
	margin-bottom:15px;
	max-width:100%;
}
.two_one table{width:100%;}
.two_one table td{ display:block !important; }
.two_one table td.main{padding-bottom:0px; text-align:left;}
.two_one table td b{font-weight:normal !important;}

.infoBoxButton{
	padding: 16px 26px;
    font-size: 16px;
    color: #FFF;
    display: inline-block;
    border-radius: 300px;
    text-transform: uppercase;
	    border: #FFF solid thin; width:auto !important; background:none !important;
}
#forgot_password_box {color:#fff; width:500px; max-width:90%; margin:0px auto;}
#forgot_password_box input[type=text]{max-width:100%;}
	
.infoBoxButton:hover , .btn-small a:hover{    opacity: 0.8; border:solid #fff thin;}
.faq h3.login_heading{font-size:2.2rem}
.two_one table td .inputRequirement{display:none !important;}
.formSubheading{padding-bottom:10px;     font-size: 18px;
    color: var(--primary-color);}

footer{float:left; width:100%;}
table a, .faqcontainer a{ color: var(--primary-color) !important; text-decoration:underline !important;}
.faqcontainer li{list-style:none;}
.contact_form .form-outline {text-align:left;}
.form-control{max-width:100% !important;}
.modal.show .modal-dialog{z-index:;}
.modal-backdrop.fade.show { display:none !important;  background-color: var(--bs-backdrop-bg); opacity:0.5;}

.modal{background: rgba(0,0,0,.5);}

#canvas-options{float:left;width:340px;} 
/*#canvas-container{ float:right; width: calc(100% - 350px); max-width:100%; overflow:auto; }
#canvas-options h3, #canvas-options .step-content{float:left; text-align:left;}*/
#canvas-options .step-content a, .sbSelector:link, .sbSelector:visited, .sbSelector:hover, .faqcontainer #canvas-options a{color:#fff !important; text-decoration:none !important; text-align:left; font-size:15px;}
.sbOptions .sbDisabled{font-size:15px;}

.faq #canvas-options ul li { padding:0px;}
.faq #canvas-options ul {margin:0px; text-align:left;}
.faq #canvas-options p{line-height:normal; margin:0px; padding:0px; font-size:15px; padding:5px 0px; text-align:left;}
.faq #canvas-options p{line-height:normal; margin:0px; padding:0px; font-size:15px; padding:5px 0px; text-align:left;}
.faq #canvas-options #category-description img{float:left; margin:0px 5px 5px 0px;}
#order-summary{color:#fff !important; float:right;}

#add-to-cart{ float: right;

    font-size: 16px;
    padding: 5px 15px;
    margin-right: 15px;
    margin-bottom: 10px;
}
.item-canvas-options{float:left; width:100%;}
#uploadtabs, #uploadtabs #tabs-1{background:none !important;} 
#uploadtabs .infoBoxButton{border:none !important;}

.mobile-menu .container-fluid{
    align-items: baseline;
}
.account_details{color:#fff;}
.old_order_Status{ float:right; width:68%;}
.old_order_Status.width-100{width:100%; float:left;}
#account_left_bar{float:left; width:30%;}
#account_left_bar ul{margin-left:0px; padding-left:0px;}
#account_left_bar li{float:left; width:100%; padding:5px 0px; text-align:left; font-size:16px;}
#account_left_bar li a{text-decoration:none !important;}
#account_left_bar li.heading_Sidebar{font-weight:bold;}
.old_order_Status .infoBoxButton{padding:5px 10px !important; font-size:12px !important;}
.old_order_Status tr.moduleRow td, .old_order_Status tr.moduleRowOver td{padding:10px 5px; border-bottom:1px solid #fff;}
.old_order_Status tr td{vertical-align:top;}
.text-white-table tr td{color:#fff !important; text-align:left;}
.button-right-box a{float:right; margin-left:5px;}
.table_sub_heading{
	padding-top:10px; padding-bottom:10px; border-bottom:1px solid #fff;
	
}
.pt-10{padding-top:10px;}
.order_date_id{padding:10px; border:1px solid #fff; }
.order-table-border{border-bottom:1px solid #fff; padding-bottom:10px; margin-bottom:10px; }
.order_id_box{padding-bottom:10px; font-weight:600;}
.order-table-border a{color:#fff !important; text-decoration:none;}
.reorder-table b{padding-bottom:8px;}

input#reorder_quantity{border-radius: var(--bs-border-radius);}

.productListing .productListing-heading{
	border-bottom: 1px solid #fff;
    padding-bottom: 10px;
    margin-bottom: 10px;
	
}

.productListing-even, .productListing-odd{border-bottom: 1px solid #fff; }
.productListing-even td, .productListing-odd td{padding:10px 0px;}
.cartlisting-button{float:right;}
.faqcontainer a.infoBoxButton{color:#fff !important; text-decoration:none !important;}
.faqcontainer a.btn-chkout{float:right;}
.text-white-table tr td.productListing-data{padding-left:15px;}
.text-white-table tr td.sub-total{text-align:right; padding-bottom:10px;}
.border-bottom{border-bottom: 1px solid #fff; padding-bottom:10px; color:#fff; }
.order-listing-delivery{border-bottom:1px solid #fff;}
.order-listing-delivery td{padding:8px 0px;}
.text-white-table .order-listing-delivery tr td input[type=radio]{ float:right;}
.text-white-table tr td.checkoutBarCurrent{color: var(--primary-color) !important;}
.infoBoxlb textarea{width:100%;}
.btn-float-right input{float:right !important;}
.cart_product_detail{border:1px solid blue;}
.modal{z-index: 999999;}

#checkout_payment_productListing{}
#checkout_payment_productListing td{padding:10px 0px; border-bottom:1px solid #fff;}
#checkout_payment_productListing td.product_thumb{max-width:100px; width:100px;}
#checkout_payment_productListing td.product_order_details{width: calc(100% - 250px); padding-left:20px;}
#checkout_payment_productListing td.new_price_col{text-align:right;}

#order-total-top-box{}
#order-status-product-listing{}
#order-status-product-listing td{padding-bottom:10px; padding-top:10px; border-bottom:1px solid #fff;}
#order-status-product-listing td.text-right, .text-white-table tr td.text-right{text-align:right !important;}
#sub_total{border:1px solid #fff; border-bottom:none;}
#sub_total td{padding:8px; border-bottom:1px solid #fff; }
.inputRequirement{display:none !important;}

#address_book form{}
#address_book form .infoBoxContents table{ margin:0px auto; width:26rem; max-width:100%;}
#address_book form .infoBoxContents table td{display:block; color:#fff; text-align:left;}
#address_book form .infoBoxContents table tr td{padding-bottom:0.5rem;}
#address_book form .infoBoxContents table tr td:last-child { padding-bottom:0rem; line-height:0px !important;}
#address_book td{color:#fff;}
#address_book table{max-width:100%; display:block;}

.address_box_button a{float:left;}
.address_box_button div{float:right;}
.address_box_button div button, .address_box_button a div{padding: 16px 26px;}
#cc_input_box select{width:48% !important; float:left; margin-right:1%; } 
.table-cancel-order td{color:#fff;}
.table-cancel-order{border-bottom:1px solid #fff; padding-bottom:10px; margin-bottom:10px;}
.button-right a{float:right;}
.table_listing-order-1 td{padding:8px 0px;}

#home_header footer{border-top: var(--primary-color) 15px solid !important;} 
.clear{clear:both;}
#tile-types{float:left; width:100%; overflow:auto; padding:30px 0px;}
#tile-types table{/*min-width:767px;*/ border-top:1px solid #fff; border-right:2px solid #000;}
#tile-types table td {padding:15px 10px; border-bottom:2px solid #000; border-left:2px solid #000; /*text-transform:uppercase; */}
#tile-types table th{background:#fff; padding:24px; vertical-align:top; border-bottom:2px solid #000; border-left:2px solid #000; /*white-space:nowrap;*/ width: 15px;font-size: 12px;}
#tile-types table th img{max-width:150px;}
#tile-types table td.tile_name{/*text-align:left;*/ font-weight:bold; color:#000; background:#fff;font-size: 12px;}
#tile-types table td.yes{color:#000; vertical-align:center; text-align:center; background:#fff; font-weight:bold;font-size: 12px;}
#tile-types table td.no{color:red; vertical-align:center; font-weight:bold; text-align:center; /*background:#cc0000;*/ background:#fff;font-size: 12px;}

.left50{float:left; width:49%;}
.right50{float:right; width:49%;}
.left33{float:left; width:32.33%; margin-left:1%;}
.right33{float:right; width:32.33%; margin-left:1%;}

#SliderTermsCond .modal-body{height:80vh; overflow:auto;}
#order-confirmation-button-box div{float:right;}

#new_address_edit table{width: 26rem; max-width:100%;} 
#new_address_edit td{display:block;}
#new_address_edit .inputRequirement{display:none !important;}
   
  #bg_design_tile{border-top: 15px solid #FFF; padding: 40px 0 75px 0; border-bottom: var(--primary-color) 15px solid; float: left; min-width: 100%; width:auto; }

#canvas-options{color:#fff;}
#canvas-options h3, #canvas-options .step-content{width:100%;}
#filelist div{color:#fff;}
#orientation-select {padding-top:10px;}
#category-description{padding-top:10px;}

#canvas-options h3 a{color:#fff !important;}

.modal-body p{font-family: "Raleway", sans-serif;  color: var(--bs-body-color);}

@media (min-width: 992px){
#SliderImage .modal-lg{
    --bs-modal-width: 39%;
}
 
}

@media only screen and (min-width: 768px) and (max-width: 992px){
	
	#canvas-options{float:left;width:100%;}
	/*#canvas-container{ float:right; width: 100%; max-width:100%; overflow:auto; }*/
	#order-buttons{float:left;width:100%; padding:10px 0px; }
	#order-summary {float:left;}
	.item-canvas-options{width:50%; padding-right:1%;}
	.item-canvas-options h3{display:block; width:100%; width:100%; }
	
}

@media only screen and (min-width: 10px) and (max-width: 767px){
	
	#canvas-options{float:left; width:100%;}
	/*#canvas-container{ float:right; width: 100%; max-width:100%; overflow:auto; }*/
	#order-buttons{float:left;width:100%; padding:10px 0px; }
	#order-summary {float:left;}
	.item-canvas-options{width:100%; }
	.item-canvas-options h3{display:block; width:100%; width:100%; }
	.order-table-border td{display:block; width:100%;}
	.order-table-border .button-right-box a{float:left; margin-top:10px;}
	
	.order-table-border.reorder-table td{display:table-cell;}
	.order-table-border.reorder-table td a{white-space:nowrap;}
	
	.lOrderDate, .lOrderID, .lOrderBy, .lOrderStatus, .lOrderTotal, .lOrderview{float:left; width:100%; position:relative; display:block; text-align:left; border-bottom:none !important; padding-left:50% !important;}
	.lOrderview{border-bottom:1px solid #fff !important;}
	.lOrderDate:before, .lOrderID:before, .lOrderBy:before, .lOrderStatus:before, .lOrderTotal:before, .lOrderview:before{position:absolute; left:0px; top:8px; width:50%; font-weight:bold; content:""}
	
	.lOrderDate:before{content:"Order Date:"}
	.lOrderID:before{content:"Order ID:"}
	.lOrderBy:before{content:"Order By:"}
	.lOrderStatus:before{content:"Order Status:"}
	.lOrderTotal:before{content:"Total:"}
	.lOrderview{padding-left:0px !important;}
	.lOrderview:before{display:none !important;}
	
	.old_order_Status tr.moduleRow td, .old_order_Status tr.moduleRowOver td{padding:5px;}
	.old_order_Status tr.moduleRow td.lOrderview, .old_order_Status tr.moduleRowOver td.lOrderview{padding:5px 5px 10px 5px;}
	
	#sub_total{width:100%;}
	.table-cancel-order td{float:left; width:100%; display:block; text-align:left;}
	.button-right a{float:left;}
	.left50, .right50, .left33, .right33{float:left; width:100%; margin:0px;}
 #bg_design_tile{padding:40px 20px 75px 20px;}

#home_offerings.offerings  .slick-track{display:block;}

#home_offerings.offerings  .slick-slide{width:100% !important; padding-bottom:20px;}

}

@media screen and (max-width: 1200px) {

    .leftHeader {
        flex: 0 1 40%;
        max-width: 40%;
    }
    .centerheader {
        flex: 0 0 35%;
    }

    .rightheader {
        flex: 0 1 45%;
        max-width: 45%;
    }

    .heroSlider-outer {
        padding-bottom: 75px;
    }

    .visionDesc {
        padding-left: 30px;
    }

}

@media screen and (max-width: 992px) {
    body{padding-top:126px;}
    .desktop-header{
        display: none;
    }

    .mobile-menu{
        display: block;
		position:fixed;
		float:left; width:100%; top:0px; left:0px; z-index:999999;
    }

    .actionLink.btn.btn-theme.cart {
        width: 40px;
        height: 40px;
        border-radius: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0;
        margin-left: auto;
        margin-right: 20px;
    }

    .actionLink.btn.btn-theme.cart img {
        width: 20px;
    }

    .navbar {
        padding: 20px 0;
    }

    .container-fluid {
        padding: 0;
    }

    button.navbar-toggler{
        position: relative;
        z-index: 3;
    }

    div#navbarNavDropdown {
        padding: 0 15px;
        background: #5d8bac;
        position: fixed;
        left: auto;
        top: 0;
        width: 100%;
        height: 100%;
        z-index: 2;
        text-align: center;    
        display: block;
        right: -100%;
        transition: all ease-out 0.3s;
    }

    div#navbarNavDropdown.show{
        right: 0;
    }
    

    .menuInner {
        height: 100%;
        text-align: center;
        display: flex;
        flex-flow: column;
        justify-content: center;
    }

    #navbarNavDropdown .actionLinks li:last-child{
        display: none;
    }

    .navbar-brand{
        margin-left: 15px;
    }

    .navbar-toggler{
        margin-right: 15px;
    }

    .navbar .navbar-brand {
        max-width: 250px;
    }

    .nav-link{
        font-size: 24px;
        font-weight: 600;
        color: #000;
        padding: 15px 0;
    }

    .actionLinks{
        padding: 15px 0 45px 0;        
        justify-content: center;
    }
    .socialLinks{
        justify-content: center;
        margin-top: 10px;
        margin-bottom: 0;
    }

    header {
        padding: 20px 38px;
    }

    .offerdata{
        padding: 0 25px;
    }
    .offerthumb {
        width: 100%;
    }
    .ourServices ul{
        grid-template-columns: repeat(2, 1fr);
    }
    
    .vision {
        padding: 75px 0;
    }
    
    .visionImg {
        max-width: 100%;
        max-height: 500px;
    }
    .visionDesc {
        max-width: 100%;
        padding: 30px 0 0 0;
    }

    .ourGoal {
        padding: 50px 0 85px;
    }

    .sectionHeading{
        padding: 20px 0;
    }
	.faq h2 {
    font-size: 26px;
}
.faq h3, .faq h3.kelson span{font-size:20px;}
}

@media screen and (max-width: 768px) {    
    

    .navbar {
        display: block;
    }
    

    .slick-prev, .slick-next{
        top: auto;
        bottom: 30px;
    }
    
    .slick-prev {
        left: 38%;
    }

    .slick-next{
        right: 38%;
    }

    .subheader {
        padding: 30px 0;
    }

    .subheader h1 {
        font-size: 20px;
    }

    .faq{
        padding: 35px 0 35px 0;
    }

    .ourServices ul{
        padding: 0;
    }

    .ourServices ul li>img{
        margin-bottom: 20px;
    }

    .ourServices {
        padding-bottom: 50px;
    }

    .offering .slick-prev, .offering .slick-next{
        margin: 20px 10px 0 10px;
        transform: none;
    }

    .goalWrapper p{
        margin: 30px 0 65px 0;
    }

    footer p {
        padding: 0;
    }

    footer .btn {
        margin-top: 30px;
    }

    footer{
        padding-bottom: 50px;
    }
	.faq h3.login_heading{font-size:2.0rem; }
}
@media screen and (max-width: 767px) {
	
.two_one{width:100%; padding:0px !important;} 
.two_one input[type=text], .two_one input[type=password], .two_one input[type=tel], .two_one select{max-width:100%;}
.faq h3.login_heading{ margin-bottom:10px !important; padding-top:10px; }	
.old_order_Status{ float:right; width:100%; padding-top:15px;}
#account_left_bar{float:left; width:100%;}
/*#cc_input_box td{display:block; width:100%;} */
#cc_input_box td{ width:100%;}
#cc_input_box select{width:100% !important; }
.faq h2 {font-size:26px;}
.faq h3, .faq h3.kelson span{font-size:20px;}
.checkoutBarCurrent, .checkoutBarTo, .checkoutBarFrom{float: none !important; display: table-cell !important; white-space: normal; padding-right:5px;}
#new_address_edit table{width:100%;}
#address_book form .infoBoxContents table{width:100%;}



}

@media screen and (max-width: 640px) {
    .ourServices ul{
        grid-template-columns: repeat(1, 1fr);
    }
	.checkoutBarCurrent, .checkoutBarTo{float:left; width:100%; display:block;}
}

@media screen and (max-width: 575px) {
    .slick-prev {
        left: 35%;
    }
    .slick-next {
        right: 35%;
    }
	.navbar .navbar-brand {
    max-width: 180px;
}
.actionLink.btn.btn-theme.cart{padding:0px; margin:0px;}
.mobile-menu .container-fluid {
    align-items: stretch;
}
}
#frame img{width:auto; max-width:none;}
#add-to-cart, #delete_btn{font-size: 15px;  letter-spacing: 0.5px;
    margin-top: auto;   place-self: flex-start;     padding: 16px 26px;     border-radius: 300px;
    text-transform: uppercase;}
#add-to-cart:hover{opacity:0.8;}
.sbOptions a{font-size:15px;}
.sbOptions a:hover, .sbOptions a:focus, .sbOptions a.sbFocus{color:#fff !important;}
.display_inline{display:inline !important;}
.pagination span{ float: right; display: block;  width: 100%; text-align:right;}
.pagination a:hover{ color:#fff;}
.display_table{display:table !important;}
.display_table td{display:table-cell !important; float:none;}
.update_button .infoBoxButton {line-height:25px;}
.update_button {vertical-align:top; }
.update_button div{float:right;}
#reorder_quantity {padding:5px;}
#order-summary.orderSummary_designTile{float:right; padding-right:15px;}

@media screen and (max-width: 767px) {
	.reorder-table #mobile_table table, .reorder-table #mobile_table table tbody, .reorder-table #mobile_table table tbody tr {display:block !important; width:100%; float:left;}
	.reorder-table #mobile_table table td{display:block; width:100% !important; position:relative; padding-left:30% !important; float:left;}
	.reorder-table #mobile_table table td{display:block; width:100% !important;padding-bottom:5px !important;}
	
	.reorder-table #mobile_table table td#reorder_history_Qut{float:left; width:49% !important;}
	.reorder-table #mobile_table table td#mobile_reorderCart{ width:49% !important;}
	
	.reorder-table #mobile_table table td:before{position:absolute; left:0px; top:5px; display:block;}
	.reorder-table #mobile_table table td.reorder_thumb img{width:100%;}
	.reorder-table #mobile_table table td.reorder_thumb:before{content:"Tile";}
	.reorder-table #mobile_table table td#mobile_tileName:before{content:"Name";}
	.reorder-table #mobile_table table td#reorder_history_Qut:before{content:"Quantity";}
	.reorder-table #mobile_table table tbody tr {border-bottom:1px solid #fff;}
	.reorder-table #mobile_table table tbody tr:last-child {border-bottom:0px solid #fff;}
	.reorder-table #mobile_table table tbody tr.hide_mobile_row{display:none !important;}
}
.text-left-align h3, .text-left-align p, .text-left-align span, .text-left-align li{ text-align:left !important;}
.text-left-align ul{padding-left:0px;}
.header_cat_button {position:relative;}
#cart_count {position: absolute; top: 0px; right: -7px; background: #f11; padding: 5px;
    border-radius: 50%; top: -11px; min-width: 25px; min-height: 25px; font-size:11px;}
.right_input input{float:right;}	
.name_box td div{line-height:normal; padding-bottom:0.5rem;}
	@media screen and (max-width: 990px) {
	#cart_count{font-size:11px;}	
	}

/* image upload overlay */
#image_upload_overlay{ height:100%; display:none; position:relative; z-index:9;  font-family: "Raleway", sans-serif;}
#image_upload_overlay.showUploadOverlay{display:block;  font-family: "Raleway", sans-serif;}
#overlay_textbox {width:100%; height:100%; display:flex; align-items:center; justify-content:center;  font-family: "Raleway", sans-serif;}
.image_upload_overlayContent{ padding:10px; background:rgba(0,0,0,0.7);  font-family: "Raleway", sans-serif; color:#fff; width:100%; text-align:center;}
.heading_upload_overlay{float:left; width:100%; font-size:2.0rem;  font-family: "Raleway", sans-serif;}
.image_upload_overlayContent p{float:left; width:100%; margin:0px; padding:10px 0px 0px 0px;  font-family: "Raleway", sans-serif;}


/* image upload overlay */ 
/*.showHideUpselect ul.sbOptions{ top:auto !important; bottom:30px !important;} */

/* start contact us page changes on 16-12-2024 */
.contact-us-left{float:left; width:48%;}
.contact-us-right{float:right; width:48%; color:#fff; text-align:left;}
.contact-us-right strong{display:block; font-size:110%;}
.contact-us-right div{width:34rem;}
.custon_tile_welcome {float:left; width:100%; color:#fff;}
.custon_tile_welcome p{float:left; width:100%; color:#fff;}
.how_itworks_right{float:right; width:48%;}
.how_itworks_left{float:left; width:48%;}
.custon_tile_welcome h2{font-size:130%; padding-bottom:10px; border-bottom:1px solid #fff; float:left; width:100%; margin-bottom:10px;}
.custon_tile_welcome ul{float:left; width:100%; margin:0px; padding:0px 0px 15px 0px;}
.custon_tile_welcome ul li{list-style-position:outside; padding-bottom:8px; margin-left:20px;     list-style-type: decimal;}
.custon_tile_welcome p{float:left; width:100%; padding-bottom:10px; margin:0px;}

	@media screen and (max-width: 990px) {
.contact-us-right div{width:100%;}
.how_itworks_right{float:right; width:100%;}
.how_itworks_left{float:left; width:100%;}
	}

	@media screen and (max-width: 767px) {
	.contact-us-left{float:left; width:100%;}
.contact-us-right{float:right; width:100%; color:#fff; text-align:left;}
.contact-us-right strong{display:block; font-size:110%;}
.contact-us-right div{width:100%; margin:0px auto;}
.how_itworks_right{float:right; width:100%;}
.how_itworks_left{float:left; width:100%;}
}
/*Toast css 7-01-2026 */
#toast-container {
  position: fixed;
  top: 20px;
  right: 20px;
  /*z-index: 9999; */
}

.toast {
  min-width: 280px;
  margin-bottom: 10px;
  padding: 14px 18px;
  border-radius: 6px;
  color: #fff;
  font-size: 14px;
  font-family: system-ui, -apple-system, sans-serif;
  box-shadow: 0 10px 20px rgba(0,0,0,0.15);
  opacity: 0;
  transform: translateY(-10px);
  animation: slideIn 0.3s forwards;
}

/* Toast types */
.toast-success { background: #16a34a; }
.toast-error   { background: #dc2626; }
.toast-warning { background: #f59e0b; }
.toast-info    { background: #2563eb; }

@keyframes slideIn {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeOut {
  to {
    opacity: 0;
    transform: translateY(-10px);
  }
}
/* start contact us page changes on 16-12-2024 */
