/* CSS Document */ /*######################################## ## Body ########################################*/ body {padding: 0; margin: 0; width: 100%; font-family: 'Domine', sans-serif; font-size: 18px; font-weight: 400; color: #333; min-width: 320px;} /*######################################## ## Typography ########################################*/ h1,h2,h3,h4,h5,h6{font-weight: normal;} h1, h2, h3, h4, h5, h6, p, ul, ol, li { padding: 0; margin: 0;} a {text-decoration: none; transition: all .3s linear;} p, li {line-height: 1.4em; letter-spacing: 0.5px;} h1, h2, h3, h4, h5, h6 {font-weight: 700; line-height: 1.2em;} h1, h2 {font-size: 40px;} h3 {font-size: 25px;} /*######################################## ## Layouts ########################################*/ .screen-reader-text {display: block; width: .1px; height: .1px; overflow: hidden; padding: 0 !important; margin: 0 !important;} .container {width: 100%; max-width: 1386px; padding: 0 10px; box-sizing: border-box; margin: 0 auto;} /*######################################## ## Forms ########################################*/ /*contact form messages*/ form .messages p {display: none; font-family: "Domine", sans-serif !important; font-weight: 400 !important;letter-spacing: 0 !important;font-size: 16px !important;} form .loading {display: none;} form .alert {padding: 15px !important;margin-bottom: 20px;border: 1px solid transparent !important;border-radius: 4px !important;} form .alert-success {color: #3c763d !important;background-color: #dff0d8 !important;border-color: #d6e9c6 !important;} form .alert-danger {color: #a94442 !important;background-color: #f2dede !important;border-color: #ebccd1 !important;} form input:focus, form select:focus, form textarea:focus {outline: none;} /*contact form*/ .ctc-form .ctc-hide {display: none;} .ctc-form .inline {display: flex; justify-content: space-between;} .ctc-form .inline label {width: 49%;} .ctc-form input[type="text"],.ctc-form textarea {width: 100%; height: 55px; margin: 0 0 20px; border: 1px solid #EEE; border-radius: 5px; background: #F9F9F9; font-family: 'Domine', sans-serif; font-size: 16px; font-weight: 600; line-height: 120%; padding: 0 20px; box-sizing: border-box; display: block; color: #333;} .ctc-form textarea {height: 170px; padding-top: 10px; width: 100%;} .ctc-form button {font-family: "Domine", sans-serif; font-size: 16px; font-weight: 700; color: #FFF; background: #2D6E3F; margin: 20px auto 0; display: block; border-radius: 5px; border: none; width: 100%; max-width: 130px; padding: 15px;} .g-recaptcha > div {margin: 20px auto 0;} /*######################################## ## Button ########################################*/ .btn {font-family: "Domine", sans-serif; font-size: 16px; font-weight: 700; color: #FFF; background: #2D6E3F; margin: 20px auto 0; display: block; border-radius: 5px; border: none; width: 100%; max-width: 130px; padding: 15px;} /*######################################## ## Header ########################################*/ header {position: relative;} #header {background: transparent; position: fixed; width: 100%; top: 0; left: 0; z-index: 999;} #header .container {max-width: 1620px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid rgba(255,255,255,0.2); padding: 10px;} #header nav #pull {display: none; background: transparent; width: 100%; height: 45px; cursor: pointer; position: relative; z-index: 999;} #header nav ul {list-style: none; display: flex; column-gap: 45px;} #header nav ul li a {color: #FFF; line-height: 1.2em; display: block;} #header nav ul li a.active-menu, #header nav ul li a:hover {color: #2D6E3F;} #header.sticky {background: rgba(0,0,0,0.8);} /*######################################## ## Banner ########################################*/ #banner, #banner .inner-page {position: relative;} #banner .video {position: relative; height: 100vh; overflow: hidden;} #banner .video::before {content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.3); z-index: 2; pointer-events: none;} #banner .video-container {position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; z-index: 1;} #banner .video-container iframe {width: 100vw; height: 56.25vw; min-height: 100vh; min-width: 177.77vh; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); object-fit: cover;} #banner .content {position: relative; z-index: 3; top: 25%; transform: translateY(-25%); max-width: 1386px; margin: 0 auto; padding: 0 10px;} #banner .content h2 {font-size: 50px; color: #FFF; max-width: 550px; margin-left: auto;} #banner .inner-page:before {content: ""; background: rgba(0,0,0,0.2); position: absolute; top: 0; left: 0; right: 0; width: 100%; height: 100%;} #banner .inner-page img {display: block; width: 100%;} /*######################################## ## Home Page Content ########################################*/ #about-us {background: #F9F9F9; padding: 100px 0 120px;} #about-us .top-section {border-bottom: 1px solid rgba(51,51,51,0.2); padding-bottom: 35px;} #about-us .top-section h1 {margin-bottom: 40px;} #about-us .top-section p {font-size: 25px;} #about-us .bottom-section {margin-top: 30px;} #about-us .bottom-section .small {font-size: 16px;} #about-us .bottom-section .laurel {color: #2C6C3F; font-weight: 700;} #about-us .bottom-section .boxes {display: flex; justify-content: space-between; margin-bottom: 10px;} #about-us .bottom-section .box {background: #2D6E3F; border-radius: 10px; box-sizing: border-box; padding: 40px 30px; text-align: center; width: 31.84%;} #about-us .bottom-section .box h3 {font-size: 80px; font-weight: 400; color: #FFF;} #about-us .bottom-section .box p {font-size: 20px; color: #FFF; text-align: center;} #estimate .container {max-width: 100%; padding: 0; display: flex;} #estimate .text-left {display: flex; flex-direction: column; justify-content: center; align-items: flex-end; width: 50%; padding: 60px 115px 60px 10px; box-sizing: border-box;} #estimate .text-left .wrapper {max-width: 570px;} #estimate .text-left .wrapper p {font-size: 25px; margin-bottom: 40px;} #estimate .text-left .wrapper p:last-of-type {margin-bottom: 0;} #estimate .image-right {width: 50%;} #estimate .image-right img {display: block; width: 100%; height: 100%; object-fit: cover;} #focused {background: url('../images/content/focused-background.webp') no-repeat; background-size: cover; background-position: center right; padding: 100px 0 570px;} #focused p {font-size: 40px; font-weight: 700; color: #FFF; line-height: 1.2em; max-width: 740px;} #focused p span {text-decoration: underline;} #right-way {margin-top: -490px; padding-bottom: 100px;} #right-way .container {display: flex; flex-direction: column; row-gap: 10px;} #right-way .way:nth-of-type(odd) {background: #FFF;} #right-way .way:nth-of-type(even) {background: #F9F9F9;} #right-way .way {display: flex; justify-content: space-between; padding: 70px 80px; box-sizing: border-box; border-radius: 10px;} #right-way .way .letter-image {width: 12.43%;} #right-way .way .letter-image img {display: block; width: 100%;} #right-way .way .title-text {width: 79.6%;} #right-way .way .title-text h3 {margin-bottom: 20px;} /*######################################## ## Footer ########################################*/ footer {position: relative;} #footer {background: #F9F9F9;} #footer .top-section {padding: 70px 0 80px;} #footer .top-section .container {display: flex; justify-content: space-between;} #footer .top-section .navigation ul {list-style: none; display: flex; flex-direction: column; row-gap: 15px;} #footer .top-section .navigation ul li a {font-size: 16px; line-height: 1.2em; display: block; color: #333;} #footer .top-section .navigation nav ul li a.active-menu, #footer .top-section .navigation nav ul li a:hover {color: #2D6E3F;} #footer .top-section .logo img {display: block;} #footer .copyright .container {padding: 30px 10px; border-top: 1px solid rgba(51,51,51,0.2);} #footer .copyright p {font-size: 16px; text-align: center;} #footer .copyright a {color: #2D6E3F;} /*######################################## ## Team Page ########################################*/ .team-page .entry-section {background: #F9F9F9; padding: 100px 0;} .team-page .entry-section h1 {margin-bottom: 30px;} .team-page .entry-section p {font-size: 25px; text-align: justify;} .team-page .team {padding: 95px 0 155px;} .team-page .team .container {max-width: 1200px; display: flex; flex-direction: column; row-gap: 135px;} .team-page .member {display: flex; justify-content: space-between;} .team-page .member .image {width: 25.42%;} .team-page .member .image img {display: block; width: 100%;} .team-page .member .bio {width: 68.64%;} .team-page .member .bio h5 {font-size: 18px; color: #2C6C3F; letter-spacing: 2px; margin-bottom: 20px;} .team-page .member .bio h3 {font-size: 28px; margin-bottom: 30px;} .team-page .member .bio p {text-align: justify;} .team-page .bio .email {display: flex; column-gap: 10px; align-items: center; margin-top: 25px;} .team-page .bio .email i {font-size: 17px; color: #2C6D3F; padding: 10px; border: 1px solid #2D6E3F; border-radius: 50%;} .team-page .bio .email a {font-size: 23px; font-weight: 700; color: #333;} /*######################################## ## Strategies Page ########################################*/ .strategies-page .top-section {padding: 100px 0;} .strategies-page .entry-section h1 {margin-bottom: 30px;} .strategies-page .entry-section p {font-size: 25px;} .strategies-page .tabs {margin-top: 50px;} .strategies-page .tab-buttons {display: flex; column-gap: 10px;} .strategies-page .tab-buttons a {flex: 1; font-weight: 700; font-size: 20px; color: #333; background: #F9F9F9; border-radius: 5px; padding: 20px; text-align: center;} .strategies-page .tab-buttons a.active, .strategies-page .tab-buttons a:hover {background: #2D6E3F; color: #FFF;} .strategies-page .tab-content {display: none;} .strategies-page .tab-content.active {display: block;} .strategies-page .tab-content .content {padding: 50px 0 30px; border-bottom: 2px solid #F9F9F9;} .strategies-page .tab-content .content h5 {font-size: 16px; color: #2C6D3F; margin-bottom: 10px;} .strategies-page .tab-content .content p {font-size: 20px;} .strategies-page .tab-content .content ul {padding-left: 20px;} .strategies-page .tab-content .content ul li {font-size: 20px; line-height: 2em;} .strategies-page .tab-content .content ul li::marker {color: #2C6C3F;} .strategies-page .tab-content .grid {padding-bottom: 0 !important; border: none; display: flex; justify-content: space-between;} .strategies-page .tab-content .item {width: 31.3%; padding-bottom: 30px; border-bottom: 2px solid #F9F9F9;} .strategies-page .tab-content .item h5 {margin-bottom: 15px;} .strategies-page .tab-content .large-text p {font-size: 30px;} .strategies-page .key-sectors {background: url('../images/content/key-sectors-background.webp') no-repeat; background-size: cover; background-position: center right; padding: 90px 0 100px;} .strategies-page .key-sectors .title-section {margin-bottom: 60px; text-align: center;} .strategies-page .key-sectors .title-section h2 {color: #FFF; margin-bottom: 10px;} .strategies-page .key-sectors .title-section p {font-size: 25px; color: #FFF;} .strategies-page .key-sectors .sectors {display: flex; justify-content: space-between;} .strategies-page .key-sectors .sector {width: 31.84%; border-radius: 10px; min-height: 540px; position: relative; overflow: hidden; transition: transform 0.3s ease;} .strategies-page .key-sectors .sector:before {content: ""; background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 50%, rgba(0,0,0,1) 100%); position: absolute; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; opacity: 1; visibility: visible; transition: opacity 0.5s ease, visibility 0.5s ease; z-index: 1;} .strategies-page .key-sectors .sector .title {position: absolute; bottom: 55px; left: 0; right: 0; text-align: center; opacity: 1; visibility: visible; transition: opacity 0.5s ease, visibility 0.5s ease; z-index: 2;} .strategies-page .key-sectors .sector h3 {font-size: 30px; color: #FFF;} .strategies-page .key-sectors .sector .overlay {position: absolute; width: 93%; height: 93%; top: 50%; left: 50%; transform: translate(-50%, -50%); border-radius: 10px; background: rgba(0,0,0,0.8); opacity: 0; visibility: hidden; transition: opacity 0.5s ease, visibility 0.5s ease; z-index: 3; color: #FFF; box-sizing: border-box; padding: 45px; display: flex; flex-direction: column; justify-content: center;} .strategies-page .key-sectors .sector:hover {cursor: pointer;} .strategies-page .key-sectors .sector:hover .title, .strategies-page .key-sectors .sector:hover:before {opacity: 0; visibility: hidden;} .strategies-page .key-sectors .sector:hover .overlay {opacity: 1; visibility: visible;} .strategies-page .key-sectors .sector .overlay h3 {margin-bottom: 30px;} .strategies-page .key-sectors .sector .overlay ul {padding-left: 20px;} .strategies-page .key-sectors .sector .overlay ul li {font-size: 16px; line-height: 2em;} .strategies-page .key-sectors .service {background: url('../images/content/key-services.webp') no-repeat; background-size: cover; background-position: center center;} .strategies-page .key-sectors .distribution {background: url('../images/content/key-distribution.webp') no-repeat; background-size: cover; background-position: center center;} .strategies-page .key-sectors .consumer {background: url('../images/content/key-consumer.webp') no-repeat; background-size: cover; background-position: center center;} .strategies-page .characteristics {padding: 100px 0 150px;} .strategies-page .characteristics .title-section {margin-bottom: 70px; text-align: center;} .strategies-page .characteristics .title-section h2 {margin-bottom: 10px;} .strategies-page .characteristics .title-section p {font-size: 25px;} .strategies-page .characteristics .keys {display: flex;} .strategies-page .keys .key {width: 16.666%; padding: 0 30px; box-sizing: border-box; display: flex; flex-direction: column; row-gap: 20px;} .strategies-page .keys .key:not(:last-of-type) {border-right: 2px solid #F9F9F9;} .strategies-page .key .image-wrapper {min-height: 60px;} .strategies-page .key .image-wrapper img {display: block; margin: 0 auto;} .strategies-page .keys .key h5 {font-size: 18px; text-align: center;} /*######################################## ## Contact Us Page ########################################*/ .contact-page #content {padding: 100px 0;} .contact-page #content .container {max-width: 1120px;} .contact-page #content .entry-section h1 {margin-bottom: 30px;} .contact-page #content .entry-section p {font-size: 25px;} .contact-page #content .entry-section img {margin: 30px auto; display: block;} .contact-page #content .entry-section h1, .contact-page #content .entry-section p {text-align: center;} .contact-page #content .email-list {list-style: none; text-align: center; padding: 0;} .contact-page #content .email-list li a {color: #2d6e3f;} .contact-page #content .email-list li a:hover {text-decoration: underline;} /*######################################## ## Page Content Sections Paragraph Style ########################################*/ .home #content p, .strategies-page .top-section p {text-align: justify;} /*######################################## ## Thank You Page ########################################*/ .thank-you-page #content {padding: 100px 0; text-align: center;} .thank-you-page #content h1 {margin-bottom: 50px;} .thank-you-page #content img {display: block; margin: 0 auto 30px;} .thank-you-page #content .btn {margin-top: 30px;} /*######################################## ## Responsive ########################################*/ @media screen and (max-width: 1366px) { h1, h2 {font-size: 30px;} h3 {font-size: 23px;} #header .logo img {max-width: 290px;} #header nav ul li a {font-size: 16px;} #banner .content {top: 50%; transform: translateY(-50%);} #banner .content h2 {font-size: 40px; max-width: 445px; text-align: center; margin: 0 auto;} #about-us, .team-page .entry-section, .team-page .team, .strategies-page .top-section, .strategies-page .key-sectors, .strategies-page .characteristics, .contact-page #content, .thank-you-page #content {padding: 80px 0;} #about-us .top-section h1 {margin-bottom: 20px;} #about-us .top-section p, #estimate .text-left .wrapper p, .team-page .entry-section p, .strategies-page .entry-section p, .strategies-page .key-sectors .title-section p, .strategies-page .characteristics .title-section p, .contact-page #content .entry-section p {font-size: 20px;} #about-us .bottom-section .box {padding: 30px 20px;} #about-us .bottom-section .box h3 {font-size: 55px;} #about-us .bottom-section .box p {font-size: 18px;} #estimate .text-left {padding: 40px 50px 40px 10px;} #estimate .text-left .wrapper {max-width: 100%;} #estimate .text-left .wrapper p {margin-bottom: 25px;} #focused {padding: 80px 0 500px;} #focused p {font-size: 30px; max-width: 580px;} #right-way {margin-top: -445px; padding-bottom: 80px;} #right-way .way {padding: 50px 60px;} #right-way .way .letter-image {width: 10%;} #right-way .way .title-text {width: 82%;} #right-way .way .title-text h3 {margin-bottom: 15px;} #footer .top-section {padding: 50px 0;} #footer .copyright .container {padding: 20px 10px;} .team-page .team .container {row-gap: 100px;} .team-page .entry-section h1, .strategies-page .entry-section h1, .contact-page #content .entry-section h1 {margin-bottom: 20px;} .team-page .member .bio h5 {margin-bottom: 15px;} .team-page .member .bio h3 {font-size: 25px; margin-bottom: 25px;} .team-page .bio .email i {font-size: 15px;} .team-page .bio .email a {font-size: 20px;} .strategies-page .tab-content .content {padding: 40px 0 25px;} .strategies-page .tab-content .item {padding-bottom: 25px;} .strategies-page .tab-buttons a, .strategies-page .tab-content .content p, .strategies-page .tab-content .content ul li {font-size: 18px;} .strategies-page .tab-content .large-text p {font-size: 25px;} .strategies-page .tab-content .content ul li {line-height: 1.8em;} .strategies-page .key-sectors .title-section {margin-bottom: 50px;} .strategies-page .key-sectors .sector {min-height: 480px;} .strategies-page .key-sectors .sector h3 {font-size: 25px;} .strategies-page .key-sectors .sector .overlay {padding: 35px;} .strategies-page .key-sectors .sector .overlay h3 {margin-bottom: 15px;} .strategies-page .characteristics .title-section {margin-bottom: 50px;} .strategies-page .characteristics .keys {flex-wrap: wrap; row-gap: 30px;} .strategies-page .keys .key {padding: 0 20px; width: 33.333%;} #about-us .top-section p, .strategies-page .entry-section p } @media screen and (max-width: 1200px) { #right-way .way {padding: 40px;} } @media screen and (max-width: 1024px) { h3 {font-size: 20px;} #header .logo img {max-width: 220px;} #header nav ul {column-gap: 35px;} #banner .content h2 {font-size: 35px; max-width: 400px;} #about-us, .team-page .entry-section, .team-page .team, .strategies-page .top-section, .strategies-page .key-sectors, .strategies-page .characteristics, .contact-page #content, .thank-you-page #content {padding: 50px 0;} #about-us .top-section {padding-bottom: 30px;} #about-us .top-section p, #estimate .text-left .wrapper p, .team-page .entry-section p, .strategies-page .entry-section p, .strategies-page .key-sectors .title-section p, .strategies-page .characteristics .title-section p, .contact-page #content .entry-section p {font-size: 18px;} #about-us .bottom-section .box h3 {font-size: 45px;} #about-us .bottom-section .box p {font-size: 16px;} #focused {padding: 50px 0 400px;} #right-way {margin-top: -360px; padding-bottom: 50px;} #right-way .way {padding: 30px;} #footer .top-section {padding: 40px 0;} .team-page .team .container {row-gap: 80px;} .team-page .member .bio h3, .strategies-page .key-sectors .sector h3 {font-size: 23px;} .strategies-page .tabs {margin-top: 40px;} .strategies-page .key-sectors .sector .overlay {padding: 25px;} .ctc-form input[type="text"] {height: 50px;} .ctc-form textarea {height: 150px;} } @media screen and (max-width: 980px) { #header .logo {display: none;} #header .container {padding: 0; border: none;} #header nav {position: fixed; top: 0; left: 0; width: 100%; z-index: 999; box-shadow: 0 0 5px rgba(0,0,0,.8);} #header nav ul {max-width: 100%; display: none; height: auto; background: rgba(255,255,255,.9);} #header nav ul li {max-width: 100%; position: relative; text-align: left; padding: 0; display: block; border-bottom: 1px solid #EEE; margin-left: 0 !important;} #header nav ul li:first-of-type {border-top: 1px solid #EEE;} #header nav ul li a {padding: 15px 0; line-height: 120%; margin: 0; color: #333; text-align: left; width: 100%; text-indent: 20px;} #header nav ul li a::after {display: none;} #header nav ul li a.active-menu, #header nav ul li a:hover {color: #FFF; background: #2D6E3F;} #header nav #pull {display: block; background: #FFF; width: 100%; position: relative; height: 45px; color: #fff; z-index: 999;} #header nav #pull img {max-height: 40px; display: block; position: relative; top: 2px; padding-left: 10px;} #header nav #pull:after {content:"\f0c9"; font-family: 'Font Awesome 5 Free'; font-size: 30px; display: inline-block; position: absolute; right: 15px; top: 7px; font-weight: 700; color: #2D6E3F;} #header nav #pull strong {line-height: 45px;} #banner .video {height: 450px;} #banner .inner-page img {min-height: 280px; object-fit: cover;} .strategies-page .key-sectors .sectors {flex-wrap: wrap; row-gap: 40px;} .strategies-page .key-sectors .sector {width: 48%; min-height: 450px;} } @media screen and (max-width: 880px) { #right-way .way {padding: 20px;} #right-way .way .letter-image {width: 13%;} #about-us .bottom-section .next-line {display: block;} } @media screen and (max-width: 767px) { p, li {font-size: 15px;} #banner .video {height: 350px;} #banner .content h2 {font-size: 25px; max-width: 300px;} #about-us, .team-page .entry-section, .team-page .team, .strategies-page .top-section, .strategies-page .key-sectors, .strategies-page .characteristics, .contact-page #content, .thank-you-page #content {padding: 40px 0;} #about-us .bottom-section .boxes {flex-direction: column; row-gap: 30px; align-items: center;} #about-us .bottom-section .box {width: 100%; max-width: 300px; padding: 30px 15px;} #about-us .bottom-section .box h3 {font-size: 40px;} #about-us .bottom-section .small {text-align: center;} #estimate .container {flex-direction: column-reverse;} #estimate .image-right {width: 100%;} #estimate .text-left {width: 100%; padding: 30px 10px 40px;} #estimate .text-left .wrapper p {margin-bottom: 15px;} #focused {padding: 40px 0 390px;} #focused p {font-size: 20px; max-width: 300px;} #right-way {padding-bottom: 40px;} #right-way .way {flex-direction: column;} #right-way .way .letter-image {display: none;} #right-way .way .title-text {width: 100%;} #right-way .way .title-text h3 {margin-bottom: 10px;} #right-way .way .title-text h3::first-letter {color: #2D6E3F; font-size: 25px;} #footer .copyright .container {padding: 15px 10px;} #footer .copyright p {font-size: 15px;} .team-page .team .container {row-gap: 50px;} #about-us .top-section h1, .team-page .entry-section h1, .strategies-page .entry-section h1, .contact-page #content .entry-section h1 {margin-bottom: 15px; text-align: center;} .contact-page #content .entry-section p {text-align: center;} .team-page .member .bio h5 {font-size: 16px; text-align: center;} .team-page .member {flex-direction: column; row-gap: 20px;} .team-page .member .image, .team-page .member .bio {width: 100%;} .team-page .member .image img {width: auto; max-width: 100%; margin: 0 auto;} .team-page .member .bio h3 {font-size: 20px; margin-bottom: 20px; text-align: center;} .team-page .bio .email {margin-top: 20px; justify-content: center;} .team-page .bio .email i {font-size: 13px; padding: 8px;} .team-page .bio .email a {font-size: 18px;} .strategies-page .tab-buttons {flex-direction: column; row-gap: 15px;} .strategies-page .tab-buttons a, .strategies-page .tab-content .content p, .strategies-page .tab-content .content ul li {font-size: 16px;} .strategies-page .tab-buttons a {padding: 15px;} .strategies-page .tab-content .content {flex-direction: column; row-gap: 25px; padding: 30px 0 20px;} .strategies-page .tab-content .item {width: 100%; padding-bottom: 20px;} .strategies-page .tab-content .item h5 {margin-bottom: 10px;} .strategies-page .tab-content .large-text p {font-size: 20px;} .strategies-page .key-sectors .title-section {margin-bottom: 30px;} .strategies-page .key-sectors .sectors {flex-direction: column; row-gap: 30px;} .strategies-page .key-sectors .sector {width: 100%;} .strategies-page .characteristics .title-section {margin-bottom: 30px;} .strategies-page .characteristics .keys {justify-content: space-between;} .strategies-page .keys .key {width: 48%; border: 2px solid #F9F9F9 !important; padding: 30px 15px;} .thank-you-page #content h1 {margin-bottom: 40px;} #footer .top-section .logo img {max-width: 200px;} } @media screen and (max-width: 480px) { #focused p {margin: 0 auto; text-align: center;} .team-page .bio .email {flex-direction: column; row-gap: 10px;} .strategies-page .characteristics .keys {flex-direction: column;} .strategies-page .keys .key {width: 100%; max-width: 300px; margin: 0 auto;} .ctc-form .inline {flex-direction: column;} .ctc-form .inline label {width: 100%;} .ctc-form input[type="text"] {height: 45px;} .ctc-form input[type="text"], .ctc-form textarea {font-size: 15px;} .ctc-form textarea {height: 120px;} .ctc-form button, .btn {font-size: 15px; padding: 12px; max-width: 110px;} #footer .top-section .container {flex-direction: column-reverse; row-gap: 30px;} #footer .top-section .logo img {margin: 0 auto;} #footer .top-section .navigation ul {align-items: center;} .contact-page #content .email-list li:not(:last-of-type) {margin-bottom: 10px;} .contact-page #content .email-list li a {display: block;} } @media (hover: none) and (pointer: coarse) { .strategies-page .key-sectors .sector.active .overlay {opacity: 1; visibility: visible;} .strategies-page .key-sectors .sector.active .title, .strategies-page .key-sectors .sector.active:before {opacity: 0; visibility: hidden;} }