@charset "utf-8";
/* CSS Document */
:root {
	--theme-color: #995316; /* Replace with the desired color */
  }
  
body{
	margin:0px;
	padding:0px;
	height:100%;
	font-family: "Roboto", Sans-serif;
	background:#ffffff;
	color:#555;
}
.mainbody {
max-width: 1280px;
margin:auto;
padding: 0rem 1rem;
}
/* Table Style S*/
.table-container {
	max-width: 100%;
	overflow-x: auto;
	margin: 1rem auto;
  }
table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid var(--theme-color);
}
th, td {
  padding: 8px;
  text-align: left;
}

th {
  background-color: #f2f2f2;
}

tr:nth-child(even) {
  background-color: #f2f2f2;
}

.table-container img {
  width: 100%;
}
/* Table Style E*/

/* Font Style & Design S */
.scrolltext{
font-size: 0.9rem;
font-weight: 600;
line-height: 1rem;
color:blue;
}
.red{
	color: red;
}
.uline{
	text-decoration: underline;
}
.mheading{
	font-size: 1rem;
	line-height: 2rem;
}
.mhbox{
	padding-left: 1rem;
}
/* Font Style & Design E*/ 
header {
	border-top: 1rem solid var(--theme-color);
	border-bottom: 1rem solid var(--theme-color);
	padding: 0.5rem 0;
	margin-bottom: 1rem;
  }
  
  .container {
	display: flex;
	align-items: center;
	justify-content: space-between;
	max-width: 1280px;
	margin: 0 auto;
  }
  
  .logo img {
	width: 150px; /* Adjust the width as per your logo dimensions */
  }
  
  .title {
	text-align: right;
	font-size: 1rem;
  }
  
  @media screen and (max-width: 600px) {
	.container {
	  flex-wrap: wrap;
	}
  
	.logo, .title {
	  flex: 0 0 100%;
	  text-align: center;
	  margin-bottom: 10px;
	  font-size: 0.5rem;
	}
  }

/* menu Bar */
.topnav {
	max-width: 1280px;
	margin: 1rem auto;
	overflow: hidden;
	background-color: #333;
  }
  
.topnav a {
	float: left;
	display: block;
	color: #f2f2f2;
	text-align: center;
	padding: 14px 16px;
	text-decoration: none;
	font-size: 17px;
  }
  
.topnav a:hover {
	background-color: #ddd;
	color: black;
  }
  
  .topnav a.active {
	background-color: var(--theme-color);
	color: white;
  }
  
  .topnav .icon {
	display: none;
  }
  
  @media screen and (max-width: 600px) {
	.topnav a:not(:first-child) {display: none;}
	.topnav a.icon {
	  float: right;
	  display: block;
	}
  }
  
  @media screen and (max-width: 600px) {
	.topnav.responsive {position: relative;}
	.topnav.responsive .icon {
	  position: absolute;
	  right: 0;
	  top: 0;
	}
	.topnav.responsive a {
	  float: none;
	  display: block;
	  text-align: left;
	}
  }
/* menu Bar */

.Section-1 {
	display: flex;
	justify-content: space-between;
	max-width: 1280px;
	margin: 0 auto;
	min-height: 400px;
  }
  

  .left-panel, .main-section, .right-panel {
	padding: 0.1rem;
	background-color: #ffffff;
  }
  
  .left-panel {
	flex-basis: 20%;
  }
  
  .main-section {
	flex-basis: 60%;
	margin: 0rem 0.5rem;
  }
  
  .right-panel {
	flex-basis: 20%;
  }
  
  @media screen and (max-width: 600px) {
	.Section-1 {
	  flex-direction: column;
	}
  
	.left-panel, .main-section, .right-panel {
	  flex-basis: auto;
	  margin-bottom: 20px;
	}
  }

/* Side Panel Box */
.sbox, .boxtitle, .boxdet{
	float: left;
	width: 100%;
	height: auto;	
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	outline: none;
}
.sbox .boxdet{
	list-style: none;
	text-decoration: none;
  }
/* Target li elements inside .accordion-item-body ul */
.sbox .boxdet .accordion li{
	border-top: none;
	color: #003375;
	font-size: 13px;
	font-weight: 500;
	list-style: disclosure-closed;
	margin-left: -1rem;
	cursor: pointer;
	margin: 0.2rem auto 0.2rem -1rem;
}

.sbox .boxdet .accordion li:hover{
	background-color: #ececec;
}

/* Target li elements inside .sbox .boxdet */
.sbox .boxdet li {
    float: left;
    width: 100%;
    height: auto;
    padding: 8px 10px;
    border-top: 1px solid #fff;
    color: #333;	
    font-size: 13px;
    font-weight: 500;
}



  .sbox .boxdet li a{
	text-decoration: none;
	color: rgb(37, 37, 37);
  } 
  .sbox .boxdet li a:hover{
	color: blue;
  }

.boxtitle{
	padding: 8px 10px;
	background-color: var(--theme-color);
	border: 1px solid white;
	color: #fff;
	text-transform: uppercase;
}
.boxdet{
	margin-bottom: 10px;
	background-color: #D0D3D3;
	border: 1px solid #a7c2db;
	list-style: none;
}
.updatebox{
	margin: 0rem auto 0.5rem;
	padding:0.5rem;
	background-color: var(--theme-color);
	color:white;
}
.updatebox a {
	text-decoration: underline;
	color: #ffef00;
	font-weight: 500;
}
.updatebox2{
	line-height: 2rem;
	text-align: center;
	color: blue;
	font-weight: bold;
}
footer {
	background-color: var(--theme-color);
	padding: 1rem;
	text-align: center;
	margin-top: 1rem;
  }
  
  .f-cont {
	max-width: 1280px;
	margin: 0 auto;
	color:white;
  }
  
  p {
	margin: 0;
  }

  .separator {
	margin: 0 1rem;
	color: black; 
}

/*** Accordin Tabs CSS**/
.accordion {
	display: flex;
	flex-direction: column;
	margin: 0.5rem;
}
.accordion-item {
	border: 1px solid #ddd;
	margin-bottom: 10px;
}
.accordion-item-header {
	background-color: #d0712c;
  padding: 10px;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: white;

}
.accordion-item-body {
	display: none;
	padding: 10px;
}
.accordion-item.active .accordion-item-body {
	display: block;
}
/* Icons for the accordion */
.accordion-item-header .icon {
	font-size: 20px;
	line-height: 20px;
	margin-left: 10px;
}
.volume-name {
	flex-grow: 1;
}

/***/

.row {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

/* Style for each section */
.sec3 {
	flex: 1; 
	padding: 0.3rem 0rem 0.3rem 1rem;
}
.jform{
	margin: 1rem auto;
	padding: 0rem 1rem;
  }

.jrow{
	width: 100%;
	display: inline-block;
	margin: 0.5rem auto;
}
.input-field {
	padding: 10px;
	border: 1px solid #3e3e3e;
	border-radius: 4px;
	width:150px;
  }
  .submit-button {
	padding: 10px 20px;
	background-color: #007bff;
	border: none;
	border-radius: 4px;
	color: #fff;
	cursor: pointer;
  }
  
  .submit-button:hover {
	background-color: #0056b3;
  }
  .hide{
	display: none;
  }
  .ermsgred{
	color:red;
  }
  .paysub{
	text-decoration: none;
  padding: 0.3rem 2rem;
  border: none;
  background-color: #995316;
  color: white;
  cursor: pointer;
  }

  .subpbox{
	border: 2px solid black;
  text-align: center;
  padding: 1.2rem;
  font-size: 2rem;
  margin: 1rem auto;
  }

  .jlabel{
	line-height: 1.5rem;
  font-size: 0.9rem;
  font-weight: bold;
  color: gray;
  }

  .pf_head {
	padding: 0.5rem;
  border: 1px solid black;
  margin: 1rem Auto 0.5rem;
  background: aliceblue;
  font-weight: bold;
  }