
@font-face{
    font-family:'Trade Gothic LT Com Cn';
    src:url(../fonts/TradeGothicLTCom-BdCn20.ttf);
}


.body{
	background-color:#F5F5F5;
	color:#000000;
	font-family:Arial, Verdana, Helvetica, sans-serif;
	font-size:14px;
	margin:0px;
}

.pageTitle{
    font-family:'Trade Gothic LT Com Cn';
	font-size:28px;
    text-align:right;
    margin-top:10px; margin-right:20px;
    text-transform:uppercase;
}

.title{
	font-size:24px;
}

.sub{
	font-size:18px;
}


/* bootstrap */
.table{margin-bottom:0px;}
.table > tbody > tr > td{vertical-align:middle; padding:5px; border-top:none !important;}
.table-hover > tbody > tr:hover{background-color:#E4E4E4!important;}
.table-borderless td{border-top:none !important;}
.table, tr, td {border-bottom-color:#EEEEEE !important;}
.iconLarge{
	font-size:14px;
	color:#666666;
}

.form-check-input{
	width:16px; height:16px; margin-top:2px; margin-right:5px; !important;
}

.btn-light {border:1px solid #CCCCCC !important;}
.bg-light:hover{background-color:#CCCCCC !important;}
.btn-light:hover{background-color:#CCCCCC !important;}
/* bootstrap */


.nTable{
	width:100%;
}

.nTable tbody > tr{
	border-bottom:1px solid #E8E8E8;
}

.nTable tbody > tr > td{
	padding:4px;
	vertical-align:middle;
}



.boxShadow{
	box-shadow:0px 0px 8px 4px rgba(0, 0, 0, 0.05);
}

.sticky{
	position:fixed;
	width:100%;
	top:0px;
}

.panel1{
	padding:10px;
	background:#FFFFFF;
	border:1px solid #E8E8E8;
	border-radius:6px;
}

.panel2{
	background:#FFFFFF;
	border:1px solid #E8E8E8;
	border-radius:6px;
}

HR{
	height:1px;
	border:none;
	background-color:#444444;
	margin-top:0px;
	margin-bottom:0px;
}

/*
ul{
	margin-left:10px;
	//margin-top:5px;
	padding-left:10px;
}*/


.footer{
	font-size:12px;
	text-decoration:none;
	display:block;
}




.metaRow{
	display:flex; justify-content:flex-start; align-items:center; padding:5px;
}

.metaTitle{
	width:160px; margin-right:10px; text-align:right;
}

.metaInput{
	width:100%;
}

//.metaRow:hover{background-color:#F5F5F5;}



table {
	border-top: 1px solid darkgrey!important;
}

.formHead{
	padding-top:10px!important;
	padding-bottom:10px!important;
	background-color:#DDDEDF;!important;
	font-weight:bold;
}




.qFields{
	padding-left:5px;
	padding-right:5px;
	border-bottom-width:1px;
	border-bottom-style:solid;
	border-bottom-color:#E8E8E8;
}


/* articles */
.articles{
   display:flex;
   flex-wrap:wrap;
   gap:50px;
   justify-content:center;
}

.article{
	position:relative;
    width:350px; height:350px;
	background-color:#FFFFFF;
	border-radius:10px;
	padding-bottom:15px;
	transition:transform 0.25s;
}


.article:hover{
	transform:scale(1.02);
}


.articlesAvatar{
	position:absolute; top:-15px; right:-15px; width:50px; border:#FFFFFF solid 2px; border-radius:50%; z-index:5;
}


.articlesContainer{
	height:100%; width:100%; font-size:16px; text-align:left; cursor:pointer; overflow:hidden; text-overflow:ellipsis;
}


.articlesImage{
	width:100%; height:160px; object-fit:cover; border-top-left-radius:10px; border-top-right-radius:10px;
}


.articlesHeadline{
	padding-top:5px; padding-left:10px; padding-right:30px; padding-bottom:10px; border-top-left-radius:10px; 
	font-family:'Trade Gothic LT Com Cn'; font-size:20px; line-height:1.1;
}

.articlesContent{
	top:130px; height:160px; font-size:14px; margin-left:10px; margin-right:10px; line-height:1.2; 
}
/* articles */


@media (max-width: 576px){
	.article{
    width:100%;
	}
	
	.metaRow{
		display:block;
	}
	
	.metaTitle{
		text-align:left;
		margin-top:10px;
	}
}	




