@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700;900&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap');





body { color: #333; background-color: #fff; font-family: 'Open Sans', sans-serif; font-size: 14px; margin: 0; }

a, a:link, a:visited, a:hover, a:active { text-decoration: none; cursor: pointer; }

h1 { font-family: 'Open Sans', sans-serif; color: #278CC1; font-size: 42px; }

h2 { margin-top: 10px; margin-bottom: 10px; font-size: 32px; font-weight: bold; color: #278dc1; }

.bg-blu h1, .bg-blu h2, .bg-blu h3, .bg-blu h4, .bg-blu h5 {color:#FFF;}



.left { float: left; }

.right { float: right; }

.center { margin: 0 auto; }

.clear { clear: both; width: 100%; }

.clearme { clear: both; width: 100%; }

.sp4 { width: 100%; height: 4px; clear: both; }

.sp5 { width: 100%; height: 5px; clear: both; }

.sp10 { width: 100%; height: 10px; }

.sp12 { width: 100%; height: 12px; }

.sp15 { width: 100%; height: 15px; clear: both; }

.sp20 { width: 100%; height: 20px; clear: both; }

.sp25 { width: 100%; height: 25px; clear: both; }

.sp30 { width: 100%; height: 30px; clear: both; }

.sp35 { width: 100%; height: 35px; clear: both; }

.sp36 { width: 100%; height: 35px; clear: both; }

.sp40 { width: 100%; height: 40px; clear: both; }

.sp45 { width: 100%; height: 45px; clear: both; }

.sp50 { width: 100%; height: 50px; clear: both; }

.sp55 { width: 100%; height: 55px; clear: both; }

.sp60 { width: 100%; height: 60px; clear: both; }

.sp65 { width: 100%; height: 65px; clear: both; }

.sp70 { width: 100%; height: 70px; clear: both; }

.sp75 { width: 100%; height: 75px; clear: both; }

.sp80 { width: 100%; height: 80px; clear: both; }

.sp85 { width: 100%; height: 85px; clear: both; }

.sp90 { width: 100%; height: 90px; clear: both; }

.sp95 { width: 100%; height: 95px; clear: both; }

.sp100 { width: 100%; height: 100px; clear: both; }

.sp110 { width: 100%; height: 110px; clear: both; }

.sp112 { width: 100%; height: 112px; clear: both; }

.sp136 { width: 100%; height: 136px; clear: both; }

.sp140 { width: 100%; height: 140px; clear: both; }

.spHeader {width: 100%; height: 100px; clear: both;}

.txt-blu {color:#278dc1;}

.bg-blu { background-color: #278dc1; color:#FFF;  }

.bg-blu90 { background: url(/images/bg-blu90.png) ; color:#FFF;  }

.bg-light-blu { background-color: #8CC3CD; }

.bg-light-gray {background-color: #F5F5F5}

.bg-light-gray-2 {background-color: #dee1ec}

.max-width-90 {max-width:90%;}



@media (max-width:992px)

{

    .max-width-90 {max-width:100%;}

}



.bg-dark-gray { background-color: #333333; }

.border-lt-gray { border: 1.5px solid #efefef; }

.border-dk-gray { ; border-radius:4px; text-transform: uppercase; color:#278CC1; background:#dee1ec; }

.border-lt-gray-thick { border: 2px solid #8dc4cd; border-radius:4px; }



.footer-logo {width:200px; height:auto;}

.footer-logo img {width:100%;}

.footer {border-top:0px solid #efefef; padding:30px 0 0 0; background:linear-gradient(rgba(0,0,0,.9),rgba(0,0,0,.7)),url(/images/uploads/img-espresso_drip.jpg) no-repeat #180d0c; color:#eee2d2;}

.footer a {color:#eee2d2; text-decoration: underline;}

.subFooter { background:#111; padding: 30px 0; color: #fff; overflow: auto; font-size: 13px; border-top:1px solid rgb(255, 255, 255, .2); }

.subFooter a { color: #fff; text-decoration: underline; }

.footer-blocks {border:1px solid #eee2d2; border-radius:4px; padding:30px 50px; min-height:230px; background:rgba(144, 85, 63, .4);}

.footer-blocks h3 { font-size:22px; font-weight:800; letter-spacing:-1px; text-transform: uppercase; letter-spacing: 1px;}

.footer-blocks-wrap {width:310px; }













.blogDateWrapper { font-family: 'Open Sans', sans-serif; font-size: 32px; font-weight: 800; color: #278dc1; border: 2px solid #278dc1; border-radius: 3px; width: 80px; height: 52px; float: left; text-align: center; text-transform: uppercase; margin: 0 30px 5px 0; padding: 8px 6px; line-height: 18px; }

.blogHeadline {width:; height: 60px; font-family: 'Roboto', sans-serif; font-weight: 500; font-size: 28px; line-height: 30px; text-align: left; color: #278dc1; margin: 0 0 10px; line-height: 24px; }

.blogHeadline h2 { font-size: 28px; font-weight: 400; margin-top: 0; line-height: 26px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box !important; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }

.blogHeadline a {color:#278dc1;}

.blogHeadline a:hover {text-decoration:underline;}

.dateDay { margin: 0 0 4px 0; }

.dateMonth { /*width: 3.2ch; overflow: hidden;*/ white-space: nowrap; margin: 0 auto; text-align: center; font-size: 11px; letter-spacing: 0; }

.blogSummaryWrap { margin: 10px 0 10px 0; max-width: 750px; line-height: 20px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box !important; -webkit-line-clamp: 4;-webkit-box-orient: vertical;}

.blogImageWrap { max-width: 750px; height: auto; margin: 10px 0 }

.blogImageWrap img { width: 100%; height: auto; box-shadow: 0px 0px 2px #333; }

.blogDetailImageWrap { width:100%; height: auto; margin: 10px 0 }

.blogDetailImageWrap img { width: 100%; height: auto; box-shadow: 0px 0px 2px #333; }

.btnBlogDetails {max-width: 200px; background:#278dc1; border-radius:6px; font-weight:600; font-size:14px; text-align:center;}

.btnBlogDetails a {display:block; padding:12px 20px; color:#FFF; text-decoration: none; text-transform:uppercase;}

.chart-attributes { position: absolute; bottom: 10px; width: 600px; height: 210px; }

.btn-usertips {max-width:170px; padding:10px 20px; margin:0 0 10px 0; position:relative; background:#278dc1; color:#FFF; text-transform:uppercase; font-weight:600; line-height:12px; cursor: pointer; border-radius:30px;}

.btn-usertips span {font-size:11px; }

.user-tips {width:; height: auto; position:absolute; background:#278dc1;  padding:60px; color:#FFF; z-index:500; top:250px; border-radius:66px; box-shadow:0px 10px 30px gray;}

.hide-tips {position:absolute; right:50px; top:30px; font-size:32px; cursor: pointer;}

.hpotdns {display: none;}



.dynamicFeature350 { width: 100%; min-height: 350px; position: relative; }

.dynamicFeature400 { width: 100%; min-height: 400px; position: relative; }

.dynamicFeature500 { width: 100%; min-height: 500px; position: relative;}

.dynamicFeature600 { width: 100%; min-height: 600px; position: relative;}

.dynamicFeature650 { width: 100%; min-height: 650px; position: relative;}

.dynamicFeature80vh {width:100%; height:80vh; min-height:600px; position:relative; overflow:hidden; background-color:#808080; background-size:cover; background-position:top left;}

.dynamicFeature90vh {width:100%; height:90vh; min-height:700px; position:relative; overflow:hidden; background-color:#808080; background-size:cover; background-position:top left;}

.dynamicFeature100vh { width: 100%; height: 100vh; background-size:cover; position: relative; }



.btn-med-submit { float: right; font-size: 13px; color: #FFF; background: #278CC1 !important; border-radius: 2px; padding: 10px 14px; font-weight: 800; min-width: 130px; height: 40px; border: 0px solid #dadada; background: none; text-transform: uppercase; }

.btn-med-submit:hover { background: #8dc4cd !important; }

.btn-med-submit a { }

.lnk-sm-submit { float: right; text-align: center; font-size: 13px; color: #FFF; background: #278CC1 !important; border-radius: 2px; padding: 18px 10px; font-weight: 800; min-width: 100px; height: 54px; border: 0px solid #dadada; background: none; text-transform: uppercase; margin-right: 10px; }

.lnk-sm-submit:hover { background: #8dc4cd !important; color: #fff; }

.lnk-sm-submit a {display:block; color:#FFF; }

.lnk-sm-submit a:hover { }

.btn-sm-submit { float: right; font-size: 13px; color: #FFF; background: #278CC1 !important; border-radius: 2px; padding: 12px 14px; font-weight: 800; min-width: 100px; height: 54px; border: 0px solid #dadada; background: none; text-transform: uppercase; }

.btn-sm-submit:hover { background: #8dc4cd !important; }

.btn-sm-submit a { }

.btn-med-delete { float: right; font-size: 13px; color: #FFF; background: #cc0000 !important; border-radius: 2px; padding: 10px 14px; font-weight: 800; min-width: 130px; height: 40px; border: 1px solid #dadada; background: none; text-transform: uppercase; }

.btn-med-delete:hover { background: #8dc4cd !important; }

.btn-med-delete a { }

.lnk-med-submit { float: right; text-align: center; font-size: 13px; color: #FFF; background: #278CC1 !important; border-radius: 2px; padding: 10px 14px; font-weight: 800; min-width: 150px; height: 40px; border: 0px solid #dadada; background: none; text-transform: uppercase; margin-right: 10px; }

.lnk-med-submit:hover { background: #8dc4cd !important; color: #fff; }

.lnk-med-submit a {display:block; color:#FFF; }

.lnk-med-submit a:hover { }



.btn-cc-submit { width: 160px !important; height: 46px; font-size: 13px; color: #FFF; background: #a8bacc !important; border-radius: 2px; padding: 12px 14px; font-weight: 800; border: 0px solid #dadada; background: none; text-transform: uppercase; text-align:center; }

.btn-cc-submit:hover { background: #8dc4cd !important; }

.btn-cc-submit a { }

.btn-cc-submit i {color:#FFF !important; font-size:20px; margin:0 0 0 10px;}

.back-bttn-wrapper {width:100%; min-height:50px; padding:20px 0 20px 0; position:relative; color:#FFF; z-index:50; background:#278DC6;}

.bttn-back {width:150px; height:44px; background: none; border:2px solid #FFF; border-radius:4px; text-align:center; padding:10px 0 10px 0; font-weight:700; cursor:pointer;}

.bttn-back:hover {background:#8dc4cd;}



.panel-close {font-size:32px;  color:#278dc1;}

.close-code-pos {position:absolute; right:10px; top: 4px;}

.create-panel {width:98%; margin:0 auto; border:1px solid #FFF; background:#e0e6f1; padding:40px; border-radius:4px; margin-top:; }

.create-panel i {color:#176b96 ;}

.create-panel textarea {min-height:200px; border-radius:4px;}

/* JavaScript applies this class to the button for each open panel. */

.property-controls .btn-cc-submit.is-active,

.section-controls .btn-cc-submit.is-active,

.callout-controls .btn-cc-submit.is-active { background: #176b96 !important; border-color: #176b96 !important; color: #ffffff !important; }

.lbl-admin-panel {color:#278dc1; font-weight:600; font-size:11px; text-transform:uppercase}

.admin-crud h1 {font-size:34px; letter-spacing:-2px;}

.admin-crud h2 {font-size:24px; letter-spacing:-1px; color:#176B95;}

.admin-crud i {color:#176B95;}

.admin-crud textarea {min-height:100px; border-radius:4px;}



/*===========================

12 COLUMN GRID

===========================*/



.section12 { clear: both; padding: 0px; margin: 0px; }

.col12 { display: block; float: left; margin: 1% 0 1% 1%; }

.col12:first-child { margin-left: 0; }

.group12:before,

.group12:after { content: ""; display: table; }

.group12:after { clear: both; }

.group12 { zoom: 1; /* For IE 6/7 */ }

.span12_of_12 { width: 100%; }

.span11_of_12 { width: 91.58%; }

.span10_of_12 { width: 83.16%; }

.span9_of_12 { width: 74.75%; }

.span8_of_12 { width: 66.33%; }

.span7_of_12 { width: 57.91%; }

.span6_of_12 { width: 49.5%; }

.span5_of_12 { width: 41.08%; }

.span4_of_12 { width: 32.66%; }

.span3_of_12 { width: 24.25%; }

.span2_of_12 { width: 15.83%; }

.span1_of_12 { width: 7.416%; }



.bio-details-wrap {}

.bio-details-wrap .bio-img {width:100%; min-height:350px;}

.bio-details-description {font-size:; font-weight: 300;}

.bio-details-wrap h1 {font-family:'Open Sans', sans-serif; font-weight:800; letter-spacing:-1px;}

.bio-details-wrap h2 {font-size:26px; font-weight:300; margin-top:-14px;}

.bio-img { width:100%; min-height:250px; background:#efefef;}

.bio-img img {width:100%; height:auto;}



.bio-img,

.blogImageWrap { width: 100%; aspect-ratio: 4 / 3; overflow: hidden; background: #efefef; }

.bio-img a,

.blogImageWrap a { display: block; width: 100%; height: 100%; }

.bio-img img,

.blogImageWrap img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }



.bio-name {width:100%; height:auto; font-size:22px; font-weight:800; text-align:center; color:#748592; margin-top:10px;}

.bio-title {width:100%; height:auto; font-size:18px; font-style: italic; font-weight:600; letter-spacing:-1px; text-align:center; color:#278dc1; }

.bio-company {width:100%; height: auto; font-size:11px; font-weight:800; letter-spacing:1px; text-align:center; text-transform: uppercase; color:#58595B;}

.bio-description {font-size:; font-weight: 300; margin-top: 0; line-height: 20px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box !important; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }

.bio-readmore {width:200px; text-align:right; font-size:14px; font-style:italic; float:right; margin-top:10px;}

.bio-readmore a {color:#278CC1; font-weight:600;}

.bio-tags {}

.bio-links {}





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

    .col { margin: 1% 0 1% 0%; }

    .span_1_of_12, .span_2_of_12, .span_3_of_12, .span_4_of_12, .span_5_of_12, .span_6_of_12, .span_7_of_12, .span_8_of_12, .span_9_of_12, .span_10_of_12, .span_11_of_12, .span_12_of_12 { width: 100%; }

}



@media only screen and (max-width: 992px) 

{



}



@media only screen and (max-width: 768px) 

{

    .span3_of_12 {width:100%; padding:10px 0;}

}





.featureAppSuccess {width:100%; height: 300px; background:url(/images/Feature-Employmenty.png) no-repeat top center; background-size:cover; position:relative;}

.featureAppSuccess h1 {color:#000; margin-top:50px; text-shadow:0px 1px 1px #FFF; line-height:32px; width:80%;}

.featureLanding {width:100%; min-height: 400px; background:url(/images/uploads/img-featuretemp.jpg) no-repeat top center #1b8299; background-size:cover; position:relative;}



.form-list-control, .form-control {width: 100%; height:54px; padding: 0.375rem 0.75rem; font-size: 1rem; font-weight: 400; line-height: 1.5; color: #212529;  background-clip: padding-box; border: 1px solid #ced4da; border-radius: 0.25rem; transition: .15s ease-in-out,box-shadow .15s ease-in-out; }

.form-outer-wrap {border: 1px solid #ced4da; padding:30px;}



.bttn-CTA {width:100%; height:60px; position:relative; padding:6px 20px; line-height:16px; margin-bottom:4px; color:#FFF; font-size:24px; font-weight:800; text-transform:uppercase; display:block;}

.bttn-CTA span {font-size:14px; font-weight:500; }

.bttn-icon {position:absolute; right:10px; top: 12px; font-size:32px; color:#FFF;}



.buttonenabled { width: 250px; height: 44px; background-color: #1b8299; color: #FFF; cursor: pointer; border-radius: 2px; padding: 10px 20px 20px 20px; font-size: 14px; }

.buttonenabled:hover { background: #69c8c6 }



/*=======================

    INLINE SCROLL

=======================*/

.AdminScroll

{

max-height: 350px !important;

overflow-y:scroll !important;

overflow-x: hidden;

scrollbar-base-color: #278dc1;

scrollbar-face-color: #278dc1;

scrollbar-3dlight-color: #278dc1;

scrollbar-highlight-color: #278dc1;

scrollbar-track-color: #FFF;

scrollbar-shadow-color: #dadada;

border:none;

font-size:13px;

}



.AdminScroll::-webkit-scrollbar { width: 16px; height: 3px;}

.AdminScroll::-webkit-scrollbar-track {  background-color: #FFF; box-shadow: inset 0 0 5px #dadada; border-radius:12px;}

.AdminScroll::-webkit-scrollbar-thumb { height: 50px; background-color: #278dc1; border-radius: 13px;}

.AdminScroll::-webkit-scrollbar-corner { background-color: #278dc1;}

.AdminScroll::-webkit-resizer { background-color: #278dc1;}



.AdminScroll2

{

max-height: 470px !important;

overflow-y:scroll !important;

overflow-x: hidden;

scrollbar-base-color: #278dc1;

scrollbar-face-color: #278dc1;

scrollbar-3dlight-color: #278dc1;

scrollbar-highlight-color: #278dc1;

scrollbar-track-color: #FFF;

scrollbar-shadow-color: #dadada;

border:none;

font-size:13px;

}



.AdminScroll2::-webkit-scrollbar { width: 16px; height: 3px;}

.AdminScroll2::-webkit-scrollbar-track {  background-color: #FFF; box-shadow: inset 0 0 5px #dadada; border-radius:12px;}

.AdminScroll2::-webkit-scrollbar-thumb { height: 50px; background-color: #278dc1; border-radius: 13px;}

.AdminScroll2::-webkit-scrollbar-corner { background-color: #278dc1;}

.AdminScroll2::-webkit-resizer { background-color: #278dc1;}



.AdminScroll100

{

max-height: 100% !important;

overflow-y:scroll !important;

overflow-x: hidden;

scrollbar-base-color: #278dc1;

scrollbar-face-color: #278dc1;

scrollbar-3dlight-color: #278dc1;

scrollbar-highlight-color: #278dc1;

scrollbar-track-color: #FFF;

scrollbar-shadow-color: #dadada;

border:none;

font-size:13px;

}



.AdminScroll100::-webkit-scrollbar { width: 16px; height: 3px;}

.AdminScroll100::-webkit-scrollbar-track {  background-color: #FFF; box-shadow: inset 0 0 5px #dadada; border-radius:12px;}

.AdminScroll100::-webkit-scrollbar-thumb { height: 50px; background-color: #278dc1; border-radius: 13px;}

.AdminScroll100::-webkit-scrollbar-corner { background-color: #278dc1;}

.AdminScroll100::-webkit-resizer { background-color: #278dc1;}



/*=======================

    ADMIN CLASSES

=======================*/

.adminGlobalWrap {}



.adminGlobalWrap h1 { font-family: 'Roboto', sans-serif; margin-top: 10px; margin-bottom: 10px; color: #278dc1; font-size: 32px; }

.adminGlobalWrap h2 { font-family: 'Roboto', sans-serif; margin-top: 10px; margin-bottom: 10px; font-size: 30px; font-weight: 400; color: #278dc1; }

.adminGlobalWrap h3 { font-family: 'Roboto', sans-serif; margin-top: 10px; margin-bottom: 10px; font-size: 24px; font-weight: 400; color: #278dc1; }

.adminGlobalWrap h4 { font-family: 'Roboto', sans-serif; margin-top: 10px; margin-bottom: 10px; font-size: 20px; font-weight: 400; color: #FFF; }

.adminGlobalWrap h5 { font-family: 'Roboto', sans-serif; margin-top: 10px; margin-bottom: 10px; font-size: 18px; font-weight: 400; color: #278dc1; }





.border-md-gray { border: 1px solid #efefef; }

.bg-lt-gray { background-color: #f7f8fc }

.bg-md-gray { background-color: #e4eaf0; }

.btnExport {}

.btn-med-submit { float: right; font-size: 13px; color: #FFF; background: #278CC1 !important; border-radius: 2px; padding: 10px 14px; font-weight: 800; min-width: 130px; height: 40px; border: 0px solid #dadada; background: none; text-transform: uppercase; text-align:center; }

.btn-med-submit:hover { background: #8dc4cd !important; }

.btn-med-submit a { }

.btn-med-delete { float: right; font-size: 13px; color: #FFF; background: #cc0000 !important; border-radius: 2px; padding: 10px 14px; font-weight: 800; min-width: 130px; height: 40px; border: 1px solid #dadada; background: none; text-transform: uppercase; }

.btn-med-delete:hover { background: #8dc4cd !important; }

.btn-med-delete a { }

.lnk-med-submit { float: right; text-align: center; font-size: 13px; color: #FFF; background: #278CC1 !important; border-radius: 2px; padding: 10px 14px; font-weight: 800; min-width: 130px; height: 40px; border: 0px solid #dadada; background: none; text-transform: uppercase; margin-right: 10px; }

.lnk-med-submit:hover { background: #8dc4cd !important; color: #fff; }

.lnk-med-submit a {display:block; color:#FFF; }

.lnk-med-submit a:hover { }



.btn-geocode { width:100%; height:52px; float: ; text-align: center; font-size: 13px; color: #FFF; background: #278CC1 !important; border-radius: 2px; padding: 10px 14px; font-weight: 800; border: 0px solid #dadada; background: none; text-transform: uppercase; margin-right: 10px; }

.btn-geocode:hover { background: #8dc4cd !important; color: #fff; }

.btn-geocode a {display:block; color:#FFF; }

.btn-geocode a:hover { }



.cb-map-bubble { width: 300px; height: 400px; }

.cb-map-bubble__title { font-size: 18px; font-weight: 700; }

.cb-map-bubble__imgwrap { }

.cb-map-bubble__img { width: 100%; height: auto; }

.cb-map-bubble__address { }

.cb-map-bubble__meta { }

.cb-map-bubble__desc { }

.cb-map-bubble__address div { }

.cb-map-bubble__meta div { }

.cb-map-bubble a { }



.gm-style-iw-d { }

.gm-style .gm-style-iw-c { }

/* Outer container */

.gm-style .gm-style-iw {height:600px !important; padding: 0 !important; }



/* Inner white bubble */

.gm-style .gm-style-iw-c { padding: 12px !important; border-radius: 12px !important; box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important; }







.featureLogin { background: url('/images/img-login.jpg') bottom center no-repeat; background-size: cover; width: 100%; height: 100vh; position: absolute; z-index: 5; }

.featureLogin h2 { font-size: 28px; color: #FFF; margin: 0 0 10px 0; }

.loginFooter { height: 60px; width: 100%; padding: 20px 0; color: #FFF; background: #000; z-index: 999; position: fixed; bottom: 0; }

.loginWrapper { background: #000; opacity: .86; padding: 30px; color: #FFF; }

.loginWrapper label { margin-bottom: 0; }

.loginWrapper button { height: 54px; background: #015898; color: #FFF; text-transform: uppercase; }

.loginWrapper button:hover { background: #8dc4cd; color: #FFF; text-transform: uppercase; }

.LoginBg {width:100%; height:100%; position:absolute; background: url(/images/img-Login.jpg) top center no-repeat; background-size:cover;}

.form-control { height: 54px; }

.admin-message-wrapper { width: 100%; position: fixed; color: #FFF; margin-top: -36px; z-index: 50; }

.admin-action-tile { width: 100%; height: auto; position:relative; min-height: 200px; box-shadow: 0px 2px 2px #dadada; background: #278dc1; color: #FFF; padding: 20px; cursor:pointer; }

.admin-action-tile h4 { font-size: 22px; text-align: center; font-weight: 200; line-height: 18px; }

.admin-action-tile span { font-size: 13px; clear: both; font-weight: 800; float: left; }

.admin-action-tile-innerwrap { width: 100%; height: 100%; min-height: 160px; padding:20px; border: 1px solid #FFF; }

.admin-dashboard-feature { width: 100%; min-height: 360px; color:#FFF; background: url(/images/img-featureAdmin.jpg) no-repeat top left; border-bottom: 2px solid #303030; }

.admin-dashboard-feature-sm { width: 100%; min-height: 250px; color:#FFF; background: url(/images/img-featureAdmin.jpg) no-repeat top left; border-bottom: 2px solid #303030; }



.truncate-one-line { font-size:; font-weight: 300; margin-top: 0; line-height: 20px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box !important; -webkit-line-clamp: 1; -webkit-box-orient: vertical; }

.icon-actions { font-size: 16px; color: #015898; margin: 0 6px; }

.icon-delete { font-size: 16px; color: #cc0000; margin: 0 6px; }

.admin-bttn-wrapper {width:100%; position:fixed; color:#FFF; z-index:50; background:#333333;}

.modelCount {width:100%; height:auto; position:relative; padding:10px; border:0px solid #FFF; background:#0d658f; font-size:18px; font-weight:700; color:#FFF; text-decoration:underline;}

.modelCount span {font-weight:400; margin-top:6px; text-decoration:none; margin-right:20px;}



@media (max-width: 768px) {

    .hide-768 { display: none !important }

}



.vc_grid-item-mini { background: #e7ebf0; }

.vc_gitem-post-data-source-post_excerpt { font-size:; font-weight: 300; margin-top: 0; line-height: 20px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box !important; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }

.vc_btn3.vc_btn3-color-juicy-pink,

.vc_btn3.vc_btn3-color-juicy-pink.vc_btn3-style-flat { background: #445461; float: right; height: 36px; float: right; padding: 8px 20px; }



.admin-uploaded-images { width: 174px; height: 200px; font-size: 12px; background: #f7f8fc; border: 1px solid #dadada; border-radius:6px; float: left; margin: 6px; overflow: hidden; padding: 12px; position: relative; }

.admin-uploaded-images img { width: 150px; height: 150px; }

.admin-image-download { position: absolute; bottom: 0px; right: 10px; }



.emailSent {width:100%; height:350px; background: url('/images/Email-MailSent.jpg') #ebe9e8 no-repeat center left;}



.pool-estimate-wrap {width:100%; height:600px; position:relative; background: url(/images/pool-design-hero.jpg) no-repeat top center;}

.pool-estimate-wrap .form-control {height:40px;}

.lbl-estimate {font-size:11px; font-weight:600; text-transform: uppercase; color:#FFF; margin-top:4px;}

.estimated {font-size:22px; font-weight:700; color:#278dc1;}

.pool-estimate-wrap .form-list-control, .form-control {font-size:13px;}

.field-wrap {line-height:12px;}



.field-wrap .form-list-control, .field-wrap .form-control {border-radius:2px;}





select {-webkit-appearance: menulist !important ; -moz-appearance: menulist !important; appearance: menulist !important; }

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus 

{ box-shadow: none; outline:none; border:1px solid #ced4da;}





.btn-estimate { float: right; text-align: center; font-size: 13px; color: #FFF; background: #278CC1 !important; border-radius: 2px; padding: 10px 14px; font-weight: 800; min-width: 130px; height: 40px; border: 1px solid #FFF; background: none; text-transform: uppercase; margin-right: 10px; }

.btn-estimate:hover { background: #8dc4cd !important; color: #fff; }

.btn-estimate a {display:block; color:#FFF; }

.btn-estimate a:hover { }



.cb_overlay {

    width: 100%;

    height: 600px;

    background: url(http://maddiesmillionpetchallenge.org/wp-content/uploads/transparent-dots-darkblue.png);

    position: absolute;

    top: 0;

    z-index: 5;

    padding: 0px 0 0 0;

}



.dashboardWrap {width:100%; height:100%;}

.dashboardWrap h2 {margin: 10px 0 10px 0}

.line-sep {width:94%; height:1px; background:#efefef; margin: 0 auto; margin-top:2px; margin-bottom:2px;}



/*applies to update create and edit*/

#toggle-icon, #icon-toggle { width: 100px; height: 40px; position: absolute; right: 20px; top: 0px; cursor: pointer; font-size: 32px; color: #278dc1; font-weight: 600; text-align: right; }

.text-muted { color: #278dc1 !important; font-weight: 700; }



/*promo Banner*/

.promo-banner-grid a.tile-link { display: block; text-decoration: none; color: inherit; position:relative; z-index:40;}

.promo-card { height: 300px; border: 0; border-radius:18px 0; overflow: hidden; }

.promo-brow { height: 70px; display: flex; align-items: center; padding: 0 16px; }

.promo-headline { text-align: center; margin: 0 auto; font-size: 18px; font-weight:700; line-height:18px; letter-spacing:-.5px;}

.promo-media { height: calc(300px - 70px); position: relative; background-size: cover; background-position: top left; background-repeat: no-repeat; }

.promo-overlay { position: absolute; inset: 0; background: url(/images/subtle_dots_graytrans45.png); opacity: .35; pointer-events: none; }

.promo-content { position: absolute; left: 0; right: 0; bottom: 0; padding: 14px 16px; z-index: 2; }

.promo-bttn-cta {width:150px;height:45px; background:#015898; padding:12px 20px; text-align:center; border-radius:26px; font-weight:700; color:#FFF;}



/*carousel*/

.cb-carousel { position: relative; width: 100%; height: 84vh; min-height:750px; overflow: hidden; z-index:50;}

.cb-slide { position: absolute; inset: 0; opacity: 0; pointer-events: none; transition: opacity .6s ease; }

.cb-slide.is-active { opacity: 1; pointer-events: auto; }

.cb-bg { position: absolute; inset: 0; }

.cb-bg img { width: 100%; height: 100%; object-fit: cover; display: block; }

.cb-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to right, rgba(0,0,0,.5), rgba(0,0,0,.3)), url(/images/subtle_dots_graytrans45.png); }.cb-content { position: absolute; inset: 0; z-index: 2; height: 100%; }

.cb-text { color: #FFF; }

.cb-eyebrow { opacity: .8; text-transform: uppercase; font-size: 12px; letter-spacing: .06em; margin-bottom: 8px; }

.cb-headline { font-size: 42px; font-weight:800; text-transform:uppercase; text-shadow:1px 1px 0 #000; letter-spacing:-2px; line-height: 40px; margin-bottom: 10px; }



.cb-subhead { font-size: 22px; font-weight:700; line-height: 24px;; margin-bottom: 16px; max-width: 36rem; text-shadow:1px 1px 0 #000;}

.cb-cta { display: inline-block; background: #fff; color: #000; padding: 12px 18px; border-radius: 8px; text-decoration: none; font-weight: 600; }

.cb-companion { display: none; }

.cb-companion img { max-height: 420px; max-width: 100%; border-radius:60px 0; height: auto; width: auto; object-fit: contain; display: block; box-shadow: 2px 2px 6px #999; }

.cb-dots { position: absolute; left: 0; right: 0; bottom: 14px; z-index: 5; display: flex; justify-content: center; gap: 8px; }

.cb-dot { width: 10px; height: 10px; border-radius: 999px; border: 0; cursor: pointer; background: rgba(255,255,255,.45); }

.cb-dot.is-active { background: rgba(255,255,255,.95); }

.cb-prev, .cb-next { position: absolute; top: 50%; transform: translateY(-50%); z-index: 5; width: 44px; height: 44px; border-radius: 999px; border: 0; background: rgba(0,0,0,.45); color: #fff; cursor: pointer; }

.cb-prev { left: 12px; }

.cb-next { right: 12px; }



a.cb-cta { display:inline-block; background:rgba(255,255,255,.08); backdrop-filter:blur(4px); color:#FFF; font-size:14px; text-transform:uppercase; padding:16px 18px; border:1px solid #FFF; border-radius:4px; text-decoration:none; font-weight:700; }

a.cb-cta:link, a.cb-cta:visited { color:#FFF; }

a.cb-cta:hover { color:#FFF; text-shadow:1px 1px 1px #000; background:rgba(187,98,32,.45); backdrop-filter:blur(4px); }





@media (min-width: 992px) {

    

}



@media (min-width : 300px) and (max-width: 1020px)

{

    .cb-carousel { position: relative; width: 100%; height: 84vh; min-height:620px; overflow: hidden; background-position: top center !important; }

    .cb-headline { font-size: 38px; font-weight:800; text-transform:uppercase; text-shadow:1px 1px 0 #000; letter-spacing:-2px; line-height: 40px; margin-bottom: 10px; }



    .cb-companion { display: flex; }

    .cb-prev, .cb-next { display: none; }

    .cb-carousel { touch-action: pan-y pinch-zoom; }

    .cb-dots {gap:16px;}

}



/*cal out band*/

.calloutband {text-align:center; color:#FFF;}

.calloutband h2 {font-size:34px; line-height:28px; font-weight:800; color:#FFF; letter-spacing:-2px;}

.calloutband h3 {font-size:24px;}



@media only screen and (max-width: 768px) 

{

    .calloutband h2 {font-size:28px; line-height:28px; font-weight:800; color:#FFF; letter-spacing:-2px;}

    .calloutband h3 {font-size:20px;}

}



/*Content Blocks*/

.content-block-wrap {padding:30px 0;}

.content-block-wrap h2 { font-size: 30px; }

.c-block-txt { font-size: 18px; }

.c-img-block-rt { width: 415px; height: 345px; background-size: cover; background-repeat: no-repeat; border-radius: 0 0 80px 0; border: 2px solid #005586; }

.c-img-block-lft { width: 415px; height: 345px; background-size: cover; background-repeat: no-repeat; border-radius: 80px 0 0 0; border: 2px solid #005586 }

.c-blocks-cta a {min-width:150px; height:50px; padding:16px 32px; background: #005586; color:#FFF; border-radius:4px;}



@media (min-width: 1200px) and (max-width: 1400px)

{

    .c-img-block-rt, .c-img-block-lft {width:350px; height: 291px;}

}



@media (min-width: 992px) and (max-width: 1199px)

{

    .c-img-block-rt, .c-img-block-lft {width:290px; height: 241px;}

}



@media (max-width: 991px)

{

    .c-img-block-rt, .c-img-block-lft {width:98%; height: 241px;}

}



.content-hr {border: none; height: 2px; background-color: #005586; margin: 20px 0;}





/*==================================================

Image Scroll Strip

==================================================*/

/* Horizontal image strip */

.image-strip { display:flex; width:100%; gap:0; overflow-x:auto; overflow-y:hidden; scrollbar-width:none; -ms-overflow-style:none; -webkit-overflow-scrolling:touch; overscroll-behavior-x:contain; cursor:grab; }

.image-strip::-webkit-scrollbar { display:none; }

.image-strip.is-dragging { cursor:grabbing; user-select:none; }

.image-strip:focus-visible { outline:3px solid #278CC1; outline-offset:-3px; }

.image-strip-card { position:relative; flex:0 0 calc(100% / 5.2); min-width:0; aspect-ratio:1 / 1; display:flex; align-items:center; justify-content:center; background-size:cover; background-position:center center; background-repeat:no-repeat; isolation:isolate; }

.image-strip-card::before { content:""; position:absolute; inset:0; background:rgba(0,0,0,.4); z-index:-1; }

.image-strip-content { width:100%; padding:24px; color:#FFF; text-align:center; }

.image-strip-headline { margin:0 0 10px; color:inherit; font-size:clamp(20px,1.7vw,28px); font-weight:800; line-height:1.05; text-transform:uppercase; text-shadow:1px 1px 0px #000; }

.image-strip-subhead { font-size:clamp(14px,1vw,18px); line-height:1.3; }

.image-strip-button { margin-top:16px; font-size:14px; font-weight:700; }

.image-strip.is-dragging a { cursor:grabbing; }



@media (min-width:768px) and (max-width:1199.98px)

{

    .image-strip-card { flex-basis:calc(100% / 3.2); }

    .image-strip-headline { font-size:26px; }

}



@media (max-width:767.98px)

{

    .image-strip-card { flex-basis:calc(100% / 2.2); }

    .image-strip-content { padding:14px; }

    .image-strip-headline { font-size:clamp(18px,4.3vw,28px); margin-bottom:8px; }

    .image-strip-subhead { font-size:13px; }

    .image-strip-button { margin-top:10px; padding:6px 10px; font-size:12px; }

}



/*==================================================

Responsive Coffee Menu

==================================================*/

.coffee-menu {max-width:1140px; margin:auto; padding:35px 16px; color:#39261F; }

.coffee-menu-heading {margin-bottom:28px; text-align:center;}

.coffee-menu-heading h2 {max-width:350px; margin:0 auto; backdrop-filter:blur(4px); background: rgb(24, 13, 12, 1) ; color:#eee2d2

; font-size:12px; text-transform:uppercase; font-weight:800; border:2px solid #180d0c; border-radius:20px; letter-spacing:4px; padding:6px 10px;}

.coffee-menu-eyebrow {margin-bottom:12px; color:#89523D;}

.coffee-menu-categories {overflow:hidden; border-radius:14px; background:#FAF5EC; }

.coffee-menu-category {border-bottom:1px solid #DFD1BF;}

.coffee-menu-category summary {display:flex; align-items:center; gap:13px; padding:14px 16px; list-style:none; cursor:pointer;}

.coffee-menu-category summary::-webkit-details-marker {display:none;}

.coffee-menu-category summary::after {content:"+"; margin-left:auto; color:#89523D;}

.coffee-menu-category[open] summary::after {content:"−";}

.coffee-menu-icon {display:flex; align-items:center; justify-content:center; flex:0 0 43px; height:43px; border-radius:8px; background:#EEE2D2; color:#89523D;}

.coffee-menu-category[open] .coffee-menu-icon {background:none; color:#FFF;}

.coffee-menu-content {padding:0 20px 22px 72px;}

.coffee-menu-category:not([open]) > .coffee-menu-content {display:none;}

.coffee-menu-content h3 {display:none;}

.coffee-menu-content ul {margin:0; padding:0; list-style:none;}

.coffee-menu-content li {padding:10px 0; border-bottom:1px solid #DFD1BF; overflow-wrap:break-word;}

.coffee-menu-category summary:focus-visible {outline:3px solid #89523D; outline-offset:-3px;}



@media (min-width:768px) {

.coffee-menu {padding:50px 24px;}

.coffee-menu-categories {position:relative; min-height:497px; padding:25px 0; box-sizing:border-box; background:#FAF5EC; box-shadow:inset 220px 0 0 #EEE2D2; box-shadow: 0px 0px 20px rgb(24, 13, 12, .3);}

.coffee-menu-category {width:220px; border:0;}

.coffee-menu-category summary {width:196px; height:61px; margin:0 12px; padding:10px 14px; box-sizing:border-box; border-radius:8px;}

.coffee-menu-category summary:hover {background:#E2D0BB;}

.coffee-menu-category[open] summary {background:#180d0c; color:#FFF;}

.coffee-menu-category summary::after {display:none;}

.coffee-menu-category .coffee-menu-icon {flex-basis:26px; height:26px; background:transparent; color:inherit;}

.coffee-menu-content {position:absolute; top:0; left:220px; right:0; padding:30px 36px;}

.coffee-menu-content h3 {display:block; margin:0 0 20px;}

.coffee-menu-content ul {display:grid; grid-template-columns:1fr 1fr; column-gap:32px;}

}



@media (max-width:767px) {

.coffee-menu-icon {background:none; color:#39261F;}

.coffee-menu-category summary {font-size:18px; font-weight:700;}

.coffee-menu-category summary::after {color:inherit;}

.coffee-menu-category[open] summary {background:#180D0C; color:#FFF; border-bottom:1px solid rgba(255,255,255,.2);}

.coffee-menu-category[open] .coffee-menu-icon {background:none; color:#FFF;}

.coffee-menu-category[open] .coffee-menu-content {padding-top:12px; background:#49332B; color:#FFF;}

.coffee-menu-category[open] .coffee-menu-content li {font-size:15px; font-weight:400; border-bottom:1px solid rgba(255,255,255,.12);}

}

/*==================================================

SERVICE AREAS

====================================================*/



.service-bar { padding:48px 0 38px; text-align:center; overflow:hidden; }

.service-bar:before { content:""; position:absolute; inset:0; background:radial-gradient(circle at top left,rgba(255,255,255,.18),transparent 14%),radial-gradient(circle at bottom right,rgba(0,0,0,.12),transparent 38%); pointer-events:none; }

.service-inner { position:relative; z-index:2; max-width:1200px; margin:0 auto; }

.service-eyebrow { display:inline-block; font-size:14px; font-weight:800; letter-spacing:3px; text-transform:uppercase; background:rgba(255,255,255,.16); border:1px solid rgba(55,55,55,.38); border-radius:999px; padding:8px 24px; margin-bottom:16px; }

.service-bar h2 { color:#278dc1; font-size:46px; font-weight:900; line-height:1.1; margin:0 0 30px; text-shadow:0 3px 14px rgba(0,0,0,.18); }

.service-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; align-items:stretch; }

.service-item { display:flex; align-items:center; justify-content:flex-start; gap:18px; text-align:left; background:rgba(255,255,255,.13); border:1px solid rgba(255,255,255,.32); border-radius:16px; padding:20px 24px; font-size:18px; line-height:1.35; font-weight:800; box-shadow:0 14px 30px rgba(0,0,0,.14); backdrop-filter:blur(4px); }

.service-icon { flex:0 0 50px; width:50px; height:50px; display:flex; align-items:center; justify-content:center; background:#fff; color:#e96324; border-radius:50%; font-size:28px; box-shadow:0 10px 22px rgba(0,0,0,.16); }

.service-icon i { color:#e96324; }

@media(max-width:991px) { .service-grid { grid-template-columns:1fr; max-width:650px; margin:0 auto; } .footer-service-bar h2 { font-size:38px; } }

@media(max-width:575px) { .service-bar { padding:38px 0 30px; } .footer-service-bar h2 { font-size:31px; } .footer-service-item { font-size:16px; padding:18px; } .footer-service-icon { flex-basis:58px; width:58px; height:58px; font-size:26px; } }



/*==========================================

3 COLUMN GRID - Search by Topic & Search

==========================================*/



.section3 { clear: both; padding: 0px; margin: 0 auto; width: 90%; }

.col3 { display: block; float: left; margin: 1.5%; }

.col3:first-child { margin: 1.5%; }



.group3:before,

.group3:after { content: ""; display: table; }

.group3:after { clear: both; }

.group3 { zoom: 1; /* For IE 6/7 */ }

.span3_of_3 { width: 98%; }

.span2_of_3 { width: 66%; }

.span1_of_3 { width: 32%; }



.spanQMark { width: 16%; background:; }

.spanBracket { width: 5%; background:; }

.spanQuote { width: 55%; font-style: italic; text-align: center; font-size: 26px; line-height: 28px; color: #455562; text-align: center; }



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

    .spanQMark img { width: 90%; }

}



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

    .spanQMark { width: 10%; background:; }

    .spanQuote { width: 70%; font-size: 20px; line-height: 20px; }

}



@media only screen and (max-width: 1000px) and (min-width:551px) {

    .col3 { margin: 1.5%; }

    .col3:first-child { margin-left: 1.5%; }

    .span2_of_3, .span1_of_3 { width: 45%; }

}



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

    .col3 { margin: .5% 0 .5% 0%; }

    .col3:first-child { margin-left: 0%; }

    .span3_of_3, .span2_of_3, .span1_of_3 { width: 100%; }

}



/*==================================================

MODAL FOR DIRECTIONS

====================================================*/

.directions-modal {width:700px; max-width:calc(100% - 32px); max-height:90vh; margin:auto; padding:24px; box-sizing:border-box; border:0; border-radius:14px; background:#FAF5EC; color:#39261F; overflow-y:auto;}

.directions-modal::backdrop {background:rgba(0,0,0,.75);}

.directions-header {display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:15px;}

.directions-header h2 {margin:0; color:#39261F; font-size:22px; letter-spacing: -1px; text-transform: uppercase;}

.directions-close {flex-shrink:0; width:44px; height:44px; padding:0; border:0; background:none; color:#39261F; font-size:32px; cursor:pointer;}

.directions-address {margin-bottom:20px;}

.directions-map {display:block; width:100%; height:320px; border:2px solid #000; border-radius:6px;}

.directions-note {margin:18px 0; font-size:14px; font-weight:600;}

.directions-actions {display:flex; gap:15px;}

.directions-actions a {display:flex; align-items:center; justify-content:center; gap:10px; flex:1; padding:15px; border-radius:8px; background:#180D0C; color:#FFF; text-align:center; text-decoration:none;}

.directions-actions a:hover {background:#49332B; color:#FFF;}



@media (max-width:767px) {

.directions-modal {padding:20px;}

.directions-map {height:260px;}

.directions-actions {flex-direction:column;}

}



/*==================================================

ADMIN PAGE DESIGNER WIDGETS

====================================================*/



/*Feature Headline Inside Feature Image*/

.feature-image-overlay { position: relative; isolation: isolate; }

.feature-image-overlay::before { content: ""; position: absolute; inset: 0; z-index: 0; background-color: rgba(0, 0, 0, .35); pointer-events: none; }

.feature-image-overlay .feature-headline { position: relative; z-index: 1; }

.feature-headline { position: relative; z-index: 100; max-width: 700px; height:90%; padding: 50px; top: 50px; left: 50px; text-transform: uppercase; }

.feature-headline-inner { font-size: 48px; font-weight: 700; line-height: 48px; color: #FFF; }

.feature-cta-buttons {position:absolute; bottom:20px; text-align: center;}



/*CTA Block*/

.CTA-wrapper {max-width:1092px; margin:0 auto; padding:70px 30px; background:#180d0c; background:rgb(145, 85, 61, .9); border-radius: 24px; text-align: center; color:#eee2d2;}

.CTA-wrapper h2 {font-size:40px;}

.CTA-wrapper h3 {font-size:28px;}

.CTA-wrapper h2, .CTA-wrapper h3, .cta-phone a, .cta-contact a {color:#eee2d2;}



.cta-phone, .cta-contact { margin-top:10px; margin-bottom:10px; font-weight:700; font-size:18px;}

.cta-phone a, .cta-contact a {padding:16px 40px; margin: 0 auto; border:2px solid #eee2d2;; border-radius:50px; background: rgba(255,255,255,.08); backdrop-filter: blur(4px);}

.cta-phone a:hover, .cta-contact a:hover { color:#FFF; text-shadow:1px 1px 1px #000; background:rgba(187,98,32,.45); backdrop-filter:blur(4px); }



.cta-phone i {margin-right:10px;}

.cta-contact {}



@media (max-width: 768px)

{

    .CTA-wrapper {padding:40px 20px 70px 20px;}

    .CTA-wrapper h2 {font-size:30px;}

    .CTA-wrapper h3 {font-size:20px;}

}



/*==================================

    ADMIN PAGE CONTENT CLASSES

==================================*/

    #page-feature-image-controls .feature-image-tools { padding-top: 24px; min-width: 0; }

    #page-feature-image-controls .feature-image-action-area { position: relative; margin-bottom: 16px; }

    #page-feature-image-controls .feature-image-actions { display: flex; gap: 8px; width: 100%; margin: 0; }

    #page-feature-image-controls .feature-image-action { appearance: none; box-sizing: border-box; position: static; float: none; display: inline-flex; align-items: center; justify-content: center; flex: 1 1 0; width: 0; min-width: 0; max-width: 100%; height: 38px; margin: 0; padding: 6px 8px; border: 1px solid #278cc1; border-radius: 3px; background: #278cc1; color: #fff; font-family: inherit; font-size: 12px; font-weight: 600; line-height: 16px; text-align: center; white-space: normal; cursor: pointer; }

    #page-feature-image-controls .feature-image-action:hover { background: #2078a5; }

    #page-feature-image-controls .feature-image-action:focus-visible,

    #page-feature-image-controls .feature-image-library-close:focus-visible { outline: 2px solid #165b80; outline-offset: 2px; }

    #page-feature-image-controls .feature-image-action:disabled { opacity: .6; cursor: wait; }

    #page-feature-image-controls .feature-image-library { position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 1000; box-sizing: border-box; width: 100%; max-width: 100%; margin: 0; padding: 12px; border: 1px solid #ced4da; border-radius: 4px; background: #fff; box-shadow: 0 4px 12px rgba(0,0,0,.18); }

    #page-feature-image-controls .feature-image-library[hidden] { display: none !important; }

    #page-feature-image-controls .feature-image-library-close { position: static; float: none; width: auto; min-width: 0; height: 28px; margin: 0; padding: 3px 8px; border: 1px solid #aaa; border-radius: 3px; background: #fff; color: #444; font-family: inherit; font-size: 12px; line-height: 20px; cursor: pointer; }



    /* Section headers stay visible while their fields are collapsed. */

    .admin-crud .page-section-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; width: 100%; min-width: 0; }

    .admin-crud .page-section-header h2 { min-width: 0; }

    /* The section body is now the grid parent. Keep its columns wrapping and

       restore the 12px gutter on each side of ordinary field/tab columns.

       Editor panels retain their existing 40px padding. */

    .admin-crud .page-section-body { display: flex; flex-wrap: wrap; width: 100%; min-width: 0; margin: 0; padding: 0; }

    .admin-crud .page-section-body > .col-md-4,

    .admin-crud .page-section-body > .col-12:not(.create-panel) { padding-left: 12px; padding-right: 12px; }

    .admin-crud .page-section-body[hidden] { display: none !important; }

    .admin-crud .page-section-toggle { appearance: none; position: static; float: none; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 32px; width: 32px; min-width: 32px; height: 32px; margin: 0; padding: 0; border: 0; border-radius: 3px; background: transparent; color: #929292; font-size: 16px; line-height: 1; cursor: pointer; }

    .admin-crud .page-section-toggle:hover { background: rgba(0,0,0,.04); }

    .admin-crud .page-section-toggle:focus-visible { outline: 2px solid #278cc1; outline-offset: 2px; }

    /* Set color on the icons themselves to override the general admin icon rule. */

    .admin-crud .page-section-toggle .page-section-close { color: #929292; }

    .admin-crud .page-section-toggle .page-section-expand { color: #278cc1; font-size: 21px; }

    .admin-crud .page-section-toggle[aria-expanded="true"] .page-section-expand,

    .admin-crud .page-section-toggle[aria-expanded="false"] .page-section-close { display: none; }



    .create-toggle { cursor: pointer; }

    .create-panel[hidden] { display: none !important; }

    /* The base button has an important fixed width. Override it only for these tabs. */

    .admin-crud .property-controls .btn-cc-submit.create-toggle,

    .admin-crud .callout-controls .btn-cc-submit.create-toggle,

    .admin-crud .section-controls .btn-cc-submit.create-toggle { display: inline-block; width: auto !important; max-width: 100%; min-width:120px; margin: 0; white-space: normal; overflow-wrap: anywhere; }



/*==================================

    END ADMIN PAGE CONTENT CLASSES

==================================*/