
*{
	margin: 0; padding: 0; border-style: border-box;
}


body{
	background: white;
	font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
}

a 	{ text-decoration: none; }

.container-top{
	width: 100%;
	margin: 0 auto;
	background: white;
	padding: 20px 0 1px 0;
}

table {
  border-collapse: collapse;  
}

.logo{
	padding-left: 100px;
	display: grid;
	grid-template-columns: 1fr 4fr 1fr;
	}

	.logo_img2 img{
		padding-right: 50px;
		animation-duration: 10s;
		animation-name: logo_img2;
		position: relative;
	}

	.lang-bar{
		text-align: right;
		font-weight: bold;
		padding-right: 30px;
		
	}
	.lang-bar a{
		color: coral;	
	}

	@keyframes logo_img2 {
  0%   {left:0px; top:0px;}
  25%  {left:-20%; top:0px;}
  100% {align: right; left:0%; top:0px;}
}

nav { background-image: linear-gradient(to right, #0E4A92, #3386EA); }
nav ul{ list-style: none; padding-left: 100px; }
nav ul li{ display: inline; }
nav ul li a { display: inline-block; padding: 15px 20px; color: white; }
.lng {align-content: end;}
nav ul li a:hover { background-color: #69AAF7; }
.menu-bar{display: inline;}



.mob-nav {display: none;}
.mob-logo{ display: none; }
.mob-nav ul { padding-left: 3px; }
.mob-nav ul li{ display: block; }
.mob-nav ul li a { width: 100%; border-bottom: 1px solid white; padding: 20px;}
.mob-nav h3 { padding: 10px 0 10px 20px; color: white;}



.container{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
}

.slider{
	width: 100%;
	height: 350px;
	overflow: hidden;
}

.slides{
	width: 500%;
	height: 350px;
	display: flex;
}

.slides input{
	display: none;
}

.slide {
	width: 20%;
	transition: 2s;
}

.slide img{
	width: 100%;
	height: 350px;
}

/*manual navigation*/
.navigation-manual{
	position: absolute;
	width: 100%;
	margin-top: -40px;
	display: flex;
	justify-content: center;
}

.manual-btn{
	border: 2px solid #146ED9;
	padding: 5px;
	border-radius: 10px;
	cursor: pointer;
	transition: 1s;
}

.manual-btn:not(:last-child){
	margin-right: 40px;
}

.manual-btn:hover{
	background: #146ED9;
}

#radio1:checked ~ .first{
	margin-left: 0;	
}

#radio2:checked ~ .first{
	margin-left: -20%;	
}

#radio3:checked ~ .first{
	margin-left: -40%;	
}

#radio4:checked ~ .first{
	margin-left: -60%;	
}


/*auto navigation*/

.navigation-auto{
	position: absolute;
	display: flex;
	width: 100%;
	margin-top: 310px;
	justify-content: center;


}

.navigation-auto div{
	border: 2px solid #146ED9;
	padding: 5px;
	border-radius: 10px;
	transition: 1s;
}

.navigation-auto div:not(:last-child){
	margin-right: 40px;
}

#radio1:checked ~ .navigation-auto .auto-btn1{
	background: #146ED9;
}
#radio2:checked ~ .navigation-auto .auto-btn2{
	background: #146ED9;
}
#radio3:checked ~ .navigation-auto .auto-btn3{
	background: #146ED9;
}
#radio4:checked ~ .navigation-auto .auto-btn4{
	background: #146ED9;
}



.vision-bar{
	text-align: center;	
	background-color: #DEEDFE;
	font-style: italic;
}
.v-hed {
	color: #0C5EBF;
	padding: 20px 0 20px 0 ;
}
.v-para{
	color: #054087;
	font-size: 30px;
	padding-bottom: 20px;
}

.sum_head p {
	padding-top: 30px;
	text-align: center;
	color: #0C4C97;
	font-size: 25px;
	font-weight: bold;
}

.population-count{
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
	margin: 30px 100px 10px 100px;
	justify-content: center;
	grid-column-gap: 20px;
}

.card{
	background-color: #0C4C97;
	padding: 25px 0 25px 0 ;
	color: white;
	border-radius: 20px;
}

.count{
	font-size: 50px;
	padding-bottom: 20px;
}

.l-update{
	text-align: right;
	padding: 0 100px 20px 0;
	font-style: italic;
	font-weight: bold;
	font-size: 12px;
}

.discription{
	padding: 0 70px 0 70px;
	text-align: justify;
	text-justify: inter-word;
	padding-bottom: 25px;
}

 .disc-head h1{
 	font-size: 25px;
 	color: #45C4FF;
 	text-align: center;
 	padding-bottom: 20px;
 }

 .disc-para h2 {
 	padding: 15px 0;
 	font-size: 20px;
 	color: #1BA0DE;
 }

 .disc-para p{ 	
	text-indent: 50px;
	line-height: 1.6;
	color: #085A80;
 }

 .disc-para ul{
	padding-top: 10px;
	padding-bottom: 10px;
 }

 .disc-para ul  li{
	color: #085A80;
	padding-left: 50px;
 }

 .footer{
 	display: grid;
 	grid-template-columns: 2fr 2fr 1fr;
 	padding: 25px 100px 25px 100px;
 	line-height: 1.5;
 	background-color: #088ECD;
 	color: white;
 }

 .footer h1{
 	color: #085A80;
 	font-size: 25px;
 	padding-bottom: 10px;
 	color: white;

 }

 .v_count{
 	font-family: impact, sans-serif;
 	font-size: 50px;
 }

 .news{
 	padding: 0 100px 0 0;
 }

 .copyright{
 	background-color: #063B53;
 }

 .copyright p{
 	text-align: center;
 	padding: 15px 0 15px 0;
 	color: white;
 	font-size: 11px;
 }



 .gn-sum{
 	width: 60%;
 	padding: 0 25px 0 25px;
 	margin-left: auto;
 	margin-right: auto;
 }

 .gn-sum-head h1{
 	font-size: 23px;
 	text-align: center;
 	color: #065B5F;
 	padding-bottom: 15px;
 }
 /*------------------------------------------------ tables*/

 .table_style_1{
 	padding-bottom: 50px;

 }

 .table_style_1 table {
 	border-color: #0BCAD3;
 	width: 100%;
 	font-size: 14px;
 }

 .table_style_1 th {
 	height: 30px;
 	background-color: #0AA4AB;
 	color: white;
 }

 .table_style_1 td {
 	height: 25px;
 }

 .center-td{
 	text-align: center;
 }

 .left-dt{
 	text-align-last: left;
 	padding-left: 25px;
 }
 /*------------------------------------------------ tables*/


/*-------------------------------------------------------------------------------contact us page*/

	.contact_dt{
		margin: 50px 0 50px 450px;
	}

	.contact_dt tr {
		height: 30px;
	}

	.contact_dt th {
		text-align: left;
	}

	.contact_dt table {
		font-size: 20px;
		color: #096CBF;
	}


	.contact_form{
		padding-left: 150px;
		padding-right: 250px;
		padding-bottom: 50px;
		text-align: left;
	}

	.mg_row {
		display: grid;
		grid-template-columns: 1fr 4fr;
	}

	.mg_row_head{
		padding-bottom: 20px;
	}

	.mg_row_head h1 {
		font-size: 20px;
		color: #087A7F;
	}

	.contact_form_head h1 {
		color: #09AC7D;
		padding: 20px 0 25px 0;
	}

	.mg_input input[type=text], textarea{
  width: 100%;
  text-align: left;
  box-sizing: border-box;
  border: 2px solid #087A7F;
  border-radius: 4px;
  font-size: 12px;
  background-color: white;  
  background-position: 10px 10px; 
  background-repeat: no-repeat;
  padding: 6px 10px 6px 20px;
}

.mg_input input[type=submit] {
  width: 50%;
  background-color: #087A7F;
  color: white;
  padding: 8px 20px;
  margin: 8px 0;
  border: none;
  border-radius: 15px;
  cursor: pointer;
}

.sucsse{
	background-color: #09972A;
	color: white;
	padding: 20px 0 20px 0;
	width: 50%;
	margin-bottom: 50px;
	border-radius: 20px;
	
}

.dochead{
	padding: 25px;	
}
.dochead h1{
	color: orange;
}

.docpanal{
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	grid-row-gap: 35px;
	padding: 50px ;
}
.docpic img{
	border-radius: 10px;
	box-shadow: 2px 2px 3px #525050;
	border: 2px solid white;
}

.docpic img:hover {
	transform: scale(1.2);
	box-shadow: 5px 5px 6px #525050;
}

.doctitle p{
	font-size: 18px;
	font-weight: bold;
	color: #0B678C;
}

/*service page

* {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
    }

    /*body {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100vh;
      background: #f4f4f4;
      font-family: 'Segoe UI', sans-serif;
    }*/

    .button-container {
      display: flex;
      gap: 5rem;
      flex-wrap: wrap;
      padding: 25px;
      position: relative;
      margin: 25px;

    }

    .animated-button {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      width: 150px;
      height: 150px;
      background: linear-gradient(145deg, #ffffff, #dcdcdc);
      border-radius: 20px;
      box-shadow: 0 10px 20px rgba(0,0,0,0.1);
      cursor: pointer;
      transition: transform 0.3s, box-shadow 0.3s;
      text-align: center;
      position: relative;
  		top: 50%;
  		left: 35%;
  		
    }

    .animated-button:hover {
      transform: scale(1.05);
      box-shadow: 0 15px 25px rgba(0,0,0,0.2);
    }

    .icon {
      font-size: 40px;
      margin-bottom: 10px;
      transition: transform 0.3s;
    }

    .animated-button:hover .icon {
      transform: rotate(10deg) scale(1.1);
    }

    .label {
      font-size: 18px;
      font-weight: bold;
      color: #333;
    }

    @media (max-width: 500px) {
      .animated-button {
        width: 120px;
        height: 120px;
      }

      .icon {
        font-size: 30px;
      }

      .label {
        font-size: 16px;
      }
    }


    /* Regiter Form */

  .container_rg {
  max-width: 400px;
  margin: 50px auto;
  background: white;
  padding: 20px;
  border-radius: 10px;
  box-shadow: 0 0 10px rgba(0,0,0,0.1);
}

.container_rg form h2 {
  text-align: center;
  margin-bottom: 20px;
}

.form-group {
  margin-bottom: 15px;
}

.form-group label {
  display: block;
  font-weight: bold;
  margin-bottom: 5px;
  font-size: 12px;
  color: #1f858e;
}

.form-group p{
	color: red;
	font-size: 10px;
	font-weight: bold;
	text-align: center;
}

form input,
form textarea,
form select {
  width: 100%;
  padding: 10px;
  box-sizing: border-box;
  border-radius: 5px;
  border: 1px solid #ccc;
}

form button {
  width: 100%;
  padding: 10px;
  background-color: #28a745;
  color: white;
  border: none;
  border-radius: 5px;
  cursor: pointer;
}

.form-group  {
	color: red;
	font-size: 10px;
	font-weight: bold;
	text-align: center;
}

.error-message {
  color: red;
  font-size: 0.9em;
  margin-top: 5px;
  display: block;
}

.form-group input[type=submit] {
  width: 100%;
  background-color: white;
  color: #07820f;
  padding: 10px 15px;
  margin: 8px 0;
  border: 3px solid #07820f;
  border-radius: 5px;
  cursor: pointer;
  font-weight: bold;
}
.form-group input[type=submit]:hover {
  background-color: #07820f;
  color: white;
  cursor: pointer;
}






.container_rged {
  background-color: #c5fac8;
  padding: 2rem;
  margin: 50px;
  border-radius: 16px;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
  max-width: 700px;
  width: 95%;
  animation: fadeInUp 1s ease;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

/* Two-column layout for larger screens */
@media (min-width: 600px) {
  .container_rged {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }
}

/* Image styling */
.img_tic {
  flex: 1;
  text-align: center;
}

.img_tic img {
  width: 200px;
  height: 200px;
  animation: popIn 0.6s ease;
}

/* Text section */
.rgd_details {
  flex: 2;
  text-align: center;
}

@media (min-width: 600px) {
  .rgd_details {
    text-align: left;
  }
}

.greetin {
  font-size: 1.3rem;
  font-weight: 600;
  color: #2e7d32;
  margin-bottom: 0.5rem;
}

.nameof,
.telof {
  font-size: 1rem;
  color: #555;
  margin: 0.25rem 0;
}

/* Buttons */
.btn-group {
  margin-top: 1.2rem;
}

.btn-go,
.btn-login {
  display: inline-block;
  margin: 0.3rem 0.5rem 0 0;
  padding: 0.6rem 1.4rem;
  border-radius: 8px;
  text-decoration: none;
  font-weight: 500;
  transition: background-color 0.3s ease;
}

.btn-go {
  background-color: #2e7d32;
  color: white;
}

.btn-go:hover {
  background-color: #1b5e20;
}

.btn-login {
  background-color: #d32f2f;
  color: white;
}

.btn-login:hover {
  background-color: #b71c1c;
}

/* Animations */
@keyframes fadeInUp {
  from {
    transform: translateY(40px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes popIn {
  from {
    transform: scale(0.5);
    opacity: 0;
  }
  to {
    transform: scale(1);
    opacity: 1;
  }
}










@media (max-width: 600px) {
  .container {
    margin: 20px;
    padding: 15px;
  }
}



/*-------------------------------------------------------------------------------contact us page*/


@media screen and (max-width: 900px){
	.mob-nav{ display: block; }
	nav ul { display: none; }
	.logo { padding-left: 0; }
	.slider{ height: 200px; }
	.slides{ height: 200px; }
	.slides img { height: 200px; }
	.v-para p { font-size: 12px; }
	.v-hed { padding-bottom: 2px; }
	.v-hed h2 { font-size: 14px; }
	.navigation-auto { display: none; }
	.navigation-manual{ display: none; }
	.sum_head p { font-size: 14px; }
	.population-count{ grid-template-columns: 1fr 1fr ; margin: 5px 10px 10px 10px; grid-column-gap: 10px; grid-row-gap: 10px; }
	.count { font-size: 25px }
	.discription { padding: 10px; }
	.disc-head h1 { font-size: 25px; }
	.disc-head h2 { font-size: 16px; }
	.footer{ 	display: block; padding: 25px 100px 25px 100px; padding: 20px 10px 10px 10px; }
	.news { padding: 0; }
	.news p { text-align: center; }
	.news h1 { text-align: center; }
	.contact-head{ text-align: center }

	.gn-sum { width: 100%; padding: 0 0 0 10px;}
	.gn-sum table { width: 100%; }
	.table_style_1 table { font-size: 10px; }
	.table_style_1 th { font-size: 11px; }
	.left-dt { padding-left: 2px }

	.contact_dt{ margin: 50px 0 50px 10px; 	}
	.contact_dt table { font-size: 14px; }
	.contact_form{ padding: 50px 10px 50px 10px;	}
	.mg_row { display: block; }
	.mg_row_head{ text-align: center; padding-bottom: 5px;}
	.mg_input { padding-bottom: 15px; }
	.mg_input input[type=submit] { width: 100%; height: 50px; }
	.sucsse {width: 100%;}

	.docpanal{ grid-template-columns: 1fr 1fr ; grid-row-gap: 35px; padding: 50px ;}
}
	



 @media screen and (max-width: 640px){
	.mob-nav{ display: block; }
	nav ul { display: none; }
	.logo { display: none; }
	.mob-logo{ display: block; padding-left: 10px;}
	.slider{ height: 100px; }
	.slides{ height: 100px; }
	.slides img { height: 100px; }
	.v-para p { font-size: 12px; }
	.v-hed { padding-bottom: 2px; }
	.v-hed h2 { font-size: 14px; }
	.navigation-auto { display: none; }
	.navigation-manual{ display: none; }
	.sum_head p { font-size: 14px; }
	.population-count{ grid-template-columns: 1fr 1fr ; margin: 5px 10px 10px 10px; grid-column-gap: 10px; grid-row-gap: 10px; }
	.count { font-size: 25px }
	.discription { padding: 10px; }
	.disc-head h1 { font-size: 25px; }
	.disc-head h2 { font-size: 16px; }
	.footer{ 	display: block; padding: 25px 100px 25px 100px; padding: 20px 10px 10px 10px; }
	.visiters{ padding-top: 25px; }
	.news { padding: 0; }
	.news p { text-align: center; }
	.news h1 { text-align: center; }
	.contact-head{ text-align: center }

	.gn-sum { width: 100%; padding: 0 0 0 0;}
	.gn-sum table { width: 100%; }
	.table_style_1 table { font-size: 10px; }
	.table_style_1 th { font-size: 11px; }
	.left-dt { padding-left: 2px }	

	.docpanal{ grid-template-columns: 1fr; grid-row-gap: 35px; padding: 50px ;}
}