.titillium-web-extralight {
  font-family: "Titillium Web", sans-serif;
  font-weight: 200;
  font-style: normal;
}

.titillium-web-light {
  font-family: "Titillium Web", sans-serif;
  font-weight: 300;
  font-style: normal;
}

.titillium-web-regular {
  font-family: "Titillium Web", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.titillium-web-semibold {
  font-family: "Titillium Web", sans-serif;
  font-weight: 600;
  font-style: normal;
}

.titillium-web-bold {
  font-family: "Titillium Web", sans-serif;
  font-weight: 700;
  font-style: normal;
}

.titillium-web-black {
  font-family: "Titillium Web", sans-serif;
  font-weight: 900;
  font-style: normal;
}

.titillium-web-extralight-italic {
  font-family: "Titillium Web", sans-serif;
  font-weight: 200;
  font-style: italic;
}

.titillium-web-light-italic {
  font-family: "Titillium Web", sans-serif;
  font-weight: 300;
  font-style: italic;
}

.titillium-web-regular-italic {
  font-family: "Titillium Web", sans-serif;
  font-weight: 400;
  font-style: italic;
}

.titillium-web-semibold-italic {
  font-family: "Titillium Web", sans-serif;
  font-weight: 600;
  font-style: italic;
}

.titillium-web-bold-italic {
  font-family: "Titillium Web", sans-serif;
  font-weight: 700;
  font-style: italic;
}
 

body{ background:#fdaf07;font-size:16px; font-family: "Titillium Web", sans-serif;font-weight: 300;font-style: normal;}	 
.title,.col-form-label{font-size:18px; font-weight: 400;}
.logo{width:100%;max-width:320px;clear:both;margin-top:10px;margin-bottom:10px;}
.header{font-weight:700;font-size:26px;}
b,strong{font-weight:700;}
.spacer{margin:0 auto;max-width:64px;display:table;clear: both;
  text-align: center;}
.btnsub{text-align:right;}
.btnsub .btn{font-size:18px;color:#fff;background:#000;border-color:#000;padding-left:20px;padding-right:20px;font-weight:700;}
#wrm{height:200px;}
.invalid-feedback{color:#fff !important;font-weight:700;}

.select-wrapper {
  position: relative;
  width: 100%;
}

.select-wrapper select {
  width: 100%;
  padding: 10px 40px 10px 12px;
  font-size: 16px;
  cursor: pointer;

  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.select-wrapper::after {
  content: "▼";
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  font-size: 12px;
  color: #555;
}
@media (max-width: 991px) {
    .row {
        display: grid;
        grid-template-columns: 1fr;
    }

    #col1 {
        display: contents; /* 👈 key trick */
    }

    #col2 {
        grid-row: 2; /* goes above CONTACT */
	
		padding:0px 0px;

    }

    #introbox {
		grid-row: 1;
	}
    #contactWrapper {
        grid-row: 3;
    }
	
}

@media (max-width: 768px) {

  .expandable {
    max-height: 200px;
    overflow: hidden;
    transition: max-height 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
  }
.exp2{max-height:400px;}
  .expandable.expanded {
    max-height: 5000px; /* large enough for content */
  }

  /* Gradient fade */
  .fade-mask::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    height: 90px;
    width: 100%;
    background: linear-gradient(
      to bottom,
      rgba(253, 175, 7, 0),
      rgba(253, 175, 7, 0.7),
      #fdaf07
    );
    transition: opacity 0.4s ease;
    pointer-events: none;
  }

  .expanded.fade-mask::after {
    opacity: 0;
  }

  /* Expand button */
  .expand-btn {
	  float:right;
    width: auto;
    background: none;
    border: none;
    padding: 0px 0;
    font-weight: 600;
    cursor: pointer;
    text-align: left;
	color:#000;
  }

  .expand-btn span {
    float: right;
    transition: transform 0.3s ease;
	margin-top: 2px;
  color:#000;
  }
  

  .expand-btn.active span {
    transform: rotate(360deg);
	margin-top:0px;
  }
}

/* Desktop: remove all constraints */
@media (min-width: 769px) {
  .expandable {
    max-height: none;
    overflow: visible;
  }
}