@layer layouts {
  /* =====================
    SECTION: HERO
    ====================== */

  .hero {
    position: relative;
    z-index: 1;
    min-height: calc(100svh - var(--menu-height));
    place-content: center;
    overflow: hidden;
  }

  .hero video {
    width: 100%;
    height: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    object-fit: cover;
    z-index: -2;
  }

  .wave {
    position: absolute;
    top: -20vw;
    left: -10vw;
    transform: rotate(165deg);
    z-index: -1;
  }

  .wave1 {
    position: absolute;
    bottom: -15vw;
    right: -15vw;
    transform: rotate(-15deg);
    z-index: -1;
  }

  .theme {
    background: linear-gradient(135deg,
        var(--accent-color),
        var(--primary-color),
        var(--accent-color));
    background: linear-gradient(135deg, #ffc260, #ff9e00, #ffc260);
    padding: 1px;
    border-radius: 50px;
    color: #000;
    border: 2px solid #fff;
    display: inline-block;
  }


  .theme span {
    font-size: var(--fs-sub-title);
    font-weight: 900;
    line-height: 1;
  }

  .shape1 {
    position: absolute;
    right: 4%;
    top: 35px;
    -webkit-animation: spin 10s linear infinite;
    animation: spin 10s linear infinite;
  }

  .shape {
    position: absolute;
    left: 25px;
    bottom: 35px;
    -webkit-animation: spin 10s linear infinite;
    animation: spin 10s linear infinite;
  }

  @keyframes identifier {
    0% {
      -webkit-transform: rotate(0);
      transform: rotate(0);
    }

    100% {
      -webkit-transform: rotate(360deg);
      transform: rotate(360deg);
    }
  }

  /* =====================
    SECTION: COUNTDOWN
    ====================== */

  .countdown {
    text-align: center;
    color: #fff;
    font-family: "Poppins", sans-serif;
  }

  .countdown .count-box {
    background: linear-gradient(#e100a8, #71009c);
    background: linear-gradient(var(--primary-color), var(--accent-color));
    border-radius: 1rem;
    aspect-ratio: 1;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    transition: 250ms all linear 0ms;
    text-align: center;
    position: relative;
  }

  /* .countdown .count-box.flipped {
    background: linear-gradient(#e1005e, #8d104e);
    border-radius: 0 3rem 0 3rem;
  } */

  .countdown .count-box:hover {
    transform: translateY(-5px);
  }

  .countdown .count-number {
    font-size: var(--fs-caption);
    font-size: var(--fs-sub-title);
    font-size: var(--fs-small-banner);
    font-weight: bold;
    /* margin-bottom: 5px; */
  }

  .countdown .count-name {
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 300;
    color: var(--primary-color);
  }

  .countdown .timeRef {
    display: block;
    color: var(--bs-light);
  }

  /* =====================
    SECTION: ABOUT
    ====================== */

  .about__section {
    position: relative;
    z-index: 1;
    background: #fbf0de;
    background: linear-gradient(0.45turn,
        rgb(251, 240, 222),
        rgb(255, 255, 255));
  }

  /* =====================
    SECTION: COMMITTEE
    ====================== */

  .org__committee {
    position: relative;
    z-index: 1;
  }

  .org__committee::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 65%;
    background: url(../images/bg/bg.webp);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    z-index: -1;
  }

  .committee {
    padding: 1rem;
    border-radius: 1rem;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px,
      rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
    background: var(--bs-light);
    margin: 10px auto;
    height: 100%;
  }

  .committee__img {
    background: url(../images/profile_background.webp);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 1rem;
    margin-bottom: 10px;
    overflow: hidden;
  }

  .committee__info {
    text-align: center;
  }

  .committee__name {
    font-size: var(--fs-caption);
    font-weight: 700;
    color: var(--primary-color);
  }

  /* =====================
    SECTION: ABSTRACT
    ====================== */

  .abstract__cta {
    position: relative;
    z-index: 1;
    background: linear-gradient(0.45turn,
        rgb(var(--primary-color-rgb)),
        rgb(var(--accent-color-rgb)));
    overflow: hidden;
  }

  .abstract__cta .lines {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    height: 100%;
    width: 50%;
  }

  /* =====================
    SECTION: REGISTRATION
    ====================== */

  .registration__section {
    position: relative;
    z-index: 1;
  }

  .bg {
    position: relative;
    z-index: 1;
    overflow: hidden;
  }

  .bg .pattern {
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    z-index: -1;
  }

  .registration__info {
    /* background-color: rgb(33, 37, 41);
    background-color: rgba(var(--secondary-color-rgb), 1);
    background: radial-gradient(circle, #ffbb33, #f49a08, var(--secondary-color)); */
    border-width: 0px 0px 10px;
    border-image: initial;
    border-radius: 20px;
    border-bottom: 10px solid #734e23;
    border-bottom: 10px solid rgb(var(--primary-color-rgb));
    background-position: center center;
    transition: 0.8s;
    overflow: hidden;
  }

  .registration__info .top {
    position: relative;
    z-index: 1;
    overflow: hidden;
    padding: 20px 0px;
    background: linear-gradient(0.45turn,
        rgb(var(--primary-color-rgb)),
        rgb(var(--accent-color-rgb)));
  }

  .registration__info .top .header {
    position: relative;
    text-align: center;
    color: var(--bs-light);
    z-index: 11;
  }

  .registration__info .top::after {
    position: absolute;
    height: 100%;
    width: 100%;
    clip-path: polygon(0% 0%, 100% 0%, 80% 100%, 20% 100%);
    left: 0px;
    top: -1px;
    content: "";
    background: rgba(0 0 0 / 20%);
  }

  .registration__cost {
    text-align: center;
    padding: 1rem;
    color: #573b18;
    border-color: rgba(0, 0, 0, 0.5);
    border: 1px solid rgb(237 185 74 / 93%);
    background: radial-gradient(circle, #f1be49, #c58424);
    background: radial-gradient(circle, #f1be49, var(--secondary-color));
  }

  /* =====================
    SECTION: HEAD
    ====================== */

  .committee_head {
    position: relative;
    color: #fff;
    font-weight: 700;
    font-family: var(--heading-font);
    font-size: var(--fs-small-banner);
    display: inline-block;
    padding: 5px 30px;
    background: var(--primary-color);
    border-radius: 1rem;
    line-height: 1;
  }

  .committee_head::before,
  .committee_head::after {
    position: absolute;
    content: "";
    height: 2px;
    width: 5vw;
    top: 50%;
    background: var(--primary-color);
  }

  .committee_head::before {
    right: -5vw;
  }

  .committee_head::after {
    left: -5vw;
  }

  /* =====================
    SECTION: DESTINATION
    ====================== */

  .venue__section {
    position: relative;
    z-index: 1;
    overflow: hidden;
  }

  .venue__section .pattern {
    position: absolute;
    right: 0;
    top: 0;
    z-index: -1;
  }

  .destination__info {
    text-align: center;
    position: relative;
    z-index: 1;
    border-radius: 0.7rem;
    overflow: hidden;
    display: block;
  }

  .destination__info::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    bottom: 0;
    left: 0;
    background: linear-gradient(184deg,
        rgba(255, 255, 255, 0) 33%,
        rgba(var(--secondary-color-rgb), 1) 83%);
    z-index: 1;
  }

  .destination__text {
    position: absolute;
    bottom: 20px;
    width: 100%;
    color: var(--bs-dark);
    z-index: 1;
  }

  .destination__info img {
    transition: all 0.3s linear;
  }

  .destination__info:hover .destination__thumb img {
    transform: scale(1.1);
    transition: all 0.3s linear;
  }

  /*  */

  .table-responsive table tr td,
  .table-responsive table tr th {
    vertical-align: middle;
  }

  .table-responsive table tr td small {
    display: block;
    font-size: var(--fs-small);
  }

  .social__media {
    position: fixed;
    top: 40%;
    right: 0;
    z-index: 1111;
  }

  .social__media ul li a {
    padding: 0.5rem 1rem;
    display: block;
  }

  .social__media ul li.first {
    background: #1877F2;
  }

  .social__media ul li.second {
    background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
  }

  /* =====================
    SECTION: ACCOMMODATION
    ====================== */

  .accommodation__content {
    padding: 1rem;
    border-radius: 1rem;
    box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
    height: 100%;
  }

  .accommodation__img img {
    border-radius: 1rem;
    margin-bottom: 1rem;
  }

  /*  */


  .faculty__modal .modal-content {
    border: none;
    background: linear-gradient(to right, #e2efff 25%, #ffffff 25%);
  }

  .modal .btn-close {
    position: absolute;
    right: 0;
    padding: 1rem;
  }

  .modal .faculty img {
    width: 200px;
    border-radius: 0 0 20px 0;
  }

  .faculty__name {
    display: inline-block;
    padding: 5px 10px;
    background: var(--accent-color);
    color: var(--bs-light);
    border-radius: 5px;
    margin-bottom: 0.6rem;
  }

  /*  */



  /*.blink1*/

  .blink1 {
    -webkit-animation: blink1 1s infinite;
    -moz-animation: blink1 1s infinite;
    /* Fx 5+ */
    -o-animation: blink1 1s infinite;
    /* Opera 12+ */
    animation: blink1 1s infinite;
    /* IE 10+, Fx 29+ */
  }

  @-webkit-keyframes blink1 {

    0%,
    49% {
      color: #000;
      background-color: #fff;
    }

    50%,
    100% {
      color: #000;
      background-color: var(--secondary-color);
    }
  }

  .early-end {
    position: absolute;
    top: 2%;
    right: 2%;
    padding: 30px 10px;
    /* clip-path: polygon(30% 0%, 70% 0%, 100% 30%, 100% 70%, 70% 100%, 30% 100%, 0% 70%, 0% 30%); */
  }


  .courses {
    background: rgba(var(--accent-color-rgb), 0.1);
    border-radius: 10px;
    display: flex;
    margin: 10px 0;
    font-size: var(--fs-caption);
    align-items: center;
  }

  .c_number {
    display: inline-block;
    align-content: center;
    background: var(--primary-color);
    font-size: var(--fs-small-banner);
    font-weight: 900;
    color: var(--bs-light);
    border-radius: 10px 0 0 10px;
    min-width: 100px;
    min-height: 100px;
    text-align: center;
  }

  .c_name {
    height: 100%;
    border-radius: 0 10px 10px 0;
    padding: 10px;
  }

  .scalloped-box {
    --r: 8px;
    /* height: 320px; */
    /* aspect-ratio: 1; */
    padding: calc(1.5 * var(--r));
    mask: linear-gradient(#000 0 0) no-repeat 50% / calc(100% - 2 * var(--r)) calc(100% - 2 * var(--r)), radial-gradient(farthest-side, #000 97%, #0000) 0 0 / calc(2 * var(--r)) calc(2 * var(--r)) round;
  }
}