.tb-sum table {
    width: 100%;
    max-width: 400px;
    margin-bottom: 20pt;
}

.tb-sum-wrap {
    display: inline-block;
    vertical-align: top;
    margin: 0px 15px 0px 0px;
    width: 100%;
    max-width: 291px;
}

.tb-sum table * {
    font-family: 'TRUELight';
    font-size: 15pt;
    text-align: center;
}

.tb-sum td.tb-sum-body , .tb-sum td.tb-sum-head {
    border: 1px solid #ddd;
}

td.tb-sum-topic {
    text-align: left;
    font-weight: bold;
    font-size: 14pt;
    color: #333334;
    vertical-align: bottom;
}

td.tb-sum-topic span {
    font-size: 13pt;
}

td.tb-sum-head {
    background-color: #75bd99;
    font-weight: bold;
    font-size: 17pt;
    color: #01234e;
    letter-spacing: 1;
    padding: 3px;
}

td.tb-sum-body {
    font-size: 30pt;
    color: green;
}

.lcn {
    line-height: 1.3 !important;
}
html,body { background: white !important; }
.print-icon {
cursor: pointer;
    background-color: purple;
    width: 35px;
    padding: 5px;
    border-radius: 50px;
    box-shadow: 0 2px 0px rgba(0,0,0,0.25), 0 3px 0px rgba(0,0,0,0.22);
    display: block;
    margin-bottom: 10px;
}

a.dlink {
    color: #0064ab;
    font-size: 15pt;
    font-weight: bold;
    text-decoration: none;
    line-height: 1.5;
}

.print-icon-section {
      top: -3px;
    margin: 130px 20 0 30px;
    position: fixed;
}
a.btt-logoff-bottom {
  color: #e86000 !important;
}
@media screen and (max-width:1060px) {
.print-icon-section {
    right: 0px;
    z-index: 99 !important;
}
}
a, a:visited {
    color: #444;
}
img.print-doc {
background-color: purple;
    width: 22px;
    padding: 2px 0px;
    border-radius: 5px;
    margin-left: 10px;
    box-shadow: 0 2px 0px rgba(0,0,0,0.25), 0 3px 0px rgba(0,0,0,0.22);
}
.spotlist_Checkbox {
    font-size: 15pt !important;
  font-weight: bold;
    vertical-align: top;
    margin-top: 5px;
}

.spotlist_CaptionText input[type="checkbox"],
.spotlist_Checkbox input[type="checkbox"] {
    margin: initial;
    position: initial;
    opacity: 1;
    width: 15px;
    height: 15px;
    vertical-align: top;
    margin-top: 5px;
    margin-right: 5px;
}

.header .ctl-title {
    font-size: 20pt;
}

.header .ctl-desc {
    font-size: 16pt;
}
.dts-ctl.sub-block {
    padding: 10px 10px;
    background-color: #e6f2f9;
}
@media screen and (max-width:375px) {
  .block-3.header {
  padding-left: 0px !important; 
}
  	.header .ctl-title {
		font-size: 18pt !important;
	}

	.header .ctl-desc {
		font-size: 14pt !important;
	}	
}



/* ------------ not allow click --------------------- */
.nc {
  pointer-events: none;
  cursor: pointer;
}
input[type="text"].ctl-textbox {
    padding: 10px !important;
}

.dp-ib { display: inline-block; }
/* ------------ allow click --------------------- */
.ac {
  cursor: pointer;
}
div.btn-title {
    display: block;
    font-size: 14pt;
    letter-spacing: 0.7;
    line-height: 0.5;
    text-decoration: none;
}
div.box-title {
  display: block;
    font-weight: bold;
    font-size: 18pt;
    line-height: 1;
    letter-spacing: 0.7;
}
div.box-desc {
    font-weight: bold;
}

.paper-like {
    padding: 20px !important;
    max-width: 1100px !important;
    border: 1px solid #c5c5c5;
      font-size: 16pt;
    color: black;
}
@media screen and (min-width:640px) {
.paper-like {
  padding: 20px 40px !important; 
}
}

div.title {
    font-size: 24pt;
    margin: 10px 10px 0px;
}

.paper-top-head {
    display: inline-block;
    vertical-align: top;
}

.dts-ctl {
    vertical-align: top;
	padding: 10px 0px;
}

.ctl-caption, .ctl-val {
    display: inline-block;
    vertical-align: top;  
}

.ctl-caption {
	padding-right: 20px;
}

.ctl-textbox {
    width: 100%;
    padding: 10px;
    box-sizing: border-box;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px;
    outline: none;
    border: 1px solid #eaeaea;
    border-bottom: 2px solid #b7b7b7;
    min-width: 320px;
}

.dp-b { display: block; }
.ctl-title {
    color: #202124;
    font-weight: bold;
    letter-spacing: 0.7;
    padding-top: 8px;
}

.ctl-textbox:focus {
    border-bottom: 2px solid green;
    transition: all 0.2s ease-in;
  background-color: #f1fff1;
}

.ctl-desc {
    margin-bottom: 5px;
}

.ctl-select {
    width: 100%;
    padding: 10px;
    box-sizing: border-box;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px;
    outline: none;
    border: 1px solid #eaeaea;
    min-width: 320px;
    margin-bottom: 5px;
}

.ctl-remark {
    color: #0279bb;
    font-size: 12pt;
    font-weight: bold;
    letter-spacing: 0.7;
}
span.btn-title.num-title {
    font-size: 33pt !important;
    display: inline-block;
    font-weight: normal;
}
a.dts-btn {
    display: inline-block;
    padding: 15px 15px 10px;
    background-color: #efefef;
    text-decoration: none; margin-right: 5px;
}

.black-bg, a.black-bg {
    background-color: black;
    color: white;
    border-radius: 5px;
    box-shadow: 0 0px 1px rgba(0,0,0,0.25), 0 5px 5px rgba(0,0,0,0.22);
}

.green-bg, a.green-bg {
    background-color: #21a721;
    color: white;
      border-radius: 5px;
    box-shadow: 0 0px 1px rgba(0,0,0,0.25), 0 5px 5px rgba(0,0,0,0.22);
}

.orange-bg, a.orange-bg {
    background-color: #ea7200;
    color: white;
}

.black-2-bg, a.black-2-bg {
    background-color: #4a4a4a !important;
}

.btn-submit-bg, a.btn-submit-bg {
    background-color: #0047dc;
}

span.btn-title {
    display: block;
    font-size: 14pt;
    letter-spacing: 0.7;
    line-height: 0.5; text-decoration: none;
}

span.btn-desc {
    font-size: 11pt;
    letter-spacing: 0.7; text-decoration: none;
}

a:hover {
    text-decoration: none !important;
}

a .page-no {
    color: black;
    font-weight: bold;
    line-height: 0.5;
    padding-bottom: 5px;
    display: inline-block;
}

.page-bg, a.page-bg {
    background-color: #e5f3fb;
    color: black;
}

.dts-btn.active {
    background-color: #63bbec;
      pointer-events: none;
}

.sub-btn-bg, a.sub-btn-bg {
    background-color: #7eabbf;
    color: white;
    padding: 10px 15px 3px;
    margin-top: 10px;
      border-radius: 5px;
    box-shadow: 0 0px 1px rgba(0,0,0,0.25), 0 5px 5px rgba(0,0,0,0.22);
}

.qq-gallery.qq-uploader {
    max-height: initial !important;
    border: none !important;
    background-color: white !important;
    padding: 20px 0px !important;
      min-height: initial !important;
}
.qq-gallery .qq-total-progress-bar { display: none !important; }
.qq-uploader-selector.qq-uploader.qq-gallery {
    padding: 0px !important;
    border-radius: 0px;
}

.qq-gallery.qq-uploader:before {
    font-size: 10pt !important;
}

.qq-gallery .qq-total-progress-bar-container {
    margin-left: 0px !important;
    float: initial !important;
    width: 100px !important;
    white-space: nowrap !important;
}

li.qq-file-id-0.qq-upload-success {
    margin: 0px !important;;
}

.qq-gallery .qq-upload-list li.qq-upload-success {
    background-color: white !important;;
}

.form-label { padding: 0px !important; }
.qq-gallery .qq-upload-size { font-size: 11pt !Important; color: black !important; }

.ctl-inner-form {
    background: #e9f4f9;
    padding: 10px 20px;
}

.form-col { padding: 0px !important; margin: 0px !important; }
.container .ctl-desc {
    display: block !important;
    font-family: TrueLight,'TRUELightIE',Leelawadee,Arial, sans-serif !important;
}

@media screen and (max-width:375px) {
  .ctl-textbox, .ctl-select {
      min-width: 300px;
  } 
}

.selectedComp {
    color: #ea7200 !important;
    font-weight: bold !important;
    letter-spacing: 0.7 !important;
}

span.k-label {
    font-size: 15pt !important;
}

.k-draghandle { background-color: #f35800 !important; }
.page-desc { display: inline-block; }
.vt * { vertical-align:top;}

.page-section .btn-desc {
    position: relative;
    top: 5px;
}

.page-bg .btn-title {
    font-size: 16pt !important;
    font-weight: bold;
    line-height: 0.5;
}

span.btn-desc {
    font-size: 11pt;
    letter-spacing: 0.7;
    text-decoration: none;
}

    .page-bg, a.page-bg {
        color: black;
        padding: 15px;
        line-height: 0.5;
        margin-right: 0px;
       padding-top: 12px;
    }

a.banner-icon {
    padding: 10px 40px !important;
    display: inline-block;
}

a.banner-icon span {
    display: block;
}

span.lnk-group {
    text-align: left;
    white-space: nowrap;
}

span.lnk-ico-title, div.lnk-ico-title {
    font-family: TrueLight,'TRUELightIE',Leelawadee,Arial, sans-serif;
    font-weight: bold;
    font-size: 15pt;
    letter-spacing: 0.7;
  display: inline-block;
}

span.lnk-ico-title-en {
    font-family: TrueLight,'TRUELightIE',Leelawadee,Arial, sans-serif;
    font-size: 13pt;
    letter-spacing: 0.7;
}

.icon-2 {
     vertical-align: top;
     display: inline-block;
     margin: 10px;
}
 h1.title {
     font-size: 23pt;
     margin: 10px;
}
 span.title-number {
     font-size: 32pt;
     line-height: 0;
     color: green;
}
 .block-3 {
     padding: 30px 15px;
}
 h1.title {
     font-size: 24pt;
     margin: 10px 10px 0px;
}
 .banner-desc {
     font-size: 17pt;
     padding: 0px 10px 3px;
     font-weight: bold;
}
 a.btn-submit {
     text-decoration: none;
     font-size: 18pt;
     line-height: 0.8;
     letter-spacing: 0.8;
}
 a.banner-icon {
     padding: 20px 40px;
     display: inline-block;
}
 a.banner-icon img {
     width: 100%;
     max-width: 60px;
}
 a.banner-icon:hover {
     background-color: rgba(255, 255, 255, 0.8) !important;
}
 a.banner-icon:hover {
     background-color: rgba(255, 255, 255, 0.8) !important;
}

.checkmark {
    position: absolute;
    top: 0;
    left: 0px;
    height: 20px;
    width: 20px;
    background-color: #c7c7c7;
    border-radius: 50%;
}

.prg-txt.radSelectRole {
    text-align: left;
}

.prg-txt.container {
    padding-bottom: 5px;
    display: inline-block;
    position: relative;
    padding-left: 35px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.prg-txt.container-en {
    font-weight: normal;
    padding-bottom: 5px;
    display: inline-block;
    position: relative;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.ctl-val input[type="radio"], input[type="checkbox"] {
    margin: 1px 0 0;
    position: absolute;
    opacity: 0;
    cursor: pointer;
}
.container input:checked ~ .checkmark:after {
    display: block;
}
.container .checkmark:after {
    top: 6px;
    left: 6px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: white;
}
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}
.ctl-caption.sub-section-header {
    background-color: #a2bbb3;
    padding: 0px 20px;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    margin-top: 20px;
    margin-bottom: 15px;
}
.container input:checked ~ .checkmark {
    background-color: #2196F3;
}
/*
 @media screen and (min-width: 480px) {
     #banner-box {
         margin-right: 280px;
    }
}
*/
 @media screen and (min-width: 640px) {
     #banner-box {
             margin-right: 100px;
    margin-left: 100px;
    margin-right: 0px;
    }
}
/*
 @media screen and (min-width: 1000px) {
     #banner-box {
         margin-right: 480px;
    }
}
 @media screen and (min-width: 1500px) {
     #banner-box {
         margin-right: 800px;
    }
}
*/
 .btn-lang.active {
     color: green;
     border: 1px solid gray;
}
 .btn-lang {
     display: inline-block;
     font-size: 16pt;
     font-weight: bold;
     border: 1px solid #e7e7e7;
     padding: 3px 5px;
     vertical-align: top;
	 cursor: pointer;
}

@media screen and (max-width: 1100px) {
    a.banner-icon img {
       max-width: 40px;
    }
    a.banner-icon {
        padding: 10px 30px !important;
    }
    .inno-logo {
		padding-left: 0px !important; 
    }
	.if-detail {
		padding: 0px;
	}
}

@media screen and (max-width: 700px) {
    #div-icon-menu.block-3 {
        padding: 10px !important;
    }
}

@media screen and (max-width: 640px) {
    .page-desc {
        display: none;
    }
  .page-bg, a.page-bg { padding: 10px !important; }
    .page-bg .btn-title {
    font-size: 16pt !important;
    font-weight: bold;
    line-height: 0.5;
}
}

@media screen and (max-width: 414px) {
    #banner-box {
        text-align: center !important;       
    }
    #div-submit {
        margin:0px !important;
        margin-bottom: 20px !important;
    }
    #cover-banner {
        background-position: top left !important;
    }
  	.inno-logo {
		padding-right: 0px !important;
	}
	.fix-menu-s { padding-left: 0px !important; }
	.div-lang { margin-left: 0px !important;}
}

.inner-gray-bg {
    padding: 10px;
    background-color: #e2e2e2;
}

.dts-ctl.inner-gray-bg .ctl-caption {
    min-width: 235px;
}

.section-inner .ctl-textbox {
    min-width: 80px;
    max-width: 99px;
    margin-right: 5px;
    margin-bottom: 5;
}

.rst-icon {
    display: inline-block;
    width: 30px;
    height: 30px;
    background-image: url(/portals/0/icons/icon_collapse.png);
    background-size: cover;
}
.if-detail {
    font-size: 20pt;
    letter-spacing: 0.7;
    line-height: 0.9;
	padding: 0px 20px;
}
.rst-number {
    font-size: 35pt;
    font-weight: normal;
    line-height: 0.5;
    background-color: #ddecf3;
    color: #b6c9d2;
    padding: 14px 14px;
}

.block-3-sub-head {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    border-bottom: 1px solid #e6e6e6;
    background-color: #b6c9d2;
    font-weight: bold;
    font-size: 14pt;
    letter-spacing: 0.7;
  cursor: pointer;
}

.ctl-mini-block {
    display: inline-block;
}

.inno-header-left {
    width: 30%;
    background-color: #355786;
}

.inno-header-right {
    width: 70%;
}

@media screen and (max-width:680px) {
	.inno-header-left {
		width: 100%;
		background-color:rgba(53, 87, 134, 0.8);
		z-index: 2;
	}	
	.inno-header-right {
		position: absolute;
    	height: 100%;
    	width: 100%;
	}
  .black-2-bg, a.black-2-bg {
    background-color:  rgba(74, 74, 74, 0.5) !important;
}
}

@media screen and (max-width: 640px) {
.if-detail {
    padding: 0px !important;
}
}

.form-list-IsLeaderID,
.form-list-EmployeeBUID,
.form-list-LastName,
.form-list-FirstName {
    display: none;
}

#divMember {
	padding: 1px 20px !important;
}

.form-list-MemberName {
	width: 100%;
	display:inline-block;
	color: #202124;
	letter-spacing: 0.7;
	font-size: 20pt;
	padding-top: 8px;
}

.form-list-IsLeader {
	color:green;
	line-height:1;
}

.form-list-item {
	border-bottom: 1px solid #e7e7e7;
	padding-bottom: 15px;
	padding-top: 10px;
	max-width: 500px;
}

.form-list-button {
	float:right;
}

.infosec {
    font-family: TrueLight,'TRUELightIE',Leelawadee,Arial, sans-serif;
    font-size: 17pt;
    letter-spacing: 0.8;
}

.info-box {
    display: inline-block;
    white-space: initial;
    text-indent: 0px;
}

.info-bn {
    text-align: center;
    display: inline-block;
    width: 100%;
    background: #1a1c20;
    margin-bottom: 30px;
}

.info-box img {
    width: 100%;
    display: inline-block;
}

.info-head {
    display: block;
    margin: 20px 0px;
}

.info-dt {
    display: inline-block;
    white-space: initial;
    padding-bottom: 30px;
}

.info-bg {
    background: url(/portals/0/images/history/aboutbg.png);
    background-size: cover;
    background-position: bottom;
    background-repeat: no-repeat;
    padding: 20px;
}

.info-list {
    list-style: circle;
    margin-left: 20px;
}
.c-link {
    border-top: 1px dashed #bfb5b5;
    background-color: #f1f1f1;
    padding: 2px 5px;
    text-align: right;
    box-shadow: 0 0px 1px rgba(0,0,0,0.25), 0 2px 4px rgba(0,0,0,0.22);
    vertical-align: top;
}

.c-link span {
    color: green;
    font-weight: bold;
    font-size: 15pt;
}

.c-name {
    display: inline-block;
    width: 60%;
    font-weight: bold;
    font-size: 15pt;
}

.c-pos {
    display: inline-block;
    font-size: 15pt;
}

.info-g-box {
    display: inline-block;
    width: 28%;
    border-radius: 5px;
    text-align: center;
    color: black;
    line-height: 1;
    margin-right: 0px;
    padding: 15px;
}

span.n-val {
    font-size: 41pt;
}

span.n-desc {
    display: block;
    line-height: 1;
    font-size: 14pt;
}

.paper-list {
    white-space: nowrap;
    padding: 20px 40px;
      border-bottom: 1px dashed #e7e7e7;
}

.paper-list * {
    display: inline-block;
    vertical-align: top;
    letter-spacing: 0.7;
    line-height: 1;
}

.paper-no {
    font-weight: bold;
    color: gray;
    margin-right: 8px;
    font-size: 40pt;
    line-height: 1;
}

.paper-col {
    margin-top: 10px;
    white-space: initial;
}

.paper-col * {
    white-space: initial;
}

.paper-title {
    font-weight: bold;
    font-size: 20pt;
}

.paper-group {
    display: inline-block;
    padding-top: 8px;
}

.paper-code {
    display: inline-block;
}

.paper-summary {
    margin-top: 13px;
      width: 90%;
}

.css-eco {
    color: #0089ff;
}

.css-tech {
    color: #e4028a;
}
.css-ENV {
    color: #35aa33;
}
.css-soc {
      color: #009828;
}

@media screen and (max-width: 410px) {
  .paper-list {
    padding: 20px;
}
}

.act-btn, a.act-btn {
    color: white;
    border-radius: 5px;
    padding: 3px 15px;
    margin-top: 10px;
    margin-right: 10px;
    box-shadow: 0 0px 1px rgba(0,0,0,0.25), 0 5px 5px rgba(0,0,0,0.22);
}

img.btn-icon {
    width: 24px;
}

.mgr-h-500 {
  margin-right: 50px; 
}

@media screen and (max-width: 500px) {
.mgr-h-500 {
     margin-right: 0px; 
}
}

.i-dp-n{
  	display : none;
}

.act-box {
    border: 1px solid #e9e9e9;
    border-radius: 5px;
    padding: 10px;
    margin-top: 5px;
}

.act-ActivityID, .act-Multiply {
    display: none;
}
.act-Beneficiaries {
    background-color: #f95874;
    display: inline;
    color: white;
    padding: 0px 15px;
    line-height: 1;
    border-radius: 3px;
}
.act-delete {
    display: inline-block;
    float: right;
}
.act-delete img {
    width: 24px;
    position: relative;
    top: -4px;
    cursor: pointer;
}
.act-Activities, .act-Others {
    font-weight: bold;
    color: #007784;
    letter-spacing: 0.8px;
    font-size: 15pt;
    margin-top: 5px;
}
.act-Number {
    color: #007784;
    font-size: 15pt;
    display: inline-block;
}
.act-desc {
    font-size: 15pt;
    display: inline-block;
    color: #bbbbbb;
    margin-right: 10px;
}
.act-Cost2017, .act-Cost2018, .act-Cost2019, .act-sep {
    display: inline-block;
}
.act-sep {
    margin: 0px 3px;
}


.claysModuleBorder input {
    opacity: 1;
}
.claysModuleBorder input {
    opacity: 1;
}

.pos-title {
    font-size: 23pt;
    margin: 70px 0px 10px 0px;
}
.box-person {
    display: inline-block;
    vertical-align: top;
    min-width: 160px;
    margin-top: 30px;
}
.img-div {
    display: inline-block;
    width: 100px;
    height: 100px;
    overflow: hidden;
    border-radius: 50px;
}
img.img-person {
    width: 100%;
}
.name-person {
    font-weight: bold;
    font-size: 14pt;
    letter-spacing: 1px;
    margin-top: 8px;
}
.pos-person {
    font-weight: bold;
    font-size: 13pt;
    letter-spacing: 1px;
}

.inno-define {
    white-space: nowrap;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    box-sizing: border-box;
    padding: 50px 10px;
    border-bottom: 1px solid #d2d2d2;
}

.inno-define div {
    display: inline-block;
    vertical-align: top;
    text-align: left;
    white-space: normal;
}

.inno-define img {
    width: 250px;
    max-width: 90%;
}

.inno-o-left, .inno-e-right, .inno-o-right, .inno-e-left {
    max-width: 50%;
}

.inno-define .box-title {
    font-size: 20pt;
    color: green;
}

.inno-define .box-desc {
    font-size: 17pt;
    font-weight: normal;
    letter-spacing: 0.8px;
    line-height: 1;
}


@media screen and (max-width:540px) {
	.inno-define { 
		display: table; 
	}

	.inno-o-left,
	.inno-e-right {
		display: table-header-group !important;
	}

	.inno-o-right,
	.inno-e-left {
		display: table-footer-group !important;
	}

	.inno-define div {
		display: block;
		width: 100%;
		max-width: 100%;
		text-align: center;
	}

	.inno-define img {
		width: 100%;
		margin-bottom: 10px
	}

}

.ctl-title.ctl-pt {
    padding-top: 25px;
}
.div-year {
    display: inline-block;
    vertical-align: top;
}
.lbl-year {
    font-size: 13pt;
    font-weight: bold;
    letter-spacing: 0.8px;
    color: #7d1d0e;
      text-align: center;
}
.ctl-percent{
 	font-size: 15pt;
 	 font-weight: bold;
  	padding: 0px 0px 0px 10px; 
}
.print-detail.norequired-th{
    color: red;
    font-weight: bold;
    display: none;
}
.print-detail.norequired-en {
      color: red;
  display: none;
}


.box-desc.lcn {
    font-size: 14pt;
}
.dp-ib.lcn {
    font-size: 20pt;
}

span.lnk-ico-title, span.lnk-ico-title-en {
    text-align: center;
}

div[lang="cn"],
option[lang="cn"],
span[lang="cn"],
a[lang="cn"],
b[lang="cn"]{
    display: none;
}


.sw-lang-m {display: inline-block; }
.sw-lang-pc {display: none;}

@media screen and (min-width: 800px) {
.sw-lang-m {display: none; }
.sw-lang-pc {display: inline-block;}
}


.bs-example {
    display: inline-block;
    margin: 0px !important;
}

.vid-box {
    display: inline-block;
    width: 100%;
    max-width: 350px;
    vertical-align: top;
}

a.btn.btn-lg.btn-primary {
    display: inline-block;
    width: 100%;
    border: none;
    background: none;
}

img.vidCover {
    width: 100%;
}

.vid-box p {
    font-family: Prompt,sans-serif;
    letter-spacing: 0px;
    text-align: left;
    font-size: 12pt;
    padding: 10px 0px;
    color: black;
    white-space: normal;
    line-height: 1.4;
}

span.sdate {
    display: block;
    font-size: 9pt;
    color: gray;
}

.playico {
    position: absolute;
    top: 38%;
    left: 50%;
    transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    margin: 0px auto;
    background-color: rgba(255, 255, 255, 0.8);
    padding: 10px;
    border-radius: 50px;
    text-align: center;
    width: 50px;
    cursor: pointer;
    height: 50px;
}

.playico img {
    width: 19px;
    position: relative;
    left: 3px;
    top: 2px;
}

.modal-backdrop.fade.in {
    display: none;
}

.modal-content {
    background: none;
    box-shadow: none;
    border: none;
}

.modal-header {
    background: none;
    border: none;
    height: 0px;
}

button.close {
    color: #ba2828;
    opacity: 1;
    font-size: 39pt;
    padding-left: 5px;
    position: absolute;
    top: -15px;
    right: 0px;
}

.vid-box span {
    display: block;
    color: black;
    text-align: left;
    font-weight: bold;
    letter-spacing: 1;
    white-space: normal;
    line-height: 0.8;
    margin-top: 5px;
}


.vid-box {
	max-width: 340px;
}
.vid-main-block {
	text-align: left;
}

table.box-com {
    margin: 10px 10px 0px 0px;
    display: inline-block;
    vertical-align: top;
}

td.box-l {
    overflow: hidden;
}

table.box-com td {
    padding: 7px 8px 10px 8px;
}


.exam-box {
    border: 1px solid #afafaf;
    border-radius: 2px;
    padding: 10px 14px;
    display: inline-block;
    margin-top: 10px;
    text-align: center;
    margin-right: 10px;
}

.ename {
    display: block;
    font-weight: bold;
    font-size: 21pt;
}

.estatus {
    padding: 5px;
    display: inline-block;
    width: 30px;
    height: 30px;
    background-color: #dcdcdc;
    margin-bottom: 10px;
    border-radius: 24px;
}

.ebutton {
    display: block;
}

.ebutton a {
    display: inline-block;
    color: white;
    background-color: #0071bc;
    padding: 3px 21px 10px;
    border-radius: 21px;
    box-shadow: 2px 3px 5px grey;
}

span.b-edesc {
    display: block;
    position: relative;
    top: 0px;
    line-height: 0.5;
    font-size: 13pt;
}


@media screen and (max-width: 1110px) {
	.vid-box {
		max-width: 295px;
	}
	.vid-main-block {
		max-width: 910px;
		margin: 0px auto;
	}
}

@media screen and (max-width: 980px) {
	.vid-box {
		max-width: 295px;
	}
	.vid-main-block {
		max-width: 600px;
	}
}

@media screen and (max-width: 768px) {
	.dp-b-w-s {
		display: block !important;
	}
}

@media screen and (max-width: 680px) {
	.vid-box {
		max-width: 250px;
	}
	.vid-main-block {
		max-width: 510px;
	}
}

@media screen and (max-width: 555px) {
	.vid-box {
		max-width: initial;
	}

}

.estatus.checked {
    background-color: white;
    background-image: url(/portals/0/icons/check.png);
    background-size: cover;
    background-position: center;
}

 div#txtKeyWordnameautocomplete-list > div {
     padding: 5px 10px;
}
 div#txtKeyWordnameautocomplete-list > div:hover {
     background-color: #52d864;
     cursor: pointer;
}

.copyright { padding: 15px 10px !important; }


.dnnModuleItem > span.title {
    font-size: 14pt;
    font-weight: bold;
    white-space: initial;
}

a.banner-icon {
    text-align: center;
}

.course-name {
    font-size: 1.3em;
    font-weight: bold;
    margin: 8px 0px 5px;
    line-height: 1.2;
}

.confined-space {
    background-color: gray;
}

.header {padding-top: 15px;padding-bottom: 15px;}

.header .course-name {
    font-size: 1rem;
}

.form-label.content {
    font-size: 1.237em;
    line-height: 1.25;
    white-space: pre-wrap;
    white-space: pre-line;
    margin-top: .5rem;
}

.form-label.remark {
    color: #cd411f;
    font-weight: bold;
    letter-spacing: .5px;
}

.block-vdo {
    display: inline-block;
    width: 23.5%;
    vertical-align: top;
    margin-right: 10px;
}

.block-vdo:first-child {
    width: 100%;
    padding-right: 10px;
    margin-top: 15pt;
}

.vdo-title {
    font-size: 0.8rem;
    margin: 10px 0px 25px;
}

@media (max-width: 1200px) {
	.block-vdo {
		display: inline-block;
		width: 31.5%;
	}
}


@media (max-width: 768px) {
	.block-vdo {
		display: inline-block;
		width: 100%;
	}
	.vdo-title {
		font-size: 1rem;
		margin: 10px 0px 25px;
	}
	.block-vdo:first-child {
		padding-right: 0px;
	}
}

.dts-sd-ft {
    background-color: #2e3192 !important;
}