/* 
* Design by Finchcorp for the Fluid Web app 
*
*/

/* Site Wide Style Variables */
  :root {
  --fontfamily: 'Hind', sans-serif;
  --fontcolour1: rgb(33, 43, 68);
  --fontcolour2: rgb(0, 172, 218);
  --footerfont:        		 Arial;     
  --footerfontcolour: white;
  --menufontsize: 	         18px;	/* change default was 30px */  
  --footerBGcolour: black;
  --btncolour1: rgb(33, 43, 68);
  --btncolour2: rgb(33, 43, 68);  
  --btnfontcolour1: #ffffff;  
  --btnfontcolour2: #ffffff;    
  --BGColour: #343a40;
  --white: #ffffff;
  --BGoverlay:               rgba(0,0,0,0.5) !important;
  --BGmodal:   		         #f5f5f5 !important;
  --BGintro:                 url("/images/mybistro-bg-intro.jpg");
  --BGmain:                  url("/images/mybistro-bg-main-80ocp.jpeg");
  --BGlogin:                 url("/images/mybistro-bg-main-80ocp.jpeg"); 
  --BGpanel:                 url('/images/Mybistro_Admin_4.jpg')  

}  
/* Site Wide CSS Variables End */ 

/* Carousel CSS  */
@media (max-width: 768px) {
			 .fluidNav {
			 		display: none !important;
			 }
 }
@media (min-width: 768px) {
			 .fluidNavSmall  {
				 	display: none !important;
				 }   

    /* show 3 items */
    .carousel-inner .active,
    .carousel-inner .active + .carousel-item,
    .carousel-inner .active + .carousel-item + .carousel-item {
        display: block;
    }
    
    .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left),
    .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item,
    .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item {
        transition: none;
        margin-right: initial;
    }
    
    .carousel-inner .carousel-item-next,
    .carousel-inner .carousel-item-prev {
      position: relative;
      transform: translate3d(0, 0, 0);
    }
    
    .carousel-inner .active.carousel-item + .carousel-item + .carousel-item + .carousel-item {
        position: absolute;
        top: 0;
        right: -33.3333%;
        z-index: -1;
        display: block;
        visibility: visible;
    }
    
    /* left or forward direction */
    .active.carousel-item-left + .carousel-item-next.carousel-item-left,
    .carousel-item-next.carousel-item-left + .carousel-item,
    .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item,
    .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item + .carousel-item {
        position: relative;
        transform: translate3d(-100%, 0, 0);
        visibility: visible;
    }
    
    /* farthest right hidden item must be abso position for animations */
    .carousel-inner .carousel-item-prev.carousel-item-right {
        position: absolute;
        top: 0;
        left: 0;
        z-index: -1;
        display: block;
        visibility: visible;
    }
    
    /* right or prev direction */
    .active.carousel-item-right + .carousel-item-prev.carousel-item-right,
    .carousel-item-prev.carousel-item-right + .carousel-item,
    .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item,
    .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item + .carousel-item {
        position: relative;
        transform: translate3d(100%, 0, 0);
        visibility: visible;
        display: block;
        visibility: visible;
    }

}  

/* Admin Access CSS Start*/
@import url('https://fonts.googleapis.com/css?family=Numans');
          html, body {
                  overflow-x: hidden;
                 }
			  .switch {
			  position: relative;
			  display: inline-block;
			  width: 60px;
			  height: 34px;
			}
			
			.switch input {display:none;}
			
			.slider {
			  position: absolute;
			  cursor: pointer;
			  top: 0;
			  left: 0;
			  right: 0;
			  bottom: 0;
			  background-color: #ccc;
			  -webkit-transition: .4s;
			  transition: .4s;
			}
			
			.slider:before {
			  position: absolute;
			  content: "";
			  height: 26px;
			  width: 26px;
			  left: 4px;
			  bottom: 4px;
			  background-color: white;
			  -webkit-transition: .4s;
			  transition: .4s;
			}
			
			input:checked + .slider {
			  background-color: #2196F3;
			}
			
			input:focus + .slider {
			  box-shadow: 0 0 1px #2196F3;
			}
			
			input:checked + .slider:before {
			  -webkit-transform: translateX(26px);
			  -ms-transform: translateX(26px);
			  transform: translateX(26px);
			}
			
			/* Rounded sliders */
			.slider.round {
			  border-radius: 34px;
			}
			
			.slider.round:before {
			  border-radius: 50%;
			}
			 .bodyBGlogin{
			background-image: var(--BGlogin);
			background-size: cover;
			background-repeat: no-repeat;
			height: 100%;
			font-family: 'Numans', sans-serif;		       
			  } 
			 .bodyBGpanel{
			background-image: var(--BGpanel);
			background-size: cover;
			background-repeat: no-repeat;
			height: 100%;
			font-family: 'Numans', sans-serif;		       
			  }   
			.modalview {
			position: relative;
			background-color: var(--BGmodal);
			min-height: 250px;	
			}
			.container{
			height: 100%;
			align-content: center;
			}
			.card{
			width: 400px;	
			height: auto;
			margin-top: auto;
			margin-bottom: auto;
			background-color: var(--BGoverlay);
			}
			.hostmsgcard{
			height: 55px;
			margin-top: 5px;
			width: 250px;
			border-radius: 5px;
			background-color: var(--BGoverlay);
			}
			.column {
			 float: left;
			 padding-left: 20px;	
			}
			.colleft {
				width: 20%;
			}
			.collright {
				width: 80%;
			}
			.row:after {
			  content: "";
			  display: table;
			  clear: both;
			}
			.switchpanel {
			  position: absolute;
		      margin-left: auto;
			  margin-right: auto;
			  left: 0;
			  right: 0;
			  text-align: center;
			  background-image: url('/images/switchBG.jpg');
			  background-size: cover;
			  background-position: top center;	
			  width: 150px; 
			  height: 150px;
			  border-radius: 5px;
			}
		/*	.switch {
			  width: 50px; 
			  height: 50px; 
			  margin: 0 auto 0 auto; 
			  padding: 25% 0 0 97%;
			} */
			.hostmsg{
			margin:	5px 5px 0 -10px;
			color: white;
			font-size: 14px;
			}
			.storemsg{
			color: var(--fontcolour2);
			}
			.hostmsg_icon {
			font-size: 30px;
			color: var(--btncolour1);
			}
			.social_icon span{
			font-size: 45px;
			margin-left: 10px;
			color: var(--btncolour1);
			}
			
			.social_icon span:hover{
			color: white;
			cursor: pointer;
			}
		  .statusheadfont1 {
			  font-size: 40px;
			  font-family: var(--fontfamily);
			  font-weight: 600;
			  line-height: 1.2em;
			  text-transform: uppercase;
			  color: #ffffff;
			  letter-spacing: 0.2em;
			 }	
			.status_icon{
			position: absolute;
			left: 60px;
			top: -25px;
			}
			.social_icon{
			position: absolute;
			right: 20px;
			top: -25px;
			}
			.card-header h3{
			color: white;
			margin-top: 20px;
			}
			.header_icon {
			position: absolute;
			right: 15px;
			top: 10px;		
			font-size: 35px;
			color: var(--btncolour1);
			}
			.a_icon {
			color: #337ab7;
			}
			
			.input-group-prepend span{
			width: 50px;
			background-color: var(--btncolour1);
			color: black;
			border:0 !important;
			}
			
			input:focus{
			outline: 0 0 0 0  !important;
			box-shadow: 0 0 0 0 !important;
			
			}
			
			.remember{
			color: white;
			}
			
			.remember input
			{
			width: 20px;
			height: 20px;
			margin-left: 15px;
			margin-right: 5px;
			}
			.status_btn{
			font-size: 22px;
			color: var(--btnfontcolour2);
			background-color: var(--btncolour1);
			width: 125px;
			height: 45px;
			
			}
			.login_btn{
			color: var(--btnfontcolour2);
			background-color: var(--btncolour1);
			width: 100px;
			}
			
			.login_btn:hover{
			color: black;
			background-color: white;
			}
			
			.links{
			color: white;
			}
			
			.links a{
			margin-left: 4px;
			}
/* Admin Access CSS End */


/*fluid Style Library */
        
         html, 				
					body {
					  font-family:  var(--fontfamily);
       					 }
               .bodyBGcolor {
					    background-image: var(--BGmain); 
					    background-color: rgba(255,255,255,0.1);
					    background-repeat: repeat-y;
					    background-position:center top; 
					    background-size: cover;			       
                 }    
               .bodyBGintro {
					    background-image: var(--BGintro); 
					    background-color: var(--BGColour);
					    background-repeat: repeat-y;
					    background-attachment: fixed;
					    background-position:center top;
				        position: fixed; 
					    top: 0px; 
					    left: 0px; 
					    width: 100%;   
					    height: 100%;
               				}                
               .bodyBGmain {
					    background-image: var(--BGmain); 
					    background-color: rgba(255,255,255,0.1);
					    background-repeat: repeat-y;
					    background-position:center top; 
					    background-size: cover;			       
                 }  
            
                 .pagecontrol {
                 	min-height: 100vh;
 					position: relative;
                 }       					 
					  aside .text{
					  color: white;
					  font-size: 25px;
					  font-weight: 600;
					  line-height: 65px;
					  text-align: center;
					  background: #1e1e1e;
					  letter-spacing: 1px;
					}  
				.Absolute-Center {
				      display: flex;
				      align-items: center; 
				      justify-content: center; 
				      text-align: center;
				}    
				.img-center-header {
					  display: flex;
					  margin-top: 50px;
					  justify-content: center;
					  align-items: center;
					  height: 100px; 
					}
				.jqbox_center {
				    position: fixed;
				    left: 50%;
				    top: 50%;
				    transform: translate(-50%, -50%);
			  	}					  
					.img-center {
					  display: flex;
					  justify-content: center;
					  align-items: center;
					  height: 200px; 
					}
					.custom-control-label::before, 
					.custom-control-label::after {
					top: .8rem;
					width: .8rem;
					height: .8rem;
					}
						     				           
					.wrapper {
					  height: 150px;
					  width: 380px;
					  margin: 20px auto;
					}
					.wrapperheader {
					  width: 380px;
					  margin: 5px auto;
					}							
					.menu {
						width: 1000px;					 
						margin: -10px auto 0 auto;
					 }
					.innermenu {
						width: 400px;					 
						margin: -10px auto 0 auto;
					 }					 
					.instmenu {
						width: 380px;				 
						margin: 5px auto;
					 }					
					.navtext {
					  color:#ADADAC;
				      font-size: 14px;						
					
					}
					.navheight{
						height: 110px;
					}
			
					.navbar-brand{
						width: 10%;
					}															
					.navlog{
						width: 17%;
					}
                    hr {
                    width: 15%;
                    height: 6px;
                    text-align: center;
                    margin:20px auto 0 auto;
                    }
					.col-lg-4 .cardBG {
					  background-color: #ffeae2;
					  width: 99%;
					  height: 100%;
				      margin-right: auto;
				      margin-left: auto;
					}
					.cardBG img {
					  margin-top: 35px;
					}
					.card2BG {
					  background-color: #ffeae2;
					  width: 100%;
					  margin: 100px 0 0 0;
					}
					.card2BG img {
					  margin-top: 20px;
					  border-radius: 50%;
					}									
					.col-lg-4 h3 {
					  margin-top: 20px;
					  margin-top: 10px;					  
					  font-size: 16px;
					  font-family: 'Arial', sans-serif;
					  font-weight: 600;
					  line-height: 1.2em;
					  color: #414040;
					 }
					.col-lg-4 h2 {
					  margin-top: 30px;
					 }					 	
					.col-lg-4 .hfont {
					  margin-top: 30px;
					  font-size: 30px;
					  font-family: 'Dancing Script', cursive;
					  font-weight: 600;
					  line-height: 1.2em;
					  color: #414040;
					  text-decoration: none;
					 }
					.col-lg-4 .link {
					  background-color: transparent;
					  color: #414040;
					  border: none;
					  font-size: 14px;
					  font-family: 'Hind', sans-serif;
					  color: #414040;
					  text-decoration: none;
					 }					 
					.col-md-12 h2 {
					  margin-top: 30px;
					  font-size: 50px;
					  text-align: center;
					  font-family: 'Dancing Script', cursive;
					  font-weight: 600;
					  line-height: 1.2em;
					  color: #414040;
					  text-decoration: none;
					 }
					 
					.col-md-12 p {
					  margin-top: 30px;
					  font-size: 14px;
					  text-align: center;
					  font-family: 'Hind', sans-serif;
					  color: #414040;
					  font-weight: 600;
					  text-decoration: none;
					 }		
					.col-md-12-text-alt p {
					  margin-top: 10px;
					  font-size: 15px;
					  text-align: left;
					  font-family: 'Hind', sans-serif;
					  color: #414040;
					  font-weight: 600;
					  text-decoration: none;
					 }						 			  
					.col-md-12 {
				      background-color: #ffeae2;	
					}
                    .col-md-12 img {
                    width: 50%;
                    }					
					.divBG {
					    background-image: url("https://res.cloudinary.com/finchcorp/image/upload/v1612469119/Fluid%20he%20Color%20Salon/fluid-banner_w5woa4.jpg");
					    background-color: rgba(255,255,255,0.6);
					    background-position: center;
					    background-repeat: no-repeat;
					    background-attachment: scroll; 
				        background-size: 200% 200%;   
					    
					}
					.divBG h2 {
					  margin: 30px 0 50px 0;
					  font-size: 60px;
					  text-align: center;
					  font-family: 'Dancing Script', cursive;
					  font-weight: 600;
					  line-height: 1.2em;
					  color: white;
					  text-decoration: none;
					 }					
					.divBG .col-md-12 p {
					  margin: 30px 50px 50px 50px;
					  font-size: 20px;
					  text-align: center;
					  font-family: 'Hind', sans-serif;
					  color: white;
					  font-weight: 300;
					  text-decoration: none;
					 }
					 .divBG-mob {
					  margin: 0;
					 }	
					.divBG .featurette .col-md-12 {
				      background-color: rgba(25, 25, 23, 0.4);	
					}					 						

                    .col-fluid {
                      width: 100%;	
                      background-color: #ffeae2;
                    }					
					.col-fluid h2{
					  margin-top: 30px;
					  font-size: 30px;
					  text-align: center;					  
					  font-family: 'Dancing Script', cursive;
					  font-weight: 600;
					  line-height: 1.2em;
					  color: #414040;
					  text-decoration: none;
					 }
					.col-fluid p {
					  margin-top: 30px;
					  font-size: 14px;
					  text-align: center;
					  font-family: 'Hind', sans-serif;
					  color: #414040;
					  font-weight: 600;
					  text-decoration: none;
					 }
					.col-fluid-text-alt h2{
					  margin-top: 30px;
					  font-size: 30px;
					  text-align: center;					  
					  font-family: 'Dancing Script', cursive;
					  font-weight: 600;
					  line-height: 1.2em;
					  color: #414040;
					  text-decoration: none;
					 }					 	
					.col-fluid-text-alt p {
					  margin-top: 30px;
					  font-size: 15px;
					  text-align: left;
					  font-family: 'Hind', sans-serif;
					  color: #414040;
					  font-weight: 600;
					  text-decoration: none;
					 }						 					 							
					.col-md-6 h2 {
					  margin-top: 30px;
					  font-size: 50px;
					  text-align: center;
					  font-family: 'Dancing Script', cursive;
					  font-weight: 600;
					  line-height: 1.2em;
					  color: #414040;
					  text-decoration: none;
					 }
					.col-md-6 p {
					  margin-top: 0;
					  font-size: 14px;
					  text-align: center;
					  font-family: 'Hind', sans-serif;
					  color: #414040;
					  font-weight: 600;
					  text-decoration: none;
					 }
					.col-md-6-text-alt h{
					  margin-top: 30px;
					  font-size: 30px;
					  text-align: center;					  
					  font-family: 'Dancing Script', cursive;
					  font-weight: 600;
					  line-height: 1.2em;
					  color: #414040;
					  text-decoration: none;
					 } 	
					.col-md-12-h2 h2 {
					  margin-top: 30px;
					  font-size: 30px;
					  text-align: center;					  
					  font-family: 'Dancing Script', cursive;
					  font-weight: 600;
					  line-height: 1.2em;
					  color: #414040;
					  text-decoration: none;
					 } 						 
					.col-md-6-text-alt p{
						 font-size: 15px;
						 text-align: left;
					}					 
					.services-container {
						width: 60%;
						margin: auto;
					} 				  
					.col-md-6 {
				      background-color: white;	
					}
					.col-md-6 h3 {
					  margin-top: 20px;
					  margin-top: 10px;					  
					  font-size: 16px;
					  text-align: center;					  
					  font-family: 'Arial', sans-serif;
					  font-weight: 600;
					  line-height: 1.2em;
					  color: #414040;
					 }	
					.col-md-6 .link {
					  background-color: transparent;
					  color: #414040;
					  border: none;
					  font-size: 14px;
					  font-family: 'Hind', sans-serif;
					  text-decoration: none;
					 }
					 .md-12text {
					 	text-align: center;
					 	margin: 30px 100px;
					 }				 										

					 footer {
					 	background-color: var(--footerBGcolour);
					 	text-align: center;
					    color:  var(--footerfontcolour);
					  	font-size: 15px; 
					 }
					 .footdata {
					 	margin: 0px auto;
					  	text-align: center;
					    font-family: Arial;  	
					    color: var(--footerfontcolour);
					  	font-size: 12px; 
					 }
					 footer img {
					 width: 20%;
					 }
					.footdata a:link {
					  color: white;
					  background-color: transparent;
					  text-decoration: none;
					}
					.footdata a:visited {
					  color: green;
					  background-color: transparent;
					  text-decoration: none;
					}
					.footdata a:hover {
					  color: green;
					  background-color: transparent;
					  text-decoration: underline;
					}
					.footdata a:active {
					  color: green;
					  background-color: transparent;
					  text-decoration: underline;
					}					 					 	
					/* Three image containers (use 25% for four, and 50% for two, etc) */
					.column {
					  float: left;
					  width: 33.33%;
					  padding: 5px;
					}
					
					/* Clear floats after image containers */
					.row::after {
					  content: "";
					  clear: both;
					  display: table;
					}
					.col-fluid a {
					  margin-top: 6px;
					  width: 200px;
					  height: 40px;
					  background-color: transparent;
					  color: #414040;
					  border: none;
					  font-size: 12px;
					  font-family: 'Hind', sans-serif;
					  text-decoration: none;
					 }	
					.col-fluid a:hover {
					  width: 200px;
					  height: 40px;
					  background-color: transparent;
					  color: white;
					  border: none;
					  font-size: 12px;
					  font-family: 'Hind', sans-serif;
					  text-decoration: none;
					 }						 			
					.shopbtn {
				      display: block;
					  margin-left: auto;
					  margin-right: auto;
					  width: 200px;
					  height: 40px;
					  border-radius: 10px;					  
					  background-color: #ffeae2;
					  color: #414040;
					  border: none;
					  font-size: 12px;
					  font-family: 'Hind', sans-serif;
					  text-decoration: none;				  
					  					  
					}	
					.shopbtn:hover {
					  color: white;
					  background-color: black;
					  text-decoration: none;
					}
					.bannercontainer {
					  margin-top: 100px;
				      width: 100%; 
				      Height: auto;
					}
					
					.bannercontainer img {
		     	      display: block;
				      Height: auto;
				      width: 100%; 				      
					}					
					.fullcontainer {
				      width: 100%; 
				      Height: auto;
				      margin-top: 60px;
					  background-color: #ffeae2;
					}
					.fullcontainer img {
		     	      display: block;
		     	      margin-top: 100px;
					  margin-left: auto;
					  margin-right: auto;
					  padding: 100px 50px;
				      Height: auto;
				      width: 60%; 				      
					}
                    .fullcontainer h2 {
					  margin-top: 50px;
					  padding: 50px 0 20px 0;
					  font-size: 50px;
					  text-align: center;					  
					  font-family: 'Dancing Script', cursive;
					  font-weight: 600;
					  line-height: 1.2em;
					  color: #414040;
					  text-decoration: none;
					 }										
					.card-container {
					  width: 90%%;
					  height: 100%;
				      margin-right: auto;
				      margin-left: auto;
					}					
					.videoWrapper {
					  margin: 0 75px 0 75px;	
					  position: relative;
					  padding-bottom: 56.25%; /* 16:9 */
					  height: 0;
					  background-color: #ffeae2;					  
					}				   
					.videoWrapper iframe {
					  position: absolute;					  
					  top: 0;			  
					  width: 100%;
					  height: 100%;
					}				   				   
				   	
					.vertseperator {
						border-right: 2px solid  #CCCAC9;
					}
					.vertseperator-LR {
						border-right: 2px solid  #CCCAC9;
 						border-left: 2px solid  #CCCAC9;						
					}	
					.vertseperator-TB {
						display: none;
						width: 50%;
						margin-bottom: 10px;
						border-top: 2px solid  #CCCAC9;
 						border-bottom: 2px solid  #CCCAC9;						
					}																	   
					.table3c {
						width: 666px;
						margin: 0 auto;
						text-align: center;
					}
					.table3cchild a {
					  font-size: 15px;
					  text-align: center;
					  font-family: 'Hind', sans-serif;
					  color: #414040;
					  font-weight: 600;
					  text-decoration: none;
					}					
					.table3cchild p {
					  font-size: 15px;
					  text-align: center;
					  font-family: 'Hind', sans-serif;
					  color: #414040;
					  font-weight: 600;
					  text-decoration: none;
					}					
					.table3cchild {
						display: inline-block;
						width: 216px;
						margin:0 auto;	
					}
					.table3cseperator  {
						border-right: 2px solid  #CCCAC9;
 						border-left: 2px solid  #CCCAC9;						
					}		
																			
					.tableclear {
						clear: both;
							}	
					.table2c {
						width: 660px;
					}
					.table2c p {
					  font-size: 15px;
					  text-align: left;
					  font-family: 'Hind', sans-serif;
					  color: #414040;
					  font-weight: 600;
					  text-decoration: none;
					}					
					.tablechild1 {
						width: 400px;
						float: left;
						margin-right: 100px;	
					}						
					.tablechild2 {
						width: 100px;
						float: right;	
						margin-right: 50px;											
					}																								    									
 	        	/* Fluid Responsive Style Start */ 			    	       	        	
 	 	        	   /* Fluid Responsive Style 768px (iPad Portrait) Start */
								@media only screen and (max-width: 768px) {	 	 	        	    
								.menu {
									width: 730px; 
									margin: -10px auto 0 auto;
									padding: 0;									
								 }
								.navburger {
								  margin-left: 15px;
								  font-size: 32px; 
								  color: var(--btncolour1);
								}								 							
								.navcarttext {
							     	line-height: .2em; 
							     	text-align: center; 
							     	margin-top: 10px; 
							     	padding-top: 14px;
								    font-size: 22px;							
								 }
								.navcarttext2 {
					                font-family: var(--fontfamily);
									font-size: 35px; 
									color: white; 
									text-align: center;															
								 }									 									 
								.cartpostion {
									margin-left: 75%; 
									width: 130px; 
									height: 130px; 
									background-color: var(--btncolour1); 
									border-radius: 0px 0px 10px 10px;								
								 }	
								.catheaderimg {
								  margin: 60px 250px; 
								  width: 230px;								
								  height: auto;
								}									 							
								.catmenu img {
								  width: 245px;
								  height: auto;
								  margin-left: auto;
								  margin-right: auto;
								}							    				    
								  .footmenu {
								  display: flex;
								  justify-content: center;
								  width: 98%;
  								  height: 98%;
								 }
								 .footdata {
								 align-self: center;
								 }
				            	.footdata img {
				            	 margin-bottom: 10px; 
				            	 width: 180px;
				            	 height: auto;
				            	}		 	 
								}       	   	
 	 	        	    
 	 	        	   /* Fluid Responsive Style 768px (iPad Portrait) End */  
   	 	        	   /* Fluid Responsive Style 667px (iPad Portrait) Start */	
 								@media only screen and (max-width: 667px) {	 
								.menu {
									width: 635px; 
									margin: -10px auto 0 auto;
									padding: 0;									
								 }
								.navcarttext {
							     	line-height: .2em; 
							     	text-align: center; 
							     	margin-top: 10px; 
							     	padding-top: 14px;
								    font-size: 16px;							
								 }
								.navcarttext2 {
					                font-family: var(--fontfamily);
									font-size: 30px; 
									color: white; 
									text-align: center;															
								 }									 
								.cartpostion {
									margin-left: 75%; 
									width: 110px; 
									height: 130px; 
									background-color: var(--btncolour1); 
									border-radius: 0px 0px 10px 10px;								
								 }	
								.catheaderimg {
								  margin: 80px 150px; 
								  width: 240px;								
								  height: auto;
								}									 							
								.catmenu img {
								  width: 245px;
								  height: auto;
								  margin-left: auto;
								  margin-right: auto;
								}	
							    				    
								  .footmenu {
								  display: flex;
								  justify-content: center;
								  width: 98%;
  								  height: 98%;
								 }
								 .footdata {
								 align-self: center;
								 }
				            	.footdata img {
				            	 margin-bottom: 10px; 
				            	 width: 180px;
				            	 height: auto;
				            	}									
 								} 	 	        	   
   	 	        	   
   	 	        	   /* Fluid Responsive Style 667px (iPad Portrait) End */  	
   	 	        	   /* Fluid Responsive Style 568px (iPad Portrait) Start */	
 								@media only screen and (max-width: 568px) {	 
								.menu {
									width: 560px; 
									margin: -10px auto 0 auto;
									padding: 0;									
								 }
								.navburger {
								  margin-left: 5px;
								  font-size: 32px; 
								  color: var(--btncolour1);
								}								 							
								.navcarttext {
							     	line-height: .2em; 
							     	text-align: center; 
							     	margin-top: 10px; 
							     	padding-top: 14px;
								    font-size: 16px;							
								 }
								.navcarttext2 {
					                font-family: var(--fontfamily);
									font-size: 30px; 
									color: white; 
									text-align: center;															
								 }									 									 							 															 									 
								.cartpostion {
									margin-left: 70%; 
									width: 110px; 
									height: 130px; 
									background-color: var(--btncolour1); 
									border-radius: 0px 0px 10px 10px;								
								 }	
								.catheaderimg {
								  margin: 60px 110px; 
								  width: 200px;								
								  height: auto;
								}									 							
								.catmenu img {
								  width: 245px;
								  height: auto;
								  margin-left: auto;
								  margin-right: auto;
								}	
								    				    
								  .footmenu {
								  display: flex;
								  justify-content: center;
								  width: 98%;
  								  height: 98%;
								 }
								 .footdata {
								 align-self: center;
								 }
				            	.footdata img {
				            	 margin-bottom: 10px; 
				            	 width: 180px;
				            	 height: auto;
				            	}									
 								} 	 	        	   
   	 	        	   
   	 	        	   /* Fluid Responsive Style 568px (iPad Portrait) End */  	   	 	        	      	 	        	    	        	          		
								 					 			
                   
					@media only screen and (max-width: 415px) {	
					
													
								/* override sb-admin-2.css Start */
								.navbar-top-links .dropdown-user {
								  right: -85px;
								  left: auto;
								}
						       /* override sb-admin-2.css End */
								.wrapper {
								  height: 150px;
								  width: 380px;
								  margin: 20px auto;
								}
								.wrapperheader {
								  width: 380px;
								  margin: 5px auto;
								}
								.menu {
									width: 380px; 
									margin: -10px auto 0 auto;
									padding: 0;									
								 }
								.innermenu {
									width: 380px;					 
									margin: -10px auto 0 auto;
								 }					

					.carousel-inner {
						width: 415px;
						height: 300px;
					}
					.carousel-item {
						maw-width: 50%;
					}	
									
					.carouselimg {
							height: 200px;
					}					

					.navtext {
					  color:#ADADAC;
				      font-size: 15px;						
					
					}	
					.fullcontainer {
				      width: 100%; 
				      Height: auto;
				      margin-top: 60px;
					  background-color: #ffeae2;
					   	 
					}
					.fullcontainer img {
		     	      display: block;
		     	      margin-top: 100px;
					  margin-left: auto;
					  margin-right: auto;
					  padding: 50px 10px;
				      width: 90%; 
				      Height: auto;
				      
					}
				    #banner1-img{      
				        content:url("https://res.cloudinary.com/finchcorp/image/upload/v1612911724/Fluid%20he%20Color%20Salon/Fluid-banner2_qicj1u.png");
				    } 
				    #banner2-img{      
				        content:url("https://res.cloudinary.com/finchcorp/image/upload/v1612913427/Fluid%20he%20Color%20Salon/Fluid-banner1_hszh5a.png");
				    } 		
				    #banner3-img{      
				        content:url("https://res.cloudinary.com/finchcorp/image/upload/v1612913829/Fluid%20he%20Color%20Salon/fluid-banner3_cecncb.png");
				    } 					    			    						
			
					.divBG .col-md-12 p {
					  margin: 30px 0 0 0;
					  font-size: 17px;
					  text-align: center;
					  font-family: 'Hind', sans-serif;
					  color: white;
					  font-weight: 300;
					  text-decoration: none;
					 }
					 .divBG-mob {
					 margin: 30px 0 0 0;
					 }						 	
					 .md-12text {
					 	text-align: center;
					 	margin: 30px 10px;
					   font-size: 15px;					 	
					 }
					.col-md-12 p {
					  margin-top: 30px;
					  font-size: 14px;
					  text-align: center;
					  font-family: 'Hind', sans-serif;
					  color: #414040;
					  font-weight: 600;
					  text-decoration: none;
					 }
					.col-md-12 {
					  background-color: #ffeae2;
					}					 						 
					.table2c {
						width: 400px;
					}
					.table2c p {
					  font-size: 14px;
					  text-align: left;
					  font-family: 'Hind', sans-serif;
					  color: #414040;
					  font-weight: 600;
					  text-decoration: none;
					}					
					.tablechild1 {
						width: 200px;
						float: left;
						margin-right: 50px;								
					}	
					.tablechild2 {
						width: 100px;
						float: right;
						margin-right: 25px;												
					}														
					.tableclear {
						clear: both;
							}
					.table3c {
						width: 414px;
						margin: o auto;
					}
					.table3cchild a {
					  font-size: 15px;
					  text-align: center;
					  font-family: 'Hind', sans-serif;
					  color: #414040;
					  font-weight: 600;
					  text-decoration: none;
					}
					.table3cchild p {
					  font-size: 15px;
					  text-align: center;
					  font-family: 'Hind', sans-serif;
					  color: #414040;
					  font-weight: 600;
					  text-decoration: none;
					}											
					.table3cchild {
						display: inline-block;
						width: 130px;
						margin:0 auto;	
					}
					.table3cseperator  {
						border-right: 2px solid  #CCCAC9;
 						border-left: 2px solid  #CCCAC9;						
					}		
																		
                    .col-md-12 img {
                    width: 85%;
                    }
					.services-container {
						width: 98%;
						margin: auto;
					}
					.vertseperator {
						border-right: none;
					}
					.vertseperator-LR {
						border-right: none;
 						border-left: none;						
					}
					.vertseperator-TB {
						display: show;
						width: 50%;
						margin-bottom: 10px;
						border-top: 2px solid  #CCCAC9;
 						border-bottom: 2px solid  #CCCAC9;						
					}
					.videoWrapper {
					  margin: 0 20px 0 20px;	
					  position: relative;
					  padding-bottom: 56.25%; /* 16:9 */
					  height: 0;
					  background-color: #ffeae2;					  
					}				   
					.videoWrapper iframe {
					  position: absolute;					  
					  top: 0;			  
					  width: 100%;
					  height: 100%;
					}						
																					 	                    
                	footer img {
					 width: 50%;
					 }    					 						 						
                   }			
					
					@media only screen and (max-width: 375px) {
											
								.ccardmenu {
									width: 300px; 
									margin: 10px auto;
								 }						
								.wrapper {
								  height: 144px;
								  width: 340px;
								  margin: 20px auto;
								}
								.wrapperheader {
								  width: 340px;
								  margin: 5px auto;
								}
								.menu {
									width: 340px; 
									margin: 5px auto;
									padding: 0;									
								 }
								.innermenu {
									width: 340px; 
									margin: 5px auto;
									padding: 0;									
								 }							 	
								.instmenu {
									width: 350px;				 
									margin: 5px auto;
								 }					
					.carousel-inner {
						width: 375px;
						height: 271px;
					}
					.carousel-item {
						maw-width: 50%;
					}	
									
					.carouselimg {
							height: 180px;
					}					
	    			    								 						 
					.table2c {
						width: 360px;
					}
				
					.tablechild1 {
						width: 190px;
						float: left;
						margin-right: 48px;								
					}	
					.tablechild2 {
						width: 96px;
						float: right;
						margin-right: 24px;												
					}														

					.table3c {
						width: 374px;
						margin: o auto;
					}									
					.table3cchild {
						display: inline-block;
						width: 122px;
						margin:0 auto;	
					}

				

					}
					@media only screen and (max-width: 360px) {

									.ccardmenu {
									width: 300px; 
									margin: 10px auto;
								 }						
								.wrapper {
								  height: 132px;
								  width: 330px;
								  margin: 20px auto;
								}
								.wrapperheader {
								  width: 330px;
								  margin: 5px auto;
								}
								.menu {
									width: 330px; 
									margin: 5px auto;
									padding: 0;
								 }
								.innermenu {
									width: 330px; 
									margin: 5px auto;
									padding: 0;
								 }								 
								.instmenu {
									width: 355px;				 
									margin: 5px auto;
								 }								
					.carousel-inner {
						width: 360px;
						height: 260px;
					}
					.carousel-item {
						maw-width: 50%;
					}	
									
					.carouselimg {
							height: 172px;
					}					
	    			    								 						 
					.table2c {
						width: 345px;
					}
				
					.tablechild1 {
						width: 182px;
						float: left;
						margin-right: 46px;								
					}	
					.tablechild2 {
						width: 92px;
						float: right;
						margin-right: 23px;												
					}														

					.table3c {
						width: 359px;
						margin: 0 auto;
					}									
					.table3cchild {
						display: inline-block;
						width: 116px;
						margin: 0 auto;	
					}
					.table3cchild p {
					  font-size: 14px;
					  text-align: center;
					  font-family: 'Hind', sans-serif;
					  color: #414040;
					  font-weight: 600;
					  text-decoration: none;
					}						
					

					}
					@media only screen and (max-width: 320px) {
						        .row {
						          flex-direction: column-reverse;	
						        }				
					 			.wrapper {
								  height: 118px;
								  width: 295px;
								  margin: 20px auto;
								}
								.wrapperheader {
								  width: 295px;
								  margin: 5px auto;
								}
								.menu {
									width: 305px; 
									margin: 5px auto;
									padding: 0;
								 }
								.innermenu {
									width: 305px; 
									margin: 5px auto;
									padding: 0;
								 }								 
								.instmenu {
									width: 315px;				 
									margin: 5px auto;
								 }						
					.carousel-inner {
						width: 320px;
						height: 230px;
					}
					.carousel-item {
						maw-width: 50%;
					}	
									
					.carouselimg {
							height: 152px;
					}					
	    			    								 						 
					.table2c {
						width: 305px;
					}
				
					.tablechild1 {
						width: 161px;
						float: left;
						margin-right: 25px;								
					}	
					.tablechild2 {
						width: 85px;
						float: right;
						margin-right: 10px;												
					}														

					.table3c {
						width: 318px;
						margin: 0 auto;
					}									
					.table3cchild {
						display: inline-block;
						width: 103px;
						margin: 0 auto;	
					}
					.table3cchild p {
					  font-size: 14px;
					  text-align: center;
					  font-family: 'Hind', sans-serif;
					  color: #414040;
					  font-weight: 600;
					  text-decoration: none;
					}	
					}