@charset "utf-8";
/* WEDDING & EVENTS NAVIGATION BAR 
prefixed 211221 */

.navBarTitle {
   display: flex;
   justify-content: center;
   margin: 1rem 0 0.5rem 0;
   padding: 0.5rem 0 0 0;
}

.navBar {
   display: flex;
   flex-wrap: wrap;
   justify-content: space-around;
}

.navBar.first {padding: 0 3% 12px 3%;}

.navBar.second {padding: 0 3% 24px 3%;}

.navBar li {
   margin: 0;
   padding: 6px 1px;
   /* border: 1px solid #224831; */
   border: 1px solid #183323;
   border-radius: 4px;
   /* background-color: #224831; */
   background-color: #183323;
   color: #fff;
   list-style: none;
   text-align: center;
   font-size: 0.7rem;
   transition: color 0.4s ease, background-color 0.4s ease;
}

.navBar li a {
   color: #fff;
   list-style: none;
}

.navBar li:hover, li:focus, li:active {
   background-color: #fff;
   /* color: #224831; */
   color: #183323;
   /* border: 1px dotted #224831; */
   border: 1px dotted #183323;
}

.navBar a:hover, a:focus, a:active {
   /* color: #224831; */
   color: #183323;
   text-decoration: none;
   list-style: none;
}

.navBarItem {
   display: flex;
   flex-direction: column;
   justify-content: center;
   margin: 3px;
   padding: 0;
}

.navBarImg {
   border-radius: 4px;
   /* border: 1px dotted #224831; */
   border: 1px dotted #183323;
   margin: 0 0 3px 0;
   -o-object-fit: cover;
      object-fit: cover;
   transition: opacity 0.4s ease;
}

.navBarImg:hover {opacity: 0.6;}