/*Main Container*/

body {

    width: 100% !important;
    margin: 0;

}.mother-container{

    margin-top: 95px !important;
    margin-left: auto;
    margin-right: auto;

}









/**********Container Controllers***************/



.section-standard-wrapper{

    padding: 70px 7% 50px 7% !important;

    height: auto;

    background-color: transparent;

}

.thumbnail-card-main-wrapper{

    display: flex;

    justify-content: space-between;

}

.thumbnail-card-wrapper{

    cursor:pointer;

    background-color:white;

    box-shadow: 0px 2px 5px 0px rgba(184, 184, 184, 0.75);

    border-radius: 5px;

}

.card-content-wrapper{

    padding: 10px;

}

.section-standard-wrapper-for-overlay{

    width: 100%;

    background-image: url('http://localhost/Mapua/wp-content/uploads/2026/04/about-us-background.png');

    background-size: cover;

    position: relative;

    min-height: 700px;

}

.overlay-section{

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background: #FFFFFF;

    background: linear-gradient(90deg,rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.75) 100%);

}



.flex-container{

    padding: 30px 7% 20px 7%;

    display: flex;

    justify-content: space-between;

}.flex-container-without-padding{

    display: flex;

    justify-content: space-between;

}.container-padding-left-right{

    padding: 0px 7% 0px 7%;

    display: flex;

    justify-content: space-between;

}.flex-container-center{

    display: flex;

    justify-content: center;

}



/**********Container Controllers***************/









/**********CARDINAL CORNER Container Controllers***************/

.blog-main-card-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 38px;
    justify-content: flex-start;
}
.blog-card-content-wrapper {
    flex: 1 1 calc(31% - 8px);
    max-width: calc(31% - 8px);
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    background-color: #f4f4f4;
    border-radius: 8px;
    padding: 8px;
}
.blog-card-content-wrapper .img-blog {
    width: 100%;
    height: 200px !important;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    display: block;
    border-radius: 8px;
}
.blog-text-content {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 4px 12px 12px 12px;
}
.readmore-btn {
    margin-top: auto;
    align-self: flex-start;
}
.date-time {
    margin-bottom: 24px;
}

/* Tablet: 2 columns */
@media (max-width: 990px) {
    .blog-card-content-wrapper {
        flex: 1 1 calc(50% - 20px);
        max-width: calc(50% - 20px);
    }
}

/* Mobile: 1 column */
@media (max-width: 600px) {
    .blog-main-card-wrapper {
        gap: 20px;
    }

    .blog-card-content-wrapper {
        flex: 1 1 100%;
        max-width: 100%;
    }

    .blog-title {
        font-size: 16px;
    }
}

/* Pagination */
.degree-finder-pagination {
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: 32px;
    flex-wrap: wrap;
    gap: 6px;
}

.degree-finder-pagination .page-numbers {
    padding: 6px 12px;
    border-radius: 4px;
}


/**********CARDINAL CORNER Container Controllers***************/



/**********ACCREDITATIONS and RECOGNITIONS Container Controllers***************/

.thumbnail-card-main-wrapper-accreditations {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.thumbnail-card-wrapper-accreditations {
  background-color: #fff;
  border-radius: 8px;
  box-shadow: 0px 2px 8px 0px rgba(184, 184, 184, 0.5);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transition:
    box-shadow 0.2s ease,
    transform 0.2s ease;
}

/*.thumbnail-card-wrapper-accreditations:hover {
   box-shadow: 0px 6px 16px 0px rgba(184, 184, 184, 0.7); 
  transform: translateY(-2px);
}*/
.accreditation-image-container {
  padding: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 90px;
  margin-left: auto;
  margin-right: auto;
}
.img-accreditation {
  max-width: 100%;
  max-height: 70px;
  width: auto;
  height: auto;
  object-fit: contain;

}
.card-content-wrapper-accreditations {
  padding: 4px 16px 20px;
  text-align: center;
  margin-top: 0 auto;
}


/* =========================================================
     TABLET (≤ 768px): 2 columns
  ========================================================= */
@media (max-width: 768px) {
  .thumbnail-card-main-wrapper-accreditations {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
  .accreditation-image-container {
    padding: 18px;
    min-height: 76px;
  }
  .img-accreditation {
    max-height: 58px;
  }
}

/* =========================================================
     MOBILE (≤ 480px): 1 column
  ========================================================= */
@media (max-width: 480px) {
  /* body {
    padding: 28px 6%;
  } */
  .thumbnail-card-main-wrapper-accreditations {
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .accreditation-image-container {
    padding: 22px;
    min-height: 80px;
  }
  .img-accreditation {
    max-height: 64px;
    
  }
  .card-content-wrapper-accreditations h4 {
    font-size: 15.5px;
  }
}
/**********ACCREDITATIONS and RECOGNITIONS Container Controllers***************/



/**********SUSTAINABILITY Container Controllers***************/
.card-content-wrapper-sustainability-events {
    padding: 15px;
}
.sus-events-title {
    margin: 0px;
}
/**********SUSTAINABILITY Container Controllers***************/




/**********Container Height width***************/

.box-xs{

    width: 18%;

    min-height: 100px;

}

.box-sm{

    width: 24%;

    min-height: 250px;

}

.box-md{

    width: 32%;

    min-height: 250px;

}

.box-xl{

    width: 49.5%;

    min-height: 250px;

}

.flex-box-s{

    width: 24%;

}

.flex-box-sm{

    width: 30%;

}

.flex-box-md{

    width: 50%;

}

.flex-box-md-sm{

    width: 45%;

}

.flex-box-xl{

    width: 70%;

}

.faculty-flex-sm{
    width: 40%;
}.faculty-flex-lg{
    width: 60%;
}


/**********Container Height width***************/











/**********Container Items Alignment***************/

.container-flex-align-center{

    display: flex;

    align-items: center;

    justify-content: center;

}



/**********Container Items Alignment***************/













/**********Container Padding***************/

.box-padding-s{

    padding: 10px;

}

.box-padding-m{

    padding: 20px;

}



.box-padding-top-only-l{

    padding-top: 30px;

}

.box-padding-left-only-m{

    padding-left: 20px;

}

.box-padding-right-only-m{

    padding-right: 20px;

}

.box-padding-left-only-l{

    padding-left: 30px;

}

.box-padding-left-only-xl{

    padding-left: 50px;

}.box-padding-right-only-xl{

    padding-right: 50px;

}



.standard-padding-content{

    padding-left: 70px;

    padding-right: 70px;

}

.almamater-song{

    padding-top: 70px;

    padding-bottom: 70px;

}

/**********Container Padding***************/











/**********Container BG-Color***************/

.bg-white{

    background-color: #ffffff !important;

}

.bg-grey{

     background-color:#f7f7f7 !important;

}

.bg-red{

     background-color:#DA291C !important;

}

.bg-yellow{

     background-color:#FFB81C !important;

}.bg-dark-grey{

     background-color:#e6e6e6 !important;

}.bg-custom-red{

     background-color:#aaaaaa !important;

}

/**********Container BG-Color***************/







.container-shadow{

    box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.33);

}















/**********Announcements***************/



.container {

  display: grid;

  grid-template-columns: 1.1fr 1fr;

  width: 85%;

  margin: 40px auto;



}



/* EVENTS (LEFT) */

.events {

  padding: 20px;

  border-right: 1px solid #ddd;

  display: flex;

  flex-direction: column;

  gap: 16px;

}

.event {

  display: grid;

  grid-template-columns: 80px 1fr;

  height: 80px;

}



.date-red {

  background: #DA291C;

  color: #fff;

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;



}



.announcements {

  padding: 20px 30px;

}



.announcement {

  margin-bottom: 20px;

}





/* RESPONSIVE */

@media (max-width: 768px) {

  .container {

    grid-template-columns: 1fr;

  }



  .events {

    border-right: none;

    border-bottom: 1px solid #ddd;

  }

}

/**********Announcements***************/













/************SUBPAGE: TABLE***********/

.table-container{

    padding: 7% 7%;

    width: 1050px;

    margin: 0 auto;

    overflow-x: auto;

    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);

    border-radius: 8px;
	
	white-space: nowrap;
	
	height: auto !important;

}

.table{

    width: 100%;

    border-collapse: collapse;

    text-align: left;

    border-collapse: separate; 

    border-spacing: 0 10px;

}

tr{

    height: 100px;

    width: 80% !important;

    background-color: #F1F1F1;

}

.table td {

    padding: 10px;

}



/************SUBPAGE: TABLE***********/







/************SUBPAGE: DIRECTORY TABLE***********/

.ck-table-resized{

    border-spacing: 0px !important;
	width: 100%;
    overflow-x: auto;
	white-space: nowrap;
	height: auto !important;

}

.ck-table-resized table{

    width: 100% !important;
	border-collapse: collapse;
    white-space: nowrap;

}

.ck-table-resized tr{

    height: 34px !important;

    background-color: #FFF !important;

}

.ck-table-resized td{

    border: 1px solid #e1e1e1;

    padding: 0px 5px;

}

/************SUBPAGE: DIRECTORY TABLE***********/













/************news container***********/

.news-card {

    display: grid;

    grid-template-columns: 320px 1fr;

    gap: 32px;

    padding: 32px 0;

    align-items: center;



}



/***********news container***********/


















/************Services Card***********/
.services-box-card {
    position: relative;
    width: 95%!important;
    min-height: 150px;
    margin-bottom: 20px;
    border-radius: 8px;
    border-top:#606060 solid 5px;
    background-color:#ffffff !important;
    overflow: hidden;
    text-align: left;
    align-items: center;
}.services-box-card-content{ 

   padding-top:10px;
   padding-left:30px !important;
   padding-right:30px !important;

}
/************Services Card***********/


/************Downloadable Card***********/
.downloadable-box-card {
    position: relative;
    width: 95%!important;
    min-height: 150px;
    margin-bottom: 20px;
    border-radius: 8px;
    border-top:#DA291C solid 5px;
    background-color:#ffffff !important;
    overflow: hidden;
    text-align: left;
    align-items: center;
}.downloadable-box-card-content{ 

   padding-top:10px;
   padding-left:30px !important;
   padding-right:30px !important;

}
/************Downloadable Card***********/















/************Student Organizations Card***********/

.student-organization-card {

    position: relative;

    width: 300px!important;

    min-height: 300px;

    border-radius: 10px;

    background-color:#F7F7F7 !important;

    overflow: hidden;

    text-align: left;

    align-items: center;

}

.student-organization-card-content{

    padding:20px !important;

}

/************Student Organizations Card***********/









/************Career Opportunities Card***********/

.career-opportunities-objective-card {
    position: relative;
    width: 100%!important;
    min-height: 120px;
    border-radius: 10px;
    background-color:#F7F7F7 !important;
    overflow: hidden;
    border-left:#FFB81C solid 5px;
    margin-bottom: 15px;
}

.career-opportunities-objective-card-content{
    padding:10px 20px 10px 20px !important;
    text-align: left;
    align-items: center;
}

/************Career Opportunities Card***********/












/************Main Research Card***********/
.main-research-card {
    position: relative;
    width: 95%!important;
    min-height: 200px;
    margin-bottom: 20px;
    border-radius: 8px;
    background-color:#ffffff !important;
    overflow: hidden;
    border-top:#DA291C solid 5px;
    text-align: left;
    align-items: center;
}
.main-research-card-content{
   padding-top:10px;
   padding-left:30px !important;
   padding-right:30px !important;
}
/************Main Research Card***********/




/************About History Card***********/
.about-history-card {
    position: relative;
    width: 100%!important;
    min-height: 150px;
    margin-bottom: 20px;
    background-color:transparent !important;
    overflow: hidden;
    text-align: left;
    align-items: center;
    padding: 10px;
}
.about-history-card-content{
   padding:0px;
}
/************About History Card***********/