@import "@{parenturl}/less/mixins.less";
@import "@{themeurl}/less/vars.less";

.hidden{display:none !important;}

.button {
	background-color:fade(@blue, 79);
	color:#fff;
	display:inline-block;
	.font(Roboto, 700, 20px);
	padding:1em 3em;
	text-align:center;
	text-transform:uppercase;
	.hover();
	&:hover {
		color:#fff;
		background-color:@blue;
	}
}

.form-field {
	.font(Roboto, 400, 16px, 1.25);
	position:relative;
	padding-top:1em;
	margin-bottom:25px;
	label, input, textarea {
		.font();
		background:transparent;
	}
	label {
		display:block;
		position:absolute;
		padding-bottom: 10px;
		top:0;
		left:0;
		pointer-events:none;
		.translateX(.75em);
		.translateY(1.325em);
		transform-origin:left center;
		.transition();
		.frm_required {
			color:#FF4136;
		}
	}
	input, textarea {
		border:none;
		border-bottom:solid 1px #4c4c4c;
		display:block;
		outline:none;
		width:100%;
		padding:.25em .5em;
		resize:none;
	}
	&:focus-within,
	&.has-input {
		label {
			.translateX(0);
			.translateY(.2em);
			.font(@size:.75em);
		}
	}
	&.has-input {
		label {
			opacity:.5;
		}
	}
	&:focus-within {
		label {
			color:@blue;
			opacity:1;
		}
	}
}
.frm_submit {
	button {
		.button;
		display:block;
		width:100%;
		background-color: rgba(255,255,255,0.79);
		color: @blue;
	}
}

.npoo {
	.max-width(410px);
	> div {
		padding:10px 25px 25px;
	}
	h4 {
		background-color:@blue;
		border-top-left-radius:.5em;
		border-top-right-radius:.5em;
		color:#fff;
		.font(Roboto, 700, 24px);
		margin-bottom:0;
		padding:1em;
		text-align:center;
		text-transform:uppercase;
	}
	p {
		text-align:center;
		margin-bottom:0;
		&.bold {
			font-size:20px;
			font-weight:700;
		}
		b {
			color:@blue;
		}
	}
	.frm_forms {
		margin-bottom:15px;
	}
}

#above-footer {
	background-image:url('/wp-content/uploads/2022/02/footer.svg');
	background-size:cover;
	> div {
		max-width:1600px;
		.margin-ends(5vw);
		.vertAlign;
		gap:50px;
	}
	#footer-marble { order:1; }
	#contact-us {
		order:2;
		.max-width(540px);
		h4 {
			color:#fff;
			text-align:center;
			.font(Roboto, 700, 48px);
			margin-bottom:25px;
		}
		.form-field {
			color:#fff;
			input, textarea {
				border-bottom:solid 1px #fff;
			}
		}
	}
	#footer-brady { order:3; }
	
	.footer-info {
		.max-width(400px);
		display:grid;
		grid-gap:25px;
		a {
			color:#fff;
			.font(Roboto, 400, 16px);
			text-align:center;
			address {
				.inherit();
				.font();
				white-space:pre-wrap;
			}
			svg {
				display:block;
				height:1.5em;
				width:auto;
				margin:0 auto 10px;
				fill:currentcolor;
			}
		}
	}
}

#footer {
	background-color:#fff;
	padding:50px 50px 10px;
	border-bottom:10px solid @blue;
	.max({ padding:0 25px 5px; });
	> *:not(:last-child) {
		margin-bottom:25px;
	}
	> * {
		.max-width(1600px);
	}
	.geo-served {
		text-align:center;
		line-height:1.5;
	}

	.footer-menu {
		display:flex;
		gap:25px;
		.max({ flex-direction:column; });
		> li {
			flex:1;
			> a {
				.font(Roboto, 700, 1.5em);
				display:block;
				padding-bottom:.15em;
				border-bottom:1px solid;
				margin-bottom:.25em;
				white-space:pre;
			}
			&:nth-child(2) {
				flex:2;
				ul {
					columns:2 200px;
					column-gap:25px;
				}
			}
		}
	}
}

#after-footer {
    position: fixed;
    z-index: 999;
    left: 0;
    bottom: 0;
    width: 100%;
}
@media (max-width: 539px){
.grid[columns="4"][responsive="late"] {
    grid-template-columns: repeat(4,1fr);
}
}

@media screen and (max-width: 768px){
#after-footer svg {
    max-width: 20px;
    max-height: 20px;
}
}
#after-footer a svg {
    fill: currentcolor;
    display: block;
    margin: 0 auto 0.5em;
}


#after-footer a {
	background-color:rgba(24, 124, 155, 0.79);
    color: #fff;
    display: block;
    height: 100px;
    text-align: center;
    font-family: Source Sans Pro;
    font-weight: 700;
    font-size: 16px;
    line-height: 1;
    font-style: normal;
    font-variant: normal;
    padding: 10px;
    text-transform: uppercase;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -webkit-align-items: center;
    flex-direction: column;
}

@media screen and (min-width: 768px){
	#after-footer {
		display: none;
	}
	#menu-item-1108{
		display:none;
	}
}

// @media screen and (max-width: 768px){
// 	#menu-item-1108{
// 		display:none;
// 	}
// }
figure.navbar-toggle{
	border: black;
    border-style: solid;
    width: 3em;
	margin: auto;
}

@media screen and (min-width: 769px){
   #header>#logo {
      display: block !important; 
   }
   #header #logo a {
      height: 100px;
      aspect-ratio: 3/1;
   }
}
header#header #logo a{
   margin: 0 auto;
}
@media screen and (max-width: 767px){
   #logo a img{
      display:none;
   }
}
#menu-item-1108{
	display:none;
}
ul.sub-menu{
	background-color:white;
}
// @media screen (min-width: 540px) and (max-width: 768px){
//    .grid[columns="4"][responsive="late"] {
//       grid-template-columns: repeat(4,1fr);
//    }
// }
// 

@media screen and (min-width: 767px){
body:not(.page-id-5) main#content{
   padding-top:250px;
}}
@media (min-width: 540px) and (max-width: 768px){
   .grid[columns="4"][responsive="late"] {
      grid-template-columns: repeat(4,1fr);
   }
}

// sidebar / floating contact section styles

#floating-contact-section{
   position: fixed;
   top: 275px;
   right: 25px;
   z-index: 2;
	background-color:white;
	background: #FFFFFF 0% 0% no-repeat padding-box;
	box-shadow: 0px 3px 6px #00000029;
	border-radius: 13px;
	opacity: 1;
	padding:10px;
	display:flex;
	flex-direction:column;
	align-items:flex-end;
}
@media (max-width: 767px){
	#floating-contact-section{
		display:none;
	}
}
.click-to-text svg,
.sidebar-cta,
.sidebar-cta svg{
	color:#6F6F6F;
	filter: invert(84%) sepia(4%) saturate(0%) hue-rotate(257deg) brightness(94%) contrast(92%);
	font-size:14px;
	font-weight:400;
}

.fa {
	color:#C8CACA;
}

// gray
// filter: invert(84%) sepia(4%) saturate(0%) hue-rotate(257deg) brightness(94%) contrast(92%);

// blue
// #187C9B
// filter: invert(41%) sepia(12%) saturate(2479%) hue-rotate(148deg) brightness(99%) contrast(104%);



.sidebar-cta:hover .fa,
.sidebar-cta:hover svg{
	filter: invert(41%) sepia(12%) saturate(2479%) hue-rotate(148deg) brightness(99%) contrast(104%);
	color:#187C9B;
}
.fa.fa-home{
	color: #187C9B;
    font-size: 1.5em;
}
.cta-multiline-text{
	display:none;
}
.sidebar-cta:hover .cta-multiline-text{
	display:inline-block;
}
.sidebar-cta:hover .sidebar-vertical-icon{
	padding-left:25px;
}
.sidebar-vertical-icon{
	display:inline-block;
}
.sidebar-cta-text-emphasis{
	font-size:24px;
	line-height:12px;
}
.sidebar-cta-text-emphasis:before {
    content: '\a';
    white-space: pre;
}	
.cta-multiline-text{
	text-transform:uppercase;
}
.frm_screen_reader,
.frm_verify{
	display:none;
}

#header>div {
    padding-top: 25px;
    padding-bottom: 25px;
    max-width: 1920px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    display: grid;
    align-items: center;
    grid-template-columns: repeat(3,1fr);
}

#header-info{
	display: flex;
	align-items: center;
	justify-content: center;
	a{
		background-color: rgba(24, 124, 155, 0.79);
		color: #fff;
		display: inline-block;
		font-family: Roboto;
		font-weight: 700;
		font-size: 20px;
		line-height: 1;
		font-style: normal;
		font-variant: normal;
		padding: 1em 2em;
		text-align: center;
		svg{
			filter: invert(95%) sepia(97%) saturate(14%) hue-rotate(213deg) brightness(104%) contrast(104%);
			height:15px;
		}
	}
}

#book-an-appointment {
	display: flex;
	align-items: center;
	justify-content: center;
	a{
		background-color: rgba(24, 124, 155, 0.79);
		color: #fff;
		display: inline-block;
		font-family: Roboto;
		font-weight: 700;
		font-size: 20px;
		line-height: 1;
		font-style: normal;
		font-variant: normal;
		padding: 1em 2em;
		text-align: center;
		svg{
			filter: invert(95%) sepia(97%) saturate(14%) hue-rotate(213deg) brightness(104%) contrast(104%);
			height:15px;
		}
	}
}
@media screen and (max-width: 716px){
	#header > div {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		white-space: nowrap;
	}
	#book-an-appointment {
		a{
			padding:1em .5em;
		}
	}
	#header-info {
		a{
			padding:1em 1em;
		}
	}	
}
@media screen and (max-width: 767px){
	#header > div {
		padding:0px;
	}
	.hero .overlay{
		padding-top:5px !important;
	}
}

@media screen and (max-width: 400px){
	#header-info a{
		padding-left:0px;
	}
	#book-an-appointment a{
		padding-right:5px;
		padding-left:5px;
	}
}
@media screen and (max-width: 1000px){
	#above-footer>div{
		flex-wrap:wrap;
	}
}

.fixed-ctas {
    position: fixed;
    right: 15px;
    bottom: 50%;
    transform: translateY(70%);
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: #026D9C;
    box-shadow: 0px 3px 10px #00000065;
    border-radius: 10px;
    padding: 10px 0;
    z-index: 1000;
}
.fixed-ctas .cta {
    position: relative;
    width: 45px;
    text-align: center;
    cursor: pointer;
}
.fixed-ctas .desktop-label {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 15px 0;
}
.fixed-ctas .cta .mobile-label, .fixed-ctas .cta .label-hover {
    display: none;
}
.fixed-ctas .cta .label-hover .top-text {
    font-size: 11px;
    text-align: left;
    text-transform: uppercase;
}
.fixed-ctas .cta .label-hover .bottom-text {
    font-size: 15px;
    text-align: left;
    font-weight: bold;
    text-transform: uppercase;
}
.fixed-ctas .cta .desktop-label:hover {
    background-color: #fff;
}
.fixed-ctas .cta .desktop-label:hover .label-hover {
    box-shadow: 0px 3px 10px #00000065;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: absolute;
    visibility: visible;
    right: 44px;
    top: 0;
    bottom: 0;
    margin: auto;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    background-color: #fff;
    padding: 5px 15px;
    height: 100%;
    width: 140px;
    line-height: 1;
    color: #026D9C;
    z-index: -1;
}
.fixed-ctas .cta .desktop-label:hover svg path {
    fill: #026D9C;
}
 
@media only screen and (max-width: 782px) {
    .fixed-ctas {
        bottom: 0;
        left: 0;
        right: 0;
        transform: translate(0);
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
        align-items: end;
        border-radius: 0;
        padding: 10px 20px 5px;
    }
    .fixed-ctas .cta {
        width: auto;
        text-decoration: none;
        margin: 0;
    }
    .fixed-ctas .cta svg {
        height: 15px;
        width: auto;
        margin-bottom: 5px;
    }
    .fixed-ctas .cta .mobile-label {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        color: #fff;
        text-align: center;
        font-size: 10px;
    }
    .fixed-ctas .cta .desktop-label, .fixed-ctas .cta .desktop-label:hover {
        display: none;
    }
}
#doc > div > img{
	box-shadow: 1px 3px 15px #00000040;
}
.click-to-text svg{
	filter: unset;
}

#after-footer{
	display:none;
}

#frm_form_3_container .form-field label {
    display: inherit;
    position: inherit;
    padding-bottom: inherit;
    top: inherit;
    left: inherit;
    pointer-events: inherit;
    transform: inherit;
    -o-transform: inherit;
    -ms-transform: inherit;
    -moz-transform: inherit;
    -webkit-transform: inherit;
    transform-origin: inherit;
    transition: inherit;
    -o-transition: all 0.5s cubic-bezier(0.76,0,0.24,1);
    -moz-transition: all 0.5s cubic-bezier(0.76,0,0.24,1);
    -webkit-transition: inherit;
}

.hide {
	display: none;
}