@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+Thai:wght@100;200;300;400;500;600;700;800;900&display=swap');

@font-face {
    font-family: 'quark-bold';
    src: url('../fonts/quark-bold.ttf');
    font-weight: 500;
    font-style: normal;
    }

    body{ margin: 0px; }
    .clear{ clear: both; }
    body .clearfix:before{ display: none; }
    body h2, body h5, body h3, body a, body li, body div, body p, body span{ font-family: 'quark';}
    body .banner-panel .slick-slide{ opacity: 1 !important; }
    body #menu .menu-toggle{ overflow: visible; margin-top: 0px; } 
    body ul li{ margin-top: 0px; }
    body ul li{ margin-top: 0px; }
    body .title-header{ color: #fff; font-size: 46px; font-weight: 700; 
        list-style: none; margin-bottom: 20px;  font-family: 'quark-bold'; }
    body .text-syntax{ white-space: normal; word-wrap: break-word; width: 41%;
    display: inline-block; font-size: 21px; vertical-align: top;
    }   
    
    body #hero-and-body .col {
        -ms-flex-preferred-size: unset;
        flex-basis: unset;
        -ms-flex-positive: unset;
        flex-grow: unset;
        max-width: 100%;
    }

    body .bar-logo-pc{ text-align: center; width: auto;}
    body .bar-logo-pc img{ margin: auto; display: inline-block; width: 150px; vertical-align: baseline;margin: 10px;}
    .intro-panel .slides-section{ margin-bottom: 0px;  margin-top: 0px;}
    .slides-section{ margin-bottom: 50px; }
    body .card-body hr{ margin-top: 18px; } 
    body .title-logo-m{ width: auto;
    display: inline-block;
    line-height: 12px; vertical-align: baseline;}
    body .webtitle-bar-en .title-logo-m{ vertical-align: inherit; }
    body .title-logo-m .h-title-logo{ font-family: 'quark'; font-size: 17px; color: #42424c; 
    margin: 0px; margin-bottom: 7px;}
    body .title-logo-m p{ font-family: 'quark'; font-size: 15px; margin: 0px; color: #42424c; }
    body .title-logo-m .color-blue-text{ color: #0072be; }
    body .intro-panel{ 
     width: 100%; 
      height: auto;  
      background: #ffffff;
      /*background-image: url("../img/bg2.png");*/
      background-size: 100% 50%; 
      background-repeat: no-repeat; 
      padding: 0px;
      padding-top: 0px;
      padding-bottom: 70px;
      margin-left: 0px;
      margin-right: 0px;
     }
  
     #Full-E .head-banner{
    color: #7f4e09;
    font-size: 45px;
    font-family: 'quark';
    font-weight: 500;
    padding-left: 20px;
    padding-right: 20px;
    text-align: center;
    max-width: 100%;
    text-transform: uppercase;
    margin-bottom: 0px;
    margin-top: 50px;
    line-height: 40px;
    }
    body .news-panel{ 
      width: 100%; 
      height: auto;  
      position: relative;
      background-size: cover; 
      background-attachment: fixed;
      background-repeat: no-repeat; 
      background-position: center;
      padding: 0px;
      padding-top: 20px;
      padding-bottom: 70px;
      margin-left: 0px;
     }
    body .news-panel .overlay-news{ position: absolute; top: 0; left: 0px; right: 0px; bottom: 0px;
    width: 100%; height: 100%; background: rgba(84, 84, 94, 0.77); 
     }
    body .nav-tabs{ border-bottom: 0px;}
    body .ebook-panel{ 
      width: 100%;
      height: auto;  
      background: #ffffff;
      background-image: url("../../../Main_theme/files/images/bg-book.html");
      background-size: 100% 59.3%;
      background-repeat: no-repeat; 
      padding: 0px;
      padding-top: 30px;
      padding-bottom: 70px;
      margin-left: 0px;
      }
      body .ebook-panel .container{ max-width: 1280px; padding: 0px; } 
      body .ebook-panel .container .col-xs-12{ padding: 0px;}
     body .services-panel{ 
      width: 100%; 
      height: auto;  
      background: #ffffff; 
      margin-left: 0px;
      }
      body .services-panel .tab-more{ max-width: 100%; } 
     body .info-panel{ 
      width: 100%; 
      height: auto;  
      background: #ecece4;
      /*background-image: url("../info-img/bg-top.jpg");*/
      background-size: 100% 64%;
      background-repeat: no-repeat; 
      padding: 0px;
      padding-bottom: 70px;
      margin-left: 0px;
      }

      body .banner-panel{ 
      width: 100%; 
      height: auto;  
      background: #ffffff;
      /*background-image: url("../img/bgbammer.png");*/
      background-size: 100% 95%;
      background-repeat: no-repeat; 
      background-position: bottom;
      padding: 20px 0px;
      margin-left: 80px;
      }

    	body .container-layout{     
    max-width: 1280px;
    height: auto;
    margin: auto; }
     body .text-list-ebook{ text-align: left; padding: 20px; width: 100%; float: left; margin-bottom: 50px; margin-top: 12px;}
    body .text-list-ebook .head-list-ebook{ text-align: left; color: #fff; font-size: 65px; font-weight: 700; display: block; margin-bottom: 10px; margin-top: 0px; font-family: 'quark-bold'; line-height: 42px;}
     body .text-list-ebook p{ color: #fff; font-size: 34px; font-weight: 700; margin-top: 0px; 
        font-family: 'quark-bold';}
     body .text-list-ebook ul{ width: auto; height: auto; margin: auto; padding-bottom: 40px;}
     body .text-list-ebook ul li{ color: #fff; font-size: 28px; font-weight: 700; 
        list-style: none; margin-bottom: 20px; font-family: 'quark';}
     body .text-list-ebook ul li::before {
        content: "";
    color: #f26522;
    font-weight: bold;
    display: inline-block;
    width: 0.7em;
    height: 0.7em;
    border-radius: 50%;
    background: #f26522;
    margin-left: -1em;
    margin-right: 15px;

        }
    body .intro-panel .slick-dots li.slick-active button:before{ color: #bc5f00; }
    body .intro-panel .slick-dots li button::before{ color: #fff; font-size: 15px;}
    body .intro-panel .slick-dotted.slick-slider{ margin-bottom: 0px; }
     body .tab-btn{ width: 100%; height: auto; text-align: right; }
     body .text-list-ebook .btn-read-ebook{ margin-top: 30px; font-size: 29px; padding: 20px 70px; background: #ca4000; border-radius: 5px; color: #fff; text-decoration: none; margin: auto;
       font-family: 'quark';}
     body .img-ebook{ padding: 0px; width: auto; height: auto; float: left; text-align: left;}
     body .img-ebook img{ width: 472px; max-width: 100%; }
        
     body .library-ebook{ padding: 0px; width: 100%; }
     body .library-ebook h5{ font-size: 25px; font-weight: 500; display: block; 
    margin-bottom: 20px; font-family: 'quark'; color: #f56423; 
    padding-left: 40px; padding-right: 40px; padding-top: 70px; text-align: left;}
     body .library-ebook h5 span{ font-size: 35px; font-weight: 700; font-family: 'quark-bold'; 
     color: #f56423; padding-right: 10px;}
     body .library-ebook ul{ width: auto; height: auto; margin: auto; padding-bottom: 30px; 
      padding-left: 0px; text-align: center;}
     body .library-ebook ul li{ width: 295px; float: unset; list-style-type: none; 
      padding-right: 34px; height: 307px; padding-left: 40px; margin: auto;
    display: inline-block;}
     body .library-ebook ul li img{ width: 100%; height: 100%; max-width: 100%  }

     body .img-ebook{ padding: 0px; width: auto; height: auto; float: left; text-align: left;}
     body .tab-more{ max-width: 100%; }
     
      body .tab-more h2{ margin-bottom: 0px; font-size: 35px; color: #464646; 
        font-family: 'quark-bold'; }
     body .header-tab-more{ font-size: 36px; font-family: quark-bold; 
      color: #706565; text-align: center;}
     body .title-img-baner{ font-size: 17px; font-family: quark-bold; color: #554e4e; 
      padding-top: 7px; }

     body .tab-more p{ padding-bottom: 25px; margin-top: 0px; color: #706565; 
      font-family: 'quark-bold'; font-size: 24px;  margin-bottom: 0px;}
    
     body .ebook-panel .btn-more{ color: #7f4e09; } 
     body .btn-more{ margin-top: 0px; font-size: 41px; border-radius: 5px; color: #fff; 
      text-decoration: none; margin: auto 0px; font-family: 'quark'; font-weight: 500; 
      z-index: 99; position: relative; margin-right: 43px;}
     body .bg-sub-left .container-fluid .row #top-banner{ width: 100%; 
     margin-left: 0px;  }
     
     body .intro-panel .btn-more{ margin-right: 15px;}
     body .info-panel .btn-more{ margin-right: 20px; color: #7f4e09; font-size: 41px;}
     body .btn-sent{ width: 50%; float: left; margin-top: 30px; font-size: 41px; padding: 20px 0px; 
      border-radius: 0px; color: #fff; text-align: center; text-decoration: none; margin: auto; text-align: justify; min-height: 105px;  }
     body .btn-sent img{ margin: auto; }
     body .services-panel .btn-sent img{ padding-top: 75px; }
     body .header-service{ background-color: #ecece4 ; }
     body .services-panel .header-service .header-tab-more{ padding-top: 40px; color: #7f4e09; font-size: 65px;
     font-family: quark; line-height: 45px; }
     body .services-panel .header-tab-more{ padding-top: 0px; color: #fe5e2c; font-size: 65px;
     font-family: quark;  }
     body .services-panel .tab-more p{ color: #7f4e09; font-size: 38px;
     font-family: quark; }
     body .white-service{ background: #ffffff; }
     body .gray-service{ background: #dfdad4; }
     body .btn-sent .header-tab-more{ margin: 5px 0px; font-size: 55px; font-family: 'quark-bold'; 
     letter-spacing: 4px; color: #7f4e09;}
     body .btn-sent p{ margin: 0px; font-size: 31px; color: #43434f; font-family: 'quark'; 
      line-height: 29px; margin-top: -15px; text-align: center;
}

   body .grid-info{ padding: 20px 0px; width: 100%; float: left; margin-bottom: 0px;}
   body .grid-info .head-grid-info{ color: #7f4e09; font-size: 65px; font-family: 'quark'; font-weight: 500; 
    padding-left: 20px; padding-right: 20px; text-align: center; max-width: 100%; 
    text-transform: uppercase;
    margin-bottom: 20px; margin-top: 25px;
    text-transform: uppercase;}

    @media (min-width: 320px) and (max-width: 480px) {
        body .grid-info{ padding: 0px 0px;}
        body .grid-info .head-grid-info{ font-size: 50px;  padding-left: 0px; margin-bottom: 0px; margin-top: 0px;}
    }

   
   body .banner-panel .title-slides:nth-of-type(1){ margin-top: 70px; }
   body .banner-panel .title-slides{  padding-left: 0px; padding-right: 0px; float: left;
    margin-top: 5px; margin-bottom: 0px; width: calc(17%); max-height: 146px;
    height: 146px; text-align: center; position: relative; background: #3b5063;}
   body .banner-panel .title-slides .text-slide-banner{ color: #fff !important; font-size: 28px; 
    font-family: 'quark'; font-weight: 500; margin: auto; width: auto; display: inline-block; position: relative;
    top: 50%; transform: translateY(-50%); z-index: 99;}

   body .grid-info ul{ width: auto; height: auto; margin: auto; padding-bottom: 50px; 
    list-style-type: none; max-width: 100%; margin-left: 0px; margin-bottom: 20px;
    }
   body .banner-panel .container-layout{ max-width: 1520px; margin: auto 0px;}
   /*body .grid-info ul li img{ width: 100%; max-width: 100%; height: auto; max-height: 406px;}
   body .grid-info ul li:nth-child(1){ width: 67%; height: auto; float: left; line-height: 0px;  }
   body .grid-info ul li:nth-child(n+2){ width: 33%; height: auto; float: right; line-height: 0px;}*/

   body .footer-panel{ width: 100%; height: auto; padding: 0px; padding-bottom: 0px; margin-left: 0px;}
   body .footer-panel .header-footer{ width: 100%; background: #3d414a; padding: 10px 0px; padding-top: 10px;}
   body .container-sitemap{ width: 100%; height: auto; background: #3d414a;
    /*background: url('../img/container-sitemap.jpg'); */
    background-size: 100%; background-repeat: no-repeat; background-position: center; 
    padding-bottom: 30px; margin-top: -2px;}
   body .footer-panel .header-footer .title-footer-h3{ max-width: 990px; width: 100%; 
    font-size: 42px; font-family: 'quark'; font-weight: 500; color: #fff; text-align: center; margin: auto;}
   body .footer-panel .foot-site{ float: left; width: auto; margin: 0px 40px; padding: 0px 0px; display: block; 
    flex: unset; }
    body .footer-panel #sitemap .foot-site ul{ margin-left: 0px; }
   body .footer-panel #sitemap .title{  
    font-size: 34px; font-family: 'quark'; font-weight: 500; color: #ffffff !important; margin-bottom: 0px;
    padding: 0px; margin-top: 0px; }
    body .footer-panel #sitemap ul li{ font-size: 24px; font-family: 'quark'; 
        font-weight: 500;  margin: auto; padding: 5px 0px; text-decoration: none; color: #fff !important;}
   body .footer-panel #sitemap ul li a{ font-size: 24px; font-family: 'quark'; 
    font-weight: 500;  margin: auto; padding: 5px 0px; text-decoration: none; color: #fff;}
   body .footer-panel #sitemap ul li span{ padding: 0px 2px; }
   body .footer-panel #sitemap ul li::before {
        display: none;
        content: "";
        color: #fff;
        font-weight: bold;
        width: 0.6em;
        height: 0.6em;
        border-radius: 1px;
        background: #fff;
        margin-left: -1em;
        margin-right: 5px;
       }
       
    /*body .footer-panel .list-footer:nth-of-type(4) div::before {
            display: none;
       }*/
    body .footer-panel .list-footer:nth-of-type(4) div{ color: #0072bc; }
    body .container-address{ background: #292c33; padding-bottom: 10px; margin-top: -2px;}
     body .adress-text{ width: 50%; float: left; padding: 15px; padding-bottom: 50px; background: transparent !important;}
     body .adress-text h5{ color: #fff; font-size: 36px; font-family: 'quark'; font-weight: 500; margin-bottom: 0px; margin-top: 10px; background: #292c33 !important;}
     body .adress-text p{ color: #fff; font-size: 26px; font-family: 'quark'; font-weight: 500; margin: 5px 0px; line-height: 1.5; background: #292c33 !important; } 
     body .adress-text p a{ color: #fff; font-size: 26px; font-family: 'quark'; 
        font-weight: 500; margin: 5px 0px; line-height: 1.5;}
        body .adress-text a:hover{ color: #ff8400; }
     body .adress-map{ 
         width: 40%; 
        float: left; 
        padding: 0px;
        
        }
    body .adress-map .container{ background: #292c33; }  
    
     body .adress-map iframe{  
         width: 95%;
        height: 330px;
        -webkit-box-shadow: 9px -10px 9px -6px rgba(0,0,0,0.23);
        -moz-box-shadow: 9px -10px 9px -6px rgba(0,0,0,0.23);
        box-shadow: 9px -10px 9px -6px rgba(0,0,0,0.23);
       }
     body .copyright-panel{ padding: 0px; background: #292c33; height: auto; padding-bottom: 0px; margin-top: -2px;}
     body .copyright-panel .img-wcag{ padding-left: 15px; }
     body .copyright-panel a{ display: inline-block; padding: 0px; font-size: 19px; 
        font-family: 'quark'; font-weight: 500; color: #fff !important; vertical-align: middle;}
     body .copyright-panel a img{ width: auto; height: auto; }
     body .copyright-panel .recommend-browser{ padding: 15px 15px; 
        display: inline-block;}
    body .copyright-panel .recommend-browser p{ color: #fff; font-family: 'quark'; font-size: 19px; font-weight: 500;  display: inline-block; margin: 5px; background: #292c33;} 
       body .copyright-panel .img-browser{  }
       body .copyright-panel .img-browser img{ display: inline-block; width: 25px; height: auto; max-width: 100%; padding: 0 5px; }
       body .stat{ float: right; text-align: right; width: auto; height: auto; margin-top: 20px;}
       body .stat img{ width: 30px; height: auto; max-width: 100%; }


       /* grid image*/

       .masonry { /* Masonry container */
    -webkit-column-count: 3;
  -moz-column-count:3;
  column-count: 3;
  -webkit-column-gap: 1em;
  -moz-column-gap: 1em;
  column-gap: 1em;
   margin: 0px;
    padding: 0;
    -moz-column-gap: 1em;
    -webkit-column-gap: 1em;
    column-gap: 1em;
    font-size: .85em;
}
.item {
    display: inline-block;
    padding: 0px;
    margin: 0;
    width: 100%;
  -webkit-transition:1s ease all;
  cursor: pointer;
  position: relative; 
}
.item .hover-imgs{ 
    position: absolute; 
    top: 0px;
    bottom: 0px;
    right: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    /* vertical-align: middle; */
    text-align: center;
    background: rgba(27, 30, 30, 0.79);
    visibility: hidden;
    opacity: 0;
    transition: visibility  0.7s, opacity 0.7s;
}
body .item .hover-imgs .hover-text{ 
    vertical-align: middle;
    font-size: 37px;
    font-family: quark;
    font-weight: 500;
    color: #fff;
    transform: translateY(-50%);
    width: 93%;
    height: auto;
    padding: 0 10px;
    letter-spacing: 2px;
    position: relative;
    top: 50%;
     }
body .fancybox-navigation .fancybox-button--arrow_left{ left: 33%;}    
body .fancybox-navigation .fancybox-button--arrow_right{ right: 33%;}
body .fancybox-button--zoom{ display: none !important; }
.item:hover .hover-imgs{ visibility: visible;
  opacity: 1; transition: opacity 0.3s linear;}  
body .fancybox-toolbar {
    right: 0;
    top: 0px;
}
.item img{max-width:100%; width: 100%;}

body .logo{ width: 50px; height: auto; padding: 15px; margin-top: 20px; 
  margin-bottom: 0px; z-index: 999;
    position: relative;}
body .logo img{ width: 100%; height: auto; max-width: 100%; }

body .btn-font{    
    background: #ffffff;
    color: #000000;
    font-size: 15px;
    line-height: 35px;
    border-radius: 50px;
    font-weight: 700;
    font-family: 'quark';
}
body .btn-color{ background: #000; color: #fff; padding: 12px 15px; font-size: 15px;
  line-height: 35px; font-family: quark-bold;
    font-weight: 700;}
  .hr-style{ border-bottom: 1px solid #df9242;
    padding: 0px 16px;
    border-top: 0px;
    margin: 0px 15px;}
@media only screen and (max-width: 480px) {
    .masonry {
        -moz-column-count: 1;
        -webkit-column-count: 1;
        column-count: 1;
    }
}

@media only screen and (min-width: 481px) and (max-width: 768px){
    .masonry {
        -moz-column-count: 2;
        -webkit-column-count: 2;
        column-count: 2;
    }
}
@media only screen and (min-width: 769px) and (max-width: 1200px){
    .masonry {
        -moz-column-count: 3;
        -webkit-column-count: 3;
        column-count: 3;
    }
}
@media only screen and (min-width: 1201px) {
    .masonry {
        -moz-column-count: 3;
        -webkit-column-count: 3;
        column-count: 3;
    }
}
@media only screen and (min-width: 1400px) {
    .masonry {
        -moz-column-count: 4;
        -webkit-column-count: 4;
        column-count: 4;
    }
}
body .card-chart-2{
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 0px solid rgba(0,0,0,.125);
    border-radius: .25rem;
    padding-left: 0px !important;
    padding-right: 0px !important;
}

body .card-header {
    background-color: unset;
}

.card-header {
    padding: .75rem 1.25rem;
    margin-bottom: 0;
    border-bottom: 1px solid rgba(0,0,0,.5);
}
body .btn-success {
    color: #fff;
    background-color: #036829;
    border-color: #036829;
    height: auto;
}
body .intro-panel .btn-success { font-size: 18px; }

.btn-event-2 {
    padding: 0px;
    width: unset !important;
    background-color: transparent;
    display: flex;
}

/* body .btn {
    display: inline-block;
    font-weight: 400;
    text-align: center;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid transparent;
    padding: 9px 12px;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: .25rem;
    transition: color .15s ease-in-out,background-color .15s 
    ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
} */
body .col-2{ 
    flex: 0 0 49%;
    max-width: 49%;
    margin: 10px 5px;
}
body .bg-chart{ background: #F7F7F7; }
body .card-body{
    background: none;
    flex: 1 1 auto;
    padding: 7px 12px;
    color: #747474;
    
}
body .card-body .pb-0{ /*border: 1px solid rgba(0,0,0,.5);*/ border-radius: 3px; }
body .chart-pie{ display: none; width: 17px; height: auto; }

.btn-light {
    color: #212529;
    background-color: #f8f9fa;
    border-color: #f8f9fa;
    font-family: 'quark-bold';
    font-weight: 700;
    height: auto;
}
.btn-group{
     padding-right: 10px;
   }
.btn-group, .btn-group-vertical {
    position: relative;
    display: -ms-inline-flexbox;
    display: inline-flex;
    vertical-align: middle;
}

.btn-group>.btn-group:not(:last-child)>.btn, .btn-group>.btn:not(:last-child):not(.dropdown-toggle) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.btn-light:not(:disabled):not(.disabled).active, .btn-light:not(:disabled):not(.disabled):active, .show>.btn-light.dropdown-toggle {
    color: #212529;
    background-color: #dae0e5;
    border-color: #d3d9df;
}
body #container-content{ background: #ffffff; }
body .container-fluid{ padding-left: 0px; padding-right: 0px; background: #fff;}
.card-body{ font-family: 'quark-bold'; font-size: 22px; font-weight: 700;}
.card-body .card-div1{ padding-bottom: 0px; padding-top: 0px;  margin: 0px 7px 0px 1px;}
.card-body .card-div1 .number-text{ font-size: 42px; }
.card-body .card-div1 .default-text{ font-size: 19px; }
.card-body .col{ font-family: 'quark-bold'; font-size: 19px; font-weight: 700; }
.card-body .col-2{ width: 50%; float: left; padding: 7px;  }
.card-body .col-3{ width: 34%; float: left; padding: 9px; min-height: 203px;}
.card-body .col-3 .card{ min-height: 330px !important; }
.tab1-2 .card-body .col-3 .card-chart-3{ min-height: 210px; }
.tab1-2 .card-body{ margin: 12px 0px; }
.col-2 .card-chart-2{ min-height: 354px; }
body .card-chart-2 .row{ margin-left: 0px; margin-right: 0px;}
.col-indsie-2{ width: 50%; float: left; padding-top: 10px;  }

.card-body .number-text{ color: #000; font-size: 42px; font-family: 'quark-bold';
    font-weight: 700; }
.card-body .default-text{ font-weight:bold; font-size: 19px; text-align:center; 
color: #5a5252;  margin-bottom: 0px; margin-top: 0px; padding-bottom: 10px; padding-left: 10px;
padding-right: 10px; }
.card-body .col-indsie-2 .default-text{ min-height: 55px; text-align: center;
    padding-left: 20px;
    padding-right: 20px; padding-bottom: 30px;}
.card-body .col-indsie-2 .number-text{  color: #007236; font-size: 29px; text-align: center;
    padding-top: 32px;
    margin-bottom: 0px;
    margin-top: 0px;}

body .title-description{ font-size: 19px;  font-family: 'quark-bold';
    font-weight: 700; color: #747474; }
body .tab1-1 .title-description{ font-size: 22px;  font-family: 'quark-bold';
    font-weight: 700; color: #3e3a3a; }
body .description{ font-size: 17px;  font-family: 'quark-bold';
    font-weight: 700; margin-bottom: 0px;}

body .card-deck .card{ 
    width: 24%;
    float: left;
    margin: 10px 6px; 
    max-height: 369px;
    min-height: 369px;
   }
body .card-deck .card .py-0{ min-height: 150px; }
body .card-deck .card .py-0 p{ color: #0072bc; font-family: 'quark-bold';
    font-weight: 700; font-size: 19px;}
body .btn-group .btn{ border-color: #d3d9df; }
body .btn-group #btn2{ border-top-left-radius: 0; border-bottom-left-radius: 0; }
.btn-more-success{ font-family: 'quark-bold'; margin-top: 70px; margin-bottom: 30px;
    font-weight: 700; font-size: 25px; padding: 25px 20px; }

.group-head-content{ display: inline-block; width: 48%; 
  margin-left: 8px; margin-top: 10px; margin-bottom: 20px;}
.tab1-2 .group-head-content{ margin-bottom: 0px; } 
.img-logo-header{ width: 43px; height: 36px; display: inline-block; }
.group-head-content .title-group{ width: auto; height: auto; display: inline-block; padding-left: 12px;}
.group-head-content .title-group h5{ width: auto; height: auto; font-family: 'quark-bold';
    font-weight: 700; font-size: 27px; display: block;
    color: #393939 !important; margin-bottom: 0px;
    margin-top: 0px; line-height: 17px;
   }
.group-head-content .title-group p{ width: auto; height: auto; font-family: 'quark-bold';
    font-weight: 700; font-size: 17px; display: inline-block; 
    margin-top: 0px;  margin-top: 0px; }

body .card-body .title-chart{ display: inline-block; font-size: 22px; width: 30%;}
body .card-body .info-chart{ display: inline-block; float: right; margin-top: 7px; 
  font-size:15px; font-family: 'quark-bold'; width: 60%;
font-weight: 700;}

body .services-panel .btn-sent{ min-height: 468px; }
body .services-panel .btn-sent:hover{ background: #ff7d01; transition: background 0.5s linear;}
body .services-panel .btn-sent:hover .img-btn-a{ display: none; visibility: hidden; opacity: 0; transition: 
  visibility 0.7s, opacity 0.9s; 
}
body .services-panel .btn-sent .img-btn-b{ visibility: hidden; opacity: 0; display: none;}
body .services-panel .btn-sent:hover .img-btn-b{ display: block; visibility: visible; opacity: 1;
    transition: visibility 0.5s, opacity 0.5s linear; }
body .services-panel .btn-sent:hover .header-tab-more{ color: #fff; transition: color 0.5s linear;}
body .services-panel .btn-sent:hover p{ color: #fff; transition: color 0.5s linear;}