/*
Theme Name: Media Street Customiser Child
Theme URI: https://www.media-street.co.uk/
Template:     mediastreet-bootstrap
*/


div, p, a, li, body, input, select, textarea, h4, h5 {font-family: brandon-grotesque, sans-serif;}
h1, h2, h2 a, h3, h3 a, #menu-header-menu > li > a, header a, .client-login .btn, a.btn, #menu-mobile-menu li a, .frm_style_formidable-style.with_frm_style .frm_submit button, .display-5{font-family: big-caslon-fb, serif;}

/* Global bits */ 
.admin-bar header {top: 32px!important;} 
p, li {color:rgba(44, 66, 85);	font-size: 1.2rem !important;}
.text-white p{color:#fff!important}
p:last-of-type  { margin-bottom: 0 !important; }
.project-content p a{font-weight:bold;text-decoration:none}
/* Gutter causing scroll bar issue */
.row { --bs-gutter-x: 0px!Important;}   
.promo.row {     --bs-gutter-x: 1.5rem!important;}   
/* Text Colours */
.text-navy, .project-content p a, .text-navy a, #menu-item-883.text-navy a:hover, #menu-item-1146.text-navy a:hover, .bg-mint h2 a.text-white:hover {color:rgba(44, 66, 85)!important}
.text-bluemid{color:rgba(92, 127, 146)}
.post-type-archive-projects #menu-item-885 a, .text-mint, .project-content p a:hover, a:hover, .current-page-ancestor a, .bg-navy h2 a:hover, #menu-header-menu > li:hover > a, #menu-header-menu > li.current_page_item > a, #menu-header-menu > li.current-menu-parent > a{color:rgba(154, 210, 207)!important}
.text-mintdark{color:rgba(137, 204, 200)}

p a{font-weight: bold; text-decoration: none!important; color:rgba(44, 66, 85) !important;} /* For all links in paragraphs */

a .img_effect, a:hover .hover_img_effect {display:inline-block}
a .hover_img_effect, a:hover .img_effect {display:none}

/* Backgrounds */
.bg-navy{background-color:rgba(44, 66, 85)!important}
.bg-bluemid{background-color:rgba(92, 127, 146)}
.bg-mint{background-color:rgba(154, 210, 207)}
.bg-mintdark{background-color:rgba(137, 204, 200)}
.bg-mint-tint{background-color:rgba(154, 210, 207,0.15)}
.bg-navy-tint{background-color:rgba(44, 66, 85,0.9)}
.bg-bluemid-tint{background-color:rgba(92, 127, 146, 0.60);    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out;}
.bg-bluemid-tint:hover{background-color:rgba(92, 127, 146, 0.80)}

#menu-header-menu > li > a { padding: 15px 20px;}

#menu-header-menu > li#menu-item-883 > a:hover{color:#fff!important}
/* Buttons */
.btn.btn-navy{background-color:rgba(44, 66, 85)!important}
.btn.btn-navy:hover, .btn.btn-gold:focus{background-color:rgba(154, 210, 207)!important}
.btn.btn-white:hover, .btn.btn-white:focus{background-color:rgba(154, 210, 207) !important ;color:#ffffff!important;border-color:rgba(154, 210, 207) !important;}


/* FAQ and Project Buttons */
.faq_btn, .project_btn{     transition: color 0.15s ease-in-out ; /* Add transition for fill and stroke */}
.faq_icon {
    fill: #FFF;
    width: 47px;height: 52px;
        transition: fill 0.15s ease-in-out, stroke 0.15s ease-in-out; /* Add transition for fill and stroke */
}

.faq_btn:hover .faq_icon,
.faq_btn:hover svg {
    fill: #2c4055; 
    stroke: #2c4055;
}
.project_btn:hover .faq_icon,
.project_btn:hover svg {
    fill: #9ad2cf; 
    stroke: #9ad2cf;
}   


#swipebox-overlay{background-color:rgba(44, 66, 85, 0.9)!important}
#swipebox-bottom-bar, #swipebox-top-bar{background-color:rgba(44, 66, 85)!important}

/* Service Boxes */
.service_box{border: 1px solid #F0F8F8 !important}

.service_box .bg-navy{   transition: background 0.15s ease-in-out }
.service_box:hover .bg-navy {
    background: rgba(154, 210, 207)!important
}
.service_box:hover h3, .service_box:hover .serv_icon{color:rgba(44, 66, 85)!important}

.service_box:hover .serv_icon{
color:rgba(44, 66, 85)!important}

.service_box img{transition: opacity 0.15s ease-in-out  }
.service_box:hover img{opacity: 0.8 }
.service_box .serv_icon {
	width: 30px;
	fill: #9ad2cf;
	stroke: #9ad2cf; transition: fill 0.15s ease-in-out, stroke 0.15s ease-in-out; /* Add transition for fill and stroke */
}
.service_box:hover .serv_icon{ fill: rgba(44, 66, 85)!important ; stroke: rgba(44, 66, 85)!important; }

                      
       
 
.w-250 { width: 275px!important;}
a.btn:hover{color:#fff!important}

/* Ticks Roofing and Building */
.bi.bi-check-circle {color: #5A7C8E;}

/* Banner title box */
.banner-title .p-5 { padding: 3rem 4rem!important;}

/* Blue Borders / lines */
.bg-navy-tint.border-mint, .border-mint, .border-end.border-mint, .border-bottom.border-mint {border-color: rgba(154, 210, 207)!important;}
.border-top.border-mint, .border-mint.border {border-color:rgba(154, 210, 207)!important;}
.mint_line {background: rgba(154, 210, 207); margin-top: 7px; display: inline-block; height: 18px; vertical-align: top; width: 2px;}
.mint_bottom_line { width: 60px;  border-bottom: solid 4px rgba(154, 210, 207); display: inline-block;}
.mint_large_line { background: rgba(154, 210, 207); margin-top: 7px; display: inline-block; height: 80px;vertical-align: top;width: 1px;}

/* Reviews */
.review-list li:last-child hr{display:none;}
.review-list{list-style-type: none!important;padding:0;}

/* Sitemap */
.sitemap_list li a{text-decoration:none}

/* Formidable */
.with_frm_style .frm_message, .frm_success_style{    margin: 0px!important;
    border: 0px!important;
    padding: 0px!important;}
.frm_style_formidable-style.with_frm_style .frm_error {
    font-size: 16px!important;
    color: #fff!important;
    margin-top: 10px;
    background: #B94A48;
    display: inline-block;
    padding: 6px 11px;
}
    .frm_style_formidable-style.with_frm_style .frm_blank_field label{    color: #fff!important;}
.frm_style_formidable-style.with_frm_style .frm_error_style{    padding: 0px!important;
    font-size: 18px!important;}
.bg-navy input, .bg-navy textarea, .client-login input{padding:10px 20px!important;line-height:130%!important;}
.bg-navy input, .client-login input{height:52px!important}
 .client-login input{  color: rgba(44, 66, 85, 1); font-size:1.2rem;}
 .client-login  ::placeholder { color: rgba(44, 66, 85, 1)}
input#field_dtyf2-0 {padding: 1px!important;height: 20px!important;width: 20px!important;}

#frm_field_8_container {  grid-column: span 6 / span 12;}
.frm_submit {  grid-column: span 6 / span 12;}
.with_frm_style .frm_checkbox input[type=checkbox] {
    width: 20px!important;
    height: 30px!important;
    padding: 15px!important;
}
.with_frm_style .frm_checkbox input[type=checkbox]:before {
    width: 13px!important;
    height: 13px!important;
    margin: -6px 0 0 -5px!important;
}
 .with_frm_style .vertical_radio .frm_checkbox{margin-top:13px!important}

/* Bullets */
ul li{list-style-type: none;}
.bullets ul{list-style-type:none;padding-left:0px}

.bullets li {margin-bottom: 10px;line-height: 115%;position: relative;padding-left: 26px;}
.bullets li:marker{display:none}

.bullets li:before {content: '\25A0';color: rgba(154, 210, 207);font-weight: 900;position: absolute;left: 1px;font-size: 28px;top: -1px;}
/* Mobile menu open / close button */

 .menu_toggle_new{height: 25px; padding: 15px 0 }
#closebtn {
	height: 25px;
	width: 25px;
	position: absolute;
	text-decoration: none;
	font-size: 36px !important;
	color: #fff;
	cursor: pointer;
	transition: background-position .3s;
	right: 0;
	top: 19px;
}

#closebtn span {cursor: pointer;}

.line2, .line3 {
	margin-top: 8px;
	background-color: rgba(154, 210, 207)!important;
	width: 33px;
	height: 2px;
	display: block;
	position: relative;
	opacity: 1.0;
	border-radius: 20%;
	transition: all .3s;}
    
body .line2 {	margin-top: 4px;}

body #closebtn.close .line2 {
  -webkit-transform: rotate(45deg) !important;
  transform: rotate(45deg) !important;
  margin-top: 9px !important;
}
body #closebtn.close .line3 {
  -webkit-transform: rotate(-45deg) !important;
  transform: rotate(-45deg) !important;
  margin-top: -2px !important;
}
.service_list{padding-left: 30px}


/* Mobile Menu */
#menu-mobile-menu{height: 75vh}
#menu-mobile-menu li{height: calc(100%/5) }
#menu-mobile-menu li a{height: 100%;display: flex; align-items: center; justify-content: center; /* This centers the content horizontally */} 
#menu-mobile-menu li a{position:relative}
#menu-mobile-menu > li > a:hover, #menu-mobile-menu > li.current_page_item > a{ color: rgba(154, 210, 207)!important}

/* Mobile Menu - box sizing is causing a slight slither of space to the right*/
.offcanvas.offcanvas-start{box-sizing:unset!important}
/* Mobile Menu - Lines between each menu item */
#menu-mobile-menu li a::before {content: ''; display: block;background-color:rgba(154, 210, 207)!important; bottom: 0; width: 10%; height: 2px; position: absolute;}
#menu-mobile-menu li:last-child a::before {width:0}





/* Footer Menu Mobile */
.d-none-link a{display:none!important}
.mobile_footer .accordion-item{ border:0; border-bottom: 2px solid rgb(154, 210, 207) !important;border-radius: 0 !important;}
.mobile_footer .accordion-button,  
.mobile_footer .accordion-button:not(.collapsed) {background:none!important; color: rgba(44, 66, 85) !important;   box-shadow: none; }
.mobile_footer #headingThree  .accordion-button{  border-bottom: 0 !important;}

.mobile_footer .accordion-button::before {
  content: "";
  flex-shrink: 0;
  width: 25px;
  height: 24px;
  content: "";
  background-image: url(/wp-content/uploads/2023/12/Arrow-Down-Mint.svg);
  background-repeat: no-repeat;
  background-size: 19px;
  transition: var(--bs-accordion-btn-icon-transition);
  right: 0;
  position: absolute;
  top: 20px;    margin-right: 0;
}
.mobile_footer .accordion-button:not(.collapsed)::before {
	background-image: url(/wp-content/uploads/2023/11/Arrow-Up-Mint.svg) !important;
      width: 25px;
  height: 24px;   background-size: 19px;
}
.accordion-button:not(.collapsed) {
} 


.fb_footer{
  fill: #2c4255!important;
}
.fb_footer:hover{}



footer .accordion-button::after{display:none!important}




.dropbox-pictures img{
width: 100%;
height: 200px;
object-fit: cover;
object-position: 25% 25%; }


@media (max-width: 992px) {
.dropbox-pictures img{
height: auto;
}


}







@media (min-width: 992px) {
.widescreen_img_header{width: 400px}


}

@media (max-width: 992px) {


.slick-list.draggable{padding:0px!important}
.banner-title img{max-width:200px}
.blog-gallery a {
    pointer-events: none;
}
.usps  .border-end{border-right:0px!important}
.frm_section_heading > .frm_form_field, .frm_fields_container > .frm_submit, .frm_grid_container > .frm_form_field, .frm_fields_container > .frm_form_field {
	grid-column: 1 / span 12 !important;
}
.with_frm_style .frm_form_fields > fieldset{padding-bottom:0px!important}
 .frm_style_formidable-style.with_frm_style .frm_submit button{margin:0px!important}

.w-250{width:100%!important}

.usps .w-75, .reviews.w-75, .m-100 {
    width: 100%!important;
}
.usps h3{width:100%!important}
.header img{max-width:40px!important}

#frm_checkbox_8-0 label {
	display: grid;
	grid-template-columns: 2fr 10fr;
	margin: 0;
	padding: 0;
}

#frm_checkbox_8-0 input{}
#frm_checkbox_8-0 span {  text-indent: 0;}
}


/* MD - LG  */
@media (min-width: 768px) and (max-width:1000px){ 
  
 


}

/* MD */
@media (max-width: 768px) { 
  
 



}

@media(max-width:576px){}

/* SM */
@media (min-width: 576px) { 


 }
