/*[Content Template]*/
.SGTC0001 { overflow:hidden; border:1px solid #AAA; margin-bottom:5px ; background: #FFF; }
.SGTC0001 h2 { display:block; height:35px }
.rtl .SGTC0001 h2 span { display:block; font:16px/35px 'B koodak', 'koodak', Arial; color:#000; padding:0 5px }
.ltr .SGTC0001 h2 span { display:block; font:bold 13px/35px Arial; color:#000; padding:0 5px }
.SGTC0001 .TCB { text-align:justify; padding:7px 5px 2px }
.rtl .SGTC0001 .TCB strong, .rtl .SGTC0001 .TCB b { font:14px 'B koodak', 'koodak', tahoma }
.SGTC0001 .TCB hr { border:none; border-top:1px solid #666 }
.SGTC0001 .FOT { height:20px; clear:both; padding:2px 5px }
.SGTC0001 .FOT span { padding:0 3px }
.SGTC0001 .BGCF1 { background:#F1F1F1 }
.SGTC0001 .BGDY { background:url(../images/ContentTemplate/SGTC0001Dark.jpg) left top repeat-x }
.SGTC0001 .BGDR { background:url(../images/ContentTemplate/SGTC0001Dark.jpg) left -45px repeat-x }
.SGTC0001 .BGDO { background:url(../images/ContentTemplate/SGTC0001Dark.jpg) left -90px repeat-x }
.SGTC0001 .BGDG { background:url(../images/ContentTemplate/SGTC0001Dark.jpg) left -135px repeat-x }
.SGTC0001 .BGDB { background:url(../images/ContentTemplate/SGTC0001Dark.jpg) left -180px repeat-x }
.SGTC0001 .BGDV { background:url(../images/ContentTemplate/SGTC0001Dark.jpg) left -225px repeat-x }
.SGTC0001 .BGDC { background:url(../images/ContentTemplate/SGTC0001Dark.jpg) left -270px repeat-x }
.SGTC0001 .BGDP { background:url(../images/ContentTemplate/SGTC0001Dark.jpg) left -315px repeat-x }
.SGTC0001 .BGLY { background:url(../images/ContentTemplate/SGTC0001Light.jpg) left top repeat-x }
.SGTC0001 .BGLR { background:url(../images/ContentTemplate/SGTC0001Light.jpg) left -45px repeat-x }
.SGTC0001 .BGLO { background:url(../images/ContentTemplate/SGTC0001Light.jpg) left -90px repeat-x }
.SGTC0001 .BGLG { background:url(../images/ContentTemplate/SGTC0001Light.jpg) left -135px repeat-x }
.SGTC0001 .BGLB { background:url(../images/ContentTemplate/SGTC0001Light.jpg) left -180px repeat-x }
.SGTC0001 .BGLV { background:url(../images/ContentTemplate/SGTC0001Light.jpg) left -225px repeat-x }
.SGTC0001 .BGLC { background:url(../images/ContentTemplate/SGTC0001Light.jpg) left -270px repeat-x }
.SGTC0001 .BGLP { background:url(../images/ContentTemplate/SGTC0001Light.jpg) left -315px repeat-x }

/*[Tabs]*/
.General-Tab {background:#FFF; margin-bottom:5px;}
.General-Tab ul {margin:0 !important; padding:0 !important;}
.General-Tab ul.tabs { margin:0; padding:0; font-size:0; border:1px solid #aaaaaa; border-bottom:none; }
.General-Tab ul.tabs li { display:inline-block; *display:inline; font-size:13.2px; height:30px; }
.General-Tab ul.tabs li a { cursor: pointer; display:block; height:100%; line-height:30px; padding:0 7px; color:#000 !important }
.General-Tab ul.tabs .tab-current { background:#FFF; }
.General-Tab .tabsContent { display:none; border:1px solid #AAA; border-top:none; padding:4px; }
.General-Tab ul.GrayTab { background:#F1F1F1 url(../images/ContentTemplate/SGTC0001Light.jpg) left top repeat-x; }
.General-Tab ul.RedTab { background:#F1F1F1 url(../images/ContentTemplate/SGTC0001Light.jpg) left -45px repeat-x; }
.General-Tab ul.GoldTab { background:#F1F1F1 url(../images/ContentTemplate/SGTC0001Light.jpg) left -90px repeat-x; }
.General-Tab ul.GreenTab { background:#F1F1F1 url(../images/ContentTemplate/SGTC0001Light.jpg) left -135px repeat-x; }
.General-Tab ul.BlueTab { background:#F1F1F1 url(../images/ContentTemplate/SGTC0001Light.jpg) left -180px repeat-x; }
.General-Tab ul.VioletTab { background:#F1F1F1 url(../images/ContentTemplate/SGTC0001Light.jpg) left -225px repeat-x; }
.General-Tab ul.CyanTab { background:#F1F1F1 url(../images/ContentTemplate/SGTC0001Light.jpg) left -270px repeat-x; }
.General-Tab ul.PinkTab { background:#F1F1F1 url(../images/ContentTemplate/SGTC0001Light.jpg) left -315px repeat-x; }

/* Content Template goes Here ... */

.MainHtm { height: 50px;    position: relative;  z-index: 2;}
 .site-license { background:#000; padding: 20px 0;  }
 .FootBack { background: #151515;     border-bottom: 1px solid #222222;    padding: 60px 0 30px 0;}
 .HeadTop { display: flex;  top: 25px;   justify-content:space-between; position: relative;}
 .Contact-Ex {/*width: 30%;*/} 
 .cont-Search { /*width: 30%;*/}
 .rtl .SideRight { position: absolute; z-index: 2;   left: 0; right: 0; margin: 0 auto;   bottom: 20%;}
 .ltr .SideRight { position: absolute; z-index: 2;   left: 0; right: 0; margin: 0 auto;   bottom: 20%;}

 .CateBox img { height: 30px; width: 30px; }
 .MainCate  {display: flex; justify-content: space-between;  }
 .CateBox { border:1px solid #eee;  padding: 2%;  background: rgba(0,0,0,0.5);  text-align: center;  transition: all ease-in-out 0.3s; }
 .CateBox:hover { border:1px solid #ffc451}
  .LTB { display: block; margin-top: 10px;}
  .LTB a { color:#fff; font-weight: bold; font-size: 16px;   font-family:Shabnam; transition: all ease-in-out 0.3s;}
  .LTB a:hover { color:#ffc451;}
  .AboutClass { padding: 5%; font-family:Shabnam;  }
  .AboutClass .Title h3 {font-weight: 700; font-size: 28px; color: #444444; margin-bottom: 10px;}
  .AboutClass .Defaine { font-style: italic !important; color: #444444;  font-size: 16px;}
  .SlideShowBox { position: relative;}
  .DivDef { display: flex;     align-items: center;  font-family:Shabnam; margin: 15px auto;}
  .DivDef .MgDef { margin: 10px;}
  .DivDef .MgDef img { height: 40px; width: 40px;}
  .DivDef .TxTDef h4 {  font-family:Shabnam; font-size: 16px;     font-weight: bold;     color: #000;}
  .DivDef .TxTDef p { line-height: 28px;}
  .TTBC  { margin-top: 5%;}
  .TTBC .TitleClass { display: flex; justify-content: start;}
  .TTBC .TitleClass a { font-size: 14px;     font-weight: 500;    padding: 0;    line-height: 1px;    margin: 0 10px ;    letter-spacing: 2px;
    text-transform: uppercase;    color: #aaaaaa;}
  .TTBC .TitleClass span { height: 1px; background:#ffc451; width: 200px; font-size: 0; }
  .TTBC .TopTitle { margin:10px;    font-family:Shabnam;      font-size: 36px;    font-weight: 700;    text-transform: uppercase;    color: #151515;}

.ProClass { display: flex; justify-content: space-between; }
.ProBox {text-align: center;     border: 1px solid #ebebeb;    padding: 80px 20px;    transition: all ease-in-out 0.3s;  
      background: #fff; width: 40%;     margin: 2%;}
.ProBox:hover {border-color:#ffc451;  background: #ffc451;    box-shadow: 0px 0 25px 0 rgba(0, 0, 0, 0.1);     transform: translateY(-10px);}
.ProClass .More { margin-top: 10px;}
.ProClass .More .Detail {  display: flex; justify-content: center; align-items: center;}
.ProClass .More  a { color: #ffc451;  font-family:Shabnam; transition: all ease-in-out 0.3s; font-size: 14px;}
.ProClass:hover .More  a {  color: #fff;}
.ProClass .More img  { width: 30px; height: 30px; margin: 0 10px;}
.ProBox .TxTPro h4 { color: #151515; font-family:Shabnam; margin-bottom: 10px;     transition: ease-in-out 0.3s; font-weight: 700;    font-size: 26px; transition: all ease-in-out 0.3s;}
.ProBox:hover .TxTPro h4 { color: #FFF;}
.ProBox .TxTPro p {color: #444444; font-family:Shabnam; font-size: 16px; transition: all ease-in-out 0.3s; line-height: 30px; }
.ProBox:hover .TxTPro p { color: #fff; }

.PriceClass { background: #000; padding: 5%; display: flex; justify-content:space-around; text-align: center;}
.MoneyBox { position: relative; margin: 2%;}
.MoneyBox .MonTxt {background: #fff;     position: absolute;    width: 80%;    margin: 0 auto;    z-index: 5;
    bottom: -30px;    padding: 5%;    left: 0;    right: 0;    text-align: center;}
.MoneyBox .MonTxt p { line-height: 40px; border-bottom: 1px solid #eee; font-size: 13px; font-family:Shabnam;}
.MoneyBox .MonTxt p:last-child { border-bottom: none;}
.MoneyBox:hover .MgMon img { opacity: 1; transition: all ease-in-out 0.5s;}
.MoneyBox:hover .MgMon img {opacity: 0.5; }
.MoneyBox .MoreMoney { margin: 15px auto; border:1px solid #ffc451; width: 100px; padding: 10px; border-radius: 30px; text-align: center; transition: ease-in-out 0.3s;}
.MoneyBox .MoreMoney a { color: #ffc451;}
.MoneyBox:hover .MoreMoney { background: #ffc451;}
.MoneyBox:hover .MoreMoney a { color: #fff;}
.template-box { padding: 1% 0;}
.MoveBox { margin: 5%;    text-align: center;   padding: 5%; border: 1px solid #eee;     border-radius: 10px;}
.MoveBox h4 { font-size: 22px; color: #000;     line-height: 28px; font-family:Shabnam;}
.MoveBox p {   color: #555555;   font-weight: 400;  font-family:Shabnam;  font-size: 15px;   line-height: 27px;  }
.MoveBox .MoreMv a { background: #ffc451; padding: 5px;  display: block; color: #fff; font-family:Shabnam;   border-radius: 5px;    width: 100px;    margin: 15px auto;}
.MoveBox .MoreMv:hover a { background: #e7af3d;}
 
.rtl .ContBox {   text-align: right;     color: #fff; font-family:Shabnam; line-height: 28px;}
.rtl .ContBox .Cont .XDF { font-size: 16px; font-weight: bold; display: block;  font-family:Shabnam;  }
.rtl .Cont a {  color: #ffc451;}
.rtl .ContBox .RashaLogo img { height:70px;}
.ltr .ContBox {   text-align: left;     color: #fff; font-family:Shabnam; line-height: 28px;}
.ltr .ContBox .Cont .XDF { font-size: 16px; font-weight: bold; display: block;  font-family:Shabnam;  }
.ltr .Cont a {  color: #ffc451;}
.ltr .ContBox .RashaLogo img { height:70px;}
 .LinkUs h3 {display: block;   line-height: 30px;
  margin-top: 10px;  text-align: right;   font-size: 16px;
    font-weight: 600; color: #fff;    font-family: Shabnam; margin-bottom: 20px;}
 .LinkUs p { line-height: 30px; color: #fff; font-size: 14px; font-family: Shabnam; text-align: right;}
 .LinkUsEn h3 {display: block;   line-height: 30px;
  margin-top: 10px;  text-align: left;   font-size: 16px;
    font-weight: 600; color: #fff;    font-family: Shabnam; margin-bottom: 20px;}
 .LinkUsEn p { line-height: 30px; color: #fff; font-size: 14px; font-family: Shabnam; text-align: left;}
 .LinkUsEn .FormEn { position: relative; height: 40px;   width: 100%;  display: block; overflow: hidden; background: #fff;   border-radius: 5px;}
  .LinkUsEn .Sub {  background: #ffc451;   color: #151515;  font-family: Shabnam;   padding: 0 10px;   border-radius: 4px 0 0 4px; 
    width: 100px;  height: 40px;   line-height: 38px;   float: right;} 




 .BoxNews { margin-top: 30px;     background: #fff;     position: relative;    border-radius: 4px; display: block;
    width: 100%;     height: 40px;   line-height: 40px;   }
.BoxNewsLink  { background: #ffc451;   color: #151515;  font-family: Shabnam;   padding: 0 10px;   border-radius: 4px 0 0 4px; width: 100px;     float: left;}
.MDBox { display: flex;     justify-content: space-between;    align-items: center;}
.MDBox .MGMain img { max-width: 100%;     height: auto; transition: all ease-in-out 0.5s;}
.MDBox .MGMain:hover img {transform: scale(0.97);}
.MDBox .MGMain { border: 2px solid #fff; transition: all ease-in-out 0.5s; font-size: 0;  background: #fff;}
.MDBox .MGMain:hover {border: 2px solid #ffc451;}
.LinkUs .Form { position: relative; height: 40px;   width: 100%;  display: block; overflow: hidden;
  border-radius: 5px;}
 .LinkUs .Form  textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"],
   input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"]{height: 40px;
    width: 100%;}

       
 

    .BoxMC .TiTleCopper { margin: 20px auto;}
   .BoxMC .TiTleCopper h3 {color: #222222; font-size: 23px;     line-height: 30px;
    margin-bottom: 20px;     font-weight: 700; font-family: Shabnam;     font-size: 20px;    line-height: 30px;  }

    .LinkPage{ margin-top: 15px;}

    .BoxMC { padding: 2% 0; }
    .BoxMC .BackTopClass{ background: #ffc451; text-align: center; padding: 3% 0; }
    .BoxMC .BackTopClass .TopTMC { font-size: 32px; color: #000; font-weight: bold;}
    .BoxMC .BackTopClass .LinkPage a { padding: 0 10px; display: inline-block;  font-size: 12px; color: #000; }
    .rtl .Card {    margin: 20px auto; font-family: Shabnam; }
    .rtl .Card h5 { font-size: 18px; color: #000; font-weight: bold; margin-bottom: 10px; font-family: Shabnam; }
    .rtl .CardList {border:1px solid #ddd; background: #f1f2f3;       padding: 2%; font-size: 13px; font-family: Shabnam; line-height: 30px;   }
    .rtl .CardList  .DetaiBox {background: #f9f9f9;       margin: 20px;      padding: 10px;}
    .rtl .Card .DetaiBox p {line-height: 30px;}



    .ltr .Card {    margin: 20px auto;  font-family:AlteHaasGroteskRegular !important; }
    .ltr .Card  td {  font-family:AlteHaasGroteskRegular !important;}
    .ltr .Card h5 { font-size: 18px; color: #000; font-weight: bold; margin-bottom: 10px;  font-family:AlteHaasGroteskRegular !important;}
    .ltr .CardList {border:1px solid #ddd; background: #f1f2f3;       padding: 2%; font-size: 13px; font-family:AlteHaasGroteskRegular !important; line-height: 30px;   }
    .ltr .CardList  .DetaiBox {background: #f9f9f9;       margin: 20px;      padding: 10px;}
    .ltr .Card .DetaiBox p {line-height: 30px;}


    .ClassCard { padding: 2%;}
    .ClassCard .MGCard { font-size: 0;}
    .ClassCard p {font-size: 20px; color: #000; font-weight: bold; line-height: 30px; margin-bottom: 10px; font-family: Shabnam; }
 
   .ItemBoxList { background: #f3f3f3; font-family: Shabnam; display: flex; width: 94%; padding: 3%;  margin: 2% auto;    justify-content: space-between; } 
   .ItemBoxList  .ListItem { margin: 20px auto;}
   .ItemBoxList  .ListItem h5 {font-size: 20px; color: #000; font-weight: bold; margin-bottom: 10px; font-family: Shabnam;}
   .ItemBoxList  .ListItem h6 {font-size: 18px; color: #000; font-weight: bold; margin-bottom: 10px; font-family: Shabnam;}
   .ItemBoxList  .ItemBox img { width: 20px;height: 20px; margin: 0 10px;}
   .ItemBoxList  .ItemBox p { line-height: 30px; color: #000; font-size: 14px; font-family: Shabnam; display: flex;
    align-items: center;}


 .OlgoStl  { width: 94%; padding: 3%;}   
.OlgoStl .MainSTL { margin: 20px auto; font-family: Shabnam;}
.OlgoStl .MainSTL h5 { font-size: 22px; color: #000; font-family: Shabnam;}
.OlgoStl .Maintain { color: #000; font-size: 14px; font-family: Shabnam; margin: 10px auto;}
.OlgoStl .KLU .MCK { text-align: center; margin: 10px 20px;}
 .OlgoStl .KLU .MCK img { width: 30px; height: 30px; }
 .OlgoStl .KLU .MIS h3 {font-size: 18px; color: #000; font-weight: bold; margin-bottom: 10px; font-family: Shabnam;}
 .OlgoStl .KLU .MIS p { line-height: 30px; color: #000; font-size: 14px; font-family: Shabnam;}
 .OlgoStl .MKHU { display:inline-block;  }
 .OlgoStl .KLU { display: flex; align-items: center; margin: 1%; width:47%;  float: right; min-height: 130px; border:1px solid #ddd} 
 .OlgoStl .KLU:hover { border:1px solid #ffc451}


 .OlgoStlClass { padding: 3%; background: #000; width: 94%;}
 .OlgoStlClass .MainSTLCs h5 {font-size: 18px; color: #fff; font-weight: bold; margin-bottom: 10px; font-family: Shabnam;}
 .OlgoStlClass img { width: 30px; height: 30px; margin: 10px 20px; float: right;  }
 .OlgoStlClass .MKGF { display: flex; justify-content: space-between; font-family: Shabnam;}
 .OlgoStlClass .MKGF p {display: flex; align-items: center; font-family: Shabnam; color: #fff; line-height: 30px;
  font-size: 14px; }
 


.AboutBox  { padding: 3%;  font-family: Shabnam;}
.AboutBox  h3 {  color: #000; padding: 10px; font-size: 22px; margin-bottom: 10px; font-family: Shabnam; }
.AboutBox p { line-height: 40px; font-size: 16px;  font-family: Shabnam;  color: #000;}

 .Card  table {border:1px solid #ccc; font-family: Shabnam;}
 .Card  table tr:nth-child(1) { background: #ffca61; color: #000; padding: 10px;}
 .Card  table td { padding: 5px; text-align: center; border:1px solid #ddd; font-size: 14px; font-family: Shabnam;}


 .StlClass { background: #f9f9f9; width: 94%; display: flex; padding: 3% ;  justify-content: space-between; font-family: Shabnam; margin: 2% auto;} 
 .StlClass .MainSTLCss h5 { font-size: 18px; color: #000; font-weight: bold; margin-bottom: 10px; font-family: Shabnam;}
 .StlClass .MfKGF p { display: flex; align-items: center; font-family: Shabnam; font-size: 14px; }
 .StlClass .MfKGF img {width: 30px; height: 30px; margin: 10px 20px;}
 .template-ِDetain {   width: 100%;} 
 .StlClass .Pickh { text-align: center;}
 .StlClass .Pickh img { height: 300px;}


 .MainClassDetail td { display: block; float: right; width: 48% !important;}
 .MultiCopper  { font-size: 0;}



 .Map { padding: 3%;  }
 .Map .iframe { margin: 2% auto;}
 .Location { display: flex; justify-content: start; align-items: center; font-family: Shabnam; }
  .Location p { font-size: 16px; line-height: 40px;}
 .Map .MP { background: #ffc451; width: 44px; height: 44px; margin:10px;}
 .Map .MP img { height: 30px; margin: 7px;}
 .LOC   { display: flex; justify-content:start}
 .LOC .Email {  display: flex; justify-content: start; align-items: center; font-family: Shabnam;}
 .LOC .Email p { font-size: 16px; line-height: 40px;}
 .LOC .Call {display: flex; justify-content: start; align-items: center; font-family: Shabnam;}
 .LOC .Call p { font-size: 16px; line-height: 40px;}



 .copperdefine p { line-height: 30px; font-size: 14px; color: #151515;  font-family: Shabnam;}

 .copperdefineLIne .fineLIne { display: flex; justify-content: space-between; font-family: Shabnam;}
 .copperdefineLIne  p { line-height: 40px; color: #000; font-size: 16px; font-family: Shabnam;}

.MBoxItem img {max-height: 500px;}
 
 .LogoBHKK { display: flex; justify-content: space-between;  font-family: Shabnam; }
 .divOHG img { height: 40px; width: 40px; margin: 10px;}
 .MKHO { padding: 2%; margin: 2%; background: #fff;  font-family: Shabnam; 
  box-shadow: 0 0 0 10px #ddd; transition: all ease-in-out 0.5s;}
 .MKHO:hover {   box-shadow: 0 0 0 10px #e7af3d;  }
 .divOHG { display: flex;   justify-content: start;  align-items: center;  font-family: Shabnam; }
 .MainShs h5 {line-height: 30px; color: #000; font-size: 16px; font-family: Shabnam; margin-bottom: 10px;}
 .divOHG p { line-height: 30px; color: #000; font-size: 14px; font-family: Shabnam;}
 .MainShs h2 { line-height: 30px; color: #555; font-size: 13px; font-family: Shabnam; margin: 10px 0;}
 .MKHO h2 {line-height: 30px; color: #555; font-size: 13px; font-family: Shabnam; margin: 10px 0;}
 .MCOL { margin: 1% auto; font-size: 0;}
 .MCOL img { max-height: 500px;}


 .TopBody { margin-top: 120px;}

.TopScroll { padding-top:5% }
 html {
  scroll-behavior: smooth;
}