@font-face {
    font-family: 'ballinger';
    src: url('fonts/Ballinger-Bold.woff2') format('woff2'),
        url('fonts/Ballinger-Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'ballinger';
    src: url('fonts/Ballinger-Regular.woff2') format('woff2'),
        url('fonts/Ballinger-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}



/* @import url("https://use.typekit.net/jrk0byc.css"); */
 *{
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
 }
   /* Keyframes for fade-in animation */
@keyframes fadeIn{
    from { opacity: 0; }
    to { opacity: 1; }
}
 .fade-in {
    opacity: 0;
    animation: fadeIn .5s ease-in forwards;
}
@keyframes fadeIn2{
    from { opacity: 0; transform: scale(0.8);}
    to { opacity: 1; transform: scale(1); }
}

.top-gallery div:nth-child(1){
    animation: image1 8s ease-in infinite;
}
.top-gallery div:nth-child(2){
    animation: image2 8s ease-in infinite;
}
.top-gallery div:nth-child(3){
    animation: image3 8s ease-in infinite;
}
.top-gallery div:nth-child(4){
    animation: image4 8s ease-in infinite;
}
.top-gallery div:nth-child(5){
    animation: image5 8s ease-in infinite;
}
.top-gallery div:nth-child(6){
    animation: image5 6s ease-in infinite;
}
.top-gallery div:after {
    content: 'Test';
    position: absolute;
    font-size: 18px;
    color: #ffffff;
    right: 3vw;
    bottom: 45px;
    display: block;
}
.top-gallery div:nth-child(1):after {
    content: 'The Solace';
}
.top-gallery div:nth-child(2):after {
    content: 'Science Gallery Intl.';
}
.top-gallery div:nth-child(3):after {
    content: 'The Abbey Theatre';
}
.top-gallery div:nth-child(4):after {
    content: 'Digital Sustainability microsite';
    color: #000000a6;
}
.top-gallery div:nth-child(5):after {
    content: 'DCU:Innovate';
}

/* section > div{
    max-width: 1500px;
    margin-left: auto;
    margin-right: auto;
} */
@keyframes image1{
    0%  { z-index: 4;}
    20% { z-index: 1;}
    40% { z-index: 1;}
    60% { z-index: 1;}
    80% { z-index: 1;}
    100% { z-index: 4;}
}
@keyframes image2{
    0%  { z-index: 1;}
    20% { z-index: 4;}
    40% { z-index: 1;}
    60% { z-index: 1;}
    80% { z-index: 1;}
    100% { z-index: 1;}
}
@keyframes image3{
    0%  { z-index: 1;}
    20% { z-index: 1;}
    40% { z-index: 4;}
    60% { z-index: 1;}
    80% { z-index: 1;}
    100% { z-index: 1;}
}
@keyframes image4{
    0%  { z-index: 1;}
    20% { z-index: 1;}
    40% { z-index: 1;}
    60% { z-index: 4;}
    80% { z-index: 1;}
    100% { z-index: 1;}
}
@keyframes image5{
    0%  { z-index: 1;}
    20% { z-index: 1;}
    40% { z-index: 1;}
    60% { z-index: 1;}
    80% { z-index: 4;}
    100% { z-index: 1;}
}


.fade-in.bubble {
    opacity: 0;
    animation: fadeIn2 .2s ease-out forwards;
}
.fade-in.bubble:nth-child(1){
    animation-delay: 0.2s;
}
.fade-in.bubble:nth-child(2){
    animation-delay: 0.257s;
}
.fade-in.bubble:nth-child(3){
    animation-delay: 0.35s;
}
.fade-in.delay-1 {
    animation-delay: 0.25s;
}
.fade-in.delay-2 {
    animation-delay: 0.35s;
}
.fade-in.delay-3 {
    animation-delay: 0.45s;
}
.fade-in.delay-4 {
    animation-delay: 0.55s;
}
.fade-in.delay-5 {
    animation-delay: 0.65s;
}
.fade-in.delay-6 {
    animation-delay: 0.75s;
}
 body{
    margin: 0px;
    padding: 0px;
    background-color: #FAF7F4;
    font-family:  'ballinger', sans-serif; 
    font-weight: normal; 
    font-style: normal;
    font-size: 18px;
    color: #1D1D1D;
 }
 .mb-30{
    margin-bottom: 30px;
 }
 a{
    color: #2A50F3;
    text-decoration: none;
 }
 .tile.line{
    width: 0px;
    transition: 0.65s;
    transition-delay: 0.3s;
 }
 .tile.loaded.line{
    width: 100%;
 }
 svg.tile .path {
    stroke-dasharray: 2000;
    stroke-dashoffset: 2000;
  }
  svg.tile.loaded .path{
    stroke-dasharray: 2000;
    stroke-dashoffset: 0;
    animation: dash 3s ease-in-out;
  }
  
  @keyframes dash {
   0% {
      stroke-dashoffset: 2000;
    }
    100% {
      stroke-dashoffset: 0;
    }
  }

 .border-no{
border: 0 !important;
 }
 .companies span{
    background: white;
    padding: 6px 10px;
    border-radius: 20px;
    font-size: 90%;
    margin-left: 2px;
 }
 .ds-outer{
    padding-left: 5vw; 
    padding-right: 5vw; 
    border-radius: 8px;
    background: #f3eeec;
 }
 .tile{
    opacity: 0;
    transition: 0.75s;
    transition-delay: 0.25s;
 }
 .tile.delay-1{
    transition-delay: 0.35s;
 }
 .tile.delay-2{
    transition-delay: 0.45s;
 }
 .tile.delay-3{
    transition-delay: 0.55s;
 }
 .tile.delay-4{
    transition-delay: 0.65s;
 }
 .tile.delay-5{
    transition-delay: 0.75s;
 }
 .tile.loaded{
    opacity: 1;
 }
nav ul a{
    color: #1D1D1D;
 }
 nav ul li {
    transition: 0.5s ease;
 }
 nav ul li span.hello{
    display: none;
 }
 nav ul li:hover span.hello{
    display: inline;
 }
.last-card{
    min-width: 80px !important;
    width: 80px;
    max-width: 80px;
}
footer h2{
    margin-bottom: 50px;
}
footer > div:last-child{
    margin-top: 40px;
}
 nav ul li span.hello span{
   visibility: hidden;
   transition: 0.5s ease;
 }
 nav ul li:hover span.hello span{
    visibility: visible;
 }
 span.hello span:nth-child(1){
transition-delay: 0.1s;
 }
 span.hello span:nth-child(2){
    transition-delay: 0.2s;
    }
    span.hello span:nth-child(3){
        transition-delay: 0.3s;
        }



        @keyframes wiggle {
            0%  { transform: rotate(0deg); }
            25% { transform: rotate(0deg); }
           50% { transform: rotate(10deg); }
        75% { transform: rotate(-10deg); }
          100% { transform: rotate(0deg); }
        }
        
        .wiggle {
          display: inline-block;
          animation: wiggle 2.5s infinite;
        }
        
.top-gallery{
    height: clamp(500px, 65vh, 680px);
    overflow: hidden;
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
}
.top-gallery img{
    border-radius: 0px !important;
}
.page-top{
    margin-top: calc(clamp(500px, 65vh, 680px) - 20px);
    box-shadow: 2px -5px 38px #00000014;
}
.top-gallery div{
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    top: 0;
    left: 0;
    right: 0;
}
.top-gallery div img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
#carousel .controls{
   visibility: hidden;
   pointer-events: none;
    opacity: 0;
    transition: 0.25s ease;
}
#carousel:hover .controls{
  visibility: visible;
  pointer-events: all;
    opacity: 1;
}
        
 a[target="_blank"]{
    background: url('data:image/svg+xml,<svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1.39031 9.44172L0.445312 8.49672L7.38281 1.55922L1.56281 1.62672V0.261719H9.62531V8.32422H8.25281L8.32781 2.49672L1.39031 9.44172Z" fill="%232A50F3"/></svg>');
    background-repeat: no-repeat;
    background-size: 10px;
    padding-right: 18px;
    background-position: calc(100% - 3px) 58%;
    max-width: max-content;
    transition: 0.5s ease;
}
a[target="_blank"]:hover{
    padding-right: 21px;
    background-position: calc(100% - 3px) 44%;
}
a[download]{
    background: url('data:image/svg+xml,<svg width="13" height="15" viewBox="0 0 13 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.84054 0.0273438L7.17698 0.0273444L7.17698 9.83845L11.2446 5.67536L12.2098 6.64056L6.50876 12.3416L0.807711 6.64056L1.77821 5.67006L5.84585 9.84375L5.84054 0.0273438Z" fill="%232A50F3"/><path d="M0 13.9988H13V14.9988H0V13.9988Z" fill="%232A50F3"/></svg>');
    background-repeat: no-repeat;
    background-size: 12px;
    padding-right: 20px;
    background-position: calc(100% - 3px) 58%;
    max-width: max-content;
}
 nav ul{
    list-style: none;
    padding-left: 0px;
    position: fixed;
    display: flex;
    left: 3vw;
    right: 3vw;
    width: 94vw;
    justify-content: space-between;
    column-gap: 10px;
    z-index: 99999;
    top: 0;
 }
 nav ul li{
    padding: 8px 15px;
    background: white;
    border-radius: 20px;
    box-shadow: 0px 2px 10px #0000000f;
 }
 nav ul li:nth-child(2){
    margin-left: auto;
 }
 h1, h2{
    font-weight: normal; 
    font-style: normal;
    margin-top: 0px;
 }
 h1{
    font-size: 48px;
    line-height: 1.2;
    max-width: 85vw;
 }
 h2, p1{
    font-size: 28px;
    line-height: 120%;
 }
 .pull-out{
    font-size: 38px;
    line-height: 1.2;
 }
 p1{
    display: block;
    margin-bottom: 40px;
    max-width: 780px;
 }
 .coming-soon{
    color: #535353;
 }
section, footer, .general-padding{
    padding: 3vw;
}
section{
    background-color: #FAF7F4;
    position: relative;
}
svg text tspan{
    font-weight: 700;
    font-size: clamp(32px, 2.15vw, 34px);
}
svg text tspan:nth-child(2){
    fill: #1B1B1B;
}
footer{
    position: relative;
    color: #fbf7f5;
    background: #1B1B1B;
    padding-top: 50px;
    padding-bottom: 50px;
}
footer a{
    color: #fbf7f5;

}
footer p a{
    height: 24px;
    display: block;
    background-position: calc(100% - 3px) 50%;
}
footer a[target="_blank"]{
    background-image: url('data:image/svg+xml,<svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1.39031 9.44172L0.445312 8.49672L7.38281 1.55922L1.56281 1.62672V0.261719H9.62531V8.32422H8.25281L8.32781 2.49672L1.39031 9.44172Z" fill="white"/></svg>');
}
.blinking {
    animation: blink 1s steps(1, start) infinite;
  }
  
  @keyframes blink {
    0% {opacity: 1;}
    75% {opacity: 1;}
    100% {opacity: 0;}
  }
.pull-out a{
    border-bottom: 2px solid;
}
section, .carrousel-flexbox{
    padding-bottom: clamp(60px, 15vh, 150px);
}
.grid-1-2{
    display: grid;
    grid-template-columns: 1fr 2.55fr;
    column-gap: 3vw;
}
.grid-2{
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 3vw;
}
.grid-4{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    column-gap: 3vw;
}
#carousel section{
    padding-bottom: 20px;
}
#carousel .grid-2 > div {
    margin-bottom: 0px;
}
img{
    width: 100%;
    height: auto;
    border-radius: 8px;
}
.rounded{
    border-radius: 8px;
}
.line{
    display: block;
    width: 100%;
    height: 1px;
    background-color: black;
    margin-bottom: 30px;
}
.p-0{
    padding: 0px !important;
}
.page-top {
    padding-top: 80px;
    padding-bottom: 30px;
    z-index: 2;
    position: relative;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
}
.page-top-privacy{
    padding-top: 120px;
    padding-bottom: 30px;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
}
.commitments{
    margin-bottom: 20px;
    border-bottom: 1px solid;
    padding-bottom: 30px;
    padding-top: 10px;
}
footer h2{
    max-width: 860px;
}

@media (max-width: 1200px) {
    body{
        font-size: 16px;
    }
    h1 {
        font-size: 38px;
    }
    .pull-out{
        font-size: 30px;
     }
    h2, p1 {
        font-size: 24px;
    }

}
@media (max-width: 768px) {
   
    .deals-paddle svg {
        width: 20px;
    }
    .grid-2 > div{
        margin-bottom: 40px;
    }
    .line{
        margin-bottom: 20px;
    }
    body{
        font-size: 16px;
    }
    h1 {
        font-size: 28px;
    }
    h2, p1 {
        font-size: 20px;
    }
    .grid-1-2{
        display: block;

    }
    .grid-2{
        display: block;
    }
    .grid-sm-2{
        display: grid;
        grid-template-columns: 1fr 1fr;
        column-gap: 3vw;
    }
    section{
        padding-top: 40px;
    padding-bottom: 50px;
    }
}
@media (max-width: 450px) {
    .grid-4{
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
    
   .ds-outer{
    padding-left: 15vw; 
    padding-right: 15vw; 
    border-radius: 8px;
    background: #f3eeec;
 }
 .fade-in.bubble:nth-child(3){
    position: fixed;
    bottom: 20px;
    right: 10px;
}
nav ul li span.hello {
    display: inline-block;
}
.top-gallery div:after{
    font-size: 14px;
    right: 20px;
}
h1{
    max-width: 100%;
}
section{
    margin-top: -1px;
}
.page-top {
    padding-top: 50px;
}
.page-top {
    margin-top: calc(clamp(410px, 44vh, 680px) - 20px);
}
.top-gallery {
    height: clamp(410px, 44vh, 680px);
}
}