/*    Front page columns and widgets    */

.container-flex-two {
    display: flex;
    justify-content: space-between; /* Distributes items evenly with space between them */
    float: right;
    display: block;
    margin-right: 35px;
    margin-top: 100px;
}

.column-two {
    /* Each column takes up roughly 33.33% of the width, minus space for gutters */
    width: calc((100% - 40px) / 3);
    background-color: #f2f2f2;
    padding: 20px;
    border: 1px solid #ccc;
    box-sizing: border-box; /* Ensures padding/border is included in the width calculation */
}


/*    End of front page columns and widgets    */

/*  Services page widgets and colums   */
.container-flex {
  display: flex; /* Makes the container a flex container */
  justify-content: space-between; /* Distributes space evenly between columns */
  gap: 1rem; /* Adds a gap (gutter) between columns */
}

.column {
  /* This ensures each column takes up an equal amount of available space */
  flex: 1; 
  padding: 1rem;
  background-color: #f0f0f0;
  border: 1px solid #ccc;
}

.container-grid {
  display: grid;
  /* Creates three columns of equal width (1 fractional unit each) */
  grid-template-columns: 1fr 1fr 1fr; 
  gap: 20px; /* Adds space between columns */
}

.column-2 {
  padding: 1rem;
  background-color: #f1f1f1;
  border: 1px solid #ccc;
  text-align: center;
}
/* End of Services page widgets and colums   */


h1{color: blue;}
body{text-align: center;}
/*div { background:url("images/a1.png") no-repeat; width:150px; height:38px; }*/
a:link {
  color: black;
  text-decoration: none;
}

a:visited {
  color: black; 
  text-decoration: none;
}

a:hover {
  color: gray;
  text-decoration: underline;
}

a:active {
  color: gray;
  text-decoration: underline;
}
#image-resizer{width: 3%; height: 20px;}
#image-resizer-2{width: 40%; height: 250px;}
#image-resizer-3{width: 25%; height: 225px;}
#image-resizer-4{width: 30%; height: 140px;}
#image-resizer-5{width: 50%; height: 160px;}
#image-resizer-6{width: 60; height: 60;}

#menu{float: right; margin-right: 35px;}
#social-media-icons{display: block; /* or other display that allows margins */
  width: 100%; /* optional, but useful */
  margin-left: auto}

input, select {
  width: 300px;
  height: 40px;
}
textarea {
width: 300px;
height: 40px;
}
input[type="submit"], button[type="submit"] {
  background-color: blue; /* Green background */
  border: none;              /* Remove default border */
  color: white;              /* White text color */
  padding: 15px 32px;        /* Some padding */
  text-align: center;        /* Center the text */
  text-decoration: none;   /* Remove text decoration */
  display: inline-block;     /* Get the buttons on the same line */
  font-size: 16px;           /* Increase font size */
  margin: 4px 2px;         /* Add some margin */
  cursor: pointer;           /* Add a pointer cursor on hover */
  border-radius: 8px;        /* Rounded corners */
}
#google-map{margin-top: 5%; margin-bottom: 5%; text-align: center; width: 100%;}
iframe{width: 50%; height: 350px;}

img {
  display: inline;
  margin: 25px;
  text-align: center;
 }

.footer{background-color: blue !important;
border: 3px solid gray; /* Example: 1.5px solid gray bottom border */
color: white;
margin: auto;
a:link {
  color: white;
  text-decoration: none;
}

a:visited {
  color: white;
  text-decoration: none;
}

a:hover {
  color: gray;
  text-decoration: underline;
}

a:active {
  color: gray;
  text-decoration: underline;
}
}
header {

  
height: 29.8%;
color: black;
a:visited {
  color: black;
  text-decoration: none;
}

a:hover {
  color: gray;
  text-decoration: underline;
}

a:active {
  color: gray;
  text-decoration: underline;
}

}

#logo{float: left;}
#site-map{float: right; margin-right: 15px;}
.main-heading-margin{margin-right: 20%;}
p{font-size: 20px;}