/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/

body {
  margin: 0;
  /* 1 */
  line-height: inherit;
  /* 2 */
}

/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/

hr {
  height: 0;
  /* 1 */
  color: inherit;
  /* 2 */
  border-top-width: 1px;
  /* 3 */
}

/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/

abbr:where([title]) {
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}

/*
Remove the default font size and weight for headings.
*/

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
}

/*
Reset links to optimize for opt-in styling instead of opt-out.
*/

a {
  color: inherit;
  text-decoration: inherit;
}

/*
Add the correct font weight in Edge and Safari.
*/

b,
strong {
  font-weight: bolder;
}

/*
1. Use the user's configured `mono` font-family by default.
2. Use the user's configured `mono` font-feature-settings by default.
3. Use the user's configured `mono` font-variation-settings by default.
4. Correct the odd `em` font sizing in all browsers.
*/

code,
kbd,
samp,
pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  /* 1 */
  font-feature-settings: normal;
  /* 2 */
  font-variation-settings: normal;
  /* 3 */
  font-size: 1em;
  /* 4 */
}

/*
Add the correct font size in all browsers.
*/

small {
  font-size: 80%;
}

/*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/

table {
  text-indent: 0;
  /* 1 */
  border-color: inherit;
  /* 2 */
  border-collapse: collapse;
  /* 3 */
}

/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/

button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  /* 1 */
  font-feature-settings: inherit;
  /* 1 */
  font-variation-settings: inherit;
  /* 1 */
  font-size: 100%;
  /* 1 */
  font-weight: inherit;
  /* 1 */
  line-height: inherit;
  /* 1 */
  letter-spacing: inherit;
  /* 1 */
  color: inherit;
  /* 1 */
  margin: 0;
  /* 2 */
  padding: 0;
  /* 3 */
}

/*
Remove the inheritance of text transform in Edge and Firefox.
*/

button,
select {
  text-transform: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/

button,
input:where([type='button']),
input:where([type='reset']),
input:where([type='submit']) {
  /* -webkit-appearance: button; */
  /* 1 */
  background-color: transparent;
  /* 2 */
  background-image: none;
  /* 2 */
}

/*
Use the modern Firefox focus style for all focusable elements.
*/

:-moz-focusring {
  outline: auto;
}

/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/

:-moz-ui-invalid {
  box-shadow: none;
}

/*
Add the correct vertical alignment in Chrome and Firefox.
*/

progress {
  vertical-align: baseline;
}

/*
Correct the cursor style of increment and decrement buttons in Safari.
*/

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
}

/*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/

[type='search'] {
  /* -webkit-appearance: textfield; */
  /* 1 */
  outline-offset: -2px;
  /* 2 */
}

/*
Remove the inner padding in Chrome and Safari on macOS.
*/

::-webkit-search-decoration {
  -webkit-appearance: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/

::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */
}

/*
Add the correct display in Chrome and Safari.
*/

summary {
  display: list-item;
}

/*
Removes the default spacing and border for appropriate elements.
*/

blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

ol,
ul,
menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

/*
Reset default styling for dialogs.
*/

dialog {
  padding: 0;
}

/*
Prevent resizing textareas horizontally by default.
*/

textarea {
  resize: vertical;
}

/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/

input::-moz-placeholder, textarea::-moz-placeholder {
  opacity: 1;
  /* 1 */
  color: #9ca3af;
  /* 2 */
}

input::placeholder,
textarea::placeholder {
  opacity: 1;
  /* 1 */
  color: #9ca3af;
  /* 2 */
}

/*
Set the default cursor for buttons.
*/

button,
[role="button"] {
  cursor: pointer;
}

/*
Make sure disabled buttons don't get the pointer cursor.
*/

:disabled {
  cursor: default;
}

/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
   This can trigger a poorly considered lint error in some tools but is included by design.
*/

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block;
  /* 1 */
  /* vertical-align: middle; */
  /* 2 */
}

/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/

img,
video {
  max-width: 100%;
  height: auto;
}

/* Make elements with the HTML hidden attribute stay hidden by default */

[hidden]:where(:not([hidden="until-found"])) {
  display: none;
}

.absolute {
  position: absolute;
}

.relative {
  position: relative;
}

.left-\[350px\] {
  left: 350px;
}

.ml-14 {
  margin-left: 3.5rem;
}

.ml-16 {
  margin-left: 4rem;
}

.mt-\[20px\] {
  margin-top: 20px;
}

.flex {
  display: flex;
}

.h-\[100px\] {
  height: 100px;
}

.h-auto {
  height: auto;
}

.h-full {
  height: 100%;
}

.h-\[30px\] {
  height: 30px;
}

.w-\[100px\] {
  width: 100px;
}

.w-\[800px\] {
  width: 800px;
}

.w-full {
  width: 100%;
}

.-translate-x-1\/2 {
  --tw-translate-x: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.transform {
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.flex-row {
  flex-direction: row;
}

.flex-wrap {
  flex-wrap: wrap;
}

.border-2 {
  border-width: 2px;
}

.bg-custom-pink {
  --tw-bg-opacity: 1;
  background-color: rgb(253 231 232 / var(--tw-bg-opacity, 1));
}

.text-sm {
  font-size: 0.875rem;
  line-height: 1.25rem;
}

.text-lg {
  font-size: 1.125rem;
  line-height: 1.75rem;
}

.text-base {
  font-size: 1rem;
  line-height: 1.5rem;
}

.fontRegar0 {
  font-family: Arial, sans-serif;
  font-size: 18px;
  font-weight: 700;
  line-height: 24px;
  color: rgb(52,58,64);
}

@media (min-width: 640px) {
  .sm\:left-1\/2 {
    left: 50%;
  }

  .sm\:ml-8 {
    margin-left: 2rem;
  }

  .sm\:ml-4 {
    margin-left: 1rem;
  }

  .sm\:w-\[90\%\] {
    width: 90%;
  }

  .sm\:text-base {
    font-size: 1rem;
    line-height: 1.5rem;
  }

  .sm\:text-xl {
    font-size: 1.25rem;
    line-height: 1.75rem;
  }

  .sm\:text-lg {
    font-size: 1.125rem;
    line-height: 1.75rem;
  }
}

@media (min-width: 768px) {
  .md\:ml-16 {
    margin-left: 4rem;
  }
}




/* $$$$$$$$$$$$$$$$$$$$$$$$$$$$$ */

html, body {
  overflow-x: hidden;
}


 html, body {
    overflow-x: hidden;
  }


.imageContactus{

  width:30px;
  height:30px;
  background-color: transparent;
}

.logo{

  margin-left:50px;
  margin-right:50px;
  margin-top:20px;
}

@media(max-width:700px){
    
    .logo{
        
        margin-left:5px;
    }
}

.collegeName{

   width:60%;
   height:auto;
   
   margin-left:200px;
   margin-top:30px;
   margin-bottom: 30px;
  
}

@media(max-width:700px){


  .collegeName{

    margin-left: 40px;

  }
  
  
  
}

.collegeNamechild_1{

  font-family: Arial, sans-serif; /* Font name */
  font-size: 18px;               /* Font size */
  font-weight: 700;              /* Font weight */
  line-height: 24px;             /* Line height */
  color: rgb(52, 58, 64);        /* Font color */
  margin-left:20%;
 
}

.collegeNamechild_2{

  font-family: "Playfair Display", serif; /* Font name */
  font-size: 28px;                        /* Font size */
  font-weight: 700;                       /* Font weight */
  line-height: 30px;                      /* Line height */
  color: rgb(52, 58, 64); 
}

.collegeNamechild_3{

  font-family: Arial, sans-serif; /* Font name */
  font-size: 17px;               /* Font size */
  font-weight: 700;              /* Font weight */
  line-height: 24px;             /* Line height */
  color: rgb(119, 119, 119); 
  margin-left:100px;
  
}

@media(max-width:700px){
   
   .collegeNamechild_3{
       
       margin-left:0;
   }
   
    
}

.slideshow-container{
  width:90%;
  height:400px;
  margin-top:10px; 
  margin-left:100px;
  margin-right:150px;
  overflow: hidden;
  
}







@media(min-width:700px){

  .slideshow-container{

    box-shadow: 10px 10px 10px 10px #a6a5a5;

  }
  

}

@media(max-width:700px){
    
.slideshow-container{

     margin-left:20px;
  }
    
}


.slide {
  display: none; /* Hide all slides by default */
}

.slide img {
  width: 100%; /* Ensure images fit the slide container */
  height: auto; /* Maintain aspect ratio */
}

.fade {
  animation: fadeEffect 1.5s ease-in-out;
}

@keyframes fadeEffect {
  from {
    opacity: 0.4;
  }
  to {
    opacity: 1;
  }
}

.imag1{

  position: absolute;
  width: 100%; /* Make the image take the full width of the container */
  height:100%; /* Make the image take the full height of the container */
  object-fit:contain;  
  
}


.div2{
 
  width:1200px;
   height:140px;
   margin-top:100px; 
   margin-left:100px;
   margin-right:150px;
   background-color: #ffdead;

}

.div2 p{

 font-family: "Playfair Display", serif;
 font-size: 18px;
 font-weight: 700;
 line-height: 21.6px;
 color: rgb(23, 162, 184);
 padding-top:50px;
 margin-left:450px;
}

.div3{

  width:full;
  height:auto;
  background-color:  #f1f1f1;
  
}

.div4{

  width:90%;
  height:auto;
  margin-left:100px;
  margin-right:150px;
  padding-top:20px;
  
  

}

.divA{

  width: 280px;
  height:400px;
  margin-left:20px;
  margin-top:50px; 
 
  
 
}

.childA{

  padding-top:10px; 
  padding-bottom: 5px;
  background: rgb(173,32,69);
  background: radial-gradient(circle, rgba(173,32,69,1) 0%, rgba(174,62,109,1) 3%, rgba(175,120,184,1) 64%);
  }
  
  @media(max-width:700px){
      
      .divA{
          
          margin-left:100px;
          margin-bottom:30px;
      }
  }
  
  .headerFirst{
      
      width:100%; 
      height:auto;
  }

  .childAspan1{

    font-family: "Playfair Display", serif;
    font-size: 24px;
    font-weight: 700;
    line-height: 28.8px;
    color: rgb(248, 249, 250); /* Font color */
    margin-left:60px;
  }
  
  .childA1 p{

    font-family: Arial, sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 24px;
  color: rgb(0, 0, 0); /* Font color  */
  }

.nav-div{

   background-color: #c92438;
   position: relative;
   display: flex;
  
}

.nav-links{

  margin-left:200px;
   display: flex;
}


.nav-link{

  margin-left:6px;
  margin-right:10px;
  font-family: 'Roboto', sans-serif;
 font-size: 13px;
 font-weight: 600;
 line-height: 60px;
 color: white;
}



.hamburger{

   display: none;
   cursor: pointer;
 
}

.line{

  display: block;
 justify-content: right;
  width:30px;
 margin-top:5px;
 margin-bottom: 5px;
 border:2px solid white;
  font-weight: 600;
  margin-left:50px;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;

}

@media(max-width:1200px){

  .hamburger{

    display: block;
    }

.nav-links{

    width:400px;
    position: absolute;
    text-align:center;
    left:-180%;
    top:35px;
    flex-direction: column;
    background-color: rgba(139, 0, 0, 0.85);
    z-index:100;
    transition: left 0.5s ease-in-out; /* Smooth transition */
    
}

.nav-links > * {
  margin: 0; /* Remove top and bottom margins of child elements */
  padding: 0; /* Remove padding of child elements */
}


.nav-links > * {
  line-height: 2;
 
}

.nav-link{

   
   margin-top:5px;

}





.nav-links.active{

   left:-200px;

}



.nav-links.reverse {
    left: -150%; /* Slide out to the right */
}



}



@media (max-width: 350px) {
  .hamburger {
    left: 10px; /* Adjust hamburger position */
    top: 15px; /* Adjust vertically */
  }

  .nav-links {
    width: 180px; /* Optional: Reduce width for smaller screens */
    left: -100%; /* Ensure it stays off-screen */
    
  }

  /* If you need to adjust the active menu behavior, you can use */
  .nav-links.active {
    left: 0; /* Ensure it comes fully into view */
  }
  
} 
  
  @media (max-width: 320px) {
  .hamburger {
    left: 10px; /* Adjust hamburger position */
    top: 15px; /* Adjust vertically */
  }

  .nav-links {
    width: 180px; /* Optional: Reduce width for smaller screens */
    left: -200%; /* Ensure it stays off-screen */
  }

  /* If you need to adjust the active menu behavior, you can use */
  .nav-links.active {
    left: 0; /* Ensure it comes fully into view */
  }
  
  
  



}                                   


@media(max-width:700px){

.collegeNamechild_1{
    
    font-size: 8px;
    margin-left:5px;
    
    
}

.collegeNamechild_2{

     font-size:13px;
     margin-bottom:0;
  }
  
 .collegeNamechild_3{
      
        font-size: 8px;  
  }
  
  

  
}








.nav-link:hover{

 color:rgb(247, 51, 51);  
}




.div1{

  width:full;
  height:auto;
  background-color:  #f1f1f1;
  padding-top:10px;
  padding-bottom: 50px;
  overflow: hidden;
}

.title{

  width:90%;
  height:auto;
  margin-left:100px;
  margin-right:150px;
  padding-bottom:40px;
  background-color: #ffdead;
  
}

@media (max-width: 700px) {

  .title{
    margin-left: 20px; /* Remove left margin for small screens */
  }
  
  .title p{
      
       margin-left:100px;
  }
}




.title p{

  width:45%;
  height:auto;
  font-family: "Playfair Display", serif;
  font-size: 18px;
  font-weight: 700;
  line-height: 21.6px;
  color: rgb(23, 162, 184);
  padding-top:50px;
  padding-bottom: 50px;
  margin-left:450px;
  
}

.title span{

    width:30%;
    height:auto;
    color: #FFC107;
   
}

.forbg-c{

  width:100%;
  height:auto;
  background-color:  #f1f1f1;
  
}
  
@media (max-width: 600px) {
  .title p{
    margin-left: 50px; /* Remove left margin for small screens */
  }
}



.div3{
width:full;
height:auto;
background-color:  #f1f1f1;
  
}

.div4{

  width:90%px;
  height:auto;
  margin-left:100px;
  margin-right:150px;

}

.divA1{

  width: 280px;
  height:200px;
  margin-left:50px;
  margin-top:50px;  
   
}

@media(max-width:700px){
    
    .divA1{
        
        margin-left:100px;
    }
}

.childA{

  padding-top:10px; 
  padding-bottom: 5px;
  background: rgb(173,32,69);
  background: radial-gradient(circle, rgba(173,32,69,1) 0%, rgba(174,62,109,1) 3%, rgba(175,120,184,1) 64%);
  
  }

  .childAspan1{

    font-family: "Playfair Display", serif;
    font-size: 24px;
    font-weight: 700;
    line-height: 28.8px;
    color: rgb(248, 249, 250); /* Font color */
    margin-left:60px;
  }

  .childA1 p{

    font-family: Arial, sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 24px;
  color: rgb(0, 0, 0); /* Font color black */
     margin-left:110px;
     margin-top:40px;
  }

  .childA2 p{

    font-family: Arial, sans-serif;
    font-size: 15px;
    font-weight: 700;
    line-height: 24px;
    color: rgb(0, 0, 0); /* Font color black */
      margin-top:30px;
      margin-left:30px;
      
  }

  .link1{

    font-family: Arial, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 24px;
    color: rgb(0, 86, 179); 
    margin-left:30px;
    margin-top:10px;
  }

  .divB{

    width:40%;
    height:auto;
    margin-left:50px;
    margin-top:50px; 
   
   
      
  }
  
  
  
  @media(max-width:700px){
      
      .div4{
          
        margin-left:10px;
          
      }
      
      .wrapper{
          
          width:250%;
          margin-left:none;
          margin-right:none;
          
      }
      
      .divA1{
          
          margin-bottom:50px;
          margin-left:none;
          
          
      }
      
      
      .dot{
          
          margin-top:20px;
          
      }
      
      .footer1{
          
         
          padding-top:80px;
         
      }
      
      .divB{
          
          margin-left:10px;
      }
  }
  
  

.wrapper img{

  width: 150px;
  height: 200px;
  float: left;
 margin: 15px 2rem 20px 0px; 
  
}

.Heading_1{

  font-family: 'Playfair Display', serif;
  font-size: 30px;
  font-weight: 800;
  line-height: 36px;
  color: rgb(7, 8, 110);
}

.wrapper p{
  
  text-align: justify;
  height:auto;
  text-indent: 2em;
margin-top:20px;  
  margin-right:10px;
  margin-left:10px;
  font-family: 'Roboto', sans-serif;
font-size: 14px;
font-weight: 400;
line-height: 24px;
color: rgb(119, 119, 119);

}

.wrapperChild p{

 text-align: right;
 font-family: 'Roboto', sans-serif;
font-size: 14px;
font-weight: 700;
line-height: 24px;
color: rgb(119, 119, 119);
} 

.divC{

  width: 280px;
  height:400px;
  margin-left:50px;
 margin-top:50px;  
 background-color: rgb(249, 247, 247);
 
 
}

@media(max-width:700px){
    
    .divC{
        
        margin-left:100px;
    }
}

.childB{

  padding-top:10px; 
  padding-bottom: 5px;
  background: rgb(173,32,69);
  background: radial-gradient(circle, rgba(173,32,69,1) 0%, rgba(174,62,109,1) 3%, rgba(175,120,184,1) 64%);
  }

  .childAspan2{
  
    font-family: "Playfair Display", serif;
    font-size: 24px;
    font-weight: 700;
    line-height: 28.8px;
    color: rgb(248, 249, 250); /* Font color */
    margin-left:60px;
    
  }
  
  

  .divchild4{
  
  width:full;
  height:auto;
  background-color:  #f1f1f1;
  margin-top: 0;

}

.childAspan4_A{  
  font-family: "Playfair Display", serif;
  font-size: 24px;
  font-weight: 700;
  line-height: 28.8px;
  color: rgb(248, 249, 250); /* Font color */
  margin-left:60px;
}
.childAspan4-1, .childAspan4-2, .childAspan4-3{

  width:full;
  height:60px;
 padding-top:10px; 
 padding-bottom: 6px;  
  text-align: center;
  color:blue;
  background-color: white;
  margin-top:0;
}

hr {
  border-top: 2px solid #c52323; /* Black solid line */
  margin: 20px 0;
}


.footer{
position: relative;
  width:100%; 
  height:150px;
  margin-top:50px;
  
}

.footer img{

  width:100%; 
  height:150px;
  object-fit: cover;
     
}

.overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.6); ; /* Transparent black overlay */
  z-index: 1; /* Ensure the overlay is on top of the image */
}

.footer p {
position: absolute;
top: 20px; /* Adjust this to set the margin from the top */
left: 50%;
transform: translateX(-50%); /* Center the text horizontally */
color: white;
font-family: Arial, sans-serif;
font-size: 14px;
z-index: 2; /* Ensure the text is above the overlay */
}

.footer span{

position: absolute;
top: 40px; /* Adjust this to set the margin from the top */
left: 50%;
transform: translateX(-50%); /* Center the text horizontally */
color: white;
font-family: Arial, sans-serif;
font-size: 14px;
z-index: 2; /* Ensure the text is above the overlay */
}

.footer1 {
font-size: 14px;
position: absolute;
bottom: 10px; /* Align it at the bottom of the footer */
left: 10%; /* Place it 20px from the left edge */
display: flex;
align-items: center; /* Vertically center the items */
color: white;
font-family: Arial, sans-serif;
font-size: 14px;
z-index: 2; /* Ensure text is above overlay */
width: calc(100% - 40px); /* Ensure the container takes up full width minus padding */
}





.footer1 span {
color: white;
margin-right: 10px; /* Add some space between "Designed by" and the link */
flex-grow: 1; /* Allow the span to fill up the space */
text-align: center; /* Center the dots */
}

.footer1 a {
color: #0066cc; /* ICEICO link in blue */
text-decoration: none;
}

.footer1 a:hover {
text-decoration: underline;
}


.footer2 {

font-size: 14px;
position: absolute; /* Position it relative to .footer */
bottom: 10px; /* Adjust as needed to overlay on the image */
right: 10%;
transform: translateX(-50%); /* Center horizontally */
display: flex; /* Align image and text in one line */
align-items: center; /* Vertically align the text and image */
gap: 5px; /* Space between the text and image */ /* Optional background for contrast */
color: #fff; /* Text color */
padding: 10px;
border-radius: 5px; /* Optional for styling */
z-index: 10; /* Ensure it appears above the image */
}


.dot{

font-size: 14px;
position: absolute; /* Position it relative to .footer */
top:30%; /* Adjust as needed to overlay on the image */
left: 50% ;
transform: translateX(-50%); /* Center horizontally */
display: flex; /* Align image and text in one line */
align-items: center; /* Vertically align the text and image */
gap: 5px; /* Space between the text and image */ /* Optional background for contrast */
color: #fff; /* Text color */
padding: 10px;
border-radius: 5px; /* Optional for styling */
z-index: 10; /* Ensure it appears above the image */
font-weight: bold;
  
}


/* about *.sm\:left-1\/2 */

.div1{

    background-color:  #f1f1f1;
    padding-top:10px;
    overflow: hidden;
}

.imag2{

  position: relative;
  width:90%;
  height:400px;
  margin-left:100px;
  margin-right:150px;
  object-fit:fit; 
 box-shadow: 10px 10px 10px 10px #a6a5a5;
 
}

@media(max-width:700px){
    
   .imag2{
       
       box-shadow: none;
   }
}

@media(max-width:500px){

    .imag2{

      margin-left:10px;
      
    }
}

.overlay1{

  position: absolute;
  width:35%;
  top:85%;
  left:45%;
  right:50%;
  transform: translate(-50%, -50%);
  color:white;
  background-color: rgba(0,0,0,6);
  font-family: "Playfair Display", serif;
 font-size: 48px;
 font-weight: 700;
 line-height: 57.6px;
 background-color: transparent;
 
}


.overlay107{


  position: absolute;
  width:40%;
  top:85%;
  left:60%;
  right:50%;
  transform: translate(-50%, -50%);
  color:white;
  background-color: rgba(0,0,0,6);
  font-family: "Playfair Display", serif;
 font-size: 48px;
 font-weight: 700;
 line-height: 57.6px;
 background-color: transparent;
 
}

@media(max-width:700px){
    
    
    .overlay107{
        
        
        left:30%;
        top:40%;
        
    }
    
     .overlay107{
        
       font-size:30px;
        
    }
    
    
    
}


.overlay106{


  position: absolute;
  width:40%;
  top:85%;
  left:60%;
  right:50%;
  transform: translate(-50%, -50%);
  color:white;
  background-color: rgba(0,0,0,6);
  font-family: "Playfair Display", serif;
 font-size: 48px;
 font-weight: 700;
 line-height: 57.6px;
 background-color: transparent;
 
}


@media(max-width:700px){
    
    
    .overlay106{
        
        
        left:30%;
        top:90%;
        
    }
    
     .overlay106{
        
       font-size:30px;
        
    }
    
    
    
}







.overlay104{


  position: absolute;
  width:40%;
  top:85%;
  left:60%;
  right:50%;
  transform: translate(-50%, -50%);
  color:white;
  background-color: rgba(0,0,0,6);
  font-family: "Playfair Display", serif;
 font-size: 48px;
 font-weight: 700;
 line-height: 57.6px;
 background-color: transparent;
 
}

@media(max-width:700px){
   
   .overlay104{
       
         top:40%;
   } 
   
   .overlay104 h2{
       
        font-size:30px;
   } 
   
     
    
}



.overlay101{


  position: absolute;
  width:40%;
  top:85%;
  left:60%;
  right:50%;
  transform: translate(-50%, -50%);
  color:white;
  background-color: rgba(0,0,0,6);
  font-family: "Playfair Display", serif;
 font-size: 48px;
 font-weight: 700;
 line-height: 57.6px;
 background-color: transparent;
 
 
}

.overlay09{


  position: absolute;
  width:35%;
  top:85%;
  left:60%;
  right:50%;
  transform: translate(-50%, -50%);
  color:white;
  background-color: rgba(0,0,0,6);
  font-family: "Playfair Display", serif;
 font-size: 48px;
 font-weight: 700;
 line-height: 57.6px;
 background-color: transparent;
 
}

@media (max-width:700px){
    
    .overlay09{
        
       top:40%;
      left:40%;
        
        
    }
    
    .overlay09 h2{
        
       font-size:30px;
        
    }
    
   
    
}




.overlay011{
    
  position: absolute;
  width:35%;
  top:85%;
  left:60%;
  right:50%;
  transform: translate(-50%, -50%);
  color:white;
  background-color: rgba(0,0,0,6);
  font-family: "Playfair Display", serif;
 font-size: 48px;
 font-weight: 700;
 line-height: 57.6px;
 background-color: transparent;
 
    
}






@media(max-width:500px){
    
    
    .overlay101{
        
          margin-top:-50%;
    }
    
    
     .overlay101 h2{
         
       
       
         font-size:30px;
         
     }
    
    
}



.overlay02{


  position: absolute;
  width:35%;
  top:80%;
  left:60%;
  right:50%;
  transform: translate(-50%, -50%);
  color:white;
  background-color: rgba(0,0,0,6);
  font-family: "Playfair Display", serif;
 font-size: 48px;
 font-weight: 700;
 line-height: 57.6px;
 background-color: transparent;
}


.overlay105{


  position: absolute;
  width:35%;
  top:80%;
  left:60%;
  right:50%;
  transform: translate(-50%, -50%);
  color:white;
  background-color: rgba(0,0,0,6);
  font-family: "Playfair Display", serif;
 font-size: 48px;
 font-weight: 700;
 line-height: 57.6px;
 background-color: transparent;
}




@media(max-width:700px){
    
    
    .overlay105 {
        
        top:40%;
        
        
    }
    
    
    .overlay105 h2{
        
        font-size:30px;
        
    }
}





.overlay2{

  position: absolute;
  width:360px;
  top:65%;
  left:53%;
  right:50%;
  transform: translate(-50%, -50%);
  color:white;
  background-color: rgba(0,0,0,6);
  font-family: "Playfair Display", serif;
 font-size: 48px;
 font-weight: 700;
 line-height: 57.6px;
 background-color: transparent;
}

.overlay102{
    
    position: absolute;
  width:360px;
  top:65%;
  left:53%;
  right:50%;
  transform: translate(-50%, -50%);
  color:white;
  background-color: rgba(0,0,0,6);
  font-family: "Playfair Display", serif;
 font-size: 48px;
 font-weight: 700;
 line-height: 57.6px;
 background-color: transparent;
    
}

@media(max-width){
    
    .overlay102{
        
        margin-top:30%;
        
    }
    
    .overlay102 h2{
        
        margin-top:30px;
        
    }
}


.overlay3{

  position: absolute;
  width:35%;
  top:85%;
  left:58%;
  right:50%;
  transform: translate(-50%, -50%);
  color:white;
  background-color: rgba(0,0,0,6);
  font-family: "Playfair Display", serif;
 font-size: 48px;
 font-weight: 700;
 line-height: 57.6px;
 background-color: transparent;
}

.overlay103{

  position: absolute;
  width:35%;
  top:85%;
  left:58%;
  right:50%;
  transform: translate(-50%, -50%);
  color:white;
  background-color: rgba(0,0,0,6);
  font-family: "Playfair Display", serif;
 font-size: 48px;
 font-weight: 700;
 line-height: 57.6px;
 background-color: transparent;
}


@media(max-width:700px){
    
    .overlay103{
       
       top:30%; 
       left:40%;
        
    }
    
    .overlay103 h2{
        
        font-size:30px;
        
    }
    
}


.homeToabout{

  font-size:16px;
  color:white;
  padding-left:60px;
  font-family: 'Roboto', sans-serif;
font-size: 14px;
font-weight: 400;


}

.hometoinfra{

  font-size:16px;
  color:white;
  padding-left:60px;
  font-family: 'Roboto', sans-serif;
font-size: 14px;
font-weight: 400;

}

@media(max-width:700px){
    
   .hometoinfra{
       
        padding-left:1px;
   }
}

.hometoinfra1{

  font-size:16px;
  color:white;
  padding-left:28px;
  font-family: 'Roboto', sans-serif;
font-size: 14px;
font-weight: 400;

}

@media(max-width:500px){

  .hometoinfra{

    padding-left:10px;
  }
   
}






@media(max-width:500px){

  .homeToabout{

     padding-left:0;
  }
   
}

.abouttohome{

  font-size:16px;
  color:white;
  font-family: 'Roboto', sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
}

.infratohome{

  font-size:16px;
  color:white;
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  

}
.div2{
 
  width:90%;
   height:auto;
   margin-top:100px; 
   margin-left:100px;
   margin-right:150px;
   background-color: #ffdead;

}

.div2 p{

  width:25%;
  height:auto;
  font-family: "Playfair Display", serif;
  font-size: 18px;
  font-weight: 700;
  line-height: 21.6px;
  color: rgb(23, 162, 184);
  padding-top:50px;
  margin-left:450px;

}

@media(max-width:500px){

     .div2{
         
         margin-left:5px;
     }

    .div2 p{

      margin-left:140px; 
    }
}

.ThirdDivAbout{
   
  width:100%;
  height:auto;
  background-color:  #f1f1f1;
  padding-bottom: 100px;


}

.parentThird{
  
  width:90%;
  height:auto;
  margin-left:100px;
  margin-right:150px;
  padding-top:50px;
  padding-bottom:50px;  
} 

@media(max-width:500px){

   .parentThird{

    margin-left:30px;
   }
}

.childThirDivAbout1{

  width:230px;
  height:600px;
  background-color: white;
  box-shadow: 5px 10px 0 #cbcaca;
   
 
}

@media(max-width:500px){

   .childThirDivAbout1{

      margin-bottom: 50px;
   }
}

.aboutMenu{ 

  font-family: "Playfair Display", serif;
  font-size: 24px;
  font-weight: 200;
  line-height: 28.8px;
  color: rgb(224, 34, 54);
  text-align: center;
  padding-top:15px;
  padding-bottom: 15px;
}

.button-container {
  display: flex;
  gap: 5px; /* Adds spacing between buttons */
}

.button{

  width:100%;
  height:auto;
  padding-top:5px;
  padding-bottom: 5px;
  text-align: center;
  font-family: Arial, sans-serif;
 font-size: 15px;
 font-weight: 400;
 line-height: 24px;
 color: black;
 font-weight:bold;
 cursor: pointer;
 transition: background-color 0.5s ease, color 0.4s ease-in-out; 
 
}

@media(max-width:700px){
    
    .button{
        
        padding-top:none;
        padding-bottom:none;
        
    }
}




.button:hover{

   background-color: rgb(248, 244, 244);
    
}

.button:active{
  background-color: rgb(154, 11, 11);
  color:white;
  

}

.button.active {
  background-color:rgb(131, 7, 7) ;  /* Example active color */
  color: white;
}

.childThirDivAbout2{

  width:800px;
  height:auto;
  margin-left:50px;
}

.content-div {
  
  display: none; /* Hide all divs initially */
  
}

.content-div h1{
 
  font-family: "Playfair Display", serif;
  font-size: 24px;
  font-weight: 700;
  line-height: 28.8px;
  color: rgb(119, 119, 119);
  padding-top:50px;
  padding-left:30px;
}

.content-div p{

  font-family: Arial, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 24px;
    color: rgb(119, 119, 119);
    padding-top:20px;
    padding-left:30px;


}

.EligibleCapart1{

  width:400px;
  height:500px;
  

}

.academic1{

  font-family: "Playfair Display", serif; /* Font name with fallback */
  font-size: 24px; /* Font size */
  font-weight: 700; /* Bold font */
  line-height: 28.8px; /* Line height */
  color: rgb(119, 119, 119); /* Font color */
}


.academic2{

  font-family: "Playfair Display", serif; /* Font name with fallback */
  font-size: 14px; /* Font size */
  font-weight: 700; /* Bold font */
  line-height: 16.8px; /* Line height */
  color: rgb(119, 119, 119); /* Font color */
  margin-left:10px;
}


.academic3{

  font-family: "Playfair Display", serif; /* Font name with fallback */
  font-size: 14px; /* Font size */
  font-weight: 500; /* Bold font */
  line-height: 16.8px; /* Line height */
  color: rgb(119, 119, 119); /* Font color */
  margin-left:10px;
}


.EligibleCapart2{

 width:400px;
 height:500px;
 

}

.styled-text {
  font-family: "Playfair Display", serif; /* Font name */
  font-size: 24px; /* Font size */
  font-weight: 700; /* Font weight */
  line-height: 28.8px; /* Line height */
  color: rgb(119, 119, 119); /* Font color */
}

table {
  width: 100%;
  border-collapse: collapse; /* Ensures borders are collapsed into one */
  margin: 20px 0; /* Adds margin around the table */
}

/* Table header */
th {
  background-color: #9a0c0c; /* Green background for header */
  color: white; /* White text color for header */
  padding: 10px; /* Adds padding inside header cells */
  text-align: left; /* Aligns header text to the left */
  font-size: 16px; /* Increases font size */
}

/* Table data */
td {
  padding: 10px; /* Adds padding inside data cells */
  text-align: left; /* Aligns data text to the left */
  border-bottom: 1px solid #ddd; /* Adds a light gray border below each row */
  font-size: 14px; /* Increases font size */
}

/* Row hover effect */
tr:hover {
  background-color: #f2f2f2; /* Light gray background on hover */
}

/* Styling for alternating rows */
tr:nth-child(even) {
  background-color: #f9f9f9; /* Light background for even rows */
}

tr:nth-child(odd) {
  background-color: #ffffff; /* White background for odd rows */
}

/* Optional: Add a border around the table */
table, th, td {
  border: 1px solid #ddd;
}

.googleMap1{

  position: relative;
  width:90%px; /* Set the width for the images */
  height: 400px; /* Set the height for the images */
  object-fit:fit; 
  margin-left:100px;
  margin-top:100px;/* Ensure the image fits well within the container */
}

@media(max-width:500px){

.googleMap1{

  margin-left:30px;
   
}

}

.googlemap2{

    width:90%;
    height:400px;
}

.contactuspart3{

  width:90%; /* Set the width for the images */
  height: auto; /* Set the height for the images */
  margin-left:100px;
  margin-top:100px;
  /* Ensure the image fits well within the container */  
     
}

@media(max-width:500px){

 .contactuspart3 {

  margin-left:30px;

 }
 
   
}

.contaaddress1{

  font-family: "Playfair Display", serif;
font-size: 16px;
font-weight: 700;
line-height: 24px;
color: rgb(34, 34, 34);
display: flex;
 gap:10px;
}

.contaaddress2{

  font-family: "Playfair Display", serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
  color: rgb(34, 34, 34);
  display: flex;
    gap:10px;
    margin-top:10px;
}

.imageContactus{

  width:30px;
  height:30px;
  background-color: transparent;
}

.sendCont{

  font-family: Arial, sans-serif;
  font-size: 13px;
  font-weight: 400;
  line-height: 24px;
  color: rgb(119, 119, 119);
  margin-left:10px;
  
}

.details12{

  width:400px;
  height:250px;
  


}


@media(max-width:500px){

  .details12{

      margin-top:50px;
  }
   
}

.custom-input::placeholder {
  font-size: 12px; /* Adjust the size */
  font-weight: 400; /* Optional: Change weight */
  color: gray; /* Optional: Change color */
  border:none;
}

.custom-input{
  width:380px; 
  height:35px; 
 
  margin-top:20px;
}

.contButton1{

  margin-left:600px;
  width:150px;
  height:40px;
}

@media(max-width:500px){

.contButton1{

  margin-left:50px;
  margin-bottom:50px;

}

}

.contButton{

  width:150px;
  height:40px;
  background-color: rgb(15, 15, 104);
  color:white;
  
}

.childThirDivAbout2{

  width:45%px;
  height:auto;
  margin-left:50px;
  
}

.accordion {
  max-width: 600px;
  margin: 50px auto;
  padding: 0;
}

.accordion-item {
  border: 1px solid #ddd;
  margin-bottom: 10px;
}

.accordion-header {
  background-color:rgb(253, 252, 252);
  border: none;
  padding: 15px;
  text-align: left;
  font-size: 16px;
  width: 100%;
  cursor: pointer;
  outline: none;
  color:rgb(160, 16, 16)
}

.accordion-content {
  padding: 15px;
  background-color: #f9f9f9;
  display: none; /* Hidden by default */
}

.accordion-header.active {
  background-color: #ccc; /* Change background when active */
}

.accordion-content.active {
  display: block; /* Show content when active */
}

.imagOne{

   width:250px;
   height:360px;
  
}

.galaryparent{


   width:100%;
   height:auto;
   background-color:  #f1f1f1;
   padding-bottom: 100px;
}

.button{
    
    border:none;
}