@charset "UTF-8";
/* Live Server File */
:root{
	--bgPrimary:#005b91;
	--lightbgPrimary:#ecf8ff;
	--bgSecondary:#00b4d5;
	--lightbgSecondary:#93efff;
	--darkbg:#003f7a;
	--light: #f5f5f5;
	--accentCol:#685ef0 ;
	--white: #fff;
	--black: #222;
	--grey: #999;
	--lightgrey: #ccc;
	--gradient: linear-gradient(to right, #033977, #00dbf7, #033977,#00dbf7);
	--gradient2: linear-gradient(to right top, #e1fcff, #eafcff, #f4fcff, #fbfdff, #ffffff, #fbfdff, #f4fcff, #eafcff, #e1fcff);
	--shadow:2px 2px 4px 0 rgba(0, 0, 0, 0.6);
	--lightshadow:2px 2px 4px 0 rgba(0, 0, 0, 0.1);
}
*{margin:0; padding:0; box-sizing:border-box; text-decoration:none;list-style:none;}
html{font-size:10px; width:100%; height:100%;}
body{font-family: 'Poppins', sans-serif; font-size:1.4rem; color:var(--black); background: url('../digicadmin/images/bodybg.jpg') no-repeat center center; background-size:cover; background-attachment: fixed; height:100%;padding-bottom:8rem;}
img{width:100%;border:none; height:auto; display:block;}
button, input, select, textarea{font-family: 'Poppins', sans-serif; width:100%; resize:none; font-size:1.4rem;border:none;}
input:focus, select:focus, textarea{outline:none}
::placeholder{color:var(--darkbg)}
select:invalid{color:var(--darkbg)}
input[type=button], input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button {-webkit-appearance:none; -moz-appearance:none;appearance:none;}
a, a:link, a:active{text-decoration:none;}
a:visited{color:var(--accentCol)}
.clearfix:before, .clearfix:after{content:"";display:table;}
.clearfix:after{clear:both;}
.clearfix{*zoom: 1;}
sup{color:red; margin:0 0.2rem; font-size:1.6rem; position:absolute;}

header{box-shadow:var(--shadow)}


.header_top_row_content{display:flex; flex-direction:column; gap:0.5rem}
.htrc_right{display:flex; justify-content:space-between;background:var(--darkbg); padding:0.8rem 2rem; color:var(--white); align-items:center;}
.htrcr_right_col{display:flex; flex-direction:column; gap:0.5rem;}
.sign_out{width:2rem;cursor:pointer; align-self:end;}
.sign_out a{color:var(--white);}
.brand{display:flex; padding:0.5rem 2rem;}
.brand img{width:25rem; height:auto}

main, .main{padding:2rem;}

.heading{display:flex; width:max-content; background: linear-gradient(to right, #172773, #0F1A4A); color:#fff; font-weight:600; font-size:2rem; padding:1rem 2rem; border-radius:0.5rem;}
.main_heading{background: linear-gradient(to right, #172773, #0F1A4A); /*background:#0F1A4A;*/ color:#fff; font-weight:600; font-size:2rem; padding:1rem 2rem}

ol{margin:0 0 2rem 2rem; list-style-type:decimal;}
ol li{margin-bottom:0.5rem; list-style-type:decimal; padding-left:1rem}
ol ::marker{color:var(--darkbg); font-weight:500; font-size:1.4rem}

.error_msg{position:absolute; width:fit-content; top:1rem; left:50%; transform:translateX(-50%); background:#ff5353; color:var(--white); padding:0.2rem 2rem;}
.input_field{position:relative;}
.inp_err_msg{position:absolute; top:calc(100% + 0.5rem); right:0;color:#ff5353;}
.inp_succ_msg{position:absolute; top:calc(100% + 0.5rem); right:0; color:green;}

/* ul{margin:0 0 3rem;}
ul li{margin-bottom:1.5rem; padding-left:3rem; position:relative;}
ul li:before{position:absolute; top:0.1rem; left:0; content:'➤'; font-size:1.3rem; font-weight:600; color:var(--accentCol)} */

#hupaging{font-size:1.2rem; margin:0 0 2rem;}
#hupaging ul{display:flex; gap:0.5rem; line-height:3rem; justify-content:center; align-items:center}
#hupaging ul li b{display:flex; height:3rem; padding:0 1.5rem; color:#000; background:#0f1a4a; color:#fff; text-decoration:none;}
#hupaging ul li span, #hupaging ul li a{display:flex; height:3rem; background:#0f1a4a; color:#fff; padding:0 1.5rem; text-decoration:none;}
#hupaging ul li span:hover, #hupaging ul li a:hover{background:var(--bgPrimary); color:#fff;}
.pselected b{color:#FF7E00 !important;}


footer{background:#95cce4; color:#0f1a4a; position:fixed; bottom:0; width:100%; height:4rem; display:flex; justify-content:center; align-items:center; font-weight:600}

@media only screen and (min-width:768px)
	{
		header{background:transparent url('../digicadmin/images/headerbg.png') no-repeat right top; background-size:100% 70%;}		
		.header_top_row_content{flex-direction:row; justify-content:space-between; gap:5rem; align-items:center; padding:0.5rem 2rem;}
		.htrc_right{order:2; background:transparent;color:var(--darkbg); flex:1;flex-direction:row; justify-content:space-between; padding:0; align-items:center; gap:5rem; flex-wrap:wrap;}		
		#coun_name span{background:#ff7e00; color:#fff; display:flex; padding:0.5rem 1rem; border-radius:1rem; }
		#unv_name span{background:#0f1a4a; color:#fff; display:flex; padding:0.5rem 1rem; border-radius:1rem; }
		.brand{order:1; padding:0.5rem 0}
		.header_bottom_row, .header_bottom_row_left{background:#0f1a4a; height:5rem; border-top:1px solid #fb7c00; border-bottom:1px solid #fb7c00;}
	}
@media only screen and (min-width:1024px)
	{	
		.sign_out{width:4rem;}
		.htrc_right span{font-size:1.8rem; font-weight:600}
		.brand img{width:32rem;}
		.header_bottom_row{height:4rem; padding:0 2rem;}
		
	}
@media only screen and (min-width:1280px)
	{	
		html{font-size:9.5px}
		.pageContainer{width:120rem; max-width:120rem; margin:0 auto}	
		#leftAlign .pageContainer{width:120rem; max-width:120rem; margin:0}
		header{background:url('../images/headerbg.png') no-repeat right; background-size:100% 100%; position:fixed; top:0; width:100%; z-index:2}		
		.header_top_row_content{padding:0.5rem 0 1rem;}
		#coun_name{margin:auto}
		.header_bottom_row{height:6rem; padding:1rem 0;}
		#leftAlign  .header_top_row, #leftAlign .header_bottom_row{padding:0 2rem;}		
		.brand{padding:1rem 0}

		main{padding:0; padding-top:16rem; padding-bottom:7rem;}
		
		#leftAlign main{padding:13rem 2rem 0; position:relative;}
		#leftAlign footer{justify-content:start; padding:0 2rem;}
		footer{height:6rem; font-size:1.6rem;}
	}

@media only screen and (min-width:1600px)
	{
		.pageContainer{width:140rem; max-width:140rem;}	
	}

@media only screen and (min-width:2000px)
	{
		html{font-size:15px}
		.pageContainer{width:180rem; max-width:180rem;}	
	}

@media only screen and (min-width:2500px)
	{
		html{font-size:20px}
		.pageContainer{width:220rem; max-width:220rem;}	
	}

