@charset "utf-8"; html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none;} table { border-collapse: collapse; border-spacing: 0; }  @font-face { font-family: "iranyekan"; src: url('../../includes/fonts/IRANYekan/iranyekanweblightfanum.eot'); src: url('../../includes/fonts/IRANYekan/iranyekanweblightfanum.eot#iefix') format('embedded-opentype'),  url('../../includes/fonts/IRANYekan/iranyekanweblightfanum.woff') format('woff'),  url('../../includes/fonts/IRANYekan/iranyekanweblightfanum.ttf') format('truetype'); font-weight: 300; font-style: normal; } @font-face { font-family: "iranyekan"; src: url('../../includes/fonts/IRANYekan/iranyekanwebregularfanum.eot'); src: url('../../includes/fonts/IRANYekan/iranyekanwebregularfanum.eot#iefix') format('embedded-opentype'),  url('../../includes/fonts/IRANYekan/iranyekanwebregularfanum.woff') format('woff'),  url('../../includes/fonts/IRANYekan/iranyekanwebregularfanum.ttf') format('truetype'); font-weight: normal; font-style: normal; } @font-face { font-family: "iranyekan"; src: url('../../includes/fonts/IRANYekan/iranyekanwebmediumfanum.eot'); src: url('../../includes/fonts/IRANYekan/iranyekanwebmediumfanum.eot#iefix') format('embedded-opentype'),  url('../../includes/fonts/IRANYekan/iranyekanwebmediumfanum.woff') format('woff'),  url('../../includes/fonts/IRANYekan/iranyekanwebmediumfanum.ttf') format('truetype'); font-weight: 500; font-style: normal; } @font-face { font-family: "iranyekan"; src: url('../../includes/fonts/IRANYekan/iranyekanwebboldfanum.eot'); src: url('../../includes/fonts/IRANYekan/iranyekanwebboldfanum.eot#iefix') format('embedded-opentype'),  url('../../includes/fonts/IRANYekan/iranyekanwebboldfanum.woff') format('woff'),  url('../../includes/fonts/IRANYekan/iranyekanwebboldfanum.ttf') format('truetype'); font-weight: bold; font-style: normal; } @font-face { font-family: "iranyekan"; src: url('../../includes/fonts/IRANYekan/iranyekanwebextraboldfanum.eot'); src: url('../../includes/fonts/IRANYekan/iranyekanwebextraboldfanum.eot#iefix') format('embedded-opentype'),  url('../../includes/fonts/IRANYekan/iranyekanwebextraboldfanum.woff') format('woff'),  url('../../includes/fonts/IRANYekan/iranyekanwebextraboldfanum.ttf') format('truetype'); font-weight: 800; font-style: normal; } @font-face { font-family: "iranyekan"; src: url('../../includes/fonts/IRANYekan/iranyekanwebblackfanum.eot'); src: url('../../includes/fonts/IRANYekan/iranyekanwebblackfanum.eot#iefix') format('embedded-opentype'),  url('../../includes/fonts/IRANYekan/iranyekanwebblackfanum.woff') format('woff'),  url('../../includes/fonts/IRANYekan/iranyekanwebblackfanum.ttf') format('truetype'); font-weight: 850; font-style: normal; } @font-face { font-family: "iranyekan"; src: url('../../includes/fonts/IRANYekan/iranyekanwebextrablackfanum.eot'); src: url('../../includes/fonts/IRANYekan/iranyekanwebextrablackfanum.eot#iefix') format('embedded-opentype'),  url('../../includes/fonts/IRANYekan/iranyekanwebextrablackfanum.woff') format('woff'),  url('../../includes/fonts/IRANYekan/iranyekanwebextrablackfanum.ttf') format('truetype'); font-weight: 900; font-style: normal; } @font-face { font-family: 'fontello'; src: url('../../includes/fonts/fontello_13/fontello.eot'); src: url('../../includes/fonts/fontello_13/fontello.eot#iefix') format('embedded-opentype'),  url('../../includes/fonts/fontello_13/fontello.woff2') format('woff2'),  url('../../includes/fonts/fontello_13/fontello.woff') format('woff'),  url('../../includes/fonts/fontello_13/fontello.ttf') format('truetype'),  url('../../includes/fonts/fontello_13/fontello.svg#fontello') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: "iranyekanEN"; src: url('../../includes/fonts/IRANYekan/en/IRANYekanWebRegular.eot'); src: url('../../includes/fonts/IRANYekan/en/IRANYekanWebRegular.eot#iefix') format('embedded-opentype'),  url('../../includes/fonts/IRANYekan/en/IRANYekanWebRegular.woff') format('woff'),  url('../../includes/fonts/IRANYekan/en/IRANYekanWebRegular.ttf') format('truetype'); font-weight: normal; font-style: normal; } .DIR_1 { direction: rtl; } .DIR_2 { direction: ltr; } .DIR_1 * { font-family: iranyekan; font-size: 14px; } .DIR_2 * { font-family: iranyekanEN; font-size: 14px; } noscript { position: fixed; width: 100%; height: 100%; color: #FFF; background: #993333; text-align: center; padding: 10px; z-index: 999; } body { background: #363f45; } strong, b { font-weight: bold; } hr { border:0; border-top: 1px solid #002248; } input, select, textarea { border: 1px solid #cacaca; border-radius: 4px; color: #002248; width: 100%; height: 35px; line-height: 35px !important; padding: 0 5px; box-sizing : border-box; } select option:disabled { color:#999; } textarea { height: 100px; } input:focus, select:focus, textarea:focus { } input.chechsize { width: 15px; height: 15px; border: none; vertical-align: middle; } input.size1, select.size1 { width: 65px; height: 35px; line-height: 35px !important; } input.size2, select.size2 { width: 150px; height: 35px; line-height: 35px !important; } input[type="submit"] { width: 154px; } input.size3, select.size3 { width: 350px; height: 35px; line-height: 35px !important; } textarea.size3 { width: 350px; height: 250px; line-height: 35px !important; } .tableForm { width: 80%; } .tableForm .Star { color: #cb5d37; font-weight: bold; } .tableForm .header { background:#CCC; padding:5px; } .tableForm .header .multi { color: #666; font-size: 14px; } .btn1 { color: #FFF; background: #d52b1e; border: 1px solid #000; height: 40px !important; line-height: 40px !important; transition:all 0.5s; } .btn1:hover { color: #FFF; background: #640017; border: 1px solid #640017; cursor: pointer; } a { color: #0066CC; text-decoration: none; } a:hover { color: #cb5d37; } .rutitr { font-size: 14px; color: #999; } .Title, a.Title { color: #000; } a.Title:hover { color: #cb5d37; } .PicSmall { width: 90px;  border: 1px solid #005383; } .Abstract, .Abstract p, .Abstract span { font-size: 14px; line-height: 15px; color: #675b40; } .Line { width: 100%; height: 1px; background: #2980b9; line-height: 1px; } .DivTags { min-height: 35px; overflow: hidden; margin-top: 10px; } .DivShare { height: 30px; overflow: hidden; margin-top: 10px; } .DivShare .IcnShare { width: 30px; height: 30px; display: inline-block; margin: 0 2px; vertical-align: middle; background-color: #fff; background-size: cover; } .DivShare .IcnShare.facebook { background-image: url(images/Share/facebook.png); } .DivShare .IcnShare.gmail { background-image: url(images/Share/gmail.png); } .DivShare .IcnShare.googleplus { background-image: url(images/Share/googleplus.png); } .DivShare .IcnShare.telegram { background-image: url(images/Share/telegram.png); } .DivShare .IcnShare.twitter { background-image: url(images/Share/twitter.png); } .DivShare .IcnShare.yahoo { background-image: url(images/Share/yahoo.png); } .DivShare .IcnShare.bale { background-image: url(images/Share/bale.png); } .DivShare .IcnShare.eitaa { background-image: url(images/Share/eitaa.png); } .DivShare .IcnShare.igap { background-image: url(images/Share/igap.png); } .DivShare .IcnShare.soroush { background-image: url(images/Share/soroush.png); } .DivComments { margin-top:30px; } .DivComment { padding:20px; color:#666; } .DivCommentTitle { border-bottom: 1px solid #468AC7; text-align:left; font-size:16px; } .DivCommentDesc { background:#fdfdfd; padding:20px; box-shadow: 1px 1px 6px 0px rgba(0, 0, 0, 0.15); } .AnswerBox { color:#468AC7; border-right: 4px solid #468AC7; margin-top: 20px; margin-right: 20px; padding:0 10px; line-height: 20px; } .Bull { display: inline-block; width: 10px; height: 10px; background: url(images/Bull.png) no-repeat center; } .ContentImageLarge { width: calc(100% - 2px) !important; padding: 0px; background: #fff; border: 1px solid #207abc; border-radius: 10px; } .ContentImage { padding: 0px; background: #fff; border: 1px solid #207abc; border-radius: 10px; } .BoxImage {  background: rgba(241, 246, 255, 0.2);  border: 1px solid #B3DCEA;  border-radius: 3px;  text-align: right; padding: 5px; position: relative; } .BoxImage:after {  content: ''; display: block; clear: both; } .BoxImage img { margin: 5px; } .ContentAbstract { } .DivContent { padding-top:40px; } .LinksImage { border: 0px; width: 84px; height: 84px ; } .BannersImage { visibility: hidden; border: 0px; width: 35px; height: 35px; margin-top: -4px; } .ScrollUP { width: 35px; height: 35px; opacity: 0.7; position: fixed; bottom: 0px; display: none; text-indent: -9999px; background: #454b52 url(images/up.png) no-repeat center center; cursor: pointer; } .DIR_1 .ScrollUP { left: 0; } .DIR_2 .ScrollUP { right: 0; } .ScrollUP:hover { opacity: 1; } .CaptchaImage { width: 100px; height: 33px; vertical-align: bottom; padding: 0px !important; border: 0 !important; border-radius: 4px; } .clear { clear: both; } .BoxCode { direction: ltr; border-radius: 4px; border: 1px solid #ccc; color: #666; background: #f5f5f5; padding: 10px; } .BoxCode b, .BoxCode strong { color: #000; } .Height1 { height:15px; }  .DivContArchive { margin: 20px 0 30px 0; padding: 15px; position: relative; background:#fff; box-shadow: 1px 1px 6px 0px rgba(0, 0, 0, 0.15); } .DivContArchive>a { display: block; } .DivContArchive .Image { float: left; width: 150px; height: 105px; overflow: hidden; } .DivContArchive .Image img { width: inherit; border: 0; padding: 0; } .DivContArchive .Rutitr, .DivContArchive .Title, .DivContArchive .Abstract { width: calc(100% - 150px); display: inline-block; font-size: 18px; line-height:30px; font-weight:normal; vertical-align: top; } .DivContArchive .Rutitr { font-size: 14px; color: #376a9d; } .DivContArchive .Title { color: #376a9d; font-weight: bold; } .DivContArchive .Title img { border: 0; padding: 0; background: inherit; vertical-align: middle; } .DivContArchive .Icon { width:30px; border-radius:50px; margin-left:5px; } .DivContArchive .Abstract { color: #666; } .DivContArchive .Abstract * { font-size: inherit; line-height: inherit; } .DivContArchive .Bar { height: 20px; font-size: 12px; padding: 0 10px; color: #999; background: #FFF; border-top: 1px solid #B3DCEA; margin-top:20px; } .DivContArchive .ReadMore { width: 90px; font-size: 14px; line-height: 20px; text-align: left; position: absolute; bottom: 10px; left: 15px; }  .DivPaging { height: 35px; line-height: 35px; margin-top: 40px; text-align: center; color: #036; background: #f5f5f5; border: 1px solid #ccc; border-radius: 4px; position: relative; } .DivPaging .paging1 { padding: 0 10px; } .DivPaging .arrow { font-size: 14px; padding: 0 5px; margin: 0 2px; color: #036; border: 1px solid #CCC; } .DivPaging .arrow:hover { background: #B3DCEA; } .DivPaging span.arrow { color: #666; } .DivPaging span.arrow:hover { color: #666; background: inherit; } .DivPaging .current, .DivPaging .current:hover { background: #FFF !important; } .DivPaging .paging2 { font-size: 16px; position: absolute; top: 3px; right: 5px; } .DivPaging .paging2 select { font-size: 12px; width: 40px; height: 20px; line-height: 20px; background: inherit } .DivPaging .RowCount { font-size: 16px; position: absolute; top: 3px; left: 5px; }  .DivBoxBlock { width: auto; overflow: hidden; margin-top:20px; } .DivBoxBlock form { background:#eeeff2; padding:30px; } .DivBoxBlockTitle { line-height: 30px; font-size: 22px; font-weight:bold; } .DivBoxBlockCont { } .DivBodyRight .DivBoxBlockTitle { background: #468AC7; color: #fff; font-size: 18px; line-height:40px; font-weight:blod; padding:0 10px; } .DivBodyRight .DivBoxBlockCont { background: #5ba0d0; color: #e6f5ff; padding:10px; }  .DivBoxMain { width: 100%; min-height: 100px; background: #FFF; overflow: hidden; } .DivBreadcrumbs { width: max-content; font-size: 16px; line-height:20px; font-weight:normal; padding-top: 20px; color: #999; } .DivBreadcrumbs a { color: #999; display: inline-block; vertical-align: middle; position: relative; overflow: hidden; padding: 3px; } .DivBreadcrumbs a:after {  content: '';  width: 100%;  height: 1px;  position: absolute;  left: -100%;  bottom: 0;  transition: 0.3s;  border-top: 1px solid #ccc; } .DivBreadcrumbs a:hover:after {  left: 0; } .DivBoxMainrutitr { font-size: 12px; line-height: 30px; } .DivBoxMainTitle { position:relative; } .DivBoxMainTitle h1 { min-height:35px; font-weight: 900; font-size: 20px; line-height:40px; margin-top: 30px; color:#353536; } .DivBoxMainTitle .Back { width: 50px; height: 33px; background: #fff url(images/restore.png) no-repeat center; border: 1px solid #bbb; border-radius: 5px; overflow: hidden; position:absolute; left:0; bottom:5px; transition:all 0.5s; } .DivBoxMainTitle .Back:hover { background: #5ba0d0 url(images/restore.png) no-repeat center; } .DivBoxMainTitle .Back a { display: block; height:100%; } .DivBoxMainCont { color: #002248; line-height: 30px; text-align: justify; } .DivBoxMainCont ul { list-style: disc; padding-right: 40px; }  .DivTopMenu { height: 28px; margin: 0 auto; text-align: center; padding-top:20px; } .DivTopMenu>ul { list-style: none; padding: 0px; margin: 0px; } .DivTopMenu>ul>li { position: relative; display: inline-block; } .DivTopMenu>ul li { line-height: 28px; } .DivTopMenu>ul>li>ul { width: 250px; max-height: calc(100vh - 150px); overflow: auto; padding: 20px 10px; margin-top: 10px; visibility: hidden; opacity: 0; background: url(images/bg.gif); border-top: 1px solid #fff; border-radius: 0 0 10px 10px; position: absolute; top: 32px; z-index: 95; transition: all 0.5s ease; } .DivTopMenu>ul>li>ul:before { content: ''; width: 100%; height: 10px; position: absolute; top: -10px; left: 0; } .DIR_1 .DivTopMenu>ul>li>ul { right: 15px; } .DIR_2 .DivTopMenu>ul>li>ul { left: 15px; } .DivTopMenu>ul li:hover>ul { visibility: visible; opacity: 1; } .DivTopMenu>ul li:hover ul a { line-height: 30px; } .DivTopMenu>ul>li>ul>li:first-child:after { content: ''; position: absolute; top: 0px; border-left: 8px solid transparent; border-right: 8px solid transparent; border-top: 10px solid #fff; } .DIR_1 .DivTopMenu>ul>li>ul>li:first-child:after { right: 20px; } .DIR_2 .DivTopMenu>ul>li>ul>li:first-child:after { left: 20px; } .DivTopMenu>ul a { display: block; color: #FFF; padding: 0px 15px; white-space: nowrap; font-size: 18px; font-weight: normal; transition: all 0.5s ease; } .DivTopMenu>ul ul a { font-size: 14px; font-weight: normal; } .DivTopMenu>ul a:hover, .CurrentTopMenu { } .DivTopMenu>ul a.IsParent { } .DivTopMenu>ul>li>a {  position: relative; overflow: hidden;  padding-bottom: 5px; } .DivTopMenu>ul>li>a:after {  content: '';  width: 100%;  height: 1px;  position: absolute;  left: -100%;  bottom: 0;  transition: 0.3s;  border-top: 1px solid #fff; } .DivTopMenu>ul>li:hover>a:after {  left: 0; } .DivTopMenu>ul>li li a { padding: 0px 20px; font-size: 14px; } .DivTopMenu>ul>li>ul a { position: relative; } .DivTopMenu>ul>li>ul a:after { content: ''; position: absolute; top: 14px; width: 8px; height: 3px; background: #fff; transition: all 0.5s ease; } .DIR_1 .DivTopMenu>ul>li>ul a:after { right: 0px; } .DIR_2 .DivTopMenu>ul>li>ul a:after { left: 0px; } .DivTopMenu>ul>li>ul a:hover { color: #8f5456; } .DivTopMenu>ul>li>ul a:hover:after { background: #8f5456; } .DivTopMenu_Toggle { display: none; width: 35px; height: 30px; line-height: 37px; text-align: center; border-radius: 5px; color: #FFF; background: #47a4bf; cursor: pointer; position: absolute; top: 32px; font-size: 20px; font-weight: bold; border: 1px solid #fff; transition:all 0.5s; z-index:9; } .DIR_1 .DivTopMenu_Toggle { left: 5px; } .DIR_2 .DivTopMenu_Toggle { right: 5px; } .DivTopMenu_Toggle:hover { background: #84bae8; border-color: #4196dd; } #TopMenu_Toggle { width: calc(100% - 40px); height: calc(100vh - 40px); padding: 20px; background: url(images/bg.gif); position: fixed; top: 0px; left: -100%; z-index: 1000; overflow: auto; } #TopMenu_Toggle .Close { width: 30px; height: 20px; line-height: 25px; position: absolute; top: 10px; left: 10px; text-align: center; background: #8f5456; color: #fff; border-radius: 5px; border: 1px solid #fff; cursor: pointer; } #TopMenu_Toggle .Close:hover { background: #999; } #TopMenu_Toggle a { display: block; color: #FFF; white-space: nowrap; font-weight: bold; line-height: 28px; transition: all 0.4s ease; } #TopMenu_Toggle a:hover { color: #8f5456 !important; } #TopMenu_Toggle>ul>li>ul a { position: relative; } #TopMenu_Toggle>ul>li>ul a:after { content: ''; position: absolute; top: 14px; width: 8px; height: 3px; background: #fff; transition: all 0.4s ease; } .DIR_1 #TopMenu_Toggle>ul>li>ul a:after { right: -15px; } .DIR_2 #TopMenu_Toggle>ul>li>ul a:after { left: -15px; } #TopMenu_Toggle>ul>li>a { padding-top: 10px; } #TopMenu_Toggle>ul>li>a:hover { } #TopMenu_Toggle>ul>li ul { margin-right: 30px; } #TopMenu_Toggle>ul>li li a { } #TopMenu_Toggle>ul>li li a:hover { } #TopMenu_Toggle a.IsParent { color: #002248 !important; border-bottom: 0; } #TopMenu_Toggle a.IsParent:hover { }  .DivInnerMenu { } .DivInnerMenu a { display: block; height: 35px; line-height: 35px; color: #FFF; background: #00bcd4; padding-right: 15px; white-space: nowrap; } .DivInnerMenu a:hover, .CurrentInnerMenu { background: #5ba0d0; } .DivInnerMenu img { vertical-align: middle; margin-left: 15px; } .DivInnerMenu li { margin-bottom: 2px; }  .select2-selection__rendered {  line-height: 35px !important; } .select2-selection__arrow { width:16px !important;  height: 33px !important; background: #ddd !important; } .select2-selection { border: 1px solid #cacaca !important; border-radius: 5px !important; transition: all 0.2s; } .select2-selection--single {  height: 35px !important; } .select2-selection--multiple {  height: 100px !important; } .select2-container--focus .select2-selection, .select2-container--open .select2-selection { border-color: #66afe9 !important; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(102, 175, 233, 0.6); background: #f9f9f9 !important; } .select2-selection.invalid { border-color: #f55252 !important; } .select2-dropdown { background: #f9f9f9 !important; } .select2-search { text-align:center; } .select2-search__field { width:95% !important; border-radius: 5px; }  .Body3 .FieldGroup { width: 100% !important; margin:0 !important; } .TwoFieldsFifty, .ThreeFieldsFifty { display: flex; justify-content: space-between; } .TwoFieldsFifty .FieldGroup { width: 48% !important; margin: 0 !important; } .ThreeFieldsFifty .FieldGroup { width: 32% !important; margin: 0 !important; } .FieldGroup label { display: block;  font-weight: normal; font-size: 13px; line-height: 30px; margin-top: 10px; color: #444; position: relative; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .FieldGroup label span.invalid { position: absolute; left:0; color: #f55252; font: inherit; font-weight: normal; padding-right:5px; } .FieldGroup input, .FieldGroup select, .FieldGroup textarea, .Field_Size1, .Field_Label { display: block; border: 1px solid #cacaca; border-radius: 5px; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset; background:#fff; color: #444; width: 100%; height: 35px; padding: 0 10px; box-sizing : border-box; transition: all 0.2s;  font-weight: normal; font-size: 13px; line-height: 35px; vertical-align: middle; } .Field_Size1 { min-width:50px; max-width: 100px; display: inline-block !important; } .FieldGroup input:focus, .FieldGroup select:focus, .FieldGroup textarea:focus, .Field_Size1:focus { border-color: #66afe9; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(102, 175, 233, 0.6); outline: 0 none; background: #f9f9f9; } .FieldGroup .invalid, .FieldGroup input:focus:invalid, .FieldGroup select:focus:invalid, .FieldGroup textarea:focus:invalid, .Field_Size1:focus:invalid { border-color: #f55252 !important; } .FieldGroup input:disabled, .FieldGroup select:disabled, .FieldGroup textarea:disabled, .Field_Label, .FieldGroup input[type=text]:read-only, .FieldGroup input[type=email]:read-only, .FieldGroup input[type=tel]:read-only, .FieldGroup textarea:read-only { background: #f3f3f3; } .Field_Label { overflow: hidden; white-space: nowrap; cursor: text; } .FieldGroup textarea { height: 80px; line-height: 24px; } .FieldGroup .btn_OK { height: 40px;  font-weight: bold; font-size: 14px; line-height: 40px; cursor: pointer; color: #FFF; padding: 0; margin-top: 35px; background: #1097d2; background-image: linear-gradient(to bottom, #25a5dc, #1097d2 66%, #0f8abf); border-color: #0d78b6 #0d78b6 #0b689e; text-shadow: 0 1px rgba(0, 0, 0, 0.5); position:relative; } .FieldGroup_Report .btn_OK { height: 35px;  font-weight: bold; font-size: 13px; line-height: 35px; margin-top: 30px; } .FieldGroup .btn_OK:focus, .FieldGroup .btn_OK:hover { background: #1097be; background-image: linear-gradient(to bottom, #25a5c8, #1097be 66%, #0f8aab); border-color: #0d78a2 #0d78a2 #0b688a; text-shadow: 0 1px rgba(0, 0, 0, 1); } .FieldGroup .btn_OK:disabled { background: #8ea8b3; border-color: #bbb; } .BoxMsgError .FieldGroup { float: none; display: inline-block; width: 100px; } .BoxMsgError .FieldGroup .btn_OK { margin: 0px; margin-right: 5px; } .FieldGroup .Field_Time { direction: ltr; } .FieldGroup .Field_Calendar, .FieldGroup .Field_Browse, .FieldGroup .Field_Search, .FieldGroup .Field_Download { float: right; width: calc(100% - 45px); } .FieldGroup .Field_BrowseDownload { width: calc(100% - 90px); } .FieldGroup .Field_Calendar, .FieldGroup .Field_Browse, .FieldGroup .Field_Download { direction: ltr; } .FieldGroup .NoButtons { float: none; width: 100%; } .FieldGroup .Calendar, .FieldGroup .Browse, .FieldGroup .Search, .FieldGroup .Download { float: right; width: 39px; height: 33px; cursor: pointer; background: #EEE; border: 1px solid #CCC; border-radius: 5px; margin-right: 4px; text-align: center; transition: all 0.5s; } .FieldGroup .Calendar:hover, .FieldGroup .Browse:hover, .FieldGroup .Search:hover, .FieldGroup .Download:hover { background: #CCC; } .FieldGroup .Calendar:before { content: '\e801'; font-size: 150%; color: #0894d7; line-height: 32px; } .FieldGroup .Browse:before { content: '\e802'; font-size: 150%; color: #0894d7; line-height: 35px; } .FieldGroup .Search:before { content: '\f50d'; font-size: 150%; color: #0894d7; line-height: 35px; } .FieldGroup .Download:before { content: '\E81C'; font-size: 150%; color: #0894d7; line-height: 35px; } .FieldGroup .Field_Captcha { float: right; width: calc(100% - 110px); direction: ltr; } .FieldGroup .CaptchaImage { float: left; width: 100px; height: 33px; border-radius: 5px; border: 1px solid #999 !important; } .FieldGroup .Field_CheckBox, .Field_CheckBox { width: 15px; height: 15px; display: inline-block; border: none; } .FieldGroup .MaskNumber, .FieldGroup .MaskMoney { direction: ltr; } .tbGrid .FieldGroup { min-width:90px; vertical-align:middle; margin:0; } @media (min-width: 500px) { .FieldGroup { width: 70%; } .FieldGroup_Report { float: right; width: 32%; margin-left: 1%; } .tbGrid .FieldGroup_Report { float: none; display:inline-block; } } @media (min-width: 900px) { .FieldGroup { float: right; width: 47%; margin-left: 3%; } .tbGrid .FieldGroup { float: none; display:inline-block; } .FieldGroup_Report { width: 24%; margin-left: 1%; } } @media (min-width: 1400px) { .FieldGroup { width: 35%; margin-left: 15%; } .FieldGroup_Report { width: 19%; margin-left: 1%; } #DivBody .BoxMsgOK, #DivBody .BoxMsgError { width: 85%; } }  .FieldGroup_CheckBox { height: 75px; } .FieldGroup_CheckBox input { opacity: 0; height: 30px; position: absolute; width: auto; } .FieldGroup_CheckBox label { display: inline-block; cursor: pointer; } .FieldGroup_CheckBox input[type=checkbox] + label:before, .FieldGroup_CheckBox input[type=radio] + label:before { color: #0894d7; } .FieldGroup_CheckBox input[type=checkbox]:disabled + label:before, .FieldGroup_CheckBox input[type=radio]:disabled + label:before { color: #ccc; } .tbGrid .FieldGroup { vertical-align:middle; } .tbGrid .tbl-header .FieldGroup_CheckBox input[type=checkbox] + label:before, .tbGrid .tbl-header .FieldGroup_CheckBox input[type=radio] + label:before { color: #fff; } .tbGrid .tbl-header .FieldGroup_CheckBox input[type=checkbox]:disabled + label:before, .tbGrid .tbl-header .FieldGroup_CheckBox input[type=radio]:disabled + label:before { color: #ccc; } .FieldGroup_CheckBox input[type=checkbox] + label:before { content: '\f096'; margin-right: 3px; margin-left: 7px; font-size: 140%; vertical-align: middle; } .FieldGroup_CheckBox input[type=checkbox]:checked + label:before {  content: '\e800'; margin-right: 0; } .FieldGroup_CheckBox input[type=radio] + label:before { content: '\f10c'; margin-left: 7px; font-size: 140%; vertical-align: middle; } .FieldGroup_CheckBox input[type=radio]:checked + label:before {  content: '\f192'; } .FieldGroup_CheckBox label span.invalid { left:auto; } .FieldGroup_CheckBox input[type=checkbox].invalid + label:before, .FieldGroup_CheckBox input[type=radio].invalid + label:before { color: #f55252 !important; } .FieldGroup_Report { height: auto; } .FieldGroup_Report label { margin-top: 0; font-weight: normal; } .Field_Separator { width: 90%; height:27px; margin-top:25px; border-bottom: 2px solid #FFAF38; border-top-right-radius: 5px; border-bottom-right-radius: 5px; } .Field_Separator>span { height:28px; display:inline-block; background: #FFAF38; padding-right: 12px; border-radius: 5px; position: relative; } .Field_Separator>span:before { content: ''; width: 27px; height: 100%; background: #FFAF38; position: absolute; top: 0; left: -13px; transform: skew(-40deg); border-top-left-radius: 5px; } .Field_Separator>span>span { display:block; color:#FFF; position: relative; } @media (min-width: 500px) { .Field_Separator { width: 70%; } } .myIcon:before { font-family: "fontello"; font-style: normal; font-weight: normal; } .myIcon.icoInfo { width: 16px; height: 16px; display: inline-block; vertical-align: middle; position: relative; margin: 0 5px; cursor: pointer; } .myIcon.icoInfo:before { content: '\e804'; font-size: 18px; line-height: 16px; position: absolute; top: 0; right: 0px; color: #0894d7; transition: all 0.5s; } .myIcon.icoInfo:hover:before { color: #ccc; } .myIcon.icoAccept { width: 16px; height: 16px; padding: 4px; display: inline-block; vertical-align: middle; position: relative; margin: 0 5px; } .myIcon.icoAccept:before { content: '\e816'; font-size: 130%; line-height: 26px; position: absolute; top: 0; right: 4px; color: #43d487; } .myIcon.icoDecline { width: 16px; height: 16px; padding: 4px; display: inline-block; vertical-align: middle; position: relative; margin: 0 5px; cursor:pointer; } .myIcon.icoDecline:before { content: '\e817'; font-size: 150%; line-height: 26px; position: absolute; top: 0; right: 7px; color: #ff6868; } .myIcon.icoAdd { width: 13px; height: 13px; padding: 2px; display: inline-block; vertical-align: middle; position: relative; margin: 0 5px; cursor:pointer; background:#43d487; border: 1px solid #6fb658; border-radius: 50px; transition:all 0.5s; } .myIcon.icoAdd:before { content: '\e809'; font-size: 80%; line-height: 17px; position: absolute; top: 0; right: 3px; color: #fff; } .myIcon.icoAdd:hover { background:#6fb658; } .myIcon.icoDel { width: 13px; height: 13px; padding: 2px; display: inline-block; vertical-align: middle; position: relative; margin: 0 5px; cursor:pointer; background:#ff6868; border: 1px solid #ce4e4e; border-radius: 50px; transition:all 0.5s; } .myIcon.icoDel:before { content: '\e80a'; font-size: 80%; line-height: 17px; position: absolute; top: 0; right: 3px; color: #fff; } .myIcon.icoDel:hover { background:#ce4e4e; } .icoHome:before { content: '\e803'; font-size: 130%; color: #666; margin-left: 5px; display: inline-block; vertical-align: middle; } .icoArrowLeft:before { content: '\e80c'; font-size: 100%; color: #666; margin-left: 5px; display: inline-block; vertical-align: middle; } .BoxMsgOK, .BoxMsgError { padding: 10px; font-weight:bold; font-size: 14px; line-height: 25px; } .BoxMsgOK { color: #255584; background: #D5E6FC; border: 1px solid #BBC4E8; } .BoxMsgError { color: #B03939; background: #F9D9D9; border: 1px solid #EAACAC; } .BoxMsgOK .Close, .BoxMsgError .Close { float:left; width: 20px; height: 20px; line-height: 18px; text-align:center; border-radius:50px; cursor: pointer; transition: all 0.3s; } .BoxMsgOK .Close { color: #8E9EDE; border:1px solid #8E9EDE; } .BoxMsgError .Close { color: #E99191; border:1px solid #E99191; } .BoxMsgOK .Close:hover { color:#fff; background: #91ADD0; } .BoxMsgError .Close:hover { color:#fff; background: #E99191; } .BoxMsgOK .Close:before, .BoxMsgError .Close:before { content: '\E817'; font-family: "fontello"; font-style: normal; font-weight: normal; font-size: 16px; } #DivPopup { display: none; position: absolute; z-index: 999; } .BoxPopup { line-height: 25px; padding: 5px 10px; background-color: #FF9; border: 1px solid #999; border-radius: 5px; font-size:12px; } #DivPopup tr:first-child { background: #E3CB2B; text-align: center; } #DivPopup table tr td { border: 1px solid #999; padding: 2px 4px; }  .Table1 { margin: 0 auto; border-spacing: 0; border-collapse: collapse; border: 1px solid #6494c4; border-bottom: 3px solid #6494c4; color: #002248; } .Table1 th, .Table1 td { border: 0; padding: 10px; border-bottom: 1px solid #6494c4; } .Table1 tr:nth-child(even) td { background: #b1d8f2; } .Table1 tr:nth-child(odd) td { background: #e4f3fd; } .Table1 tr:first-child th, .Table1 tr:first-child td { background: #6494c4; padding: 15px; text-align: center; font-weight: bold; border: 0; border-right: 1px solid #e4f3fd; } .Table1 tr:first-child th:first-child, .Table1 tr:first-child td:first-child { border: 0; }  .DivGallery2 { display: flex; flex-flow: wrap; justify-content: start; align-items: start; gap: 20px; } .DivGallery2 .Item { width: calc(25% - 15px); position: relative; } .DivGallery2 .Item a { display: block; height: 100%; } .DivGallery2 .Item img { object-fit: cover; width: 100%; height: 10rem; padding: 0.3rem; background: #e7f1f3; border: 1px solid #c2d7d5; border-radius: 0.6rem; box-shadow: rgba(0, 0, 0, 0.1) 0px 3px 6px 0px; } .DivGallery2 .Item .Title { font-size: 1rem; line-height: 1.5rem; margin-top: 0.1rem; margin-bottom: 0.5rem; text-align:center; color: #167388; } .DivGallery2 .Item .txtCover { direction:ltr; width: 2.5rem; height: 0.9rem; position: absolute; top: 8.5rem; left: 0.5rem; font-size: 0.6rem; line-height:1rem; padding:0 0.3rem; text-align:center; border-radius: 0.3rem; color: #fff; background: linear-gradient(90deg, #9F7171 0%, #462828 100%); } .DivGallery2 .Item .icnGallery { width: 2.3rem; height: 1.7rem; position: absolute; top: 7.8rem; left: 0.5rem; border-radius: 0.3rem; background-color: #167388; background-size: 60%; background-position: center; background-repeat: no-repeat; background-image: url(../../_tmp_common/images/icnPicture.png); opacity: 0.9; } .DivGallery2 .Item .icnVideo { background-image: url(../../_tmp_common/images/icnVideo.png); } .DivGallery2 .Item .icnAudio { background-image: url(../../_tmp_common/images/icnAudio.png); } @media (max-width: 1000px) { .DivGallery2 .Item { width: calc(33.3% - 14px); } } @media (max-width: 700px) { .DivGallery2 { gap: 15px; } .DivGallery2 .Item { width: calc(50% - 8px); } } @media (max-width: 350px) { .DivGallery2 .Item { width: 100%; } }  .DivGallery { margin: 0 auto; } .DivGallery .Item { float: right; width: 295px; height: 120px; margin: 5px; padding: 5px; background: #7fa8cb; border: 1px solid #376a9d; position: relative; } .DivGallery .Item a { display: block; } .DivGallery .Item div { display: none; width: 295px; height: 120px; position: absolute; top: 5px; right: 5px; text-align: center; color: #002248; background: #d0e8ff; } .DivGallery .Item img { width: 295px; height: 120px; border: 0; padding: 0; } .DivOuterGallerySlide { max-width: 700px; margin: 0 auto; margin-top: 10px; padding:10px; background: #47a4bf; border: 1px solid #7fa8cb; border-radius:5px; } .DivGallerySlide { max-width: 700px; position: relative; overflow: hidden; } #GallerySlide { width:100%; height:500px; position:relative; margin:0 auto; top:0px; left:0px; overflow:hidden; visibility:hidden; } #GallerySlide .GallerySlide { width:100%; height:400px; cursor:default; position:relative; top:0px; left:0px; overflow:hidden; } #GallerySlide .NavBullet {position:absolute;left:0px;bottom:0px;width:95%;height:80px;} #GallerySlide .NavBullet>div {top:auto !important; left:auto !important;} #GallerySlide .NavBullet .p {width:130px;height:80px; position: absolute;top:0;left:0;box-sizing:border-box;background:#000; border-radius:10px; border:1px solid #666; cursor:pointer;} #GallerySlide .NavBullet .p:hover{padding:2px;} #GallerySlide .NavBullet .p:hover.pdn{padding:0;} #GallerySlide .NavBullet .t {position:absolute;top:0;left:0;width:100%;height:100%;border:none;opacity:.6;} #GallerySlide .NavBullet .pav .t, .NavBullet .p:hover .t{opacity:1; border:1px solid #015593; width:calc(100% - 2px); height:calc(100% - 2px);} #GallerySlide .NavArrow {display:block;position:absolute;cursor:pointer; width:50px;height:50px;top:150px;} #GallerySlide .NavArrowLeft {left:0px;} #GallerySlide .NavArrowRight {right:0px;} #GallerySlide .NavArrow .a {fill:#ddd;fill-opacity:.7;stroke:#000;stroke-width:160;stroke-miterlimit:10;stroke-opacity:.7;} #GallerySlide .NavArrow:hover {opacity:.8;} #GallerySlide svg {position:absolute;top:0;left:0;width:100%;height:100%;} @media (max-width: 500px) { #GallerySlide { height:400px; } #GallerySlide .GallerySlide { height:300px; } #GallerySlide .NavArrow {top:125px;} } #GallerySlide video { width: 100%; height: 100%; }  .DivContCat { background: #7fa8cb; padding: 10px 20px; border-bottom: 5px solid #376a9d; } .DivContCat a { color: #FFF; font-weight: bold; } .DivContCat a:hover { color: #376a9d; } .BookList { } .BookList .Item { display:inline-block; width: 200px; height: 310px; text-align: center; vertical-align: top; margin: 10px; margin-bottom: 40px; padding: 5px; transition: all 0.5s; } .BookList .Item .Image { width: 177px; height: 237px; background: url(images/bgBook.png); margin: 0 auto; position: relative; } .BookList .Item img { width: 151px; height: 201px; margin: 28px 20px 0 0; padding: 0px; border: 0; } .BookList .Title { display: block; color: #7bc144; font-weight: bold; font-size: 16px; line-height: 25px; margin-top:10px; } .BookList .Title:hover { color: #353536; } .BookList .Text { width: 141px; height: 191px; position: absolute; top: 28px; left: 3px; text-align: right; padding: 5px; opacity: 0; color: #FFF; background: #7c4199; overflow: hidden; transition: all 0.5s; border-radius:50px; } .BookList .Item:hover .Text { opacity: 1; border-radius:0px; } .BookView .Image { float: left; width: 177px; height: 237px; background: url(images/bgBook.png); margin-top: 20px; } .BookView img { width: 151px; height: 201px; margin: 28px 20px 0 0; padding: 0px; border: 0; } .BookView .Title { color: #001935; font-weight: bold; } .BookView .Text { width: calc(100% - 200px); } .BookView .Abstract { } .DivIcnLMS { font-size:0; text-align: right; } .IcnLMS { display: inline-block; width: 80px; height: 80px; margin:10px; border-radius: 10px; border:1px solid #5ba0d0; overflow:hidden; box-shadow: -2px 2px 5px #ccc; background-color: #fff; background-repeat: no-repeat; background-position:center top; background-size: 100%;  transition: all 0.5s; } .IcnLMS:hover, .IcnLMS.slct { background-color:#e6f5ff; background-position:center bottom; } .IcnLMS.slct { background-color:#5ba0d0; } .IcnLMS a { display:block; height:100%; } .IcnLMS_selection { text-align:center; color: #11567f; } .IcnLMS_selection1 { } .IcnLMS_selection2 { } .IcnLMS_selection3 { } .IcnLMS_selection4 { } div.ClassList { min-width: 300px; display: inline-block; padding: 10px; margin: 5px; border-radius: 10px; } .ClassList { background: #00bcd4; } .ClassList th, .ClassList td { border: 0; padding: 10px; border-bottom: 1px solid #5ba0d0; border-right: 1px solid #e4f3fd; } .ClassList th span { font-size: 13px; } .ClassList tr:nth-child(even) { background: #e6f5ff; } .ClassList tr:nth-child(odd) { background: #f9f9f9; } .ClassList tr:first-child th, .ClassList tr:first-child td { color: #444; background: #5ba0d0; text-align: center; font-weight: bold; border: 0; border-right: 1px solid #e4f3fd; vertical-align: middle; } .ClassList .rowSelected { color: #666; background: repeating-linear-gradient( -55deg, #ddd, #ddd 3px, #eee 3px, #eee 10px ) !important; } .ClassList .rowSelected .tick:before { content: '\e816'; padding: 0 4px; background: #08af8d; color: #fff; border: 1px solid #079578; border-radius: 50px; } .ClassList .Select { width: 56px; height: 26px; padding: 4px; padding-right: 20px; font-size: 10px; line-height: 18px; display: block; margin: 0 auto; cursor: pointer; border-radius: 5px; color:#fff; transition: 0.3s; overflow: hidden; } .ClassList .Hide { display: none; } .ClassList .Select:before { width: 15px; text-align: center; color: #fff; top: 0px; right: 0px; line-height: 25px; } .ClassList .Select.Add { border: 1px solid #079578; background: #079578; } .ClassList .Select.Add:hover, .ClassList .Select.Add:before { background: #08af8d; } .ClassList .Select.Del { border: 1px solid #aa3939; background: #aa3939; } .ClassList .Select.Del:hover, .ClassList .Select.Del:before { background: #d24848; }  .ClsMtg { margin-bottom:30px; padding: 15px; position: relative; background: #fdfdfd; box-shadow: 1px 1px 6px 0px rgba(0, 0, 0, 0.15); } .ClsMtgBar { margin-top:30px; color:#666; border-bottom: 1px solid #468AC7; text-align: left; font-size: 16px; } .ClassImg { float:left; width: 250px; height: 125px; border: 1px solid #cacaca; border-radius: 5px; }  .ClassList2 { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: center; } .ClassList2 .Item { width: 23%; height: 320px; text-align: center; vertical-align: top; margin: 1%; margin-bottom: 40px; border-radius:10px; background:#D2D2D2; transition: all 0.5s; overflow: hidden; box-shadow: 1px 1px 6px 0px rgba(0, 0, 0, 0.3); } .ClassList2 .Item .Image { height: 175px; position: relative; } .ClassList2 .Item img { width: 100%; height: 100%; margin: 0; padding: 0px; border: 0; } .ClassList2 .filterLayer { width: 100%; height: 100%; position: absolute; top:0; left:0; background:#9A5E66; opacity:0.2; } .ClassList2 .Text { padding: 5px; color: #000; } .ClassList2 .Title { font-size: 16px; line-height: 25px; margin-top:10px; } .ClassList2 .Title:hover { color: #353536; } .News { width: 100%; vertical-align:top; margin: 0 auto; overflow: hidden; padding:20px 0; border-bottom: 1px dashed #DFE3E5; position: relative; transition: all 0.5s; } .DIR_1 .News { float:left; text-align: right; } .DIR_2 .News { text-align: left; float:right; } .DivNews { overflow: hidden; } .DivNews .News:hover { background: #eeeff2; } .DivNews .News .box { display: inline-block; width: calc(100% - 115px); vertical-align:top; height: 100%; overflow:hidden; color: #fff; } .DIR_1 .DivNews .News .box { margin-right: 10px; } .DIR_2 .DivNews .News .box { margin-left: 10px; } .DivNews .rutitr { width:max-content; max-width:100%; line-height:18px; overflow:hidden; font-size: 14px; color: #fff; background:#C8CECE; padding: 0 5px; } .DivNews .Title { line-height:30px; font-size: 18px; padding: 10px 0; overflow:hidden; color:#353536; } .DivNews .Title img { border-radius: 50px; vertical-align:middle; } .DivNews .PicSmall { display: inline-block; width: 90px; height: 90px; border: 1px solid #DFE3E5; border-radius: 50px; padding:4px; overflow:hidden; } .DivNews .PicSmall img { width: 100%; height: 100%; border: 0; border-radius: 50px; } .DivNews .Abstract { overflow: hidden; font-size: 16px; } .DivNews .Abstract, .DivNews .Abstract p, .DivNews .Abstract span { font-size: 14px; line-height: 25px; color: #82848E; } .DivMySlider { width: 90%; height: 100%; margin-right: 10%; position: relative; } .DivMySlider>div { display: none; } .DivMySlider .ObjSlid { width: 50%; } .ObjSlid_1 { min-height: 60px; background: linear-gradient(45deg,#11567f 0%,#2182a8 100%); position: absolute; top: 10px; left: -100%; opacity: 0; } .ObjSlid_1>div { line-height: 40px; padding: 10px; opacity: 0; font-size: 22px; font-weight: bold; color: #fff; text-shadow: -3px 3px 0 #11567f; } .ObjSlid_2 { position: absolute; top: 200px; right: 0; opacity: 0; } .ObjSlid_2>div { line-height: 30px; text-align: justify; color: #fff; padding: 0 10px; opacity: 0; } @media (max-width: 800px) { .DivMySlider .ObjSlid { width: 80%; } } @media (max-width: 500px) { .DivMySlider .ObjSlid { width: 90%; } .DivMySlider { width: 100%; margin-right: 5%; } }  #Slider1_Toggle { display: none; padding: 20px 10px 0 10px; color:#fff; } #Slider1 { width: 1500px; height: 600px; position: relative; top: 0px; left: 0px; } #Slider1 .Slider1 { width: 1500px; height: 600px; position: relative; left: 0px; top: 0px; overflow: hidden; } #Slider1 .filterLayer { width: 100%; height: 100%; position: absolute; top:0; left:0; background:#74C4DF; opacity:0.05; } #Slider1 .Label { width: 100%; height: 100px; position: relative; color: #FFF; } #Slider1 .Label a { color: #FFF; } #Slider1 .Label>div { font-weight: bold; font-size: 20px; line-height: 40px; } #Slider1 .Label>span { width: 68%; max-height:80%; margin:0 auto; margin-top:30px; display:block; color: #82848E; } #Slider1 .Label>span p { text-align: justify; font-size: 16px; line-height: 30px; } #Slider1 ._Arrow { display:block;position:absolute;cursor:pointer; width:40px;height:40px;top:0px; } #Slider1 ._Arrow .a {fill:none;stroke:#fff;stroke-width:1000;stroke-linecap:round;} #Slider1 ._Arrow:hover {opacity:.8;} #Slider1 .Prev_Arrow { left:5px; } #Slider1 .Next_Arrow { right:5px; } #Slider1 .Navigator { position:absolute; top:12px; } .DIR_1 #Slider1 .Navigator { right:12px; } .DIR_2 #Slider1 .Navigator { left: 12px; } #Slider1 .Navigator .i {position:absolute;cursor:pointer; width:16px;height:16px;} #Slider1 .Navigator .i .b {fill:#fff;fill-opacity:0.5;stroke:#000;stroke-width:400;stroke-miterlimit:10;stroke-opacity:0.5;} #Slider1 .Navigator .i:hover .b {fill-opacity:.7;} #Slider1 .Navigator .iav .b {fill-opacity: 1;} #Slider1 .Navigator .i.idn {opacity:.3;} .SliderReadMore { color: #FFF; font-size: 16px; position: absolute; bottom: 0px; } .DIR_1 .SliderReadMore { right: 29px; } .DIR_2 .SliderReadMore { left: 29px; }  .TabsContent ul.tabs{ margin: 0px; padding: 0px; list-style: none; } .TabsContent ul.tabs li{ background: #f5f5f5; color: #222; display: inline-block; padding: 10px 15px; cursor: pointer; } .TabsContent ul.tabs li.current{ background: #ededed; color: #222; font-weight: bold; } .TabsContent .tab-content{ display: none; background: #ededed; padding: 15px; } .TabsContent .tab-content.current{ display: inherit; } .BankLogo { width: 70px; height: 70px; padding: 0; border: 0; } .FieldGroup .Field_Payment { float: right; width: calc(100% - 60px); direction: ltr; } .FieldGroup .Payment { float: right; width: 54px; height: 33px; cursor: pointer; color: #fff; background: #1097d2; border: 1px solid #0d78b6; border-radius: 5px; margin-right: 4px; text-align: center; transition: all 0.5s; } .FieldGroup .Payment:hover { background: #1097be; } #InsertFile { color: #A74A4C; cursor: pointer; margin: 5px 0; } #InsertFile span { color: #FFF; background: #33bd61 url(images/plus.png) right no-repeat; cursor: pointer; border: 1px solid #2c8c4c; border-radius: 5px; padding: 0 20px 0 10px; } .DivFile { margin: 1px 0; } .DivFile input { width: 300px; } .DivFile .FileDownload { display: inline-block; width: 288px; color: #FFF; background: #248692; border: 1px solid #2a80b9; border-radius: 5px; padding: 2px 5px; } .DivFile .FileDel { color: #FFF; background: #c44142 url(images/delete.png) right no-repeat; border: 1px solid #a13a3b; border-radius: 5px; padding: 0 20px 0 5px; } .TicketView { border: 1px solid #09F; } .TicketView .Title { height: 20px; line-height: 20px; padding: 0 10px; color: #FFF; background: #09F; } .TicketView .Title span { line-height: 20px; } .TicketView .Text { padding: 10px 20px; background: #EEE; } .DivTicketForm { display: none; margin: 20px; padding: 10px; background: #DDD; border: 1px solid #09F; border-radius: 5px; } .TicketBtn { padding: 0 5px; color: #FFF; background: #09F; border-radius: 5px; font-size: 14px; } .TicketBtn:hover { color: #FFF; background: #2a80b9; } .TicketBtnInsert { color: #FFF; background: #33bd61 url(images/plus.png) right no-repeat; cursor: pointer; border: 1px solid #2c8c4c; border-radius: 5px; padding: 0 20px 0 10px; } #DivChatHead { width: 60px; height:60px; position: fixed; bottom: 20px; right: 20px; z-index: 97; background: #0f9567 url(images/bgChat2.gif) no-repeat center center; cursor: pointer; border-radius:50px; border:1px solid #fff; transition:all 0.5s; } #DivChatHead:hover { box-shadow: 0px 3px 10px #11567f; } #DivChatHead:before, #DivChatHead:after { content:''; width:7px; height:7px; border-radius:50px; background:#0f9567; position:absolute; bottom:-14px; right:-8px; } #DivChatHead:after { width:13px; height:13px; bottom:-8px; right:-1px; } #DivChatFrame { display: none; width: 410px; height: 450px; border-radius: 5px 5px 0px 0px; z-index: 98; border: 1px solid #666; background: #FFF; position: fixed; bottom: 0px; right: 0px; } @media (max-width: 400px) { #DivChatFrame { width: 100%; } } #DivOuterChat { position:relative; width:390px; max-width:100%; height:360px; } #DivOuterChat .tableForm tr { height: 41px; } #DivChatBox { height: 340px; margin: 0 auto; overflow: auto; scrollbar-width: thin; scrollbar-color: #7ab5d9 #d8d4c7; } #DivChatBox::-webkit-scrollbar {  width: 5px; } #DivChatBox::-webkit-scrollbar-track-piece {  background-color: #d8d4c7; } #DivChatBox::-webkit-scrollbar-thumb {  background-color: #7ab5d9; } #DivOnline { margin: 15px 5px; padding: 15px; background: #cc99cc; border: 1px solid #996699; color: #573357; } #DivChatTitle { width:100%; height: 40px; line-height:40px; font-weight:bold; position: fixed; top: 0; right: 0; padding-right:10px; color:#11567f; border-bottom: 1px solid #2a80b9; } #DivMinimizeChat { position: fixed; top: 7px; left: 10px; cursor: pointer; width: 24px; height: 24px; background: url(images/minimize.png); } #DivLogoutChat { position: fixed; top: 7px; left: 40px; cursor: pointer; width: 24px; height: 24px; background: url(images/logout.png); } #MessageChat { width: 80%; height: 30px; line-height: 30px !important; } .MessageOK, .MessageOK:focus, .MessageOK:hover { width: 18% !important; height: 30px; color:#fff; background: #1097d2; border:1px solid #0d78b6; cursor: pointer; vertical-align: middle; } .MessageOK2, .MessageOK2:focus, .MessageOK2:hover { width: 100px !important; } #theSubmitChat2 { width: 50px; height: 33px; line-height: 30px !important; } .DivMsg { margin: 5px; padding: 5px; border: 1px solid #ACD8F0; } .MsgUser { float: right; font-weight: bold; padding: 0 5px; } .MsgTime { float: left; color: #2a80b9; background: #CCC; padding: 0 5px; border-radius: 2px; font-size: 10px; } .Department optgroup { color: #FFF; background: #BBB; font-style: normal; font-weight: normal; } .Department optgroup.Online { background: #57BB57; } .Department option { color: #2a80b9; background: #FFF; }   @media (max-width: 1100px) { } @media (max-width: 1000px) { } @media (max-width: 900px) { } @media (max-width: 800px) { } @media (max-width: 700px) { } @media (max-width: 600px) { #DivHead{ width: 100%; } }  @media (max-width: 500px) { } @media (max-width: 400px) { } @media (max-width: 360px) { } @media (max-width: 320px) { } @media (min-width: 1000px) { } @media (min-width: 1400px) { } @media (min-width: 1500px) { }