/****************************************
 
CRW Multimedia - Template 1 - 2025

****************************************/

body{
background:#27284f;
}

/*--- NAVBAR ---*/
.navbar{
transition:all 0.3s ease;
padding:2rem 0;
background-color:#050143!important;
}

.navbar .nav-link{
transition:all 0.3s ease;
color:#fff!important;
margin-left:2rem;
padding:0.5rem 1.5rem!important;
border:1px solid blue;
border-radius:3rem;
}

.navbar .nav-link:hover{
transition:all 0.3s ease;
color:#000!important;
border:1px solid #ffc900;
background-color:#ffc900;
}

.navbar-brand{
transition:all 0.3s ease;
margin:0 0 0 5rem;
}

.navbar-brand img{
height:100px;
width:auto;
}

/*--- HERO SECTION ---*/
.hero-section{
transition:all 0.3s ease;
background:linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.1)), url('banner-crwmultimedia.png') center/cover no-repeat;
height:400px;
display:flex;
align-items:center;
justify-content:center;
}

.hero-section a{
color:#fff;
text-decoration:none;
}

.hero-section h1{
color:#fff;
font-weight:500;
text-shadow:5px 5px 0px black;
}

/*--- FEATURES ---*/
.features-icons{
padding:3rem 0;
background-color:#050143!important;
}

.ablock{
display:block;
text-decoration:none;
}

.ablock .features-icons-item{
border:1px solid blue;
color:#fff;
}

.ablock:hover .features-icons-item{
transition:all 0.3s ease;
border:1px solid #ffc900;
background:#ffc900;
}

.ablock .features-icons-icon{
padding:1rem;
}

.img-center{
margin:0 auto;
display:block;
max-width:100%;
height:auto;
}

.ablock:hover img{
transition:all 0.3s ease;
filter:grayscale(1) brightness(0);
}

.ablock h2{
font-size:1.5rem;
color:#ffc900;
margin-top:0;
padding-bottom:1rem;
}

.ablock:hover h2{
color:#000;
font-weight:bold;
}

.ablock p{
color:#fff;
padding:0.2rem 0.2rem 1rem 0.2rem!important;
}

.ablock:hover p, .ablock:hover span{
color:#000;
}

/*--- SECTIONS ---*/
section h2#apropos, section h2#services, section h2#contact{
color:#fff;
font-weight:bold;
padding-left:70px;
margin-bottom:3rem!important;
}

.orange{
color:#ffc900;
}

section h2#apropos{
background:transparent url('icone-apropos.svg') left center no-repeat;
min-height:50px;
}

section h2#services{
background:transparent url('icone-services.svg') left center no-repeat;
min-height:50px;
}

section h2#contact{
background:transparent url('icone-contact.svg') left center no-repeat;
min-height:50px;
}

section.py-5{
color:#fff;
}

section.py-5 p{
margin-bottom:2rem;
}

section.py-5 p a, footer a{
transition:all 0.3s ease;
color:#fff;
text-decoration:underline;
}

section.py-5 p a:hover, footer a:hover{
transition:all 0.3s ease;
color:#000;
background:#ffc900;
}

.dblue{
transition:all 0.3s ease;
background:#050143;
padding:1rem;
margin-bottom:3rem;
}

.dblue h3{
padding-bottom:2rem;
text-align:center;
color:#ffc900;
}

.dblue img{
margin-bottom:2rem;
}

.dblue .reas{
transition:all 0.3s ease;
justify-content:space-around;
align-items:center;
display:flex;
flex-direction:row;
}

.dblue .reas img{
max-width:320px;
height:auto;
margin-bottom:3rem;
}

.dblue ul{
margin:0 0 2rem 0;
padding:0;
background:#27284f;
}
.dblue ul li{
margin:0;
padding:0.5rem 0 0.5rem 1rem;
border-bottom:3px solid #050143;
list-style-type:circle;
list-style-position:inside;
font-size:1.1rem;
}

/*--- FOOTER ---*/
.footer{
transition:all 0.3s ease;
padding:5rem 5rem 4rem 5rem;
color:white;
background-color:#050143!important;
}

.footer h5{
transition:all 0.3s ease;
margin-bottom:2rem;
}

.footerLogo{
transition:all 0.3s ease;
margin:0 0 2rem 0;
height:90px;
}

.infos{
transition:all 0.3s ease;
width:50%;
}

.infos a.aImg{
text-decoration:none;
}

 .infos a.aImg:hover{
background:transparent!important;
}

.gray{
color:#bbb;
}

/*--- MAX WIDTH 1024 ---*/
@media (max-width: 1280px){

  .dblue .reas{
  transition:all 0.3s ease;
  flex-direction:column;
  }
}
    

/*--- MAX WIDTH 960 ---*/
@media (max-width: 960px){

  .navbar-collapse{
  transition:all 0.3s ease;
  background-color:transparent;
  margin-top:2rem;
  padding:1rem 0;
  border:1px solid blue;
  border-width:1px 0;
  border-radius:0;
  }

  .navbar-collapse .nav-link{
  transition:all 0.3s ease;
  padding-left:1rem;
  margin-left:0;
  border:none;
  border-radius:0;
  }

  .navbar-collapse .nav-link:hover{
  transition:all 0.3s ease;
  color:#000!important;
  background:#ffc900;
  border:none;
  }
  
  .navbar-brand{
  margin:0;
  }
  
  .footer{
  transition:all 0.3s ease;
  padding:1rem;
  }

  .infos{
  transition:all 0.3s ease;
  width:100%;
  }

}