body {
  font-family: 'Open Sans', sans-serif;
  background-color: #FFFFFF;
}
ul {
  margin: 10px ;
}
.mainsect { text-decoration: none; }
.fa {padding-right: 10px;}
.wrapper {
  width: 1300px;
  margin-right: auto;
  margin-left: auto;
}
.logo {
  margin-top: 15px;
  float: left;
  width: 315px;
}
.responsive-img{
  max-width:100%;
  height:auto;
  display:block;
}
.top-signature {
  margin-top: 20px;
  float: right;
  width: 410px;
}
.phone {
  color: #2481c4;
  font-size: 34px;
  line-height: 34px;
  text-align: right;
  letter-spacing: -0.5px;
}
.name {
  color: #000000;
  font-size: 14px;
  line-height: 32px;
  text-align: right;
}
.blue {
  color: #338cde;
  padding-left: 2px;
}
.grey {
  color: #555555;
  font-weight: lighter;
}
.serv_head {
  font-weight: bold;
}
.srv_txt {
  color: #555555;
}

.grid2 {
   color: #464646;
}
.grid3 {
  color: #ffffff;

}
.street { 
  padding-left: 30px;
 }

 .hours {
  padding-left: 34px;
 }

.appt {
  padding-left: 34px;
}

.box {
  background-color: #c0c0c0;
  border: 1px solid #eeece9;
  padding: 35px;
}


.menu-placement {
  margin: 35px 0 35px 0;
  padding: 15px 0 15px 0;
  background-image: url(images/TD-nav-background.png), url(images/TD-nav-background.png);
  background-repeat: repeat-x, repeat-x;
  background-position: top, bottom;
}
.pipe {
  padding-left: 10px;
}
.menu2 {
  padding-top: 90px;
}
.sl1 {
  width: 100%;
}

 .grid-container {
 background-color: #eeece9;
 padding: 20px;
 display: grid;
 grid-template-columns: auto auto auto;
}

 .grid-container2 {
 background-color: #eeece9;
 padding: 20px;
 display: grid;
 grid-template-columns: auto auto ;
 float: left;
}

.g2 {
  background-color: #ffffff;
}

.g3 {
  background-color: #4d5468;
  padding: 20px;

}
.g4 {
  background-color: #c0c0c0;
}

.grid-item {
  margin-right: auto;
  margin-left: auto;  
}
/* Button */

.myBtn1 {
  color: #ffffff;
    border: 1px solid white;
    padding: 25px; 
}

/*social media*/
.sm {
  padding-left: 236px;
}

/* Button */

.myBtn1 {
  color: #ffffff;
    border: 1px solid white;
    padding: 10px; 
    width: 300px;
     margin-right: auto;
  margin-left: auto;  
}

.myBtn2 {
  color: #ffffff;
  padding-left: 15px;  
}

a:hover {
  background-color: #ececec;
}

.doc {
  padding: 25px 30px 0 0;
}
.mainHeader {
  color: #6aaae5;
  font-size: 21px;
}

.slider {
  background-color: #eeece9;
  padding: 20px;
}

/*review slider */
.testimonial_subtitle{
    color: #318add;
    font-size: 12px;
}
  .testimonial_btn{
    background-color: #373d4b !important;
    color: #fff !important;
 }
 .seprator {
    height: 2px;
    width: 56px;
    background-color: #318add;
    margin: 7px 0 10px 0;
    margin-right: auto;
    margin-left: auto;
}

.icon {
  padding-left: 445px;
}

/*map*/

/* Style inputs with type="text", select elements and textareas */
input[type=text], select, textarea {
  width: 100%; /* Full width */
  padding: 12px; /* Some padding */  
  border: 1px solid #ccc; /* Gray border */
  border-radius: 4px; /* Rounded borders */
  box-sizing: border-box; /* Make sure that padding and width stays in place */
  margin-top: 6px; /* Add a top margin */
  margin-bottom: 16px; /* Bottom margin */
  resize: vertical /* Allow the user to vertically resize the textarea (not horizontally) */
}

/* Style the submit button with a specific background color etc */
input[type=submit] {
  background-color: #4CAF50;
  color: white;
  padding: 12px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

/* When moving the mouse over the submit button, add a darker green color */
input[type=submit]:hover {
  background-color: #45a049;
}

/* Add a background color and some padding around the form */
.container {
   background-color: #eeece9;

}
.footer {
  color: #ffffff;
}

/* Media Queires */
@media screen and (max-width: 1024px) {

.wrapper {
  width: 760px;
}
.pipe {
  display: none;
}

.projects-60 {
  width: 760px;
  float: none;
}

.icon {
  padding-left: 220px;
}

@media screen and (max-width: 760px) {


.wrapper {
  width: 480px;
}
.menu2 {
  padding-top: 160px;
}
.logo { width: 550px; float: left; }

.top-signature { 
float: left; }

.phone { font-size: 25px;
  
}

.grid-container {
  grid-template-columns: none;


}
.grid-container2 {
  grid-template-columns: none;


}
.projects-60 {
  width: 480px;
}


.icon{
  padding-left: 345px;
}


@media screen and (max-width: 480px) {
.wrapper {
  width: 320px;}

.menu2 {
  padding-top: 5px;
}

  .logo {
  float: none; 

  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 80%;
}
.myBtn1 {
  text-align: center;
}
.myBtn2 {
  padding: 0;
}

.grid-item {
  padding: 20px;
}
.doc {
  width: 100%;
}
.g2 {
  display: none;

}


/*social media*/
.sm {
  padding-left: 0;
  text-align: center;
  width: 100%;
}

.top-signature {
  float: none;
  width: 320px;
  
}
.phone {
  line-height: 38px;
  text-align: center;
}
.name {
  font-size: 12px;
  text-align: center;
}

h1 {
  font-size: 30px;
  line-height: 36px;
}
.projects-60 {
  width: 320px;
}

.myBtn1 {
  width: 200px;
}

.icon {
  padding-left: 15px;
}