body {
    height:100%;
    width:100%;
    background:snow;
}

.parallax {
    background-image: url("images/background-tent.jpeg");
    
    height:100%;

    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;

    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
      clip-path: polygon(0 0, 100% 10%, 100% 100%, 0 100%);
}

#parallax2 {
    background-image: url("images/bsb-bg.jpg");
    
    height:100%;

    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.navbar {
    z-index:1000000000000000;
    font-family:'Raleway', Helvetica, sans-serif;
    background-color: RGBA(23, 40, 80)
}

.carousel-inner {
        height:44vw !important;
        overflow:hidden !important;
        z-index:-1 !important;
  }
  
  .carousel-inner img {
      height:58vw !important;
      z-index:-1 !important;
  }

#player-item1 {
    background-image: url("images/basketball-top1.jpeg");
    
    height:100%;

    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;

}

#player-item2 {
    background-image: url("images/basketball-top2.jpeg");
    
    height:100%;

    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;

}

#player-item3 {
    background-image: url("images/baseball-top.jpeg");
    
    height:100%;

    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;

}

#player-item4 {
    background-image: url("images/vb.jpg");
    
    height:100%;

    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;

}

.top-h1-box {
    position:absolute; 
    z-index:50000000000000; 
    font-family: "Oswald" ,Helvetica, sans-serif;
    color:white;
    margin-top:15vw;
    margin-left:5vw;
    letter-spacing:.1vw;
}

.c-h1 {
    font-size:5vw;
    background-color:RGBA(235, 177, 0, .70);
    padding-left:1vw;
    margin-bottom:1vw;
}

#c-h1-1 {
    padding-right:1vw;
}

#c-h1-2 {
    margin-right:3vw;
}

#c-h1-3 {
    margin-right:9vw;
}

.enroll-box {
    height: 10vw;
    margin-top:1vw;
    background: rgba(1, 58, 107, 1);
    font-family: 'Oswald', sans-serif; 
    border-top: solid #202020 1vw;
    border-bottom: solid #202020 1vw;
}

.mission, .vision, .philo {
    height:26vw;
    background: RGBA(1, 26, 62, .60);
    font-family: "Lato", Helvetica, sans-serif;
    color:snow;
}

.philo {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 90%, 0 100%);
      clip-path: polygon(0 0, 100% 10%, 100% 100%, 0 100%);
      border-bottom-width:.1vw;
      border-bottom-style:solid;
      /* border-bottom-color:RGBA(235, 177, 0, .90); */
      border-bottom-color:snow;
}

#p-h1 {
    font-size:5vw;
    margin-left:5vw;
    padding-top:6vw;
    padding-bottom:1vw;
    color:RGBA(255, 217, 0, 10);
    font-family:'Oswald', Helvetica, sans-serif;
    letter-spacing:.2vw;
}

#m-h1, #v-h1 {
    font-size:5vw;
    padding-top:3.5vw;
    color:RGBA(255, 217, 0, 10);
    font-family:'Oswald', Helvetica, sans-serif;
    letter-spacing:.2vw;
}

#m-p, #v-p, #p-p {
    font-size:1.2vw;
    margin-left:5vw;
    margin-right:5vw;
    /* letter-spacing:.05vw; */
    font-family:"Raleway", sans-serif;
}

.vision {
    height:24vw;
    width:100%;
    /* -webkit-clip-path: polygon(0 0, 100% 0, 100% 87%, 0 100%);
      clip-path: polygon(0 0, 100% 0, 100% 87%, 0 100%); */
      /* background:RGBA(235, 177, 0, .30); */
}

.learn {
    font-family: "Lato", Helvetica, sans-serif;
    border-radius:3px;
    font-size:1.2vw;
    background:RGBA(235, 177, 0, .90);
    cursor: default;
}

.learn:hover {
    cursor:default;
}

#learn-1 {
    margin-left:5vw;
}

.learn a {
    text-decoration:none;
    color:rgba(80,80,80) !important;
    letter-spacing:.01vw;
    transition: 200ms
}

.learn a:hover {
    color:rgba(50,50,50);
    cursor: default;
}

#learn-3 {
    margin-left: 1vw;
    cursor: pointer;
}

#learn-3 a {
    cursor: pointer;
}

.player-img {
    filter:brightness(.65);
    transition:450ms;
}

.player-img:hover {
    filter: brightness(1);
    cursor:pointer;
}

.nav-brand {
    height:55%;
    width:55%;
    transition:300ms
}

.nav-scrolled {
    height:3.5vw !important;
}

.nav-brand-scrolled {
    height:40% !important;
    width:40% !important;
}

.nav-link {
    cursor: pointer !important;
}

.dropdown-item {
    color:white;
    transition:300ms;
}

.dropdown-item:hover {
    background: transparent !important;
    color:lightgray !important;
}

#carousel-players {
    display:none !important;
}

#carousel-players .carousel-inner {
    height:102vw !important;
}

#carousel-players .carousel-inner .carousel-item img{
    height:100vw !important;
    width:70% !important;
    margin-left:auto;
    margin-right:auto;
}

.sports-desc {
    margin-top:1vw;
}

/* .diamond {
    height:5vw;
    width:5vw;
    border-width:.2vw;
    border-style:solid;
    border-color:darkgray;
    border-radius:.3vw;
    background-color:RGBA(248,248,248);
    color:rgba(80,80,80);
    background:RGBA(235, 177, 0, .95);
    letter-spacing:.1vw;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    transition:200ms;
    cursor: pointer;
}

.diamond:hover {
    color:white;
    background: RGBA(1, 26, 62, .95);
} */

#some-area2 {
    background-image: url("images/bsb-bg.jpg");
    transition:300ms;
    background-size:cover;
}

.some-area3 {
    height:60vw;
    background: rgba(1, 50, 102, 1);
    margin-top:-2vw;
}

.footer-ul {
    font-size:1.2vw;
}

.footer-li {
    font-size:1vw;
    text-align:left;
    text-indent:1.5vw;
    list-style: none;
}

.footer-li a {
    text-decoration:none;
    color:white;
}

#copyright {
    position:relative;
    top:-4vw;
}

.email-form-container {
    color:white;
    height:28vw;
    width:40% !important;
    padding:0;
    padding-top:-2vw;
    margin-left:56%;
    margin-top:2vw;
    list-style: none;
    font-size:1.6vw;
}

.email-li {
    margin-top:1vw;
    font-size:1vw;
}

#ic1 {
    float:left;
    margin-right:2%
}

.lesser-email-input {
    text-indent:2%;
}

#lei2 {
    width:57%
}

.text-email-container {
    padding-top:1vw;
}

.email-text {
    height:10vw;
    width:82.5%;
    resize:none;
    padding-left:1%;
}

.email-send-button {
    position:relative;
    top:11vw;
    left:-17.5%;
    float:right;
}

.social-button-container {
    margin-top:2vw;
}

.social-button {
    color:white;
    font-size:1.8vw;
    background-color:transparent;
    border:none;
}

.social-button a {
    text-decoration:none;
    color:snow;
}

@media screen and (max-width:600px){

    .top-h1-box {
        display:none;
    }

    .philo {
        height:145vw
    }

    .vision {
        height:155vw;
    }

    .parallax {
        -webkit-clip-path: polygon(0 0, 100% 0, 100% 98%, 0 100%);
      clip-path: polygon(0 0, 100% 2.5%, 100% 100%, 0 100%);
    }

    .philo {
        -webkit-clip-path: polygon(0 0, 100% 0, 100% 98%, 0 100%);
      clip-path: polygon(0 0, 100% 2.5%, 100% 100%, 0 100%);
    }

    #p-h1 {
        padding-top:15vw;
        font-size:12vw;
        text-align:center;
        margin-left:3%;
        margin-right:3%;
    }

    #p-p {
        font-size:4vw;
        margin-top:5vw;
        text-align:center;
    }

    .mis, .vis {
        width:100% !important;
    }

    .vis {
        padding-top:5vw;
    }

    #m-h1, #v-h1 {
        font-size:12vw;
        padding-top:10vw;
    }

    #m-p, #v-p {
        font-size:4vw;
    }

    .learn {
        font-size:3vw;
    }

    #learn-1 {
        margin-left:40%;
    }
    
    .navbar-toggler {
      margin-top:-10%;
    }

    #home-link {
        margin:0 !important;
    }
    
    .dropdown-menu {
        background:transparent !important;
        border:none !important;
    }
    
    .some-area3 {
        height:62vw;
    }
    
    .list-container {
        margin-left:7% !important;
    }
    
    .carousel-inner {
        height:180vw !important;
        z-index:-1 !important;
  }
  
  .carousel-inner img {
      height:180vw !important;
      width:200% !important;
      z-index:-1 !important;
  }
  
  .enroll-box {
      position:absolute;
      height:200px;
      margin-top:-150vw;
      z-index:1 !important;
      background:none;
  }

  .enroll-box h1 {
      display:none !important;
  }
  
  .enroll-text-box .en-h1-2 {
      display: inline-block !important;
      font-size:16vw !important;
      color:white;
      background: RGBA(235, 177, 0, .90);
  }

  #en-h1-2-1 {
      margin-left:18%;
      padding-left:1vw;
      padding-right:1vw;
  }
  
  #en-h1-2-2 {
    margin-left:10%;
    padding-left:1vw;
    padding-right:1vw;
  }

  #en-h1-2-3 {
    margin-left:28%;
    padding-left:1vw;
    padding-right:1vw;
  }
  
  .enroll-box p {
      display:none;
      border:none;
  }
  
  .shield {
      height:70vw !important;
      width:95vw !important;
      bottom:13vw !important;
      right:1.5vw !important;
  }
  
  .some-area h1 {
      padding-top:3vw;
      font-size:10vw !important;
      padding-bottom:1vw !important;
  }
  
  .some-area p {
      font-size:7vw !important;
  }
  
  #area1-p2 {
      font-size:5vw !important;
  }
  
    #some-area2 {
        height:145vw !important;
    }

    #carousel-players {
        height:80vw !important;
    }

    #carousel-players .carousel-inner .carousel-item img {
        height:80vw !important;
        width:60% !important;
        padding-top:5vw !important;
    }

  .sports-desc h1 {
      font-size:10vw !important;
      margin-top:5vw !important;
  }
  
  .sports-desc p {
      font-size:4vw !important;
  }
  
  /* .diamond-area {
      width:100% !important;
      padding-top:3vw !important;
  }
  
  .diamond {
      width:20vw !important;
      height:20vw !important;
      border-radius:1vw !important;
  }
  
  .diamond h1 {
      font-size:6vw !important;
      margin-top:5vw !important;
  }
  
  #diamond1 {
      float:right !important;
      position:relative;
      right:20vw;
      margin-left:0 !important;
  }
  
  #diamond2 {
      position:relative;
      left:20vw;
      margin-left:0 !important;
  } */
  
  .some-area3 {
      height:90vw !important;
  }
  
  .some-area3 img {
      height:32vw !important;
      width:90% !important;
      position:relative;
      left:2.5vw !important;
      margin-left:3% !important;
      padding-top:5vw;
  }

  .divider-bt {
      height:.2vw !important;
  }
  
  .some-area3 p {
      font-size:5vw !important;
      margin-left:8%;
      margin-right:8%;
      padding-bottom:3vw;
      padding-top:2vw;
  }
  
  .list-container {
      float:none !important;
      width:100% !important;
       margin:0 !important;
       margin-top:3vw !important;
  }
  
  .some-area3 ul {
      font-size:4vw !important;
      padding-left:25vw;
      padding-right:5vw;
  }
  
  .some-area3 li {
      font-size:3vw !important;
      padding-right:0 !important;
  }
  
  #copyright {
      font-size:2vw !important;
      position:relative;
      top:2vw;
  }
  
  #ul-2 {
     position:relative;
     margin-left:55vw;
     padding:0 !important;
     margin-right:0 !important;
  }
  
  #ul-4 {
      position:relative;
      margin-left:55vw;
      padding:0 !important;
      margin-right:0vw !important;
  }
  
  .contact-container {
      width: 100% !important;
  }
  
  .contact-container ul {
      position:relative;
      left:-5vw !important;
  }
  
  #ulc-2 {
      position:relative;
      top:-22vw;
      left: 50vw !important;
      width:40%;
  }
  
  #ulc-3 {
      position:relative;
      top:-22vw;
  }
  
  #ulc-4 {
      position:relative;
      right:-4vw !important;
      top:-22vw;
  }
  
  .contact-container {
      right:5vw;
      display:none !important;
  }

  .email-form-container {
      display:none !important;
  }
  
  .player-imgs {
    display:none !important;
}

#carousel-players, #carousel-players .carousel-inner, .active, .carousel-control-prev, .carousel-control-next  {
    display:block !important;
}

  .social-button-container-2 {
    display:block !important;
    width:50%;
    margin-left:auto;
    margin-right:auto;
    padding-left:10%;
    margin-top:2vw;
}

.social-button {
    color:white;
    font-size:5vw;
    background-color:transparent;
    border:none;
}

#car-play2 {
    width:60vw !important;
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
  height: 100px;
  width: 100px;
  outline: black;
  background-size: 100%, 100%;
  background-image: none;
  color: RGBA(1, 26, 62) !important;
}

.carousel-control-next-icon {
    margin-left:-8vw;
  }

.carousel-control-next-icon:after
{
  content: '>';
  font-size: 55px;
  color: RGBA(1, 26, 62) !important;
}

.carousel-control-prev-icon:after {
  content: '<';
  font-size: 55px;
  color: RGBA(1, 26, 62) !important;
}
  
}

@media only screen and (min-width: 600px) and (max-width: 1000px) {

    body {
        overflow-x: hidden;
    }

    .nav-brand {
        width:50% !important;
    }

     .top-h1-box {
        display:none;
    }

    .philo {
        height:115vw
    }

    .vision {
        height:125vw;
    }

    .parallax {
        -webkit-clip-path: polygon(0 0, 100% 0, 100% 98%, 0 100%);
      clip-path: polygon(0 0, 100% 2.5%, 100% 100%, 0 100%);
    }

    .philo {
        -webkit-clip-path: polygon(0 0, 100% 0, 100% 98%, 0 100%);
      clip-path: polygon(0 0, 100% 2.5%, 100% 100%, 0 100%);
    }

    #p-h1 {
        padding-top:15vw;
        font-size:10vw;
        text-align:center;
        margin-left:0;
    }

    #p-p {
        font-size:3.5vw;
        margin-top:5vw;
        text-align:center;
    }

    .mis, .vis {
        width:100% !important;
    }

    .vis {
        padding-top:5vw;
    }

    #m-h1, #v-h1 {
        font-size:10vw;
        padding-top:10vw;
    }

    #m-p, #v-p {
        font-size:3.5vw;
    }

    .learn {
        font-size:3vw;
    }

    #learn-1 {
        margin-left:40%;
    }
    
    #home-link {
        margin:0 !important;
    }

    .dropdown-menu {
        background:transparent !important;
        border:none !important;
    }
    
    .list-container {
        margin-left:7% !important;
    }
    
    .carousel-inner {
        height:120vw !important;
        z-index:-1 !important;
  }
  
  .carousel-inner img {
      height:120vw !important;
      width:200% !important;
      z-index:-1 !important;
  }
  
  .enroll-box {
      position:absolute;
      height:200px;
      margin-top:-100vw;
      z-index:1 !important;
      background:none;
      border:none;
  }

  .enroll-box h1 {
      display:none !important;
  }
  
  .enroll-text-box .en-h1-2 {
      display: inline-block !important;
      font-size:10vw !important;
      color:white;
      background: RGBA(235, 177, 0, .90);
  }

  #en-h1-2-1 {
      margin-left:30%;
      padding-left:1vw;
      padding-right:1vw;
  }
  
  #en-h1-2-2 {
    margin-left:25%;
    padding-left:1vw;
    padding-right:1vw;
  }

  #en-h1-2-3 {
    margin-left:38%;
    padding-left:1vw;
    padding-right:1vw;
  }
  
  .enroll-box p {
      display:none;
  }
  
  .shield {
      height:55vw !important;
      width:75vw !important;
      bottom:5vw !important;
      right:11vw !important;
  }
  
  .some-area h1 {
      padding-top:3vw;
      font-size:8vw !important;
      padding-bottom:1vw !important;
      margin-left:10%;
      margin-right:10%;
  }
  
  .some-area p {
      font-size:5vw !important;
  }
  
  #area1-p2 {
      font-size:3.5vw !important;
  }
  
    #some-area2 {
        height:145vw !important;
    }

    #carousel-players {
        height:60vw !important;
        width:100% !important;
    }

    #carousel-players .carousel-inner {
        height:60vw !important;
    }

    #carousel-players .carousel-inner .carousel-item img {
        height:60vw !important;
        width:50% !important;
        padding-top:5vw !important;
        padding-bottom:3vw;
        z-index:99999999999999999 !important
    }

    .sports-desc {
        padding-bottom:3vw;
        margin-top:1vw !important;
    }

  .sports-desc h1 {
      font-size:8vw !important;
      padding-top:1vw !important;
      margin-left: 31%;
      margin-right:35%;
  }
  
  .sports-desc p {
      font-size:3.5vw !important;
      margin-left:10% !important;
      margin-right:10% !important;
  }
  
  #some-area2 {
      height:112vw !important;
  }

  .some-area3 {
    height:88vw !important;
}

.some-area3 img {
    height:30vw !important;
    width:90% !important;
    position:relative;
    left:2.5vw !important;
    margin-left:3% !important;
    padding-top:5vw;
}

.divider-bt {
    height:.2vw !important;
}

.some-area3 p {
    font-size:5vw !important;
    margin-left:8%;
    margin-right:8%;
    padding-bottom:3vw;
    padding-top:2vw;
}

.list-container {
    float:none !important;
    width:100% !important;
     margin:0 !important;
     margin-top:3vw !important;
}

.some-area3 ul {
    font-size:4vw !important;
    padding-left:25vw;
    padding-right:5vw;
}

.some-area3 li {
    font-size:3vw !important;
    padding-right:0 !important;
}

#copyright {
    font-size:1.6vw !important;
    position:relative;
    top:1vw;
    margin-left:10%;
}

#ul-2 {
   position:relative;
   margin-left:55vw;
   padding:0 !important;
   margin-right:0 !important;
}

#ul-4 {
    position:relative;
    margin-left:55vw;
    padding:0 !important;
    margin-right:0vw !important;
}

.contact-container {
    width: 100% !important;
}

.contact-container ul {
    position:relative;
    left:-5vw !important;
}

#ulc-2 {
    position:relative;
    top:-22vw;
    left: 50vw !important;
    width:40%;
}

#ulc-3 {
    position:relative;
    top:-22vw;
}

#ulc-4 {
    position:relative;
    right:-4vw !important;
    top:-22vw;
}

.contact-container {
    display:none;
}

.social-button-container-2 {
    display:block !important;
    width:40%;
    margin-left:auto;
    margin-right:auto;
    padding-left:6%;
    margin-top:2vw;
}

.social-button {
    color:white;
    font-size:5vw;
    background-color:transparent;
    border:none;
}

.contact-container ul li {
    font-size: 2vw !important;
    }


    .player-imgs {
        display:none !important;
    }
    
    #carousel-players, #carousel-players .carousel-inner, .active, .carousel-control-prev, .carousel-control-next  {
        display:block !important;
    }

    #car-play1 {
        width:60vw !important;
        height:60vw !important;
    }

.carousel-control-prev-icon,
.carousel-control-next-icon {
  height: 100px;
  width: 100px;
  outline: black;
  background-size: 100%, 100%;
  background-image: none;
  color: RGBA(1, 26, 62) !important;
}

.carousel-control-next-icon:after
{
  content: '>';
  font-size: 55px;
  color: RGBA(1, 26, 62) !important;
}

.carousel-control-prev-icon:after {
  content: '<';
  font-size: 55px;
  color: RGBA(1, 26, 62) !important;
}
}

    /* For tablets: */