@import "tailwindcss";

@theme {
    --color-clifford: #da373d;
  }
  .bg-green {
    background-color: #8dc64f;
  }
  .bg-menu-gray {
    background-color: #414042;
  }
  .bg-main-violet {
    background-color: #e7d9f0;
  }
  .bg-menu-light-gray {
    background-color: #414042;
  }
  .logo-gray {
    background-color: #231f20;;
  }

  .main {
    background-color: #45083f;
  }
  .wrapper {
    margin: 0 auto;
    /* width: 612px; */
    background-color: #000; 
  }

  .nav-container {
    background: url(../img/bg_header_top.png) no-repeat 0 0;
    background-clip: content-box;
    background-size: 100%;
    /* width: 612px;
    height: 277px;  */
    height: 100px;
  }

  nav ul {
        float: right;
        list-style-type: none; /* Remove bullets */
        margin: 0;
        padding: 0;
        /* background-color: #333; */
        overflow: hidden; /* Contain floated elements */
        padding-right: 15px;
    }

    /* Make list items inline */
    nav ul li {
        display: inline-block; /* Inline but allows padding/margin */
    }

    /* Style the links */
    nav ul li a {
        display: block; /* Makes the whole area clickable */
        color: white;
        text-align: center;
        padding: 15px 8px;
        text-decoration: none;
    }

    /* Hover effect */
    nav ul li a:hover {
        background-color: #1c0551;
    }

  .hero-container {
    background: url(../img/hero_img_001.png) no-repeat 0 0;
    background-clip: content-box;
    background-size: 100%;
    /* width: 612px;
    height: 277px;  */
    height: 315px;
  }

  .bg-page-title {
    background: url(../img/h1-bg.png) no-repeat 0 0;
    background-clip: content-box;
    background-size: 450px;
    /* width: 612px;
    height: 277px;  */
    height: 75px
  }

  .section-home-container {
    height: 100%;
  }

  .section-about-container {
    height: 100%;
  }

  .news-col-container {
    min-height: 950px;
  }

  .cell-left {
    width: 50%;
  }

  .cell-right {
    width: 45%;
  }

  .l-green-img-bar {
    width: 49%;
    height: 27px;
    float: left;
  }
  r-green-img-bar {
    width: 49%;
    height: 27px;
    float: right;
  }

  .top-bar-design2 {
    width: 100%;
    height: 57px;
  }
  .bot-bar-design {
    width: 100%;
    height: 42px;
  }

  .footer-mobile-container {
    min-width: 390px
    /* max-width:550px; */
  }

  @media screen and (min-width: 1024px) {

    .section-home-container {
      height: 1090px;
    }

    .section-about-container {
      height: 1590px;
    }

    .news-col-container {
      min-height: 950px;
    }
  
}