/* Theme Name: By The Bay Real Estate Photography ~ Divi Child Theme URI: https://diviextended.com/divi-child-themes/ Description: A starter child theme for Divi, built with best practices. Generated with Divi Extended Child Theme Generator. Author: Shannon Bergin Author URI: https://fetchingmedia.ca/ Template: Divi Version: 1.2.0 License: GPL v2 or later License URI: https://www.gnu.org/licenses/gpl-2.0.html Text Domain: by-the-bay-real-estate-photography-divi-child-theme Domain Path: /languages */ /* Generated with Divi Extended Child Theme Generator https://diviextended.com/divi-child-theme-generator/ */ /* ========================================================================== Global Styles General resets, box model, body defaults, links, and utility classes. ========================================================================== */ /* Add your global styles below */ #sub-header ::before { font-family:ETmodules!important; margin-right: 0.5em; font-size: 17px; position:relative; top: 3px; } #sub-header #bb-info-email:before{ content: "\e076"; } #sub-header #bb-info-phone:before { content: "\e090"; } #sub-header #bb-info-user:before{ content: "\e08a"; } #sub-header{ margin: 0px; padding:0px; } .vert-centre { display: flex; justify-content: center; align-items: center; } .vert-right { display: flex; justify-content: flex-end; align-items: center; } .vert-middle, .vert-middle .et_pb_blurb_container{ vertical-align: middle; } .vert-bottom, .vert-bottom.et_pb_column, #team-section .rt-team-container .tlp-content { display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 0 6.5% !important; } ul#menu-main-menu { font-weight: 500; } #con-photos .icon-title .et_pb_main_blurb_image, #con-aerial-media .icon-title .et_pb_main_blurb_image, #con-video .icon-title .et_pb_main_blurb_image,#con-virtual-tours .icon-title .et_pb_main_blurb_image, #con-floor-plans .icon-title .et_pb_main_blurb_image { position: relative; display: inline-block; margin-bottom: 20px; } #con-photos .icon-title .et_pb_blurb_content, #con-aerial-media .icon-title .et_pb_blurb_content, #con-video .icon-title .et_pb_blurb_content,#con-virtual-tours .icon-title .et_pb_blurb_content, #con-floor-plans .icon-title .et_pb_blurb_content{ padding-right: 23px; margin: 0 auto; } #con-photos .icon-title .et_pb_blurb_content .et_pb_blurb_container, #con-aerial-media .icon-title .et_pb_blurb_content .et_pb_blurb_container, #con-video .icon-title .et_pb_blurb_content .et_pb_blurb_container,#con-virtual-tours .icon-title .et_pb_blurb_content .et_pb_blurb_container, #con-floor-plans .icon-title .et_pb_blurb_content .et_pb_blurb_container{ padding-left:0px; } #title_area.et_pb_section { padding: 0px; } .et_pb_fullwidth_header_1.et_pb_fullwidth_header .header-content h1, .et_pb_fullwidth_header_1.et_pb_fullwidth_header .header-content h2.et_pb_module_header, .et_pb_fullwidth_header_1.et_pb_fullwidth_header .header-content h3.et_pb_module_header, .et_pb_fullwidth_header_1.et_pb_fullwidth_header .header-content h4.et_pb_module_header, .et_pb_fullwidth_header_1.et_pb_fullwidth_header .header-content h5.et_pb_module_header, .et_pb_fullwidth_header_1.et_pb_fullwidth_header .header-content h6.et_pb_module_header, #main-content .et_pb_module_header, #main-content .et_pb_contact_main_title { margin-bottom:0.35em; } .et_pb_section, #main-content .et_pb_row, .et_pb_fullwidth_header, footer .et_pb_row, #main-content .et_pb_section, footer .et_pb_section, #realty-logos .dtq-carousel .slick-track { padding: 15px 0 ; } #realty-logos div.slick-track {display:flex; align-items: center;} /* ========================================================================== Typography Headings (h1-h6), paragraphs, blockquotes, lists, and font overrides. ========================================================================== */ #main-content h1{ line-height: 1.2em; } h1{ color: #FFFFFF; letter-spacing: -0.05em; } #main-content sup{ bottom: 0.7em; font-size: .5em; } footer{ h1, h2, h3, h4, h5, h6 { color: #2ea3f2 !important; padding-bottom: 5px; } } /* Add your typography styles below */ /* ========================================================================== Header & Navigation Main header, logo, primary menu, mobile menu, top header bar. ========================================================================== */ /* Add your header styles below */ /* Add close icon in open hamburger menu */ .mobile_nav.opened .mobile_menu_bar:before { content: '\4d'; } ul.et_mobile_menu:last-child, .sub-menu:last-child{ border-radius: 0px 0px 10px 10px; } .et_mobile_menu .first-level > a { background-color: transparent; position: relative; } .et_mobile_menu .first-level > a::after { font-family: 'ETmodules'; content: '\4c'; font-weight: normal; position: absolute; font-size: 16px; top: 13px; right: 10px; } .et_mobile_menu .first-level > .icon-switch::after{ content: '\4d'; } .second-level { display: none; } .reveal-items { display: block; } .et_mobile_menu { margin-top: 20px; width: 475%; border-radius: 15px; background: radial-gradient(circle at 100% 100%, #ffffff 0, #ffffff 3px, transparent 3px) 0% 0% / 8px 8px no-repeat, radial-gradient(circle at 0 100%, #ffffff 0, #ffffff 3px, transparent 3px) 100% 0% / 8px 8px no-repeat, radial-gradient(circle at 100% 0, #ffffff 0, #ffffff 3px, transparent 3px) 0% 100% / 8px 8px no-repeat, radial-gradient(circle at 0 0, #ffffff 0, #ffffff 3px, transparent 3px) 100% 100% / 8px 8px no-repeat, linear-gradient(#ffffff, #ffffff) 50% 50% / calc(100% - 10px) calc(100% - 16px) no-repeat, linear-gradient(#ffffff, #ffffff) 50% 50% / calc(100% - 16px) calc(100% - 10px) no-repeat, linear-gradient(90deg, transparent 0%, #279ede 50%, transparent 100%); } .nav li ul.sub-menu { border-radius: 0px 0px 15px 15px !important; background: radial-gradient(circle at 100% 100%, #ffffff 0, #ffffff 3px, transparent 3px) 0% 0% / 8px 8px no-repeat, radial-gradient(circle at 0 100%, #ffffff 0, #ffffff 3px, transparent 3px) 100% 0% / 8px 8px no-repeat, radial-gradient(circle at 100% 0, #ffffff 0, #ffffff 3px, transparent 3px) 0% 100% / 8px 8px no-repeat, radial-gradient(circle at 0 0, #ffffff 0, #ffffff 3px, transparent 3px) 100% 100% / 8px 8px no-repeat, linear-gradient(#ffffff, #ffffff) 50% 50% / calc(100% - 10px) calc(100% - 16px) no-repeat, linear-gradient(#ffffff, #ffffff) 50% 50% / calc(100% - 16px) calc(100% - 10px) no-repeat, linear-gradient(90deg, transparent 0%, #279ede 50%, transparent 100%) !important; } /* hamberger Menu fixes*/ /* ========================================================================== Footer Footer widgets, footer menu, bottom bar, copyright area. ========================================================================== */ footer p, footer li, footer a{ font-size: 0.96em; } #sub-footer p{ font-size:0.8em; } /* Add your footer styles below */ footer a:hover, footer a,div#sub-footer .et_pb_social_media_follow li a.icon:hover:before, div#sub-footer .et_pb_social_media_follow li a.icon:before{ -webkit-transition: all .4s ease-in-out; transition: all .4s ease-in-out; } footer a:hover{ color: #2ea3f2 !important; } div#sub-footer .et_pb_social_media_follow li a.icon:hover:before{ color: #fff !important; } /* ========================================================================== Pricing Table by Supsystic ========================================================================== */ /* Add your princing table styles below */ .ptsColHeader { color: #fff; font-family: 'League Spartan',Helvetica,Arial,Lucida,sans-serif; margin-top: 1.2em; margin-bottom: 1.2em; } .ptsEl h4 { color: #fff !important;} .ptsEl h6{ font-weight: 300; } .ptsToggle sub{ font-size: 12px; font-family: 'League Spartan',Helvetica,Arial,Lucida,sans-serif; line-height: 4; top: unset; margin-left: -12px; } .ptsCell h6{ color: #3ba4e0; font-family: 'League Spartan',Helvetica,Arial,Lucida,sans-serif; font-size: 1.5em; font-weight: 300; } #BTN-chart1.ptsActBtn, #BTN-chart2.ptsActBtn, #BTN-chart3.ptsActBtn { border: 3px solid #fff !important; border-radius: 15px; text-transform: uppercase !important; } /* ========================================================================== Search Boxage ========================================================================== */ /* Add your search box styles below */ .et_pb_menu .et_pb_menu__search-input{ color: #01113e; background: rgba(255, 255, 255, 0.5); border-radius: 5px; } /* ========================================================================== Blog & Archive Blog listing, archive pages, category pages, search results, pagination. ========================================================================== */ /* Add your blog styles below */ /* ========================================================================== Single Post Post title, meta, featured image, content area, author box, related posts. ========================================================================== */ /* Add your single post styles below */ /* ========================================================================== Single Page Default page template, full-width page, landing pages. ========================================================================== */ /* Add your single page styles below */ /* ========================================================================== Page Elements ========================================================================== */ /* Add your single page styles below */ div.info-boxes:hover{ box-shadow: 0px 0px 4px 2px rgba(255, 255, 255, 1); -webkit-box-shadow: 0px 0px 4px 2px rgba(255, 255, 255, 1);} div.info-boxes h3.et_pb_module_header{margin-bottom: 0.01em !important; } div.info-boxes a {color: #155480; } div.info-boxes{ display: flex; align-items: center; } .link-buttons a { display: inline-block !important; } /* Price Packages */ .et_pb_pricing_heading { border-radius: 10px 10px 0px 0px; } .et_pb_pricing_table_1 .et_pb_pricing li:first-child span:before, .et_pb_pricing_table_2 .et_pb_pricing li:first-child span:before{ display: None; font-family: 'League Spartan',Helvetica,Arial,Lucida,sans-serif; text-transform: uppercase; color: #03416e; text-align: center; } .et_pb_pricing_table_1 .et_pb_pricing li:first-child, .et_pb_pricing_table_2 .et_pb_pricing li:first-child{ font-family: 'League Spartan',Helvetica,Arial,Lucida,sans-serif; text-transform: uppercase; color: #03416e; text-align: center; font-weight: 700; font-size: 1.1em; line-height: 20px; } .et_pb_pricing li span::before{ font-family: ETmodules; content: "" !important; color:#2ea3f2; border: none; left: -20px; top: -6px; border-radius: 0px; } .et_pb_pricing li.et_pb_not_available span::before{ content:"" !important; color:#0C71C3;} /* ========================================================================== Sidebar & Widgets Widget areas, widget titles, default WordPress widgets, custom widgets. ========================================================================== */ /* Add your sidebar styles below */ /* ========================================================================== App Slider Footer App slider ========================================================================== */ footer .et_pb_slide_image, footer .et_pb_slide:first-child .et_pb_slide_image img.active { -webkit-animation-duration: 0s !important; animation-duration: 0s !important; } .our-app ul{ list-style-type: none; padding: 0; margin: 0; column-count: 2; column-gap: 2%; } .our-app img:hover{ box-shadow: 0px 0px 4px 2px rgba(255, 255, 255, 0.6); -webkit-box-shadow: 0px 0px 4px 2px rgba(255, 255, 255, 0.6); border-radius: 5px; } #APP_Slider .et_pb_slider_container_inner{ display: inline-flex; flex-direction: row-reverse; } #APP_Slider {overflow: visible; } #APP_Slider .et_pb_slide_image { width: 50% !important; margin-top: 0px !important; text-align: right; } #APP_Slider .et_pb_slide_image img{ max-height: fit-content !important; width: 75%; } #APP_Slider .et_pb_slide_description{ width: 50% !important; padding: 0px; margin: 0px; } #APP_Slider .et_pb_slide_description p{ padding-bottom: 2em; } /* ========================================================================== Comments Comment list, comment form, reply links, avatars, nested comments. ========================================================================== */ /* Add your comment styles below */ /* ========================================================================== Smash Baloon Plugin Instragrams feed styles gird layout ========================================================================== */ /* Add your comment styles below */ .sbi_feedtheme_header_text H3{ color: #3BA4E0; font-size: 31px !important; } .sbi_feedtheme_header_text p.sbi_bio{ color: #f2f2f2; } #sb_instagram .sb_instagram_header p, .sb_instagram_header p{ font-size: 16px; } .outline-headers { h1, h2, h3, h4, h5, h6 { -webkit-text-stroke: .05em; paint-order: stroke fill; } } .outline-headers.grey{ h1, h2, h3, h4, h5, h6 { -webkit-text-stroke-color: #666666; } } .outline-headers.white{ h1, h2, h3, h4, h5, h6 { -webkit-text-stroke-color: #ffffff; } } .outline-headers.dkblue{ h1, h2, h3, h4, h5, h6 { -webkit-text-stroke-color: #03416e; } } .outline-headers.ltblue{ h1, h2, h3, h4, h5, h6 { -webkit-text-stroke-color: #2ea3f2; } } /* ========================================================================== WooCommerce Shop page, product cards, single product, cart, checkout, my account. ========================================================================== */ /* Add your WooCommerce styles below */ /* ========================================================================== Divi Builder Overrides Section, row, column overrides. Module-specific style adjustments. ========================================================================== */ /* Add your Divi Builder overrides below */ /* ========================================================================== Forms & Inputs Contact forms, input fields, textareas, selects, validation states. ========================================================================== */ /* Add your form styles below */ /* ========================================================================== Buttons & CTAs Default buttons, Divi buttons, call-to-action elements, hover states. ========================================================================== */ /* Add your button styles below */ .et_pb_button, body #main-content #sb_instagram #sbi_load .sbi_load_btn,body #main-content #sb_instagram .sbi_follow_btn a,#reviews_slider .ti-widget.ti-goog .ti-header-write-btn-container .ti-header-write-btn{ color: #FFFFFF !important; border-width: 3px; border-radius: 15px !important; font-weight: 600 !important; text-transform: uppercase !important; background-image: linear-gradient(180deg, #3581b0 0%, #03416e 100%) !important; background-color: #3581b0; padding: 0.3em 1em ; box-shadow: 0px 2px 18px 0px rgba(0,0,0,0.3); } body #main-content #sb_instagram #sbi_load .sbi_load_btn, body #main-content #sb_instagram .sbi_follow_btn a { border:1px solid #fff; border-radius: 9px !important; cursor: pointer; } body #main-content #sb_instagram #sbi_load .sbi_load_btn{ background-image: linear-gradient(180deg, #666666 0%, #b8b6b7 100%) !important; background-color: #b8b6b7; } body #main-content .wpf_has_custom_css.ff-btn-submit{ font-size:20px; font-weight: 600 !important; padding: 0.3em 1em; margin-right:1em; border: 2px solid; } body #main-content .wpf_has_custom_css.ff-btn-submit:hover{ opacity:1; padding: .3em 2em .3em .7em; } body #main-content #checklist .wpf_has_custom_css.ff-btn-submit:hover::after{ content:""; } #reviews_slider .ti-widget.ti-goog .ti-header-write-btn-container .ti-header-write-btn:hover::after{ content:"\f303"; transition: all 300ms ease 0ms; font-family: FontAwesome !important;} body #main-content .et_pb_button:hover, body #main-content .et_pb_bg_layout_light.et_pb_button:hover, body #main-content .et_pb_bg_layout_light .et_pb_button:hover, body #main-content .et_pb_button:hover, body #main-content #sb_instagram #sbi_load .sbi_load_btn:hover, body #main-content #sb_instagram .sbi_follow_btn a:hover { background-image: linear-gradient(180deg, #03416e 0%, #3581b0 100%) !important; background-color: #03416e; color: #fff !important; } body #main-content #sb_instagram #sbi_load .sbi_load_btn:hover{ background-image: linear-gradient(180deg, #b8b6b7 0%, #666666 100%) !important; background-color: #666666 !important; color: #404040; transition: all var(--sb-duration-100) ease-in; } body #main-content .et_pb_button:hover:active, a.et_pb_button.et_pb_more_button.et_pb_button_two:hover:active, body #main-content #sb_instagram #sbi_load .sbi_load_btn:hover:active , body #page-container .et_pb_section .et_pb_fullwidth_header_0 .et_pb_button_one.et_pb_button:hover:active, body #page-container .et_pb_section .et_pb_fullwidth_header_0 .et_pb_button_two.et_pb_button:hover:active, body #main-content #page-container .et_pb_section .et_pb_button_2:hover:active , body #main-content #sb_instagram .sbi_follow_btn a:hover:active , body #main-content #sb_instagram .sbi_follow_btn a:hover:active , body #main-content #sb_instagram .sbi_follow_btn a:hover:active, #reviews_slider .ti-widget.ti-goog .ti-header-write-btn-container .ti-header-write-btn:hover:active { color: #b8b6b7 !important; position:relative; top:2px; background-image: linear-gradient(180deg, #b8b6b7 0%, #666666 100%) !important; border-color: #b8b6b7 !important; transition: all var(--sb-duration-100) ease-in; } .et_button_custom_icon .et_pb_button::after { line-height: 1.5em !important; } /* Services Icons */ .icon-title .et-pb-icon, .info-boxes .et-pb-icon{ -webkit-text-stroke: 0.2em; paint-order: stroke fill; } #main-content h1, .BB-Title h1 { -webkit-text-stroke: 0.06em; paint-order: stroke fill; letter-spacing: 0em; } .outline-white .et-pb-icon{ -webkit-text-stroke-color: #fff; } .outline-dkblue .et-pb-icon, #main-content h1, .BB-Title h1{ -webkit-text-stroke-color: #011a50; } .outline-ltblue .et-pb-icon{ -webkit-text-stroke-color: #2b87da; } .outline-grey .et-pb-icon{ -webkit-text-stroke-color: #666666; } /* Check List */ #checklist .et_pb_contact_field_options_title, #checklist .ff-el-input--label label{ background: radial-gradient(circle at 100% 100%, #ffffff 0, #ffffff 3px, transparent 3px) 0% 0%/8px 8px no-repeat, radial-gradient(circle at 0 100%, #ffffff 0, #ffffff 3px, transparent 3px) 100% 0%/8px 8px no-repeat, radial-gradient(circle at 100% 0, #ffffff 0, #ffffff 3px, transparent 3px) 0% 100%/8px 8px no-repeat, radial-gradient(circle at 0 0, #ffffff 0, #ffffff 3px, transparent 3px) 100% 100%/8px 8px no-repeat, linear-gradient(#ffffff, #ffffff) 50% 50%/calc(100% - 10px) calc(100% - 16px) no-repeat, linear-gradient(#ffffff, #ffffff) 50% 50%/calc(100% - 16px) calc(100% - 10px) no-repeat, linear-gradient(90deg, transparent 0%, #279ede 50%, transparent 100%); } #checklist .ff-el-input--label label, #checklist .fluentform .ff-el-input--label{ display: block; width: 100%; font-weight: 700; text-transform: uppercase; color: #3581b0; font-size: 31px; box-sizing: border-box; padding-bottom: 15px; padding-top: 15px; text-align: center; font-family: 'League Spartan',Helvetica,Arial,Lucida,sans-serif; } .ff-el-input--content:has(input[aria-required="true"])::before, .ff-el-input--content:has(textarea[aria-required="true"])::before { /* 2. Use attr() to pull the value from the input inside it */ content: "*" attr(aria-required); /* Styling for the badge */ margin-left: 10px; margin-top: 10px; font-weight: 600; color: red; font-size: 18px; font-style: italic; position: absolute; z-index:10; } #contact-form .ff-el-input--content { display: flex; justify-content: space-between; position: relative; } #contact-form .ff-el-input--label label, #contact-form .fluentform .ff-el-input--label, #contact-form .ff-el-form-check-label span{font-size:16px; font-weight: 300; line-height: 1.7em; padding-bottom: 0; margin: 0; } #contact-form .ff-el-form-check-label span{font-style: italic; } #checklist .et_pb_contact_field { border-radius: 5px; } #checklist .et_pb_contact_field_options_wrapper { padding: 5%; } #checklist span.et_pb_contact_field_checkbox label{ padding-left:25px; text-indent: -25px; } #checklist .fluentform .ff-el-form-check { padding-left: 60px; text-indent: -23px; padding-right:40px; font-size: 16px; margin-bottom: 10px; } #checklist span.et_pb_contact_field_checkbox{ padding-bottom:10px; } #checklist .et_pb_contact .et_pb_contact_field input[type=checkbox]:checked+label i:before, #contact-form .et_pb_contact .et_pb_contact_field input[type=checkbox]:checked+label i:before { margin-left:13px; } #checklist input[type="checkbox"], #contact-form input[type="checkbox"] { appearance: none; background-color: #fff; margin: 0; font: inherit; color: currentColor; width: 20px; height: 20px; border: 0.15em solid currentColor; border-radius: 15px; transform: translateY(-0.075em); display: inline-grid; place-content: center; cursor: pointer; } #contact-form .fluentform form input[type=email].ff-el-form-control, #contact-form .fluentform form input[type=text].ff-el-form-control, #contact-form .fluentform form input[type=url].ff-el-form-control, #contact-form .fluentform form input[type=tel].ff-el-form-control, #contact-form .fluentform form input[type=number].ff-el-form-control, #contact-form .fluentform form input[type=date].ff-el-form-control, #contact-form .fluentform form input[type=file].ff-el-form-control, #contact-form .fluentform form select.ff-el-form-control, #contact-form .fluentform form textarea.ff-el-form-control{padding-left:20px !important;} #checklist input[type="checkbox"]::before, #contact-form input[type="checkbox"]::before { content: ""; width: 12px; height: 12px; transform: scale(0); transition: 120ms transform ease-in-out; box-shadow: inset 1em 1em #155480; border-radius: 15px; } #checklist input[type="checkbox"]:checked::before, #contact-form input[type="checkbox"]:checked::before { transform: scale(1); } #checklist .fluentform .ff-el-form-check-label .ff-el-form-check-input{ top: 0px; } /* HTML:
This is a Tooltip with a border and a border radius. Border and background have a gradient coloration
*/ .ff-el-input--content .error { color: #fff !important; font-size: 15px; max-width: 25ch; text-align: center; } .ff-el-input--content .error { /* triangle dimension */ --a: 90deg; /* angle */ --h: .5em; /* height */ --p: 50%; /* triangle position (0%:top 100%:bottom) */ --b: 3px; /* border width */ --r: 10px; /* the radius */ padding: .5em; border: var(--b) solid #0000; border-radius: var(--r)/min(var(--r),var(--p) - var(--h)*tan(var(--a)/2)) var(--r) var(--r) min(var(--r),100% - var(--p) - var(--h)*tan(var(--a)/2)); background: padding-box linear-gradient(-30deg,#000a2a ,#03416e ), /* background gradient */ radial-gradient(circle at 100% 100%, #ffffff 0, #ffffff 3px, transparent 3px) 0% 0%/8px 8px no-repeat, radial-gradient(circle at 0 100%, #ffffff 0, #ffffff 3px, transparent 3px) 100% 0%/8px 8px no-repeat, radial-gradient(circle at 100% 0, #ffffff 0, #ffffff 3px, transparent 3px) 0% 100%/8px 8px no-repeat, radial-gradient(circle at 0 0, #ffffff 0, #ffffff 3px, transparent 3px) 100% 100%/8px 8px no-repeat, linear-gradient(#ffffff, #ffffff) 50% 50%/calc(100% - 10px) calc(100% - 16px) no-repeat, linear-gradient(#ffffff, #ffffff) 50% 50%/calc(100% - 16px) calc(100% - 10px) no-repeat, linear-gradient(90deg, #ffffff 0%, #48abe0 50%, #ffffff 100%);/* border gradient */ background-size: calc(100% + var(--h)) 100%; background-position: right; position: absolute; z-index: 0; box-shadow: 0px 2px 18px 0px rgba(0, 0, 0, 0.3); left: 50%; width: stretch; margin-top: 0px !important; } .ff-el-input--content .error:before, .ff-el-input--content .error:after { content: ""; position: absolute; z-index: -1; inset: calc(-1*var(--b)) calc(-1*var(--b)) calc(-1*var(--b)) calc(-1*var(--b) - var(--h)); background: inherit; } .ff-el-input--content .error:before { background-size:0 0, 100% 100%; clip-path: polygon( calc(var(--h) + var(--b)) min(100%,var(--p) + var(--h)*tan(var(--a)/2)), var(--h) min(100%,var(--p) + var(--h)*tan(var(--a)/2)), 0 var(--p), var(--h) max(0%,var(--p) - var(--h)*tan(var(--a)/2)), calc(var(--h) + var(--b)) max(0%,var(--p) - var(--h)*tan(var(--a)/2)) ); } .ff-el-input--content .error:after { border: inherit; background-size: 100% 100%,0 0; clip-path: polygon(calc(var(--h) + var(--b)) min(100% - var(--b),var(--p) + var(--h)*tan(var(--a)/2) - var(--b)*tan(45deg - var(--a)/4)),calc(var(--b)/sin(var(--a)/2)) var(--p),calc(var(--h) + var(--b)) max(var(--b),var(--p) - var(--h)*tan(var(--a)/2) + var(--b)*tan(45deg - var(--a)/4)),50% 50%); } /* Google Map Overlay */ .google-overlay { background:transparent; position:relative; width:100%; height:480px; /* your iframe height */ top:480px; /* your iframe height */ margin-top:-480px; /* your iframe height */ } /* Google Reviews styles */ #reviews_slider .ti-widget.ti-goog .ti-review-item>.ti-inner { border-color: #2ea3f2 !important; border-radius: 15px 15px !important; } #reviews_slider .ti-widget.ti-goog .ti-read-more::after { background: #76c3f6 !important; } #reviews_slider .ti-widget.ti-goog .ti-controls .ti-next,#reviews_slider .ti-widget.ti-goog .ti-controls .ti-prev { outline-color: #76c3f6 !important; } #reviews_slider .ti-reviews-container, #reviews_slider .ti-widget-container{ margin-bottom: 0px;} /* Clent logos in carousel*/ #client_logos .dtq_logo_carousel_item.swiper-slide.et_pb_module.et_flex_module { display: flex; justify-content: center; align-items: center; height: 110px; } /* Team Styles */ #team-section .rt-team-container .tlp-content { background: transparent !important; padding:0px; position: absolute; bottom: 5px; width: 100%; border:none; } /* HTML:
Your text content
*/ #team-section .rt-team-container .tlp-position { color: #03426E !important; background: #fff !important; padding: 0.75em !important; box-decoration-break: clone; border-radius: 0px 0px 5px 5px; margin-bottom: 0px !important; word-break: auto-phrase; width: 100%; font-size: initial; font-weight: initial; line-height: initial; letter-spacing: initial; margin: initial; } #team-section span.team-name { top: 13px; position: relative; } #team-section .rt-team-container h3{ z-index:10; margin-bottom: 0px !important; font-weight: initial; line-height: initial; font-size: initial; letter-spacing: initial; } #team-section .rt-team-container .tlp-content h3 { color: #fff; --r: .4em; /* control the ribbon shape (the radius) */ font-size: 1.5em !important; inset-inline: calc(-1*var(--r)); line-height: 2.5; padding: calc(2*var(--r)) .5em 0; border-radius: var(--r); --_g:0/var(--r) calc(2*var(--r)) no-repeat; background: radial-gradient(100% 50% at right,#0005 98%,#0000 101%) 0 var(--_g), radial-gradient(100% 50% at left ,#0005 98%,#0000 101%) 100% var(--_g), conic-gradient(at var(--r) calc(2*var(--r)),#0000 25%,#0C71C3 0) 0 0/calc(100% - var(--r)) 100%; box-shadow: 0px 5px 4px -1px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0px 5px 4px -1px rgba(0, 0, 0, 0.5); display: flex; justify-content: center; width: 113%; } #team-section .rt-team-container .single-team{ border-radius:7px; } #team-section .rt-team-container .rt-grid-item .single-team-area .tlp-content .tlp-position::after {visibility: hidden; display: block;font-size: 0;content: " "; clear: both; height: 0;} #team-section .rt-team-container .single-team-area, #sb_instagram .sbi_photo img, .BB-Border, .et_pb_module.et_pb_image.BB-border, .et_pb_gallery_image, .el_masonry_gallery_image_wrapper, .et_pb_video_box,#con-virtual-tours iframe, .et-fb-iframe-ancestor iframe, #main-content .framed-box iframe, .et_pb_pricing_table { padding: 5px !important; box-sizing: border-box; border-radius:15px; border-width:9px; background: radial-gradient(circle at 100% 100%, #ffffff 0, #ffffff 15px, transparent 15px) 0% 0%/15px 15px no-repeat, radial-gradient(circle at 0 100%, #ffffff 0, #ffffff 15px, transparent 15px) 100% 0%/15px 15px no-repeat, radial-gradient(circle at 100% 0, #ffffff 0, #ffffff 15px, transparent 15px) 0% 100%/15px 15px no-repeat, radial-gradient(circle at 0 0, #ffffff 0, #ffffff 3px, transparent 3px) 100% 100%/15px 15px no-repeat, linear-gradient(#ffffff, #ffffff) 50% 50%/calc(100% - 10px) calc(100% - 16px) no-repeat, linear-gradient(#ffffff, #ffffff) 50% 50%/calc(100% - 16px) calc(100% - 10px) no-repeat, linear-gradient(90deg, #f6fafd 5%, #207fc2 50%, #f6fafd 95%); justify-content: center; border: none; } #team-section .rt-team-container .single-team-area{ flex-direction: initial; } #team-section .rt-team-container .single-team-area:hover{ -webkit-transform: initial; transform: none; box-shadow: initial; border: none; } #team-section .rt-team-container .single-team-area, #sb_instagram .sbi_photo img, .BB-Border-2{ display: flex; } /* ========================================================================== Responsive / Media Queries Breakpoint-specific overrides for tablet and mobile. ========================================================================== */ /* Desktop (min-width: 1350) */ @media only screen and (min-width: 1350px) { #main-content #title_area.et_pb_section{ padding: 0; } .vis-mobile { display:none !important;} .vis-desk { display: initial !important;} } @media only screen and (device-width: 768px) { /* For general iPad layouts */ .vis-mobile { display:initial !important;} .vis-desk { display:none !important;} } @media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) { /* For landscape layouts only */ } @media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait) { /* For portrait layouts only Ipad */ footer .et_pb_gutters1 .et_pb_column_2_3,footer .et_pb_gutters1.et_pb_row .et_pb_column_2_3 { width: 66.667% !important;} } /* Tablet (max-width: 980px) */ @media only screen and (max-width: 980px) { .vis-mobile { display:initial !important;} .vis-desk { display:none !important;} #sub-header .et_pb_menu__menu { display: flex !important; } #sub-header .et_mobile_nav_menu { display: none !important; } #sub-header .show-menu .et_mobile_nav_menu, #sub-header .show-menu .et_pb_menu__wrap .et_mobile_nav_menu { display: block !important; } #sub-header .show-menu .et_mobile_menu{ right: 0; left: initial; } #sub-header .show-menu .et_pb_menu__wrap .et_mobile_nav_menu li{ white-space: nowrap; } #sub-header .show-menu .et_pb_menu__wrap .mobile_nav .mobile_menu_bar:before{ font-size:30px !important; } #sub-header .show-menu .et_pb_menu__wrap .et_pb_menu__menu{ display: none !important; } #sub-header :before{ font-size:36px !important; } #sub-header .mobile-left, #sub-header .mobile-right{ width: 50% !important; } ul.ft-address{ column-count:1 !important; } #sub-header .et_pb_menu__menu>nav>ul { padding-top:4px !important; line-height: 11px; } #sub-header :before, #sub-header .et_pb_menu__search-button::after { font-size: 18px !important; margin-left: 5px; margin-right: 5px; line-height: 13px; } #sub-header{ padding-bottom: 5px; } #bb-header .vert-centre, #sub-footer .vert-centre { display: block !important; } #client-login .et_pb_menu__wrap{ padding-left: 22px; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } #sub-header .et_pb_column, #bb-header .et_pb_main_blurb_image{ margin-bottom: 0px; } .nav li { line-height: 0.5em; } #floor-plans-gallery-2 .et_pb_column .et_pb_grid_item { margin: 0 0 4.5% 0; width: 47%; } #floor-plans-gallery-2 .et_pb_column .et_pb_grid_item.first_in_row { margin: 0 5% 4.5% 0; } #floor-plans-gallery-2 .et_pb_gallery_title{ padding:0.5em 0.5em; } #floor-plans-gallery-2 #floor-left .et_pb_gallery_title{ padding: 0.5em 0.5em; } .et_pb_gallery_1.et_pb_gallery .et_pb_gallery_title { padding: 0em 0.5em; } #con-photos .icon-title .et_pb_main_blurb_image, #con-aerial-media .icon-title .et_pb_main_blurb_image, #con-video .icon-title .et_pb_main_blurb_image,#con-virtual-tours .icon-title .et_pb_main_blurb_image, #con-floor-plans .icon-title .et_pb_main_blurb_image { position: relative; display: inline-block; margin-bottom: 20px; } #footer_socials a.icon.et_pb_with_border, #footer_socials .et_pb_social_network_link a.icon:before{ line-height: 25px; height: 25px ; width: 25px ; } #APP_Slider .et_pb_slide_description, #APP_Slider .et_pb_slide_image {width: 100% !important;} #APP_Slider .et_pb_slide_description p {padding-bottom: 8em; margin-right: 0em;} #APP_Slider .et_pb_slide_image {width: 100% !important; margin-top: 0em !important; position: absolute; z-index: -1; top: 81px; text-align: center; padding: 0 40px; } #APP_Slider .et_pb_slide_image, .et_pb_slide_video{display:block !important;} #team-section .rt-col-xs-12 {width: 50%;} #team-section .rt-team-container .rt-grid-item{margin-block-start: 0em; margin-block-end: 0.5em;} #team-section .rt-team-container .tlp-content {padding: 0 10.5% !important; } #team-section .rt-team-container .tlp-content h3 {font-size: 1em !important; line-height: 2.5;} #team-section span.team-name { top: 9px;} #team-section .rt-team-container .tlp-position{font-size: 0.8em; } #team-section .rt-team-container .rt-content-loader{ display: flex; width: 100%; flex-flow: row wrap; max-height: 1300px; margin-left: calc(var(--masonry-gutter) * -1); counter-reset: brick;} #team-section .rt-team-container .single-team-area {height: 175px;} } /* Tablet (max-width: 980px) */ @media only screen and (max-width: 980px) and (orientation:landscape) { .vis-mobile { display:none !important;} .vis-desk { display:initial !important;} #team-section .rt-col-xs-12 {width: 33.33%; border-radius: 5px; margin: 0 0 var(--masonry-gutter) var(--masonry-gutter);position: relative;} #team-section .rt-team-container .rt-grid-item{margin-block-start: 0em; margin-block-end: 0.5em;} #team-section .rt-team-container .tlp-content {padding: 0 8.5% !important; } #team-section .rt-team-container .tlp-content h3 {font-size: 1em !important; line-height: 2.5;} #team-section span.team-name { top: 9px;} #team-section .rt-team-container .tlp-position{font-size: 0.8em;} #team-section .rt-team-container .rt-content-loader{ display: flex; width: 100%; flex-flow: row wrap; max-height: 1080px; margin-left: calc(var(--masonry-gutter) * -1); counter-reset: brick;} #team-section .rt-team-container .single-team-area {height: initial;} .et_pb_column_0_tb_footer, .et_pb_column_1_tb_footer, .et_pb_column_3_tb_footer{width: 50% !important;} #APP_Slider .et_pb_slide_image { width: 76% !important; padding-right:0px !important; margin-right:0px !important;} } /* Tablet (max-width: 980px) */ @media only screen and (max-width: 980px) and (orientation:portrait) { .vis-mobile { display:none !important;} .vis-desk { display:initial !important;} #APP_Slider .et_pb_slide_description p{ padding-bottom:12em !important;} } /* iPad Mini in portrait only */ @media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) { .vis-mobile { display:none !important;} .vis-desk { display:initial !important;} .vert-bottom, .vert-bottom.et_pb_column, #team-section .rt-team-container .tlp-content{ padding: 0 6.01% !important;} #APP_Slider .et_pb_slider_container_inner { display: inline-flex;flex-direction: row-reverse; } #APP_Slider .et_pb_slide_description {width: 100% !important;} #APP_Slider .et_pb_slide_description p {padding-bottom: 2.5em; margin-right: 6.5em; } #APP_Slider .et_pb_slide_description .et_pb_slide_title {text-indent: 0px; } #APP_Slider .et_pb_slide_image {padding: 0px !important; width: 76% !important; left: 101px; top: 39px;} #APP_Slider .et_pb_slides div.et_pb_slide { padding: 0px!important;} #team-section .rt-col-xs-12 {width: 33.33%; border-radius: 5px; margin: 0 0 var(--masonry-gutter) var(--masonry-gutter);position: relative;} #team-section .rt-team-container .rt-grid-item{margin-block-start: 0em; margin-block-end: 0.5em;} #team-section .rt-team-container .tlp-content {padding: 0 8.5% !important; } #team-section .rt-team-container .tlp-content h3 {font-size: 1em !important; line-height: 2.5;} #team-section span.team-name { top: 9px;} #team-section .rt-team-container .tlp-position{font-size: 0.8em;} #team-section .rt-team-container .rt-content-loader{ display: flex; width: 100%; flex-flow: row wrap; max-height: 910px; margin-left: calc(var(--masonry-gutter) * -1); counter-reset: brick;} #team-section .rt-team-container .single-team-area {height: initial;} footer .et_pb_column_0_tb_footer{width:63% !important;} footer .et_pb_column_1_tb_footer{width:37% !important;} } @media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) { .vis-mobile { display:none !important;} .vis-desk { display:initial !important;} #APP_Slider .et_pb_slide_description {width: 100% !important;} #APP_Slider .et_pb_slide_description p {padding-bottom: 2em; margin-right: 9em;} #APP_Slider .et_pb_slide_image {width: 65% !important; margin-top: 0em !important; position: absolute; z-index: -1; top: 20px;} #team-section .rt-col-xs-12 { margin: 0 0 var(--masonry-gutter) var(--masonry-gutter);position: relative;} #team-section .rt-team-container .rt-grid-item{margin-block-start: 0em; margin-block-end: 0.5em;} #team-section .rt-team-container .tlp-content {padding: 0 8.5% !important; } #team-section .rt-team-container .tlp-content h3 {font-size: 1em !important; line-height: 2.5;} #team-section span.team-name { top: 9px;} #team-section .rt-team-container .tlp-position{font-size: 0.8em;} #team-section .rt-team-container .rt-content-loader{ display: flex; width: 100%; flex-flow: row wrap; max-height: 890px; margin-left: calc(var(--masonry-gutter) * -1); counter-reset: brick;} #team-section .rt-team-container .single-team-area {height: initial;} } /* For portrait layouts only Ipad Pro */ @media only screen and (min-height: 1194px) and (orientation: portrait) { .vis-mobile { display:none !important;} .vis-desk { display:initial !important;} #team-section .rt-team-container .tlp-position{ padding: 0.65em !important; font-size: 0.8em; } .vert-bottom, .vert-bottom.et_pb_column, #team-section .rt-team-container .tlp-content{ padding: 0 9% !important; } .tlp-content h3 { width: 116%; font-size: 1.2em !important; } #team-section span.team-name { top: 10px;} #con-photos .icon-title .et_pb_blurb_content, #con-aerial-media .icon-title .et_pb_blurb_content, #con-video .icon-title .et_pb_blurb_content,#con-virtual-tours .icon-title .et_pb_blurb_content, #con-floor-plans .icon-title .et_pb_blurb_content{padding-right: 0px; max-width: 100%;} #APP_Slider .et_pb_slide_image img{ margin-top: 0px;} #APP_Slider .et_pb_slide_image {width: 70% !important; margin-top: 1.5em !important; position: absolute; z-index: -1; top: -0.5em} #APP_Slider .et_pb_slide_description p {padding-bottom: 2.5em; margin-right: 10.5em; } #team-section .rt-col-xs-12 { margin: 0 0 var(--masonry-gutter) var(--masonry-gutter);position: relative;} #team-section .rt-col-xs-12 {width: 33.33%;} #team-section .rt-team-container .rt-grid-item{margin-block-start: 0em; margin-block-end: 0.5em;} #team-section .rt-team-container .tlp-content {padding: 0 8.5% !important; } #team-section .rt-team-container .tlp-content h3 {font-size: 1em !important; line-height: 2.5;} #team-section span.team-name { top: 9px;} #team-section .rt-team-container .tlp-position{font-size: 0.8em;} #team-section .rt-team-container .rt-content-loader{ display: flex; width: 100%; flex-flow: row wrap; max-height: 890px; margin-left: calc(var(--masonry-gutter) * -1); counter-reset: brick;} #team-section .rt-team-container .single-team-area {height: initial;} } @media only screen and (min-height: 1194px) and (orientation: portrait) { .vis-mobile { display:none !important;} .vis-desk { display:initial !important;} #team-section .rt-col-xs-12 { margin: 0 0 var(--masonry-gutter) var(--masonry-gutter);position: relative;} #team-section .rt-team-container .rt-grid-item{margin-block-start: 0em; margin-block-end: 0.5em;} #team-section .rt-col-xs-12 {width: 25%;} #team-section .rt-team-container .tlp-content {padding: 0 8.5% !important; } #team-section .rt-team-container .tlp-content h3 {font-size: 1em !important; line-height: 2.5;} #team-section span.team-name { top: 9px;} #team-section .rt-team-container .tlp-position{font-size: 0.8em;} #team-section .rt-team-container .rt-content-loader{ display: flex; width: 100%; flex-flow: row wrap; max-height: 890px; margin-left: calc(var(--masonry-gutter) * -1); counter-reset: brick;} #team-section .rt-team-container .single-team-area {height: initial;} } /* Mobile (max-width: 767px) */ @media only screen and (max-width: 767px) { .vis-mobile { display:initial !important;} .vis-desk { display:none !important;} .et_pb_gallery_1.et_pb_gallery .et_pb_gallery_title { padding: 0em 1.5em; } #footer_socials .et_pb_social_network_link a.icon:before{ font-size: 1.5em; } #footer_socials a.icon.et_pb_with_border, #footer_socials .et_pb_social_network_link a.icon:before{ line-height: 25px; height: 25px ; width: 25px ; } #sub-footer.vert-centre, #sub-header .vert-centre {display: initial; align-items: center; } #APP_Slider .et_pb_slide_description .et_pb_slide_title {text-indent: initial; } .et_pb_column_0_tb_footer, .et_pb_column_1_tb_footer, .et_pb_column_3_tb_footer{width: 50% !important;} #main-content #title_area { padding: 0px; min-height: 273px !important; } #main-content #title_area .et_pb_fullwidth_header .et_pb_fullwidth_header_container.center .header-content { padding: 0px; margin: 0px auto; width:95%;} #main-content #title_area h1{ margin:0px auto; line-height: 0.9em; } #main-content #title_area .et_pb_fullwidth_header .et_pb_fullwidth_header_container {width:95%;} } /* Mobile (max-width: 767px) */ @media only screen and (max-width: 767px) and (orientation: landscape) { .vis-mobile { display:initial !important;} .vis-desk { display:none !important;} #APP_Slider { margin-top: 0px !important;} #APP_Slider .et_pb_slide_image img { width: 75%;} } /* Mobile (max-width: 767px) */ @media only screen and (max-width: 767px) and (orientation: portrait) { .vis-mobile { display:initial !important;} .vis-desk { display:none !important;} #sb_instagram .sbi_photo { height: 130px;} #sb_instagram.sbi_mob_col_1 #sbi_images { grid-template-columns: repeat(2, 1fr);} .et_pb_column_0_tb_footer, .et_pb_column_1_tb_footer, .et_pb_column_3_tb_footer{width: 100% !important;} #APP_Slider .et_pb_slides div.et_pb_slide { padding: 0px!important;} } @media only screen and (min-width: 390px) and (max-width: 415px) { /* Your Pixel-specific overrides go here */ .vis-mobile { display:initial !important;} .vis-desk { display:none !important;} #APP_Slider .et_pb_slide_image img {width: 50% !important;} }