body {
font-size: 16px;
font-family: "Lato", sans-serif;
padding: 0;
margin: 0;
overflow-x: hidden;
color: #0e1c2a;
line-height: 1.5rem;
}
.font-lato {
font-family: "Lato", serif;
}
.font-playfair {
font-family: "Playfair Display", sans-serif;
}
.font-noto {
font-family: "Noto Serif Display", serif;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: "Playfair Display", sans-serif;
font-weight: 500;
}
p {
margin-top: 0.5rem;
margin-bottom: 0.5rem;
}
h1 {
font-size: 6rem;
line-height: 140%;
margin-top: 0;
margin-bottom: 1.5rem;
}
h2 {
font-size: 3.75rem;
margin-top: 0;
margin-bottom: 1.5rem;
line-height: 120%;
}
h3 {
font-size: 1.5rem;
line-height: 140%;
margin-bottom: 1rem;
margin-top: 0;
}
h4 {
margin-top: 0;
margin-bottom: 0.75rem;
}
h5, h6 {
margin-top: 0;
margin-bottom: 0.5rem;
}
.container {
max-width: 88rem;
width: 95%;
margin-left: auto;
margin-right: auto;
}
a {
color: #0e1c2a;
}
@media (max-width: 767px) {
h1 {
font-size: 2.25rem;
line-height: 120%;
}
h2 {
font-size: 2.25rem;
}
.container {
width: 91%;
}
}
.site-header {
position: fixed;
width: 100%;
top: 0;
padding: 0 0;
z-index: 999;
height: 5rem;
transition: background-color 0.3s ease;
}
@media (max-width: 991px) {
.site-header {
position: absolute;
}
}
.site-header:hover {
background-color: rgb(14, 48, 85);
}
.site-header.mega-menu-active {
background-color: rgb(14, 48, 85);
}
.site-header.scrolled {
background-color: rgb(14, 48, 85);
}
.site-header .container {
height: 100%;
}
.site-header .row {
display: flex;
flex-direction: row;
flex-wrap: wrap;
height: 100%;
}
.site-header .row .site-branding {
flex: 0 0 11rem;
display: flex;
align-items: center;
}
.site-header .row .site-branding a {
height: 1.75rem;
}
.site-header .row .site-branding svg, .site-header .row .site-branding img {
height: 1.75rem;
width: auto;
}
.site-header .row .site-navigation {
display: flex;
flex-direction: row;
flex: 1;
height: 100%;
}
.site-header .row .site-navigation .main-menu {
display: flex;
flex-direction: row;
padding: 0;
margin: 0;
flex: 1;
align-items: center;
}
.site-header .row .site-navigation .main-menu li {
list-style-type: none;
padding: 0 0;
display: flex;
height: 100%;
}
.site-header .row .site-navigation .main-menu a {
color: #fff;
text-decoration: none;
display: flex;
align-items: center;
justify-content: center;
transition: color 0.2s ease;
cursor: pointer;
height: 100%;
padding: 0 1rem;
position: relative;
}
@media (max-width: 767px) {
.site-header .row .site-navigation .main-menu a {
padding: 0 0 !important;
}
}
.site-header .row .site-navigation .main-menu a::before {
content: "";
position: absolute;
left: 50%;
bottom: 0;
width: 0;
height: 2px;
background: #fff;
transform: translateX(-50%);
transition: width 0.3s ease;
}
.site-header .row .site-navigation .main-menu a:hover::before {
width: 100%;
}
.site-header .row .site-navigation .main-menu a.active::before {
width: 100%;
}
.site-header .row .site-navigation .main-menu a .caret {
display: inline-flex;
align-items: center;
justify-content: center;
margin-left: 0.75rem;
}
.site-header .row .site-navigation .main-menu a .caret img {
width: 0.75rem;
transition: transform 0.2s ease;
}
.site-header .row .site-navigation .main-menu a.active .caret img {
transform: rotate(180deg);
}
.site-header .language-switcher {
display: flex;
flex-direction: row;
align-items: center;
}
.site-header .language-switcher a {
color: #fff;
text-decoration: none;
padding: 0 1rem;
transition: 0.3s ease;
}
.site-header .language-switcher a.inactive {
opacity: 0.5;
}
.site-header .language-switcher a:hover {
opacity: 1;
}
.site-header .language-switcher span {
color: #fff;
}
.site-header .mobile-menu-toggle {
display: none;
}
@media (max-width: 991px) {
.site-header .mobile-menu-toggle {
display: flex;
flex-direction: row;
align-items: center;
background: none;
border: none;
cursor: pointer;
padding: 0.5rem;
transition: opacity 0.3s ease;
}
.site-header .mobile-menu-toggle:hover {
opacity: 0.8;
}
.site-header .mobile-menu-toggle .burger-icon {
width: 1.5rem;
height: 1.5rem;
margin-right: 0.5rem;
}
.site-header .mobile-menu-toggle .burger-icon img {
width: 100%;
height: 100%;
filter: brightness(0) invert(1);
}
.site-header .mobile-menu-toggle .menu-text {
color: #fff;
font-size: 1rem;
font-weight: 500;
letter-spacing: 0.5px;
}
}
.mega-menu {
position: fixed;
top: 5rem;
left: 0;
right: 0;
background: transparent;
z-index: 998;
visibility: hidden;
transition: background-color 0.3s ease;
}
.mega-menu .mega-menu-content {
display: flex;
flex-direction: row;
padding: 1.5rem 0;
min-height: 16.5rem;
}
.mega-menu .mega-menu-content .mega-menu-contacts {
flex: 0 0 17.5rem;
padding-top: 1rem;
}
.mega-menu .mega-menu-content .mega-menu-contacts .contact-item {
display: flex;
align-items: center;
margin-bottom: 1.5rem;
border-radius: 6px;
}
.mega-menu .mega-menu-content .mega-menu-contacts .contact-item a {
display: flex;
align-items: center;
text-decoration: none;
}
.mega-menu .mega-menu-content .mega-menu-contacts .contact-item img {
width: 1rem;
margin-right: 0.75rem;
opacity: 0.7;
}
.mega-menu .mega-menu-content .mega-menu-contacts .contact-item span {
font-size: 0.95rem;
font-weight: 500;
color: #2c3e50;
}
.mega-menu .mega-menu-content .mega-menu-contacts .contact-item:last-child {
margin-bottom: 0;
}
.mega-menu .mega-menu-content .mega-menu-columns {
display: flex;
flex-direction: row;
flex: 1;
gap: 2.5rem;
}
.mega-menu .mega-menu-content .mega-menu-columns .mega-menu-column {
flex: 0 0 17.5rem;
display: flex;
flex-direction: column;
border-left: solid 1px rgb(14, 28, 42);
padding: 1rem 1rem 1rem 0rem;
gap: 0;
}
.mega-menu .mega-menu-content .mega-menu-columns .mega-menu-column .column-header {
font-weight: 700;
text-decoration: none;
padding-left: 1rem;
padding-bottom: 0.5rem;
padding-top: 0.5rem;
position: relative;
}
.mega-menu .mega-menu-content .mega-menu-columns .mega-menu-column .column-header::before {
content: "";
position: absolute;
left: 0;
top: 50%;
width: 3px;
height: 0;
background: rgb(14, 28, 42);
transform: translateY(-50%);
transition: height 0.3s ease;
}
.mega-menu .mega-menu-content .mega-menu-columns .mega-menu-column .column-header:hover::before {
height: 100%;
}
.mega-menu .mega-menu-content .mega-menu-columns .mega-menu-column .column-link {
display: block;
text-decoration: none;
padding-left: 1rem;
position: relative;
padding-bottom: 0.5rem;
padding-top: 0.5rem;
}
.mega-menu .mega-menu-content .mega-menu-columns .mega-menu-column .column-link::before {
content: "";
position: absolute;
left: 0;
top: 50%;
width: 3px;
height: 0;
background: rgb(14, 28, 42);
transform: translateY(-50%);
transition: height 0.3s ease;
}
.mega-menu .mega-menu-content .mega-menu-columns .mega-menu-column .column-link:hover::before {
height: 100%;
}
.mega-menu .mega-menu-content .mega-menu-columns .mega-menu-column .column-link::after {
content: "";
position: absolute;
right: 0;
top: 50%;
width: 16px;
height: 16px;
background-image: url("/wp-content/themes/telecom-ip-theme/images/menu-arrow.svg");
background-repeat: no-repeat;
background-position: center;
background-size: contain;
transform: translateY(-50%) translateX(-20px);
opacity: 0;
transition: all 0.3s ease;
}
.mega-menu .mega-menu-content .mega-menu-columns .mega-menu-column .column-link:hover::after {
transform: translateY(-50%) translateX(0);
opacity: 1;
}
.mega-menu-overlay {
position: fixed;
top: 5rem;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.1);
z-index: 997;
display: none;
}
@media (max-width: 991px) {
.mega-menu .mega-menu-content {
flex-direction: column;
padding: 1.5rem 0;
}
.mega-menu .mega-menu-content .mega-menu-contacts {
flex: none;
border-right: none;
border-top: 1px solid #e5e5e5;
border-bottom: none;
padding-right: 0;
padding-top: 1.5rem;
padding-bottom: 0;
order: 2;
}
.mega-menu .mega-menu-content .mega-menu-columns {
flex-direction: column;
gap: 1.5rem;
order: 1;
}
.mega-menu .mega-menu-content .mega-menu-columns .mega-menu-column {
min-width: auto;
}
}
body.menu-open {
overflow: hidden;
position: fixed;
width: 100%;
}
.mobile-mega-menu {
position: fixed;
left: 0;
right: 0;
bottom: 0;
background: #fff;
z-index: 999999;
visibility: hidden;
height: 100vh;
overflow-x: hidden;
}
.mobile-mega-menu .container {
width: 100% !important;
}
.mobile-mega-menu .mobile-menu-header {
padding: 1rem 0.75rem;
border-bottom: solid rgb(14, 28, 42) 1px;
display: flex;
justify-content: flex-end;
}
.mobile-mega-menu .mobile-menu-header .mobile-menu-close {
background: none;
border: none;
cursor: pointer;
}
.mobile-mega-menu .mobile-mega-menu-content {
height: 100%;
display: flex;
flex-direction: column;
padding: 0;
overflow-x: hidden;
}
.mobile-mega-menu .mobile-mega-menu-content .mobile-menu-sections {
flex: 1;
overflow-y: auto;
padding: 0rem 0 0.5rem 0;
margin-bottom: 1.5rem;
overflow-x: hidden;
border-bottom: solid rgb(14, 28, 42) 1px;
}
.mobile-mega-menu .mobile-mega-menu-content .mobile-menu-sections .mobile-menu-section {
overflow-x: hidden;
}
.mobile-mega-menu .mobile-mega-menu-content .mobile-menu-sections .mobile-menu-section:last-child {
border-bottom: none;
}
.mobile-mega-menu .mobile-mega-menu-content .mobile-menu-sections .mobile-menu-section .mobile-section-header {
display: flex;
justify-content: space-between;
align-items: center;
cursor: pointer;
font-weight: 700;
text-transform: uppercase;
padding: 0.75rem 0.75rem;
}
.mobile-mega-menu .mobile-mega-menu-content .mobile-menu-sections .mobile-menu-section .mobile-section-header .mobile-section-caret {
width: 0.75rem;
height: 0.75rem;
transition: transform 0.2s ease;
}
.mobile-mega-menu .mobile-mega-menu-content .mobile-menu-sections .mobile-menu-section .mobile-section-header .mobile-section-caret.active {
transform: rotate(180deg);
}
.mobile-mega-menu .mobile-mega-menu-content .mobile-menu-sections .mobile-menu-section .mobile-section-content {
display: none;
}
.mobile-mega-menu .mobile-mega-menu-content .mobile-menu-sections .mobile-menu-section .mobile-section-content.active {
display: block;
}
.mobile-mega-menu .mobile-mega-menu-content .mobile-menu-sections .mobile-menu-column {
padding-top: 0.75rem;
padding-bottom: 0.75rem;
border-top: solid rgb(14, 28, 42) 1px;
}
.mobile-mega-menu .mobile-mega-menu-content .mobile-menu-sections .mobile-menu-column:last-child {
border-bottom: none;
}
.mobile-mega-menu .mobile-mega-menu-content .mobile-menu-sections .mobile-menu-column .mobile-column-links {
padding: 0;
display: flex;
flex-direction: column;
gap: 1.5rem;
padding: 0 1rem;
}
.mobile-mega-menu .mobile-mega-menu-content .mobile-menu-sections .mobile-menu-column .mobile-column-links .mobile-submenu-item {
display: block;
text-decoration: none;
}
.mobile-mega-menu .mobile-mega-menu-content .mobile-menu-sections .mobile-menu-column .first-item {
font-weight: 700;
}
.mobile-mega-menu .mobile-mega-menu-content .mobile-menu-sections .mobile-simple-item {
display: flex;
justify-content: space-between;
align-items: center;
cursor: pointer;
font-weight: 700;
text-transform: uppercase;
padding: 0.75rem 0.75rem;
text-decoration: none;
}
.mobile-mega-menu .mobile-mega-menu-content .mobile-menu-sections .mobile-simple-item a {
text-decoration: none;
}
.mobile-mega-menu .mobile-mega-menu-content .mobile-menu-sections .mobile-simple-item .mobile-section-caret {
width: 0.75rem;
height: 0.75rem;
transition: transform 0.2s ease;
}
.mobile-mega-menu .mobile-mega-menu-content .mobile-menu-sections .mobile-simple-item .mobile-section-caret.active {
transform: rotate(180deg);
}
.mobile-mega-menu .mobile-mega-menu-content .mobile-contacts {
flex-shrink: 0;
padding: 0rem 1rem;
}
.mobile-mega-menu .mobile-mega-menu-content .mobile-contacts .contact-item {
display: flex;
align-items: center;
margin-bottom: 1rem;
}
.mobile-mega-menu .mobile-mega-menu-content .mobile-contacts .contact-item a {
display: flex;
align-items: center;
text-decoration: none;
}
.mobile-mega-menu .mobile-mega-menu-content .mobile-contacts .contact-item img {
width: 1.25rem;
height: 1.25rem;
margin-right: 0.75rem;
opacity: 0.7;
}
.mobile-mega-menu .mobile-mega-menu-content .mobile-contacts .contact-item:last-child {
margin-bottom: 0;
}
@media (max-width: 991px) {
.site-header {
padding: 0;
height: 6.75rem;
}
.site-header.header-single-language {
height: 3.75rem;
}
.site-header.header-single-language .site-navigation {
display: none;
}
.site-header .site-branding {
padding: 1rem 0;
}
.site-header .site-branding img {
height: 1.5rem;
}
.site-header .row {
justify-content: space-between;
}
.site-header .row .site-navigation {
order: 3;
flex: 0 0 100%;
height: auto;
padding-bottom: 1rem;
}
.site-header .row .site-navigation ul li:nth-child(n+4) {
display: none;
}
.site-header .row .site-navigation ul {
justify-content: space-between;
}
.mega-menu {
display: none !important;
}
}
.hero-standard-hero-section {
min-height: 54rem;
position: relative;
display: flex;
align-items: flex-end;
flex-direction: column;
justify-content: flex-end;
overflow: hidden;
}
.hero-standard-hero-section.text-position-center {
justify-content: center !important;
}
.hero-standard-hero-section.text-position-bottom {
justify-content: flex-end !important;
}
.hero-standard-hero-section.text-position-bottom .hero-mask-svg {
position: relative !important;
}
.hero-standard-hero-section .hero-mask-svg {
position: absolute;
bottom: -1px;
left: 0;
width: 100%;
z-index: 99;
}
.hero-standard-hero-section .hero-mask-svg svg {
width: 100%;
height: auto;
display: block;
height: auto;
}
.hero-standard-hero-section .container {
padding-top: 3rem;
padding-bottom: 3rem;
}
.hero-standard-hero-section h1 {
font-size: 6rem;
letter-spacing: -0.022em;
background: radial-gradient(216.67% 216.67% at 0% -77.78%, #B1D4F9 0%, #FFFFFF 100%);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
color: transparent;
margin-bottom: 1.5rem;
margin-top: 0;
line-height: 6.75rem;
}
.hero-standard-hero-section .hero-text {
color: #fff;
max-width: 1024px;
font-size: 1.25rem;
line-height: 1.75rem;
}
.hero-standard-hero-section .hero-section-has-buttons .hero-content {
margin-bottom: 4rem;
}
.hero-standard-hero-section .hero-content {
position: relative;
z-index: 2;
}
.hero-standard-hero-section .button-wrapper {
gap: 1rem;
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2.25rem;
}
.hero-standard-hero-section .hero-button {
padding: 0.75rem 1.5rem;
color: #fff;
line-height: 140%;
text-decoration: none;
border: solid 1px rgba(255, 255, 255, 0.5);
min-width: 200px;
text-transform: uppercase;
font-size: 1.25rem;
display: inline-flex;
align-items: center;
justify-content: center;
font-weight: 500;
transition: 0.5s;
}
.hero-standard-hero-section .hero-button:hover {
color: rgb(14, 26, 42);
background: #fff;
}
.hero-section-video-bg .hero-bg-video {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
z-index: -1;
}
.hero-section-video-bg::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(14, 48, 85, 0);
z-index: 1;
}
.hero-section-image-bg {
background-attachment: fixed;
background-position: center 30%;
background-repeat: no-repeat;
background-size: cover;
min-height: 38.25rem;
}
.hero-section-image-bg::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(14, 48, 85, 0.5);
z-index: 1;
}
@media (max-width: 768px) {
.hero-section-image-bg {
background-attachment: scroll;
}
}
.hero-section-color-bg {
background-color: #0e3055;
min-height: 612px;
}
.hero-section-color-bg:after {
background-image: url("/wp-content/themes/telecom-ip-theme/images/hero-background-squares.svg");
background-repeat: no-repeat;
content: "";
position: absolute;
width: 100%;
height: auto;
display: block;
height: 100%;
top: 0;
background-position: center top;
}
@media (max-width: 767px) {
.hero-standard-hero-section {
min-height: 600px;
}
.hero-standard-hero-section h1 {
font-size: 2.25rem;
line-height: 120%;
}
.hero-standard-hero-section .hero-button {
width: 100%;
padding: 8px 8px;
font-size: 1rem;
}
.hero-standard-hero-section .button-wrapper {
margin-top: 1.5rem;
}
.hero-standard-hero-section .hero-text {
font-size: 1rem;
}
.hero-section-image-bg {
min-height: 376px;
}
.hero-section-color-bg {
min-height: 376px;
}
}
.hero-form-hero-section {
min-height: 54rem;
position: relative;
display: flex;
align-items: flex-end;
flex-direction: column;
justify-content: flex-end;
margin-bottom: 3rem;
background-attachment: fixed;
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
}
.hero-form-hero-section::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(14, 48, 85, 0.5);
z-index: 1;
}
@media (max-width: 768px) {
.hero-form-hero-section {
background-attachment: scroll;
}
}
.hero-form-hero-section.text-position-center {
justify-content: center !important;
}
.hero-form-hero-section.text-position-bottom {
justify-content: flex-end !important;
}
.hero-form-hero-section.text-position-bottom .hero-mask-svg {
position: relative !important;
}
.hero-form-hero-section .hero-mask-svg {
position: absolute;
bottom: -1px;
left: 0;
width: 100%;
z-index: 99;
}
.hero-form-hero-section .hero-mask-svg svg {
width: 100%;
height: auto;
display: block;
height: auto;
}
.hero-form-hero-section .container {
padding-top: 3rem;
padding-bottom: 0rem;
position: relative;
z-index: 100;
margin-bottom: -3rem;
}
.hero-form-hero-section h1 {
font-size: 6rem;
letter-spacing: -0.022em;
background: radial-gradient(216.67% 216.67% at 0% -77.78%, #B1D4F9 0%, #FFFFFF 100%);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
color: transparent;
margin-bottom: 8rem;
margin-top: 0;
line-height: 6.75rem;
}
.hero-form-hero-section .hero-text {
color: #fff;
max-width: 1024px;
font-size: 1.25rem;
line-height: 1.75rem;
}
.hero-form-hero-section .hero-content {
position: relative;
z-index: 2;
margin-bottom: 8rem;
}
@media (min-width: 768px) {
.hero-form-hero-section .hero-content {
background: none !important;
}
}
.hero-form-hero-section .hero-wrap {
display: flex;
flex-direction: row;
gap: 1.5rem;
position: relative;
}
.hero-form-hero-section .hero-wrap .hero-content {
flex: 0 0 calc(50% - 0.75rem);
display: flex;
align-items: flex-end;
}
.hero-form-hero-section .hero-wrap .hero-form-outer {
flex: 0 0 calc(50% - 0.75rem);
position: relative;
z-index: 100;
min-height: 100%;
}
.hero-form-hero-section .hero-wrap .hero-form-outer .form-svg {
display: flex;
}
.hero-form-hero-section .hero-wrap .hero-form-outer .form-svg svg {
width: 100% !important;
height: auto;
display: none;
display: block;
margin-bottom: -2px;
}
.hero-form-hero-section .hero-wrap .hero-form-outer .form-svg svg path {
fill: rgb(90, 147, 206);
}
.hero-form-hero-section .hero-wrap .hero-form {
background: rgb(90, 147, 206);
padding: 2.5rem;
z-index: 101;
}
.hero-form-hero-section .hero-wrap .hero-form h2 {
font-size: 3.75rem;
line-height: 120%;
margin-bottom: 0;
}
.hero-form-hero-section .hero-wrap .hero-form .text {
max-width: 64rem;
margin-top: 1rem;
margin-bottom: 2.5rem;
font-size: 1.5rem;
font-weight: 400;
line-height: 2rem;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container {
display: flex;
flex-direction: column;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form label {
font-weight: 500;
margin-bottom: 0.5rem;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form textarea {
width: 100%;
height: 2.5rem;
padding: 0.5rem 1rem;
border: none !important;
outline: none !important;
margin-top: 1rem;
height: 7rem;
resize: vertical;
max-height: 20rem;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form textarea:hover {
outline: solid rgb(14, 48, 85) 1px !important;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form textarea:active, .hero-form-hero-section .hero-wrap .hero-form .form-container form textarea:focus, .hero-form-hero-section .hero-wrap .hero-form .form-container form textarea:focus-within {
outline: solid rgb(14, 48, 85) 2px !important;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form textarea.wpcf7-not-valid {
outline: solid rgb(158, 26, 0) 2px !important;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form textarea::placeholder {
color: rgb(101, 109, 117);
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form input[type=text],
.hero-form-hero-section .hero-wrap .hero-form .form-container form input[type=tel],
.hero-form-hero-section .hero-wrap .hero-form .form-container form input[type=email],
.hero-form-hero-section .hero-wrap .hero-form .form-container form select {
width: 100%;
height: 2.5rem;
padding: 0.5rem 1rem;
border: none !important;
outline: none !important;
margin-top: 1rem;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form input[type=text]:hover,
.hero-form-hero-section .hero-wrap .hero-form .form-container form input[type=tel]:hover,
.hero-form-hero-section .hero-wrap .hero-form .form-container form input[type=email]:hover,
.hero-form-hero-section .hero-wrap .hero-form .form-container form select:hover {
outline: solid rgb(14, 48, 85) 1px !important;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form input[type=text]:active, .hero-form-hero-section .hero-wrap .hero-form .form-container form input[type=text]:focus, .hero-form-hero-section .hero-wrap .hero-form .form-container form input[type=text]:focus-within,
.hero-form-hero-section .hero-wrap .hero-form .form-container form input[type=tel]:active,
.hero-form-hero-section .hero-wrap .hero-form .form-container form input[type=tel]:focus,
.hero-form-hero-section .hero-wrap .hero-form .form-container form input[type=tel]:focus-within,
.hero-form-hero-section .hero-wrap .hero-form .form-container form input[type=email]:active,
.hero-form-hero-section .hero-wrap .hero-form .form-container form input[type=email]:focus,
.hero-form-hero-section .hero-wrap .hero-form .form-container form input[type=email]:focus-within,
.hero-form-hero-section .hero-wrap .hero-form .form-container form select:active,
.hero-form-hero-section .hero-wrap .hero-form .form-container form select:focus,
.hero-form-hero-section .hero-wrap .hero-form .form-container form select:focus-within {
outline: solid rgb(14, 48, 85) 2px !important;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form input[type=text].wpcf7-not-valid,
.hero-form-hero-section .hero-wrap .hero-form .form-container form input[type=tel].wpcf7-not-valid,
.hero-form-hero-section .hero-wrap .hero-form .form-container form input[type=email].wpcf7-not-valid,
.hero-form-hero-section .hero-wrap .hero-form .form-container form select.wpcf7-not-valid {
outline: solid rgb(158, 26, 0) 2px !important;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form input[type=text]::placeholder,
.hero-form-hero-section .hero-wrap .hero-form .form-container form input[type=tel]::placeholder,
.hero-form-hero-section .hero-wrap .hero-form .form-container form input[type=email]::placeholder,
.hero-form-hero-section .hero-wrap .hero-form .form-container form select::placeholder {
color: rgb(101, 109, 117);
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form .wpcf7-form-control-wrap:first-child input {
margin-top: 0 !important;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form span.wpcf7-not-valid-tip {
background: rgb(197, 35, 3);
color: #fff;
font-size: 0.875rem;
min-height: 1.75rem;
display: flex !important;
align-items: center;
padding: 0.25rem 1rem;
margin-top: 0.5rem;
outline: solid rgb(197, 35, 3) 2px;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form select {
appearance: none;
background-image: url('data:image/svg+xml;utf8,');
background-repeat: no-repeat;
background-position: right 1rem center;
background-size: 16px;
padding-right: 3rem;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form select div {
margin: 0;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form br {
display: none;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form p {
margin-top: 0;
margin-bottom: 1rem;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form .street-wrap p {
display: flex;
flex-direction: row;
flex-wrap: wrap;
column-gap: 1rem;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form .street-wrap p label:first-child {
flex: 1;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form .street-wrap p br {
display: none;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form .street-wrap p label:last-child {
flex: 0 0 12.5rem;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form .privacy-wrap br {
display: none;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form .privacy-wrap label {
display: block;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form .privacy-wrap label span {
display: block;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form .privacy-wrap .wpcf7-list-item {
margin-left: 0;
padding-left: 0.25rem;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form .privacy-wrap .wpcf7-list-item label {
display: flex;
flex-direction: row;
width: 100%;
align-items: center;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form .privacy-wrap input {
width: 1rem;
height: 1rem;
border: 2px solid #000;
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
background: transparent;
cursor: pointer;
margin: 0.25rem 0.75rem 0.25rem 0.25rem;
flex-shrink: 0;
position: relative;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form .privacy-wrap input:checked {
background: #000;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form .privacy-wrap input:checked::after {
content: "";
position: absolute;
top: 1px;
left: 4px;
width: 4px;
height: 8px;
border: solid rgb(90, 147, 206);
border-width: 0 2px 2px 0;
transform: rotate(45deg);
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form .marketing-wrap br {
display: none;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form .marketing-wrap label {
display: block;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form .marketing-wrap label span {
display: block;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form .marketing-wrap .wpcf7-list-item {
margin-left: 0;
padding-left: 0.25rem;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form .marketing-wrap .wpcf7-list-item label {
display: flex;
flex-direction: row;
width: 100%;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form .marketing-wrap input {
width: 1rem;
height: 1rem;
border: 2px solid #000;
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
background: transparent;
cursor: pointer;
margin: 0.25rem 0.75rem 0.25rem 0.25rem;
flex-shrink: 0;
position: relative;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form .marketing-wrap input:checked {
background: #000;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form .marketing-wrap input:checked::after {
content: "";
position: absolute;
top: 1px;
left: 4px;
width: 4px;
height: 8px;
border: solid rgb(90, 147, 206);
border-width: 0 2px 2px 0;
transform: rotate(45deg);
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form input[type=submit] {
background: rgb(14, 28, 42);
border: solid transparent 1px;
transition: 0.4s;
box-shadow: none;
padding: 0.75rem 1.5rem;
width: 100%;
cursor: pointer;
margin-top: 0.5rem;
line-height: 140%;
color: #fff;
font-size: 1.25rem;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form input[type=submit]:hover {
color: rgb(14, 28, 42);
background: #fff;
box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form input[type=submit]:hover span {
color: rgb(14, 28, 42);
}
.hero-form-hero-section .hero-wrap .hero-form .form-container form .wpcf7-spinner {
display: none;
}
@media (max-width: 767px) {
.hero-form-hero-section {
min-height: 600px;
}
.hero-form-hero-section h1 {
font-size: 2.25rem;
line-height: 120%;
}
.hero-form-hero-section .hero-button {
width: 100%;
padding: 8px 8px;
font-size: 1rem;
}
.hero-form-hero-section .button-wrapper {
margin-top: 1.5rem;
}
.hero-form-hero-section .hero-text {
font-size: 1rem;
}
.hero-form-hero-section .container .hero-wrap {
flex-direction: column;
}
.hero-form-hero-section.form-above-footer-mobile {
min-height: 23.5rem !important;
}
.hero-form-hero-section.form-above-footer-mobile .hero-content {
background: none !important;
margin-bottom: 3rem;
}
.hero-form-hero-section.form-above-footer-mobile .hero-form-outer {
display: none;
}
.hero-form-hero-section.form-in-hero-mobile {
margin-bottom: 0;
min-height: 0 !important;
background: none !important;
}
.hero-form-hero-section.form-in-hero-mobile .hero-content {
display: flex;
position: relative;
padding-top: 3rem;
margin-bottom: -2.5rem;
min-height: 25rem;
background-size: cover;
}
.hero-form-hero-section.form-in-hero-mobile .hero-content::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(14, 48, 85, 0.5);
z-index: 1;
}
.hero-form-hero-section.form-in-hero-mobile .hero-content h1 {
z-index: 2;
}
.hero-form-hero-section.form-in-hero-mobile .hero-wrap {
gap: 0;
}
.hero-form-hero-section.form-in-hero-mobile .hero-mask-svg {
display: none;
}
.hero-form-hero-section.form-in-hero-mobile .container {
margin: 0;
width: 100%;
max-width: 100%;
padding-top: 0;
}
.hero-form-hero-section.form-in-hero-mobile .container h1 {
margin-left: 1rem;
}
.hero-form-hero-section.form-in-hero-mobile .container .hero-form {
padding: 4rem 1rem;
}
.hero-form-hero-section.form-in-hero-mobile .container .hero-form h2 {
font-size: 2.25rem;
}
.hero-form-hero-section.form-in-hero-mobile .container .hero-form .text {
margin-bottom: 1.5rem;
}
}
@media (min-width: 768px) {
.page-end-form-from-hero {
display: none !important;
}
}
.page-end-form-from-hero {
margin-top: 4rem;
}
.page-end-form-from-hero .col-form {
display: flex;
flex-direction: column;
}
.page-end-form-from-hero .col-form form label {
font-weight: 500;
margin-bottom: 1rem;
}
.page-end-form-from-hero .col-form form textarea {
width: 100%;
height: 2.5rem;
padding: 0.5rem 1rem;
border: none !important;
outline: none !important;
margin-top: 1rem;
height: 7rem;
resize: vertical;
max-height: 20rem;
}
.page-end-form-from-hero .col-form form textarea:hover {
outline: solid rgb(14, 48, 85) 1px !important;
}
.page-end-form-from-hero .col-form form textarea:active, .page-end-form-from-hero .col-form form textarea:focus, .page-end-form-from-hero .col-form form textarea:focus-within {
outline: solid rgb(14, 48, 85) 2px !important;
}
.page-end-form-from-hero .col-form form textarea.wpcf7-not-valid {
outline: solid rgb(158, 26, 0) 2px !important;
}
.page-end-form-from-hero .col-form form textarea::placeholder {
color: rgb(101, 109, 117);
}
.page-end-form-from-hero .col-form form input[type=text],
.page-end-form-from-hero .col-form form input[type=tel],
.page-end-form-from-hero .col-form form input[type=email],
.page-end-form-from-hero .col-form form select {
width: 100%;
height: 2.5rem;
padding: 0.5rem 1rem;
border: none !important;
outline: none !important;
margin-top: 1rem !important;
}
.page-end-form-from-hero .col-form form input[type=text]:hover,
.page-end-form-from-hero .col-form form input[type=tel]:hover,
.page-end-form-from-hero .col-form form input[type=email]:hover,
.page-end-form-from-hero .col-form form select:hover {
outline: solid rgb(14, 48, 85) 1px !important;
}
.page-end-form-from-hero .col-form form input[type=text]:active, .page-end-form-from-hero .col-form form input[type=text]:focus, .page-end-form-from-hero .col-form form input[type=text]:focus-within,
.page-end-form-from-hero .col-form form input[type=tel]:active,
.page-end-form-from-hero .col-form form input[type=tel]:focus,
.page-end-form-from-hero .col-form form input[type=tel]:focus-within,
.page-end-form-from-hero .col-form form input[type=email]:active,
.page-end-form-from-hero .col-form form input[type=email]:focus,
.page-end-form-from-hero .col-form form input[type=email]:focus-within,
.page-end-form-from-hero .col-form form select:active,
.page-end-form-from-hero .col-form form select:focus,
.page-end-form-from-hero .col-form form select:focus-within {
outline: solid rgb(14, 48, 85) 2px !important;
}
.page-end-form-from-hero .col-form form input[type=text].wpcf7-not-valid,
.page-end-form-from-hero .col-form form input[type=tel].wpcf7-not-valid,
.page-end-form-from-hero .col-form form input[type=email].wpcf7-not-valid,
.page-end-form-from-hero .col-form form select.wpcf7-not-valid {
outline: solid rgb(158, 26, 0) 2px !important;
}
.page-end-form-from-hero .col-form form input[type=text]::placeholder,
.page-end-form-from-hero .col-form form input[type=tel]::placeholder,
.page-end-form-from-hero .col-form form input[type=email]::placeholder,
.page-end-form-from-hero .col-form form select::placeholder {
color: rgb(101, 109, 117);
}
.page-end-form-from-hero .col-form form .wpcf7-form-control-wrap:first-child input {
margin-top: 0 !important;
}
.page-end-form-from-hero .col-form form span.wpcf7-not-valid-tip {
background: rgb(197, 35, 3);
color: #fff;
font-size: 0.875rem;
min-height: 1.75rem;
display: flex !important;
align-items: center;
padding: 0.25rem 1rem;
margin-top: 0.5rem;
outline: solid rgb(197, 35, 3) 2px;
}
.page-end-form-from-hero .col-form form select {
appearance: none;
background-image: url('data:image/svg+xml;utf8,');
background-repeat: no-repeat;
background-position: right 1rem center;
background-size: 16px;
padding-right: 3rem;
}
.page-end-form-from-hero .col-form form select div {
margin: 0;
}
.page-end-form-from-hero .col-form form br {
display: none;
}
.page-end-form-from-hero .col-form form p {
margin-top: 0;
margin-bottom: 1rem;
}
.page-end-form-from-hero .col-form form .street-wrap p {
display: flex;
flex-direction: row;
flex-wrap: wrap;
column-gap: 1rem;
}
.page-end-form-from-hero .col-form form .street-wrap p label:first-child {
flex: 1;
}
.page-end-form-from-hero .col-form form .street-wrap p br {
display: none;
}
.page-end-form-from-hero .col-form form .street-wrap p label:last-child {
flex: 0 0 12.5rem;
}
.page-end-form-from-hero .col-form form .privacy-wrap br {
display: none;
}
.page-end-form-from-hero .col-form form .privacy-wrap label {
display: block;
}
.page-end-form-from-hero .col-form form .privacy-wrap label span {
display: block;
}
.page-end-form-from-hero .col-form form .privacy-wrap .wpcf7-list-item {
margin-left: 0;
padding-left: 0.25rem;
}
.page-end-form-from-hero .col-form form .privacy-wrap .wpcf7-list-item label {
display: flex;
flex-direction: row;
width: 100%;
align-items: center;
}
.page-end-form-from-hero .col-form form .privacy-wrap input {
width: 1rem;
height: 1rem;
border: 2px solid #000;
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
background: transparent;
cursor: pointer;
margin: 0.25rem 0.75rem 0.25rem 0.25rem;
flex-shrink: 0;
position: relative;
}
.page-end-form-from-hero .col-form form .privacy-wrap input:checked {
background: #000;
}
.page-end-form-from-hero .col-form form .privacy-wrap input:checked::after {
content: "";
position: absolute;
top: 1px;
left: 4px;
width: 4px;
height: 8px;
border: solid rgb(90, 147, 206);
border-width: 0 2px 2px 0;
transform: rotate(45deg);
}
.page-end-form-from-hero .col-form form .marketing-wrap br {
display: none;
}
.page-end-form-from-hero .col-form form .marketing-wrap label {
display: block;
}
.page-end-form-from-hero .col-form form .marketing-wrap label span {
display: block;
}
.page-end-form-from-hero .col-form form .marketing-wrap .wpcf7-list-item {
margin-left: 0;
padding-left: 0.25rem;
}
.page-end-form-from-hero .col-form form .marketing-wrap .wpcf7-list-item label {
display: flex;
flex-direction: row;
width: 100%;
}
.page-end-form-from-hero .col-form form .marketing-wrap input {
width: 1rem;
height: 1rem;
border: 2px solid #000;
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
background: transparent;
cursor: pointer;
margin: 0.25rem 0.75rem 0.25rem 0.25rem;
flex-shrink: 0;
position: relative;
}
.page-end-form-from-hero .col-form form .marketing-wrap input:checked {
background: #000;
}
.page-end-form-from-hero .col-form form .marketing-wrap input:checked::after {
content: "";
position: absolute;
top: 1px;
left: 4px;
width: 4px;
height: 8px;
border: solid rgb(90, 147, 206);
border-width: 0 2px 2px 0;
transform: rotate(45deg);
}
.page-end-form-from-hero .col-form form input[type=submit] {
background: rgb(14, 28, 42);
border: solid transparent 1px;
transition: 0.4s;
box-shadow: none;
padding: 0.75rem 1.5rem;
width: 100%;
cursor: pointer;
margin-top: 0.5rem;
line-height: 140%;
color: #fff;
font-size: 1.25rem;
}
.page-end-form-from-hero .col-form form input[type=submit]:hover {
color: rgb(14, 28, 42);
background: #fff;
box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
}
.page-end-form-from-hero .col-form form input[type=submit]:hover span {
color: rgb(14, 28, 42);
}
.page-end-form-from-hero .col-form form .wpcf7-spinner {
display: none;
}
.content-we-are-investors-section {
margin-top: 4rem;
}
.content-we-are-investors-section .mini-heading {
text-transform: uppercase;
}
.content-we-are-investors-section .heading {
font-size: 3.75rem;
line-height: 120%;
margin-bottom: 0;
}
.content-we-are-investors-section .links-wrapper {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
gap: 1.5rem;
margin-top: 0.5rem;
overflow-x: auto;
overflow-y: hidden;
-ms-overflow-style: none;
scrollbar-width: none;
}
.content-we-are-investors-section .links-wrapper a {
text-decoration-color: #fff;
transition: 0.5s;
font-size: 0.875rem;
color: #0e5197;
flex-shrink: 0;
}
.content-we-are-investors-section .links-wrapper a:hover {
color: rgb(0, 39, 80);
}
.content-we-are-investors-section .links-wrapper::-webkit-scrollbar {
display: none;
}
.content-we-are-investors-section .text-wrapper {
max-width: 1024px;
margin-top: 1rem;
margin-bottom: 3.5rem;
font-size: 1.5rem;
font-weight: 400;
line-height: 2rem;
}
.content-we-are-investors-section .flag-content {
display: flex;
flex-direction: row;
flex-wrap: wrap;
gap: 0.5rem;
margin-bottom: 5rem;
}
.content-we-are-investors-section .flag-content a {
text-decoration: none;
}
.content-we-are-investors-section .flag-content a img {
padding: 3px;
border-radius: 100%;
border: solid rgb(239, 242, 245) 1px;
display: block;
width: 2.5rem;
height: 2.5rem;
transition: 0.1s;
}
.content-we-are-investors-section .flag-content a:hover img {
transform: scale(1.1);
}
.content-we-are-investors-section .columns-numbers {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-bottom: 5rem;
width: 100%;
}
.content-we-are-investors-section .columns-numbers .column {
flex: 0 0 33.3%;
display: flex;
flex-direction: column;
padding: 0 2.5rem 1.5rem 2.5rem;
border-left: solid rgb(115, 179, 244) 1px;
}
.content-we-are-investors-section .columns-numbers .column:last-child {
border-right: solid rgb(115, 179, 244) 1px;
}
@media (min-width: 768px) and (max-width: 1024px) {
.content-we-are-investors-section .columns-numbers .column {
flex: 0 0 100%;
border-left: none;
border-right: none;
padding: 1rem 1.5rem 1.5rem 1.5rem;
border-top: solid rgb(115, 179, 244) 1px;
}
.content-we-are-investors-section .columns-numbers .column:last-child {
border-bottom: solid rgb(115, 179, 244) 1px;
}
}
.content-we-are-investors-section .columns-numbers .column .number-large {
background: linear-gradient(180deg, #2C87E6 0%, #0C67BF 100%);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
color: transparent;
letter-spacing: -0.022em;
line-height: 6.75rem;
font-size: 6rem;
margin-bottom: 1.5rem;
}
.content-we-are-investors-section .columns-content {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-bottom: 4rem;
width: 100%;
}
.content-we-are-investors-section .columns-content .column {
flex: 0 0 33.333%;
display: flex;
flex-direction: column;
padding: 2.25rem;
border-left: solid #fff 1px;
background: rgb(239, 242, 245);
}
.content-we-are-investors-section .columns-content .column h3 {
text-align: center;
margin-bottom: 1rem;
padding-bottom: 1rem;
position: relative;
}
.content-we-are-investors-section .columns-content .column h3::after {
content: "";
height: 1px;
background: rgb(219, 223, 228);
width: 80px;
position: absolute;
bottom: 1px;
display: block;
left: 50%;
transform: translateX(-50%);
}
.content-we-are-investors-section .columns-content .column .text-wrap p {
margin-top: 0;
text-align: center;
}
.content-we-are-investors-section .columns-content .column .text-wrap p:last-child {
margin-bottom: 0;
}
.content-we-are-investors-section .logos-wrapper {
display: block;
overflow: hidden;
white-space: nowrap;
width: 100%;
position: relative;
margin: 2rem auto 4rem auto;
background: #fff;
}
.content-we-are-investors-section .logos-wrapper::before, .content-we-are-investors-section .logos-wrapper::after {
content: "";
position: absolute;
top: 0;
width: 50px;
height: 100%;
z-index: 2;
pointer-events: none;
}
.content-we-are-investors-section .logos-wrapper::before {
left: 0;
background: linear-gradient(to right, rgb(255, 255, 255), rgba(255, 255, 255, 0));
}
.content-we-are-investors-section .logos-wrapper::after {
right: 0;
background: linear-gradient(to left, rgb(255, 255, 255), rgba(255, 255, 255, 0));
}
.content-we-are-investors-section .logos-wrapper .logos-track {
display: flex;
animation: scroll-left 25s linear infinite;
will-change: transform;
}
.content-we-are-investors-section .logos-wrapper .logos-track img {
height: 50px;
width: auto;
margin: 0 1rem;
flex-shrink: 0;
opacity: 0.6;
transition: opacity 0.3s ease;
display: block;
will-change: transform;
}
.content-we-are-investors-section .logos-wrapper:hover .logos-track {
animation-play-state: paused;
}
@keyframes scroll-left {
0% {
transform: translateX(0%);
}
100% {
transform: translateX(-33%);
}
}
@keyframes scroll-left-mobile {
0% {
transform: translateX(0%);
}
100% {
transform: translateX(-100%);
}
}
@media (max-width: 767px) {
.content-we-are-investors-section .heading {
font-size: 2.25rem;
}
.content-we-are-investors-section .links-wrapper {
gap: 1.5rem;
}
.content-we-are-investors-section .text-wrapper {
font-size: 1.25rem;
margin-bottom: 2.5rem;
}
.content-we-are-investors-section .logos-track {
animation: scroll-left-mobile 30s linear infinite !important;
}
.content-we-are-investors-section .flag-content {
margin-bottom: 2.5rem;
}
.content-we-are-investors-section .columns-numbers {
margin-bottom: 2.5rem;
}
.content-we-are-investors-section .columns-numbers .counter-number {
transition: all 0.3s ease;
}
.content-we-are-investors-section .columns-numbers .column {
border-left: none;
border-right: none !important;
padding: 1rem 1.5rem 1.5rem 1.5rem;
flex: 0 0 100%;
border-top: solid rgb(115, 179, 244) 1px;
}
.content-we-are-investors-section .columns-numbers .column:last-child {
border-bottom: solid rgb(115, 179, 244) 1px;
}
.content-we-are-investors-section .columns-numbers .column .number-large {
font-size: 4.5rem;
line-height: 5rem;
}
.content-we-are-investors-section .columns-content {
margin-bottom: 2.5rem;
}
.content-we-are-investors-section .columns-content .column {
flex: 0 0 100%;
}
}
.content-what-we-do-section {
background: linear-gradient(180deg, #EFF2F5 0%, #EAF4FF 99.98%);
}
.content-what-we-do-section .container {
padding-top: 4rem;
padding-bottom: 4rem;
background-image: url("/wp-content/themes/telecom-ip-theme/images/content-background-squares.svg");
background-repeat: no-repeat;
background-position: top;
background-attachment: fixed;
}
.content-what-we-do-section .mini-heading {
text-transform: uppercase;
}
.content-what-we-do-section .heading {
font-size: 3.75rem;
line-height: 120%;
margin-bottom: 0;
}
.content-what-we-do-section .links-wrapper {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
gap: 1.5rem;
margin-top: 0.5rem;
overflow-x: auto;
overflow-y: hidden;
-ms-overflow-style: none;
scrollbar-width: none;
}
.content-what-we-do-section .links-wrapper a {
transition: 0.5s;
text-decoration: none;
font-size: 0.875rem;
color: #0e5197;
flex-shrink: 0;
}
.content-what-we-do-section .links-wrapper a:hover {
color: rgb(0, 39, 80);
}
.content-what-we-do-section .links-wrapper::-webkit-scrollbar {
display: none;
}
.content-what-we-do-section .text-wrapper {
max-width: 64rem;
margin-top: 1rem;
margin-bottom: 3.5rem;
font-size: 1.5rem;
font-weight: 400;
line-height: 2rem;
}
.content-what-we-do-section .main-columns-wrapper {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
gap: 1.5rem;
margin-bottom: 2.5rem;
}
.content-what-we-do-section .main-columns-wrapper .column {
flex-direction: column;
flex: 0 0 calc(50% - 0.75rem);
padding-bottom: 1rem;
border-bottom: solid rgb(219, 223, 228) 1px;
}
.content-what-we-do-section .main-columns-wrapper .column a {
text-decoration: none;
}
.content-what-we-do-section .main-columns-wrapper .column a:hover .thumb {
transform: scale(1.05);
}
.content-what-we-do-section .main-columns-wrapper .column a:hover h3 {
color: rgb(4, 61, 120);
}
.content-what-we-do-section .main-columns-wrapper .column a:hover .arrow-wrap {
transform: translateX(10px);
}
.content-what-we-do-section .main-columns-wrapper .column .img-wrap {
overflow: hidden;
margin-bottom: 1rem;
}
.content-what-we-do-section .main-columns-wrapper .column .thumb {
display: block;
width: 100%;
height: 24.5rem;
object-fit: cover;
transition: 0.4s;
}
.content-what-we-do-section .main-columns-wrapper .column h3 {
color: rgb(14, 81, 151);
margin-bottom: 0.5rem;
transition: 0.4s;
}
.content-what-we-do-section .main-columns-wrapper .column p {
margin: 0;
}
.content-what-we-do-section .main-columns-wrapper .column .text {
overflow: hidden;
margin-bottom: 0.5rem;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.content-what-we-do-section .main-columns-wrapper .column .arrow-wrap {
display: inline-flex;
align-self: baseline;
padding: 0.51rem;
transition: 0.4s;
}
.content-what-we-do-section .main-columns-wrapper .column .arrow-wrap img {
width: 0.75rem;
height: 0.75rem;
margin: 0;
}
.content-what-we-do-section .horizontal-columns {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
overflow-x: scroll;
overflow-y: hidden;
gap: 1.5rem;
padding-bottom: 1.5rem;
position: relative;
}
.content-what-we-do-section .horizontal-columns::after {
width: 100%;
height: 1px;
background: rgb(219, 223, 228);
display: block;
content: "";
position: absolute;
bottom: -4px;
z-index: 99;
}
.content-what-we-do-section .horizontal-columns::-webkit-scrollbar {
height: 0.5rem !important;
-webkit-appearance: none !important;
}
.content-what-we-do-section .horizontal-columns::-webkit-scrollbar-track {
background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 45%, rgb(219, 223, 228) 46%, rgb(219, 223, 228) 56%, rgba(255, 255, 255, 0) 54%);
border-radius: 0 !important;
}
.content-what-we-do-section .horizontal-columns::-webkit-scrollbar-thumb {
background-color: rgb(189, 195, 201) !important;
border-radius: 0 !important;
-webkit-border-radius: 0 !important;
border: none !important;
box-shadow: inset 3px 0 0 white, inset -3px 0 0 white !important;
}
.content-what-we-do-section .horizontal-columns::-webkit-scrollbar-thumb:hover {
background-color: rgb(171, 177, 183) !important;
border-radius: 0 !important;
}
.content-what-we-do-section .horizontal-columns::-webkit-scrollbar-corner {
background: transparent !important;
}
.content-what-we-do-section .horizontal-columns .column {
flex-direction: column;
flex: 0 0 20rem;
padding-bottom: 1rem;
border-bottom: solid rgb(219, 223, 228) 1px;
}
.content-what-we-do-section .horizontal-columns .column a {
text-decoration: none;
}
.content-what-we-do-section .horizontal-columns .column a:hover .thumb {
transform: scale(1.05);
}
.content-what-we-do-section .horizontal-columns .column a:hover h3 {
color: rgb(4, 61, 120);
}
.content-what-we-do-section .horizontal-columns .column a:hover .arrow-wrap {
transform: translateX(10px);
}
.content-what-we-do-section .horizontal-columns .column .img-wrap {
overflow: hidden;
margin-bottom: 1rem;
}
.content-what-we-do-section .horizontal-columns .column .thumb {
display: block;
width: 100%;
height: 11.25rem;
object-fit: cover;
transition: 0.4s;
}
.content-what-we-do-section .horizontal-columns .column h3 {
color: rgb(14, 81, 151);
margin-bottom: 0.5rem;
transition: 0.4s;
}
.content-what-we-do-section .horizontal-columns .column p {
margin: 0;
}
.content-what-we-do-section .horizontal-columns .column .text {
overflow: hidden;
margin-bottom: 0.5rem;
overflow: hidden;
margin-bottom: 0.5rem;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.content-what-we-do-section .horizontal-columns .column .arrow-wrap {
display: inline-flex;
align-self: baseline;
padding: 0.51rem;
transition: 0.4s;
}
.content-what-we-do-section .horizontal-columns .column .arrow-wrap img {
width: 0.75rem;
height: 0.75rem;
margin: 0;
}
.content-what-we-do-section .button-wrap {
display: flex;
width: 100%;
}
.content-what-we-do-section .button-wrap a {
background: rgb(31, 105, 178);
display: flex;
width: 100%;
padding: 1.5rem 2.5rem;
color: #fff;
font-size: 1.25rem;
line-height: 1.75rem;
background-image: url("/wp-content/themes/telecom-ip-theme/images/bg-button.svg");
justify-content: space-between;
margin-top: 2.5rem;
text-decoration: none;
transition: 0.4s;
}
.content-what-we-do-section .button-wrap a:hover {
background-color: rgb(4, 61, 120);
}
.content-what-we-do-section .button-wrap a .text-right {
display: flex;
gap: 0.75rem;
}
.content-what-we-do-section .button-wrap a .text-right img {
width: 1rem;
}
.content-what-we-do-section .button-wrap a .text-right .arrow {
display: flex;
align-items: center;
justify-content: center;
}
@media (max-width: 767px) {
.content-what-we-do-section .heading {
font-size: 2.25rem;
}
.content-what-we-do-section .links-wrapper {
gap: 1.5rem;
}
.content-what-we-do-section .text-wrapper {
font-size: 1.25rem;
margin-bottom: 2.5rem;
}
.content-what-we-do-section .main-columns-wrapper {
flex-direction: column;
}
.content-what-we-do-section .main-columns-wrapper .column h3 {
font-size: 1.25rem;
}
.content-what-we-do-section .main-columns-wrapper .column .thumb {
height: 12rem;
}
.content-what-we-do-section .horizontal-columns .column {
width: 17.5rem;
flex: 0 0 17.5rem;
}
.content-what-we-do-section .horizontal-columns .column h3 {
font-size: 1.25rem;
}
.content-what-we-do-section .horizontal-columns .column .thumb {
width: 17.5rem;
}
.content-what-we-do-section .button-wrap a {
display: flex;
flex-direction: column;
gap: 1rem;
font-size: 1.125rem;
}
}
.content-single-video-section {
background: rgb(14, 28, 42);
padding: 4rem;
}
.content-single-video-section .video-container iframe {
width: 100%;
height: 792px;
}
@media (max-width: 767px) {
.content-single-video-section {
padding: 4rem 1rem;
}
.content-single-video-section .video-container iframe {
height: 12rem;
}
}
.content-why-work-with-tip-section {
background: linear-gradient(180deg, #EFF2F5 0%, #EAF4FF 99.98%);
}
.content-why-work-with-tip-section .container {
padding-top: 4rem;
padding-bottom: 4rem;
background-image: url("/wp-content/themes/telecom-ip-theme/images/hero-background-squares.svg");
background-repeat: no-repeat;
background-position: top;
background-attachment: fixed;
}
.content-why-work-with-tip-section .mini-heading {
text-transform: uppercase;
}
.content-why-work-with-tip-section .heading {
font-size: 3.75rem;
line-height: 120%;
margin-bottom: 0;
}
.content-why-work-with-tip-section .links-wrapper {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
gap: 1.5rem;
margin-top: 0.5rem;
overflow-x: auto;
overflow-y: hidden;
-ms-overflow-style: none;
scrollbar-width: none;
}
.content-why-work-with-tip-section .links-wrapper a {
transition: 0.5s;
font-size: 0.875rem;
color: #0e5197;
text-decoration: none;
flex-shrink: 0;
}
.content-why-work-with-tip-section .links-wrapper a:hover {
color: rgb(0, 39, 80);
}
.content-why-work-with-tip-section .links-wrapper::-webkit-scrollbar {
display: none;
}
.content-why-work-with-tip-section .text-wrapper {
max-width: 64rem;
margin-top: 1rem;
margin-bottom: 3.5rem;
font-size: 1.5rem;
font-weight: 400;
line-height: 2rem;
}
.content-why-work-with-tip-section .horizontal-columns {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
overflow-x: scroll;
overflow-y: hidden;
gap: 2.5rem;
padding-bottom: 1.5rem;
position: relative;
}
.content-why-work-with-tip-section .horizontal-columns::after {
width: 100%;
height: 1px;
background: rgb(219, 223, 228);
display: block;
content: "";
position: absolute;
bottom: -4px;
z-index: 99;
}
.content-why-work-with-tip-section .horizontal-columns::-webkit-scrollbar {
height: 0.5rem !important;
-webkit-appearance: none !important;
}
.content-why-work-with-tip-section .horizontal-columns::-webkit-scrollbar-track {
background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 45%, rgb(219, 223, 228) 46%, rgb(219, 223, 228) 56%, rgba(255, 255, 255, 0) 54%);
border-radius: 0 !important;
}
.content-why-work-with-tip-section .horizontal-columns::-webkit-scrollbar-thumb {
background-color: rgb(189, 195, 201) !important;
border-radius: 0 !important;
-webkit-border-radius: 0 !important;
border: none !important;
box-shadow: inset 3px 0 0 white, inset -3px 0 0 white !important;
}
.content-why-work-with-tip-section .horizontal-columns::-webkit-scrollbar-thumb:hover {
background-color: rgb(171, 177, 183) !important;
border-radius: 0 !important;
}
.content-why-work-with-tip-section .horizontal-columns::-webkit-scrollbar-corner {
background: transparent !important;
}
.content-why-work-with-tip-section .horizontal-columns .column {
flex-direction: row;
flex: 0 0 37.5rem;
padding-bottom: 1rem;
border-bottom: solid rgb(219, 223, 228) 1px;
position: relative;
}
.content-why-work-with-tip-section .horizontal-columns .column a {
text-decoration: none;
display: flex;
flex-direction: row;
gap: 1.5rem;
}
.content-why-work-with-tip-section .horizontal-columns .column a:hover h3 {
color: rgb(4, 61, 120);
}
.content-why-work-with-tip-section .horizontal-columns .column a:hover .arrow-wrap {
transform: translateX(10px);
}
.content-why-work-with-tip-section .horizontal-columns .column a:hover .thumb {
transform: scale(1.05);
}
.content-why-work-with-tip-section .horizontal-columns .column .thumb {
display: block;
width: 100%;
height: 7.5rem;
width: 7.5rem;
object-fit: cover;
transition: 0.4s;
}
.content-why-work-with-tip-section .horizontal-columns .column .img-wrap {
overflow: hidden;
margin-bottom: 1rem;
width: 7.5rem;
display: block;
flex: 0 0 auto;
}
.content-why-work-with-tip-section .horizontal-columns .column h3 {
color: rgb(14, 81, 151);
margin-bottom: 0.5rem;
transition: 0.4s;
height: 4.2rem;
overflow: hidden;
}
.content-why-work-with-tip-section .horizontal-columns .column p {
margin: 0;
}
.content-why-work-with-tip-section .horizontal-columns .column .text {
overflow: hidden;
margin-bottom: 0.5rem;
display: -webkit-box;
-webkit-line-clamp: 5;
-webkit-box-orient: vertical;
}
.content-why-work-with-tip-section .horizontal-columns .column .arrow-wrap {
display: inline-flex;
align-self: baseline;
padding: 0.5rem;
position: absolute;
top: 0;
right: 0;
transition: 0.4s;
}
.content-why-work-with-tip-section .horizontal-columns .column .arrow-wrap img {
width: 0.75rem;
height: 0.75rem;
margin: 0;
}
.content-why-work-with-tip-section .buttons-wrapper {
display: flex;
width: 100%;
flex-direction: row;
margin-top: 3rem;
gap: 1rem;
flex-wrap: wrap;
}
.content-why-work-with-tip-section .buttons-wrapper a {
display: inline-flex;
padding: 0.5rem 1rem;
line-height: 140%;
text-decoration: none;
border: solid rgb(189, 195, 201) 1px;
transition: 0.4s;
box-shadow: none;
}
.content-why-work-with-tip-section .buttons-wrapper a:hover {
background: rgb(239, 243, 245);
box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
}
@media (max-width: 767px) {
.content-why-work-with-tip-section .heading {
font-size: 2.25rem;
}
.content-why-work-with-tip-section .links-wrapper {
gap: 1.5rem;
}
.content-why-work-with-tip-section .text-wrapper {
font-size: 1.25rem;
margin-bottom: 2.5rem;
}
.content-why-work-with-tip-section .horizontal-columns .column {
flex-direction: column;
flex: 0 0 17.5rem;
display: flex;
padding-bottom: 1rem;
border-bottom: solid rgb(219, 223, 228) 1px;
position: relative;
}
.content-why-work-with-tip-section .horizontal-columns .column a {
text-decoration: none;
display: flex;
flex-direction: column;
gap: 0rem;
}
.content-why-work-with-tip-section .horizontal-columns .column .thumb {
display: block;
width: 100%;
width: 17.5rem;
height: 10rem;
margin-bottom: 1rem;
object-fit: cover;
}
.content-why-work-with-tip-section .horizontal-columns .column .img-wrap {
height: 10rem;
width: 17.5rem;
}
.content-why-work-with-tip-section .horizontal-columns .column h3 {
color: rgb(14, 81, 151);
margin-bottom: 0.5rem;
}
.content-why-work-with-tip-section .horizontal-columns .column p {
margin: 0;
}
.content-why-work-with-tip-section .horizontal-columns .column .text {
height: 7.5rem;
overflow: hidden;
margin-bottom: 0.5rem;
}
.content-why-work-with-tip-section .horizontal-columns .column .arrow-wrap {
display: inline-flex;
align-self: baseline;
padding: 0.5rem;
top: 0;
right: 0;
position: static;
}
.content-why-work-with-tip-section .horizontal-columns .column .arrow-wrap img {
width: 0.75rem;
height: 0.75rem;
margin: 0;
}
.content-why-work-with-tip-section .button-wrap a {
display: flex;
flex-direction: column;
gap: 1rem;
font-size: 1.125rem;
}
}
.content-stay-up-to-date-section .container {
padding-top: 4rem;
padding-bottom: 4rem;
background-repeat: no-repeat;
background-position: top;
}
.content-stay-up-to-date-section .mini-heading {
text-transform: uppercase;
}
.content-stay-up-to-date-section .heading {
font-size: 3.75rem;
line-height: 120%;
margin-bottom: 0;
}
.content-stay-up-to-date-section .links-wrapper {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
gap: 1.5rem;
margin-top: 0.5rem;
overflow-x: auto;
overflow-y: hidden;
-ms-overflow-style: none;
scrollbar-width: none;
}
.content-stay-up-to-date-section .links-wrapper a {
text-decoration-color: #fff;
transition: 0.5s;
font-size: 0.875rem;
color: #0e5197;
flex-shrink: 0;
}
.content-stay-up-to-date-section .links-wrapper a:hover {
color: rgb(0, 39, 80);
}
.content-stay-up-to-date-section .links-wrapper::-webkit-scrollbar {
display: none;
}
.content-stay-up-to-date-section .text-wrapper {
max-width: 64rem;
margin-top: 1rem;
margin-bottom: 4rem;
font-size: 1.5rem;
font-weight: 400;
line-height: 2rem;
}
.content-stay-up-to-date-section .articles-wrapper {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
gap: 1.5rem;
margin-bottom: 2.5rem;
}
.content-stay-up-to-date-section .articles-wrapper .column {
flex-direction: column;
flex: 0 0 calc(33.33% - 1rem);
padding-bottom: 1rem;
border-bottom: solid rgb(219, 223, 228) 1px;
}
.content-stay-up-to-date-section .articles-wrapper .column a {
text-decoration: none;
height: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.content-stay-up-to-date-section .articles-wrapper .column a:hover h3 {
color: rgb(4, 61, 120);
}
.content-stay-up-to-date-section .articles-wrapper .column a:hover .arrow-wrap {
transform: translateX(10px);
}
.content-stay-up-to-date-section .articles-wrapper .column a:hover .thumb {
transform: scale(1.05);
}
.content-stay-up-to-date-section .articles-wrapper .column a:hover .button-wrap {
color: rgb(4, 61, 120);
}
.content-stay-up-to-date-section .articles-wrapper .column .button-wrap {
font-size: 0.875rem;
color: rgb(14, 81, 151);
margin-top: 1rem;
line-height: 1.25rem;
transition: 0.4s;
}
.content-stay-up-to-date-section .articles-wrapper .column .thumb {
display: block;
width: 100%;
height: auto;
aspect-ratio: 2/1;
object-fit: contain;
transition: 0.3s;
}
.content-stay-up-to-date-section .articles-wrapper .column .img-wrap {
margin-bottom: 1rem;
overflow: hidden;
}
.content-stay-up-to-date-section .articles-wrapper .column h3 {
color: rgb(14, 81, 151);
margin-bottom: 0.5rem;
font-weight: 400;
transition: 0.3s;
}
.content-stay-up-to-date-section .articles-wrapper .column p {
margin: 0;
}
.content-stay-up-to-date-section .articles-wrapper .column .text {
height: 3rem;
overflow: hidden;
margin-bottom: 0.5rem;
}
.content-stay-up-to-date-section .videos-wrapper {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
overflow-x: scroll;
overflow-y: hidden;
gap: 1.5rem;
padding-bottom: 1.5rem;
position: relative;
}
.content-stay-up-to-date-section .videos-wrapper::-webkit-scrollbar {
height: 0.5rem !important;
-webkit-appearance: none !important;
}
.content-stay-up-to-date-section .videos-wrapper::-webkit-scrollbar-track {
background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 45%, rgb(219, 223, 228) 46%, rgb(219, 223, 228) 56%, rgba(255, 255, 255, 0) 54%);
border-radius: 0 !important;
}
.content-stay-up-to-date-section .videos-wrapper::-webkit-scrollbar-thumb {
background-color: rgb(189, 195, 201) !important;
border-radius: 0 !important;
-webkit-border-radius: 0 !important;
border: none !important;
box-shadow: inset 3px 0 0 white, inset -3px 0 0 white !important;
}
.content-stay-up-to-date-section .videos-wrapper::-webkit-scrollbar-thumb:hover {
background-color: rgb(171, 177, 183) !important;
border-radius: 0 !important;
}
.content-stay-up-to-date-section .videos-wrapper::-webkit-scrollbar-corner {
background: transparent !important;
}
.content-stay-up-to-date-section .videos-wrapper .single-video {
flex: 0 0 17.5rem;
}
.content-stay-up-to-date-section .videos-wrapper .single-video iframe {
width: 100%;
height: 10rem;
}
.content-stay-up-to-date-section .buttons-wrapper {
display: flex;
width: 100%;
flex-direction: row;
margin-top: 3rem;
gap: 1rem;
flex-wrap: wrap;
}
.content-stay-up-to-date-section .buttons-wrapper a {
display: inline-flex;
padding: 0.5rem 1rem;
line-height: 140%;
text-decoration: none;
border: solid rgb(189, 195, 201) 1px;
transition: 0.4s;
box-shadow: none;
}
.content-stay-up-to-date-section .buttons-wrapper a:hover {
background: rgb(239, 243, 245);
box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
}
@media (max-width: 767px) {
.content-stay-up-to-date-section .heading {
font-size: 2.25rem;
}
.content-stay-up-to-date-section .links-wrapper {
gap: 1.5rem;
}
.content-stay-up-to-date-section .text-wrapper {
font-size: 1.25rem;
margin-bottom: 2.5rem;
}
.content-stay-up-to-date-section .articles-wrapper {
gap: 1.5rem;
overflow-x: scroll;
padding-bottom: 1rem;
}
.content-stay-up-to-date-section .articles-wrapper::-webkit-scrollbar {
height: 0.5rem !important;
-webkit-appearance: none !important;
}
.content-stay-up-to-date-section .articles-wrapper::-webkit-scrollbar-track {
background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 45%, rgb(219, 223, 228) 46%, rgb(219, 223, 228) 56%, rgba(255, 255, 255, 0) 54%);
border-radius: 0 !important;
}
.content-stay-up-to-date-section .articles-wrapper::-webkit-scrollbar-thumb {
background-color: rgb(189, 195, 201) !important;
border-radius: 0 !important;
-webkit-border-radius: 0 !important;
border: none !important;
box-shadow: inset 3px 0 0 white, inset -3px 0 0 white !important;
}
.content-stay-up-to-date-section .articles-wrapper::-webkit-scrollbar-thumb:hover {
background-color: rgb(171, 177, 183) !important;
border-radius: 0 !important;
}
.content-stay-up-to-date-section .articles-wrapper::-webkit-scrollbar-corner {
background: transparent !important;
}
.content-stay-up-to-date-section .articles-wrapper .column {
flex: 0 0 17.5rem;
width: 17.5rem;
flex: 0 0 17.5rem;
}
.content-stay-up-to-date-section .articles-wrapper .column h3 {
font-size: 1.125rem;
}
.content-stay-up-to-date-section .articles-wrapper .column .thumb {
width: 17.5rem;
height: auto;
}
.content-stay-up-to-date-section .videos-wrapper {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
overflow-x: scroll;
overflow-y: hidden;
gap: 1.5rem;
padding-bottom: 0;
position: relative;
margin-bottom: 1rem;
scroll-snap-type: x mandatory;
-webkit-overflow-scrolling: touch;
scrollbar-width: none;
-ms-overflow-style: none;
}
.content-stay-up-to-date-section .videos-wrapper::-webkit-scrollbar {
display: none;
}
.content-stay-up-to-date-section .videos-wrapper .single-video {
flex: 0 0 100%;
scroll-snap-align: start;
}
.content-stay-up-to-date-section .videos-wrapper .single-video iframe {
width: 100%;
height: 12rem;
}
.content-stay-up-to-date-section .video-dots {
display: flex;
justify-content: center;
gap: 0.125rem;
margin-top: 1.5rem;
}
.content-stay-up-to-date-section .video-dots .dot {
flex: 1;
height: 0.5rem;
border-radius: 2px;
background-color: rgb(219, 223, 228);
cursor: pointer;
transition: background-color 0.3s ease;
}
.content-stay-up-to-date-section .video-dots .dot.active {
background-color: rgb(31, 105, 178);
}
.content-stay-up-to-date-section .video-dots .dot:hover {
background-color: rgb(31, 105, 178);
}
.content-stay-up-to-date-section .button-wrap a {
display: flex;
flex-direction: column;
gap: 1rem;
font-size: 1.125rem;
}
.buttons-wrapper {
margin-top: 2.5rem;
flex-direction: column;
}
.buttons-wrapper a {
width: 100%;
flex: 0 0 100%;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
}
}
.our-team-section {
margin-top: 4rem;
margin-bottom: 4rem;
}
.our-team-section .mini-heading {
text-transform: uppercase;
}
.our-team-section .heading {
font-size: 3.75rem;
line-height: 120%;
margin-bottom: 0;
}
.our-team-section .links-wrapper {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
gap: 1.5rem;
margin-top: 0.5rem;
overflow-x: auto;
overflow-y: hidden;
-ms-overflow-style: none;
scrollbar-width: none;
}
.our-team-section .links-wrapper a {
text-decoration-color: #fff;
transition: 0.5s;
font-size: 0.875rem;
color: #0e5197;
flex-shrink: 0;
}
.our-team-section .links-wrapper a:hover {
color: rgb(0, 39, 80);
}
.our-team-section .links-wrapper::-webkit-scrollbar {
display: none;
}
.our-team-section .text-wrapper {
max-width: 1024px;
margin-top: 1rem;
margin-bottom: 4rem;
font-size: 1.5rem;
font-weight: 400;
line-height: 2rem;
}
.our-team-section .team-wrapper {
display: flex;
flex-direction: row;
flex-wrap: wrap;
gap: 2.5rem;
}
.our-team-section .team-wrapper .person {
flex: 0 0 calc(33.333% - 1.6666666667rem);
display: flex;
flex-direction: column;
min-width: 0;
}
.our-team-section .team-wrapper .person .image-wrap img {
display: block;
width: 100%;
height: auto;
object-fit: contain;
aspect-ratio: 16/9;
}
.our-team-section .team-wrapper .person .content-wrap {
padding: 1rem 1.5rem;
border-top: solid rgb(219, 223, 228) 1px;
border-bottom: solid rgb(219, 223, 228) 1px;
display: flex;
flex-direction: column;
justify-content: space-between;
flex: 1;
}
.our-team-section .team-wrapper .person .content-wrap h3 {
color: rgb(14, 28, 42);
font-size: 1.5rem;
line-height: 140%;
margin-bottom: 0.25rem;
}
.our-team-section .team-wrapper .person .content-wrap .job-title {
color: rgb(101, 109, 117);
font-size: 0.875rem;
margin-bottom: 1rem;
text-transform: uppercase;
}
.our-team-section .team-wrapper .person .content-wrap .links {
display: flex;
flex-direction: row;
gap: 1rem;
}
.our-team-section .team-wrapper .person .content-wrap .links a {
display: flex;
padding: 0.5rem;
flex: 0 0 auto;
border: solid rgb(189, 195, 201) 1px;
transition: 0.3s;
}
.our-team-section .team-wrapper .person .content-wrap .links a:hover {
transform: scale(1.1);
}
.our-team-section .team-wrapper .person .content-wrap .links a img {
width: 1.5rem;
height: 1.5rem;
}
.our-team-section .team-wrapper-v2 .ceo-section {
margin-bottom: 2.5rem;
display: flex;
flex-direction: row;
gap: 2.5rem;
}
.our-team-section .team-wrapper-v2 .ceo-section .ceo {
flex: 0 0 calc(50% - 1.25rem);
}
.our-team-section .team-wrapper-v2 .ceo-section .ceo .image-wrap img {
display: block;
width: 100%;
height: auto;
object-fit: contain;
aspect-ratio: 16/9;
}
.our-team-section .team-wrapper-v2 .ceo-section .ceo .content-wrap {
padding: 1rem 1.5rem;
border-top: solid rgb(219, 223, 228) 1px;
border-bottom: solid rgb(219, 223, 228) 1px;
display: flex;
flex-direction: column;
justify-content: space-between;
flex: 1;
}
.our-team-section .team-wrapper-v2 .ceo-section .ceo .content-wrap h3 {
color: rgb(14, 28, 42);
font-size: 1.5rem;
line-height: 140%;
margin-bottom: 0.25rem;
}
.our-team-section .team-wrapper-v2 .ceo-section .ceo .content-wrap .job-title {
color: rgb(101, 109, 117);
font-size: 0.875rem;
margin-bottom: 1rem;
text-transform: uppercase;
}
.our-team-section .team-wrapper-v2 .ceo-section .ceo .content-wrap .links {
display: flex;
flex-direction: row;
gap: 1rem;
}
.our-team-section .team-wrapper-v2 .ceo-section .ceo .content-wrap .links a {
display: flex;
padding: 0.5rem;
flex: 0 0 auto;
border: solid rgb(189, 195, 201) 1px;
transition: 0.3s;
}
.our-team-section .team-wrapper-v2 .ceo-section .ceo .content-wrap .links a:hover {
transform: scale(1.1);
}
.our-team-section .team-wrapper-v2 .ceo-section .ceo .content-wrap .links a img {
width: 1.5rem;
height: 1.5rem;
}
.our-team-section .team-wrapper-v2 .ceo-section .description {
flex: 0 0 calc(50% - 1.25rem);
background: rgb(239, 242, 245);
font-size: 1.125rem;
color: rgb(14, 28, 42);
padding: 2.5rem;
line-height: 1.75rem;
font-weight: 400;
}
.our-team-section .team-wrapper-v2 .team-wrapper-scroll {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
gap: 1.5rem;
margin-top: 2.5rem;
overflow-x: auto;
padding-bottom: 1.5rem;
}
.our-team-section .team-wrapper-v2 .team-wrapper-scroll::-webkit-scrollbar {
height: 0.5rem !important;
-webkit-appearance: none !important;
}
.our-team-section .team-wrapper-v2 .team-wrapper-scroll::-webkit-scrollbar-track {
background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 45%, rgb(219, 223, 228) 46%, rgb(219, 223, 228) 56%, rgba(255, 255, 255, 0) 54%);
border-radius: 0 !important;
}
.our-team-section .team-wrapper-v2 .team-wrapper-scroll::-webkit-scrollbar-thumb {
background-color: rgb(189, 195, 201) !important;
border-radius: 0 !important;
-webkit-border-radius: 0 !important;
border: none !important;
box-shadow: inset 3px 0 0 white, inset -3px 0 0 white !important;
}
.our-team-section .team-wrapper-v2 .team-wrapper-scroll::-webkit-scrollbar-thumb:hover {
background-color: rgb(171, 177, 183) !important;
border-radius: 0 !important;
}
.our-team-section .team-wrapper-v2 .team-wrapper-scroll::-webkit-scrollbar-corner {
background: transparent !important;
}
.our-team-section .team-wrapper-v2 .team-wrapper-scroll .person {
flex: 0 0 22.5rem;
display: flex;
flex-direction: column;
}
.our-team-section .team-wrapper-v2 .team-wrapper-scroll .person .image-wrap img {
display: block;
width: 100%;
height: auto;
object-fit: contain;
aspect-ratio: 16/9;
}
.our-team-section .team-wrapper-v2 .team-wrapper-scroll .person .content-wrap {
padding: 1rem 1.5rem;
border-top: solid rgb(219, 223, 228) 1px;
border-bottom: solid rgb(219, 223, 228) 1px;
flex: 1;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.our-team-section .team-wrapper-v2 .team-wrapper-scroll .person .content-wrap h3 {
color: rgb(14, 28, 42);
font-size: 1.5rem;
line-height: 140%;
margin-bottom: 0.25rem;
}
.our-team-section .team-wrapper-v2 .team-wrapper-scroll .person .content-wrap .job-title {
color: rgb(101, 109, 117);
font-size: 0.875rem;
margin-bottom: 1rem;
text-transform: uppercase;
}
.our-team-section .team-wrapper-v2 .team-wrapper-scroll .person .content-wrap .links {
display: flex;
flex-direction: row;
gap: 1rem;
}
.our-team-section .team-wrapper-v2 .team-wrapper-scroll .person .content-wrap .links a {
display: flex;
padding: 0.5rem;
flex: 0 0 auto;
border: solid rgb(189, 195, 201) 1px;
transition: 0.3s;
}
.our-team-section .team-wrapper-v2 .team-wrapper-scroll .person .content-wrap .links a:hover {
transform: scale(1.1);
}
.our-team-section .team-wrapper-v2 .team-wrapper-scroll .person .content-wrap .links a img {
width: 1.5rem;
height: 1.5rem;
}
.our-team-section .team-wrapper-v2 .general-inquiry {
display: flex;
flex-direction: row;
gap: 1.5rem;
flex-wrap: wrap;
}
.our-team-section .team-wrapper-v2 .general-inquiry .item {
flex: 0 0 20.75rem;
height: 100%;
padding: 2rem 1.5rem;
border-left: solid rgb(219, 223, 228) 1px;
display: flex;
flex-direction: column;
gap: 0.75rem;
}
.our-team-section .team-wrapper-v2 .general-inquiry .item a {
color: rgb(14, 81, 151);
line-height: 1.5rem;
text-decoration-color: #fff;
display: inline-flex;
flex-direction: row;
align-items: center;
gap: 0.5rem;
}
@media (max-width: 767px) {
.our-team-section .heading {
font-size: 2.25rem;
}
.our-team-section .links-wrapper {
gap: 1.5rem;
}
.our-team-section .text-wrapper {
font-size: 1.25rem;
margin-bottom: 2.5rem;
}
.our-team-section .team-wrapper {
flex-direction: column;
flex-wrap: nowrap;
}
.our-team-section .team-wrapper .person {
flex: 0 0 100%;
display: flex;
flex-direction: column;
}
.our-team-section .team-wrapper .person h3 {
font-size: 1.25rem;
}
.our-team-section .team-wrapper-v2 .ceo-section {
flex-direction: column;
}
.our-team-section .team-wrapper-v2 .ceo-section .description {
font-size: 1rem;
}
}
.standard-faq-section {
margin-top: 4rem;
}
.standard-faq-section .mini-heading {
text-transform: uppercase;
}
.standard-faq-section .heading {
font-size: 3.75rem;
line-height: 120%;
margin-bottom: 0;
}
.standard-faq-section .links-wrapper {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
gap: 1.5rem;
margin-top: 0.5rem;
overflow-x: auto;
overflow-y: hidden;
-ms-overflow-style: none;
scrollbar-width: none;
}
.standard-faq-section .links-wrapper a {
text-decoration-color: #fff;
transition: 0.5s;
font-size: 0.875rem;
color: #0e5197;
flex-shrink: 0;
}
.standard-faq-section .links-wrapper a:hover {
color: rgb(0, 39, 80);
}
.standard-faq-section .text-content {
margin-top: 1rem;
margin-bottom: 4rem;
font-size: 1.5rem;
}
.standard-faq-section .text-content a:hover {
color: #0e5197;
transition: 0.3s;
}
.standard-faq-section .text-content ul {
padding-left: 0;
margin-top: 1.25rem;
margin-bottom: 1.25rem;
}
.standard-faq-section .text-content ul li {
margin-bottom: 0.5rem;
list-style: none;
padding-left: 2rem;
position: relative;
font-size: 1.125rem;
line-height: 1.75rem;
}
.standard-faq-section .text-content ul li:last-child {
margin-bottom: 0;
}
.standard-faq-section .text-content ul li::before {
content: "";
position: absolute;
left: 0.5rem;
top: 11px;
width: 0.35rem;
height: 0.35rem;
background-image: url("/wp-content/themes/telecom-ip-theme/images/list-dot-blue.svg");
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.standard-faq-section .faq-wrapper {
display: flex;
flex-direction: column;
margin-top: 4rem;
border-top: solid rgb(219, 223, 228) 1px;
margin-bottom: 4rem;
}
.standard-faq-section .faq-wrapper .faq-item {
flex: 0 0 100%;
}
.standard-faq-section .faq-wrapper .faq-item .faq-question {
display: flex;
flex-direction: row;
gap: 1rem;
font-size: 1.125rem;
padding: 0.75rem 0.5rem;
border-bottom: solid rgb(219, 223, 228) 1px;
cursor: pointer;
line-height: 1.75rem;
}
.standard-faq-section .faq-wrapper .faq-item .faq-question img {
width: 0.75rem;
}
.standard-faq-section .faq-wrapper .faq-item .faq-answer {
overflow: hidden;
height: 0;
transition: height 0.3s ease-in-out;
}
.standard-faq-section .faq-wrapper .faq-item .faq-content {
border-bottom: solid rgb(219, 223, 228) 1px;
font-size: 1.125rem;
line-height: 1.75rem;
padding: 1.5rem 2.25rem;
}
@media (max-width: 767px) {
.standard-faq-section .heading {
font-size: 2.25rem;
}
.standard-faq-section .links-wrapper {
gap: 1.5rem;
}
.standard-faq-section .text-content {
font-size: 1.25rem;
}
.standard-faq-section .text-content ul li::before {
width: 0.25rem;
height: 0.25rem;
}
.standard-faq-section .faq-wrapper .faq-item .faq-question {
font-size: 1rem;
}
.standard-faq-section .faq-wrapper .faq-item .faq-content {
font-size: 1rem;
}
}
.combined-faq-section {
margin-top: 4rem;
margin-bottom: 4rem;
}
.combined-faq-section .mini-heading {
text-transform: uppercase;
}
.combined-faq-section .heading {
font-size: 3.75rem;
line-height: 120%;
margin-bottom: 0;
}
.combined-faq-section .links-wrapper {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
gap: 1.5rem;
margin-top: 0.5rem;
overflow-x: auto;
overflow-y: hidden;
-ms-overflow-style: none;
scrollbar-width: none;
}
.combined-faq-section .links-wrapper a {
text-decoration-color: #fff;
transition: 0.5s;
font-size: 0.875rem;
color: #0e5197;
flex-shrink: 0;
}
.combined-faq-section .links-wrapper a:hover {
color: rgb(0, 39, 80);
}
.combined-faq-section .faq-row {
display: flex;
flex-direction: row;
gap: 2.5rem;
margin-top: 5rem;
}
.combined-faq-section .img-wrapper {
flex: 0 0 calc(50% - 1.25rem);
}
.combined-faq-section .img-wrapper img {
display: block;
width: 100%;
aspect-ratio: 1/1;
object-fit: cover;
}
.combined-faq-section .faq-wrapper {
display: flex;
flex-direction: column;
border-top: solid rgb(219, 223, 228) 1px;
flex: 0 0 calc(50% - 1.25rem);
}
.combined-faq-section .faq-wrapper .faq-item .faq-question {
display: flex;
flex-direction: row;
gap: 1rem;
font-size: 1.125rem;
padding: 0.75rem 0.5rem;
border-bottom: solid rgb(219, 223, 228) 1px;
cursor: pointer;
line-height: 1.75rem;
}
.combined-faq-section .faq-wrapper .faq-item .faq-question img {
width: 0.75rem;
}
.combined-faq-section .faq-wrapper .faq-item .faq-answer {
overflow: hidden;
height: 0;
transition: height 0.3s ease-in-out;
}
.combined-faq-section .faq-wrapper .faq-item .faq-content {
border-bottom: solid rgb(219, 223, 228) 1px;
font-size: 1.125rem;
line-height: 1.75rem;
padding: 1.5rem 2.25rem;
}
@media (max-width: 767px) {
.combined-faq-section {
margin-top: 4rem;
}
.combined-faq-section .heading {
font-size: 2.25rem;
}
.combined-faq-section .links-wrapper {
gap: 1.5rem;
}
.combined-faq-section .faq-row {
gap: 2.5rem;
flex-direction: column;
}
.combined-faq-section .faq-wrapper .faq-item .faq-question {
font-size: 1rem;
}
.combined-faq-section .faq-wrapper .faq-item .faq-content {
font-size: 1rem;
}
}
.separator-page-end {
height: 4rem;
}
.separator-page-end.set-to-blue {
background: #EBF4FD;
}
.page-end-contact-section {
padding: 4rem 0 4rem 0;
background: rgb(90, 147, 206);
background-image: url("/wp-content/themes/telecom-ip-theme/images/squares-contact.svg");
background-repeat: no-repeat;
background-position: right;
background-attachment: fixed;
}
.page-end-contact-section.set-to-blue .footer-mask-svg path {
fill: #EBF4FD;
}
.page-end-contact-section .text {
margin-bottom: 4rem;
}
.page-end-contact-section .footer-mask-svg {
position: relative;
left: 0;
width: 100%;
z-index: 99;
top: calc(-4rem - 2px);
background: solid #fff 1px;
}
.page-end-contact-section .footer-mask-svg svg {
width: 100%;
height: auto;
display: block;
height: auto;
}
.page-end-contact-section h2 {
font-size: 3.75rem;
line-height: 120%;
margin-bottom: 0;
}
.page-end-contact-section .text {
max-width: 64rem;
margin-top: 1rem;
margin-bottom: 4rem;
font-size: 1.5rem;
font-weight: 400;
line-height: 2rem;
}
.page-end-contact-section .contact-buttons {
display: flex;
flex-direction: row;
align-items: center;
gap: 1.5rem;
}
.page-end-contact-section .contact-buttons a {
padding: 0.75rem 1.5rem;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.75rem;
text-decoration: none;
}
.page-end-contact-section .contact-buttons .contact-button {
height: 3.25rem;
}
.page-end-contact-section .contact-buttons .contact-button--dark_blue {
background: rgb(14, 28, 42);
border: solid transparent 1px;
transition: 0.4s;
box-shadow: none;
}
.page-end-contact-section .contact-buttons .contact-button--dark_blue span {
color: #fff;
}
.page-end-contact-section .contact-buttons .contact-button--dark_blue:hover {
color: rgb(14, 28, 42);
background: #fff;
box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
}
.page-end-contact-section .contact-buttons .contact-button--dark_blue:hover svg {
fill: rgb(14, 28, 42);
color: rgb(14, 28, 42);
}
.page-end-contact-section .contact-buttons .contact-button--dark_blue:hover svg path {
fill: rgb(14, 28, 42);
}
.page-end-contact-section .contact-buttons .contact-button--dark_blue:hover span {
color: rgb(14, 28, 42);
}
.page-end-contact-section .contact-buttons .contact-button--transparent {
background: transparent;
border: solid rgba(255, 255, 255, 0.5) 1px;
transition: 0.4s;
box-shadow: none;
}
.page-end-contact-section .contact-buttons .contact-button--transparent span {
color: #fff;
}
.page-end-contact-section .contact-buttons .contact-button--transparent:hover {
color: rgb(14, 28, 42);
background: #fff;
box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
}
.page-end-contact-section .contact-buttons .contact-button--transparent:hover svg {
fill: rgb(14, 28, 42);
color: rgb(14, 28, 42);
}
.page-end-contact-section .contact-buttons .contact-button--transparent:hover svg path {
fill: rgb(14, 28, 42);
}
.page-end-contact-section .contact-buttons .contact-button--transparent:hover span {
color: rgb(14, 28, 42);
}
.page-end-contact-section .contact-buttons .contact-button span {
display: flex;
align-items: center;
justify-content: center;
}
@media (max-width: 767px) {
.page-end-contact-section h2 {
font-size: 2.25rem;
line-height: 120%;
}
.page-end-contact-section .text {
line-height: 2rem;
font-size: 1.25rem;
}
.page-end-contact-section .contact-buttons {
flex-direction: column;
}
.page-end-contact-section .contact-buttons .contact-button {
flex: 0 0 100%;
width: 100%;
}
}
.separator-page-end {
height: 4rem;
}
.page-end-contact-section-with-form {
padding: 4rem 0 4rem 0;
background: rgb(90, 147, 206);
background-repeat: no-repeat;
background-position: right;
background-attachment: fixed;
}
.page-end-contact-section-with-form .text {
margin-bottom: 4rem;
}
.page-end-contact-section-with-form .footer-mask-svg {
position: relative;
left: 0;
width: 100%;
z-index: 99;
top: calc(-4rem - 2px);
background: solid #fff 1px;
}
.page-end-contact-section-with-form .footer-mask-svg svg {
width: 100%;
height: auto;
display: block;
height: auto;
}
.page-end-contact-section-with-form h2 {
font-size: 3.75rem;
line-height: 120%;
margin-bottom: 0;
}
.page-end-contact-section-with-form .text {
max-width: 64rem;
margin-top: 1rem;
margin-bottom: 4rem;
font-size: 1.5rem;
font-weight: 400;
line-height: 2rem;
}
.page-end-contact-section-with-form .contact-wrap {
display: flex;
flex-direction: row;
gap: 1.5rem;
}
.page-end-contact-section-with-form .contact-wrap .col {
flex: 0 0 calc(50% - 0.75rem);
}
.page-end-contact-section-with-form .contact-wrap form label {
font-weight: 500;
margin-bottom: 0.5rem;
}
.page-end-contact-section-with-form .contact-wrap form input[type=text],
.page-end-contact-section-with-form .contact-wrap form input[type=tel],
.page-end-contact-section-with-form .contact-wrap form input[type=email],
.page-end-contact-section-with-form .contact-wrap form select {
width: 100%;
height: 2.5rem;
padding: 0.5rem 1rem;
border: none !important;
outline: none !important;
margin-top: 0.5rem;
}
.page-end-contact-section-with-form .contact-wrap form input[type=text]:hover,
.page-end-contact-section-with-form .contact-wrap form input[type=tel]:hover,
.page-end-contact-section-with-form .contact-wrap form input[type=email]:hover,
.page-end-contact-section-with-form .contact-wrap form select:hover {
outline: solid rgb(14, 48, 85) 1px !important;
}
.page-end-contact-section-with-form .contact-wrap form input[type=text]:active, .page-end-contact-section-with-form .contact-wrap form input[type=text]:focus, .page-end-contact-section-with-form .contact-wrap form input[type=text]:focus-within,
.page-end-contact-section-with-form .contact-wrap form input[type=tel]:active,
.page-end-contact-section-with-form .contact-wrap form input[type=tel]:focus,
.page-end-contact-section-with-form .contact-wrap form input[type=tel]:focus-within,
.page-end-contact-section-with-form .contact-wrap form input[type=email]:active,
.page-end-contact-section-with-form .contact-wrap form input[type=email]:focus,
.page-end-contact-section-with-form .contact-wrap form input[type=email]:focus-within,
.page-end-contact-section-with-form .contact-wrap form select:active,
.page-end-contact-section-with-form .contact-wrap form select:focus,
.page-end-contact-section-with-form .contact-wrap form select:focus-within {
outline: solid rgb(14, 48, 85) 2px !important;
}
.page-end-contact-section-with-form .contact-wrap form input[type=text].wpcf7-not-valid,
.page-end-contact-section-with-form .contact-wrap form input[type=tel].wpcf7-not-valid,
.page-end-contact-section-with-form .contact-wrap form input[type=email].wpcf7-not-valid,
.page-end-contact-section-with-form .contact-wrap form select.wpcf7-not-valid {
outline: solid rgb(158, 26, 0) 2px !important;
}
.page-end-contact-section-with-form .contact-wrap form input[type=text]::placeholder,
.page-end-contact-section-with-form .contact-wrap form input[type=tel]::placeholder,
.page-end-contact-section-with-form .contact-wrap form input[type=email]::placeholder,
.page-end-contact-section-with-form .contact-wrap form select::placeholder {
color: rgb(101, 109, 117);
}
.page-end-contact-section-with-form .contact-wrap form span.wpcf7-not-valid-tip {
background: rgb(197, 35, 3);
color: #fff;
font-size: 0.875rem;
min-height: 1.75rem;
display: flex !important;
align-items: center;
padding: 0.25rem 1rem;
margin-top: 0.5rem;
outline: solid rgb(197, 35, 3) 2px;
}
.page-end-contact-section-with-form .contact-wrap form select {
appearance: none;
background-image: url('data:image/svg+xml;utf8,');
background-repeat: no-repeat;
background-position: right 1rem center;
background-size: 16px;
padding-right: 3rem;
}
.page-end-contact-section-with-form .contact-wrap form select div {
margin: 0;
}
.page-end-contact-section-with-form .contact-wrap form p {
margin-top: 0;
margin-bottom: 1rem;
}
.page-end-contact-section-with-form .contact-wrap form .street-wrap p {
display: flex;
flex-direction: row;
flex-wrap: wrap;
column-gap: 1rem;
}
.page-end-contact-section-with-form .contact-wrap form .street-wrap p label:first-child {
flex: 1;
}
.page-end-contact-section-with-form .contact-wrap form .street-wrap p br {
display: none;
}
.page-end-contact-section-with-form .contact-wrap form .street-wrap p label:last-child {
flex: 0 0 12.5rem;
}
.page-end-contact-section-with-form .contact-wrap form .privacy-wrap br {
display: none;
}
.page-end-contact-section-with-form .contact-wrap form .privacy-wrap label {
display: block;
}
.page-end-contact-section-with-form .contact-wrap form .privacy-wrap label span {
display: block;
}
.page-end-contact-section-with-form .contact-wrap form .privacy-wrap .wpcf7-list-item {
margin-left: 0;
padding-left: 0.25rem;
}
.page-end-contact-section-with-form .contact-wrap form .privacy-wrap .wpcf7-list-item label {
display: flex;
flex-direction: row;
width: 100%;
align-items: center;
}
.page-end-contact-section-with-form .contact-wrap form .privacy-wrap input {
width: 1rem;
height: 1rem;
border: 2px solid #000;
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
background: transparent;
cursor: pointer;
margin: 0.25rem 0.75rem 0.25rem 0.25rem;
flex-shrink: 0;
position: relative;
}
.page-end-contact-section-with-form .contact-wrap form .privacy-wrap input:checked {
background: #000;
}
.page-end-contact-section-with-form .contact-wrap form .privacy-wrap input:checked::after {
content: "";
position: absolute;
top: 1px;
left: 4px;
width: 4px;
height: 8px;
border: solid rgb(90, 147, 206);
border-width: 0 2px 2px 0;
transform: rotate(45deg);
}
.page-end-contact-section-with-form .contact-wrap form .marketing-wrap br {
display: none;
}
.page-end-contact-section-with-form .contact-wrap form .marketing-wrap label {
display: block;
}
.page-end-contact-section-with-form .contact-wrap form .marketing-wrap label span {
display: block;
}
.page-end-contact-section-with-form .contact-wrap form .marketing-wrap .wpcf7-list-item {
margin-left: 0;
padding-left: 0.25rem;
}
.page-end-contact-section-with-form .contact-wrap form .marketing-wrap .wpcf7-list-item label {
display: flex;
flex-direction: row;
width: 100%;
}
.page-end-contact-section-with-form .contact-wrap form .marketing-wrap input {
width: 1rem;
height: 1rem;
border: 2px solid #000;
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
background: transparent;
cursor: pointer;
margin: 0.25rem 0.75rem 0.25rem 0.25rem;
flex-shrink: 0;
position: relative;
}
.page-end-contact-section-with-form .contact-wrap form .marketing-wrap input:checked {
background: #000;
}
.page-end-contact-section-with-form .contact-wrap form .marketing-wrap input:checked::after {
content: "";
position: absolute;
top: 1px;
left: 4px;
width: 4px;
height: 8px;
border: solid rgb(90, 147, 206);
border-width: 0 2px 2px 0;
transform: rotate(45deg);
}
.page-end-contact-section-with-form .contact-wrap form input[type=submit] {
background: rgb(14, 28, 42);
border: solid transparent 1px;
transition: 0.4s;
box-shadow: none;
padding: 0.75rem 1.5rem;
width: 100%;
cursor: pointer;
margin-top: 1.25rem;
line-height: 140%;
color: #fff;
font-size: 1.25rem;
}
.page-end-contact-section-with-form .contact-wrap form input[type=submit]:hover {
color: rgb(14, 28, 42);
background: #fff;
box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
}
.page-end-contact-section-with-form .contact-wrap form input[type=submit]:hover span {
color: rgb(14, 28, 42);
}
.page-end-contact-section-with-form .contact-wrap form .wpcf7-spinner {
display: none;
}
@media (max-width: 767px) {
.page-end-contact-section-with-form h2 {
font-size: 2.25rem;
line-height: 120%;
}
.page-end-contact-section-with-form .text {
line-height: 2rem;
font-size: 1.25rem;
margin-bottom: 0rem;
}
.page-end-contact-section-with-form .contact-wrap {
flex-direction: column;
}
.page-end-contact-section-with-form .street-wrap p {
flex-direction: column !important;
}
.page-end-contact-section-with-form .street-wrap p label:first-child {
margin-bottom: 0;
}
.page-end-contact-section-with-form .street-wrap p label:last-child {
flex: 1 !important;
margin-top: 1rem;
}
}
.contact-full-section {
padding: 4rem 0;
}
.contact-full-section .main-title {
margin-bottom: 2.5rem;
}
.contact-full-section .main-title h2 {
font-size: 3.75rem;
line-height: 120%;
}
.contact-full-section .search-bar select {
width: 100%;
height: 2.5rem;
padding: 0.5rem 1rem;
border: none !important;
outline: solid rgb(189, 195, 201) 1px;
margin-top: 0.5rem;
appearance: none;
background-image: url('data:image/svg+xml;utf8,');
background-repeat: no-repeat;
background-position: right 1rem center;
background-size: 16px;
padding-right: 3rem;
}
.contact-full-section .search-bar select:hover {
outline: solid rgb(14, 48, 85) 1px !important;
}
.contact-full-section .search-bar select:active, .contact-full-section .search-bar select:focus, .contact-full-section .search-bar select:focus-within {
outline: solid rgb(14, 48, 85) 2px !important;
}
.contact-full-section .search-bar select div {
margin: 0;
}
.contact-full-section .search-bar select::placeholder {
color: rgb(101, 109, 117);
}
.contact-full-section .search-bar .search-bar-inner {
display: flex;
flex-direction: row;
gap: 1rem;
}
.contact-full-section .search-bar .search-bar-inner .input-wrap {
flex: 1;
}
.contact-full-section .h3-gi {
margin-top: 2.5rem;
margin-bottom: 1.5rem;
}
.contact-full-section .general-inquiry {
display: flex;
flex-direction: row;
gap: 1.5rem;
flex-wrap: wrap;
}
.contact-full-section .general-inquiry .item {
flex: 0 0 20.75rem;
height: 100%;
padding: 2rem 1.5rem;
border-left: solid rgb(219, 223, 228) 1px;
display: flex;
flex-direction: column;
gap: 0.75rem;
}
.contact-full-section .general-inquiry .item a {
color: rgb(14, 81, 151);
line-height: 1.5rem;
text-decoration-color: #fff;
display: inline-flex;
flex-direction: row;
align-items: center;
gap: 0.5rem;
}
.contact-full-section .h3-dc {
margin-top: 2.5rem;
margin-bottom: 1.5rem;
}
.contact-full-section .direct-contact {
display: flex;
flex-direction: row;
gap: 1.5rem;
flex-wrap: wrap;
}
.contact-full-section .direct-contact .item {
flex: 0 0 20.87rem;
height: 100%;
padding: 2rem 1.5rem;
border-left: solid rgb(219, 223, 228) 1px;
display: flex;
flex-direction: column;
}
.contact-full-section .direct-contact .item .name {
font-size: 1.5rem;
line-height: 140%;
font-weight: 500;
margin-bottom: 0.25rem;
}
.contact-full-section .direct-contact .item .job-title {
font-size: 0.75rem;
line-height: 1rem;
}
.contact-full-section .direct-contact .item .location-wrap {
margin: 0.5rem 0 0.25rem 0;
display: flex;
flex-direction: row;
gap: 1rem;
}
.contact-full-section .direct-contact .item .location-wrap .country {
width: 1.5rem;
height: 1.5rem;
}
.contact-full-section .direct-contact .item .location-wrap .country img {
display: block;
height: 100%;
width: 1.5rem;
height: 1.5rem;
}
.contact-full-section .direct-contact .item .location-wrap .location {
display: flex;
flex-direction: row;
align-items: center;
color: rgb(101, 109, 117);
}
.contact-full-section .direct-contact .item .location-wrap .location img {
display: inline-block;
width: 1.5rem;
height: 1.5rem;
margin-right: 0.5rem;
}
.contact-full-section .direct-contact .item a {
color: rgb(14, 81, 151);
line-height: 1.5rem;
text-decoration-color: #fff;
display: inline-flex;
flex-direction: row;
align-items: center;
gap: 0.5rem;
margin-top: 0.75rem;
}
.contact-full-section .h3-dar {
margin-top: 2.5rem;
margin-bottom: 1.5rem;
}
.contact-full-section .data-access {
display: flex;
flex-direction: row;
gap: 1.5rem;
flex-wrap: wrap;
}
.contact-full-section .data-access .item {
flex: 0 0 21rem;
height: 100%;
padding: 2rem 1.5rem;
border-left: solid rgb(219, 223, 228) 1px;
display: flex;
flex-direction: column;
gap: 1rem;
}
.contact-full-section .data-access .item a {
color: rgb(14, 81, 151);
line-height: 1.5rem;
text-decoration-color: #fff;
display: inline-flex;
flex-direction: row;
align-items: center;
gap: 0.5rem;
}
.contact-full-section .data-access .item span {
font-size: 0.75rem;
line-height: 1rem;
}
@media (max-width: 767px) {
.contact-full-section .main-title h2 {
font-size: 2.25rem;
line-height: 120%;
}
.contact-full-section .search-bar .search-bar-inner {
flex-direction: column;
}
.contact-full-section h3 {
font-size: 1.25rem !important;
}
.contact-full-section .item {
padding: 1rem 0 !important;
border-left: none !important;
border-bottom: solid rgb(219, 223, 228) 1px;
flex: 1 !important;
}
.contact-full-section .item .name {
font-size: 1.25rem !important;
}
}
.testimonials-section {
padding: 4rem 0;
}
.testimonials-section .single-testimonial {
padding: 2.5rem 0;
border-bottom: solid #DBDFE4 1px;
}
.testimonials-section .single-testimonial .row {
display: flex;
gap: 2.5rem;
flex-direction: row-reverse;
}
.testimonials-section .single-testimonial .row .col-text,
.testimonials-section .single-testimonial .row .col {
flex: 0 0 calc(50% - 1.25rem);
}
.testimonials-section .single-testimonial .row .col-text h2,
.testimonials-section .single-testimonial .row .col h2 {
font-size: 2.25rem;
margin-bottom: 1rem;
}
.testimonials-section .single-testimonial .row .col-text .text,
.testimonials-section .single-testimonial .row .col .text {
font-size: 1.125rem;
color: #0E1C2A;
line-height: 1.75rem;
}
.testimonials-section .single-testimonial .row .col-text img,
.testimonials-section .single-testimonial .row .col img {
height: 24rem;
width: 100%;
display: block;
object-fit: cover;
}
.testimonials-section .single-testimonial .row .col-text iframe,
.testimonials-section .single-testimonial .row .col iframe {
height: 24rem;
width: 100%;
display: block;
object-fit: cover;
}
.testimonials-section .single-testimonial .row .col-text a,
.testimonials-section .single-testimonial .row .col a {
text-decoration: none;
color: #0E5197;
transition: 0.3s;
}
.testimonials-section .single-testimonial .row .col-text a:hover,
.testimonials-section .single-testimonial .row .col a:hover {
color: rgb(9.6727272727, 55.9636363636, 104.3272727273);
}
.testimonials-section .single-testimonial .row .col-text ul,
.testimonials-section .single-testimonial .row .col ul {
padding-left: 0;
margin-bottom: 0;
}
.testimonials-section .single-testimonial .row .col-text ul li,
.testimonials-section .single-testimonial .row .col ul li {
margin-bottom: 1.5rem;
list-style: none;
padding-left: 2.5rem;
position: relative;
font-size: 1.125rem;
line-height: 1.75rem;
}
.testimonials-section .single-testimonial .row .col-text ul li:last-child,
.testimonials-section .single-testimonial .row .col ul li:last-child {
margin-bottom: 0;
}
.testimonials-section .single-testimonial .row .col-text ul li::before,
.testimonials-section .single-testimonial .row .col ul li::before {
content: "";
position: absolute;
left: 0.25rem;
top: 0.2rem;
width: 1.25rem;
height: 1.25rem;
background-image: url("/wp-content/themes/telecom-ip-theme/images/list-checkmark.svg");
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.testimonials-section .single-testimonial.text-on-left .row {
flex-direction: row;
}
@media (max-width: 767px) {
.testimonials-section .single-testimonial .row {
flex-direction: column;
}
.testimonials-section .single-testimonial .row h2 {
font-size: 1.875rem !important;
margin-bottom: 1rem;
line-height: 120%;
}
.testimonials-section .single-testimonial .row .text {
font-size: 1rem;
color: #0E1C2A;
line-height: 1.75rem;
}
.testimonials-section .single-testimonial .row img {
height: 12rem;
width: 100%;
display: block;
object-fit: cover;
}
.testimonials-section .single-testimonial .row iframe {
height: 24rem;
width: 100%;
display: block;
object-fit: cover;
}
.testimonials-section .single-testimonial .row a {
text-decoration: none;
color: #0E5197;
transition: 0.3s;
}
.testimonials-section .single-testimonial .row a:hover {
color: rgb(9.6727272727, 55.9636363636, 104.3272727273);
}
.testimonials-section .single-testimonial .row ul {
font-size: 1rem;
}
.testimonials-section .single-testimonial .row ul li {
font-size: 1rem;
}
.testimonials-section .single-testimonial.text-on-left .row {
flex-direction: column-reverse;
}
}
.article-about-us-section {
margin-top: 4rem;
margin-bottom: 4rem;
}
.article-about-us-section .mini-heading {
text-transform: uppercase;
}
.article-about-us-section .heading {
font-size: 3.75rem;
line-height: 120%;
margin-bottom: 0;
}
.article-about-us-section .links-wrapper {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
gap: 1.5rem;
margin-top: 0.5rem;
overflow-x: auto;
overflow-y: hidden;
-ms-overflow-style: none;
scrollbar-width: none;
}
.article-about-us-section .links-wrapper a {
text-decoration-color: #fff;
transition: 0.5s;
font-size: 0.875rem;
color: #0e5197;
flex-shrink: 0;
}
.article-about-us-section .links-wrapper a:hover {
color: rgb(0, 39, 80);
}
.article-about-us-section .links-wrapper::-webkit-scrollbar {
display: none;
}
.article-about-us-section .text-wrapper {
max-width: 1024px;
margin-top: 1rem;
margin-bottom: 3.5rem;
font-size: 1.5rem;
font-weight: 400;
line-height: 2rem;
}
.article-about-us-section .highlight-section {
margin-bottom: 2.5rem;
display: flex;
flex-direction: row;
gap: 2.5rem;
}
.article-about-us-section .highlight-section .highlight {
flex: 0 0 calc(50% - 1.25rem);
display: flex;
flex-direction: column;
}
.article-about-us-section .highlight-section .highlight .image-wrap img {
display: block;
width: 100%;
height: auto;
object-fit: cover;
aspect-ratio: 16/9;
}
.article-about-us-section .highlight-section .highlight .content-wrap {
padding: 1rem 1.5rem;
border-top: solid rgb(219, 223, 228) 1px;
border-bottom: solid rgb(219, 223, 228) 1px;
display: flex;
flex-direction: column;
flex: 1;
}
.article-about-us-section .highlight-section .highlight .content-wrap h3 {
color: rgb(14, 28, 42);
font-size: 1.5rem;
line-height: 140%;
margin-bottom: 0.25rem;
}
.article-about-us-section .highlight-section .highlight .content-wrap .job-title {
color: rgb(101, 109, 117);
font-size: 0.875rem;
margin-bottom: 1rem;
text-transform: uppercase;
}
.article-about-us-section .highlight-section .highlight .content-wrap .links {
display: flex;
flex-direction: row;
gap: 1rem;
}
.article-about-us-section .highlight-section .highlight .content-wrap .links a {
display: flex;
padding: 0.5rem;
flex: 0 0 auto;
border: solid rgb(189, 195, 201) 1px;
transition: 0.3s;
}
.article-about-us-section .highlight-section .highlight .content-wrap .links a:hover {
transform: scale(1.1);
}
.article-about-us-section .highlight-section .highlight .content-wrap .links a img {
width: 1.5rem;
height: 1.5rem;
}
.article-about-us-section .highlight-section .description {
flex: 0 0 calc(50% - 1.25rem);
background: rgb(239, 242, 245);
font-size: 1.125rem;
color: rgb(14, 28, 42);
padding: 2.5rem;
line-height: 1.75rem;
font-weight: 400;
}
.article-about-us-section .highlight-section .description p {
margin-bottom: 0.5rem;
}
.article-about-us-section .contact-elements {
display: flex;
flex-direction: row;
gap: 1.5rem;
flex-wrap: wrap;
}
.article-about-us-section .contact-elements .item {
flex: 0 0 20.75rem;
height: 100%;
padding: 2rem 1.5rem;
border-left: solid rgb(219, 223, 228) 1px;
display: flex;
flex-direction: column;
}
.article-about-us-section .contact-elements .item a {
color: rgb(14, 81, 151);
line-height: 1.5rem;
text-decoration-color: #fff;
display: inline-flex;
flex-direction: row;
align-items: center;
gap: 0.5rem;
margin-top: 1rem;
}
.article-about-us-section .contact-elements .item .name {
font-size: 1.5rem;
margin-bottom: 0.5rem;
line-height: 140%;
font-weight: 500;
}
.article-about-us-section .contact-elements .location-wrap {
color: #656D75;
}
.article-about-us-section .contact-elements .location-wrap img {
display: inline-block;
width: 1.5rem;
height: 1.5rem;
}
.article-about-us-section .contact-elements .location-wrap .country {
display: flex;
flex-direction: row;
align-items: center;
gap: 0.5rem;
}
.article-about-us-section .h3-contact {
margin-top: 2.5rem;
margin-bottom: 1.5rem;
}
@media (max-width: 767px) {
.article-about-us-section .heading {
font-size: 2.25rem;
}
.article-about-us-section .links-wrapper {
gap: 1.5rem;
}
.article-about-us-section .text-wrapper {
font-size: 1.25rem;
margin-bottom: 2.5rem;
}
.article-about-us-section .highlight-section {
flex-direction: column;
}
.article-about-us-section .highlight-section .description {
font-size: 1rem;
}
.article-about-us-section h3 {
font-size: 1.25rem !important;
}
.article-about-us-section .contact-elements {
flex-direction: column;
}
.article-about-us-section .contact-elements .item {
padding: 1rem 0;
border-left: none;
border-bottom: solid rgb(219, 223, 228) 1px;
flex: 1;
}
.article-about-us-section .contact-elements .item .name {
font-size: 1.25rem;
}
}
.article-heading-text-section {
margin-top: 4rem;
margin-bottom: 4rem;
}
.article-heading-text-section .mini-heading {
text-transform: uppercase;
}
.article-heading-text-section .heading {
font-size: 3.75rem;
line-height: 120%;
margin-bottom: 0;
}
.article-heading-text-section .links-wrapper {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
gap: 1.5rem;
margin-top: 0.5rem;
overflow-x: auto;
overflow-y: hidden;
-ms-overflow-style: none;
scrollbar-width: none;
}
.article-heading-text-section .links-wrapper a {
text-decoration-color: #fff;
transition: 0.5s;
font-size: 0.875rem;
color: #0e5197;
flex-shrink: 0;
}
.article-heading-text-section .links-wrapper a:hover {
color: rgb(0, 39, 80);
}
.article-heading-text-section .links-wrapper::-webkit-scrollbar {
display: none;
}
.article-heading-text-section .text-wrapper {
max-width: 1024px;
margin-top: 1rem;
margin-bottom: 3.5rem;
font-size: 1.5rem;
font-weight: 400;
line-height: 2rem;
}
.article-heading-text-section .text-wrapper a:hover {
color: #0e5197;
transition: 0.3s;
}
.article-heading-text-section .text-wrapper h2 {
margin-top: 4rem;
}
.article-heading-text-section .text-wrapper ul {
padding-left: 0;
margin-top: 1.25rem;
margin-bottom: 1.25rem;
}
.article-heading-text-section .text-wrapper ul li {
margin-bottom: 0.5rem;
list-style: none;
padding-left: 2rem;
position: relative;
font-size: 1.5rem;
line-height: 1.75rem;
}
.article-heading-text-section .text-wrapper ul li:last-child {
margin-bottom: 0;
}
.article-heading-text-section .text-wrapper ul li::before {
content: "";
position: absolute;
left: 0.5rem;
top: 13px;
width: 0.35rem;
height: 0.35rem;
background-image: url("/wp-content/themes/telecom-ip-theme/images/list-dot-blue.svg");
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
@media (max-width: 767px) {
.article-heading-text-section {
margin-bottom: 2.5rem;
}
.article-heading-text-section .heading {
font-size: 2.25rem;
}
.article-heading-text-section .links-wrapper {
gap: 1.5rem;
}
.article-heading-text-section .text-wrapper {
font-size: 1.25rem;
margin-bottom: 2.5rem;
}
.article-heading-text-section .text-wrapper ul {
font-size: 1.25rem;
}
.article-heading-text-section .text-wrapper ul li {
font-size: 1.25rem;
}
.article-heading-text-section .text-wrapper ul li::before {
width: 0.25rem;
height: 0.25rem;
top: 14px;
}
}
.article-three-columns-three-icons-section {
margin-top: 4rem;
margin-bottom: 4rem;
}
.article-three-columns-three-icons-section .container .cols-wrap {
display: flex;
flex-direction: row;
flex-wrap: wrap;
gap: 2.5rem;
}
.article-three-columns-three-icons-section .container .cols-wrap .column {
flex: 1;
padding: 1rem 2.5rem;
border-left: solid #73B3F4 1px;
}
.article-three-columns-three-icons-section .container .cols-wrap .column img {
display: block;
height: 6rem;
width: 6rem;
}
.article-three-columns-three-icons-section .container .cols-wrap .column h3 {
font-size: 1.5rem;
line-height: 140%;
margin-top: 1rem;
margin-bottom: 1rem;
}
@media (max-width: 767px) {
.article-three-columns-three-icons-section {
margin-top: 2.5rem;
}
.article-three-columns-three-icons-section .container .cols-wrap {
flex-direction: column;
}
.article-three-columns-three-icons-section .container .cols-wrap .column {
border-left: none;
border-bottom: solid #73B3F4 1px;
padding: 1rem 0;
}
.article-three-columns-three-icons-section .container .cols-wrap .column p {
margin: 0;
}
.article-three-columns-three-icons-section .container .cols-wrap .column h3 {
font-size: 1.25rem;
}
}
.article-image-list-section {
padding-top: 4rem;
padding-bottom: 4rem;
}
.article-image-list-section img {
aspect-ratio: 1/1;
width: 100%;
display: block;
object-fit: cover;
}
@media (min-width: 768px) {
.article-image-list-section.il-image-on-left .wrapper {
flex-direction: row-reverse !important;
}
}
.article-image-list-section .wrapper {
display: flex;
flex-direction: row;
gap: 2.5rem;
}
.article-image-list-section .wrapper .col-list,
.article-image-list-section .wrapper .col-image {
flex: 1;
}
.article-image-list-section .wrapper .text-content {
margin-bottom: 4rem;
}
.article-image-list-section .wrapper .col-list h2 {
font-size: 3.75rem;
line-height: 120%;
margin-bottom: 4rem;
}
.article-image-list-section .wrapper .col-list ul {
padding-left: 0;
margin-bottom: 0;
}
.article-image-list-section .wrapper .col-list ul li {
margin-bottom: 1.5rem;
list-style: none;
padding-left: 2.5rem;
position: relative;
font-size: 1.125rem;
line-height: 1.75rem;
}
.article-image-list-section .wrapper .col-list ul li:last-child {
margin-bottom: 0;
}
.article-image-list-section .wrapper .col-list ul li::before {
content: "";
position: absolute;
left: 0.25rem;
top: 0.2rem;
width: 1.25rem;
height: 1.25rem;
background-image: url("/wp-content/themes/telecom-ip-theme/images/list-checkmark.svg");
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
@media (max-width: 767px) {
.article-image-list-section .wrapper {
flex-direction: column-reverse;
}
.article-image-list-section .wrapper .col-list h2 {
font-size: 2.25rem;
line-height: 120%;
margin-bottom: 2.5rem;
}
.article-image-list-section .wrapper .col-list ul {
font-size: 1rem;
}
.article-image-list-section .wrapper .col-list ul li {
font-size: 1rem;
}
}
.article-image-text-section {
padding-top: 4rem;
padding-bottom: 4rem;
}
@media (min-width: 768px) {
.article-image-text-section.it-image-on-left .wrapper {
flex-direction: row-reverse !important;
}
}
.article-image-text-section .col-image img {
aspect-ratio: 1/1;
width: 100%;
display: block;
object-fit: cover;
}
.article-image-text-section .wrapper {
display: flex;
flex-direction: row;
gap: 2.5rem;
}
.article-image-text-section .wrapper .col-text,
.article-image-text-section .wrapper .col-image {
flex: 1;
}
.article-image-text-section .wrapper .mini-heading {
text-transform: uppercase;
}
.article-image-text-section .wrapper .col-text h2 {
font-size: 3.75rem;
line-height: 120%;
margin-bottom: 4rem;
}
.article-image-text-section .wrapper .col-text a:hover {
color: #0e5197;
transition: 0.3s;
}
.article-image-text-section .wrapper .col-text ul {
padding-left: 0;
margin-top: 1.25rem;
margin-bottom: 1.25rem;
}
.article-image-text-section .wrapper .col-text ul li {
margin-bottom: 0.5rem;
list-style: none;
padding-left: 2rem;
position: relative;
font-size: 1.125rem;
line-height: 1.75rem;
}
.article-image-text-section .wrapper .col-text ul li:last-child {
margin-bottom: 0;
}
.article-image-text-section .wrapper .col-text ul li::before {
content: "";
position: absolute;
left: 0.5rem;
top: 11px;
width: 0.35rem;
height: 0.35rem;
background-image: url("/wp-content/themes/telecom-ip-theme/images/list-dot-blue.svg");
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.article-image-text-section .wrapper .col-text ol {
padding-left: 0;
margin-top: 1.25rem;
margin-bottom: 1.25rem;
}
.article-image-text-section .wrapper .col-text ol li {
margin-bottom: 0.5rem;
padding-left: 1rem;
position: relative;
font-size: 1.125rem;
line-height: 1.75rem;
margin-left: 1rem;
}
.article-image-text-section .wrapper .col-text ol li:last-child {
margin-bottom: 0;
}
.article-image-text-section .wrapper .col-text ol li::marker {
color: #0e5197;
}
@media (max-width: 767px) {
.article-image-text-section .wrapper {
flex-direction: column-reverse;
}
.article-image-text-section .wrapper .col-text h2 {
font-size: 2.25rem;
line-height: 120%;
margin-bottom: 2.5rem;
}
.article-image-text-section .wrapper .col-text ul li::before {
width: 0.25rem;
height: 0.25rem;
}
}
.article-video-text-section {
padding-top: 4rem;
padding-bottom: 4rem;
}
@media (min-width: 768px) {
.article-video-text-section.it-video-on-left .wrapper {
flex-direction: row-reverse !important;
}
}
.article-video-text-section img {
aspect-ratio: 1/1;
width: 100%;
display: block;
object-fit: cover;
}
.article-video-text-section .wrapper {
display: flex;
flex-direction: row;
gap: 2.5rem;
}
.article-video-text-section .wrapper .col-text,
.article-video-text-section .wrapper .col-image {
flex: 1;
}
.article-video-text-section .wrapper .col-video {
flex: 1;
}
.article-video-text-section .wrapper .col-video iframe {
height: 24rem;
width: 100%;
}
.article-video-text-section .wrapper .col-text h2 {
font-size: 3.75rem;
line-height: 120%;
margin-bottom: 4rem;
}
.article-video-text-section .wrapper .col-text ul {
padding-left: 0;
margin-top: 1.25rem;
margin-bottom: 1.25rem;
}
.article-video-text-section .wrapper .col-text ul li {
margin-bottom: 0.5rem;
list-style: none;
padding-left: 2rem;
position: relative;
font-size: 1.125rem;
line-height: 1.75rem;
}
.article-video-text-section .wrapper .col-text ul li:last-child {
margin-bottom: 0;
}
.article-video-text-section .wrapper .col-text ul li::before {
content: "";
position: absolute;
left: 0.5rem;
top: 11px;
width: 0.35rem;
height: 0.35rem;
background-image: url("/wp-content/themes/telecom-ip-theme/images/list-dot-blue.svg");
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
@media (max-width: 767px) {
.article-video-text-section .wrapper {
flex-direction: column-reverse;
}
.article-video-text-section .wrapper .col-video iframe {
height: 12.5rem;
}
.article-video-text-section .wrapper .col-text h2 {
font-size: 2.25rem;
line-height: 120%;
margin-bottom: 2.5rem;
}
.article-video-text-section .wrapper .col-text ul li::before {
width: 0.25rem;
height: 0.25rem;
}
}
.article-faq-image-section {
padding-top: 4rem;
padding-bottom: 4rem;
}
.article-faq-image-section .faq-wrapper {
display: flex;
flex-direction: column;
border-top: solid rgb(219, 223, 228) 1px;
flex: 0 0 calc(50% - 1.25rem);
}
.article-faq-image-section .faq-wrapper .faq-item .faq-question {
display: flex;
flex-direction: row;
gap: 1rem;
font-size: 1.125rem;
padding: 0.75rem 0.5rem;
border-bottom: solid rgb(219, 223, 228) 1px;
cursor: pointer;
line-height: 1.75rem;
}
.article-faq-image-section .faq-wrapper .faq-item .faq-question img {
width: 0.75rem;
}
.article-faq-image-section .faq-wrapper .faq-item .faq-answer {
overflow: hidden;
height: 0;
transition: height 0.3s ease-in-out;
}
.article-faq-image-section .img-wrapper {
flex: 1;
}
.article-faq-image-section .img-wrapper img {
display: block;
width: 100%;
aspect-ratio: 1/1;
}
.article-faq-image-section .faq-outer {
font-size: 1.125rem;
line-height: 1.75rem;
flex: 1;
}
.article-faq-image-section .faq-outer h2 {
font-size: 3.75rem;
line-height: 120%;
margin-bottom: 4rem;
}
.article-faq-image-section .faq-outer .faq-content {
border-bottom: solid rgb(219, 223, 228) 1px;
}
.article-faq-image-section .faq-outer .faq-content ul {
padding-left: 0;
}
.article-faq-image-section .faq-outer .faq-content ul li {
margin-bottom: 1.5rem;
list-style: none;
padding-left: 2.5rem;
position: relative;
font-size: 1.125rem;
line-height: 1.75rem;
}
.article-faq-image-section .faq-outer .faq-content ul li:last-child {
margin-bottom: 0;
}
.article-faq-image-section .faq-outer .faq-content ul li::before {
content: "";
position: absolute;
left: 0.67rem;
top: 10px;
width: 0.5rem;
height: 0.5rem;
background-image: url("/wp-content/themes/telecom-ip-theme/images/list-dot.svg");
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.article-faq-image-section .wrap {
display: flex;
flex-direction: row;
gap: 2.5rem;
}
@media (max-width: 767px) {
.article-faq-image-section .faq-wrapper .faq-item .faq-question {
font-size: 1rem;
}
.article-faq-image-section .faq-wrapper .faq-item .faq-content {
font-size: 1rem;
}
.article-faq-image-section .wrap {
flex-direction: column-reverse;
}
.article-faq-image-section .wrap h2 {
font-size: 2.25rem;
line-height: 120%;
margin-bottom: 2.5rem;
}
.article-faq-image-section .wrap ul {
font-size: 1rem;
}
.article-faq-image-section .wrap ul li {
font-size: 1rem;
}
}
.article-esg-section {
background: linear-gradient(180deg, #EFF2F5 0%, #EAF4FF 99.98%);
}
.article-esg-section .article-esg-section-bg {
background-image: url("/wp-content/themes/telecom-ip-theme/images/content-background-squares.svg");
background-attachment: fixed;
padding: 4rem 0;
margin-top: 4rem;
background-repeat: no-repeat;
background-position: top;
background-attachment: fixed;
}
.article-esg-section h2 {
font-size: 3.75rem;
line-height: 120%;
margin-bottom: 4rem;
}
.article-esg-section .cols-wrap {
display: flex;
flex-direction: row;
flex-wrap: wrap;
gap: 2.5rem;
margin-bottom: 4rem;
}
.article-esg-section .cols-wrap .column {
flex: 1;
padding: 1rem 2.5rem;
border-left: solid #73B3F4 1px;
}
.article-esg-section .cols-wrap .column img {
display: block;
height: 6rem;
width: 6rem;
}
.article-esg-section .cols-wrap .column h3 {
font-size: 1.5rem;
line-height: 140%;
margin-top: 1rem;
margin-bottom: 1rem;
}
.article-esg-section .blue-bg {
padding: 2.5rem;
background: #CEE4FB;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
.article-esg-section .blue-bg ul {
padding-left: 0;
margin-top: 0.5rem;
margin-bottom: 0.5rem;
}
.article-esg-section .blue-bg ul li {
margin-bottom: 0.5rem;
list-style: none;
padding-left: 2.5rem;
position: relative;
font-size: 1.125rem;
line-height: 1.75rem;
}
.article-esg-section .blue-bg ul li:last-child {
margin-bottom: 0;
}
.article-esg-section .blue-bg ul li::before {
content: "";
position: absolute;
left: 0.5rem;
top: 11px;
width: 0.5rem;
height: 0.5rem;
background-image: url("/wp-content/themes/telecom-ip-theme/images/list-dot.svg");
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.article-esg-section .blue-bg .right {
flex: 0 0 13rem;
}
.article-esg-section .blue-bg .right img {
width: 13rem;
height: 13rem;
display: block;
}
.article-esg-section .blue-bg h3 {
color: #0E1C2A;
font-size: 1.5rem;
line-height: 140%;
margin-bottom: 2.5rem;
}
.article-esg-section .blue-bg .text-content {
font-size: 1.125rem;
line-height: 1.75rem;
}
.article-esg-section .text-cols-wrap {
margin-top: 4rem;
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
.article-esg-section .text-cols-wrap .column {
flex: 1;
padding: 0rem 2.5rem;
border-left: solid #73B3F4 1px;
color: #0E1C2A;
}
.article-esg-section .text-cols-wrap .column h4 {
font-size: 1.125rem;
line-height: 1.75rem;
}
.article-esg-section .text-cols-wrap .column ul {
padding-left: 0;
margin-top: 0.5rem;
margin-bottom: 0.5rem;
}
.article-esg-section .text-cols-wrap .column ul li {
margin-bottom: 0.5rem;
list-style: none;
padding-left: 2.5rem;
position: relative;
font-size: 1rem;
}
.article-esg-section .text-cols-wrap .column ul li:last-child {
margin-bottom: 0;
}
.article-esg-section .text-cols-wrap .column ul li::before {
content: "";
position: absolute;
left: 0.5rem;
top: 10px;
width: 0.5rem;
height: 0.5rem;
background-image: url("/wp-content/themes/telecom-ip-theme/images/list-dot.svg");
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.article-esg-section .text-cols-wrap .column .column-inner {
padding: 1rem 0;
border-bottom: solid #DBDFE4 1px;
}
.article-esg-section .hide-desktop {
display: none !important;
}
@media (max-width: 767px) {
.article-esg-section .hide-mobile {
display: none !important;
}
.article-esg-section .hide-desktop {
display: block !important;
}
.article-esg-section .container {
display: flex;
flex-direction: column;
}
.article-esg-section .blue-bg {
order: 3;
}
.article-esg-section .text-cols-wrap {
display: flex;
flex-direction: column;
margin-top: 0;
}
.article-esg-section .text-cols-wrap .column {
padding: 0;
border: none !important;
padding-top: 2.5rem;
}
.article-esg-section .text-cols-wrap .column:first-child {
padding-top: 0;
}
.article-esg-section .text-cols-wrap .column .column-inner:last-child {
border: none;
}
.article-esg-section .text-cols-wrap .column-letter {
border-left: none;
border-bottom: solid #73B3F4 1px;
padding: 1rem 0;
}
.article-esg-section .text-cols-wrap .column-letter img {
margin-bottom: 1rem;
}
.article-esg-section .text-cols-wrap .column-letter p {
margin: 0;
}
.article-esg-section .text-cols-wrap .column-letter h3 {
font-size: 1.25rem;
}
.article-esg-section h2 {
font-size: 2.25rem;
margin-bottom: 2.75rem;
}
.article-esg-section .cols-wrap {
flex-direction: column;
}
}
.article-clv-section {
margin-top: 4rem;
}
.article-clv-section .content-wrap {
display: flex;
flex-direction: row;
flex-wrap: wrap;
gap: 2.5rem;
}
.article-clv-section .content-wrap .col-text {
font-size: 1.125rem;
line-height: 1.75rem;
flex: 1;
}
.article-clv-section .content-wrap .col-text p {
margin: 1.5rem 0 0 0;
}
.article-clv-section .content-wrap .col-text .list-content {
margin-top: 2rem;
display: flex;
flex-direction: column;
flex: 1;
}
.article-clv-section .content-wrap .col-text .list-element {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
gap: 1rem;
align-items: center;
padding: 0.5rem 0;
border-top: solid #DBDFE4 1px;
}
.article-clv-section .content-wrap .col-text .list-element:last-child {
border-bottom: solid #d8dfe4 1px;
}
.article-clv-section .content-wrap .col-text .list-element .icon {
padding: 0.5rem;
display: flex;
align-items: center;
}
.article-clv-section .content-wrap .col-text .list-element .icon img {
width: 2rem;
height: 2rem;
}
.article-clv-section .content-wrap .col-text p:first-child {
margin-top: 0;
}
.article-clv-section .content-wrap .col-video {
flex: 1;
}
.article-clv-section .content-wrap .col-video iframe {
height: 24rem;
width: 100%;
}
@media (max-width: 767px) {
.article-clv-section {
margin-top: 2.5rem;
}
.article-clv-section .content-wrap {
flex-direction: column;
}
.article-clv-section .content-wrap .col-video iframe {
height: 12.5rem;
}
.article-clv-section .content-wrap .col-text {
font-size: 1rem;
}
}
.article-chat-section {
background: linear-gradient(180deg, #EFF2F5 0%, #EAF4FF 99.98%);
}
.article-chat-section .article-chat-section-bg {
background-image: url("/wp-content/themes/telecom-ip-theme/images/content-background-squares.svg");
background-attachment: fixed;
padding: 4rem 0;
margin-top: 4rem;
background-repeat: no-repeat;
background-position: top;
background-attachment: fixed;
}
.article-chat-section .heading-wrap {
margin-bottom: 6.5rem;
}
.article-chat-section .heading-wrap h2 {
font-size: 3.75rem;
line-height: 120%;
margin-bottom: 1rem;
}
.article-chat-section .heading-wrap .text {
font-size: 1.5rem;
line-height: 2rem;
margin-bottom: 0;
}
.article-chat-section .chat-wrap {
display: flex;
flex-direction: column;
margin: 0 auto;
position: relative;
}
.article-chat-section .chat-wrap::before {
content: "";
position: absolute;
left: 50%;
top: 4rem;
bottom: 4rem;
width: 1px;
background-color: #73B3F4;
transform: translateX(-50%);
z-index: 0;
}
.article-chat-section .chat-wrap .avatar-wrap {
width: 4rem;
height: 4rem;
border-radius: 100%;
display: inline-flex;
align-items: center;
justify-content: center;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
z-index: 2;
}
.article-chat-section .chat-wrap .avatar-wrap svg,
.article-chat-section .chat-wrap .avatar-wrap img {
display: inline-flex;
width: 2.5rem;
height: 2.5rem;
}
.article-chat-section .chat-wrap .tip-avatar {
background: #1F69B2;
}
.article-chat-section .chat-wrap .user-avatar {
background: #0E1C2A;
}
.article-chat-section .chat-wrap .chat-element {
display: flex;
flex-direction: row;
position: relative;
width: 100%;
min-height: 4rem;
align-items: center;
}
.article-chat-section .chat-wrap .chat-element.tip-message {
justify-content: flex-start;
}
.article-chat-section .chat-wrap .chat-element.tip-message .chat-message {
width: calc(50% - 4rem);
margin-left: auto;
margin-right: 0;
color: #fff;
background: #1F69B2;
padding: 1.5rem;
position: relative;
}
.article-chat-section .chat-wrap .chat-element.tip-message .chat-message::after {
content: "";
position: absolute;
top: 50%;
left: -16px;
transform: translateY(-50%);
width: 0;
height: 0;
border-top: 12px solid transparent;
border-bottom: 12px solid transparent;
border-right: 16px solid #1F69B2;
}
.article-chat-section .chat-wrap .chat-element.user-message {
justify-content: flex-end;
}
.article-chat-section .chat-wrap .chat-element.user-message .chat-message {
width: calc(50% - 4rem);
margin-right: auto;
margin-left: 0;
color: #fff;
background: #0E1C2A;
padding: 1.5rem;
position: relative;
}
.article-chat-section .chat-wrap .chat-element.user-message .chat-message::after {
content: "";
position: absolute;
top: 50%;
right: -16px;
transform: translateY(-50%);
width: 0;
height: 0;
border-top: 12px solid transparent;
border-bottom: 12px solid transparent;
border-left: 16px solid #0E1C2A;
}
.article-chat-section .chat-wrap .chat-element.user-message .chat-message .message-heading {
color: #fff;
}
.article-chat-section .chat-wrap .chat-message {
flex: 0 0 auto;
display: flex;
flex-direction: column;
}
.article-chat-section .chat-wrap .chat-message .message-heading {
font-size: 1.25rem;
line-height: 140%;
margin: 0;
}
.article-chat-section .chat-wrap .chat-message .message-content {
margin: 0.5rem 0;
}
.article-chat-section .chat-wrap .chat-message .message-content p {
margin: 0;
}
.article-chat-section .container-youtube {
display: flex;
flex-direction: row;
gap: 2.5rem;
margin-top: 5rem;
padding-top: 1.5rem;
border-top: solid #DBDFE4 1px;
padding-bottom: 1.5rem;
border-bottom: solid #DBDFE4 1px;
}
.article-chat-section .container-youtube h2 {
font-size: 2.5rem;
line-height: 120%;
margin-bottom: 1rem;
}
.article-chat-section .container-youtube .text {
font-size: 1.125rem;
line-height: 1.75rem;
}
.article-chat-section .container-youtube .col-text {
flex: 1;
}
.article-chat-section .container-youtube .col-video {
flex: 1;
}
.article-chat-section .container-youtube .col-video iframe {
width: 100%;
height: 23rem;
}
@media (max-width: 767px) {
.article-chat-section .heading-wrap {
margin-bottom: 3rem;
}
.article-chat-section .heading-wrap h2 {
font-size: 2.25rem;
}
.article-chat-section .heading-wrap .text {
font-size: 1rem;
line-height: 1.5rem;
}
.article-chat-section .chat-wrap::before {
display: none;
}
.article-chat-section .chat-wrap .chat-element {
flex-direction: column;
align-items: stretch;
margin-bottom: 1rem;
}
.article-chat-section .chat-wrap .chat-element .message-heading {
font-size: 1.125rem;
}
.article-chat-section .chat-wrap .chat-element.tip-message .chat-message {
width: 100%;
margin: 0;
order: 1;
}
.article-chat-section .chat-wrap .chat-element.tip-message .chat-message::after {
top: auto;
bottom: -16px;
left: auto;
right: 0.75rem;
transform: none;
border-top: 16px solid #1F69B2;
border-left: 12px solid transparent;
border-right: 12px solid transparent;
border-bottom: none;
}
.article-chat-section .chat-wrap .chat-element.tip-message .avatar-wrap {
position: static;
transform: none;
align-self: flex-end;
margin-top: 1.25rem;
order: 2;
}
.article-chat-section .chat-wrap .chat-element.user-message .chat-message {
width: 100%;
margin: 0;
order: 1;
}
.article-chat-section .chat-wrap .chat-element.user-message .chat-message::after {
top: auto;
bottom: -16px;
right: auto;
left: 0.75rem;
transform: none;
border-top: 16px solid #0E1C2A;
border-left: 12px solid transparent;
border-right: 12px solid transparent;
border-bottom: none;
}
.article-chat-section .chat-wrap .chat-element.user-message .avatar-wrap {
position: static;
transform: none;
align-self: flex-start;
margin-top: 1.25rem;
order: 2;
}
.article-chat-section .chat-wrap .chat-element .avatar-wrap {
width: 3rem;
height: 3rem;
}
.article-chat-section .chat-wrap .chat-element .avatar-wrap img {
width: 1.5rem;
height: 1.5rem;
}
.article-chat-section .container-youtube {
flex-direction: column;
gap: 2.5rem;
}
.article-chat-section .container-youtube h2 {
font-size: 1.875rem;
}
.article-chat-section .container-youtube .text {
font-size: 1rem;
line-height: 1.5rem;
}
.article-chat-section .container-youtube iframe {
height: 12.5rem !important;
}
}
.article-services-section {
padding: 4rem 0;
}
.article-services-section h2 {
font-size: 3.75rem;
line-height: 120%;
margin-bottom: 4rem;
}
.article-services-section .horizontal-columns {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
overflow-x: scroll;
overflow-y: hidden;
gap: 1.5rem;
padding-bottom: 1.5rem;
position: relative;
}
.article-services-section .horizontal-columns::after {
width: 100%;
height: 1px;
background: rgb(219, 223, 228);
display: block;
content: "";
position: absolute;
bottom: -4px;
z-index: 99;
}
.article-services-section .horizontal-columns::-webkit-scrollbar {
height: 0.5rem !important;
-webkit-appearance: none !important;
}
.article-services-section .horizontal-columns::-webkit-scrollbar-track {
background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 45%, rgb(219, 223, 228) 46%, rgb(219, 223, 228) 56%, rgba(255, 255, 255, 0) 54%);
border-radius: 0 !important;
}
.article-services-section .horizontal-columns::-webkit-scrollbar-thumb {
background-color: rgb(189, 195, 201) !important;
border-radius: 0 !important;
-webkit-border-radius: 0 !important;
border: none !important;
box-shadow: inset 3px 0 0 white, inset -3px 0 0 white !important;
}
.article-services-section .horizontal-columns::-webkit-scrollbar-thumb:hover {
background-color: rgb(171, 177, 183) !important;
border-radius: 0 !important;
}
.article-services-section .horizontal-columns::-webkit-scrollbar-corner {
background: transparent !important;
}
.article-services-section .horizontal-columns .column {
flex-direction: column;
flex: 0 0 20rem;
padding-bottom: 1rem;
border-bottom: solid rgb(219, 223, 228) 1px;
}
.article-services-section .horizontal-columns .column a {
text-decoration: none;
}
.article-services-section .horizontal-columns .column a:hover .thumb {
transform: scale(1.05);
}
.article-services-section .horizontal-columns .column a:hover h3 {
color: rgb(4, 61, 120);
}
.article-services-section .horizontal-columns .column a:hover .arrow-wrap {
transform: translateX(10px);
}
.article-services-section .horizontal-columns .column .img-wrap {
overflow: hidden;
margin-bottom: 1rem;
}
.article-services-section .horizontal-columns .column .thumb {
display: block;
width: 100%;
height: 11.25rem;
object-fit: cover;
transition: 0.4s;
}
.article-services-section .horizontal-columns .column h3 {
color: rgb(14, 81, 151);
margin-bottom: 0.5rem;
transition: 0.4s;
}
.article-services-section .horizontal-columns .column p {
margin: 0;
}
.article-services-section .horizontal-columns .column .text {
overflow: hidden;
margin-bottom: 0.5rem;
overflow: hidden;
margin-bottom: 0.5rem;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.article-services-section .horizontal-columns .column .arrow-wrap {
display: inline-flex;
align-self: baseline;
padding: 0.51rem;
transition: 0.4s;
}
.article-services-section .horizontal-columns .column .arrow-wrap img {
width: 0.75rem;
height: 0.75rem;
margin: 0;
}
@media (max-width: 767px) {
.article-services-section h2 {
margin-bottom: 2.5rem;
font-size: 2.25rem;
line-height: 120%;
}
.article-services-section .horizontal-columns .column {
width: 17.5rem;
flex: 0 0 17.5rem;
}
.article-services-section .horizontal-columns .column h3 {
font-size: 1.25rem;
}
.article-services-section .horizontal-columns .column .thumb {
width: 17.5rem;
}
}
.article-formatted-text-section {
margin-top: 4rem;
margin-bottom: 4rem;
}
.article-formatted-text-section h1 {
font-size: 2.25rem;
letter-spacing: -2.2%;
line-height: 2.5rem;
margin-bottom: 2rem;
}
.article-formatted-text-section h2 {
margin-top: 3rem;
margin-bottom: 1.5rem;
line-height: 2rem;
font-size: 1.5rem;
}
.article-formatted-text-section h3 {
font-size: 1.25rem;
line-height: 2rem;
margin-top: 2rem;
margin-bottom: 0.75rem;
}
.article-formatted-text-section h4 {
margin-top: 1.5rem;
margin-bottom: 0.5rem;
font-size: 1rem;
line-height: 1.5rem;
}
.article-formatted-text-section a {
text-decoration: none;
color: #0E5197;
transition: 0.3s;
}
.article-formatted-text-section a:hover {
color: rgb(9.6727272727, 55.9636363636, 104.3272727273);
}
.article-formatted-text-section p {
margin-bottom: 1.25rem;
margin-top: 1.25rem;
}
.article-formatted-text-section .lead-text {
font-size: 1.25rem;
font-weight: 500;
line-height: 2rem;
margin-top: 1.5rem;
margin-bottom: 1.5rem;
}
.article-formatted-text-section blockquote {
padding-left: 1.5rem;
border-left: solid #1F69B2 1px;
margin-lefT: 0;
}
.article-formatted-text-section .wp-element-caption {
color: #656D75;
font-size: 0.875rem;
margin-top: 1rem;
margin-bottom: 2rem;
}
.article-formatted-text-section hr {
height: 5rem;
position: relative;
}
.article-formatted-text-section hr::after {
content: "";
display: block;
width: 100%;
height: 1px;
background: #DBDFE4;
top: 50%;
left: 0;
transform: translateY(-50%);
}
.article-formatted-text-section iframe {
width: 100%;
height: 45rem;
}
.article-formatted-text-section ul {
padding-left: 0;
margin-top: 1.25rem;
margin-bottom: 1.25rem;
}
.article-formatted-text-section ul li {
margin-bottom: 0.5rem;
list-style: none;
padding-left: 2rem;
position: relative;
font-size: 1rem;
line-height: 1.75rem;
}
.article-formatted-text-section ul li:last-child {
margin-bottom: 0;
}
.article-formatted-text-section ul li::before {
content: "";
position: absolute;
left: 0.5rem;
top: 12px;
width: 0.35rem;
height: 0.35rem;
background-image: url("/wp-content/themes/telecom-ip-theme/images/list-dot-blue.svg");
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.article-formatted-text-section .wp-block-table {
margin-top: 2rem;
margin-bottom: 2rem;
}
.article-formatted-text-section table td,
.article-formatted-text-section table th {
padding: 0.5rem;
border: none;
}
.article-formatted-text-section table th {
font-weight: 700;
}
.article-formatted-text-section table tr {
border: solid #DBDFE4 1px;
border-left: none;
border-right: none;
}
@media (max-width: 767px) {
.article-formatted-text-section h2 {
font-size: 1.25rem;
line-height: 2rem;
}
.article-formatted-text-section h3 {
font-size: 1rem;
line-height: 1.5rem;
}
.article-formatted-text-section iframe {
height: 12rem;
}
.article-formatted-text-section h4 {
font-size: 1rem;
line-height: 1.5rem;
}
.article-formatted-text-section table {
font-size: 0.875rem;
}
.article-formatted-text-section ul li::before {
width: 0.25rem;
height: 0.25rem;
}
.article-formatted-text-section .blog-quote-section {
flex-direction: column;
}
.article-formatted-text-section .blog-quote-section .description {
padding-top: 0;
}
.article-formatted-text-section ul li {
font-size: 1rem;
line-height: 1.75rem;
}
}
.post-navigation {
margin-top: 2.5rem;
}
.post-navigation .container {
border-top: solid #DBDFE4 1px;
}
.post-navigation .navigation-wrapper {
padding-top: 2.5rem;
margin-bottom: 4rem;
display: flex;
flex-direction: row;
justify-content: space-between;
}
.post-navigation .navigation-wrapper a {
display: flex;
flex-direction: column;
text-decoration: none;
}
.post-navigation .navigation-wrapper a img {
display: inline-block;
margin-right: 0.5rem;
}
.post-navigation .navigation-wrapper .nav-label {
align-self: baseline;
color: #0E1C2A;
padding: 0.5rem 1rem 0.5rem 1.5rem;
border: solid #BDC3C9 1px;
background: none;
outline: none;
cursor: pointer;
margin-bottom: 0.5rem;
transition: 0.3s;
gap: 0.5rem;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
}
.post-navigation .navigation-wrapper .nav-label:hover {
background: rgb(239, 243, 245);
box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
}
.post-navigation .navigation-wrapper .nav-title {
color: #0E5197;
font-size: 0.875rem;
display: inline-block;
}
.post-navigation .navigation-wrapper .next-post a img {
transform: rotate(180deg);
}
.post-navigation .navigation-wrapper .next-post a .nav-label {
margin-left: auto;
padding: 0.5rem 1.5rem 0.5rem 1rem;
}
.post-navigation .navigation-wrapper .next-post a .nav-label img {
margin-right: 0;
margin-left: 0.5rem;
}
@media (max-width: 767px) {
.post-navigation .nav-title {
display: none !important;
}
.post-navigation .navigation-wrapper {
gap: 1.5rem;
}
.post-navigation .previous-post,
.post-navigation .next-post {
flex: 1 !important;
}
.post-navigation .previous-post a,
.post-navigation .next-post a {
width: 100%;
display: block;
}
}
.related-posts {
background: linear-gradient(180deg, #EFF2F5 0%, #EAF4FF 99.98%);
padding: 4rem 0rem;
}
.related-posts h3 {
margin-bottom: 4rem;
}
.related-posts .articles-wrap {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
gap: 1.5rem;
}
.related-posts .articles-wrap article {
flex: 1;
border-bottom: solid #DBDFE4 1px;
}
.related-posts .articles-wrap article a {
display: flex;
flex-direction: column;
text-decoration: none;
height: 100%;
transition: 0.3s;
}
.related-posts .articles-wrap article a .article-image {
overflow: hidden !important;
}
.related-posts .articles-wrap article a:hover img {
transform: scale(1.1);
}
.related-posts .articles-wrap article a img {
display: block;
width: 100%;
height: 16rem;
object-fit: cover;
transition: 0.3s;
}
.related-posts .articles-wrap article a .article-content {
flex: 1;
display: flex;
flex-direction: column;
}
.related-posts .articles-wrap article a h3 {
font-size: 1.25rem;
color: #0E5197;
margin-top: 1rem;
margin-bottom: 0.5rem;
}
.related-posts .articles-wrap article a .article-date {
font-size: 0.75rem;
color: #656D75;
padding-bottom: 1rem;
}
@media (max-width: 767px) {
.related-posts .articles-wrap {
overflow-x: auto;
overflow-y: hidden;
-ms-overflow-style: none;
scrollbar-width: none;
}
.related-posts .articles-wrap img {
width: 17.5rem !important;
}
.related-posts .articles-wrap h3 {
font-size: 1.125rem !important;
}
.related-posts .articles-wrap img {
height: 12rem !important;
}
}
.article-quote-section {
padding-top: 4rem;
padding-bottom: 4rem;
}
.article-quote-section .container {
display: flex;
justify-content: center;
padding-top: 2.5rem;
padding-bottom: 2.5rem;
border-top: solid rgb(115, 179, 244) 1px;
border-bottom: solid rgb(115, 179, 244) 1px;
}
.article-quote-section h2 {
font-size: 2.25rem;
line-height: 120%;
margin: 0;
text-align: center;
max-width: 60rem;
}
@media (max-width: 767px) {
.article-quote-section h2 {
font-size: 1.875rem !important;
line-height: 120%;
}
}
.available-roles-section {
padding-top: 4rem;
padding-bottom: 4rem;
}
.available-roles-section .roles-wrapper {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
.available-roles-section .roles-wrapper .role-inner-wrap {
display: flex;
border-bottom: solid rgb(115, 179, 244) 1px;
width: 100%;
}
.available-roles-section .roles-wrapper .role-inner-wrap:last-child {
border-bottom: none;
}
.available-roles-section .roles-wrapper .role {
flex: 0 0 50%;
padding: 2.5rem 1.25rem;
}
.available-roles-section .title-h2 {
font-size: 3.75rem;
line-height: 120%;
margin-bottom: 4rem;
}
.available-roles-section h3 {
font-size: 2.25rem;
line-height: 120%;
margin-bottom: 1.5rem;
}
.available-roles-section a {
text-decoration: none;
color: #0E5197;
transition: 0.3s;
}
.available-roles-section a:hover {
color: rgb(9.6727272727, 55.9636363636, 104.3272727273);
}
@media (max-width: 767px) {
.available-roles-section .roles-wrapper {
flex-direction: column;
}
.available-roles-section .roles-wrapper h3 {
font-size: 1.875rem !important;
line-height: 120%;
}
.available-roles-section .roles-wrapper .title-h2 {
font-size: 2.25rem;
line-height: 120%;
margin-bottom: 2.5rem;
}
.available-roles-section .roles-wrapper .role-inner-wrap {
flex-direction: column;
border-bottom: none;
}
.available-roles-section .roles-wrapper .role-inner-wrap:last-child .role:last-child {
border-bottom: none;
padding-bottom: 0;
}
.available-roles-section .roles-wrapper .role-inner-wrap:first-child .role:first-child {
padding-top: 0;
}
.available-roles-section .roles-wrapper .role {
flex: 1;
border-bottom: solid rgb(115, 179, 244) 1px;
}
}
.article-image-button-section {
padding: 4rem 0;
}
.article-image-button-section .title-h2 {
font-size: 3.75rem;
line-height: 120%;
margin-bottom: 4rem;
max-width: 900px;
margin-left: auto;
margin-right: auto;
}
.article-image-button-section .wrap {
display: flex;
flex-direction: column;
}
.article-image-button-section .wrap .img-wrap {
display: flex;
justify-content: center;
align-items: center;
}
.article-image-button-section .wrap img {
max-width: 900px;
object-fit: contain;
width: 100%;
height: auto;
}
.article-image-button-section .wrap .button-wrap {
display: flex;
width: 100%;
justify-content: center;
}
.article-image-button-section .wrap .button-wrap a {
background: rgb(31, 105, 178);
display: flex;
width: 100%;
padding: 1.5rem 2.5rem;
color: #fff;
font-size: 1.25rem;
line-height: 1.75rem;
background-image: url("/wp-content/themes/telecom-ip-theme/images/bg-button.svg");
justify-content: space-between;
margin-top: 4rem;
text-decoration: none;
transition: 0.4s;
max-width: 900px;
}
.article-image-button-section .wrap .button-wrap a:hover {
background-color: rgb(4, 61, 120);
}
.article-image-button-section .wrap .button-wrap a .text-right {
display: flex;
gap: 0.75rem;
}
.article-image-button-section .wrap .button-wrap a .text-right img {
width: 1rem;
}
.article-image-button-section .wrap .button-wrap a .text-right .arrow {
display: flex;
align-items: center;
justify-content: center;
}
@media (max-width: 767px) {
.article-image-button-section .title-h2 {
font-size: 2.25rem;
line-height: 120%;
margin-bottom: 2.5rem;
}
.article-image-button-section .wrap .button-wrap a {
display: flex;
flex-direction: column;
gap: 1rem;
font-size: 1.125rem;
margin-top: 2.5rem;
}
.article-image-button-section .wrap .button-wrap .text-right {
display: none !important;
}
}
.site-footer {
background: rgb(14, 28, 42);
padding: 4rem 0;
color: #fff;
}
.site-footer .row {
flex-direction: row;
gap: 1.5rem;
display: flex;
}
.site-footer .cols-left {
display: flex;
flex: 0 0 calc(50% - 0.75rem);
font-size: 0.875rem;
font-weight: 500;
}
.site-footer .cols-left .col {
display: flex;
flex-direction: column;
}
.site-footer .cols-left .col a {
text-decoration-color: rgb(14, 28, 42) !important;
text-decoration: underline;
transition: 0.4s;
}
.site-footer .cols-left .col a:hover {
text-decoration-color: #fff !important;
}
.site-footer .cols-left .logo-href img {
height: 1.75rem;
margin-bottom: 1.5rem;
}
.site-footer .cols-left .company-name {
margin-top: 0;
margin-bottom: 1rem;
}
.site-footer .cols-left .company-address {
margin-top: 0;
margin-bottom: 1rem;
}
.site-footer .cols-left .company-address .text-line {
display: block;
}
.site-footer .cols-left .company-email,
.site-footer .cols-left .company-phone {
margin-bottom: 1rem;
color: #fff;
text-decoration: none;
display: inline-flex;
}
.site-footer .cols-left .icons-wrap {
display: flex;
flex-direction: row;
gap: 1rem;
margin-top: 1rem;
}
.site-footer .cols-left .icons-wrap a {
border: solid #fff 2px;
border-radius: 100%;
display: flex;
transition: 0.1s;
text-decoration: none;
}
.site-footer .cols-left .icons-wrap a:hover {
transform: scale(1.1);
}
.site-footer .cols-left .icons-wrap img {
font-size: 1.5rem;
width: 1.5rem;
height: 1.5rem;
margin: 0.5rem;
}
.site-footer .cols-right {
flex: 0 0 calc(50% - 0.75rem);
display: flex;
flex-direction: row;
gap: 1.5rem;
font-weight: 500;
font-size: 0.875rem;
}
.site-footer .cols-right .col {
flex: 0 0 calc(33.3333% - 1rem);
display: flex;
flex-direction: column;
}
.site-footer .cols-right .col:last-child {
justify-content: space-between;
}
.site-footer .cols-right .col a {
text-decoration-color: rgb(14, 28, 42) !important;
text-decoration: underline;
transition: 0.4s;
}
.site-footer .cols-right .col a:hover {
text-decoration-color: #fff !important;
}
.site-footer .cols-right .col-text a {
text-decoration-color: rgb(14, 28, 42) !important;
text-decoration: underline;
transition: 0.4s;
color: #fff;
}
.site-footer .cols-right .col-text a:hover {
text-decoration-color: #fff !important;
}
.site-footer .cols-right ul {
padding: 0;
margin: 0;
}
.site-footer .cols-right ul li {
list-style-type: none;
padding: 0;
color: #fff;
margin: 0 0 0.5rem 0;
}
.site-footer .cols-right ul li a {
color: #fff;
text-decoration: none;
padding: 0.5rem 0;
display: block;
}
.subfooter {
background: rgb(14, 28, 42);
padding: 2.5rem 0;
color: #fff;
border-top: solid rgb(54, 65, 76) 1px;
}
.subfooter .row {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
gap: 1rem;
}
.subfooter .row .copyright-text {
opacity: 0.5;
}
.subfooter .row .countries-wrapper {
gap: 1rem;
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
.subfooter .row .countries-wrapper a {
display: block;
border: solid #fff 2px;
border-radius: 100%;
}
.subfooter .row .countries-wrapper a img {
width: 2rem;
height: 2rem;
margin: 0.125rem;
display: block;
transition: 0.1s;
}
.subfooter .row .countries-wrapper a:hover {
transform: scale(1.1);
}
@media (max-width: 767px) {
.site-footer .row {
flex-direction: column;
}
.site-footer .row .cols-right {
flex-direction: column;
}
.subfooter .row {
flex-direction: column;
}
}
.popup-section {
width: 100%;
height: 100%;
position: fixed;
left: 0;
top: 0;
background: rgba(255, 255, 255, 0.3);
z-index: 9998;
}
.popup-section .container .popup-wrap {
width: 90%;
max-width: 600px;
top: 50%;
left: 50%;
position: absolute;
transform: translate(-50%, -50%);
background: #fff;
padding: 2.5rem;
box-shadow: 6px 6px 24px 0px rgba(0, 0, 0, 0.35);
z-index: 9999;
}
.popup-section .container .popup-wrap .text h3 {
margin-bottom: 1.5rem;
}
.popup-section .container .popup-wrap .text p {
margin-top: 0;
margin-bottom: 1rem;
}
.popup-section .container .popup-wrap .text p:last-child {
margin-bottom: 2rem;
}
.popup-section .container .popup-wrap .button-accept {
height: 3.25rem;
background: rgb(14, 28, 42);
border: solid transparent 1px;
transition: 0.4s;
box-shadow: none;
cursor: pointer;
}
.popup-section .container .popup-wrap .button-accept span {
color: #fff;
}
.popup-section .container .popup-wrap .button-accept:hover {
transform: translateY(-2px);
}
.popup-section .container .popup-wrap .button-accept span {
display: flex;
align-items: center;
justify-content: center;
}
.popup-section .container .popup-wrap .button-notice {
background: none;
border: none;
text-decoration: none;
margin-left: 0.5rem;
}
.popup-section .container .popup-wrap .button-notice a {
text-decoration: none;
color: #0E5197;
transition: 0.3s;
}
.popup-section .container .popup-wrap .button-notice a:hover {
color: rgb(9.6727272727, 55.9636363636, 104.3272727273);
}
@media (max-width: 767px) {
.popup-section .buttons-wrap {
display: flex;
flex-direction: column;
gap: 1.5rem;
}
.popup-section .buttons-wrap .button-notice {
margin-left: 0 !important;
}
}
.hero-blog-hero-section {
min-height: 54rem;
position: relative;
display: flex;
align-items: flex-end;
flex-direction: column;
justify-content: flex-end;
overflow: hidden;
background-color: #0e3055;
margin-bottom: 4rem;
}
.hero-blog-hero-section:after {
background-image: url("/wp-content/themes/telecom-ip-theme/images/hero-background-squares.svg");
background-repeat: no-repeat;
content: "";
position: absolute;
width: 100%;
height: auto;
display: block;
height: 100%;
top: 0;
background-position: center top;
}
.hero-blog-hero-section.text-position-center {
justify-content: center !important;
}
.hero-blog-hero-section.text-position-bottom {
justify-content: flex-end !important;
}
.hero-blog-hero-section.text-position-bottom .hero-mask-svg {
position: relative !important;
}
.hero-blog-hero-section .hero-mask-svg {
position: absolute;
bottom: -1px;
left: 0;
width: 100%;
z-index: 99;
}
.hero-blog-hero-section .hero-mask-svg svg {
width: 100%;
height: auto;
display: block;
height: auto;
}
.hero-blog-hero-section .container {
padding-top: 5rem;
padding-bottom: 3rem;
margin-bottom: 3.5rem;
}
.hero-blog-hero-section h1 {
font-size: 6rem;
letter-spacing: -0.022em;
background: radial-gradient(216.67% 216.67% at 0% -77.78%, #B1D4F9 0%, #FFFFFF 100%);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
color: transparent;
margin-bottom: 1.5rem;
line-height: 6.75rem;
margin-top: 4rem;
}
.hero-blog-hero-section .hero-text {
color: #fff;
max-width: 1024px;
font-size: 1.25rem;
line-height: 1.75rem;
}
.hero-blog-hero-section .hero-section-has-buttons .hero-content {
margin-bottom: 4rem;
}
.hero-blog-hero-section .hero-content {
position: relative;
z-index: 2;
}
.hero-blog-hero-section .button-wrapper {
gap: 1rem;
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 2.25rem;
}
.hero-blog-hero-section .hero-button {
padding: 0.75rem 1.5rem;
color: #fff;
line-height: 140%;
text-decoration: none;
border: solid 1px rgba(255, 255, 255, 0.5);
min-width: 200px;
text-transform: uppercase;
font-size: 1.25rem;
display: inline-flex;
align-items: center;
justify-content: center;
font-weight: 500;
transition: 0.5s;
}
.hero-blog-hero-section .hero-button:hover {
color: rgb(14, 26, 42);
background: #fff;
}
.hero-blog-hero-section .articles-wrapper {
position: relative;
z-index: 9;
margin-top: 4rem;
padding-bottom: 4rem;
}
.hero-blog-hero-section .sticky-post a {
overflow: hidden;
display: flex;
transition: 0.3s !important;
}
.hero-blog-hero-section .sticky-post a .post-image {
overflow: hidden;
display: flex;
}
.hero-blog-hero-section .sticky-post a img {
transition: 0.3s;
}
.hero-blog-hero-section .sticky-post a:hover {
color: rgb(177, 212, 249);
}
.hero-blog-hero-section .sticky-post a:hover img {
transform: scale(1.1);
}
.hero-blog-hero-section .sticky-posts {
gap: 2.5rem;
display: flex;
}
.hero-blog-hero-section .sticky-posts .col-left {
flex: 1;
}
.hero-blog-hero-section .sticky-posts .col-left h3 {
margin-top: 1rem;
margin-bottom: 0.5rem;
font-size: 1.25rem;
}
.hero-blog-hero-section .sticky-posts .col-left .post-date {
color: #656D75;
margin-top: 1rem;
font-size: 0.75rem;
}
.hero-blog-hero-section .sticky-posts .col-left .sticky-post {
border-bottom: solid #36414C 1px;
padding-bottom: 1rem;
}
.hero-blog-hero-section .sticky-posts .col-left .sticky-post img {
display: block;
width: 100%;
max-height: 24rem;
aspect-ratio: 2/1;
object-fit: contain;
height: 100%;
}
.hero-blog-hero-section .sticky-posts .col-left .sticky-post a {
color: #B1D4F9;
text-decoration: none;
flex-direction: column;
}
.hero-blog-hero-section .sticky-posts .col-left .sticky-post h2 {
color: #B1D4F9;
text-decoration: none;
}
.hero-blog-hero-section .sticky-posts .col-right {
flex: 1;
display: flex;
flex-direction: column;
justify-content: space-between;
align-content: space-between;
}
.hero-blog-hero-section .sticky-posts .col-right h3 {
margin-top: 0;
margin-bottom: 0;
font-size: 1.25rem;
}
.hero-blog-hero-section .sticky-posts .col-right .post-date {
color: #656D75;
margin-top: 1rem;
font-size: 0.75rem;
}
.hero-blog-hero-section .sticky-posts .col-right .post-content {
display: flex;
flex-direction: column;
justify-content: space-between;
}
.hero-blog-hero-section .sticky-posts .col-right .border-div {
width: 100%;
height: 1px;
background: #36414C;
display: block;
}
.hero-blog-hero-section .sticky-posts .col-right .sticky-post {
display: flex;
flex-direction: row;
}
.hero-blog-hero-section .sticky-posts .col-right .sticky-post a {
display: flex;
flex-direction: row;
gap: 1.5rem;
}
.hero-blog-hero-section .sticky-posts .col-right .sticky-post .post-image {
width: 15rem;
height: 7.5rem;
min-width: 15rem;
}
.hero-blog-hero-section .sticky-posts .col-right .sticky-post img {
display: block;
width: 15rem;
height: 7.5rem;
object-fit: cover;
transition: 0.3s;
overflow: hidden;
}
.hero-blog-hero-section .sticky-posts .col-right .sticky-post img:hover {
transform: scale(1.05);
}
.hero-blog-hero-section .sticky-posts .col-right .sticky-post a {
color: #B1D4F9;
text-decoration: none;
}
.hero-blog-hero-section .sticky-posts .col-right .sticky-post h2 {
color: #B1D4F9;
text-decoration: none;
}
@media (max-width: 767px) {
.hero-blog-hero-section {
min-height: 600px;
}
.hero-blog-hero-section h1 {
font-size: 2.25rem;
line-height: 120%;
}
.hero-blog-hero-section .hero-button {
width: 100%;
padding: 8px 8px;
font-size: 1rem;
}
.hero-blog-hero-section .button-wrapper {
margin-top: 1.5rem;
}
.hero-blog-hero-section .hero-text {
font-size: 1rem;
}
.hero-blog-hero-section .container {
padding-bottom: 0;
margin-bottom: 0;
padding-top: 6rem !important;
}
.hero-blog-hero-section .articles-wrapper {
padding-bottom: 5.5rem;
}
.hero-blog-hero-section .sticky-posts {
flex-direction: column;
gap: 0;
}
.hero-blog-hero-section .sticky-posts h3 {
font-size: 1.125rem !important;
}
.hero-blog-hero-section .sticky-posts .post-date {
margin-top: 0.5rem !important;
}
.hero-blog-hero-section .sticky-posts .col-right .sticky-post a {
flex-direction: column;
padding-bottom: 1rem;
margin-bottom: 0;
padding-top: 1.5rem;
border-bottom: solid #36414C 1px;
}
.hero-blog-hero-section .sticky-posts .col-right .sticky-post .post-image {
width: 100%;
height: auto;
aspect-ratio: 2/1;
}
.hero-blog-hero-section .sticky-posts .col-right .sticky-post .post-image img {
height: auto;
aspect-ratio: 2/1;
width: 100%;
}
.hero-blog-hero-section .sticky-posts .col-right .border-div {
display: none;
}
.hero-blog-hero-section .sticky-posts .col-left .sticky-post {
flex-direction: column;
padding-bottom: 1rem;
margin-bottom: 0;
padding-top: 0rem;
border-bottom: solid #36414C 1px;
}
.hero-blog-hero-section .sticky-posts .col-left .sticky-post .post-image {
width: 100%;
height: auto;
aspect-ratio: 2/1;
}
.hero-blog-hero-section .sticky-posts .col-left .sticky-post .post-image img {
height: auto;
aspect-ratio: 2/1;
width: 100%;
max-height: 24rem;
}
.hero-blog-hero-section .sticky-posts .col-left .border-div {
display: none;
}
}
.blog-articles .container h2 {
color: #0E1C2A;
margin-top: 4rem;
margin-bottom: 4rem;
font-size: 3.75rem;
}
.blog-articles .container .all-articles {
display: flex;
flex-direction: row;
flex-wrap: wrap;
gap: 1.5rem;
}
.blog-articles .container .all-articles .blog-article {
display: flex;
flex: 0 0 calc(33% - 1rem);
flex-direction: column;
border-bottom: solid #DBDFE4 1px;
}
.blog-articles .container .all-articles .blog-article a {
display: flex;
flex-direction: column;
text-decoration: none;
height: 100%;
transition: 0.3s;
}
.blog-articles .container .all-articles .blog-article a .article-image {
overflow: hidden !important;
}
.blog-articles .container .all-articles .blog-article a:hover img {
transform: scale(1.1);
}
.blog-articles .container .all-articles .blog-article a img {
display: block;
width: 100%;
object-fit: contain;
aspect-ratio: 2/1;
transition: 0.3s;
height: 100%;
}
.blog-articles .container .all-articles .blog-article a .article-content {
flex: 1;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.blog-articles .container .all-articles .blog-article a h3 {
font-size: 1.25rem;
color: #0E5197;
margin-top: 1rem;
margin-bottom: 0.5rem;
}
.blog-articles .container .all-articles .blog-article a .article-date {
font-size: 0.75rem;
color: #656D75;
padding-bottom: 1rem;
}
.blog-articles .container .load-more-wrapper {
display: flex;
justify-content: center;
margin-top: 2.5rem;
}
.blog-articles .container .load-more-wrapper .load-more-button {
flex: 0 0 calc(33% - 1rem);
color: #0E1C2A;
padding: 0.5rem 1rem;
border: solid #BDC3C9 1px;
background: none;
outline: none;
cursor: pointer;
margin-bottom: 4rem;
transition: 0.3s;
}
.blog-articles .container .load-more-wrapper .load-more-button:hover {
background: rgb(239, 243, 245);
box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
}
@media (max-width: 767px) {
.blog-articles .container h2 {
margin-bottom: 2.5rem;
font-size: 2.25rem;
}
.blog-articles .container .all-articles {
flex-direction: column;
}
.blog-articles .container .all-articles h3 {
font-size: 1.125rem !important;
}
.blog-articles .container .all-articles img {
height: 12rem !important;
}
.blog-articles .container .load-more-button {
flex: 1 !important;
}
}
.hero-post-hero-section {
min-height: 54rem;
position: relative;
display: flex;
align-items: flex-end;
flex-direction: column;
justify-content: flex-end;
overflow: hidden;
margin-bottom: 4rem;
}
.hero-post-hero-section .hero-bg {
background-color: #0e3055;
height: 46rem;
position: absolute;
z-index: 1;
left: 0;
top: 0;
width: 100%;
}
.hero-post-hero-section .hero-bg:after {
background-image: url("/wp-content/themes/telecom-ip-theme/images/hero-background-squares.svg");
background-repeat: no-repeat;
content: "";
position: absolute;
width: 100%;
height: auto;
display: block;
height: 100%;
top: 0;
background-position: center top;
}
.hero-post-hero-section .hero-bg .hero-mask-svg {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
z-index: 99;
}
.hero-post-hero-section .hero-bg .hero-mask-svg svg {
width: 100%;
height: auto;
display: block;
height: auto;
}
.hero-post-hero-section.text-position-center {
justify-content: center !important;
}
.hero-post-hero-section.text-position-bottom {
justify-content: flex-end !important;
}
.hero-post-hero-section.text-position-bottom .hero-mask-svg {
position: relative !important;
}
.hero-post-hero-section .container {
padding-top: 5rem;
z-index: 9;
}
.hero-post-hero-section h1 {
font-size: 3.75rem;
letter-spacing: -0.022em;
background: radial-gradient(216.67% 216.67% at 0% -77.78%, #B1D4F9 0%, #FFFFFF 100%);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
color: transparent;
margin-bottom: 1.5rem;
line-height: 120%;
margin-top: 4rem;
text-align: center;
z-index: 6;
}
.hero-post-hero-section .date {
color: #FFFFFF;
font-size: 1.25rem;
line-height: 1.75rem;
margin-top: 1rem;
margin-bottom: 4rem;
text-align: center;
display: block;
}
.hero-post-hero-section .image {
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 1.5rem;
}
.hero-post-hero-section .image img {
display: block;
height: 100%;
width: 100%;
aspect-ratio: 2/1;
max-width: 48rem;
object-fit: contain;
}
.hero-post-hero-section .breadcrumbs-share {
display: flex;
flex-direction: row;
max-width: 48rem;
margin-left: auto;
margin-right: auto;
gap: 2.5rem;
}
.hero-post-hero-section .breadcrumbs-share .breadcrumbs {
flex: 1;
min-width: 0;
align-items: center;
justify-content: center;
display: flex;
}
.hero-post-hero-section .breadcrumbs-share .breadcrumbs #breadcrumbs {
color: rgba(101, 109, 117, 0.5);
font-size: 0.875rem;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.hero-post-hero-section .breadcrumbs-share .breadcrumbs #breadcrumbs a {
color: #656D75;
text-decoration: none;
display: inline-block;
margin-left: 0.5rem;
margin-right: 0.5rem;
}
.hero-post-hero-section .breadcrumbs-share .breadcrumbs #breadcrumbs a:first-child {
margin-left: 0;
}
.hero-post-hero-section .breadcrumbs-share .breadcrumbs #breadcrumbs .breadcrumb_last {
margin-left: 0.5rem;
color: rgba(101, 109, 117, 0.5);
}
.hero-post-hero-section .breadcrumbs-share .share-this {
font-size: 0.875rem;
color: #656D75;
}
.hero-post-hero-section .breadcrumbs-share .share {
display: flex;
flex-direction: row;
gap: 1rem;
flex-wrap: nowrap;
flex: 0 1 auto;
align-self: baseline;
align-items: center;
}
.hero-post-hero-section .breadcrumbs-share .share img {
width: 2rem;
height: 2rem;
display: block;
}
.hero-post-hero-section .breadcrumbs-share .share a {
width: 2rem;
height: 2rem;
}
@media (max-width: 767px) {
.hero-post-hero-section {
min-height: 38rem;
}
.hero-post-hero-section .hero-bg {
height: 37rem;
}
.hero-post-hero-section .hero-mask-svg {
bottom: -1px;
}
.hero-post-hero-section .container {
padding-top: 6.75rem;
}
.hero-post-hero-section h1 {
font-size: 2.25rem;
line-height: 120%;
margin-bottom: 1rem;
}
.hero-post-hero-section .date {
font-size: 1.125rem;
}
.hero-post-hero-section .image img {
height: 100%;
width: 100%;
aspect-ratio: 2/1;
object-fit: contain;
}
.hero-post-hero-section .breadcrumbs-share {
flex-direction: column;
gap: 1rem;
}
}
.blog-content .container {
max-width: 48rem;
}
.blog-content h1 {
font-size: 2.25rem;
letter-spacing: -2.2%;
line-height: 2.5rem;
margin-bottom: 2rem;
}
.blog-content h2 {
margin-top: 3rem;
margin-bottom: 1.5rem;
line-height: 2rem;
font-size: 1.5rem;
}
.blog-content h3 {
font-size: 1.25rem;
line-height: 2rem;
margin-top: 2rem;
margin-bottom: 0.75rem;
}
.blog-content h4 {
margin-top: 1.5rem;
margin-bottom: 0.5rem;
font-size: 1rem;
line-height: 1.5rem;
}
.blog-content a {
text-decoration: none;
color: #0E5197;
transition: 0.3s;
}
.blog-content a:hover {
color: rgb(9.6727272727, 55.9636363636, 104.3272727273);
}
.blog-content p {
margin-bottom: 1.25rem;
margin-top: 1.25rem;
}
.blog-content .lead-text {
font-size: 1.25rem;
font-weight: 500;
line-height: 2rem;
margin-top: 1.5rem;
margin-bottom: 1.5rem;
}
.blog-content blockquote {
padding-left: 1.5rem;
border-left: solid #1F69B2 1px;
margin-lefT: 0;
}
.blog-content .wp-element-caption {
color: #656D75;
font-size: 0.875rem;
margin-top: 1rem;
margin-bottom: 2rem;
}
.blog-content hr {
height: 0rem;
position: relative;
}
.blog-content hr::after {
content: "";
display: block;
width: 100%;
height: 1px;
background: #DBDFE4;
top: 50%;
left: 0;
transform: translateY(-50%);
}
.blog-content .is-type-video iframe {
width: 100%;
height: 27rem;
}
.blog-content ul {
padding-left: 0;
margin-top: 1.25rem;
margin-bottom: 1.25rem;
}
.blog-content ul li {
margin-bottom: 0.5rem;
list-style: none;
padding-left: 2rem;
position: relative;
font-size: 1rem;
line-height: 1.75rem;
}
.blog-content ul li:last-child {
margin-bottom: 0;
}
.blog-content ul li::before {
content: "";
position: absolute;
left: 0.5rem;
top: 11px;
width: 0.35rem;
height: 0.35rem;
background-image: url("/wp-content/themes/telecom-ip-theme/images/list-dot-blue.svg");
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.blog-content .wp-block-table {
margin-top: 2rem;
margin-bottom: 2rem;
}
.blog-content table td,
.blog-content table th {
padding: 0.5rem;
border: none;
}
.blog-content table th {
font-weight: 700;
}
.blog-content table tr {
border: solid #DBDFE4 1px;
border-left: none;
border-right: none;
}
.blog-quote-section {
margin-bottom: 2.5rem;
display: flex;
flex-direction: row;
gap: 2.5rem;
}
.blog-quote-section .quote {
flex: 1;
}
.blog-quote-section .quote .image-wrap img {
display: block;
width: 100%;
aspect-ratio: 1/1;
}
.blog-quote-section .quote .details {
color: #656D75;
margin-top: 1.25rem;
}
.blog-quote-section .quote .details span {
display: block;
}
.blog-quote-section .description {
flex: 1;
padding: 2rem 0;
}
.blog-quote-section .description .description-inner {
border-left: solid #1F69B2 1px;
font-style: italic;
line-height: 1.75rem;
padding: 0 1.5rem;
}
.blog-quote-section .description .description-inner .details {
margin-top: 1.25rem;
}
.blog-quote-section .description .description-inner .details span {
display: block;
}
.blog-quote-section .description .description-inner .details .line-hidden {
display: inline-block;
visibility: hidden;
opacity: 0;
cursor: none;
}
@media (max-width: 767px) {
.blog-content h2 {
font-size: 1.25rem;
line-height: 2rem;
}
.blog-content h3 {
font-size: 1rem;
line-height: 1.5rem;
}
.blog-content h4 {
font-size: 1rem;
line-height: 1.5rem;
}
.blog-content table {
font-size: 0.875rem;
}
.blog-content .is-type-video iframe {
height: 12rem;
}
.blog-content ul li::before {
width: 0.25rem;
height: 0.25rem;
}
.blog-content .blog-quote-section {
flex-direction: column;
}
.blog-content .blog-quote-section .description {
padding-top: 0;
}
.blog-content ul li {
font-size: 1rem;
line-height: 1.75rem;
}
}
.post-navigation {
margin-top: 2.5rem;
}
.post-navigation .container {
border-top: solid #DBDFE4 1px;
}
.post-navigation .navigation-wrapper {
padding-top: 2.5rem;
margin-bottom: 4rem;
display: flex;
flex-direction: row;
justify-content: space-between;
}
.post-navigation .navigation-wrapper a {
display: flex;
flex-direction: column;
text-decoration: none;
}
.post-navigation .navigation-wrapper a img {
display: inline-block;
margin-right: 0.5rem;
}
.post-navigation .navigation-wrapper .nav-label {
align-self: baseline;
color: #0E1C2A;
padding: 0.5rem 1rem 0.5rem 1.5rem;
border: solid #BDC3C9 1px;
background: none;
outline: none;
cursor: pointer;
margin-bottom: 0.5rem;
transition: 0.3s;
gap: 0.5rem;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
}
.post-navigation .navigation-wrapper .nav-label:hover {
background: rgb(239, 243, 245);
box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
}
.post-navigation .navigation-wrapper .nav-title {
color: #0E5197;
font-size: 0.875rem;
display: inline-block;
}
.post-navigation .navigation-wrapper .next-post a img {
transform: rotate(180deg);
}
.post-navigation .navigation-wrapper .next-post a .nav-label {
margin-left: auto;
padding: 0.5rem 1.5rem 0.5rem 1rem;
}
.post-navigation .navigation-wrapper .next-post a .nav-label img {
margin-right: 0;
margin-left: 0.5rem;
}
@media (max-width: 767px) {
.post-navigation .nav-title {
display: none !important;
}
.post-navigation .navigation-wrapper {
gap: 1.5rem;
}
.post-navigation .previous-post,
.post-navigation .next-post {
flex: 1 !important;
}
.post-navigation .previous-post a,
.post-navigation .next-post a {
width: 100%;
display: block;
}
}
.related-posts {
background: linear-gradient(180deg, #EFF2F5 0%, #EAF4FF 99.98%);
padding: 4rem 0rem;
}
.related-posts h3 {
margin-bottom: 4rem;
}
.related-posts .articles-wrap {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
gap: 1.5rem;
}
.related-posts .articles-wrap article {
flex: 1;
border-bottom: solid #DBDFE4 1px;
}
.related-posts .articles-wrap article a {
display: flex;
flex-direction: column;
text-decoration: none;
height: 100%;
transition: 0.3s;
}
.related-posts .articles-wrap article a .article-image {
overflow: hidden !important;
}
.related-posts .articles-wrap article a:hover img {
transform: scale(1.1);
}
.related-posts .articles-wrap article a img {
display: block;
width: 100%;
height: 100%;
aspect-ratio: 2/1;
object-fit: contain;
transition: 0.3s;
}
.related-posts .articles-wrap article a .article-content {
flex: 1;
display: flex;
flex-direction: column;
}
.related-posts .articles-wrap article a h3 {
font-size: 1.25rem;
color: #0E5197;
margin-top: 1rem;
margin-bottom: 0.5rem;
}
.related-posts .articles-wrap article a .article-date {
font-size: 0.75rem;
color: #656D75;
padding-bottom: 1rem;
}
@media (max-width: 767px) {
.related-posts .articles-wrap {
overflow-x: auto;
overflow-y: hidden;
-ms-overflow-style: none;
scrollbar-width: none;
}
.related-posts .articles-wrap img {
width: 17.5rem !important;
}
.related-posts .articles-wrap h3 {
font-size: 1.125rem !important;
}
}
/* compatibility fixes
from underscores theme */
/* Text meant only for screen readers. */
.screen-reader-text {
border: 0;
clip: rect(1px, 1px, 1px, 1px);
clip-path: inset(50%);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute !important;
width: 1px;
word-wrap: normal !important;
}
.screen-reader-text:focus {
background-color: #f1f1f1;
border-radius: 3px;
box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
clip: auto !important;
clip-path: none;
color: #21759b;
display: block;
font-size: 0.875rem;
font-weight: 700;
height: auto;
left: 5px;
line-height: normal;
padding: 15px 23px 14px;
text-decoration: none;
top: 5px;
width: auto;
z-index: 100000;
}
/* Do not show the outline on the skip link target. */
#primary[tabindex="-1"]:focus {
outline: 0;
}
/* Alignments
--------------------------------------------- */
.alignleft {
/*rtl:ignore*/
float: left;
/*rtl:ignore*/
margin-right: 1.5em;
margin-bottom: 1.5em;
}
.alignright {
/*rtl:ignore*/
float: right;
/*rtl:ignore*/
margin-left: 1.5em;
margin-bottom: 1.5em;
}
.aligncenter {
clear: both;
display: block;
margin-left: auto;
margin-right: auto;
margin-bottom: 1.5em;
}
/**
* 1. Add the correct box sizing in Firefox.
* 2. Show the overflow in Edge and IE.
*/
hr {
box-sizing: content-box;
height: 0;
overflow: visible;
}
/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
pre {
font-family: monospace, monospace;
font-size: 1em;
}
/* Text-level semantics
========================================================================== */
/**
* Remove the gray background on active links in IE 10.
*/
a {
background-color: transparent;
}
/**
* 1. Remove the bottom border in Chrome 57-
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
*/
abbr[title] {
border-bottom: none;
text-decoration: underline;
text-decoration: underline dotted;
}
/**
* Add the correct font weight in Chrome, Edge, and Safari.
*/
b,
strong {
font-weight: bolder;
}
/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
code,
kbd,
samp {
font-family: monospace, monospace;
font-size: 1em;
}
/**
* Add the correct font size in all browsers.
*/
small {
font-size: 80%;
}
/**
* Prevent `sub` and `sup` elements from affecting the line height in
* all browsers.
*/
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}
/* Embedded content
========================================================================== */
/**
* Remove the border on images inside links in IE 10.
*/
img {
border-style: none;
}
/* Forms
========================================================================== */
/**
* 1. Change the font styles in all browsers.
* 2. Remove the margin in Firefox and Safari.
*/
button,
input,
optgroup,
select,
textarea {
font-family: inherit;
font-size: 100%;
line-height: 1.15;
margin: 0;
}
/**
* Show the overflow in IE.
* 1. Show the overflow in Edge.
*/
button,
input {
overflow: visible;
}
/**
* Remove the inheritance of text transform in Edge, Firefox, and IE.
* 1. Remove the inheritance of text transform in Firefox.
*/
button,
select {
text-transform: none;
}
/**
* Correct the inability to style clickable types in iOS and Safari.
*/
button,
[type=button],
[type=reset],
[type=submit] {
-webkit-appearance: button;
}
/**
* Remove the inner border and padding in Firefox.
*/
button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
border-style: none;
padding: 0;
}
/**
* Restore the focus styles unset by the previous rule.
*/
button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
outline: 1px dotted ButtonText;
}
/**
* Correct the padding in Firefox.
*/
fieldset {
padding: 0.35em 0.75em 0.625em;
}
/**
* 1. Correct the text wrapping in Edge and IE.
* 2. Correct the color inheritance from `fieldset` elements in IE.
* 3. Remove the padding so developers are not caught out when they zero out
* `fieldset` elements in all browsers.
*/
legend {
box-sizing: border-box;
color: inherit;
display: table;
max-width: 100%;
padding: 0;
white-space: normal;
}
/**
* Add the correct vertical alignment in Chrome, Firefox, and Opera.
*/
progress {
vertical-align: baseline;
}
/**
* Remove the default vertical scrollbar in IE 10+.
*/
textarea {
overflow: auto;
}
/**
* 1. Add the correct box sizing in IE 10.
* 2. Remove the padding in IE 10.
*/
[type=checkbox],
[type=radio] {
box-sizing: border-box;
padding: 0;
}
/**
* Correct the cursor style of increment and decrement buttons in Chrome.
*/
[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
height: auto;
}
/**
* 1. Correct the odd appearance in Chrome and Safari.
* 2. Correct the outline style in Safari.
*/
[type=search] {
-webkit-appearance: textfield;
outline-offset: -2px;
}
/**
* Remove the inner padding in Chrome and Safari on macOS.
*/
[type=search]::-webkit-search-decoration {
-webkit-appearance: none;
}
/**
* 1. Correct the inability to style clickable types in iOS and Safari.
* 2. Change font properties to `inherit` in Safari.
*/
::-webkit-file-upload-button {
-webkit-appearance: button;
font: inherit;
}
/* Interactive
========================================================================== */
/*
* Add the correct display in Edge, IE 10+, and Firefox.
*/
details {
display: block;
}
/*
* Add the correct display in all browsers.
*/
summary {
display: list-item;
}
/* Misc
========================================================================== */
/**
* Add the correct display in IE 10+.
*/
template {
display: none;
}
/**
* Add the correct display in IE 10.
*/
[hidden] {
display: none;
}
/* Box sizing
--------------------------------------------- */
/* Inherit box-sizing to more easily change it's value on a component level.
@link http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
*,
*::before,
*::after {
box-sizing: inherit;
}
html {
box-sizing: border-box;
}