@charset "UTF-8";
*{box-sizing:border-box; margin:0; padding:0; list-style-type:none;}
img{width:100%; max-width:100%;height:auto;}
a{text-decoration:none;}
b,strong{font-weight:500;}
body{font-family:"Roboto", sans-serif; font-size:14px;}

header{font-size:16px;}
.header_top_row{background:linear-gradient(to bottom, rgba(0,0,102,1) 0%,rgba(10,34,161,1) 100%); color:#fff; padding:10px;}
.header_top_row_inner{display:flex; flex-direction:column; gap:10px; align-items:center;}
.mail_us, .htr_right_col{display:none;}

.headerMainRow{display:flex; flex-direction:column;}
.logo{width:200px; margin:10px auto;}

.main_section{padding:20px 10px; background:#FFEBD2}
.namehbox{background:#E6D276; border:1px solid #D9C66F; padding:10px; line-height:170%; display:flex; justify-content:space-between; align-items:center; margin-bottom:10px;}
.namehboxR{display:flex; justify-content:space-between; align-items:center;}
.namehboxR a{color:#ed3e23; padding:0 3px}
.namehboxR img{width:18px; height:20px;}
.namehboxL{font-size:120%;line-height:170%;color:#06145F; font-weight:500;}

.midPanel{display:grid; gap:10px;}
.detailPanel{padding:10px; background:#fff;}

.dashbLinks h3{padding:15px 20px; background:linear-gradient(to bottom, rgba(0,0,102,1) 0%,rgba(10,34,161,1) 100%); color:#fff; font-size:150%; margin:0; font-weight:500}
.dashbLinks ul{background:linear-gradient(to bottom, #fefefe 0%, #eee 100%); padding:20px; border:1px solid #f5f5f5;}
.dashbLinks li{padding-left:50px; position:relative; line-height:170%; margin-bottom:15px;border-bottom:1px dotted #ccc; padding-bottom:10px;list-style:none}
.dashbLinks li:last-child{border:none}
.dashbLinks li img{width:25px; position:absolute; top:0; left:0; height:auto;}
.dashbLinks li a{color:#222}
.dashbLinks li a:hover{color:#ed3e23}

.copyright{text-align:center; padding:10px; color:#E6D276; background:linear-gradient(to bottom, #555 0%, #222 100%); font-weight:500}

@media screen and (min-width:768px){
	.htr_left_col{display:flex; justify-content:space-between; gap:20px;}
	.mail_us{display:flex; align-items:center; gap:5px;}
	.mail_us a{color:#e6d276;}
}

@media screen and (min-width:1024px){
	.header_top_row_inner{flex-direction:row; justify-content:space-between;}
	.headerMainRow{text-align:left; flex-direction:row; align-items:center; justify-content:space-between; gap:30px; padding:10px;}	
	.logo{margin:0;}
	.midPanel{grid-template-columns:1fr 2fr; gap:10px;}
	.detailPanel{order:2}
	.dashbLinks{order:1}
	.htr_right_col{width:max-content; display:flex;}
	.htr_right_col ul{display:flex; justify-content:end; gap:12px;}
	.htr_right_col ul a{color:#fff;}
	.htr_right_col ul li{padding:5px 9px; border-radius:2px;}
	.htr_right_col ul li.fb{background:#0862f7}
	.htr_right_col ul li.tw{background:#000}
	.htr_right_col ul li.lk{background:#0178b2}
	.htr_right_col ul li.in{background:#ec02d2}
	.htr_right_col ul li.yt{background:#f70000}
}

@media screen and (min-width:1280px){
	header{border-bottom:3px ridge #020874;}
	.mainMenu{flex:1}
	.pageContainer{width:1200px; max-width:1200px; margin:0 auto;}
	main{background:url('../images/unvbg.jpg') no-repeat left top; background-size:cover; padding:20px;}
	.main_section{padding:30px 20px;}
	.namehboxL{font-size:150%;}
	.midPanel{grid-template-columns:1fr 3fr; gap:20px;}
	.detailPanel{padding:20px;}
	.dashbLinks li{line-height:100%; margin-bottom:10px;padding:10px 5px 15px 60px; font-size:16px;}
	.dashbLinks li img{position:absolute; top:5px; left:15px}
}
