body {
    background-color: #000000;
    background-repeat: no-repeat;

}
html, body {
  scroll-behavior: smooth;
  font-family: 'Acumin Pro', 'Arial', sans-serif;
}
#footer address {
  margin-bottom: 4rem;
}
#footer a {
 color: rgba(var(--bs-warning-rgb), var(--bs-text-opacity));
}
.work-block {
    margin-bottom: 100px;
}
.work-block ul {margin-top:20px;}
.section-xl-padding {
  padding-top: 100px;
  padding-bottom: 100px;
}
#navigazione {
  padding: 10px 4rem;
  position: relative;
}
#navigazione:after{
 content: '';
     width: 100%;
     height: 70px;
     top: 0;
     left: 0;
     position: absolute;
     background-color: #000;
     z-index: -1;
     filter: blur(40px);
 }
#hero {
    padding-top: 4rem;
}
.navbar-brand img {width: 330px;}
.navbar-nav {
    gap: 30px;
}


.navigation-arrow {
    position: fixed;
    top: 50%;
    font-size: 2em;
    background: none;
    border: none;
    width: 30px;
    height: 30px;
    z-index: 2;
}
.navigation-arrow svg {
  fill: #fff;
  width: 30px;
  height: 30px;
}
.navigation-arrow svg:hover {
  fill: var(--bs-modal-bg);
}
#prevProject {
  left: 10px;
}

#nextProject {
    right: 10px;
}
.btn {
  position: relative;
 transition: all 0.5s!important;
}
.btn:hover {
  background: #E1A13E;
  box-shadow: 0px 5px 10px 0px #E1A13E;
  color: #fff;
}

@font-face {
 font-family: 'Acumin Pro';
 src: url('../font/AcuminPro-Regular.eot');
 src: url('../font/AcuminPro-Regular.eot?#iefix') format('embedded-opentype'),
     url('../font/AcuminPro-Regular.woff2') format('woff2'),
     url('../font/AcuminPro-Regular.woff') format('woff'),
     url('../font/AcuminPro-Regular.ttf') format('truetype');
 font-weight: normal;
 font-style: normal;
 font-display: block;
}

@font-face {
    font-family: 'Acumin Pro Italic';
   src: url('../font/AcuminPro-Italic.eot');
   src: url('../font/AcuminPro-Italic.eot?#iefix') format('embedded-opentype'),
       url('../font/AcuminPro-Italic.woff2') format('woff2'),
       url('../font/AcuminPro-Italic.woff') format('woff'),
       url('../font/AcuminPro-Italic.ttf') format('truetype');
   font-weight: normal;
   font-style: italic;
   font-display: block;
}


@font-face {
    font-family: 'Acumin Pro Bold';
   src: url('../font/AcuminPro-Bold.eot');
   src: url('../font/AcuminPro-Bold.eot?#iefix') format('embedded-opentype'),
       url('../font/AcuminPro-Bold.woff2') format('woff2'),
       url('../font/AcuminPro-Bold.woff') format('woff'),
       url('../font/AcuminPro-Bold.ttf') format('truetype');
   font-weight: bold;
   font-style: normal;
   font-display: block;
}


@font-face {
    font-family: 'Acumin Pro Bold Italic';
    src: url('../font/AcuminPro-BoldItalic.eot');
    src: url('../font/AcuminPro-BoldItalic.eot?#iefix') format('embedded-opentype'),
        url('../font/AcuminPro-BoldItalic.woff2') format('woff2'),
        url('../font/AcuminPro-BoldItalic.woff') format('woff'),
        url('../font/AcuminPro-BoldItalic.ttf') format('truetype');
    font-weight: bold;
    font-style: italic;
    font-display: block;
}
#navigazione .figure, #navigazione .figure img {margin-bottom: 0px;}
#navbarNavDropdown-1 .nav-link {color: #fff;}

#hero .title {
 font-size: 4.313rem;
}
input, textarea {
    background-color: transparent!important;
}
.form-control:focus {
 box-shadow: none;
}
.form-control {
    color: #fff!important;
}
.bg-80 {
    background-color: #0A0F14;
}
.pt-100{padding-top: 100px;}
.pb-100{padding-bottom: 100px;}


section#portfolio h5 {
    font-size: 27px;
    margin-bottom: 20px;
}

.project {
    width: 310px;
    height: 346px;
    background-color: #1B2837;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}
.press #hero h1 {
  padding-bottom: 40px;
}
.careers .text-left {
  text-align: left;
  align-items: flex-start;
  align-content: flex-start;
}
.post-item {
   flex:300px;
   height: auto;
    min-height: 346px;
    background-color: #1B2837;
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: start;
    cursor: pointer;
    padding: 40px 20px;
}
.post-item a {text-decoration: none; color: #E1A13E;}
.post-item h2 {
  font-size: 1.5rem;
  margin-bottom: 20px;
}
.project img {
    max-width: 220px;
    height: auto;}
.modal ul {list-style: none; margin: 0; padding: 0; margin-top: 30px;}
.project:hover, .post-item:hover {
    background-color:#E1A13E;
}
.post-item:hover a, .post-item:hover .gold {color:#fff;}
#hero h1 {
    padding-top: 80px;
    padding-bottom: 80px;

}
.text-gold {
    color: #E1A13E;!important;
}
.index #portfolio figure img {
    width: 150px;
    object-fit: contain;
    height: 110px;
}


body.index, body.about  {
    background-image: url('../img/photodune-s2bxKZ1Q-abstract-technology-banner-design-digital-neon-lines-on-black-background-xxl%201.jpg');
    background-repeat: no-repeat;
    background-size: 80%;
}
body.portfolio #hero {
    background-image: url('../img/pexels-frant.jpg');
    background-position: top right;
    background-repeat: no-repeat;
    min-height: 100vh;
    }
footer:not(body.index footer, body.about footer ){
    padding-top: 100px;
    padding-bottom: 100px;
    background-image: url('../img/bg_contact.jpeg');
    background-position: top left;
    background-repeat: no-repeat;
}
.image_project img {width: 100%; background-color: #fff; max-width: 300px; padding: 30px;}
.image_project {
    text-align: right;
}

/* FlipCard */

.people {
  cursor: pointer;
  position: relative;

}
.people:hover .people_detail {
  opacity: 1;
}
.people_detail {
  opacity: 0;
  position: absolute;
  transition: opacity 0.3s ease-in-out;
  left: 0;
  top: 0;
  display: flex;
  align-content: center;
  flex-direction: column;
  align-items: center;
  width: 100%;
  height: 100%;
  justify-content: center;
    background-color: rgba(var(--bs-warning-rgb), var(--bs-bg-opacity)) !important;
}
.people_detail * {
  color: #000;
}
.people_detail button {margin-top: 30px;}
.people img{
 width: 100%;
 object-fit: cover;
 filter: grayscale(1);
}
.flip .card .img {
   position: relaitve;
   z-index: 1;
}
#projectDescription h5 {
    margin-bottom: 40px;
}
.flip .card .back {
  -webkit-transform: rotatey(-180deg);
          transform: rotatey(-180deg);
  position: relative;
 height: 510px;
}

.inner {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 100%;
    background-color: rgba(var(--bs-warning-rgb));
    justify-content: space-evenly;
}
.inner ul {
    padding: 10px 40px;
    margin: 0;
}
.card {
  align-items: center;
}
.card li {
    font-size: 18px;
    color: #000;
    text-align: left;
}
.inner svg, .inner svg * {
  fill: #000!important; color: #000!important; width: 20px; height: 20px;}
.card .inner h5 {
    font-family: 'Acumin Pro Bold';
    font-size: 24px;
    color: #000;
    margin-bottom: 30px;
}
#navbarNavDropdown-1 .navbar-nav .active a{
  color: #67C8FA;
}
#contactForm label {
    color: #fff;
}
#projectDescription a {color: #000; text-decoration: none;}
#faqAccordion, .accordion, .accordion-item {background-color: transparent!important;}

#faqAccordion .accordion-button:not(.collapsed) {
    background-color: #1B2837;
}
#faqAccordion .accordion-item {color: #fff;}
#faqAccordion .accordion-button {
    color: #67C8FA;
}
#team {
  background-color: #1B2837;
}
#team .item {flex:1;}
#team .item h4 {text-align: center;}
#team .item h4 span, #projectDescription h4 span{font-size: 1.25rem; display: block;}

.index .section-xl-padding {
    padding-top: 30px;
    padding-bottom: 30px;
}

/*
#first_section {
 box-shadow: 0px 10px 20px 6px #00000080;
} */
#whatwedo {
  padding-top: 100px;
  padding-bottom: 100px;
}
#success-message {
    padding: 15px;
    color: var(--bs-warning);
}
#team .d-flex { gap: 30px; justify-content: space-between; margin-bottom: 30px;}
.layout_articolo p, .layout_articolo .work-block{
  color: #D9D9D9!important;
}
.layout_articolo a{

}
.layout_articolo a:hover{
  color: #E1A13E;
}

.post-item span.gold {
    color: #E1A13E;
}
.none {display: none;}


.video-container {
    position: relative;
    width: 100%;
    max-width: 800px;
}
input#inputGroupFile01 {
    display: block;
    border-bottom: solid 1px;
    width: 100%;
}
.social_div {
    gap: 10px;
    font-weight: bold;
    font-size: 20px;
    margin-bottom: 20px;
    align-items: center;
}
.social_div a {
    width: 40px;
    height: 40px;
    background-color: #fff;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.files a {color: #000;}
.files a:hover {color: #000;}

.careers .post-item h2 span {
  font-size: 15px;
}
.careers .post-item {
  gap: 30px;
}
@media only screen and (max-width : 1400px) {
#team .item {
    flex: 1;
    flex-basis: 48%!important;
}
}

@media only screen and (max-width : 767px) {

  .navbar-nav {
      gap: 10px;
  }
  .flip { margin-bottom: 20px;}
  .flip .inner ul {
      padding: 10px 30px;
      margin: 0;
  }
  .flip .inner h5 {
  padding: 0px 20px;
  }
}


@media only screen and (max-width : 600px) {

  #navigazione .container-fluid {
    justify-content: center;
    gap: 20px;
  }
  #navigazione .container-fluid .navbar-brand {width: 70%;}
  .press .post-item {padding: 16px;}
  .press .post-item h2 { font-size: 1.3rem;}

  body.index, body.about {
      background-size: 120%;
  }

  .flip .card .front img {
      height: auto;
      width: 85vw;
  }
  #navigazione {
      padding: 10px 2rem;
  }
  .modal-body {
      padding: 20px!important;
  }
#hero h1 { font-size: 2.188rem; max-width: 100%; }
#navigazione .navbar-toggler {border: none;}
section h2 { font-size: 2rem; }
#whatwedo {
    padding-top: 50px;
    padding-bottom: 50px;
}
.content_logo .item { width: 150px; }
.content_logo *:not(a)  {padding: 0!important;}
.content_logo .more {
    margin-top: 20px;
}
.index #portfolio figure img {
    width: 160px;
    object-fit: contain;
    height: 70px;
    object-position: left;
}
.content_logo {
   padding: 0px 10px;
   display: flex;
   justify-content: space-between;
}

body.portfolio #hero {
background-size: contain;
}
body.portfolio #portfolio .flex-wrap{
 justify-content: center;
}
body.portfolio #portfolio .flex-wrap .item {
    flex: 33%;
}
body.portfolio #portfolio .flex-wrap * {
   flex: 33%;
   width: 100%;
   padding: 4px;
   height: 200px;
}
.card li {
    font-size: 15px;
    color: #000;
    text-align: left;
}
#hero .title {
    font-size: 10vw;
}

}
@media only screen and (max-width : 400px) {
  .custom-file {
      display: flex;
      flex-direction: column;
  }
  #navigazione .container-fluid .navbar-brand {
      width: 64%;
  }
  .content_logo  {
    display: flex!important;
  }
  .content_logo .item {
      width: 130px;
  }
  .index #portfolio figure img {
    width: 130px;
  }
  section#portfolio h5 {
      font-size: 24px;
      margin-bottom: 20px;
  }
}