@font-face {
    font-family: 'open_sansregular';
    src: url('../fonts/opensans-regular-webfont.woff2') format('woff2'),
         url('../fonts/opensans-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'open_sansbold';
    src: url('../fonts/opensans-bold-webfont.woff2') format('woff2'),
         url('../fonts/opensans-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'open_sansitalic';
    src: url('../fonts/opensans-italic-webfont.woff2') format('woff2'),
         url('../fonts/opensans-italic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'open_sansbold_italic';
    src: url('../fonts/opensans-bolditalic-webfont.woff2') format('woff2'),
         url('../fonts/opensans-bolditalic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'open_sansextrabold';
    src: url('../fonts/opensans-extrabold-webfont.woff2') format('woff2'),
         url('../fonts/opensans-extrabold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
p{font-size: 20px; line-height: 30px;}
*{margin: 0; padding: 0;}
body{
	font-family: 'open_sansregular';
    font-size: 20px;
    line-height: 34px;
    color: #000;
	}
a{text-decoration: none; }
a:hover{transition: all .3s;}
h2{font-size: 36px;
    line-height: 34px; font-family: 'open_sansbold';}
/*Header Start*/
header{     padding: 20px 0; background-color: #000;}
.header-call{color: #ed7d31;  font-family: 'open_sansbold';
    font-size: 28px;
    text-align: right;
    text-transform: uppercase;
}
img.logo {
    width: 325px;
}

/*Header End*/


/*Footer Start*/
footer{ margin-top: 60px;  background-color:#ababab; }
.foter-baner img{width: 100%;}
footer h2{margin-bottom:20px; text-transform: uppercase;  font-family: 'open_sansbold_italic'; border-bottom: 1px solid #a4a4a4; padding-bottom: 25px;}
footer a{color:#000;}
/*Footer Start*/
.mt10{margin-top:10px;}
.mt20{margin-top:20px;}
.mt30{margin-top:30px;}
.mt40{margin-top:40px;}
.mt50{margin-top:50px;}
.mb10{margin-bottom:10px;}
.mb20{margin-bottom:20px;}
.mb30{margin-bottom:30px;}
.mb40{margin-bottom:40px;}
.mb50{margin-bottom:50px;}
.p0{padding: 0 !important;}
.ext-bold{font-family: 'open_sansextrabold' !important;}
.blue-color{color: #0060ff !important;}
.regular-btn{font-size: 22px !important;
    padding: 10px 30px !important;
    line-height: 24px;
    color: white;
    font-weight: bold !important;
    background-color: #f64e49;
    display: inline-block;
    border-radius: 4px;
    border: 2px solid #f64e49;}
.regular-btn:hover{color: white !important;
    background-color: #444;
    border-color: #444;
    transition: all .3s;}

   .regular-btn:focus{color: white !important;}
footer .regular-btn{margin: 30px 0; display: inline-block;}
footer .regular-btn:hover{background-color: #f64e49 !important; color:#fff;}
footer .regular-btn:focus{background-color: #f64e49; color:#fff;}
.service-img-box{    width: 500px;
    height: 300px;
    overflow: hidden;
    border: 5px solid #fa0043;
    border-radius: 5px 40px 5px;}
.service-img-box img{width: 100%;}
.covid-section h2{color: #fff;
	padding:20px 20px 0;
    font-size: 46px;
    line-height: 63px;
    margin-top: 0;
    text-align: center;
}
.spi-section{display: flex; align-items: stretch; margin: 40px 0;}
.spi-section img{   width: 100%; }
.spi-section img:last-child{border: 0;}
.spi-section div{
  line-height: 75px;
  font-size: 30px; margin: 10px;}
.covid-section{margin-top:50px; background-color: #7030a0;} 
.covid-section ul li{list-style-position: inside; color: #fff; }

.covid-section ul{padding: 20px 20px 0;}
.covid-section p{color: #fff; padding: 20px 20px 0px}
.call-us{ color: #fa0043; font-size: 45px;  margin-top: 18px; display: inline-block; font-family: 'open_sansbold'; text-decoration: none;}
.call-us:hover{text-decoration: underline; color: #fa0043;}
.covid-section img{    width: 100%; }
.covid-comitment {margin-top: 50px;}
.covid-comitment h2{    font-size: 46px;
    line-height: 65px; margin-top:0; color: #000; }
.covid-comitment ul li{    line-height: 32px;}
/*Plumbing page start*/
.service-container h1{font-family: 'open_sansextrabold';   color: #fa0043 ;   font-size: 60px;
line-height: 87px;}
.cal-today .bbb{width: 150px; margin-right: 10px;}
.covid-section b{font-size: 30px; line-height: 47px;}
.service-content {border-top: 5px solid #000;
    border-bottom: 5px solid #fa0043;}
.fremont-plumbing{color: #012060;     line-height: 70px; font-family: 'open_sansextrabold'; font-size: 63px; margin: 10px 0; }

.cal-today{ color: black;
    font-size: 50px;
    line-height: 75px;
    font-weight: bold;}
.baner img{width: 100%; border: 3px solid #f24749;}
.cal-today a{text-decoration: underline; color: #000;}
.cal-today a:hover{text-decoration: none; color: #000;}
.services-icons-wraper h1{font-size: 63px; color: #012060; text-align: center;}
.service-icons>div {
  color: #000;
  text-align: center;
  line-height: 75px;
  font-size: 30px;
}
.service-icons span{    font-size: 16px;
    line-height: 26px;
    margin-top: 10px;
    display: inline-block; font-weight: normal; color: #1f3763;}
.service-icons a i{width: 100%;     height: 60px; color: #1f3763;     font-size: 60px;}
.service-icons a:hover i{ color: #f24749; }
.service-icons a:hover i{color: #f24749;}
.service-icons a:hover span{color: #f24749;}
.service-icons i.plumbing-grease-trap-without-leak{font-size: 35px;     margin-top: 10px;
    height: 50px;}
.service-icons a{display: block;}
.equipment-section{background-color: #7030a0; padding: 30px;}
.equipment-section p{color: #fff; font-size: 26px;     line-height: 40px;}
.safe-plumber{padding: 20px;}
.safe-plumber p, ul, h2{    padding: 0 20px;
        font-size: 22px;
    line-height: 34px; }
 .cal-details{font-size: 22px;     padding-bottom: 33px;}
  .cal-details a{color: #000; font-size: 26px; line-height: 36px;}
 .cal-details a:first-child{font-size: 36px !important;}
 .cal-details a:hover{text-decoration: underline; color: #000;}
 {font-size: 35px;}
.safe-plumber ul li{ list-style: none; color: #92d050;}
.safe-plumber ul li:before {
  content: "\f111"; /* FontAwesome Unicode */
  font-family: FontAwesome;
  display: inline-block;
  margin-left: -1.3em; /* same as padding-left set on li */
  width: 1.3em; /* same as padding-left set on li */
  color: #92d050;
      font-size: 14px;
    position: relative;
    top: -3px;
}
.safe-plumber h2{color: #000;  line-height: normal;}
.covid-comitment{background-color: #7030a0;}
.our-commit h3{color: #fff; padding: 0 20px;}
.our-commit p{color: #fff; padding:0 20px;}
.our-commit ul{ padding:0 20px; text-align: left;}
.our-commit{padding-top: 20px;}
/*Plumbing page end*/

/*Form Start*/

.form__group {
  position: relative;
  width: 100%;
}

.form__field {
  font-family: inherit;
  width: 100%;
  border: 0;
  border-bottom: 2px solid #9b9b9b;
  outline: 0;
  font-size: 20px;
  font-weight: bold;
  color: #000;
  padding: 7px 0;
  background: transparent;
  transition: border-color 0.2s;
}
.form__field::placeholder {
  color: transparent;
}
.form__field:placeholder-shown ~ .form__label {
  font-size:20px;
  cursor: text;
  top: 20px;
}
.bootstrap-datetimepicker-widget table td.day{font-size: 16px; color: #000 !important;}
.bootstrap-datetimepicker-widget table th{font-size: 18px; color: #000 !important;}
.bootstrap-datetimepicker-widget table td span{color: #000;}
.schedule-form{font-size: 20px !important;  padding: 0 50px 50px !important; border: 1px solid #7030a0;
    border-right: 2px solid #7030a0; background-color: #fff; z-index: 9; height: 750px;}
.schedule-form input{font-size: 20px; font-weight: bold; padding: 20px 0 10px;}
.schedule-form h3{margin-top: 40px; text-align: center; font-size: 40px; color: #7030a0;}
.schedule-form .regular-btn{    margin-top: 40px;}
.form__label {
  position: absolute;
  top: 0;
  display: block;
  transition: 0.2s;
  font-size: 1rem;
  color: #9b9b9b;
  z-index: -9;
}

.form__field:focus {
  padding-bottom: 6px;
  font-weight: 700;
  border-width: 3px;
  border-bottom: 2px solid #7030a0;
}
.form__field:focus ~ .form__label {
  position: absolute;
  top: 0;
  display: block;
  transition: 0.2s;
  font-size: 1rem;
  color: #7030a0;
  font-weight: 700;
}

/* reset input */
.form__field:required, .form__field:invalid {
  box-shadow: none;
}

/*Form End*/
.red{color:#ff0000;}
.black{color:#000000;}
.blue{color:#0060ff;}
.call-today h1{
    color: black;
    font-size: 50px;
    line-height: 90px;
    font-weight: bold;
	}
.call-today .col-md-3 img{width:70%}
.call-today .col-md-2 img{width:90%}
.call-today .col-md-10 h2{padding-left: 0;}
.call-today .col-md-9 h2 {
    margin-left: 0;
    padding-left: 0;
    margin-top: 30px;
    margin-bottom: 35px;
}
.top-phone h1{
	color:#000;
	font-weight:bold;
	cursor:pointer;
	}
.top-phone h1 a{
	color:#000;
	font-weight:bold;
	text-decoration:none;
	}
.top-phone h1 a:hover{
	text-decoration:none;
	}
.middle-heading{
	font-size:2.2em;
	font-weight:900;
	margin:20px 0px;
	}
.middle-icon{
	margin-bottom:30px;
	}
.img-box{
	width:120px;
	margin:10px;
	}
.img-box{
	display: inline-block;
    max-width: 100%;
    height: auto;
    padding: 4px;
    line-height: 1.42857143;
    -webkit-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
	}
.img-box .img{
	margin:0 auto;
	}
.img-box p{
	margin-top:10px;
	font-size: 18px;
    font-weight: 600;
	}
.about-text{
    width: 87%;
    text-align: center;
    font-size: 1.5em;
    border: 1px solid #27547d;
    padding: 10px;
    margin: 0 auto;
    line-height: 40px;
	margin-bottom:20px;
	}
.services {
	margin:15px 0px;
	}
.services .mrdrain-img img{
	margin-bottom:15px !important;
	margin:0px auto;
	}
.services ul li{
    font-size: 26px;
    font-family: 'open_sansregular';
    line-height: 40px;
	}
.middle-heading{margin-top:30px;}
.calltoday-bottom{
	font-size:1em;
	color:#000;
	display: inline-block;
  margin-top:20px;
	}
.calltoday-bottom a{
	text-decoration:none;
	color:#000 !important;
	}
.calltoday-bottom a:hover{
	text-decoration:none;
	color:#000 !important;
	}
.drain-logo{margin: 40px 0 !important;}
.cities-anchor a{ display:block;padding:3px 0px;font-size: 18px;}
.cities-anchor a:hover{color:#0060ff;}
.cities-anchor a.active{color:#0060ff;}
.top-txt{color:#012060; font-size: 67px; font-weight: bold;}
.drain-logo{margin: 20px 0;}
.mt20{margin-top:20px;}
.carousel-inner>.item>a>img, .carousel-inner>.item>img, .img-responsive, .thumbnail a>img, .thumbnail>img{display: inline !important;}
.responsive-schedule{display: none;}
.responsive-schedule button{width: 50%;
text-align: center;
font-size: 18px;
color: #fff;
display: block;
padding: 11px 11px 12px 11px;
border-radius: 0;
transition: all .3s;
height: 50px;
}
.modal-backdrop{position: relative !important;}
.responsive-schedule .cal-now{background-color: #2760ca;}
.responsive-schedule .schedule-btn{background-color: #f64e49;}
.responsive-schedule .schedule-btn:focus{background-color: #f64e49;}
.responsive-schedule .cal-now:focus{background-color: #f64e49;}
.service-icons a p {
    font-size: 16px;
    line-height: 26px;
    margin-top: 10px;
    display: inline-block;
    font-weight: normal;
    color: #1f3763;
    font-weight: bold;
}
#schedule-message-popup{position: absolute; background-color: #fff;
    padding: 15px; font-weight: bold;}
.cal-service{margin-left: 10px;}
.service-icons a:hover p{color: #f24749;}
.middle-heading p.red{font-size: 30px;}
#schedule_message{text-align: center;}
.schedule-form .form__group:first-child{margin-top:0;}
#schedule_message .input-error-msg {
    border: 1px solid green;
    text-align: center;
    padding: 10px 0;
    margin-top: 30px;
}
.bootstrap-datetimepicker-widget .btn-primary{width: 60px;}

.foter-websites .col-md-4 { display: flex;}
.foter-charecter a {display: block;}
.foter-charecter img { width: 90px;}
.foter-site {position: relative;}
.foter-site a:first-child {display: block;}
.foter-site img {margin-top: 25px; width: 73%; }
.foter-site a:last-child {position: absolute; left: 13px; right: 0;
color: black; font-weight: bold; font-size: 24px; text-decoration: none;
}

.foter-websites { background-color: #fff; padding: 50px 0;}
.dl-btn{margin: 30px 0;}
.dl-btn .btn {
    padding: 18px 20px 20px;
    width: 100%;
    font-size: 38px;
    background-color: transparent;
    font-size: 22px;
    border: 1px solid #000;
    color: #fff;
    box-shadow: none;
    background-color: #000;
}
.dl-btn a:hover{color:#fff;}
.col-md-4:first-child .foter-site img {
    width: 100% !important;
}
.col-md-4:last-child .foter-site img{width: 87%;}
.dl-btn{display: none;}
@media (max-width: 3840px){
  .foter-charecter img{width: auto;}
.col-md-4:first-child .foter-site img {
    width: 640px !important;
 }
}
@media (max-width: 1920px){
.col-md-4:first-child .foter-site img {
    width: 295px !important;
}
.foter-charecter img {
    width: 90px;
}
}
@media (max-width:1199px){
  .schedule-form{
    height: 978px;
  }
}

@media (max-width:1024px){
  .col-md-4:first-child .foter-site img {
    width: 180px !important;
}
.foter-site img {
    width: 170px !important;
}
.foter-site a:last-child{font-size: 16px !important;}
.top-phone h1{
	color:#000;
	font-size:2.5em;
	font-weight:bold;
	cursor:pointer;
	}
.top-phone h1 a{
	color:#000;
	font-weight:bold;
	text-decoration:none;
	font-size:1.5em;
	}
.top-phone h1 a:hover{
	text-decoration:none;
	}
  .service-icons>div{width: 48%;}
  .foter-baner{margin-top: 0;}
  .covid-comitment img{width: 100%;}
  .schedule-form{
    height: 978px;
  }
  header{margin-bottom: 0;}
}
@media (max-width:768px){
  .foter-websites .col-md-4 {
    display: inherit;
    text-align: center;
}
.foter-site a:last-child {
    font-size: 20px !important;
}
.col-md-4:first-child .foter-site img {
    width: 73% !important;
}
.foter-site img{width: 73% !important;}
.foter-charecter img {
    width: 60%;
}
.foter-site {
    text-align: center;
    margin-bottom: 100px;
}
  .cities-anchor{width: 32% !important;}
.call-today .col-md-10{text-align: center;}
    .safe-plumber{width: 100% !important;}
  .schedule-form{width: 100% !important; height: auto;}
  .bbb{margin: 0 auto; display: block; margin-right: auto !important;}
  .call-today .col-md-2{text-align: center;}
  .call-today .col-md-2 img{width: 30%;}
  .header-call{margin-top:30px;}
  .call-today .col-md-2 img{width: 30%;}
  .services-icons-wraper h1{line-height: 75px;}
  .middle-heading p.red{line-height: 45px;}
  .calltoday-bottom{line-height: 60px;}
.top-txt{font-size: 40px !important;}
.call-today h1{
	color:#000;
	font-size:2.7em;
	font-weight:bold;
	}
.top-phone h1{
	color:#000;
	font-size:2em;
	font-weight:bold;
	cursor:pointer;
	}
.top-phone h1 a{
	color:#000;
	font-weight:bold;
	text-decoration:none;
	font-size:1.2em;
	white-space:nowrap;
	}
.top-phone h1 a:hover{
	text-decoration:none;
	}
.calltoday-bottom{
	font-size:1em !important;
	/*font-size: 25px !important;*/
	color:#000;
	display: block;
	}
.calltoday-bottom a{
	text-decoration:none !important;
	color:#000 !important;
	display: block;
	}
.calltoday-bottom a:hover{
	text-decoration:none;
	color:#000 !important;
	}
.mrdrain-img{
	text-align:center !important;
	}
.mrdrain-img img{
	text-align:center !important;
	margin: 0px auto;
	}
.top-txt{font-size: 40px;}
.covid-comitment img{width: 100%;}
.service-icons{display: inherit; align-items: normal;}
header img{width: 100%;}
.service-icons>div{width: 48% !important; float: left;}

}
@media (max-width:600px){
  .calltoday-bottom a{font-size: 30px !important;}
  .col-md-4:last-child .foter-site{margin-bottom: 0;}
.dl-btn {
    display: block;
    position: absolute;
    bottom: 21px;
    width: 100%;
}

  .cities-anchor{width: 50% !important;}
  .cal-details a{font-size: 22px;}
  .service-icons{margin-top:20px !important;}
  .schedule-form input{padding-top: 20px; line-height: 25px;}
  .form__group textarea{position: relative; margin-top:15px;}
.schedule-form .modal-footer{display: flex; justify-content: center;}
  .covid-comitment{margin-top:20px;}
  .covid-comitment h2{font-size: 23px !important; margin-bottom: 20px; line-height: 34px !important;}
  .modal-header{text-align: center;}
.responsive-schedule{
    position: fixed;
    bottom: 0px;
    width: 100%;
    z-index: 99;
    display: flex;

}

.fremont-plumbing{padding: 0;     font-size: 43px;  line-height: 50px;}
.cal-service{margin: 20px auto 25px auto;}

.schedule-form .modal-footer{text-align: center !important;}
.cal-today .bbb{    margin: 20px auto 25px auto;}
.cal-today{font-size: 22px; text-align: center;}
.cal-today img{display: block;}
.footer{margin-top:0;}
.foter-baner{height: 220px;}
.schedule-form{display: none;}
.modal-dialog{display: block;}
.cal-today{line-height: normal; padding-top: 30px;}
footer{margin-top:0;}
.foter-baner{margin-top:0;}
.call-today .middle-heading p{padding: 0 20px;}
.call-today {padding: 30px 30px 0;}

.calltoday-bottom{line-height: 70px;}
.services-icons-wraper h1{font-size: 24px; line-height: 26px;}
.services-icons-wraper {margin-top: 0;}
.service-icons>div {
     width:auto; 
    padding: 30px 0;
   height: 150px;

}
.schedule-form .regular-btn{margin-top: 0;}
.schedule-form h3{margin-top: 0; font-size: 30px; text-transform: uppercase; font-weight: bold;}

.modal-header .close{color: black;
opacity: 10;
font-size: 43px; position: absolute; right: 0;
width: 50px;
top: 5px;}
.responsive-schedule .schedule-form{padding: 0 0 !important; margin: 0; border: 0;}
.desk-schedule{display: none;}
.modal-body{position: sticky !important; padding: 15px 0 50px !important;}
.call-today .col-md-10{text-align: center !important;}
.call-today .col-md-2 img{width: 60%;}
.call-today .col-md-2{text-align: center;}
}
@media (max-width: 540px){
.foter-baner {
    height: 295px !important;
}

.call-today .col-md-10 h2{font-size: 28px !important;}
}
@media (max-width: 414px){
.foter-baner {
    height: 255px !important;
}
.dl-btn .btn{width: 100% !important; margin: 0 !important;}
}
@media (max-width:375px){
.foter-baner {
    height: 242px !important;
}
.dl-btn .btn{width: 100% !important; margin: 0 !important;}
}
@media (max-width:360px){
.foter-baner {
    height: 238px !important;
}
}
@media (max-width:350px){
  .cal-details a{font-size: 18px !important;}
.call-today h1{
	color:#000;
	font-size:2.8em;
	font-weight:bold;
	}
.top-phone h1{
	color:#000;
	font-size:3em;
	font-weight:bold;
	cursor:pointer;
	}

.top-phone h1 a{
	color:#000;
	font-weight:bold;
	text-decoration:none;
	font-size:0.650em;
	}
.top-phone h1 a:hover{
	text-decoration:none;
	}
.calltoday-bottom{
	font-size:1em;
	color:#000;
	}
  img.logo{width: 100%;}
.calltoday-bottom a{
	text-decoration:none !important;
	color:#000 !important;
	}
.calltoday-bottom a:hover{
	text-decoration:none;
	color:#000 !important;
	}
.cities-anchor a{ display:block;padding:3px 0px;font-size: 18px;}
}
@media (max-width:320px){
.foter-baner {
    height: 225px !important;
}
}
@media (max-width:280px){
.foter-baner {
    height: 214px !important;
}
}