body{overflow-x:hidden;}
/* CARMOD CONTENT */
.mainBox{background: center url("../images/SlideBack.jpg"); margin-top: -65px; padding: 65px 0px 20px 0px; background-attachment: fixed;}

/* HEADER */
.mainBoxHead {z-index:900; width:100%; position:sticky; top: 0; display:flex; justify-content:center; align-items:center; height: 65px; transition: all 1s ease-in-out;}
.boxHead {display: flex; width: 100%; justify-content:space-between; align-items:center; padding: 0px 0px; max-width: 1320px;}
.NsMenuLinks{transition:all 0.3s; display:flex; flex-shrink:0; justify-content:space-between; align-items:center; width:500px;}
.NsMenuLinks a{position:relative; color:#ffffff; text-transform:uppercase; font-size:14px; padding:5px 10px; transition:all 0.4s; border-radius: 5px;}
.activeMenuItem:after{display: block; content: ""; height: 2px; top: -1px; width: 0%; left: 50%; background-color: #ffffff; position: absolute; -webkit-transition: width .3s ease-in-out; -moz--transition: width .3s ease-in-out; transition: width .3s ease-in-out; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); transform: translateX(-50%);}
.actMenuBackg{background-color:#fa6a00;}
.MsStickPos{background-color: rgba(0, 0, 0, 0.5);}

/* ANIMATION TOP BORDER ON HOVER */
.MsAnimTopBor:after {display: block; content: ""; height: 2px; top: -1px; width: 0%; left: 50%; background-color: #ffffff; position: absolute; -webkit-transition: width .3s ease-in-out; -moz--transition: width .3s ease-in-out; transition: width .3s ease-in-out; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); transform: translateX(-50%);}
.MsAnimTopBor:hover:after { width: 100%;}

/* CONTACTS */
.boxCMail{max-width:1180px; margin:auto; display:flex; justify-content:space-between; align-items:flex-start; border-radius:4px; box-shadow: 2px 2px 8px rgba(0,0,0,0.4); background-color:#f5f5f5; height:100%; background-image: url(/media/images/email.svg); background-repeat: no-repeat; background-size:40%; background-position: 0% 9px; position: relative;}
.CmContacnForm{display:flex; flex-direction:row; align-items:center; margin:50px auto 0px auto; padding:50px 100px; background:#ffffffd9;}

.BoxConIcon{padding:0 60px 0 0; color:#383838;}
.BoxMessUs{padding:0 0 0 60px; border-left:3px solid #fa6a00; }
.CmBoxEml{margin-bottom:40px; text-align:center; color:#383838;}
.CmBoxEml a{transition:0.2s;}
.CmBoxEml a:hover{fill:#fa6a00!important;}

.CmContTitle{font-size:30px; color:#383838;}
.CuInputWrap input{width: 50%;}
.TextA{padding:10px 10px 10px 5px; border-radius:3px; border:none; border:1px solid #cdcdcd; margin-bottom:15px;}
.TextA:focus{outline: 1px solid #fa6a00;}
/*.ButDiv{padding:10px; border-radius:8px; border:none; border:1px solid #cdcdcd; color:#ffffff; background-color:#fa6a00; box-shadow: 2px 2px 8px rgba(0,0,0,0.4); align-self: flex-end; transition: all .3s ease-in-out;}
.ButDiv:hover{background-color: #fff; border: 1px solid #fa6a00; color: #fa6a00;}*/
.ques_form{display:flex; flex-direction:column; align-items:flex-start;}
.CuInputWrap{display: flex; justify-content: space-between; align-items: center; gap: 20px; width: 100%;}
.CmChat{color:#505050; text-align:center;}
.CmContSkype{width:60px; height:60px; margin-bottom:10px;}
.CmSkyprChatBlock{margin: 15px 0px 50px 0px}
textarea.TextA{width:100%;}

/*Demo Popup*/
.DemoOverlay{pointer-events: none; display:flex; transition: 0.35s ease-in-out; opacity: 0; overflow:hidden; position:fixed; left:0; top:0; justify-content:center; align-items:center; text-align:center; white-space:nowrap; width:100%; height:100%; background-color:rgba(0,0,0,0.5); z-index:999;}
.DemoMessBlock{pointer-events: none; transform: translate(0, -10px); opacity: 0; transition: 0.35s ease-in-out; z-index:999999; overflow:hidden; display:flex; flex-direction:column; align-items:center; position:relative; padding:30px; margin:20px; white-space:normal; background-color:#ffffff; color:#000; box-shadow:0px 3px 6px rgba(0,0,0,0.6); border:2px solid #0083ca; }
.DemoMessBlock span{font-size:12px;}
.DemoContent{pointer-events: none; transform: translate(0, -10px); opacity: 0; transition: 0.35s ease-in-out; font-size:22px; color:#505050;}
div.OpenContent{transform: translate(0, 0px); opacity: 1; pointer-events: inherit;}
div.OpenOver{opacity: 1; pointer-events: inherit;}
.DemoClose{cursor:pointer; width:25px; height:25px; background-image:url(images/fxClose.png); background-repeat:no-repeat; background-position:50% 50%; background-size:25px; z-index:999; position:absolute; right:3px; top:3px;}
.DemoImg{width:100px; height:120px; margin:0px 0px 25px 0px;}

/* Mobile header menu*/
@import url('https://fonts.googleapis.com/css?family=Work+Sans:300,600');

/* navigation styles start here */

/* changed this from the tutorial video to
   allow it to gain focus, making it tabbable */
.nav-toggle {
  position: absolute !important;
  top: -9999px !important;
  left: -9999px !important;
}

.nav-toggle-label {
  position: absolute;
  top: 0;
  left: 0;
  margin-left: 1em;
  height: 100%;
  display: flex;
  align-items: center;
}

.nav-toggle-label span,
.nav-toggle-label span::before,
.nav-toggle-label span::after {
  display: block;
  background: white;
  height: 2px;
  width: 2em;
  border-radius: 2px;
  position: relative;
}

.nav-toggle-label span::before,
.nav-toggle-label span::after {
  content: '';
  position: absolute;
}

.nav-toggle-label span::before {
  bottom: 7px;
}

.nav-toggle-label span::after {
  top: 7px;
}

nav {
  position: absolute;
  text-align: left;
  top: 100%;
  left: 0;
  background: var(--background);
  width: 100%;
  transform: scale(1, 0);
  transform-origin: top;
  transition: transform 400ms ease-in-out;
}

nav ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

nav li {
  margin-bottom: 1em;
  margin-left: 1em;
}

nav a {
  color: white;
  text-decoration: none;
  font-size: 1.2rem;
  text-transform: uppercase;
  opacity: 0;
  transition: opacity 150ms ease-in-out;
}

nav a:hover {
  color: #000;
}

.nav-toggle:checked ~ nav {
  transform: scale(1,1);
}

.nav-toggle:checked ~ nav a {
  opacity: 1;
  transition: opacity 250ms ease-in-out 250ms;
}

@media screen and (min-width: 800px) {
  .nav-toggle-label {
    display: none;
  }

  header {
    display: grid;
    grid-template-columns: 1fr auto minmax(600px, 3fr) 1fr;
  }

  .logo {
    grid-column: 2 / 3;
  }

  nav {
    all: unset; /* this causes issues with Edge, since it's unsupported */

    /* the following lines are not from my video, but add Edge support */
    position: relative;
    text-align: left;
    transition: none;
    transform: scale(1,1);
    background: none;
    top: initial;
    left: initial;
    /* end Edge support stuff */

    grid-column: 3 / 4;
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }

  nav ul {
    display: flex;
  }

  nav li {
    margin-left: 3em;
    margin-bottom: 0;
  }

  nav a {
    opacity: 1;
    position: relative;
  }

  nav a::before {
    content: '';
    display: block;
    height: 5px;
    background: black;
    position: absolute;
    top: -.75em;
    left: 0;
    right: 0;
    transform: scale(0, 1);
    transition: transform ease-in-out 250ms;
  }

  nav a:hover::before {
    transform: scale(1,1);
  }
}




/* Lang cart Block */
.lang{position: relative; display: flex; align-items: center;}
.box_lg_cart {display:flex; justify-content:flex-end; align-items:center; position: relative;}
#cart{order:2;}
.plashka {border-radius: 3px; border: 1px solid #f7be94; height: 34px; float: right; position: relative; margin: 0px 0px 0px 5px; padding:0px 10px; display:flex; justify-content:center; align-items:center; background-color:#fa6a00; box-shadow:inset rgba(255,255,255,0.2) 8px 8px 10px -3px, inset rgba(0,0,0,0.3) -8px -8px 10px -3px;}
.box_lg {border-radius:5px; cursor:pointer; position:relative; display:flex; transition:all 0.3s; margin-right:15px;}
.box_lg:hover{background-color: rgba(0,0,0,0.5); transition: all 0.3s;}
.langBox{position:relative;}
.bt_lng {box-shadow:2px 2px 4px rgba(0, 0, 0, 0.3); width:30px;}
.CmDemoCartImg{fill:#ffffff; width:25px; margin-right:10px;}
.cart-text {display:flex; flex-direction:column; align-items:center; text-transform:uppercase;}
.demoText, .DCartText{color:#ffffff; font-size:11px; line-height:16px;}
.demoText{font-weight:bold;}
.item {padding:8px 5px 5px 5px; display:block; color:#ffffff; font-weight:400;}
.itemName {padding:8px 5px 5px 0px; font-weight:bold; color:#ffffff; display:inline-block; margin-left: 5px;}
.langTab_sw {display:none;}
.itemGroup > img {margin:7px 7px 7px 7px; display:block; width:30px; height:20px;}
.LangSw {color:#fff; font-size:13px; padding-top:4px; float:right;}
.itemGroup {display:flex; width:140px; cursor:pointer; font-size:14px;}
.itemGroup:hover {background-color:#c55400;  opacity:0.66;}
.itemGroupL {display:flex; width:140px; cursor:pointer; font-size:14px;}
.itemGroupL:hover {background-color:#c55400;  opacity:0.66;}
.itemGroupL > img {margin:7px 7px 7px 7px; display:block; width:30px; height:20px;}

.itemBox {display: grid; grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); width: 390px; padding: 15px;}

/*HIDE MENU*/
.langListBlockWrap{display: flex; position: absolute; right:-20px; top: 49px; z-index: 999; background-color: rgba(0, 0, 0, 0.74); border-radius: 4px; transform: translateY(-120%); transition: all .3s ease-in-out; opacity: 0;}
.NsTranslate-0{transform: translateY(0); opacity: 1;}
.NsHideMenu{background-color: rgba(0, 0, 0, 0.7); padding:10px 10px; position:absolute; top:65px; right: 0; transform: translateY(-200%); z-index:9999; border-radius:0px 0px 0px 4px; transition: all .5s ease-in-out; opacity: 0;}
.NsTranslateY-0{transform: translate(0); opacity: 1;}
.NsLangChange{border-bottom:2px solid #fa6a00; padding-bottom:5px; display:flex; align-items:center; justify-content:flex-end;}
.NsCurrLangBut{align-self:flex-end;}
.NsLangName{font-weight:bold; color:#ffffff;}
.NsListMenu{display:flex; flex-direction:column; padding-right: 30px;}
.NsShowMenu{left:0;}
.NsListMenu a{margin:10px 10px; color:#FFFDEF; text-decoration:none; transition:all 0.3s; font-family:'Noto Sans', sans-serif; font-size:16px;}
.NsListMenu a:hover{color:#ffc107;}
.NsMenuBut{display:none;}
.NsOpenBut{width:24px; fill:#ffffff;}
.NsCloseBut{display:none; width:24px; fill:#ffffff;}
.CmLangBlockClose {display:none; cursor: pointer; width: 16px; height: 16px; padding: 5px; position: absolute; top: -2px; right: -1px; }
.CmLangBlockClose svg{fill: #ffffff;}

/* END HEADER */

/* SECTION HEADER */
.MsMainWrapBl{margin-top: -65px;}
#MsMainTitle{color:#ffffff; text-transform: uppercase; line-height:60px;  display:flex; flex-direction:column; align-items:center; max-width: 1180px;margin: auto;}
#MsTopSect{display: flex; justify-content: flex-start; align-items: flex-start;}
.MsTitleTxtWrap{display:flex; flex-direction:column; align-items: flex-start; padding: 0px 20px;}
.MsH1Titl{font-size:50px; font-weight:bold; color: #ffffff; padding: 15px 45px 15px 0px;}
.MsH1Txt{font-size:28px; font-weight: normal;}
.parallax {position: relative; background-attachment: fixed; background-position: center 0; background-repeat: no-repeat; background-size: cover; height: 100%; display: flex; justify-content: center; align-items: center;}
.MsDemoButton{background-color:#fa6a00; border-radius:8px; padding: 5px 20px; color:#ffffff; text-decoration:none; transition:all 0.2s; border:2px solid #fa6a00; font-weight:bold; align-self: center; font-size: 18px; margin-top: 20px; cursor:pointer;}
.MsDemoButton:hover{color:#fa6a00; background-color:#ffffff; border:2px solid #fa6a00;}
.MsWrapOpacity{position: absolute; width: 100%; height: 100%; background-color: #ffffff; opacity: 0.7; z-index: 1;}
.MsClipPathImg{position: absolute;clip-path: polygon(28% 13%, 100% 0%, 100% 100%, 29% 81%, 0% 50%);opacity: 0.2;height: 65%;right: 0px;}

/*Flip card*/
.MsBenefSect{background-color:#ececec; border-bottom: 1px solid #cfcfcf; box-shadow: 1px 1px 6px 1px #cecece;}
.MsBenefWrapBl{padding: 0px 20px 50px 20px; margin:-80px auto 0 auto; max-width:1200px;}
.MsBenefWrapBl, .McBenItemwrap{display:flex; justify-content:center; align-items:center; column-gap:20px;}
.MsBenefItemFlip.MsCardflip {transform: rotateY(180deg);}
.MsBenefItem {width: 250px; height: 310px; margin: 40px 0; perspective: 600px;}
.MsBenefItemFlip{width: 100%; height: 100%; transition: transform 0.5s; transform-style: preserve-3d; cursor: pointer; position: relative;}
.MsBItem {position: absolute; width: 100%; height: 100%; backface-visibility: hidden; display:flex; flex-direction:column; justify-content: flex-start; align-items: flex-start; border-radius: 8px;}
.MsBItem ul{padding-left:20px;}
.MsBItem li{background:url(../images/checkbox.svg) no-repeat 0 4px; list-style-type:none; font-size: 20px; color: #fa6a00; background-position: 1px 3px; background-repeat: no-repeat; background-size: 19px; padding:0px 20px 20px 28px;}
.MsBFront{background-color: #fa6a00;}
.MsBBack {background: #f5f5f5; transform: rotateY(180deg); justify-content: center;}
.MsBenImg{width:70px; height:70px; margin:30px;}
.MsBenImg img{width:100%;}
.MsBenTitl{align-self:center; position: absolute; bottom: 30px; color: #fff; font-size: 23px; text-align:center;}




/*Description block*/
.MsCmDescripBl{padding:50px 0px; border-bottom: 1px solid #cfcfcf; position: relative;}
.MsCmDescripWrap{max-width:1200px; padding: 0px 20px; display:flex; justify-content:center; align-items:flex-start; margin:0 auto; z-index: 9;}
.MsCmImg{width:51%; height:460px; margin-right: 10px; background-image:url(../images/Cm_Responsive.png); background-position:50% 20%; background-repeat:no-repeat; background-size:100%;}
.MsCmDescrip{width:45%; padding:0px 30px;}
.MsCmDescrip p{color:#3c3c3c; font-size:18px; line-height:1.6em;}

/*Vertical Devide Block*/
.MsDevideBlock{height:100%; width:2px; background: linear-gradient(0deg, rgba(255,255,255,0.510224158022584) 0%, rgba(255,194,149,1) 35%, rgba(255,194,149,1) 65%, rgba(255,255,255,1) 100%);}


/*Functionality Description Block*/
.MsInsideBlock{width:20px;}
.MsFunctionDesc{padding: 50px 0px; background-color: #ececec; }
.MsFuncВescWrap{max-width:1200px; padding: 0px 20px; display:flex; flex-direction:column; align-items:center; margin: auto;}
.MsFuncDescItem{display: flex; justify-content:space-between; align-items:flex-start; margin: 50px auto;}
.MsFuncDImg{width:50%; padding: 5px;}
.MsFuncDImg img{width:100%; transition: 1s ease-in-out; border-radius: 8px;}
.MsFuncDImg img:hover{transform: scale(1.1); box-shadow: 2px 2px 8px 0px #8e8e8e;}
.MsFuncDTxt{display:flex; flex-direction: column; align-items: flex-start; flex-basis:50%; color: #505050; padding: 5px;}
.MsTitleWrap{display: flex; justify-content: flex-start; align-items: center; padding-left: 20px;}
.MsSvgImg{width: 50px; height: 50px; fill: #fa6a00; margin-right: 20px;}
.MsFeatList{line-height: 35px; font-size: 19px;}


/* CMS description section */
.MsCmsConnectInfo{padding: 50px 0px; position: relative;}
.MsCmsDescWrap{max-width:1200px; display: flex; flex-direction: column; align-items: center; margin: auto; z-index: 9;}
.MsCmsSlider{width: 100%; border-radius: 8px; margin-top: 50px;}
.MsCmsSlItem img{width: 100%; object-fit: contain;}
.MsCmsDescList{padding-right: 20px;}
.MsCmsDescList li{line-height: 35px; font-size:20px; color:#505050;}
div.MsCmsDescWrap .MsDemoButton{padding: 15px 30px; margin-top: 80px; font-size: 24px;}
/* Слайдер */
.slick-slider{position:relative;}
/* Слайдер запущен */
.slick-slider.slick-initialized{}
/* Слайдер с точками */
.slick-slider.slick-dotted{}
/* Ограничивающая оболочка */
.slick-list {overflow:hidden;}
/* Лента слайдов */
.slick-track{display:flex; justify-content:center; align-items:center; height:80px;}
/* Слайд */
.slick-slide{height:55px; padding:7px; display:flex; justify-content:center; align-content:center;}
/* Слайд активный (показывается) */
.slick-slide.slick-active{}
/* Слайд основной */
.slick-slide.slick-current{}
/* Слайд по центру */
.slick-slide.slick-center{}
/* Клонированный слайд */
.slick-slide.slick-cloned{}
/* Стрелка */
.slick-arrow{display: none !important;}
/* Стрелка влево */
.slick-arrow.slick-prev{}
.slick-arrow.slick-prev:hover{}
/* Стрелка вправо */
.slick-arrow.slick-next{}
.slick-arrow.slick-next:hover{}
/* Стрелка не активная */
.slick-arrow.slick-disabled{}
/* Точки (булиты) */
.slick-dots{} .slick-dots li{}
/* Активная точка */
.slick-dots li.slick-active{}
/* Элемент точки */
.slick-dots li button{}


/* To top button */
#MsToTopBut { display: inline-block; background-color: #fa6a00; width: 50px; height: 50px; text-align: center; border-radius: 8px; position: fixed; bottom: 30px; right: 30px; transition: background-color .3s, opacity .5s, visibility .5s; opacity: 0; visibility: hidden; z-index: 1000;
}
#MsToTopBut::after { content: "\f077"; font-family: FontAwesome; font-weight: normal; font-style: normal; font-size: 2em; line-height: 46px; color: #fff;
}
#MsToTopBut:hover { cursor: pointer; background-color: #505050;
}
#MsToTopBut:active { background-color: #555;
}
#MsToTopBut.show { opacity: 1; visibility: visible;
}

/* FOOTER */
.CmFooterWrap{background:linear-gradient(0deg, #535557, #727373); display: flex;}
.CmFooterInner{display: flex; flex-direction: column; align-items: center; width: 100%; max-width: 1220px; margin: auto;}
.FooterMenu {font-family:Arial; padding-top:27px; align-self: flex-start;}
.FooterMenu a {text-transform:uppercase; padding:4px 10px; font-size:13px; color:#f2f2f2; font-weight:bold; }
.FooterMenu a:hover {background-color:#fa6a00; padding:4px 10px;}
.iconSocial {display:inline-block;padding:0 5px;cursor:pointer;}
.iconSocial img {height:100%; width:100%; transition:0.2s; }
.iconSocial img:hover {width:90%; height:90%; }
.boxSocial {padding:20px 0px; display:table; width:290px; float:right; display:none;}
.boxFooter {padding-top:80px; padding-bottom:20px; color:white; }
.offSite {margin:0 auto; display:table; font-size:12px; }

/*Media Query*/
  @media only screen and  (min-device-width:480px) and (max-device-width: 1024px) {
    .parallax {background-attachment: scroll;}
    .MsBenefWrapBl{margin:-160px auto 0 auto;}
    .MsBenefItem{width: 210px; height: 270px;}
    .MsBItem li{font-size:18px;}
    .MsCmImg{width:60%;}
    .MsBenefItem{margin: 10px 0;}
    .MsFuncDImg img{ pointer-events: none;}
    #MsMainTitle{width: 100%;}
    .MsH1Txt{font-size: 24px;}
    .MsH1Titl{font-size: 40px; padding: 10px 40px 10px 20px;}
    .MsClipPathImg{height: 50%;}
    #MsMainTitle{top: 50px;}
	.CmContacnForm{padding:10px 20px;}
  }
  @media (max-width: 992px) {
    .DCartText, .demoText{display: none;}
    .itemName{display: none;}
    .NsMenuLinks{width:350px;}
    .NsMenuLinks a{font-size:12px;}
    .CmDemoCartImg{margin-right:unset;}
  }
  @media screen and (max-width:900px){
    .MsBenefWrapBl{flex-direction:column;}
    .MsCmDescripWrap{flex-direction:column; align-items:center;}
    .MsCmImg{width:80%; height: 380px;}
    .MsDevideBlock{height:2px; width:100%; background: linear-gradient(90deg, rgba(255,255,255,0.510224158022584) 0%, rgba(255,194,149,1) 35%, rgba(255,194,149,1) 65%, rgba(255,255,255,1) 100%);}
    .MsCmDescripWrap{height:unset;}
    .MsCmDescrip{width:80%;}
    .MsFuncDescItem{flex-direction: column; align-items: center;}
    .MsFuncDImg{order: 1; width: 80%;}
    .MsH1Txt{font-size: 20px;}
    .MsH1Titl{font-size: 36px; padding: 8px 30px 8px 0px;}
	
  }
  @media screen and (max-width:769px){
    .MsClipPathImg{height: 40%;}
    textarea.TextA{width: 455px;}
    .box_lg_cart{margin:5px 5px 5px 0px;}
    .NsMenuLinks{display:none;}
    .NsMenuBut{display:block; margin:0px 15px 0px 10px; border:1px solid #cdcdcd; padding:2px 6px; border-radius:3px; }

    .boxHead{padding: 0px 0px 0px 20px;}
    .mainBoxHead{background-color: rgba(0, 0, 0, 0.5);}
    .langListBlockWrap{top:49px;}
    div.plashka{width:auto !important; padding:0px 5px; background-color:unset !important; border:0; box-shadow:unset;}
	.CmContacnForm{flex-direction:column; width:90%;}
	.BoxMessUs{border-left:0; padding:0;}
	.BoxConIcon{padding:0;}
	.CmContTitle{text-align:center;}
	.boxCMail{height:auto;}
  }
  @media screen and (max-width:480px) and (min-width:320px){
    .CuInputWrap{flex-direction: column; gap: 0px;}
    .CuInputWrap input{width: 100%;}
    textarea.TextA{width: 300px; margin-top: 15px;}
    .MsCmImg{height: 250px;}
    .MsCmDescrip {font-size:16px;}
    .MsBenefItem{width: 180px; height: 200px;}
    .MsBenefWrapBl{flex-direction:column; margin: -80px auto 0 auto;}
    .MsBItem ul{padding: 7px;}
    .MsBItem li{font-size:12px; padding: 0px 20px 10px 28px;}
    .MsBenTitl{font-size:18px;}
    .MsBenefItem{margin: 10px 0;}
    .MsBenefItem{width: 135px; height: 175px;}
    .MsBenefItem{margin: 10px 0;}
    .MsCmImg{height:235px;}
    .MsBenTitl{font-size:14px;}
    .MsBenImg{width: 50px; height: 70px; margin: 30px;}
    .MsCmDescrip p{font-size: 14px;}
    .MsFuncDImg img{ pointer-events: none;}
    #MsMainTitle{width: 100%;}
    .MsH1Txt{font-size: 20px;}
    .MsH1Titl{font-size: 30px; padding: 8px 30px 8px 0px;}
    .MsDemoButton{font-size: 16px; padding: 0px 10px;}
    #MsMainTitle{top: 30px;}
    .itemBox{width: auto; grid-template-columns: 1fr 1fr;}
  }