/* CSS Document */



/* ##################################################################################### */
/*   FlexBox Rows - 1/2 Image and 1/2 Text - Alternating L to R - Move to pages one day.*/      
/* ##################################################################################### */
        

.service-row {
    display:flex;
    align-items: center;
    justify-content: center;
    }

.headingH2 { /*Birte*/
    font-weight: bold;
}

.address {
  overflow: auto;
  margin-bottom:20px;
}

.text-left { /* Text CSS for the image being on the right */
    flex-direction:column;
    max-width:610px;
    text-align: right;
    padding-right:20px;
    }

.text-right { /* Text CSS for the image being on the left */
    flex-direction:column;
    max-width:610px;
    text-align: left;
    padding-left:20px;
    }

.text-right img { 
    width: 610px;  
    border:1px solid #58bacc;  
}

.text-left img { 
    width: 610px;
    border:1px solid #58bacc;  
}
    
@media only screen and (max-width: 1020px) {
    .service-row {
        flex-direction: column; /* Aligns the items in the container into a column. */
        padding:20px;
        }
        
/* Forcing Order on Mobile */ 
    .service-row { /* Defined above forcing column */
    flex-direction: column;
  }
  .text-left{ /* Sets order of text layer on mobile */
    order: 1;
  }
    .text-right{ /* Sets order of text layer on mobile */
    order: 1;
  }
  .image-block { /* Sets order of image layer on mobile */
    order: 2;
    margin-top: 20px;
  }

}




/*##################################################*/
/*     About Us Birte's Site Styles - 2025-08-21    */
/*##################################################*/

     .rowCont { 
     	overflow:hidden; }
		 
     .rowCont img { margin:40px;
		 }
		 
     .rowCont h1 { Margin: 40px 5px 0 -1px;
		 }	 
		 
	.rowCont h2 { 
		margin-top:10px;
		text-transform:uppercase;
/*		font-size:1.5em;*/
		}
		 
	.rowCont p {
		text-align:justify;
		 }
		 	 

@media only screen and (max-width: 750px) {
     .rowCont .bubuy { display: none;}
     .rowCont img { margin:20px 5px 5px 5px;		 }
      .rowCont h1 { Margin: 20px 5px 0 5px;

		 }	
		 
}

 /*#############################################*/
/*     From Birte's Site Styles - 2025-08-21    */
/*##############################################*/
  
  .butOrange { /*Indexd and Service.php*/
  display: inline-block;
  font-size:1em;
  text-align:center;
  border:1px solid #d5573b;
  border-radius:15px;
  background:#d5573b;
  padding:5px 25px 5px 25px;
  color:#fff;
  margin-top:20px;
  margin-left:15px;
}


/*##########################################################*/
/*          Birte's  Portfolio           */
/*##########################################################*/

.portRowWrap {
	overflow:auto;
	margin-top:50px;
	
	}
	
.portRowWrap H2 {text-transform: uppercase;}
.portRowLeft img {float:left; width:450px; margin-right:50px; border:1px solid #5ebdce;}
.portRowRight img {float:right; width:450px; margin-left:50px;  border:1px solid #5ebdce; }

.portRowWrap table { width:680px;}

.portFooter { /*Table  Row*/
	margin:30px;
	font-size:1.5em;
	text-align:center;
}
.portFooter a {text-decoration:none;}

@media only screen and (max-width: 750px) {
.portRowWrap {margin-top:20px;}
.portRowWrap table { width:97%;}
.portRowLeft img { float:left; width:97%; margin:10px auto;}
.portRowRight img { float:right; width:97%; margin:10px auto; }
}


/*##########################################################*/
/*                    MOAR Portfolio Pages                  */
/*##########################################################*/     

.missing {
	color:#f00;
}

.portfolio-item {
	overflow:auto;
	padding:10px;
/*	border: 1px solid #CCC;*/
	}
	
.portfolio-item h2 {
	margin:0;
	padding-bottom:10px;
	}
	
.portfolio-item p {
	padding:0;
	}
	
.portfolio-item img {
	float:left;
	margin-right:20px;
	margin-bottom:20px;
	border:1px solid #58bacc;
	-webkit-border-radius:2px;
	-moz-border-radius:2px;
	border-radius:2px;
    width:450px;
	border:1px solid #5ebdce;
	}	

.portfolio-details-tbl {
	float:left;
	}
	
.portfolio-details-tbl  .header {
	font-size:1.0em;
	/*background-color:#EDF5FE;*/
	}
	
.portfolio-details-tbl .label { /* Table Header */
	font-weight:bold;
	padding:3px;
	}
.portfolio-details-tbl .desc {
	padding:3px;
	}








 /*##############################*/
/*     2024 New Flex Layout    */
/*##############################*/

.main-flex-container {
	max-width: 1450px;
	display:flex;
	padding: 0 150px;
	/*border:1px solid #0C0;*/
	}
.main-flex-wrap {
	padding:20px;
	display:flex;
	flex-grow:1;
	flex-direction:column; /* Virtical Display or Elements will wrap*/
	/*background:#CCC;*/
	}
	
@media only screen and (max-width: 1300px) {
	.main-flex-container {
		padding: 0;
}
}
@media only screen and (max-width: 1100px) {
	.main-flex-container {
		flex-direction: column;
		}
}

/* ================== 
 Sidebar Formatting 
 ================== */

.sidebar-wrap {
	overflow:auto;
	margin-top: 45px;/* Push it down with this */
	padding:20px;
	min-width:320px;
	max-width:320px;
	display:flex;
	flex-direction: column;
  }

  .sidebar-wrap h2 {
    display:block;  
    font-weight:bold;
  }

 @media only screen and (max-width: 1020px) {
	.sidebar-wrap {
    padding:10px;
    margin-top:0px;
    }
	.sidebar-wrap h2 {
  	margin-top:0; 
}
}
/* End Sidebar Include Formatting */

/*##############################*/
/*   Regular Page Hero Image  */
/*##############################*/

#heroRegCont {
	width:100%;
	/*overflow:auto; 2022-08-29*/
	overflow:hidden;
	border-bottom:1px solid #58bacc; /* Template Change */
}

#heroRegWrap {
	width:1000px;
	margin:0 auto;
	color: #fff;
	/*  Drop Shadow */
	text-shadow: 2px 2px 2px #000;
	font-size:42px;
	font-weight:400;
	margin-top:20px;
	margin-bottom:150px; /* Stock 300 Adjust the size of the view pane.*/

}

/* Set the same as bg-rot */
@media only screen and (max-width: 1200px) {
	#heroRegCont {
		display:none;}
	}


/*########################################################################*/
/*    Index - 2025 Heading come & go   */
/*########################################################################*/

 .ix-fancy {
      font-size: 1.9rem;
      line-height:1.1em;
      padding:0;
      margin:0 0 0 10px;
      text-transform: none;
      text-decoration: none !important;
    }

 .ix-fancy-subTitle {
      font-size: 1.9rem;
      margin:5px 5px 20px 10px;
      color:#838383;
    }

  @media screen and (max-width: 1220px) {
      .ix-fancy {
        margin-top:20px;
      }
              .ix-fancy { 
          font-size: 1.2em;
          line-height: 1.2;
       } 
       .ix-fancy-subTitle { 
          font-size: 1em;
          line-height:1.2;
       } 
        }

/*########################################################################*/
/*    Index - 2025-GPT Fixed 6 image rotator     */
/*########################################################################*/


:root{
  --slideCount: 6;
  --step: 7s; /* quicker pace; try 6s for snappier */
  --radius: 0.5rem;
}

.rotator{
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: var(--radius);
  isolation: isolate;
}

.rotator .slide{
  position: absolute;
  inset: 0;
  margin: 0;
  opacity: 0;
  z-index: 0;
  will-change: opacity, transform;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;

  -webkit-animation: rotatorFade calc(var(--slideCount) * var(--step)) cubic-bezier(.4,0,.2,1) infinite;
          animation: rotatorFade calc(var(--slideCount) * var(--step)) cubic-bezier(.4,0,.2,1) infinite;
}

.rotator .slide img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  pointer-events: none;
}

.rotator .slide:nth-child(1){ -webkit-animation-delay: calc(var(--step) * 0); animation-delay: calc(var(--step) * 0); }
.rotator .slide:nth-child(2){ -webkit-animation-delay: calc(var(--step) * 1); animation-delay: calc(var(--step) * 1); }
.rotator .slide:nth-child(3){ -webkit-animation-delay: calc(var(--step) * 2); animation-delay: calc(var(--step) * 2); }
.rotator .slide:nth-child(4){ -webkit-animation-delay: calc(var(--step) * 3); animation-delay: calc(var(--step) * 3); }
.rotator .slide:nth-child(5){ -webkit-animation-delay: calc(var(--step) * 4); animation-delay: calc(var(--step) * 4); }
.rotator .slide:nth-child(6){ -webkit-animation-delay: calc(var(--step) * 5); animation-delay: calc(var(--step) * 5); }

@-webkit-keyframes rotatorFade{
  0%   { opacity: 0; transform: scale(1.02); }
  12%  { opacity: 1; transform: scale(1.00); }
  28%  { opacity: 1; transform: scale(1.00); }
  40%  { opacity: 0; transform: scale(0.995);}
  100% { opacity: 0; transform: scale(0.995);}
}
@keyframes rotatorFade{
  0%   { opacity: 0; transform: scale(1.02); }
  12%  { opacity: 1; transform: scale(1.00); }
  28%  { opacity: 1; transform: scale(1.00); }
  40%  { opacity: 0; transform: scale(0.995);}
  100% { opacity: 0; transform: scale(0.995);}
}


/*########################################################################*/
/*    Index JumboTron Hover Layer with spanning black bg from the left    */
/*########################################################################*/

#hOverWrap {
	width:100%;
	overflow:auto;
	border-bottom:1px solid #58bacc;
	border:1px solid #f00;
margin-top:580px;

}

#hOver { /*This is the text wrapper - It pushes the contain open with bottom margin */
	width: 100%;
/*	text-align: center;*/
	text-align: right;
	margin-right:37%;
	float: right;
	padding:5px 20px;
	margin-bottom:500px; /* Stock 300 Adjust the size of the view pane.*/
	/*background-color: rgba(255, 255, 255, 0.82);*/
/*	border:1px solid #f00;*/
}

		#hOver h1 {
			font-size: 2.5rem;
/*			line-height: 1.25em;*/
			color:#58bacc;
			padding:0;
			margin:0;
		}

		#hOver .subTitle {
			font-size: 2.25rem;
			margin-top:5px;
			color:#838383;
			/*color:#fff;*/
			width:800px;
			float:right;
		}


/* Set the same as bg-rot */
@media only screen and (max-width: 1024px) {
	#hOverWrap {
		display:none;
	}

	/*	#hOver h1 { display: none; }
		#hOver .subTitle { display: none; }
		#hOver {
				margin-bottom:200px;
				background-color: transparent;
			}*/

	}






/*##############################*/
/*  OG  Index JumboTron Hover Layer     */
/*##############################*/
/*
#hOverWrap {
	width:100%;
	overflow:auto;
	border-bottom:1px solid #58bacc; 
	margin-top:20px;
}

#hOver {
	width:1000px;
	margin:0 auto;
	color: #fff;
	text-shadow: 2px 2px 2px #000;
	font-size:42px;
	font-weight:400;
	margin-bottom:650px; 
}

@media only screen and (max-width: 1024px) {
	#hOverWrap {
		display:none;}
	}*/

	
/*##############################*/
/*        About Us > Profile Cards  CRV        */
/*##############################*/
.profileCard {
	  width:540px;
	  margin:20px;
	  float:left;
	  background:#f4f4f4;
	  border:1px solid #ccc;
	  color:#333;
	  -webkit-border-radius:2px;
	  -moz-border-radius:2px;
	  border-radius:2px
}

.profileCard img {float:left;}	  
.profileCard p {margin:15px; display:none;} 
	  
.profileTitles {
		overflow:auto;
		width:100%;
		padding:5px 0px;
		text-align:center;
		font-size:1.3em;
		background:#e4e6e6;
		/*font-weight:600;*/
}

.profileStatsWrap {
	overflow:auto;
	padding-top:10px;
}

.profStatList a:link {color:#58bacc; text-decoration:none;}
.profStatList a:visited {color:#58bacc;}
.profStatList a:hover {color:#58bacc; text-decoration:underline;}
.profStatList a:actove {color:#58bacc;}

.linkApeal { /* Show Hide link without Href # */
	color:#58bacc; 
	cursor: pointer;
	cursor: hand; }

.profStatList { /* UL Room Details */
	height: 233px; /* 2016-09-20*/
	width:100%;
	font-size:.95em;
	margin-top: 3px;
	margin-bottom:3px;
}
.profStatList li {
	margin:5px;
	background:url(../images/det-underline.png);
	background-repeat:repeat-x;
	background-position:bottom;
	overflow:auto;
}

.statLiLeft { /* Span */
	background:#f4f4f4;
	float:left;
	padding-right:3px;
	font-weight:400;
}

.statLiright {/* Span */
	float:right;
	background:#f4f4f4;
	padding-left:3px;
}

@media only screen and (max-width: 600px) {
	.profileCard {
		width:95%;
		margin:20px 0;
	}
	.profileStatsWrap {
		clear:left;
	}
	.profStatList {
		height:auto;
		}
}


/*######################*/
/*       Testimonilas.php      */
/*#####################*/
blockquote { /* Orign - Generic.css *//* Orign - Generic.css *//* Orign - Generic.css *//* Orign - Generic.css *//* Orign - Generic.css *//* Orign - Generic.css *//* Orign - Generic.css *//* Orign - Generic.css *//* Orign - Generic.css *//* Orign - Generic.css *//* Orign - Generic.css *//* Orign - Generic.css *//* Orign - Generic.css *//* Orign - Generic.css *//* Orign - Generic.css *//* Orign - Generic.css *//* Orign - Generic.css *//* Orign - Generic.css *//* Orign - Generic.css *//* Orign - Generic.css *//* Orign - Generic.css *//* Orign - Generic.css *//* Orign - Generic.css *//* Orign - Generic.css *//* Orign - Generic.css *//* Orign - Generic.css *//* Orign - Generic.css *//* Orign - Generic.css *//* Orign - Generic.css *//* Orign - Generic.css */
	 /*font-family: 'Open Sans', sans-serif; 2022-06-12 Break*/
	}


.testimGroup {
	overflow:hidden;
	
	}
.testimGroup img {
	float:left;
	margin-right:30px;
	}
.testimGroup h3 {
	margin:0 10px 20px 0;
	font-size: 1.5em;
	}
	
.circle {
border-radius: 50%;
width: 200px;
border:1px solid #ccc;
/*background: white;*/
}


/*#################*/
/*       ReviewUs.php      */
/*################*/

.soc-med-review li {
		font-size:7em;
		display: inline-block;
		border: none; /* Overriding .ft-main-wrap li */
		margin:0 5px; /* Overriding .ft-main-wrap li */
       }

.reviewNote {
	display:block;
	font-size:14px;
	margin-top:110px;
	text-align:center;
	}

	/*Social Media Colors are in "Footer.css" */


.contact-gmapCont {
    width:100%;
    height:350px;
	overflow:hidden;
   /* Set the Height the same as in the css to eliminate the frame border */
	border-top:1px solid  #58bacc; 
     }

    /* FA Soc Med color styles  Jan 26, 16 - Uncommented*/
	/* For use in snippet */
/*      .color-fb {color:#3B5998;}
      .color-in {color:#1c87bd;}
      .color-gplus {color:#E14107;}
	  .color-yelp {color:#c41200;}
      .color-mail {color:#2eb9fa;}
      .color-tel {color:#43bf11;}*/
      


/*#########################################*/
/*       Service Copmonents - Ico, Title, Descrip      */
/*#########################################*/

.serviceItem {
  overflow: auto;
  min-height: 1px;
  box-sizing: border-box;
  margin:1em 0;
  /*border:1px solid #f00;*/
}

 @media only screen and (max-width: 640px) { 
.serviceItem {
	clear:left;
	width:97%;
	margin-bottom:20px;
}

 }
 
.iconBgPrimary {color:#58bacc;} /* Icons BG color set to primary */

.serviceItemIconPic { /* Ico or Picture containing layer */
	float:left;
	margin: 15px;
	/*Ico*/
	box-sizing: border-box;
	line-height: 0;
	font-size: 1.5em;
}

.serviceItemRight {
	overflow:auto;
}

.serviceItem h2 { /* Title */
	float:left;
	margin:.5em 0;
	/*padding: 10px 0;*/
	color: #58bacc;
}
 @media only screen and (max-width: 640px) { 
.serviceItemRight {
	clear:left;
}
.serviceItem h2 { 
padding:0;
}

 }
	
.serviceItem p { /* Description */
	clear:both;
	margin-left:.5em;
  }

.serviceItemMore { /* Surrounding layer of "More Link"*/
width:100%;
text-align:right;
	font-size: .95em;
}

  .serviceItemMore a { color:#58bacc; text-decoration: none;}
  .serviceItemMore a:visited { color:#58bacc;}
  .serviceItemMore a:hover { color:#2c2c2c; }
  .serviceItemMore a:active { color:#58bacc;}
  
  /* ========== End Service Elements ========== */