body{
    overflow: hidden;
}

.navbar{
    /* background-image: linear-gradient(to right, rgba(255, 255, 255, .5%) 1%, rgba(40, 109, 212, 0.3),rgba(0, 67, 197, 0.4)); */
    /* background: rgba(53, 53, 53, 1); */
    background: #ffffff !important;
    height: 10vh;
}

.container{
    max-width: 100%;
  
    padding: 0;
}

.navbar-nav{
    /*margin-right: 10rem;*/
}
.section1{
   
  background: rgb(18,70,181);
  background: -moz-radial-gradient(circle, rgba(18,70,181,1) 0%, rgba(89,44,202,1) 100%);
  background: -webkit-radial-gradient(circle, rgba(18,70,181,1) 0%, rgba(89,44,202,1) 100%);
  background: radial-gradient(circle, rgba(18,70,181,1) 0%, rgba(89,44,202,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#1246b5",endColorstr="#592cca",GradientType=1); 
    

    background-repeat: no-repeat;
    background-size: cover;
}
.section2 h1{

  background: -webkit-linear-gradient(top, rgb(9, 62, 132) 0%, rgb(61, 53, 151) 66%, rgb(123, 42, 173) 86%, rgb(161, 35, 187) 100%);
  background: -o-linear-gradient(top, rgb(9, 62, 132) 0%, rgb(61, 53, 151) 66%, rgb(123, 42, 173) 86%, rgb(161, 35, 187) 100%);
  background: -ms-linear-gradient(top, rgb(9, 62, 132) 0%, rgb(61, 53, 151) 66%, rgb(123, 42, 173) 86%, rgb(161, 35, 187) 100%);
  background: -moz-linear-gradient(top, rgb(9, 62, 132) 0%, rgb(61, 53, 151) 66%, rgb(123, 42, 173) 86%, rgb(161, 35, 187) 100%);
  background: linear-gradient(to bottom, rgb(9, 62, 132) 0%, rgb(61, 53, 151) 66%, rgb(123, 42, 173) 86%, rgb(161, 35, 187) 100%);

  
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;

  font-weight: bolder;
  font-size: 3em;

}


.btnc{
  background: -webkit-linear-gradient(to right, rgb(9, 62, 132) 0%, rgb(61, 53, 151) 30%, rgb(123, 42, 173) 70%, rgb(161, 35, 187) 100%);
  background: -o-linear-gradient(to right, rgb(9, 62, 132) 0%, rgb(61, 53, 151) 30%, rgb(123, 42, 173) 70%, rgb(161, 35, 187) 100%);
  background: -ms-linear-gradient(to right, rgb(9, 62, 132) 0%, rgb(61, 53, 151) 30%, rgb(123, 42, 173) 70%, rgb(161, 35, 187) 100%);
  background: -moz-linear-gradient(to right, rgb(9, 62, 132) 0%, rgb(61, 53, 151) 30%, rgb(123, 42, 173) 70%, rgb(161, 35, 187) 100%);
  background: linear-gradient(to bottom, rgb(9, 62, 132) 0%, rgb(61, 53, 151) 30%, rgb(123, 42, 173) 70%, rgb(161, 35, 187) 100%);

  color: white;
  border-radius: 20px;
}

.section2{
    background-color: #000080;
    background: url('../../images/bg1.avif');
    background-size: cover;
    background-position: center;
    height: 20vh;
    background-repeat: no-repeat;
   
  display: flex;
justify-content: center;
align-items: center;

}

.section3-1{
  background-color: #000080;
  background: url('../../images/bg2.png');
  background-size: cover;
  background-position: center;
  min-height: 350px;
  background-repeat: no-repeat;
 

}




.section3{
    background-color: #ffffff;
    min-height: 80vh;
}

.section4{
  background: -webkit-linear-gradient(top, rgb(9, 62, 132) 0%, rgb(61, 53, 151) 66%, rgb(123, 42, 173) 86%, rgb(161, 35, 187) 100%);
  background: -o-linear-gradient(top, rgb(9, 62, 132) 0%, rgb(61, 53, 151) 66%, rgb(123, 42, 173) 86%, rgb(161, 35, 187) 100%);
  background: -ms-linear-gradient(top, rgb(9, 62, 132) 0%, rgb(61, 53, 151) 66%, rgb(123, 42, 173) 86%, rgb(161, 35, 187) 100%);
  background: -moz-linear-gradient(top, rgb(9, 62, 132) 0%, rgb(61, 53, 151) 66%, rgb(123, 42, 173) 86%, rgb(161, 35, 187) 100%);
  background: linear-gradient(to bottom, rgb(9, 62, 132) 0%, rgb(61, 53, 151) 66%, rgb(123, 42, 173) 86%, rgb(161, 35, 187) 100%);
  
    min-height: 80vh;
}

.pangako{
  background: -webkit-linear-gradient(top, rgb(9, 62, 132) 0%, rgb(61, 53, 151) 66%, rgb(123, 42, 173) 86%, rgb(161, 35, 187) 100%);
  background: -o-linear-gradient(top, rgb(9, 62, 132) 0%, rgb(61, 53, 151) 66%, rgb(123, 42, 173) 86%, rgb(161, 35, 187) 100%);
  background: -ms-linear-gradient(top, rgb(9, 62, 132) 0%, rgb(61, 53, 151) 66%, rgb(123, 42, 173) 86%, rgb(161, 35, 187) 100%);
  background: -moz-linear-gradient(top, rgb(9, 62, 132) 0%, rgb(61, 53, 151) 66%, rgb(123, 42, 173) 86%, rgb(161, 35, 187) 100%);
  background: linear-gradient(to bottom, rgb(9, 62, 132) 0%, rgb(61, 53, 151) 66%, rgb(123, 42, 173) 86%, rgb(161, 35, 187) 100%);
  color: #ffffff;
  background-attachment: fixed;
    min-height: 100vh;
}




.section6{
  
  background: linear-gradient(rgba(0,0,0,.3), rgba(0,0,0,.3)),url('../../images/bg33.png');
  background-size:cover;
  background-position: center;
  height: auto;
  background-repeat: no-repeat;
 
display: flex;
justify-content: center;
align-items: center;

}

.check-ol {
  list-style: none;
  text-indent: -20px;
  margin-left: 20px;
}

.check-ol li:before {
  content: "\2713\0020 ";
}

.carousel{
    height: 100%;
}

.bimCarousel{
    background: transparent;
    display: flex;
    align-content: center;
    align-items: center;
}

.carousel-inner{
    overflow: unset;
}
.carousel-caption{
    position: initial;
}

@media (max-width: 900px) {
  .link-unstyled.soc { display: none !important }
  .banner{
    display: none !important;
  }
  .bannerCONT{
    padding-top: 0px !important;
    justify-content: center !important;
    
  }
  
 
}
@media (max-width: 1198px) {
    .info { 
        width: 100% !important;
        left:0 !important;
        top: 30% !important;

    }
    .soc{
      font-size: .8em !important;
    }
}

@media (max-width: 600px) {
    .info { 
        top: 20% !important;
    }
    
}

@media (max-width: 500px) {
   .section1{
     /* height: 65vh; */
   }
   
    .copy hr{
        width: 300px !important;
    }
    .info { 
        top: 15% !important;
    }
    .soc{
        font-size: 11px !important;
    }
}


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

}

@media  (max-width: 420px) {
    .box{
        height: 90% !important;
    }
    .section5{
        padding-top: 14% !important;
    }

}

@media  (max-width: 1500px) {
    
    .section5{
        padding-top: 10% !important;
        padding-bottom: 1% !important;
    }

}



@media only screen and (max-width: 850px) {
    .section1{
     /* height: 300px !important; */
     
    }
    .section2{
      /* height: 200px !important; */
      
     }
    
    .socContainer{
        font-size: 1em !important;
        margin-left: -80px !important;
    }
    .slogan{
        font-size: 2em !important;
    }
  }

.carouselContent{
    position: absolute;
    top: 50%;left: 45%;
    transform: translate(-50%,-50%);
}
.modal-backdrop
{
    opacity:0.8 !important;
}

#logo{
    width: 40%;
}

.diagonal-box {
	background: blue;
    height: 300px;
    width: 100%;
	transform: skewY(-19deg);
} 
.content { 	
	max-width: 50em;
    margin: 0 auto; 
}

.section5{
    background: url('../../images/gray.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    height: 80vh;
    padding-top: 8%;
}


.box {
    background-color: #000080;
    height: 75%;
    /* padding: 20% 20px; Added a percentage value for top/bottom padding to keep the wrapper inside of the parent */
    
    -webkit-transform: skewY(-8deg);
    -moz-transform: skewY(-8deg);
    -ms-transform: skewY(-8deg);
    -o-transform: skewY(-8deg);
    transform: skewY(-8deg);
  }
  
  .box > .wrapper {
      
    -webkit-transform: skewY(8deg);
    -moz-transform: skewY(8deg);
    -ms-transform: skewY(8deg);
    -o-transform: skewY(8deg);
    transform: skewY(8deg);
  }

 .socContainer{
    font-size: 2em;
    /*color: #c83200;*/
    text-align: left;
    margin-left: -10px;
 }

 .link-unstyled, .link-unstyled:link, .link-unstyled:hover {
    color: inherit;
    text-decoration: inherit;
   
  }
  .progCont {
    width: 90%;
    margin: auto !important;
  }
  

  .loader {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    
  }
  
  

  #overlay {
    position: fixed;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ffffff;
    z-index: 1031;
    cursor: pointer;
  }


  .lds-ellipsis {
    display: inline-block;
    position: relative;
    width: 80px;
    height: 80px;
  }
  .lds-ellipsis div {
    position: absolute;
    top: 33px;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    background: #042d61;
    animation-timing-function: cubic-bezier(0, 1, 1, 0);
  }
  .lds-ellipsis div:nth-child(1) {
    left: 8px;
    animation: lds-ellipsis1 0.6s infinite;
  }
  .lds-ellipsis div:nth-child(2) {
    left: 8px;
    animation: lds-ellipsis2 0.6s infinite;
  }
  .lds-ellipsis div:nth-child(3) {
    left: 32px;
    animation: lds-ellipsis2 0.6s infinite;
  }
  .lds-ellipsis div:nth-child(4) {
    left: 56px;
    animation: lds-ellipsis3 0.6s infinite;
  }
  @keyframes lds-ellipsis1 {
    0% {
      transform: scale(0);
    }
    100% {
      transform: scale(1);
    }
  }
  @keyframes lds-ellipsis3 {
    0% {
      transform: scale(1);
    }
    100% {
      transform: scale(0);
    }
  }
  @keyframes lds-ellipsis2 {
    0% {
      transform: translate(0, 0);
    }
    100% {
      transform: translate(24px, 0);
    }
  }
  

  @font-face {
    font-family: 'Poppins';
    src: url('../../fonts/Poppins-Regular.ttf');
  }

  body {
    font-family: 'Poppins';
  }

  .nav-link, .dropdown-item{
    color: #898989 !important;
  }


 .nav-link.active{
   color: #042d61 !important;
 }

 .navbar-dark .navbar-toggler{
   /* border-color: #898989 !important; */
 }


 
 .navbar-dark .navbar-toggler-icon {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28137, 137, 137, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

.modalC{
  position: absolute;right: 0;
  width: 56%;
  height: 90%;/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,ffffff+50,ffffff+51,ffffff+100 */

  background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
    background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
    background-image: -webkit-gradient(top, 0 0, 100% 0, from(rgba(255, 255, 255, 1)), to(rgba(255, 255, 255, 0)));
    background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
    background-image: -o-linear-gradient(top, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
    background-image: linear-gradient(top, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='rgba(255, 255, 255, 1)', endColorstr='rgba(255, 255, 255, 0)', GradientType=1);

    box-shadow: -1px 0px 10px #aaa;

    
    border-right: 15px solid #1450a4;

}

.modal-backdrop
{
    opacity:0.9 !important;
}