.webp .mh { background-image: linear-gradient(to bottom right, #6d371088, #1a1c25bb), url(/uploaded/Image/mastheads/sm/enginerotor.webp); }
.no-webp .mh { background-image: linear-gradient(to bottom right, #6d371088, #1a1c25bb), url(/uploaded/Image/mastheads/sm/enginerotor.jpg); }

 @media (max-width: 450px) {
.webp .mh {background-image: linear-gradient(to bottom right, #6d371088, #1a1c25bb), url(/uploaded/Image/mastheads/mobile/450_enginerotor.webp);}
.no-webp .mh {background-image: linear-gradient(to bottom right, #6d371088, #1a1c25bb), url(/uploaded/Image/mastheads/mobile/450_enginerotor.jpg);}
}


/*----------------------  Default Darker Grey Border for Card Headings --------------------------------------*/
.card-heading {border-color: #333;
    min-height: 50px;
    height: unset;
}

/*----------------------  Default Darker Grey Border for Card Headings End --------------------------------------*/

html {scroll-behavior: smooth;}


/*---------------------- Locked Video Start --------------------------------------*/

.locked-video-container {
  position: relative;
  background: #333;
  padding-top: 56.25%;
}

.locked-video-container img { 
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    height: 100%
}

.locked-video-containerOverlay {
    background: linear-gradient(to bottom, transparent, rgba(0,0,0,0.5));
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
}

.hexSSM {
    position: absolute;
    top: 47.5%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 67px;
    height: 76px;
    filter: opacity(0.7);
    background: url(/uploaded/image/MYSSM_Hex.svg);
    background-size: cover;
}

.playSSM {
    position: absolute;
    top: 47.5%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 70px;
    height: 70px;
    filter: opacity(0.7);
    background: url(/uploaded/image/MYSSM_Play.svg);
    background-size: cover;
}

.hexSSM:hover {
    filter: opacity(1);
}

.playSSM:hover {
    filter: opacity(1);
}

/*---------------------- Locked Video END --------------------------------------*/

/*---------------------- TAB STRUCTURE START---------------------------------------*/
.tabs-main-content {margin: 10px;}
#regGrey #TABCON {border-style: none;}
#regGrey #TABCON .card-col-container {border-style: none; margin-bottom: 0px;}
#regGrey .tabs-nav-wrap ul {display: flex; list-style: none; margin:0px;}
#regGrey li.tab-nav-link {
width: -webkit-fill-available;
width: -moz-available;
background-image: url(/uploaded/image/Cards/CardTitleBlank.png);
background-position: right;
background-size: contain;
margin: 0px;
display: flex;
align-items: center;
justify-content: center;
padding: 10px;
list-style: none;
background-color: #565656;
font-size: 1.1em;
cursor: pointer;
color: #fff;
text-align: center;
text-decoration: none;
border:1px solid #4a4a4a;
background-repeat: no-repeat;
}
#regGrey .tabs-nav .tab-nav-link.current,
#regGrey .tabs-nav .tab-nav-link:hover {
background-color: #1d4f91;
}
/*---------------------- TAB STRUCTURE END---------------------------------------*/
/*---------------------- THIS PAGES TAB CONTENT START ---------------------------------------*/
#regGrey .accordion__item {border-bottom: none;}
#regGrey .tabs-nav-wrap ul {border-bottom: 6px #1d4f91 solid; margin-bottom: 10px; min-height: 70px;}
/*---------------------- THIS PAGES TAB CONTENT END ---------------------------------------*/



/*----------------- Virtual Walkthroughs Start ------------------*/

.Launch {height:220px !important; position:relative; justify-content:center; text-decoration: none !important;}
.Inside {
position:relative; 
color: #fff;
font-weight: bolder;
font-size: 1.15em;
text-shadow: 0px 0px 15px #1d4f91;
padding: 15px 10px;
line-height:normal;
   transition:transform 1s, background-color 1s;
  -webkit-transform:transform 1s , background-color 1s;
}

.gLeft {background:linear-gradient(to left, rgba(218,41,28,0.0), rgba(218,41,28,0.7) 33%, rgba(218,41,28,1));}
.gRight {background:linear-gradient(to right, rgba(218,41,28,0), rgba(218,41,28,0.7) 33%, rgba(218,41,28,1));}

.Launch::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background-size: cover;
  background-position: center;
  filter: blur(0.5px);
   transition:transform 2s, filter 2s;
  -webkit-transform:transform 2s, filter 2s ;
}

#PARTSASSY::before {
 background-image: linear-gradient(155deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4)), url(/Uploaded/Image/Virtual-Walkthrough/Assembly_Part_Walkthrough.jpg);
}

#SMW::before {
 background-image: linear-gradient(155deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4)), url(/Uploaded/Image/Virtual-Walkthrough/Sheet_Metal_Weldment_Walkthrough.jpg);
}

#MODSIM::before {
  background-image: linear-gradient(155deg, rgba(255, 255, 255, 0.1), rgba(0, 0, 0, 0.4)), url(/Uploaded/Image/Virtual-Walkthrough/Modelling_Sim_Walkthrough.jpg);
}

#COMPOSER::before {
  background-image: linear-gradient(155deg, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.4)), url(/Uploaded/Image/Virtual-Walkthrough/Composer_Walkthrough.jpg);
}

#VISUALIZE::before {
  background-image: linear-gradient(155deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4)), url(/Uploaded/Image/Virtual-Walkthrough/Visualize_Walkthrough.jpg);
}

.Launch:hover .Inside{
                     transform:scale(1.1);
                     transform-origin: 50% 50%;
                     background-color: rgba(218,41,28,1);
}

.Launch:hover:before{
                     transform:scale(1.05);
                     transform-origin: 50% 50%;
                     filter: blur(1px) brightness(0.7);
}


/*----------------- Virtual Walkthroughs End ------------------*/

.mobileDirections {display: none;}


@media screen and (max-width: 900px) {
#Summary {grid-column: 1 / -1;}
}

@media screen and (max-width: 800px) {
#regGrey .tabs-nav-wrap ul {display: block;}
#regGrey .tabs-nav-wrap li {padding: 5px;}
#LaunchContainer .across-six { grid-column: span 12;}
}

@media (max-width: 700px) {
.desktopDirections {display: none;}
.mobileDirections {display: block;}
}

@media (max-width: 600px) {
.Launch {height:280px grid-column: span 6;}
.gRight {background:linear-gradient(to right, rgba(218,41,28,0.4), rgba(218,41,28,1));}
.gLeft {background:linear-gradient(to right, rgba(218,41,28,0.4), rgba(218,41,28,1));}
.across-three{grid-column: span 6;}
}

@media (max-width: 500px) {
.Launch {grid-column: span 12;}
}