/*
 * Base styles and typography
 */
:root {
  --primary-color: #007acc;
  --secondary-color: #0a0a0a;
  --black-color: #000000;
  --text-color: #f4f4f4;
  --link-color: #007acc;
  --padding: 1rem;
  --btn:#FF9800;
  --btn-hover:#673AB7; 
  --grid-max-width: 82rem;
  --spacing-huge-20: 20rem;
  --spacing-huge: 11rem;
  --spacing-mid-4: 4rem;
  --spacing-huge-8: 8rem;
  --midnight-navy:#041018;
  --midnight-navy-opacity:hsl(204, 71%, 5%, 0.6);
  --font-family: 'BentonSans', sans-serif;
  --text-transform: uppercase;
}
#block-multi-site-theme-primary-local-tasks {
  float: left;
  width: 100%;
}
#block-multi-site-theme-primary-local-tasks ul{
  padding: 0;
  margin: 7px;
}
#block-multi-site-theme-primary-local-tasks ul li{
  float: left;
  list-style-type: none;
  display: contents;
}
#block-multi-site-theme-primary-local-tasks ul li a{
  padding:10px;
  box-shadow: 0 0 3px lightgray;
}
#block-multi-site-theme-primary-local-tasks ul li a:hover {
    background-color: #f1f1f1;
}
#block-multi-site-theme-primary-local-tasks ul li::after {
  display: none;
}
.login .user-login-form,.user-pass{
    box-shadow: 0 0 8px lightgray;
    border-radius: 8px;
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
    text-align: center;
    background-color: #fff;
    margin-bottom: 20px;
}
.captcha {
    float: left;
}
.service-content-wrapper {
  background-color: var(--service-bg-color);
}
body {
  font-family: var(--font-family);
  font-weight: 400; 
  margin: 0;
  line-height: 1.6;
  opacity: 1;
  transition: opacity 0.5s ease;
}
body.fade-out {
  opacity: 0;
}
h1, h2, h3, h4 {
  font-family: var(--font-family);
  font-weight: 700; 
}
h2 {
  font-size: 3rem;
  line-height: 1;
}
h3 {
  font-size: 2rem;
  line-height: 1;
}
h4 {
  font-size: 1.8rem;
  line-height: 1;
}
.subheading {
  font-family: var(--font-family);
  font-weight: 300; 
}
table{
  border: 1px solid lightgray;
}
thead {
  background-color: lightgray;
}
td {
  border: 1px dashed lightgray;
}
input  {
    height: 38px;
    padding: 3px;
    margin: 6px;
    float: left;
    clear: left;
    width: -webkit-fill-available;
}
textarea {
    padding: 3px;
    margin: 6px;
    float: left;
    clear: left;
}
label {
    float: left;
    clear: left;
    width: 100%;
}
form {
    float: left;
}
/*
 * MOBILE-FIRST: Styles for the off-canvas menu (Default)
 * The primary menu is shown on mobile, secondary is hidden.
 */
.off-canvas-wrapper {
  overflow-x: hidden;
  position: relative;
}

.dialog-off-canvas-main-canvas {
  transition: transform 0.3s ease;
}
.top-bar {
    z-index: 5;
}
/* Primary Menu (Mobile Slide-out) */
.primary-menu img{
    height:auto;
    width:auto;
}
.primary-menu {
  position: fixed;
  top: 0;
  left: 0;
  width: 249px;
  height: 100vh;
  line-height: 1.9;
  background-color: #080018;
  transform: translateX(-100%);
  transition: transform 0.3s ease-in-out;
  padding: 2rem 2rem;
  z-index: 999;
background: linear-gradient(#080018, #080018) 50% 50%/calc(100% - 10px) calc(100% - 10px) no-repeat,
            linear-gradient(97deg, rgba(8,0,24,1) 0%, rgba(131,58,180,1) 40%, rgba(253,29,29,1) 70%, rgba(252,176,69,1) 100%);
}
.primary-menu .latest-block {width: 95%;color:#fff;float: left;padding: 10px 10px 50px 5px;margin: 3px;}
.primary-menu .latest-block header{color: #fff;}
.primary-menu .latest-block .views-row {position: relative;}
.primary-menu .latest-block .views-row h3{margin: 0;line-height: 0.5;}
.primary-menu .latest-block .views-field-field-profile-image {position: absolute;top:195px;float: left;}
.primary-menu .latest-block .views-field-field-profile-image img{bottom:-7px;width:25%;height:auto;border-radius:50%;border: 4px solid white;z-index: 1;position: relative;left: -15px;}
.primary-menu .latest-block .views-field-field-featured-image {float:left;position: relative;width:100%;height: auto;border-radius: 10%;}
.primary-menu .latest-block .views-field-field-featured-image::before {height:95%;border-radius: 50%;content: '';
    position: absolute;
    top: 0; 
    left: 0;
    right: 0;
    bottom:0;
    z-index: 0;    
    pointer-events: none;
    background: conic-gradient(
        from 0deg, 
        transparent 0%,
        #39FF14 5%,
        #FFFF00 15%,
        #FF00FF 25%,
        transparent 35%);

    animation: spin 3s linear infinite; 
    filter: blur(8px);
}
.primary-menu .latest-block .views-field-field-featured-image img{width:100%;height: auto;position: relative;z-index: 1;border-radius: 50%;object-fit: cover;}


.primary-menu .latest-block .views-row span{width: 100%;float: left;margin-top: 24px;background-color: #f4f4f461;padding: 7px 7px 15px;color: var(--text-color);border-radius: 0 15px 15px 15px;}
.primary-menu .latest-block .views-row time{font-size: 0.8rem;}
.primary-menu .latest-block .views-row .auth-name{font-size: 0.8rem;margin:0;display: contents;}

body.menu-active .primary-menu {
  transform: translateX(0);
  box-shadow: 0 0 8px black;
  overflow: auto;
}
body.menu-active .primary-menu::-webkit-scrollbar {width: 10px;}
body.menu-active .primary-menu::-webkit-scrollbar-track {background: #f1f1f1;border-radius: 5px;}
body.menu-active .primary-menu::-webkit-scrollbar-thumb { background: linear-gradient(to bottom, #d946ef, #7c3aed); border-radius: 5px;}
body.menu-active .primary-menu::-webkit-scrollbar-thumb:hover {background: linear-gradient(to bottom, #c026d3, #6d28d9);}
body.menu-active .primary-menu {scrollbar-color: #7c3aed #080018;scrollbar-width: thin;}
.primary-menu ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

/* Add toggle buttons on mobile */
.primary-menu li {
  position: relative;
}

.primary-menu li .submenu-toggle {
  position: absolute;
  right: 0;
  top: 0;
  padding: 0.5rem 1rem;
  cursor: pointer;
  font-weight: bold;
  color: var(--btn);
}

.primary-menu li ul {
  display: none;
  margin-left: 1rem;
  padding-left: 0.5rem;
  border-left: 2px solid rgba(255,255,255,0.2);
}

.primary-menu li.open > ul {
  display: block;
}

.primary-menu li.open > .submenu-toggle::after {
  content: "–";
}

.primary-menu li .submenu-toggle::after {
  content: "+";
}
.primary-menu a {
  text-decoration: none;
  color: #fff;
  font-size: 1rem;
  font-weight:normal;
}
.primary-menu #block-multi-site-theme-useraccountmenu-menu{border:1px solid; padding:5px;}


/* Hide secondary menu by default (mobile) */
.secondary-menu #block-multi-site-theme-mainnavigation {
  display: none;
}
.secondary-menu #block-multi-site-theme-dropdownlanguage-2{
  display: none;
}

.secondary-menu #block-multi-site-theme-mainnavigation li ul {border-radius:0 0 12px 12px;}
.site-header.scrolled #block-multi-site-theme-site-branding {opacity: 0;
    transition: 0.3s;}

.site-header.scrolled .secondary-menu #block-multi-site-theme-mainnavigation li ul {border-radius:12px 12px 0 0;}
.secondary-menu #block-multi-site-theme-mainnavigation li ul li ul{height: max-content;border-radius: 0 12px 12px 0;}
.site-header.scrolled .secondary-menu #block-multi-site-theme-mainnavigation li ul li ul{border-radius:0 12px 12px 0;}
/* Layout */
.layout-container {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

/* ===== Header ===== */

.site-header {
  background-color: transparent;
  padding: 1rem 0;
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 4;
  transition: bottom 0.5s ease-out, opacity 0.5s ease-out
}
.site-header.scrolled {
  top: auto;
  bottom: 30px;
  padding: 0.5rem 0;
}

.site-header-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding:0 20px;
  width: 100%;
  transition: bottom 0.5s ease-out, opacity 0.5s ease-out
}
#block-multi-site-theme-site-branding{
  background-color:var(--midnight-navy-opacity);
  border-radius: 50px;
  backdrop-filter: blur(8px);
  transition: bottom 0.5s ease-out, opacity 0.5s ease-out;
  text-align: center;
}
#block-multi-site-theme-site-branding img {
    width: 90%;
    height:auto;
}
/* New styles for the shrunken logo on scroll */

.site-header.scrolled .menu-toggle{
  position: absolute;
  right: 11px;
  bottom: 35px;
  transition: 0.5s;
}

/* Logo */
.site-logo img {
  max-height: 30px;
}

/* ===== Mobile Menu Toggle ===== */
.menu-toggle {
  background-color: var(--midnight-navy-opacity);
  border: none;
  cursor: pointer;
  padding: 10px;
  z-index: 1001;
  position: absolute;
  right: 10px;
  color: #fff;
  border-radius: 8px;
  backdrop-filter: blur(8px);
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
}

.menu-icon {
  display: block;
  width: auto;
  height: 24px;
}

.icon-bar {
  display: block;
  width: 100%;
  height: 2px;
  background-color: #fff;
  margin: 4px 0;
  transition: all 0.2s ease-in-out;
}

body.menu-active .menu-toggle .icon-bar:nth-child(2) {
  opacity: 0;
}

body.menu-active .menu-toggle .icon-bar:nth-child(1) {
  transform: translateY(6px) rotate(45deg);
}

body.menu-active .menu-toggle .icon-bar:nth-child(3) {
  transform: translateY(-6px) rotate(-45deg);
}

/* Video intro section */
#hero {
    position: relative;
    width: 100%;
    background-color: #000;
}
#hero .video-intro h2 {
  display:none;
}
.video-intro .views-row video {
  position: relative;
  width:1110px;
  z-index: 0;
  opacity: 0.5;
  transform: translate(-28%, 0);
}
/* Video Card intro section */
.video-intro .card {
    position: absolute;
    text-align: center;
    z-index: 1;
        bottom: -14%;
    transition: bottom 0.5s ease-out, opacity 0.5s ease-out;
    line-height: 1;
    border: 1px solid;
    color: #fff;
    background-color: var(--midnight-navy-opacity);
    backdrop-filter: blur(8px);
    border-radius: 12px 12px 0 12px;
    box-shadow: 8px 8px #673ab7;
        padding: 17px;
}
body.scrolled .whatsapp-bubble.bottom{
  bottom: 145px;
  transition: 0.5s;
}
  body.scrolled .video-intro .card{
    bottom: 310px;
    opacity: 0;
  }
.video-intro .card .field-content{
    margin:0 auto;
}
.video-intro .card .field-content h1 a {
  color:#fff;
  text-decoration: none;
}
.video-intro .card .field-content h1{
  margin:0;
  line-height: 1;
}
.video-intro .card .field-content .link1 a{
  background-color:var(--btn-hover);
  border-radius: 0 20px;
  padding: 10px;
  font-weight: bold;
  text-decoration:none;
  color:var(--text-color);
}
.video-intro .card .field-content .link1 a:hover{
  background-color:var(--btn);
  color:var(--text-color);
}

.video-intro .card .field-content .link2 a{
  background-color:var(--btn-hover);
  border-radius: 20px 0;
  padding: 10px;
  font-weight: bold;
  text-decoration:none;
  color:var(--text-color);
}
.video-intro .card .field-content .link2 a:hover{
  background-color:var(--btn);
  color:var(--text-color);
}

.video-intro .card p {
  margin: 10px;
  margin-bottom: 20px;
  font-size: 1rem;
    line-height: 1.3;
    color: #fff;
    
}
#projects{
  background-color: #000;
  float: left;
  width: 100%;
  color:#fff;
}
.projects{
  width:100%;  
  margin: 0 auto;
  position: relative;
  margin-top: 120px;
}
.projects h2{
  border-bottom:1px solid gray;
  width: 37px;
  font-size: 20px;
    line-height: 2;
    font-weight: 100;
    text-transform: uppercase;

}
body.scrolled .projects{
  padding: 10px;
  margin-top: -25px;
  width: 95%;
}
body.scrolled .projects h2{
  width: 250px;
  transition:width 3s linear 0s;

}
.projects .views-view-grid{
      display: contents;
}
.projects .views-view-grid .views-row{
  float: left;
    clear: both;
    width: 100%;
    margin-top: 30px;
    position: relative;
    left:-20px;
    margin-bottom: 77px;
}
.projects .views-view-grid h3 {
  font-size: 1.5rem;
  line-height: 1;
  margin-top:0;
  z-index: 1;
  position: relative;
  left: 23px;
}
.projects .views-view-grid h3 a {
  text-decoration: none;
  color: #fff;
  font-size: 1.8rem;
  position: relative;
  left: 20px;
  top:52px;
}
.projects .views-row .views-field-field-description {
    position: absolute;
    z-index: 1;
    width: 315px;
    margin-left: 47px;
    top:166px;
}
.projects .views-row .views-field-field-background-colour {
    position: absolute;
    width: 100%;
    top:77px;
}
.projects .views-row .views-field-field-featured-image {
    float: right;
    z-index: 1;
    position: relative;
    bottom: 27px;
    left: 6px;
}
.projects .views-row .views-field-field-featured-image img {
    float: right;
    width: 185px;
    height: auto;
}
.projects .views-row:hover .color-pickr-square {
  width: 95%;
  transition: all 0.5s ease;
  height: 300px;
  position: relative;
  bottom: 120px;
  left:10px;
  border-radius:18px;
  transform: rotate(-3deg);
}
.projects .views-row .color-pickr-square {
  transition: all 0.5s ease;
 margin-left: 20px;
 border-radius: 20px;

}
.projects footer{
  width:100%;
  text-align: center;
}
.projects footer a{
  padding: 20px;
  border-color: var(--text-color);
  border: 1px solid;
  background-color: transparent;
  color: #fff;
  text-decoration: none;
  font-weight: 600;
  opacity: 0.8;
  transition: bottom 1.5s ease-out, opacity 1.5s ease-out;
}

.projects footer a:hover{
  opacity: 1;
  color:#fff;
}

#about{
  width:100%;
  transition: bottom 4.5s ease-out, opacity 4.5s ease-out;
  opacity: 0;
  line-height: 0;
  background-color:#000;
  float: left;
  color:#fff;
}
body.scrolled #about{
  opacity: 1;
}
#about .views-field-nothing-1{
  float: left;
    width: 100%;
}
.about img{
  width:100%;
  height: auto;
  line-height: 0;
  opacity: 0.6;
}

.about .views-field-nothing-1 .field-content {
    position: relative;
    float: left;
    line-height: 1;
    max-width: 540px;
    text-shadow: 0 0 17px black;
    bottom:74px;
    z-index: 1;
    padding: 20px;
    opacity: 0.95;
}
.about .views-field-nothing-1 .field-content a{
  text-transform: uppercase;
  text-decoration: none;
  color: #f4f4f4;
  border-bottom: 1px solid gray;
  width: 185px;
  transition:3.5s;
}
body.scrolled .about .views-field-nothing-1 .field-content a{
    width: 299px;
    float: left;
    padding-bottom: 12px;
}
.about .views-field-nothing-1 .field-content h2{
    font-size: 2rem;
    padding: 0;
    margin-top: 1rem;
    margin-bottom: 1rem;
    float: left;
}
.about .views-field-nothing-1 .field-content p{
  font-size: 20px;
  line-height: 1.3;
  float:left;
}
.about footer{
    background: #000;
    background: -webkit-linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.08) 6%, rgba(0, 0, 0, 0.44) 31%, rgba(0, 0, 0, 0.74) 62%, rgba(0, 0, 0, 1) 100%);
    background: -moz-linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.08) 6%, rgba(0, 0, 0, 0.44) 31%, rgba(0, 0, 0, 0.74) 62%, rgba(0, 0, 0, 1) 100%);
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.08) 6%, rgba(0, 0, 0, 0.44) 31%, rgba(0, 0, 0, 0.74) 62%, rgba(0, 0, 0, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000", endColorstr="#000000", GradientType=0);
    position: relative;
    top: -56px;
    height: 57px;
}
#logos {
  width: 100%;
  margin: 0 auto;
  max-width: 1063px;
  bottom: 60px;
  position: relative;
}

#logos img {
    width: 51px;
    height: auto;
    float: left;
    margin: 6px;
    padding: 1px;
    opacity: 0;
    transition: bottom 5s ease-out, opacity 5s ease-out;
}
body.scrolled #logos img{
  opacity: 1;
}
#service_box{
    background-color: #fff;
    float: left;
    width: 100%;
    color: var(--midnight-navy);
    box-shadow: 0 0 22px black;
    padding: 5rem 0 5rem 0;
    position: relative;
    padding-bottom: 5px;
    padding-top: 5px;
    width: 1%;
    opacity: 0;
}
body.scrolled #service_box {
    width: 100%;
    opacity: 1;
    transition:0.5s;
}
#service_box::before {
  content: ''; 
  position: absolute; 
  bottom: 0; 
  left: 0; 
  width: 100%; 
  height: 5px;
  background: radial-gradient(circle, rgba(131, 58, 180, 1) 0%, rgba(253, 29, 29, 1) 50%, rgba(252, 176, 69, 1) 100%);
}
#service_box::after {
  content: ''; 
  position: absolute; 
  top: 0; 
  left: 0; 
  width: 100%; 
  height: 5px;
  background: radial-gradient(circle, rgba(131, 58, 180, 1) 0%, rgba(253, 29, 29, 1) 50%, rgba(252, 176, 69, 1) 100%);
}
#service_box .service {
    margin: 0 auto;
    max-width: 1512px;
    width:100%;
    transition: bottom 1.5s ease-out, opacity 1.5s ease-out;
}

#service_box .service header {
    float: left;
    margin: 10px;
    padding: 10px;
    top: 0;
    position: relative;
}
#service_box .service header h2 {
    font-size: 3.8rem;
    float: left;
    max-width: 458px;
    line-height: normal;
    margin: 0;
    position: relative;
}
#service_box .service header p{
  text-transform: uppercase;
  text-decoration: none;
  color: #585858;
}
#service_box .service .views-row {
    float: right;
    max-width: 482px;
    padding: 7px;
    display: inline-flex;
    margin: 6px;
    border-bottom: 1px lightgray dashed;
    box-shadow:0;
}
#service_box .service .views-row:hover {
    box-shadow: 0 0 11px lightgray;
    border-radius: 8px;
    transition: 0.5s;
}
#service_box .service .views-row h3{
  font-size: 1.6rem;
}
#service_box .service .views-row h3 a{
  text-decoration: none;
  color: var(--btn-hover);
  
}
#service_box .service .views-row .field-content {
    padding: 0;
    float: left;
}

#magazine{
  float:left;
  width:100%;
  background-color: #000;
  color:#fff;
  padding-bottom:50px;
}
#magazine .views-element-container {
    margin: 0 auto;
}
#magazine .views-element-container header{
  border-bottom:1px solid gray;
  width: 37px;
}
body.scrolled #magazine .views-element-container header{
  width: 174px;
  transition:width 3s linear 0s;
}

#magazine .views-row {
  float: left;
  width: 100%;
 
}
#magazine .views-row .views-field-field-featured-image {
  max-width: 390px;
  height: auto;
  padding: 15px;
  float: left;
  margin: 15px;
  background: radial-gradient(circle, rgba(252, 176, 69, 1) 0%, rgba(253, 29, 29, 1) 50%, rgba(131, 58, 180, 1) 100%);
  transition: all 0.5s ease;
  border-radius: 10px;
}
#magazine .views-row .views-field-field-featured-image:hover {
    max-width: 500px;
    box-shadow: 0 0 20px rgba(0,255,255,0.5);
}

#magazine .views-row .views-field-field-featured-image img{
  max-width: 100%;
  height: auto;
    border-radius: 0;
  transition: all 0.5s ease;
}

#magazine .views-row .views-field-field-featured-image img:hover{
    box-shadow: 0 0 20px #000;
    transition: transform 1.5s ease-out, opacity 1.5s ease-out;
    transition: all 0.5s ease;
    border-radius: 10px;
}
#magazine .views-row .views-field-nothing {
    padding: 12px;
    float: left;
}
#magazine .views-field-nothing span {
    color: gray;
}
#magazine .views-field-nothing span p {
  color:#fff;
}
#magazine .views-row .views-field-nothing h3{
  font-size: 1.7rem;
  margin-top: 0;
}
#magazine .views-row .views-field-nothing h3 a{
  text-decoration: none;
  color:#fff;

}
#magazine .views-field-nothing img {
    width: 70px;
    height: auto;
    border-radius: 50%;
    float: left;
}
#magazine .views-field-nothing a {
    text-decoration: none;
    color: #fff;
}
#magazine .views-field-nothing .auth-name {
    color: #fff;
    padding: 5px;
    float: left;
}
#ctadefault{
    float: left;
    width: -webkit-fill-available;
    position: relative;
    background: var(--btn-hover);

}
#ctadefault iframe {
    width: 100%;
    padding: 0;
    margin: 0;
    position: relative;
}
#ctadefault .ctabox{
    padding: 10px;
    box-shadow: 10px 10px 0px #ed842b;
    background-color: #080018;
    color: #fff;
    text-align: center;
    margin: 0 auto;
    position: relative;
    z-index: 1;
    bottom: 23px;
}
#ctadefault h2{
  margin-bottom: 0;
}
#ctadefault p a:hover {
  border-bottom: 2px solid red;
  transform: scaleX(1.5);
  transition: transform 1.5s ease-out, opacity 1.5s ease-out;
  transition: all 0.5s ease;
  box-shadow: 0 0 3px black;
}
#ctadefault p a {
  color: #fff;
  text-decoration: none;
  font-size: 1rem;
  transform: scaleX(1.5);
  transition: all 0.5s ease;
  padding: 10px;
  background-color: #4b3ac6;
}
#block-multi-site-theme-ctadefault{
  text-align: center;
  color: #fff;
  background-color: #080018;
  border-radius: 25px 25px 25px 0;
  padding: 10px;
  margin-bottom: 44px;
  box-shadow: 10px 10px 0px #ed842b;
  float: left;
}
#block-multi-site-theme-ctadefault h2{
  margin-bottom: 0;
}
#block-multi-site-theme-ctadefault p a:hover {
  border-bottom: 2px solid red;
  transform: scaleX(1.5);
  transition: transform 1.5s ease-out, opacity 1.5s ease-out;
  transition: all 0.5s ease;
  box-shadow: 0 0 3px black;
}
#block-multi-site-theme-ctadefault p a {
  color: #fff;
  text-decoration: none;
  font-size: 1rem;
  transform: scaleX(1.5);
  transition: all 0.5s ease;
  padding: 10px;
  background-color: #4b3ac6;
}
.site-footer{
  text-align: center;
}
.site-footer img{
    height:auto;
}
.site-footer::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 5px;
    background: radial-gradient(circle, rgba(131, 58, 180, 1) 0%, rgba(253, 29, 29, 1) 50%, rgba(252, 176, 69, 1) 100%);
}
.site-footer h2{
  font-size: 1.2rem;
  text-align: left;
  padding-left: 40px;
  padding-bottom: 0;
  margin-bottom: 0;
  text-transform: uppercase;
  font-weight: normal;
}
.site-footer a{
  color:#fff;
  text-decoration: none;
}

.site-footer #block-multi-site-theme-copyrights{
  width: 100%;
  text-align: center;
  float:left;
}
.site-footer #block-multi-site-theme-footer-menu{
  float: left;
}
/* ========= #live-chat =========*/
.site-footer #live-chat{
  color: #000;
}
.site-footer #live-chat .chat-message img {
  border-radius: 15%;
}
.klaro_toggle_dialog{
  bottom: 10px;
  right: 18px;
}
body.scrolled .klaro_toggle_dialog {
    bottom: 15px;
}
body.scrolled .site-footer img{
  opacity: 1;
}
/* Main content */
.full-width-view {
  max-width: var(--grid-max-width);
  flex-direction: column;
}
.full-width-view table {
    text-align: center;
    margin: 0 auto;
    border-radius: 5px;
    overflow-x: scroll;
}
.main-content {
  flex: 1;
  padding: var(--padding);
  display: flex;
  flex-direction: column;
  clear:left;
}
.region-breadcrumb{
  padding-top: 25%;
  margin: 0 auto;
  z-index: 2;
  position: relative;
}
.region-breadcrumb ol {padding: 0 20px;margin: 35px 0 0;}
.region-breadcrumb li {
  float: left;
  list-style-type: none;
  display: contents;
}
.region-breadcrumb li a {
  color: #333;
}
/* Footer */
.footer-block{
    width: 100%;
    float: left;
    background-color: #080018;
    padding-bottom: 50px;
    padding-top: 20px;
}
.site-footer {
  margin: 0 auto;
  max-width: 1150px;
  background-color: #080018;
  color: #fff;
  padding: var(--padding);
  text-align: center;
  padding-bottom: 60px;
}
.site-footer ul{
  float: left;
  width: 200px;
  text-align: left;
}
.site-footer li{
  list-style-type: none;
}
.site-footer nav{
  float: left;
  width: 100%;
  max-width: 14rem;
}
/* Sidebar */
.region-content {
  flex-grow: 1;
}
.region-sidebar {
  background-color: #fff;
  padding: var(--padding);
  margin-top: var(--padding);
}
/* ===== blog-post/ Magazine pages Styles  ===== */

.blog-post{
  width:100%;
  margin:0 auto;
}
.blog-post h1{
  margin: 0;
}
.blog-post h1 a{
  text-decoration: none;
  font-size:3rem;
  color:var(--midnight-navy);
  line-height: 0.9;
}
.blog-post .blog-author-info{
  float:left;
  padding-bottom:30px;
}
.blog-post .blog-author-info p {
    float: left;
    padding: 9px;
}
.blog-post .blog-author-info .author-image{
  float: left;
}
.blog-post .blog-author-info .author-image img{
  float:left;
  width:75px;
  height: 75px;
  border-radius: 50px;
}
.blog-post .blog-post-image {
  background: #FCB045;
  background: radial-gradient(circle, rgba(252, 176, 69, 1) 0%, rgba(253, 29, 29, 1) 50%, rgba(131, 58, 180, 1) 100%);
  border-radius: 5px;
  text-align: center;
  padding: 0;
  transition: transform 1.5s ease-out, opacity 1.5s ease-out;
  transition: all 0.5s ease;
  clear: left;
}
.blog-post .blog-post-image:hover {
  opacity: 1;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
  background: transparent();
}
.blog-post .blog-post-image img {
  width: 100%;
  box-shadow:0 0 8px black;
  border-radius: 20px;
  transform: rotate(20deg);
  transition: transform 1.5s ease-out, opacity 1.5s ease-out;
  transition: all 0.5s ease;
}
.blog-post .blog-post-image img:hover{
  transform: rotate(0deg);
  transition: transform 1.5s ease-out, opacity 1.5s ease-out;
  transition: all 0.5s ease;
}
.blog-post .blog-post-body {
  margin:0 auto;
  padding-top:60px;
}
.magazine header h1{padding-bottom: 10px;margin: 0;line-height: 1;font-size: 2.5rem;}
.magazine .views-infinite-scroll-content-wrapper{float:left;width: 100%;margin-top:25px;}
.magazine .views-infinite-scroll-content-wrapper .views-field-nothing .maghead-image img{width: 100%;float: left;height: auto;}
.magazine .views-infinite-scroll-content-wrapper .views-field-nothing .magprof-image img{box-shadow: 0 0 8px lightgray;width: 70px; height: auto;float: left;border-radius: 50px;}
.magazine .views-infinite-scroll-content-wrapper .views-field-nothing .auth-name{float:left;padding:10px;margin:10px;}
.magazine .views-infinite-scroll-content-wrapper .views-field-nothing time{float: left;clear: left;width: 100%;}
.magazine .views-infinite-scroll-content-wrapper .views-field-nothing h3{margin: 0;}
.magazine .views-infinite-scroll-content-wrapper .views-field-nothing h3 a {margin: 0;color: #000;text-decoration: none;}
.magazine .views-infinite-scroll-content-wrapper .views-view-responsive-grid__item {box-shadow: 0 0 8px lightgray;padding: 10px;border-radius: 15px;}
.magazine .views-infinite-scroll-content-wrapper .views-view-responsive-grid__item p{margin:0;}
@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.magazine .views-field-field-featured-image {
    position: relative; 
    width: 100%; 
    height: auto;
    border-radius: 50%;
}

.magazine .views-field-field-featured-image::before {
    content: '';
    position: absolute;
    top: 0; 
    left:0;
    right:0;
    bottom: 0;
    z-index: 0;
    pointer-events: none;
    border-radius: 50%;
    background: conic-gradient(
        from 0deg, 
        transparent 0%,
        #39FF14 5%,    
        #FFFF00 15%,    
        #FF00FF 25%,    
        transparent 35% 
    );
    animation: spin 3s linear infinite;
    filter: blur(44px); 
}

.magazine .views-field-field-featured-image img {
    position: relative; 
    z-index: 1; 
    border-radius: 10%;
    object-fit: cover;
    width:100%;
    height: auto;
}
.magazine .views-field-title-1 h3{margin-top:0;}
.magazine .views-field-title-1 h3 a{margin:0;color: #000;text-decoration: none;}
.magazine .views-field-title-1 img {box-shadow: 0 0 8px lightgray;width: 70px;height: auto;float: left;border-radius: 50px;}

.magazine .views-field-title-1 .auth-name {float: left;padding: 10px;margin: 10px;}
/* ===== Services pages Styles  ===== */
.service-page{
  width: 100%;
}
.service-page .view-header{
  max-width: var(--grid-max-width);
  margin: 0 auto;
}
.service-page header{
  max-width: var(--grid-max-width);
  margin: 0 auto;
}
.service-page .view-header h1{
  font-size: 5.5rem;
  line-height: 0.9;
  margin: 0 ;
}
.service-page header h1{
  line-height: 0.9;
  margin: 0 ;
}

.service-page .views-row a{
  text-decoration: none;
  color:#000;
}
.service-page .views-row span {
    margin: 0 auto;
    max-width: var(--grid-max-width);
    display: block;
    position: relative;
    z-index: 1;
    padding: 0px 14px 0px;
}
.service-page .views-row .field-content h3{
  float: left;
  padding-top: 1px;
}
.service-page .views-row:hover .field-content h3{
  padding-top: 20px;
  transition: transform 1.5s ease-out, opacity 1.5s ease-out;
  transition: all 0.5s ease;
}
.service-page .views-row .field-content .services{
  float: left;
  max-width: 700px;
  clear:left;
}
.service-page .views-row .field-content .learn{
  float: left;
  clear:left;
}
.service-page .views-row .field-content .learn a{
    color: #fff;
    float: left;
    padding: 10px;
    text-decoration: none;
    background-color: #041018;
    border-radius: 30px;
    box-shadow: 0 0 24px black;
}
.service-page .views-row .field-content .brand-icons{
  text-align: right;
}
.service-page .views-row .field-content .brand-icons img{
    width:100%;
    max-width:353px;
    height: auto;
    padding: 5px;
}
.service-page .views-row .views-field-field-background-colour{
  position: relative;
}
.service-page .views-row .views-field-field-background-colour .color-pickr-square{
    margin: 0;
    width: 95%;
    height: 390px;
    position: absolute;
    transition: all 0.5s 
ease;
    border: 11px solid;
    border-radius: 25px;
}
.service-page .views-row:hover .views-field-field-background-colour .color-pickr-square {
    height: 600px;
  transform: rotate(-2deg);
  transition: all 0.5s ease;
  width: 90%;
}

.service-bg-content {
    position: absolute;
    top: 0;
    width: 100%;
    left: 0;
    z-index: 1;
}
.service-bg-content::after {
    content: '';
    position: absolute;
    left: 0;
    width: 100%;
    height: 6px;
    background: radial-gradient(circle, rgba(131, 58, 180, 1) 0%, rgba(253, 29, 29, 1) 50%, rgba(252, 176, 69, 1) 100%);
}
.service-bg-content .color-pickr-square {
    width: 100%;
    min-height: 100vh;
    margin: 0;
}
.service-bg-cover{
    position: absolute;
    top: 0;
    width: 100%;
    left: 0;
    z-index: 1;
}
.service-bg-cover img{
  width: 100%;
  height: auto;
}
.service-article {
    z-index: 3;
    position: relative;
    max-width: var(--grid-max-width);
    margin: 0 auto;
}
.service-article header{
  float: left;  
}
.service-article h1 {
  float: left;
  margin:0;
}

.service-article h1 a {
    text-decoration: none;
    color: var(--midnight-navy);
    line-height:1;
    text-shadow: 0 0 9px #212020;
    font-size: 2.8rem;
}
.service-article .service-image{
  float: right;
  width: 100%;
  text-align: center;
  margin: 0;
}
.service-article .service-image img{
  transform: rotate(20deg);
  transition: transform 1.5s ease-out, opacity 1.5s ease-out;
  transition: all 0.5s ease;
  position: relative;
  border-radius: 25px;
  max-width: 335px;
}
.service-article .service-image img:hover{
  transform: rotate(0deg);
  transition: transform 1.5s ease-out, opacity 1.5s ease-out;
  transition: all 0.5s ease;
  box-shadow: 0 0 8px rgb(177, 177, 177);
  background-color: #fff;
}
.service-article .service-description {
    clear: left;
    padding-top: 3rem;
    padding-bottom: var(--spacing-huge-8);
}

.service-article .service-body {
    max-width: 1000px;
    margin: 0 auto;
    padding-top:20px;
}
#cta-box {
  width: 100%;
  float: left;
}
#cta-box .service-bg-cta {
    float: left;
    width: 100%;
}
#cta-box .service-bg-cta .color-pickr-square {
    width: 100%;
    height: 400px;
    margin: 0;
}
#cta-box .related-managers-list {
    position: absolute;
    z-index: 1;
    width: 100%;
}
#cta-box .related-managers-list .about{
  max-width: 1224px;
  margin: 0 auto;
  padding:13px;
}
#cta-box .related-managers-list .about header{
  max-width: 595px;
  float: left;
}
#cta-box .related-managers-list .about header h2{
  margin-bottom: 0;
}
#cta-box .related-managers-list .about .views-field-nothing {
  padding: 30px;
  text-align: center;
  display:none;
}
#cta-box .related-managers-list .about .managers .managers-image img{
  width:44px;
  height:auto;
  border-radius: 100px;
  opacity: 1;
}
#cta-box .related-managers-list .about footer{
  float: left;
  clear: left;
  background: none;
  position: initial;
  width:100%;
}
#cta-box .related-managers-list .about footer a{
  padding: 25px 50px;
  background-color: #080018;
  color: #fff;
  text-decoration: none;
  margin: 0 20px;
  font-size: 1rem;
  transform: scaleX(1.5);
  transition: all 0.5s ease;
  border: 0;
  top: 25px;
  position: relative;
  
}
#cta-box .related-managers-list .about footer a:hover{
  border-bottom: 2px solid red;
  transform: scaleX(1.5);
  transition: all 0.5s ease;
  box-shadow:0 0 3px black;
}
/* ===== Desktop Styles (>=768px) ===== */
@media (min-width: 768px) {
  .klaro_toggle_dialog{right: 10px;}

  .login .user-login-form,.user-pass{padding:40px;}
  body.scrolled .klaro_toggle_dialog{bottom: 10px;right: 10px;}
  body.scrolled .projects h2{margin-top: -100px;}
  .projects{top: -93px;width:90%;}
  .projects .views-view-grid .row-1 .views-field-field-featured-image{height: 352px;}
  .projects .views-row .views-field-field-featured-image{left:0;bottom:0;}
  .projects .views-row .views-field-field-featured-image img{width:260px}
  .projects .views-row .views-field-field-background-colour{top:75;}
  .projects .views-row:hover .color-pickr-square {width:100%;left:-3px;transform: rotate(-5deg);}
  .projects .views-view-grid .views-row{margin-bottom: 77px;}
  .projects .views-row .views-field-field-description{top:150px;}
  .whatsapp-bubble.bottom {bottom: 60px;}
  h1{font-size: 1.5rem;line-height: 1;}  
  .video-intro .card .field-content h1 {font-size: 1.5rem;}
  p,span,body{font-size: 0.8rem;}
  .site-header.scrolled{bottom:0;}
  .site-header.scrolled .site-header-inner{max-width: fit-content;}
  .menu-toggle{
    background-color: var(--midnight-navy-opacity);
    border-radius: 50px;
    padding: 0.4rem 1rem;
    backdrop-filter: blur(8px);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
  }
  .menu-icon{
    width: 24px;
  }
  .blog-post .blog-post-image img{max-width: 480px;}
  .blog-post .blog-post-image img{max-width: 378px;}
  .site-header.scrolled .menu-toggle{
    position: relative;
    background-color: #fff;
    bottom: 0;
    right: 8px;
  }
  
  .site-header.scrolled .menu-toggle span{color: #000;}
  .site-header.scrolled .menu-toggle .icon-bar{background-color: #000;}
  #block-multi-site-theme-ctadefault{width:100%;margin-top: 40px;}
  #block-multi-site-theme-site-branding{width: auto;margin-left: 0;}
    
.site-header.scrolled #block-multi-site-theme-site-branding {
width: auto;
        height: 50px;
        margin: 0px 8px 0px 0px;
        border-radius: 50%;
        background-color: #fff;
        opacity: 1;
        box-shadow: 0 0 8px gray;
        position: relative;
        top: 0;
        padding: 0px 2px 3px;
}
.site-header.scrolled #block-multi-site-theme-site-branding a {
        float: left;
        width: 41px;
        height: 45px;
        background-color: #fff;
        border-radius: 50%;
        padding: 0px 5px 4px 2px;
        left: 0px;
        top: 2px;
        position: relative;
}
.site-header.scrolled #block-multi-site-theme-site-branding img {
        clip-path: circle(150% at -80% 63%);
        width: 111px;
        height: auto;
        object-fit: contain;
        position: relative;
        z-index: 1;
        right: 6px;
}
.site-header.scrolled #block-multi-site-theme-site-branding::before {
        content: '';
        position: absolute;
        top: -8px;
        left: -8px;
        right: -8px;
        bottom: 0;
        z-index: -1;
        pointer-events: none;
        border-radius: 50%;
        background: conic-gradient(from 0deg, transparent 0%, #39FF14 5%, #FFFF00 15%, #FF00FF 25%, transparent 35%);
        animation: spin 7s linear infinite;
        filter: blur(20px);

} 
.site-header.scrolled #block-multi-site-theme-site-branding:hover::before{
  animation: spin 0.7s linear infinite;
  filter: blur(1px);
  background: conic-gradient(from 0deg, transparent 0%, #fd2c21 10%, #ed832b 20%, var(--btn-hover) 30%, transparent 40%);
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
  /* Hide hamburger on desktop */
  .menu-toggle {display: flex;}
  
  .menu-text{color: #fff;padding: 4px;font-size: 100%;}
  /* Hide slide-out on desktop */
  .secondary-menu {width: 100%;max-width: 545px;}
  .secondary-menu #block-multi-site-theme-dropdownlanguage-2 {
    float: right;
    position: relative;
    display:block;
  }
  #block-multi-site-theme-dropdownlanguage-2 ul{
    position: absolute;
    top: 0px;
    right: 0;
    color: #fafafa;
    align-items: center;
    background-color: var(--midnight-navy-opacity);
    border-radius: 50px;
    backdrop-filter: blur(8px);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
  }
  #block-multi-site-theme-dropdownlanguage-2 ul a{color: #fff;}
  /* Show secondary (desktop) nav */
  .secondary-menu #block-multi-site-theme-mainnavigation{
    display: flex;
    align-items: center;
    background-color: var(--midnight-navy-opacity);
    border-radius: 50px;
    padding: 0.4rem 1rem;
    backdrop-filter: blur(8px);
    box-shadow: 0 4px 15px rgba(0,0,0,0.3);
    float:left;
  }
  .secondary-menu #block-multi-site-theme-mainnavigation ul {
    align-items: center;
    gap: 1.5rem;
    margin: 0;
    padding: 0;
    list-style: none;
  }
  .secondary-menu #block-multi-site-theme-mainnavigation li {display: inline-block;}
  .secondary-menu #block-multi-site-theme-mainnavigation a {
    color: #fff;
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s ease;
    margin: 0 ;
    padding:10px 20px;
  }
  .secondary-menu #block-multi-site-theme-mainnavigation a:hover {color: #a0a0ff;}
  /* Buttons (desktop only) */
  .secondary-menu .menu-register a {
    background: linear-gradient(90deg, #7a5cff, #ff4ecd);
    color: #fff;
    padding: 0.4rem 1rem;
    border-radius: 30px;
    font-weight: bold;
    margin-left: 1rem;
    transition: opacity 0.2s ease;
  }

  .secondary-menu .menu-register a:hover {opacity: 0.8;}
  /* Parent menu item */
  .secondary-menu #block-multi-site-theme-mainnavigation li {position: relative;}

  /* Hide dropdown by default */
  .secondary-menu #block-multi-site-theme-mainnavigation li ul {
    display: none;
    position: absolute;
    left: 0;
    width: max-content;
    background: var(--midnight-navy-opacity);
    padding: 1rem 0;
    box-shadow: 0 8px 20px rgba(0,0,0,0.4);
    z-index: 999;
    margin: 6px 0 0 0;
  }

  /* Dropdown item styles */
  .secondary-menu #block-multi-site-theme-mainnavigation li ul li ul{left:100%;top:0%;}
  .secondary-menu #block-multi-site-theme-mainnavigation li ul li {
    display: block;
    margin: 0;
  }

  .secondary-menu #block-multi-site-theme-mainnavigation li ul li a {
    display: block;
    padding: 0.6rem;
    color: #fff;
    transition: background 0.3s ease, color 0.3s ease;
    width:auto;
  }

  .secondary-menu #block-multi-site-theme-mainnavigation li ul li a:hover {
    background-color: var(--midnight-navy);
    color: #fff;
  }

  /* Show dropdown on hover */
  .secondary-menu #block-multi-site-theme-mainnavigation li:hover > ul {
    display: block;
    animation: fadeInUp 0.3s ease forwards;
  }
  .site-header.scrolled .secondary-menu #block-multi-site-theme-mainnavigation li:hover > ul {
    bottom: 25px;
  }
  .site-header.scrolled .secondary-menu #block-multi-site-theme-mainnavigation {
    background-color: hsl(0deg 0% 100%);
    
  }
  .site-header.scrolled .secondary-menu #block-multi-site-theme-mainnavigation li ul{
    background-color: hsl(0deg 0% 100%);
    border-radius: 20px 20px 20px 0;
    left: 28px;
    margin-bottom: 5px;
  }
  .site-header.scrolled .secondary-menu #block-multi-site-theme-mainnavigation li ul li a:hover{background-color: var(--text-color);}
  .site-header.scrolled .secondary-menu #block-multi-site-theme-mainnavigation a{color:#000;}
  /* Animation */
  @keyframes fadeInUp {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
  }
  .secondary-menu .menu-login a {
    background: #fff;
    color: #000;
    padding: 0.4rem 1rem;
    border-radius: 30px;
    font-weight: bold;
    margin-left: 0.5rem;
    transition: background 0.2s ease;
  }

  .secondary-menu .menu-login a:hover {
    background: #f0f0f0;
  }
  .video-intro .views-row video {
    width:100%;
    transform: none;
    background-color: #000;
  }
  .video-intro .card {
    transition: bottom 0.5s ease-out, opacity 0.5s ease-out;
    line-height: 1;
    border: 1px solid;
    color: #fff;
    background-color: var(--midnight-navy-opacity);
    backdrop-filter: blur(8px);
    border-radius: 12px 12px 0 12px;
    box-shadow: 8px 8px #673ab7;
    left:15%;
    bottom:25%;
  }
  .video-intro .card {
    border-bottom: 1px solid gray;
    width: 185px;
    transition:3.5s;
  }
  body.scrolled .video-intro .card{
    bottom: 310px;
    opacity: 0;
    width: 300px;
  }
  .video-intro .card .field-content{
    display: inline-block;
    padding: 10px 10px 10px 10px;
    text-align: center;
    margin-bottom: 15px;
  }
  .video-intro .card .field-content a {
    color:#fff;
  }
  .video-intro footer{
    background: #000;
    background: -webkit-linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.08) 6%, rgba(0, 0, 0, 0.44) 31%, rgba(0, 0, 0, 0.74) 62%, rgba(0, 0, 0, 1) 100%);
    background: -moz-linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.08) 6%, rgba(0, 0, 0, 0.44) 31%, rgba(0, 0, 0, 0.74) 62%, rgba(0, 0, 0, 1) 100%);
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.08) 6%, rgba(0, 0, 0, 0.44) 31%, rgba(0, 0, 0, 0.74) 62%, rgba(0, 0, 0, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000", endColorstr="#000000", GradientType=0);
    position: relative;
    bottom: 55px;
    height: 50px;
    
  }
  #about .views-field-nothing-1{
  float: left;
    width: 100%;
    position: absolute;
}
  .about .views-field-nothing-1 .field-content {
  bottom: 620px;
  left: 310px;}
  .about .views-field-nothing-1 .field-content h2{
    font-size: 3rem;
  }
  #logos{bottom:100px;}
  #logos img{
    width: 75px;
    padding: 5px;
    margin: 5px;
  }
  #service_box .service header {
    top: 244px;
  }
  #service_box .service .views-row .field-content{
    padding: 0px;
  }
  /* BreadCrumb */
  .region-breadcrumb{
    max-width: 1000px;
    padding-top: 22%
  }
  .region-breadcrumb li {
    float: left;
    list-style-type: none;
    display: contents;
  }
  .region-breadcrumb li a{
    color:#333;
  }
  .region-breadcrumb li:not(:last-child)::after {
    content: ' › ';
    color:var(--midnight-navy);
    padding: 0 0.5rem;
  }
  .region-breadcrumb ol{
    padding:0;
  }
  /* Layout */
  .main-content {
    flex-direction: row;
    width:var(--grid-max-width);
    margin: 0 auto;
  }
  .full-width-view {
    width: 1000px;
    flex-direction: column;
    padding: 0;
  }
  .region-content {
    order: 2;
  }
  .projects .views-view-grid h3 span{
    font-size: 2rem;
  }
  .service-article{
    width:100%;
  }
  .service-article header{
    width: 66%;
  }
  .service-article .service-image {
      float: right;
      width: 33%;
      padding: 0;
      margin: 0;
  }
  .service-article .service-image img {
    max-width: 375px;
  }
  .service-article .service-image img:hover{
    max-width: 325px;
    background-color: #fff;
  }
  .service-article .service-description{
    padding-top: 2rem;
    padding-bottom:2rem;
    width:50%;
  }
  .service-bg-content .color-pickr-square{
    min-height: 99vh;
  }
  .service-page .views-row .views-field-field-background-colour .color-pickr-square{
    height: 300px;
    width:95%;
  }
    .service-page .views-row:hover .views-field-field-background-colour .color-pickr-square{
    height: 350px;
    width:95%;
  }
  .service-page .views-row .field-content .brand-icons img{
    margin:16px;
  }
  .region-sidebar {
    order: 1;
    min-width: 300px;
    margin-right: var(--padding);
    margin-top: 0;
  }
  .site-footer nav{
    max-width: 215px;
  }
  #magazine header p {
    font-size: 2.5rem;
    width: max-content;
  }
  #magazine .views-element-container{
    width: 100%;
    max-width: 1040px;
    margin: 0 auto;
  }
  #magazine .views-row .views-field-nothing {
    margin: 50px;
    float: right;
    width: 100%;
    max-width: 545px;
  }
  #cta-box .related-managers-list .about{
    padding:30px;
  }
  #cta-box .related-managers-list .about header{
    padding: 20px;
    width:49%;
  }
  #cta-box .related-managers-list .about .views-field-nothing {float:right;display:block;}
  #cta-box .related-managers-list .about .managers .managers-image img{
  width:12rem;}
  #cta-box .related-managers-list .about footer a{top:0;}
  .magazine header h1{margin-bottom: 35px;font-size: 4rem;}
  .magazine .views-field-field-featured-image img{width:90%;}
 

/*
/* Styles for all large devices (Desktops, and your 14" laptop) */
@media (min-width: 1100px) {
  .site-header.scrolled #block-multi-site-theme-site-branding img{bottom: 7px;right: 0.5px;}
  p, span, body {font-size: 1rem;}
    /* Use 1280px to 1500px optimizations here */
  .container { max-width: 1140px; }
  h1{font-size:4.5rem;}
  h1 a{ font-size: 4.5rem; }
  h2{font-size:2rem;}
  h2 a{font-size:2rem;}
  h3{font-size:1.6rem;}
  h3 a{font-size:1.6rem;}
  body.scrolled .whatsapp-bubble.bottom{bottom: 60px;  }
  #block-multi-site-theme-site-branding{width:90%;padding: 3px 0;}
  #block-multi-site-theme-site-branding img{padding: 7px 0 0;}
  .video-intro .card{left:10%;width: 300px;}
  .video-intro .card .field-content h1 a{font-size: 2.1rem;}
  .region-breadcrumb {padding-top:8rem;max-width: 1000px;}
  .secondary-menu{max-width: 525px;}
  .menu-text{font-size: 0.9rem;}
  .secondary-menu #block-multi-site-theme-mainnavigation a{font-size: 0.9rem;padding:14px;}
  .primary-menu{max-width:70%;display:block;padding:20px;}
  .primary-menu a{font-size: 0.9rem;}

  .service-article { max-width: 1140px; }
  .service-article .service-description{
    padding-top: var(--spacing-mid-4);
    padding-bottom: var(--spacing-mid-4);width:60%;}
  .service-article .service-image img{max-width: 325px;}
  .service-article .service-image img:hover{max-width: 280px;background-color: #fff;}
  .service-page .views-row .field-content h3{margin-bottom: 0;}
  .service-page .views-row .field-content .services{max-width:500px;}
  .service-page .views-row .field-content .brand-icons img {max-width: 330px;}
  .service-bg-content .color-pickr-square{min-height: 99vh;}
  .service-footer{max-width: 1140px;margin: 0 auto;} 
  .service-footer .service-tags a {float: left;padding: 8px;margin: 5px;border-radius: 25px;background-color: #f1f1f1;text-decoration: none;color: rgba(131, 58, 180, 1);}
  .blog-post-footer{max-width: 1140px;margin: 0 auto;} 
  .blog-post-footer .blog-post-tags a {float: left;padding: 8px;margin: 5px;border-radius: 25px;background-color: #f1f1f1;text-decoration: none;color: rgba(131, 58, 180, 1);}
  .projects .views-view-grid{display: flex;}
  .projects .views-view-grid h3 {width:180px;}
  .projects .views-view-grid h3 a{font-size: 1.2rem;}
  .projects .views-view-grid h3 span{font-size: 1rem;}
  
  .projects .views-row .views-field-field-description{width: 290px;font-size: 0.9rem;}
  .projects .views-row .views-field-field-featured-image{bottom: 17px;}
  .projects .views-row .views-field-field-featured-image img{width:155px;}
  .about .views-field-nothing-1 .field-content {bottom: 560px;left: 44px;width: 375px;}
  body.scrolled #about {height:698px}
  .about .views-field-nothing-1 .field-content h2{font-size: 3rem;}
  .about .views-field-nothing-1 .field-content p{font-size: 17px;}
  .about .views-field-nothing-1 span.field-content  {font-size: 1rem;}
  #service_box .service header h2{font-size: 2.5rem;max-width: 300px;}
  #service_box .service .views-row{max-width:380px}
  #service_box .service .views-row h3{font-size: 1.4rem;}
  #service_box .service .views-row .field-content p{font-size: 0.8rem;}
  #service_box .service header p{font-size:1rem;}
  .magazine .magazine-head {max-width: 1000px;margin: 0 auto;}
  .magazine .views-field-field-featured-image{max-width: 50%;float:left;text-align: center;}
  .magazine .views-field-title-1 {max-width: 50%;float:left}
  #magazine .views-row .views-field-field-featured-image{max-width: 235px;}
  #magazine .views-row .views-field-field-featured-image img {max-width: 310px;}
  
  
  

}
/* Styles ONLY for truly massive, unscaled monitors */
/* You would only need this if 1200px wasn't enough */
@media (min-width: 1600px) {
    .primary-menu .latest-block .views-row span{margin-top: 17px;padding: 7px 4px 15px;}
    .site-header.scrolled #block-multi-site-theme-site-branding img{bottom:1px;right: 0;}
    #block-multi-site-theme-site-branding{padding: 0 12px 0 6px;border-radius: 50px;}
    #block-multi-site-theme-site-branding img{padding: 1px 0px 0;}
    #block-multi-site-theme-dropdownlanguage-2 ul{padding: 0.4rem 1rem;width:4rem;padding:7px;text-align:center;}
    h1{font-size:5.2rem;}
    h1 a{ font-size: 5.2rem; }
    h2{font-size:2.5rem;}
    h2 a{font-size:2.5rem;}
    h3{font-size:1.8rem;}
    h3 a{font-size:1.8rem;}
    .menu-text{padding:5px;}
    p, span, body {font-size: 1rem;}
    .site-header a {font-size: 0.95rem;}
    .video-intro .card{width: 380px;left:15%;}
    .video-intro .card .field-content h1 a{font-size: 2.5rem;}
    .secondary-menu{max-width:530px;}
    .secondary-menu #block-multi-site-theme-mainnavigation li ul ul{left: 170px;top: -15px;}
    .primary-menu .latest-block .views-row time{font-size: 0.8rem;}
    .primary-menu .latest-block .views-row .auth-name{font-size: 0.8rem;}
    .video-intro .card .field-content {left: 375px; }
    .projects .views-row .views-field-field-featured-image img{width: 220px;}
    .projects .views-row .views-field-field-description {width: 235px;}
    .projects .views-view-grid h3{width:275px;}
    .projects .views-view-grid h3 a {font-size: 1.8rem;}
    body.scrolled .projects h2{margin-top: -100px;font-size:27px;}
    .container { max-width: 1400px; }
    .full-width-view { width: var(--grid-max-width); }
    .region-breadcrumb {padding-top:13rem;max-width: 1311.99px;}
    .service-article { max-width: 1400px; }
    .service-article header{width: 66%;}
    .service-article h1 a{ font-size: 6rem; }
    .service-article .service-description{padding-top: 4rem;padding-bottom: 8rem;width:50%;}
    .service-article .service-image {width: 33%;}
    .service-article .service-image img{max-width: 480px;}
    .service-article .service-image img:hover{background-color: #fff;max-width: 380px;}
    .service-page .views-row .field-content h3{margin-bottom: 0;}
    .service-page .views-row .field-content .services{max-width:700px;}
    .service-page .views-row .field-content .brand-icons img {max-width: 334px;}
    .service-bg-content .color-pickr-square{min-height: 99.45vh;}
    .service-article .service-body {padding-top: 130px;max-width:1600px;}
    .service-footer{max-width: 1140px;margin: 0 auto;} 
    .service-footer .service-tags a {float: left;padding: 8px;margin: 5px;border-radius: 25px;background-color: #f1f1f1;text-decoration: none;color: rgba(131, 58, 180, 1);}
    .magazine {max-width: 1400px;margin: 0 auto;}
    .magazine h1{text-align: center;font-size:4rem;margin: 0;}
    .magazine .magazine-head{max-width: 1224px;margin: 0 auto;}
    .magazine .magazine-head .views-field-field-featured-image {float: left;width: 100%;max-width: 48%;}
    .magazine-head .views-field-title-1 {width: 48%;float: left;}
    .magazine .views-row {float: left;}
    .magazine-head .views-field-title-1 h3{margin-top:0;}
    .magazine-head .views-field-title-1 h3 a{text-decoration: none;color: #041018;}
    .magazine-head .views-field-title-1 img{width: 70px;height: auto;border-radius: 50%;float: left;}
    .magazine-head .views-field-title-1 .auth-name{padding:5px;float:left;}
    .magazine-head .views-field-title-1 .auth-name a{color:#000000;text-decoration: none;}
    .magazine .views-view-responsive-grid{width:100%;max-width: 1224px;margin: 0 auto;}
    .magazine .views-view-responsive-grid .views-field-nothing{width: 100%;}
    .magazine .views-view-responsive-grid .views-field-nothing .auth-name{margin:20px;padding: 20px 0;}
    .magazine .views-view-responsive-grid .views-field-nothing .auth-name a{color:#000;text-decoration: none;}
    .magazine .views-view-responsive-grid .views-field-nothing .magprof-image{float:left;position: relative;top: 10px;}
    .magazine .views-view-responsive-grid .views-field-nothing .magprof-image img{ width: 80px;height: auto;border-radius: 50%;float: left;border:3px solid #fff;box-shadow: 0 0 3px;}
    .magazine .views-view-responsive-grid .views-field-nothing h3{padding:0;margin-top: 15px;}
    .magazine .views-view-responsive-grid .views-field-nothing h3 a{ color: #041018;text-decoration: none;font-size: 1.8rem;}
    .site-footer nav{max-width: 230px;}
    body.scrolled #about {height:1022px}
    .blog-post .blog-post-body{width:1144px;}
    .about .views-field-nothing-1 .field-content{bottom: 840px;width: 100%;}
    .about .views-field-nothing-1 .field-content p{font-size: 1.2rem;}
    .about .views-field-nothing-1 span.field-content  {font-size: 1.7rem;}
    .about .views-field-nothing-1 .field-content h2{font-size: 5rem;}
    #service_box .service header h2{font-size: 3.8rem;max-width: 458px;}
    #service_box .service .views-row {max-width: 485px;}
    #service_box .service .views-row .field-content p {font-size: 1rem;}
    #service_box .service .views-row h3 {font-size: 1.6rem;}
    #service_box .service header p{font-size:1.7rem;}
    #magazine .views-element-container{max-width: 75%;}
    #magazine .views-row .views-field-field-featured-image img {max-width: 425px;}
    #magazine .views-row {max-width: 1200px;}
}


