@media (min-width: 1025px)
{
      .containerblock
      {
          background-color: FireBrick;
          padding: 30px 30px;
      }
	  .container
	  {
	      width: 1200px;
	      max-width: 95%;
	      margin: 0 auto;
		  display: flex;
		  align-items: center;
		  justify-content: center;
		  gap: 50px;
	  }
	  .fa-facilities
	  {
	      width: 650px;
	  }
	  .facilitiesgallery
	  {
		  display: grid;
		  grid-template-columns: repeat(3, 1fr);
		  justify-items: center;
		  width: 100%;
		  gap: 20px;
	  }
	  .fa-outerborder
	  {
	      /* In parent, display, justify-content, align-items keep the child, which is fa-innerborder, at the center, both horizontally and vertically */
	      display: flex;
	      justify-content: center;
	      align-items: center;
	      width: 180px;
	      height: 180px;
		  background-image: linear-gradient(to bottom, orange, FireBrick);
	  }
	  .fa-innerborder
	  {
	      display: flex;
	      justify-content: center;
	      align-items: center;
	      width: 140px;
	      height: 140px;
	      background-color: white;
	  }
	  figure
	  {
	      padding-bottom: 20px;
	      margin: 0;
	  }
/*	  .applicationform
	  {
	      width: 450px;
	  }*/
      /* =========================================
          ADMISSION ENQUIRY FORM
          Desktop: 1025px and above
      ========================================= */

      .applicationform {
          width: 100%;
          padding: 30px 20px;
          box-sizing: border-box;
      }

      .formcontainer {
          width: 600px;
          max-width: 100%;
          margin: 0 auto;
          background: #ffffff;
          border: 1px solid #d8d8d8;
          border-radius: 8px;
          box-shadow: 0 3px 10px rgba(0, 0, 0, 0.10);
          overflow: hidden;
      }

      /* ---------- Form Header ---------- */

      .formheader {
          width: 100%;
          padding: 15px 20px;
          box-sizing: border-box;
          text-align: center;
          background: #f3f6f9;
          border-bottom: 1px solid #d8d8d8;
      }

      .formheader h3 {
          margin: 0;
          font-size: 20px;
          font-weight: 600;
      }

     .formheader h3 i {
         margin-right: 7px;
      }

      /* ---------- Form Body ---------- */
 
      .formbody {
          padding: 25px 30px 30px;
          box-sizing: border-box;
      }

      /* ---------- Individual Fields ---------- */

      .formfield {
          width: 100%;
          margin-bottom: 17px;
      }

      .formfield label {
          display: block;
          margin-bottom: 6px;
          font-size: 14px;
          font-weight: 600;
      }

      .formfield label i {
          width: 20px;
         margin-right: 5px;
         text-align: center;
      }

      .inputcolor {
          color: red;
      }

     .formfield input {
          display: block;
          width: 100%;
          height: 40px;
          padding: 7px 10px;
          box-sizing: border-box;

          font-size: 14px;

          border: 1px solid #c8c8c8;
          border-radius: 4px;

          outline: none;
      }

      .formfield input:focus {
          border-color: #777;
      }

      /* ---------- Checkbox ---------- */

      .formcheck {
          display: flex;
          align-items: flex-start;
          gap: 8px;

          margin-top: 5px;
          margin-bottom: 22px;
      }

      .formcheck input {
          width: 16px;
          height: 16px;
          margin: 2px 0 0;
          flex-shrink: 0;
      }

      .formcheck label {
          font-size: 13px;
          line-height: 1.45;
          cursor: pointer;
      }

      /* ---------- Buttons ---------- */

      .formbuttons {
          display: flex;
          justify-content: center;
          gap: 12px;
      }

      .formbuttons button {
          min-width: 110px;
          padding: 9px 18px;

          font-size: 14px;
          font-weight: 600;

          border: 1px solid #aaa;
          border-radius: 4px;

          cursor: pointer;
      }

      .formbuttons button i {
           margin-right: 5px;
      }
}

@media (min-width: 768px) and (max-width: 1024px)
{
	  .containerblock
	  {
		  background-color: FireBrick;
		  padding: 20px 20px;
	  }
	  .container
	  {
		  width: 95%;
		  margin: 0 auto;
		  display: flex;
		  align-items: center;
		  justify-content: center;
		  gap: 20px;
	  }
	  .fa-facilities
	  {
		  width: 62%;
	  }
	  .facilitiesgallery
	  {
		  width: 100%;
		  display: grid;
		  grid-template-columns: repeat(3, 1fr);
		  justify-items: center;
		  gap: 10px;
	  }
	  .applicationform
	  {
		  width: 38%;
	  }
	  .fa-outerborder
	  {
		  /* In parent, display, justify-content, align-items keep the child, which is fa-innerborder, at the center, both horizontally and vertically */
		  display: flex;
		  justify-content: center;
		  align-items: center;
		  width: 115px;
		  height: 115px;
		  background-image: linear-gradient(to bottom, orange, FireBrick);
	  }
	  .fa-innerborder
	  {
		  display: flex;
		  justify-content: center;
		  align-items: center;
		  width: 95px;
		  height: 95px;
		  background-color: white;
		  padding: 5px;
		  box-sizing: border-box;
	  }
	  figure
	  {
		  padding-bottom: 10px;
		  margin: 0;
	  }
     /* =========================================
           ADMISSION ENQUIRY FORM
           Tablet version
       ========================================= */

    .applicationform
    {
        width: 38%;
        box-sizing: border-box;
    }

    .formcontainer
    {
        width: 100%;
        max-width: 100%;

        margin: 0 auto;

        background-color: #ffffff;

        border: 1px solid #d8d8d8;
        border-radius: 8px;

        box-shadow: 0 3px 10px rgba(0, 0, 0, 0.10);

        overflow: hidden;
    }

    /* ---------- Header ---------- */

    .formheader
    {
        width: 100%;

        padding: 12px 10px;

        box-sizing: border-box;

        text-align: center;

        background-color: #f3f6f9;

        border-bottom: 1px solid #d8d8d8;
    }

    .formheader h3
    {
        margin: 0;

        font-size: 17px;
        font-weight: 600;
    }

    .formheader h3 i
    {
        margin-right: 5px;
    }

    /* ---------- Body ---------- */

    .formbody
    {
        width: 100%;

        padding: 18px 18px 22px;

        box-sizing: border-box;
    }

    /* ---------- Fields ---------- */

    .formfield
    {
        width: 100%;

        margin-bottom: 13px;
    }

    .formfield label
    {
        display: block;

        margin-bottom: 5px;

        font-size: 13px;
        font-weight: 600;
    }

    .formfield label i
    {
        width: 18px;

        margin-right: 4px;

        text-align: center;
    }

    .inputcolor
    {
        color: red;
    }

    .formfield input
    {
        display: block;

        width: 100%;
        height: 36px;

        padding: 6px 8px;

        box-sizing: border-box;

        font-size: 13px;

        border: 1px solid #c8c8c8;
        border-radius: 4px;

        outline: none;
    }

    .formfield input:focus
    {
        border-color: #777;
    }

    /* ---------- Checkbox ---------- */

    .formcheck
    {
        display: flex;
        align-items: flex-start;

        gap: 7px;

        margin-top: 3px;
        margin-bottom: 17px;
    }

    .formcheck input
    {
        width: 15px;
        height: 15px;

        margin: 2px 0 0;

        flex-shrink: 0;
    }

    .formcheck label
    {
        font-size: 12px;
        line-height: 1.4;

        cursor: pointer;
    }

    /* ---------- Buttons ---------- */

    .formbuttons
    {
        display: flex;
        justify-content: center;

        gap: 8px;
    }

    .formbuttons button
    {
        min-width: 85px;

        padding: 7px 10px;

        font-size: 12px;
        font-weight: 600;

        border: 1px solid #aaa;
        border-radius: 4px;

        cursor: pointer;
    }

    .formbuttons button i
    {
        margin-right: 4px;
    }
}

@media (max-width: 767px)
{
      .containerblock
      {
		  background-color: FireBrick;
		  padding: 20px 20px;
      }
      .container
      {
		  width: 95%;
          margin: 0 auto;

          display: flex;
          flex-direction: column;
          align-items: center;
          justify-content: center;
          gap: 30px;
      }
      .fa-facilities
      {
		  width: 100%;
          text-align: center;
      }
      .facilitiesgallery
      {
		  width: 100%;

          display: grid;
          grid-template-columns: repeat(2, 1fr);
          gap: 10px;

          justify-items: center;
      }
      .fa-outerborder
      {
		  display: flex;
          justify-content: center;
          align-items: center;

          width: 130px;
          height: 130px;

          background-image: linear-gradient(to bottom, orange, FireBrick);
      }

      .fa-innerborder
      {
		  display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;

          width: 105px;
          height: 105px;

          background-color: white;

          padding: 5px;
          box-sizing: border-box;
      }
      figure
      {
		  padding-bottom: 10px;
          margin: 0;
      }
/* =========================================
   ADMISSION ENQUIRY FORM
   Mobile: below 768px
   ========================================= */

   .applicationform
   {
       width: 100%;
       box-sizing: border-box;
   }

   .formcontainer
   {
       width: 100%;
       max-width: 600px;

       margin: 0 auto;

       background-color: #ffffff;

       border: 1px solid #d8d8d8;
       border-radius: 8px;

       box-shadow: 0 3px 10px rgba(0, 0, 0, 0.10);

       overflow: hidden;
    }

/* ---------- Header ---------- */

     .formheader
     {
         width: 100%;

         padding: 13px 10px;

         box-sizing: border-box;

         text-align: center;

         background-color: #f3f6f9;

         border-bottom: 1px solid #d8d8d8;
     }

     .formheader h3
     {
         margin: 0;

         font-size: 18px;
         font-weight: 600;
     }

     .formheader h3 i
     {
         margin-right: 5px;
     }

/* ---------- Form Body ---------- */

     .formbody
     {
         width: 100%;

         padding: 20px 20px 25px;

         box-sizing: border-box;
      }

/* ---------- Individual Fields ---------- */

     .formfield
     {
         width: 100%;

         margin-bottom: 15px;
      }

      .formfield label
      {
          display: block;

          margin-bottom: 5px;

         font-size: 13px;
         font-weight: 600;
      }

     .formfield label i
     {
         width: 18px;

         margin-right: 4px;

         text-align: center;
     }

     .inputcolor
     {
         color: red;
     }

     .formfield input
     {
         display: block;

         width: 100%;
         height: 38px;

         padding: 7px 9px;

         box-sizing: border-box;

         font-size: 14px;

         border: 1px solid #c8c8c8;
         border-radius: 4px;

         outline: none;
     }

     .formfield input:focus
     {
         border-color: #777;
     }

/* ---------- Checkbox ---------- */

     .formcheck
     {
         display: flex;
         align-items: flex-start;

         gap: 7px;

         margin-top: 3px;
         margin-bottom: 20px;
     }

     .formcheck input
     {
         width: 15px;
         height: 15px;

         margin: 2px 0 0;

         flex-shrink: 0;
      }

      .formcheck label
      {
          font-size: 12px;
          line-height: 1.45;

          cursor: pointer;
     }

/* ---------- Buttons ---------- */

      .formbuttons
      {
          display: flex;
          justify-content: center;

          gap: 10px;
      }

      .formbuttons button
      {
          min-width: 100px;

          padding: 8px 14px;

          font-size: 13px;
          font-weight: 600;

          border: 1px solid #aaa;
          border-radius: 4px;

          cursor: pointer;
     }

     .formbuttons button i
     {
         margin-right: 5px;
     }
}