body { background-color: #81DE7610; }
/* ====================banner=============================== */
.banner{ 
  background-image: linear-gradient( 45deg, rgb(0,97,184) 0%, rgb(0,108,254) 100%); 
  padding: 160px 0 270px 0;
}
.banner .section_text h1,.banner .section_text p { color: #fff; }
.banner .section_text h1{margin-bottom: 18px; margin-top: 10px;}
.banner .section_img { justify-content: center; margin-top: 0px;}
.banner .section_text { text-align: center; padding-left: unset; margin-top: unset;}
.banner .section_text p { margin: auto; max-width: 28ch;}
.banner .section_text p:first-child{ font-size: 16px; font-weight: 500;}
.banner .design_1 { top: 20px; right: 230px; }
.banner .design_2 { top: 155px; left: 170px; }


/* ====================form=============================== */
.instant_quote .form_title_1{ margin-top: 0; }
.instant_quote{
  box-shadow: 0px 3px 8.5px 1.5px rgba(0, 0, 0, 0.05);
  position: relative;
  background-color: white;
  padding: 48px;
  max-width: 540px;
  margin: -100px auto 100px auto;
}
.instant_quote::before{
  content: "";
  display: block;
  width: 277px;
  height: 127px;
  background: url(../png/dotted_line.png) no-repeat center;
  position: absolute;
  top: -117px;
  right: 72px;
}
.instant_quote::after{
  content: "";
  position: absolute;
  border-right: 32px solid var(--light_green);
  border-top: 32px solid var(--light_green);
  border-left: 32px solid transparent;
  border-bottom: 32px solid transparent;
  top: 0;
  right: 0;
}
#instantQuote{
  display: flex;
  flex-direction: column;
  color: var(--text_grey);
}
.checkbox_div label{ margin-left: 10px; }
.checkbox_div{
  display: flex;
  align-items: center;
  margin-top: 8px;
}
#instantQuote input,
#instantQuote textarea{
  padding: 16px 12px;
  border: 1px solid #47474725;
  margin: 8px 0;
  color: var(--text_gray);
}
#instantQuote textarea{ height: 183px ; }
.instant_quote_btn{
  padding: 16px 48px;
  border:none;
  margin: auto;
  margin-top: 20px;
}

/* ====================media_queries=============================== */
@media only screen and (max-width:1025px){
.banner .design_1 { top: 0px; right: 0px; }
.banner .design_2 { top: 155px; left: 0px; }
.banner .section_text p { font-size: 18px; }
.banner .section_text h1 { font-size: 27px; }
.banner { padding-bottom: 170px ;}
.instant_quote::before{display: none;}
}

@media only screen and (max-width:767px){
body{background-color: unset;}
.banner .section_text h1 { font-size: 18px; }
.banner .section_text p { font-size: 14px; }
.instant_quote{margin-bottom: 30px; padding: 48px 28px;}
}
