.round-panel-resp-title	{width:87%; max-width:1200px; height:auto; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:700; font-size:56px; color:#121212; padding:0; margin:150px auto 0 auto; text-rendering: optimizeLegibility;}
.round-panel-resp-title-medium	{width: 87%; max-width: 1200px; height:auto; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:600; font-size:36px; color:#000000; padding:0; margin:0;}
.round-panel-resp-title-small	{width: 87%; max-width: 1200px; height:auto; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:600; font-size:22px; color:#000000; padding:0; margin:0;}
.round-panel-resp-title-prod	{width: 87%; max-width: 1200px; height:auto; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:600; font-size:20px; color:#000000; padding:0; margin:0;}
.round-panel-resp-body-prod	{width:87%; max-width:1200px; height:auto; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:400; font-size:19px; color:#121212; line-height:24px; padding:0; margin:20px auto 0 auto; text-rendering: optimizeLegibility;}

.round-panel-resp-body	{width:87%; max-width:1200px; height:auto; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:400; font-size:19px; color:#121212; line-height:27px; padding:0; margin:20px auto 0 auto; text-rendering: optimizeLegibility;}
.round-panel-resp-body-large	{width:87%; max-width:650px; height:auto; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:400; font-size:27px; color:#606060; line-height:32px; padding:0; margin:40px auto 40px auto; text-rendering: optimizeLegibility;}
.round-panel-resp-title-inner	{width:87%; max-width:960px; height:auto; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:700; font-size:50px; color:#121212; padding:0; margin:100px auto 0 auto; text-rendering: optimizeLegibility;}
.round-panel-lander-title-inner	{width:87%; max-width:960px; height:auto; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:700; font-size:46px; color:#121212; padding:0; margin:100px auto 0 auto; text-rendering: optimizeLegibility;}

.round-panel-buy-title	{width:87%; max-width:960px; height:auto; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:700; font-size:45px; color:#121212; padding:0; margin:100px auto 0 auto; text-rendering: optimizeLegibility;}
.round-panel-buy-title-small	{ height:auto; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:400; font-size:17px; color:#121212; padding:0; margin:40px auto 0 auto; text-rendering: optimizeLegibility;}
.round-panel-buy-body-small	{ height:auto; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:400; font-size:15px; color:#121212; padding:0; margin:20px auto 0 auto; text-rendering: optimizeLegibility; line-height: 25px;}
.round-panel-buy-body-tiny	{ height:auto; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:400; font-size:13px; color:#121212; margin:10px auto 0 auto; text-rendering: optimizeLegibility; line-height: 20px; padding: 0 15px}

.round-panel-buy-category-title	{font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:700; font-size:23px; color:#121212; padding: 0; margin:0; text-rendering: optimizeLegibility; line-height: 25px; height: auto;}


.pre-features-grid-content-wrapper	{-webkit-box-shadow: 0px 0px 0px 1px rgba(204,204,204,1);
-moz-box-shadow: 0px 0px 0px 1px rgba(204,204,204,1);
box-shadow: 0px 0px 0px 1px rgba(204,204,204,1); border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; background:#ffffff; width:100%; max-width:410px; overflow:hidden; height:auto; margin:0 25px; transform: translateX(calc(max(1024px, 100vw)/2 - 600px)); padding: 45px; transition: all .3s cubic-bezier(0,0,.5,1); cursor: pointer;}
.pre-features-grid-content-wrapper:hover	{-webkit-box-shadow: 0px 0px 0px 2px rgba(30,118,227,1);
-moz-box-shadow: 0px 0px 0px 2px rgba(30,118,227,1);
box-shadow: 0px 0px 0px 2px rgba(30,118,227,1); transform: translateX(calc(max(1024px, 100vw)/2 - 600px)) scale(1.03); }
.prefeaturesSlickSteps	{height:700px; margin:0 auto 0 auto; overflow:hidden; display: flex; align-items: center;}

.prefeaturesSlickSteps .slick-list	{padding:40px 0}

.preslickprevStyle, .preslicknextStyle	{width:40px; height:40px; background:#1E76E3; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; line-height:40px; text-align:center; font-size:15px; color:#ffffff; padding:0; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif;}
.preslickprevStyle:hover, .preslicknextStyle:hover	{opacity:0.8}
.preslickprevStyle i, .preslicknextStyle i {border:none; line-height:40px; padding:0; color:#ffffff; text-decoration:none}
.preslickprevStyle a	{width:100%; line-height:40px; display:block; text-decoration:none; color:#ffffff;}
.preslicknextStyle a	{width:100%; line-height:40px; display:block; text-decoration:none; color:#ffffff;}


.preslickprevStyle.slick-disabled, .preslicknextStyle.slick-disabled {
    opacity: 0.2;
    pointer-events:none;
}

.prodTextAlignCenter	{text-align:center}
.prodTextAlignLeft	{text-align:left}
.prodTextAlignRight	{text-align:right}

.slider-control-flex-with-title {width: 100%;  display: flex; flex-direction: row; justify-content: space-between; flex-wrap: wrap;}

.features-slider-control-wrapper-inner	{width:100%; max-width:500px; margin:0; height:auto; align-items:center; flex-direction:row; justify-content:space-between; padding:0; border: none; display: flex}

.features-control-title	{flex: 0 0 50%; order: 1}
.features-control-select	{flex: 0 0 50%; order: 2}
.features-control-text {flex: 0 0 100%; order: 3}


.new-badge-red	{background: #FC3A3A; font-size: 11px; font-weight: 600;  color: #FFFFFF; width: 46px; height: 17px; line-height: 17px; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px;}

.slick-slider {
  -webkit-user-select: text;
  -khtml-user-select: text;
  -moz-user-select: text;
  -ms-user-select: text;
  user-select: text;
}
.slick-list.draggable {
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.blue-main-button-wrapper {width:86%; margin: 0 auto; display: flex; justify-content: space-between; flex-direction: row; gap:20px;}

.blue-main-button	{width: 87%; height:50px; text-align:center; color:#ffffff!important; background:#1E76E3; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; outline:none; border:none; cursor:pointer; line-height:50px; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:16px;}
.blue-main-button:hover	{opacity:0.8!important;}
.blue-main-button a	{text-decoration:none!important; display:block; height:100%; color:#ffffff!important; padding:0; line-height: 50px}
.blue-main-button a:visited	{color:#ffffff!important; text-decoration:none!important;}
.blue-main-button i	{border: none; margin: 0; line-height: 50px; padding: 0;}

.purple-main-button	{width: 87%; height:50px; text-align:center; color:#ffffff!important; background:#9444B8; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; outline:none; border:none; cursor:pointer; line-height:50px; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:16px;}
.purple-main-button:hover	{opacity:0.8!important;}
.purple-main-button a	{text-decoration:none!important; display:block; height:100%; color:#ffffff!important; padding:0; line-height: 50px}
.purple-main-button a:visited	{color:#ffffff!important; text-decoration:none!important;}
.purple-main-button i	{border: none; margin: 0; line-height: 50px; padding: 0;}

.pink-main-button	{width: 87%; height:50px; text-align:center; color:#ffffff!important; background:#D12B78; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; outline:none; border:none; cursor:pointer; line-height:50px; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:16px;}
.pink-main-button:hover	{opacity:0.8!important;}
.pink-main-button a	{text-decoration:none!important; display:block; height:100%; color:#ffffff!important; padding:0; line-height: 50px}
.pink-main-button a:visited	{color:#ffffff!important; text-decoration:none!important;}
.pink-main-button i	{border: none; margin: 0; line-height: 50px; padding: 0;}

.white-main-button-hollow	{width: 87%; height:50px; text-align:center; color:#ffffff!important; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; outline:none; border:none; cursor:pointer; line-height:46px; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:16px; border: 2px solid #ffffff!important; box-sizing: border-box;}
.white-main-button-hollow:hover	{opacity:0.8!important;}
.white-main-button-hollow a	{text-decoration:none!important; display:block; height:100%; color:#ffffff!important; padding:0; line-height: 46px}
.white-main-button-hollow a:visited	{color:#ffffff!important; text-decoration:none!important;}
.white-main-button-hollow i	{border: none; margin: 0; line-height: 50px; padding: 0;}

.pink-main-button-hollow	{height:auto; text-align:left; color:#ffffff!important; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; outline:none; border:none; cursor:pointer; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:17px; border: 2px solid #D12B78!important; box-sizing: border-box;}
.pink-main-button-hollow:hover	{opacity:0.8!important;}
.pink-main-button-hollow a	{text-decoration:none!important; display:block; height:100%; color:#ffffff!important; padding:10px 20px; display: flex; flex-direction: row; justify-content: space-between; align-items: center; box-sizing: border-box;}
.pink-main-button-hollow a:visited	{color:#ffffff!important; text-decoration:none!important;}
.pink-main-button-hollow i	{border: none; margin: 0 15px 0 0; padding: 0; font-size:25px}

.blue-main-button-large	{width: 87%; height:50px; text-align:center; color:#ffffff!important; background:#1E76E3; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; outline:none; border:none; cursor:pointer; line-height:50px; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:16px;}
.blue-main-button-large:hover	{opacity:0.8!important;}
.blue-main-button-large a	{text-decoration:none!important; display:block; height:100%; color:#ffffff!important; padding:0; line-height: 50px}
.blue-main-button-large a:visited	{color:#ffffff!important; text-decoration:none!important;}
.blue-main-button-large i	{border: none; margin: 0; line-height: 50px; padding: 0;}

.prod-blue-main-button-large	{width: 87%; height:50px; text-align:center; color:#ffffff!important; background:#1E76E3; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; outline:none; border:none; cursor:pointer; line-height:50px; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:16px;}
.prod-blue-main-button-large:hover	{background:#1B68C7;}
.prod-blue-main-button-large a	{text-decoration:none!important; display:block; height:100%; color:#ffffff!important; padding:0; line-height: 50px}
.prod-blue-main-button-large a:visited	{color:#ffffff!important; text-decoration:none!important;}
.prod-blue-main-button-large i	{border: none; margin: 0; line-height: 50px; padding: 0;}

.prod-white-main-button-large	{width: 87%; height:50px; text-align:center; color:#121212!important; background:#ffffff; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; outline:none; border:none; cursor:pointer; line-height:50px; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:16px;}
.prod-white-main-button-large:hover	{background:#e5e5e5;}
.prod-white-main-button-large a	{text-decoration:none!important; display:block; height:100%; color:#121212!important; padding:0; line-height: 50px}
.prod-white-main-button-large a:visited	{color:#121212!important; text-decoration:none!important;}
.prod-white-main-button-large i	{border: none; margin: 0; line-height: 50px; padding: 0;}

.prod-yellow-main-button-large	{width: 87%; height:50px; text-align:center; color:#121212!important; background:#FFCE00; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; outline:none; border:none; cursor:pointer; line-height:50px; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:16px;}
.prod-yellow-main-button-large:hover	{background:#E2B910;}
.prod-yellow-main-button-large a	{text-decoration:none!important; display:block; height:100%; color:#121212!important; padding:0; line-height: 50px}
.prod-yellow-main-button-large a:visited	{color:#121212!important; text-decoration:none!important;}
.prod-yellow-main-button-large i	{border: none; margin: 0; line-height: 50px; padding: 0;}

.blue-main-button-hollow	{width: 87%; height:50px; text-align:center; color:#1E76E3!important; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; outline:none; border:none; cursor:pointer; line-height:46px; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:16px; border: 2px solid #1E76E3!important; box-sizing: border-box;}
.blue-main-button-hollow:hover	{opacity:0.8!important;}
.blue-main-button-hollow a	{text-decoration:none!important; display:block; height:100%; color:#1E76E3!important; padding:0; line-height: 46px}
.blue-main-button-hollow a:visited	{color:#1E76E3!important; text-decoration:none!important;}
.blue-main-button-hollow i	{border: none; margin: 0; line-height: 50px; padding: 0;}

.blue-main-button-hollow-thin	{width: 87%; height:40px; text-align:center; color:#1E76E3!important; border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px; outline:none; border:none; cursor:pointer; line-height:36px; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:600; font-size:15px; border: 2px solid #1E76E3!important; box-sizing: border-box;}
.blue-main-button-hollow-thin:hover	{opacity:0.8!important;}
.blue-main-button-hollow-thin a	{text-decoration:none!important; display:block; height:100%; color:#1E76E3!important; padding:0; line-height: 36px}
.blue-main-button-hollow-thin a:visited	{color:#1E76E3!important; text-decoration:none!important;}
.blue-main-button-hollow-thin i	{border: none; margin: 0; line-height: 40px; padding: 0;}

.blue-main-button-thin	{width: 87%; height:40px; text-align:center; color:#ffffff!important; border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px; outline:none; border:none; cursor:pointer; line-height:36px; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:600; font-size:15px; box-sizing: border-box; background: #1E76E3}
.blue-main-button-thin:hover	{opacity:0.8!important;}
.blue-main-button-thin a	{text-decoration:none!important; display:block; height:100%; color:#ffffff!important; padding:0; line-height: 36px}
.blue-main-button-thin a:visited	{color:#ffffff!important; text-decoration:none!important;}
.blue-main-button-thin i	{border: none; margin: 0; line-height: 40px; padding: 0;}

.pre-sub-nav-btn-blue				{height:30px; background-color:#1E76E3; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:13px; color:#ffffff; line-height:30px; text-align:center; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius:4px; margin-left:15px;}
.pre-sub-nav-btn-blue:hover			{opacity: 0.8; -webkit-opacity:0.8; -moz-opacity:0.8}
.pre-sub-nav-btn-blue a:link			{display:block; height:100%; color:#fff; text-decoration: none;  padding:0 12px}	
.pre-sub-nav-btn-blue a:visited		{color:#fff;}

.pre-sub-nav-btn-blue-hollow				{height:30px; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:13px; color:#1E76E3!important; line-height:26px; text-align:center; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius:4px; margin-left:15px; border: 2px solid #1E76E3!important; box-sizing: border-box;}
.pre-sub-nav-btn-blue-hollow:hover			{opacity: 0.8; -webkit-opacity:0.8; -moz-opacity:0.8}
.pre-sub-nav-btn-blue-hollow a:link			{display:block; height:100%; color:#1E76E3!important; text-decoration: none;  padding:0 12px}	
.pre-sub-nav-btn-blue-hollow a:visited		{color:#1E76E3!important; text-decoration:none!important;}

.sub-nav-btn-grey-menu				{height:28px; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:15px; color:#ffffff; line-height:28px; text-align:center; border-radius: 14px; -moz-border-radius: 14px; -webkit-border-radius:14px; padding: 0 15px; cursor: pointer; background-color:#606060;}
.sub-nav-btn-grey-menu:hover			{opacity: 0.6; -webkit-opacity:0.6; -moz-opacity:0.6;}

.guide-nav-btn-grey-menu				{height:30px; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:15px; color:#ffffff; line-height:30px; text-align:center; border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius:6px; padding: 0 15px; cursor: pointer; background-color:#606060; user-select: none;}
.guide-nav-btn-grey-menu:hover			{opacity: 0.6; -webkit-opacity:0.6; -moz-opacity:0.6;}
.guide-nav-btn-grey-menu:active			{opacity: 0.3; -webkit-opacity:0.3; -moz-opacity:0.3;}

.guide-nav-btn-grey-menu-hollow				{height:30px; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:15px; color:#ffffff; line-height:30px; text-align:center; border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius:6px; padding: 0 15px; cursor: pointer; border: 1px solid #727272; box-sizing: border-box; user-select: none;}
.guide-nav-btn-grey-menu-hollow:hover			{opacity: 0.6; -webkit-opacity:0.6; -moz-opacity:0.6;}
.guide-nav-btn-grey-menu-hollow:active			{opacity: 0.3; -webkit-opacity:0.3; -moz-opacity:0.3;}

.large-main-button-hollow	{width: 100%; height:60px; text-align:center; color:#121212!important; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; outline:none; border:none; cursor:pointer; line-height:60px; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1.125rem; box-sizing: border-box; -webkit-box-shadow: 0px 0px 0px 1px rgba(204,204,204,1);
-moz-box-shadow: 0px 0px 0px 1px rgba(204,204,204,1);
box-shadow: 0px 0px 0px 1px rgba(204,204,204,1);}
.large-main-button-hollow:hover	{color:#1E76E3; -webkit-box-shadow: 0px 0px 0px 2px rgba(30,118,227,1);
-moz-box-shadow: 0px 0px 0px 2px rgba(30,118,227,1);
box-shadow: 0px 0px 0px 2px rgba(30,118,227,1);}
.large-main-button-hollow a	{text-decoration:none!important; display:block; height:100%; color:#121212!important;  padding:0 13px 0 20px; line-height: 60px; width: 100%; display: flex; justify-content: space-between; align-items: center; box-sizing: border-box;}
.large-main-button-hollow a:hover	{color:#1E76E3!important; text-decoration:none!important;}
.large-main-button-hollow a:visited	{color:#121212!important; text-decoration:none!important;}
.large-main-button-hollow i	{border: none}
.large-main-button-hollow i:hover	{color:#1E76E3!important;}


.main-link-yellow a {color:#FFBA00!important; text-decoration: none!important; font-weight: 500!important}
.main-link-yellow a:hover {opacity:0.8!important;}
.main-link-yellow a:visited {color:#FFBA00!important; text-decoration: none!important;}
.main-link-yellow a i {border:none!important}

.main-link-blue a {color:#1E76E3!important; text-decoration: none!important; font-weight: 500!important}
.main-link-blue a:hover {opacity:0.8!important;}
.main-link-blue a:visited {color:#1E76E3!important; text-decoration: none!important;}
.main-link-blue a i {border:none!important}

.main-link-black a {color:#121212!important; text-decoration: none!important;font-weight: 500!important}
.main-link-black a:hover {opacity:0.8!important;}
.main-link-black a:visited {color:#121212!important; text-decoration: none!important;}
.main-link-black a i {border:none!important}

.main-link-white a {color:#ffffff!important; text-decoration: none!important;font-weight: 500!important}
.main-link-white a:hover {opacity:0.8!important;}
.main-link-white a:visited {color:#ffffff!important; text-decoration: none!important;}
.main-link-white a i {border:none!important}

.main-link-red a {color:#FF3E3E!important; text-decoration: none!important;font-weight: 500!important}
.main-link-red a:hover {opacity:0.8!important;}
.main-link-red a:visited {color:#FF3E3E!important; text-decoration: none!important;}
.main-link-red a i {border:none!important}

.main-link-blue-bold a {color:#1E76E3!important; text-decoration: none!important; font-weight: 600!important}
.main-link-blue-bold a:hover {opacity:0.8!important;}
.main-link-blue-bold a:visited {color:#1E76E3!important; text-decoration: none!important;}
.main-link-blue-bold a i {border:none!important}

.main-select-control { display:block; padding:0; margin: 0; width: 100%; overflow: hidden; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", Arial, sans-serif; font-weight:500; font-size: 1rem;  color: #121212; position:relative; cursor:pointer; height:50px; background:#ffffff; line-height:50px; border-radius:8px; -webkit-border-radius:8px; -moz-border-radius:8px; -webkit-box-shadow: 0px 0px 0px 1px rgba(204,204,204,1);
-moz-box-shadow: 0px 0px 0px 1px rgba(204,204,204,1);
box-shadow: 0px 0px 0px 1px rgba(204,204,204,1);}

.main-select-control select { font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", Arial, sans-serif; padding: 0 20px 0 20px; width: 130%; height:50px; border: none; box-shadow: none; background-color: transparent; background-image: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; font-weight:400; -webkit-font-smoothing:subpixel-antialiased;  color: #121212; font-size: 1.1rem; cursor:pointer; max-width: 100%; float:left; /*Altered two below to make word wrap work */ word-wrap: normal !important; white-space: normal;}

.main-select-control i {padding:0; position:absolute;  top:50%; right:15px;  transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); background: none; pointer-events: none; font-size:16px; border: none}

.main-select-control select:focus {outline: none !important;}

.main-select-control:hover {color:#1E76E3; -webkit-box-shadow: 0px 0px 0px 2px rgba(30,118,227,1);
-moz-box-shadow: 0px 0px 0px 2px rgba(30,118,227,1);
box-shadow: 0px 0px 0px 2px rgba(30,118,227,1);}

.main-select-control-dark { display:block; padding:0; margin: 0; width: 100%; overflow: hidden; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif;  font-weight:400; color: #ffffff; font-size: 16px; position:relative; cursor:pointer; height:50px; background:#29282C; line-height:50px; border-radius:8px; -webkit-border-radius:8px; -moz-border-radius:8px;}
.main-select-control-dark select {font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; padding: 0 20px 0 20px; width: 130%; height:50px; border: none; box-shadow: none; background-color: transparent; background-image: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial", sans-serif;  font-weight:500; color: #ffffff; font-size: 16px; cursor:pointer; max-width: 100%; float:left; /*Altered two below to make word wrap work */ word-wrap: normal !important; white-space: normal;}
.main-select-control-dark i {padding:0; position:absolute;  top:50%; right:15px;  transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); background: none; pointer-events: none; font-size:16px; border: none}
.main-select-control-dark select:focus {outline: none !important;}
.main-select-control-dark:hover {opacity: 0.8;}

.main-select-control-large { display:block; padding:0; margin: 0; width: 100%; overflow: hidden; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1.125rem; color: #121212; position:relative; cursor:pointer; height:60px; background:#ffffff; line-height:60px; border-radius:8px; -webkit-border-radius:8px; -moz-border-radius:8px; -webkit-box-shadow: 0px 0px 0px 1px rgba(204,204,204,1);
-moz-box-shadow: 0px 0px 0px 1px rgba(204,204,204,1);
box-shadow: 0px 0px 0px 1px rgba(204,204,204,1);}
.main-select-control-large select {font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1.125rem; padding: 0 20px 0 20px; width: 130%; height:60px; border: none; box-shadow: none; background-color: transparent; background-image: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial", sans-serif; color: #121212; cursor:pointer; max-width: 100%; float:left; /*Altered two below to make word wrap work */ word-wrap: normal !important; white-space: normal;}
.main-select-control-large i {padding:0; position:absolute;  top:50%; right:15px;  transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); background: none; pointer-events: none; font-size:20px; border: none}
.main-select-control-large select:focus {outline: none !important;}
.main-select-control-large:hover {color:#1E76E3; -webkit-box-shadow: 0px 0px 0px 2px rgba(30,118,227,1);
-moz-box-shadow: 0px 0px 0px 2px rgba(30,118,227,1);
box-shadow: 0px 0px 0px 2px rgba(30,118,227,1);}
.main-select-control-large:hover select {color:#1E76E3;}

.slick-slide.main-slide-1200, .slick-slide.main-slide-780 {opacity: 0.15; outline:none; cursor:pointer;}
.slick-center.main-slide-1200, .slick-center.main-slide-780 {opacity: 1.0; outline:none; cursor:auto}

.slick-main-steps, .whats-new-main-steps	{width:100%; height:auto; margin:40px auto 0 auto; }

.slide-round-main	{width:100%; max-width:1288px; height:auto; margin:0 20px; overflow:hidden; /*border-radius:20px; -moz-border-radius:20px; -webkit-border-radius:20px; */}
.slide-round-w	{width:100%; max-width:1200px; height:auto; margin:0 20px; overflow:hidden; border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px; box-sizing: border-box;}
.slide-round-main2	{width:100%; max-width:1200px; height:auto; margin:0 40px; overflow:hidden; /*border-radius:20px; -moz-border-radius:20px; -webkit-border-radius:20px; */}
.slide-round-main3	{width:100%; max-width:1200px; height:auto; margin:0 20px; overflow: hidden; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; -webkit-box-shadow: 2px 4px 12px rgba(0,0,0,0.2); -moz-box-shadow: 2px 4px 12px rgba(0,0,0,0.2); box-shadow: 2px 4px 12px rgba(0,0,0,0.2);}

.pre-order-grid-content-wrapper	{max-width: 385px; border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; background:#1D1C1F; overflow:hidden; height:auto; margin:0 20px; padding: 45px; transition: all .3s cubic-bezier(0,0,.5,1); cursor: pointer; -webkit-box-shadow: 2px 4px 12px rgba(0,0,0,0.5);
-moz-box-shadow: 2px 4px 12px rgba(0,0,0,0.5);
box-shadow: 2px 4px 12px rgba(0,0,0,0.5); position: relative;}
.pre-order-grid-content-wrapper:hover	{-webkit-box-shadow: 2px 4px 16px rgba(0,0,0,0.8);
-moz-box-shadow: 2px 4px 16px rgba(0,0,0,0.8);
box-shadow: 2px 4px 16px rgba(0,0,0,0.8); transform: scale(1.02); }

.pre-order-buy-wrapper {width: 87%; max-width: 950px; margin: 80px auto 0 auto; display: flex; justify-content:space-around; flex-direction: row}

.pre-order-what-new-grid	{width:87%; max-width: 1200px; margin: 0 auto 100px auto; display: flex; flex-direction: row; align-items: center;  flex-wrap: wrap; justify-content: center;}
.pre-order-what-new-grid-item	{width: 160px; height: auto; -webkit-box-shadow: 0px 0px 0px 1px rgba(204,204,204,1); -moz-box-shadow: 0px 0px 0px 1px rgba(204,204,204,1); box-shadow: 0px 0px 0px 1px rgba(204,204,204,1); border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; background:#ffffff; margin: 15px; padding: 30px 20px; transition: all .3s; backface-visibility: hidden; background: #ffffff; display: block; cursor: pointer;}
.pre-order-what-new-grid-item:hover {-webkit-box-shadow: 0px 0px 0px 2px rgba(30,118,227,1); -moz-box-shadow: 0px 0px 0px 2px rgba(30,118,227,1); box-shadow: 0px 0px 0px 2px rgba(30,118,227,1); transform: scale(1.05); }


.pre-features-flexslide-content-wrapper	{-webkit-box-shadow: 2px 4px 12px rgba(204,204,204,0.8);
-moz-box-shadow: 2px 4px 12px rgba(204,204,204,0.8);
box-shadow: 2px 4px 12px rgba(204,204,204,0.8); border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; background:#ffffff; width:410px; max-width:410px; overflow:hidden; height:auto; 
	-webkit-transform: translateX(calc(max(1024px, 100vw)/2 - 630px)); 
	-moz-transform: translateX(calc(max(1024px, 100vw)/2 - 630px));
	transform: translateX(calc(max(1024px, 100vw)/2 - 630px)); 
	transition: all .3s cubic-bezier(0,0,.5,1); display: flex; flex-direction: column;}

.pre-features-flexslide-content-wrapper:hover	{-webkit-box-shadow: 2px 4px 16px rgba(0,0,0,0.16);
-moz-box-shadow: 2px 4px 16px rgba(0,0,0,0.16);
box-shadow: 2px 4px 16px rgba(0,0,0,0.16); transform: translateX(calc(max(1024px, 100vw)/2 - 630px)) scale(1.02);}

.blue-hover-frame	{
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    overflow: hidden;
    border: 2px solid #1E76E3;
    -webkit-transition: opacity 0.3s;
    transition: opacity 0.3s;
    opacity: 0;
}
.pre-features-flexslide-content-wrapper:hover .blue-hover-frame	{border: 2px solid #1E76E3; opacity: 1; cursor: pointer; }
.pre-order-grid-content-wrapper:hover .blue-hover-frame	{border: 2px solid #1E76E3; opacity: 1}
.slider-content-grow	{padding:45px; flex-grow:1;}
.lesson-content-grow	{padding:50px; flex-grow:1;}

.slider-image-strip-wrapper	{width:100%; height: auto; border-radius: 0 0 20px 20px; -webkit-border-radius:0 0 20px 20px; -moz-border-radius:0 0 20px 20px; overflow: hidden;}
.slider-image-strip	{width:100%; height: 170px;}

.scroll-snap-position-container	{width: 100%; position:relative; overflow: hidden; height:auto;}
.scroll-snap-main-wrapper	{position: relative; overflow-x: scroll; padding-bottom: 30px; /*scroll-behavior: smooth;*/ -ms-overflow-style:none; scrollbar-width:none;}

.scroll-snap-main-wrapper::-webkit-scrollbar	{display:none}
.flex-slide-scroll-snap-container	{vertical-align: top; display: inline-flex;}
.flex-slider-scroll-wrapper	{display: flex; padding: 20px; flex-shrink: none; scroll-snap-align: start; scroll-snap-stop: normal;}


#scroll-left-button	{width: 60px; height: 60px; line-height: 60px; color: #ffffff; position: absolute; left: 30px; top: calc(50% - 50px); background: #000000; transition: all .2s cubic-bezier(0,0,.5,1); opacity: 0; cursor: pointer; border-radius:35px; -webkit-border-radius:35px; -moz-border-radius:35px;}
#scroll-right-button	{width: 60px; height: 60px; line-height: 60px; color: #ffffff; position: absolute; right: 30px; top: calc(50% - 50px); background: #000000; transition: all .2s cubic-bezier(0,0,.5,1); opacity: 0; cursor: pointer; border-radius:35px; -webkit-border-radius:35px; -moz-border-radius:35px;}

.scroll-snap-position-container:hover #scroll-left-button	{opacity: 0.4}
.scroll-snap-position-container:hover #scroll-right-button	{opacity: 0.4}

#scroll-left-button:hover, #scroll-right-button:hover	{background: #606060; transition: all .3s cubic-bezier(0,0,.5,1);}
#scroll-left-button i, #scroll-right-button i	{border: none; padding: 0; margin: 0; line-height: 60px; font-size: 21px;}

.mask-scroll-stopper	{width: 100%; height: 100%; position: absolute; top: 0; left:0; right: 0; bottom: 0; background: none; display: none}
.grey-back-frame	{width: 100%; background: #f5f5f7; margin-top: 130px; margin-bottom:130px; padding: 130px 0;}
.dark-back-frame	{width: 100%; background: #121212; margin-top: 130px; margin-bottom:130px; padding: 130px 0;}
.blue-back-frame	{width: 100%; background: #171D27; margin-top: 130px; margin-bottom:130px; padding:0;}
.empty-back-frame	{width: 100%; padding: 130px 0;}
.empty-back-frame-with-banner	{width: 100%; padding: 100px 0 0 0;}

.left-center	{text-align: left;}

.main-image-block	{width: 90%; max-width: 1200px; height: auto; margin: 60px auto 40px auto; overflow: hidden;}
.main-image-block img {width: 100%; height: auto}

.left-full-align-wrapper	{width:95%; max-width: calc((100vw - 1200px)/2 + 1200px); height: auto; display: flex; flex-direction: row; margin-top: 100px; box-sizing: border-box;}
.left-edge-inner	{width:100%; height: auto; border-radius:0 10px 10px 0; -webkit-border-radius: 0 10px 10px 0; -moz-border-radius:0 10px 10px 0; overflow: hidden; box-sizing: border-box;}
.right-container-wrapper	{width:100%; max-width:500px; height: auto; margin-left: 50px; overflow: hidden; display: flex; flex-direction: column;}
.right-inner	{border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; overflow: hidden; display: flex; background: #ffffff; display: flex; flex-direction: column;}
.right-inner-container	{padding: 60px;}

.right-full-align-wrapper	{width:95%; max-width: calc((100vw - 1200px)/2 + 1200px); height: auto; display: flex; flex-direction: row; margin-top: 70px; margin-left: calc((100vw - 1200px)/2); box-sizing: border-box;}
.right-right-edge-inner	{width:100%; height: auto; border-radius:10px 0 0 10px; -webkit-border-radius: 10px 0 0 10px; -moz-border-radius:10px 0 0 10px; overflow: hidden; box-sizing: border-box}
.right-left-container-wrapper	{width: 100%; max-width:500px; height: auto; margin-right: 50px; overflow: hidden; display: flex; flex-direction: column; order: 0; box-sizing: border-box;}
.right-left-inner	{border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; overflow: hidden; display: flex; flex-direction: column; background: #ffffff;}
.right-left-inner-container	{padding: 60px; order: 0;}


.main-image-center-block	{width: 86%; max-width: 1200px; height: auto; margin: 100px auto; border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; overflow: hidden;}

.info-center-wrapper	{width: 87%; max-width: 950px; margin: 0 auto; display: flex; flex-direction: row; justify-content: space-between;}
.info-center-inner	{border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; overflow: hidden; width: 100%; max-width: 450px; height: auto; display: flex; flex-direction: column;}
.info-center-inner:first-child	{margin-right: 20px}
.info-center-inner:last-child	{margin-left: 20px}
.info-center-inner-container	{padding: 60px; flex-grow: 1}

.info-center-inner-large	{border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; overflow: hidden; width: 87%; max-width: 950px; height: auto; margin: 40px auto 0 auto; display: flex; flex-direction: row; justify-content: space-between;}
.info-center-inner-large-image	{width: 50%; max-width:450px; flex: 0 0 auto; overflow: hidden; }
.info-center-inner-large-container	{padding: 60px;}

.info-center-grid-wrapper	{width: 88%; max-width: 950px; margin: 0 auto; display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 30px}
.info-center-grid-wrapper-large	{width: 90%; max-width: 1600px; margin: 0 auto; display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 30px}
.info-center-grid-inner	{border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; overflow: hidden; width: 100%; height: auto; display: flex; flex-direction: column;}
.info-center-grid-inner-container	{padding: 60px; flex-grow: 1}

.tb-grid-wrapper-large	{width: 90%; max-width: 1600px; margin: 0 auto; display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 30px}
.tb-grid-inner	{border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; overflow: hidden; width: 100%; height: auto; display: flex; flex-direction: column;}


/*Full Wrap scaled image animation - START */

.full-image-secton-wrapper	{top:0; width: 100%; overflow: hidden; background-color: #ffffff; display: block; cursor: default!important; opacity: 0; transition: opacity 1.5s; will-change: transform;}
.full-image-inner-container	{
	width: 1200px;
	height: 734px;
	position: relative;
	left: 50%;
	margin-left: -600px;
	margin-top: 0;
	margin-bottom: 0;
	transform: scale(2.0);
	transform-origin: center 88px;
	will-change: transform;
	transition: matrix 0.5s;
	
}
.full-image	{
	width: 1200px;
	height: 734px;
    background-image: url("../macdraft-pre-order/images/macbook-empty.jpg");
    background-repeat: no-repeat;
    background-size: 1200px 734px;
	will-change: transform;
	
}

.scrollFade1, .scrollFade2, .scrollFade3, .scrollFade4	{transition: all 0.3s ease-in}
.hideFade	{opacity: 0; transform: translateY(-30px)}

.background-dark-wash	{background:rgba(20, 20, 20, 0.75); backdrop-filter: saturate(180%) blur(20px); -webkit-backdrop-filter: saturate(180%) blur(20px); transition: show 0.3s ease-in}
.background-light-wash	{background:rgba(255, 255, 255, 0.75); backdrop-filter: saturate(180%) blur(20px); -webkit-backdrop-filter: saturate(180%) blur(20px); transition: show 0.3s ease-in}

.background-light-wash-g	{background:rgba(245, 245, 247, 0.75); backdrop-filter: saturate(180%) blur(20px); -webkit-backdrop-filter: saturate(180%) blur(20px); transition: show 0.3s ease-in}

#Dark .new-background-dark-wash	{background:rgba(20, 20, 20, 0.75); backdrop-filter: saturate(180%) blur(20px); -webkit-backdrop-filter: saturate(180%) blur(20px); transition: show 0.3s ease-in}
.new-background-dark-wash	{background:rgba(255, 255, 255, 0.75); backdrop-filter: saturate(180%) blur(20px); -webkit-backdrop-filter: saturate(180%) blur(20px); transition: show 0.3s ease-in}

.main-scroll-title	{position: absolute; margin: 0 auto; width: 100%; height: 100%; z-index: 3;}
.main-scroll-title-centered {position: fixed; top: 50%; transform: translateY(-45%); left:0; right: 0;}

.dock-image	{width: 690px;
			height: 73px;
background-size: 690px 73px;
background-repeat: no-repeat;
background-image: url("../macdraft-pre-order/images/macdraft-dock.png");
left: 0;
right: 0;
margin: 0 auto;
bottom: 79px;
transform-origin: bottom;
position: absolute;
will-change: transform;
scroll-behavior: smooth;

}

.screen-block-image	{width: 980px;
			height: 587px;
background-size: 980px 587px;
background-repeat: no-repeat;
background-image: url("../macdraft-pre-order/images/macdraft-screen-block.png");
left: 0;
right: 0;
margin: 0 auto;
bottom: 100px;
position: absolute;
will-change: transform;
transform-origin: bottom;
scroll-behavior: smooth;
}

.section-spacer	{padding-bottom: 130px;}

.pro-badge	{width: 130px; height: 40px; line-height: 40px; font-size: 21px; border: 1px solid #121212; -webkit-border-radius:20px; -moz-border-radius:20px; border-radius: 20px; font-weight: 400; margin: 30px auto 10px auto;}
.pro-badge-light	{width: 130px; height: 40px; line-height: 40px; font-size: 21px; border: 1px solid #ffffff; -webkit-border-radius:20px; -moz-border-radius:20px; border-radius: 20px; font-weight: 400; margin: 30px auto 10px auto; color: #ffffff;}

.pro-badge-small	{width: 100px; height: 30px; line-height: 30px; font-size: 17px; border: 1px solid #121212; -webkit-border-radius:15px; -moz-border-radius:15px; border-radius: 15px; font-weight: 400; margin: 30px 0 30px 0;}
.pro-badge-small-light	{width: 75px; height: 30px; line-height: 30px; font-size: 17px; border: 1px solid #ffffff; -webkit-border-radius:15px; -moz-border-radius:15px; border-radius: 15px; font-weight: 400; margin: 20px 0 30px 0; color: #ffffff;}

.version-badge-pink	{width: 70px; height: 30px; line-height: 26px; font-size: 17px; border: 2px solid #D12B78; -webkit-border-radius:15px; -moz-border-radius:15px; border-radius: 15px; font-weight: 400; margin: 20px 0 0 0; box-sizing: border-box; color:#D12B78;}

.version-badge-small	{width: 70px; height: 24px; line-height: 24px; font-size: 15px; border: 1px solid #D00000; -webkit-border-radius:12px; -moz-border-radius:12px; border-radius: 12px; font-weight: 400; margin: 10px 0; color: #D00000}

.more-new-container	{width:87%; max-width: 1440px; margin: 100px auto 0 auto; display: flex; flex-direction: row; flex-wrap: wrap; align-content: flex-start; gap:40px;}
.more-new-inner	{width: 440px; height: auto;background: #efefef; -webkit-border-radius:20px; -moz-border-radius:20px; border-radius: 20px; flex-grow: 4;}
.more-new-inner-padding	{height: auto; padding: 60px;}


.tech-wrapper	{height: 150px; position: relative; overflow: hidden}
.tech-inner-top	{width: 100%; height: 120px; background:url('../macdraft-pre-order/images/tech-slide1.png') repeat-x center; background-size: 4062px 120px; position: absolute; top: 0;}
.tech-inner-bottom	{width: 100%; height: 120px; background:url('../macdraft-pre-order/images/tech-slide2.png') repeat-x center; background-size: 3622px 120px;  position: absolute; bottom: 0;}

.tech-wrapper.heightChange	{height:150px; transition: all 1.5s; will-change: transform; opacity:0}
.tech-wrapper.heightChange.changeOn	{height:240px; opacity:1;}

.fadeInSel.fadeInMove	{opacity: 0; transform: translateY(-75px); transition: all 1s; will-change: transform}
.fadeInSel.fadeInMove.fadeOn	{opacity: 1; transform: translateY(0)}

.padding-align	{padding: 60px 60px 60px 0; width: calc(50% - 85px)!important; min-width: calc(50% - 85px)!important;}

.what-new-select-wrapper	{width:70%; max-width: 500px; margin: 0 auto 60px auto; display: none;}

.shop-new-container	{width:87%; max-width: 940px; margin: 70px auto 120px auto; display: flex; flex-direction: row; flex-wrap: wrap; align-content: flex-start; justify-content: center; gap:40px;}
.shop-new-inner	{width: 450px; max-width: 550px; height: auto;background: #efefef; -webkit-border-radius:20px; -moz-border-radius:20px; border-radius: 20px; flex-grow: 4; position: relative;}
.shop-new-inner-padding	{height: auto; padding: 45px}

.sticky-buy-wrapper	{width:90%; max-width: 1200px; margin:150px auto 120px auto; display: flex; flex-direction: row; gap:70px}
.sticky-buy-left	{width: 100%; max-width: 580px;}
.sticky-buy-right	{width: 100%; max-width: 550px; min-width: 450px;}
.sticky	{position: sticky; top: 100px;}
.sticky-buy-image	{width:100%; height: auto; -webkit-border-radius:20px; -moz-border-radius:20px; border-radius: 20px; overflow: hidden;}

.thin-version	{font-weight: 300}

.light-line-spacer {width: 100%; height: 1px; background: #e5e5e5; margin: 40px auto;}

.reasons-buy-grid-wrapper	{width: 100%; height: auto; display: flex; flex-wrap: wrap; flex-direction: row;}
.reasons-buy-grid-item	{width: 33.3333%; height: auto; flex: 1 1 60px}

.buy-category-container	{border-bottom: 1px solid #e5e5e5;}
.buy-category-note	{height: auto; background:#F5F5F7; padding: 30px; -webkit-border-radius:20px; -moz-border-radius:20px; border-radius: 20px; overflow: hidden}
.buy-category-title-wrapper {padding: 30px 0; display: flex; flex-direction: row; justify-content: space-between; align-items: center;}

.product-note-visibilityUSD, .product-note-visibilityGBP, .product-note-visibilityEUR	{display:none; cursor: pointer;}
.media-note-visibilityUSD, .media-note-visibilityGBP, .media-note-visibilityEUR	{display:none; cursor: pointer;}
.license-note-visibilityUSD, .license-note-visibilityGBP, .license-note-visibilityEUR	{display:none; cursor: pointer;}
.upgrade-note-visibilityUSD, .upgrade-note-visibilityGBP, .upgrade-note-visibilityEUR	{display:none; cursor: pointer;}

.product-note-visibilityUSD-mdpro7, .product-note-visibilityGBP-mdpro7, .product-note-visibilityEUR-mdpro7	{display:none; cursor: pointer;}
.media-note-visibilityUSD-mdpro7, .media-note-visibilityGBP-mdpro7, .media-note-visibilityEUR-mdpro7	{display:none; cursor: pointer;}
.license-note-visibilityUSD-mdpro7, .license-note-visibilityGBP-mdpro7, .license-note-visibilityEUR-mdpro7	{display:none; cursor: pointer;}

.product-note-visibilityUSD-mdpropre7, .product-note-visibilityGBP-mdpropre7, .product-note-visibilityEUR-mdpropre7	{display:none; cursor: pointer;}
.media-note-visibilityUSD-mdpropre7, .media-note-visibilityGBP-mdpropre7, .media-note-visibilityEUR-mdpropre7	{display:none; cursor: pointer;}
.license-note-visibilityUSD-mdpropre7, .license-note-visibilityGBP-mdpropre7, .license-note-visibilityEUR-mdpropre7	{display:none; cursor: pointer;}

.product-note-visibilityUSD-mdpe7, .product-note-visibilityGBP-mdpe7, .product-note-visibilityEUR-mdpe7	{display:none; cursor: pointer;}
.media-note-visibilityUSD-mdpe7, .media-note-visibilityGBP-mdpe7, .media-note-visibilityEUR-mdpe7	{display:none; cursor: pointer;}
.license-note-visibilityUSD-mdpe7, .license-note-visibilityGBP-mdpe7, .license-note-visibilityEUR-mdpe7	{display:none; cursor: pointer;}

.product-note-visibilityUSD-mdpepre7, .product-note-visibilityGBP-mdpepre7, .product-note-visibilityEUR-mdpepre7	{display:none; cursor: pointer;}
.media-note-visibilityUSD-mdpepre7, .media-note-visibilityGBP-mdpepre7, .media-note-visibilityEUR-mdpepre7	{display:none; cursor: pointer;}
.license-note-visibilityUSD-mdpepre7, .license-note-visibilityGBP-mdpepre7, .license-note-visibilityEUR-mdpepre7	{display:none; cursor: pointer;}

/*radio pricing select - START */
.buy-category-radio-wrapper	{width:100%; height:auto; margin:0 auto 0 auto; overflow:hidden; padding:0}

.buy-category-radio-prod {height:auto; border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; padding:0; margin:30px auto;}
.buy-category-radio-prod .mediaLicenseTitle {font-family:-apple-system, BlinkMacSystemFont, "myriad-pro", sans-serif; font-weight:500; font-size:13px; color:#ffffff; line-height:15px; width:90%; margin:0 auto}

.buy-category-radio-prod label {width: 100%; height:auto;border-radius: 20px;-webkit-border-radius: 20px;-moz-border-radius: 20px; background:#ffffff; -webkit-box-shadow: inset 0px 0px 0px 1px rgba(204,204,204,1);
-moz-box-shadow: inset 0px 0px 0px 1px rgba(204,204,204,1);
box-shadow: inset 0px 0px 0px 1px rgba(204,204,204,1); position:relative; padding:30px; margin:0; display: -webkit-box;  
  display: -moz-box;  
  display: -ms-flexbox;  
  display: -webkit-flex; 
  display: flex; flex-direction:row; align-items:center;  box-sizing: border-box; overflow: hidden;}

/* hide input */
.buy-category-radio-prod input.radioSelGBP:empty, .buy-category-radio-prod input.radioSelUSD:empty, .buy-category-radio-prod input.radioSelEUR:empty {margin-top: -50000px;
	visibility:hidden;
}

.buy-category-radio-prod .radioSelGBP, .buy-category-radio-prod .radioSelUSD, .buy-category-radio-prod .radioSelEUR {
	width:10px;
}

/* style label */
.buy-category-radio-prod input.radioSelGBP:empty ~ label, .buy-category-radio-prod input.radioSelUSD:empty ~ label, .buy-category-radio-prod input.radioSelEUR:empty ~ label {
	position: relative;
	
	line-height: 19px;
	text-indent: 0;
	margin-top: 0;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.brs-title	{display: flex; flex-direction: row; justify-content: space-between}
.brs-included	{height: auto; display: flex; flex-direction: row; gap:5px; border-top: 1px solid #efefef; padding-top: 15px; align-items: flex-start}
.brs-included img	{flex: 0 0 30px;}
.brs-included-initial	{display: flex; flex-direction: row; gap:5px; align-items: center;}
.brs-included-flow	{display: flex; flex-direction: row; gap:5px; flex-wrap: wrap; align-items: center;}
.brs-included-flow img	{flex: 0 0 30px;}
/*
.buy-category-radio-prod input.radioSelGBP:empty ~ label::after, .buy-category-radio-prod input.radioSelUSD:empty ~ label::after, .buy-category-radio-prod input.radioSelEUR:empty ~ label::after {
	position: absolute;
	display: block;
	top: 12px;
	right: 12px;
	content: '';
	width: 24px;
	height:24px;
	border-radius: 12px;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	  z-index: 2;
	border: 2px solid #909090;
	box-sizing: border-box;
}

.buy-category-radio-prod input.radioSelGBP:hover:not(:checked) ~ label::after, .buy-category-radio-prod input.radioSelUSD:hover:not(:checked) ~ label::after, .buy-category-radio-prod input.radioSelEUR:hover:not(:checked) ~ label::after {
	content: '';
	line-height:22px;
	color: #ffffff;
	text-align:center;
	opacity:1.0;
	font-size:15px;
	font-family: "Font Awesome 5 Free";

}*/

.buy-category-radio-prod input.radioSelGBP:hover:not(:checked) ~ label, .buy-category-radio-prod input.radioSelUSD:hover:not(:checked) ~ label, .buy-category-radio-prod input.radioSelEUR:hover:not(:checked) ~ label {
	color: #ffffff;
	-webkit-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
-moz-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
	opacity:1.0;

}
/*
.buy-category-radio-prod input.radioSelGBP:checked ~ label::after, .buy-category-radio-prod input.radioSelUSD:checked ~ label::after, .buy-category-radio-prod input.radioSelEUR:checked ~ label::after {
	content: '\f00c';
	line-height:22px;
	color: #ffffff;
	padding:0;
	margin:0;
	text-align:center;
	font-size:15px;
	background-color:#1E76E3;
	font-family: "Font Awesome 5 Free";
	border: 2px solid #1E76E3;
	
}

.buy-category-radio-prod input.radioSelGBP:checked ~ label::after, .buy-category-radio-prod input.radioSelUSD:checked ~ label::after, .buy-category-radio-prod input.radioSelEUR:checked ~ label::after {
	content: '\f00c';
	line-height:22px;
	color: #ffffff;
	padding:0;
	margin:0;
	text-align:center;
	font-size:15px;
	background-color:#1E76E3;
	font-family: "Font Awesome 5 Free";
	border: 2px solid #1E76E3;
}*/

.buy-category-radio-prod input.radioSelGBP:checked ~ label, .buy-category-radio-prod input.radioSelUSD:checked ~ label, .buy-category-radio-prod input.radioSelEUR:checked ~ label {
-webkit-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
-moz-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);	opacity:1.0; background: #F0F6FD;
}
/*radio pricing select - END */

.font-awesome-edit	{border:none; padding: 0; margin-right: 5px; line-height: inherit!important;}
.flex-category-list	{display: flex; flex-direction: row; gap:20px;}

.buy-summary-wrapper	{padding: 40px; background: #f5f5f7; margin: 40px 0; border-radius: 20px;-webkit-border-radius: 20px;-moz-border-radius: 20px; overflow: hidden;}
.order-summary-included	{padding: 30px 10px; border-bottom: 1px solid #dadade; display: flex; flex-direction: row;}

.grey-disable	{opacity: 0.3; pointer-events: none; cursor: default;}

.resp-image {display: none; margin: 40px auto 20px auto; width: 100%; max-width: 500px; border-radius: 20px;-webkit-border-radius: 20px;-moz-border-radius: 20px; overflow: hidden;}
.pre-order-with-new	{display: flex; justify-content: flex-start; align-items: center}

.hide-upgrade-option	{display:none;}


/* Home Page - 2022 */
.banner-info-wrapper	{padding: 0.75rem 0; background-color: rgba(30, 118, 227, 0.4); background-repeat: no-repeat; -webkit-box-shadow: 0px 0px 0px 1px rgba(0,0,0,0.15); -moz-box-shadow: 0px 0px 0px 1px rgba(0,0,0,0.15); box-shadow: 0px 0px 0px 1px rgba(0,0,0,0.15); margin-top: 50px; background-image: linear-gradient(140deg, rgba(30,118,227,0) 6%, rgba(30,118,227,0.25) 33%, rgba(30,118,227,0.25) 64%, rgba(30,118,227,0) 95%); animation: shine 4s infinite; animation-delay: 0s; background-position:-100vw 0;}

.banner-info-wrapper-dark	{padding: 0.75rem 0; background-color: rgba(0, 0, 0, 0.85); background-repeat: no-repeat; margin-top: 50px; background-image: linear-gradient(140deg, rgba(255,255,255,0) 6%, rgba(255,255,255,0.1) 33%, rgba(255,255,255,0.1) 64%, rgba(255,255,255,0) 95%); animation: shine 4s infinite; animation-delay: 0s; background-position:-100vw 0;}

.banner-info-wrapper-blue	{padding: 16px 0; background-color: rgba(30, 118, 227, 1); background-repeat: no-repeat; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; margin-top: 0; background-image: linear-gradient(140deg, rgba(255,255,255,0) 6%, rgba(255,255,255,0.1) 33%, rgba(255,255,255,0.1) 64%, rgba(255,255,255,0) 95%); animation: shine 4s infinite; animation-delay: 0s; background-position:-100vw 0;}

.benefits-bar-wrapper	{width:92%; max-width: 1400px; margin:0 auto; display: flex; justify-content: space-between; position: relative; gap:10px;}

.benefit-item	{font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:13px; color:#ffffff; padding:0; margin:0; text-rendering: optimizeLegibility; line-height: 15px; text-align: left;}
.benefit-item .ibw a {text-decoration:none!important; display: flex; align-items: center; justify-content: center; width:100%; height: 100%; color:#ffffff; padding:0; line-height: 15px}
.benefit-item .ibw a:hover {opacity: 0.8;}
.benefit-item .ibw a:visited	{color:#ffffff!important; text-decoration:none!important;}
.benefit-item i	{font-size:22px; margin-right: 15px;}

.benefit-item .ibwl a {text-decoration:none!important; display: flex; align-items: center; justify-content: center; width:100%; height: 100%; color:#121212; padding:0; line-height: 15px}
.benefit-item .ibwl a:hover {opacity: 0.8;}
.benefit-item .ibwl a:visited	{color:#121212!important; text-decoration:none!important;}
.benefit-item i	{font-size:22px; margin-right: 15px;}

.mbi {display:none;}
.initial-hide {display: block}

.banner-info-content	{height:auto; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:400; font-size:15px; color:#ffffff; padding:0 20px; margin:0; text-rendering: optimizeLegibility; line-height: 25px; text-align: center; box-sizing: border-box;}

.new-prod-banner::before {content: ""; width: 24px; height:24px; background: url("../images/homepage/md8/new-release48x48.png") no-repeat; background-size: cover; display: inline-block; vertical-align: middle; margin-right: 0.5em;}
.banner-info-content::after	{content: "\2192"; margin-left: 0.125em; font-weight: 700;}

.banner-link	{display: block; width: 100%; text-decoration: none;}
.banner-link:visited	{display: block; width: 100%; text-decoration: none;}
.banner-link:hover .banner-link-state	{text-decoration: underline;}

.home-top-image-wrapper	{height: auto; background-image: url("../images/homepage/md8/homepage-banner-image@x2.jpg"); background-repeat:  no-repeat; background-color:  #171D27; background-size: 100%; padding-bottom: 130px}
.reg-trade	{vertical-align: super; font-size: 0.65em}

.animation-nav-wrapper	{width:90%; max-width: 1100px; margin: 80px auto 0 auto; display: flex; align-items: center; justify-content: space-between; padding: 0;}
.animation-nav-container	{width: calc(100% - 60px); max-width: 1000px; }
.animation-nav-container .slick-list .slick-track	{width: 100%!important; display: flex; justify-content: space-between; transform: translate3d(0, 0, 0)!important}

.animation-nav-item-container	{min-height:30px!important; max-height: 30px!important; -webkit-border-radius:15px; -moz-border-radius:15px; border-radius: 15px; color: #ffffff; line-height: 30px; overflow: hidden; position: relative; cursor: pointer; display: grid!important;}
.animation-nav-item-container.is-active	{background: #1D4A7D; transition: background 0.25s ease-in-out}
.animation-nav-progress	{background:#1E76E3; width: 0; height: 30px; grid-area: 1/2;}

.animation-nav-text	{font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:15px; color:#ffffff; padding:0; margin:0 20px; text-rendering: optimizeLegibility; line-height: 30px; text-align: center; grid-area: 1/2}

.homeslickprevStyle, .homeslicknextStyle	{width:30px; height:30px; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; line-height:30px; text-align:center; font-size:15px; color:#ffffff; padding:0; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif;}
.homeslickprevStyle:hover, .homeslicknextStyle:hover	{opacity:0.8}
.homeslickprevStyle i, .homeslicknextStyle i {border:none; line-height:30px; padding:0; color:#ffffff; text-decoration:none}
.homeslickprevStyle a	{width:100%; line-height:30px; display:block; text-decoration:none; color:#ffffff;}
.homeslicknextStyle a	{width:100%; line-height:30px; display:block; text-decoration:none; color:#ffffff;}

.homeslickprevStyle.slick-disabled, .homeslicknextStyle.slick-disabled {opacity: 0.1; pointer-events:none;}

.image-anim-title	{display: none}
.large-anim-title	{display: block}
.small-anim-title	{display: none}

.slider-image-absolute	{margin-bottom: 10px}
.slider-absolute-margin	{margin-bottom:340px}

.font-awesome-nav-edit	{border:none; padding: 0; margin-right: 5px; line-height: inherit!important;}

.slide-round-home	{width:100%; height:auto; margin:0; overflow:hidden; border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px;  -webkit-box-shadow: 2px 4px 12px rgba(0,0,0,0.5); -moz-box-shadow: 2px 4px 12px rgba(0,0,0,0.5); box-shadow: 2px 4px 12px rgba(0,0,0,0.5); position: relative;}

.hero-animation-image-wrapper	{position:absolute; top: 0; left: 0; right: 0; bottom: 0;}
.hero-animation-image-wrapper img	{position:absolute; top: 0; left: 0; right: 0; bottom: 0;}

.slick-slide.main-slide-1200, .slick-slide.main-slide-780 {opacity: 0.15; outline:none; cursor:pointer;}
.slick-center.main-slide-1200, .slick-center.main-slide-780 {opacity: 1.0; outline:none; cursor:auto;}

.carousel-container {
  width: 100%;
  margin: 0 auto;
  max-width: 1649px;
}

.slick-home-main .slick-list {
  padding-top: 14px!important;
  padding-bottom: 14px!important;
  padding-left: 12%!important;
  padding-right: 12%!important;
}

.slick-home-main {width:100%; height:auto; margin:60px auto 60px auto; }

.slick-home-main .slick-track {
  max-width: 100%!important;
  transform: translate3d(0, 0, 0)!important;
  perspective: 100px;
}

.slick-home-main .slick-slide {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  opacity: 0;
  width: 100%!important;
  transform: translate3d(0, 0, 0);
  transition: transform 1s, opacity 1s;
}

.slick-home-main .slick-current {
  opacity: 1;
  position: relative;
  display: block;
  z-index: 3;
}

.slick-home-main .slick-snext,
.slick-home-main .slick-sprev,
.slick-home-main .slick-snext2,
.slick-home-main .slick-sprev2,
.slick-home-main .slick-snext3,
.slick-home-main .slick-sprev3{
  display: block;
	opacity:0.6;
}

.slick-home-main .slick-snext {
  transform: translate3d(10%, 0, -8px);
  z-index: 2;
  perspective: 1000px;
	filter: blur(2px);
	-webkit-filter: blur(2px) saturate(50%) brightness(50%);
}
.slick-home-main .slick-snext2 {
  transform: translate3d(20%, 0, -16px);
  z-index: 1;
  perspective: 1000px;
	filter: blur(4px);
	-webkit-filter: blur(4px) saturate(50%) brightness(50%);
}
.slick-home-main .slick-snext3 {
  transform: translate3d(30%, 0, -24px);
  z-index: 0;
  perspective: 1000px;
	filter: blur(4px);
	-webkit-filter: blur(6px) saturate(50%) brightness(50%);
}

.slick-home-main .slick-sprev {
  transform: translate3d(-10%, 0, -8px);
	filter: blur(2px);
	-webkit-filter: blur(2px) saturate(50%) brightness(50%);
}

.slick-home-main .slick-sprev2 {
  transform: translate3d(-20%, 0, -16px);
	filter: blur(4px);
	-webkit-filter: blur(4px) saturate(50%) brightness(50%);
}
.slick-home-main .slick-sprev3 {
  transform: translate3d(-30%, 0, -24px);
	filter: blur(4px);
	-webkit-filter: blur(6px) saturate(50%) brightness(50%);
}

.slider-spacer-end	{width: 30px; transform: translateX(calc(max(1024px, 100vw)/2 - 630px));}
.car-slider-spacer-end	{width: 30px; transform: translateX(calc(max(1024px, 100vw)/2 - 660px));}
.compare-slider-spacer-end	{width: 30px; transform: translateX(calc(max(1024px, 100vw)/2 - 660px));}
.image-right-text-left	{display: flex; flex-direction:row;}

.image-right-text-left-image	{width: 50%; background: url("../images/homepage/md8/investing-macdraft.jpg")no-repeat center; background-size: cover;}
.image-right-text-left-text	{width: 50%; padding:8% 0;}

.home-grid-set-container	{display: grid; grid-template-columns: auto auto auto; grid-template-rows: auto auto; grid-gap: 40px; margin:0 auto; width: 87%; max-width: 1400px; height:auto; grid-auto-flow: row dense;}

.home-grid-set-item	{
-webkit-box-shadow: 2px 4px 12px rgba(204,204,204,0.8); -moz-box-shadow: 2px 4px 12px rgba(204,204,204,0.8); box-shadow: 2px 4px 12px rgba(204,204,204,0.8); border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; background:#ffffff; overflow:hidden; transition: all .3s cubic-bezier(0,0,.5,1); position: relative; cursor:pointer; display: flex; flex-direction: column;}

.home-grid-set-item4 {grid-column: auto / span 2;}
.home-grid-set-item5 {grid-column: auto / span 1;}

.home-grid-set-item:hover	{-webkit-box-shadow: 2px 4px 16px rgba(0,0,0,0.16);
-moz-box-shadow: 2px 4px 16px rgba(0,0,0,0.16);
box-shadow: 2px 4px 16px rgba(0,0,0,0.16); transform: scale(1.02);}

.home-grid-set-item:hover .pink-main-button	{animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;}

.home-grid-set-item:hover .blue-hover-frame	{border: 2px solid #1E76E3; opacity: 1}

.home-grid-set-inner	{width: 100%; height: auto; margin-top:50px; display: grid; grid-template-columns: auto; grid-template-rows: auto auto auto auto; grid-gap: 40px;}


.more-info-grid-container	{display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: auto auto; grid-gap: 40px; margin:100px auto; width: 86%; max-width: 1400px; height:auto; grid-auto-flow: row dense;}
.more-info-grid-item	{background:#efefef; overflow:hidden; transition: all .3s cubic-bezier(0,0,.5,1); cursor:pointer; -webkit-border-radius:20px; -moz-border-radius:20px; border-radius: 20px; position: relative; display: flex; flex-direction: column;}
.more-info-grid-item .new-prod-badge	{position: absolute; top:34px; right: 34px;}
.more-info-grid-item .rec-prod-badge	{position: absolute; top:34px; right: 34px;}


.more-info-grid-item:hover	{transform: scale(1.02);}
.more-info-grid-item:hover .blue-hover-frame	{border: 2px solid #1E76E3; opacity: 1;}
.more-info-grid-item:hover .blue-main-button	{opacity:0.8; animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;}

.more-info-grid-container2	{display: grid; grid-template-columns: repeat(2, 1fr); grid-template-rows: auto auto; grid-gap: 40px; margin:100px auto; width: 86%; max-width: 1400px; height:auto; grid-auto-flow: row dense;}

/*Change Banner Background on hero progress click*/
.is-architect	{background-image: url("../images/homepage/md8/homepage-banner-image@x2.jpg");}
.is-engineer	{background-image: url("../images/homepage/md8/homepage-engineer-banner-image.jpg");}
.is-garden	{background-image: url("../images/homepage/md8/homepage-garden-banner-image.jpg"); }
.is-layout	{background-image: url("../images/homepage/md8/homepage-layout-banner-image.jpg"); }



/* Progress Bar Animations */
.is-active#heroArchitectProgress .animation-nav-progress	{animation: growProgress 22.1s linear forwards; animation-delay: 1.5s}
.is-active#heroEngineerProgress .animation-nav-progress	{animation: growProgress 19.8s linear forwards; animation-delay: 1.5s}
.is-active#heroGardenProgress .animation-nav-progress	{animation: growProgress 13s linear forwards; animation-delay: 1.5s}
.is-active#heroLayoutProgress .animation-nav-progress	{animation: growProgress 12s linear forwards; animation-delay: 1.5s}

/* Hero Animations */
.slick-home-main .slick-current .hero-animation-image-wrapper #architect-hero-arrow {
	animation: 
		moveArchitectArrow1 1s forwards,
		moveArchitectArrow2 1s forwards,
		moveArchitectArrow3 0.25s forwards,
		moveArchitectArrow4 0.75s forwards,
		moveArchitectArrow5 0.75s forwards,
		moveArchitectArrow6 0.75s forwards,
		moveArchitectArrow7 0.75s forwards,
		moveArchitectArrow8 0.5s forwards,
		moveArchitectArrow9 1s forwards,
		moveArchitectArrow10 1.5s forwards,
		moveArchitectArrow11 1s forwards,
		moveArchitectArrow12 0.75s forwards;
	
	animation-delay: 
		2s, 4s, 5.5s, 6.5s, 8s, 10s, 11.5s, 13s, 14.5s, 16.5s, 19s, 22.5s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #architect-page-setup-button {
	opacity: 0;
	animation: 
		toggleClickState 0.5s forwards;
	animation-delay: 
		3s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #architect-page-setup-panel-1 {
	opacity: 0;
	animation: 
		showOpacity 0.1s forwards,
		hideOpacity 0.1s forwards;
	animation-delay: 
		3.5s, 7.5s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #architect-page-setup-menu-1 {
	opacity: 0;
	animation: 
		showOpacity 0.1s forwards,
		hideOpacity 0.1s forwards;
	animation-delay: 
		5.2s, 6s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #architect-page-setup-menu-2 {
	opacity: 0;
	animation: 
		showOpacity 0.1s forwards,
		hideOpacity 0.1s forwards;
	
	animation-delay: 
		5.5s, 6s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #architect-page-setup-menu-3 {
	opacity: 0;
	animation: 
		showOpacity 0.1s forwards,
		hideOpacity 0.1s forwards;
	animation-delay: 
		6s, 7.5s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #architect-scale-panel {
	opacity: 0;
	animation: 
		showOpacity 0.1s forwards,
		hideOpacity 0.1s forwards;
	animation-delay: 
		9.5s, 14s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #architect-scale-menu-1 {
	opacity: 0;
	animation: 
		showOpacity 0.1s forwards,
		hideOpacity 0.1s forwards;
	animation-delay: 
		11s, 12.5s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #architect-scale-menu-2 {
	opacity: 0;
	animation: 
		showOpacity 0.1s forwards,
		hideOpacity 0.1s forwards;
	animation-delay: 
		12s, 12.5s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #architect-scale-menu-3 {
	opacity: 0;
	animation: 
		showOpacity 0.1s forwards,
		hideOpacity 0.1s forwards;
	animation-delay: 
		12.5s, 14s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #architect-layers-1 {
	opacity: 0;
	animation: 
		showOpacity 0.1s forwards,
		hideOpacity 0.1s forwards;
	animation-delay: 
		16s, 23.5s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #architect-layers-2 {
	opacity: 0;
	animation: 
		showOpacity 0.1s forwards,
		hideOpacity 0.1s forwards;
	animation-delay: 
		18.5s, 23.5s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #architect-layers-3 {
	opacity: 0;
	animation: 
		showOpacity 0.1s forwards,
		hideOpacity 0.1s forwards;
	animation-delay: 
		20.5s, 21.8s ;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #architect-layers-4 {
	opacity: 0;
	animation: 
		showOpacity 0.1s forwards,
		hideOpacity 0.1s forwards;
	animation-delay: 
		21s, 21.8s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #architect-layers-5 {
	opacity: 0;
	animation: 
		showOpacity 0.1s forwards,
		hideOpacity 0.1s forwards;
	animation-delay: 
		21.2s, 21.8s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #architect-layers-6 {
	opacity: 0;
	animation: 
		showOpacity 0.1s forwards,
		hideOpacity 0.1s forwards;
	animation-delay: 
		21.4s, 21.8s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #architect-layers-7 {
	opacity: 0;
	animation: 
		showOpacity 0.1s forwards,
		hideOpacity 0.1s forwards;
	animation-delay: 
		21.6s, 21.8s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #architect-layers-8 {
	opacity: 0;
	animation: 
		showOpacity 0.1s forwards,
		hideOpacity 0.1s forwards;
	animation-delay: 
		21.8s, 23.5s;
}






.slick-home-main .slick-current .hero-animation-image-wrapper #engineer-hero-arrow {
	animation: 
		moveEngineerArrowRuler 1.5s forwards,
		moveEngineerArrowGuide1 1s forwards,
		moveEngineerArrowGuide2 1s forwards,
		moveEngineerArrowGuide3 1.5s forwards,
		moveEngineerArrowGuide4 1s forwards,
		moveEngineerArrowGuide5 1.5s forwards,
		moveEngineerArrowGuide6 1.5s forwards,
		moveEngineerArrowGuide7 1.5s forwards,
		moveEngineerArrowGuide8 1s forwards,
		moveEngineerArrowGuide9 1s forwards,
		showOpacity 0s forwards,
		moveEngineerArrowGuide10 1s forwards;
	
	animation-delay: 
		2s, 4s, 5.5s, 7s, 9s, 10.5s, 12.5s, 14.3s, 16s, 17.2s, 18.5s, 19.5s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #engineer-vert-guide-1 {
	opacity:0;
	animation: 
		moveEngineerVertGuide1 1s forwards;
	
	animation-delay: 
		4s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #engineer-vert-guide-2 {
	opacity:0;
	animation: 
		moveEngineerVertGuide2 1.5s forwards;
	
	animation-delay: 
		7s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #engineer-guide-cursor-1 {
	opacity:0;
	animation: 
		moveEngineerVertCursor1 1s forwards,
		moveEngineerVertCursor2 1s forwards,
		moveEngineerVertCursor3 1.5s forwards,
		moveEngineerVertCursor4 1s forwards;
	
	animation-delay: 
		4s, 5.5s, 7s, 9s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #engineer-horiz-guide-1 {
	opacity:0;
	animation: 
		moveEngineerHorizGuide1 1.5s forwards;
	
	animation-delay: 
		10.5s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #engineer-guide-cursor-2 {
	opacity:0;
	animation: 
		moveEngineerHorizCursor1 1.5s forwards,
		moveEngineerHorizCursor2 1.5s forwards;
	
	animation-delay: 
		10.5s, 12.5s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #engineer-dim-tool {
	opacity:0;
	animation: 
		showOpacity 0.1s forwards;
	
	animation-delay: 
		14s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #engineer-dim-cursor-1 {
	opacity:0;
	animation: 
		moveEngineerDimCursor1 1.5s forwards,
		hideOpacity 0s forwards;
	
	animation-delay: 
		14.3s, 16s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #engineer-dim-cursor-2 {
	opacity:0;
	animation: 
		moveEngineerDimCursor2 1s forwards,
		hideOpacity 0s forwards;
	
	animation-delay: 
		16s, 17.2s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #engineer-dim-anchor-1 {
	opacity:0;
	animation: 
		moveEngineerDimAnchor1 1s forwards,
		hideOpacity 0s forwards;
	
	animation-delay: 
		17.2s, 18.5s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #engineer-dim-show {
	opacity:0;
	animation: 
		showOpacity 0s forwards;
	
	animation-delay: 
		18.5s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #engineer-dim-options {
	opacity:0;
	animation: 
		showOpacity 0s forwards;
	
	animation-delay: 
		18.5s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #engineer-format-click {
	opacity:0;
	animation: 
		showOpacity 0.1s forwards;
	
	animation-delay: 
		21s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #engineer-final-panel {
	opacity:0;
	animation: 
		showOpacity 0.1s forwards;
	
	animation-delay: 
		21.2s;
}






.slick-home-main .slick-current .hero-animation-image-wrapper #garden-hero-arrow {
	animation: 
		moveGardenArrowUp 1s forwards, 
		moveGardenArrowLeft 1s forwards, 
		moveGardenArrowClose 1s forwards,
		moveGardenArrowPanel 1s forwards,
		moveGardenArrowColorPanel 0.75s forwards,
		moveGardenArrowPatternPanel 0.5s forwards,
		moveGardenArrowApplyPattern 0.5s forwards;
	
	animation-delay: 
		2s, 4s, 6.5s, 8.5s, 10.5s, 12.25s, 13.5s;
}
.slick-home-main .slick-current .hero-animation-image-wrapper #garden-hero-library-item {
	animation: 
		moveGardenLibraryItem 1s forwards,
		moveGardenLibraryItemDrop 0.05s forwards;
	animation-delay: 
		4s, 5.2s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #garden-hero-library-item-put-in {
	visibility: hidden;
	transform: translate(-37%, 1%);
	animation: 
		showItem 0.05s forwards;
	animation-delay: 
		5.2s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #garden-hero-library {
	animation: 
		hideOpacity 0.25s forwards;
	animation-delay: 
		8s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #garden-hero-panel-button {
	opacity: 0;
	animation: 
		toggleClickState 1s forwards;
	animation-delay: 
		9.75s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #garden-hero-panel-right {
	transform: translateX(25%);
	animation: 
		slideInShow 0.75s forwards;
	animation-delay: 
		9.75s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #garden-hero-panel-color {
	opacity: 0;
	animation: 
		showOpacity 0.25s forwards,
		hideOpacity 0s forwards;
	animation-delay: 
		11.5s, 13s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #garden-hero-panel-pattern {
	opacity: 0;
	animation: 
		showOpacity 0s forwards,
		hideOpacity 0s forwards;
	animation-delay: 
		13s, 14.5s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #garden-hero-garden-complete {
	opacity: 0;
	animation: 
		showOpacity 0s forwards;
	animation-delay: 
		14.5s;
}



.slick-home-main .slick-current .hero-animation-image-wrapper #layout-hero-arrow {
	animation: 
		moveLayoutArrow1 1s forwards,
		moveLayoutArrow2 1s forwards,
		moveLayoutArrow3 1.5s forwards,
		moveLayoutArrow4 1s forwards,
		moveLayoutArrow5 0.75s forwards,
		hideOpacity 0s forwards,
		moveLayoutArrow6 0.75s forwards,
		showOpacity 0s forwards;
	
	animation-delay: 
		2s, 3.5s, 6s, 8.5s, 10.5s, 11.5s, 12.5s, 13.5s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #layout-library-1 {
	opacity: 1;
	animation: 
		hideOpacity 0.1s forwards;
	animation-delay: 
		8s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #layout-library-2 {
	opacity: 0;
	animation: 
		showOpacity 0s forwards,
		moveLayoutLibraryItem 1s forwards,
		hideOpacity 0s forwards;
	animation-delay: 
		3.5s, 3.5s, 5s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #layout-library-3 {
	opacity: 0;
	animation: 
		showOpacity 0s forwards,
		hideOpacity 0s forwards;
	animation-delay: 
		5s, 10s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #layout-library-4 {
	opacity: 0;
	animation: 
		showOpacity 0s forwards;
	animation-delay: 
		10s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #layout-library-5 {
	opacity: 0;
	animation: 
		showOpacity 0s forwards;
	animation-delay: 
		10s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #layout-link-arrow {
	opacity: 0;
	transform: translate(-20.5%, -45%);
	animation: 
		showOpacity 0s forwards,
		moveLayoutLink1 0.75s forwards,
		hideOpacity 0s forwards;
	animation-delay: 
		11.5s, 12.5s, 13.5s;
}

.slick-home-main .slick-current .hero-animation-image-wrapper #layout-library-6 {
	opacity: 0;
	animation: 
		showOpacity 0s forwards;
	animation-delay: 
		13.5s;
}





.will-animate	{opacity:0;}
.animate-slide-down.is-animating	{animation: slideDownShow 0.75s forwards;}
.animate-slide-up.is-animating	{animation: slideUpShow 0.75s forwards;}
.animate-slide-left.is-animating	{animation: slideFromLeftShow 0.75s forwards;}
.animate-slide-right.is-animating	{animation: slideFromRightShow 0.75s forwards;}
.animate-hide-away.is-animating	{animation: hideAway 0.75s forwards;}
.animate-slide-up-scale.is-animating	{animation: slideUpScaleShow 0.75s forwards; transform-origin: center;}

@keyframes hideAway {
    from {
		opacity: 1;
        transform: translateY(0)
		
    }
	to	{
		opacity:0;
		transform: translateY(200px)
	}
}

@keyframes shake {
    10%, 90% {
    transform: translate3d(-1px, 0, 0);
  }
  
  20%, 80% {
    transform: translate3d(2px, 0, 0);
  }

  30%, 50%, 70% {
    transform: translate3d(-4px, 0, 0);
  }

  40%, 60% {
    transform: translate3d(4px, 0, 0);
  }
}

@keyframes shine {
    from {
        background-position:-100vw 0
    }
	
    to {
        background-position:100vw 0
    }
}
@keyframes appearBannerDown {
    from {
        opacity: 0;
        transform:translateY(-2rem)
    }
	50%	
	{opacity: 0;
        transform:translateY(-2rem)}

    to {
        opacity: 1;
        transform:translateY(0)
    }
}

@keyframes growProgress {
    from {
        width: 0
    }
    to {
        width: 100%
    }
}

@keyframes moveGardenArrowUp {
    from {
        transform: translate(0, 0)
    }
	to	{
		transform: translate(-1%, -27%)
	}
}

@keyframes moveGardenArrowLeft {
    from {
        transform: translate(-1%, -27%)
    }
	to	{
		transform: translate(-37%, -25%)
	}
}

@keyframes moveGardenArrowClose {
    from {
        transform: translate(-37%, -25%)
    }
	to	{
		transform: translate(-27.5%, -61%)
	}
}

@keyframes moveGardenArrowPanel {
    from {
        transform: translate(-27.5%, -61%)
    }
	to	{
		transform: translate(31%, -72%)
	}
}

@keyframes moveGardenArrowColorPanel {
    from {
        transform: translate(31%, -72%)
    }
	to	{
		transform: translate(20%, -52%)
	}
}

@keyframes moveGardenArrowPatternPanel {
    from {
        transform: translate(20%, -52%)
    }
	to	{
		transform: translate(20%, -47%)
	}
}

@keyframes moveGardenArrowApplyPattern {
    from {
        transform: translate(20%, -47%)
    }
	to	{
		transform: translate(21%, -38%)
	}
}

@keyframes moveGardenLibraryItem {
    from {
        transform: translate(0, 0)
		
    }
	to	{
		transform: translate(-37%, 1%)
	}
}

@keyframes moveGardenLibraryItemDrop {
    from {
        opacity: 1
		
    }
	to	{
		opacity: 0
	}
}

@keyframes showItem {
    from {
        visibility: hidden
		
    }
	to	{
		visibility: visible
	}
}

@keyframes hideOpacity {
    from {
        opacity: 1
		
    }
	to	{
		opacity: 0
	}
}

@keyframes showOpacity {
    from {
        opacity: 0
		
    }
	to	{
		opacity: 1
	}
}

@keyframes toggleClickState {
    from, to {
        opacity: 0
		
    }
	50%	{
		opacity: 1
	}
}

@keyframes slideInShow {
    from {
        transform: translateX(25%)
		
    }
	to	{
		transform: translateX(0)
	}
}

@keyframes slideDownShow {
    from {
		opacity: 0;
        transform: translateY(-100px)
		
    }
	to	{
		opacity:1;
		transform: translateY(0)
	}
}

@keyframes slideUpShow {
    from {
		opacity: 0;
        transform: translateY(100px)
		
    }
	to	{
		opacity:1;
		transform: translateY(0)
	}
}
@keyframes slideUpScaleShow {
    from {
		opacity: 0;
        transform: translateY(100px) scale(0)
		
    }
	to	{
		opacity:1;
		transform: translateY(0) scale(1)
	}
}

@keyframes slideFromLeftShow {
    from {
		opacity: 0;
        transform: translateX(-100px)
		
    }
	to	{
		opacity:1;
		transform: translateX(0)
	}
}

@keyframes slideFromRightShow {
    from {
		opacity: 0;
        transform: translateX(100px)
		
    }
	to	{
		opacity:1;
		transform: translateX(0)
	}
}

@keyframes moveEngineerArrowRuler {
    from {transform: translate(0, 0)}
	to	{transform: translate(-56.5%, -15%)}
}

@keyframes moveEngineerArrowGuide1 {
    from {opacity:0; transform: translate(-56.5%, -15%)}
	to	{opacity:0; transform: translate(-50.25%, -15%)}
}

@keyframes moveEngineerVertGuide1 {
    from {opacity:0; transform: translateX(0)}
	3%	{opacity:1}
	to	{opacity:1; transform: translateX(6.25%)}
}

@keyframes moveEngineerVertCursor1 {
    from {opacity:0; transform: translateX(0)}
	3%	{opacity:1}
	to	{opacity:1; transform: translateX(6.25%)}
}

@keyframes moveEngineerArrowGuide2 {
    from {opacity:1; transform: translate(-50.25%, -15%)}
	to	{opacity:1; transform: translate(-56.5%, -15%)}
}

@keyframes moveEngineerVertCursor2 {
    from {opacity:0; transform: translateX(6.25%)}
	to	{opacity:0; transform: translateX(0)}
}

@keyframes moveEngineerVertGuide2 {
    from {opacity:0; transform: translateX(0)}
	3%	{opacity:1}
	to	{opacity:1; transform: translateX(34.1%)}
}

@keyframes moveEngineerArrowGuide3 {
    from {opacity:0; transform: translate(-56.5%, -15%)}
	to	{opacity:0; transform: translate(-22.4%, -15%)}
}

@keyframes moveEngineerVertCursor3 {
    from {opacity:0; transform: translateX(0)}
	3%	{opacity:1}
	to	{opacity:1; transform: translateX(34.1%)}
}
@keyframes moveEngineerArrowGuide4 {
    from {opacity:1; transform: translate(-22.4%, -15%)}
	to	{opacity:1; transform: translate(-30%, -68%)}
}

@keyframes moveEngineerVertCursor4 {
    from {opacity:0;}
	to	{opacity:0;}
}

@keyframes moveEngineerHorizGuide1 {
    from {opacity:0; transform: translateY(0)}
	3%	{opacity:1}
	to	{opacity:1; transform: translateY(44.6%)}
}

@keyframes moveEngineerHorizCursor1 {
    from {opacity:1; transform: translateY(0)}
	to	{opacity:1; transform: translateY(44.6%)}
}

@keyframes moveEngineerArrowGuide5 {
    from {opacity:0; transform: translate(-30%, -68%)}
	to	{opacity:0; transform: translate(-30%, -23.4%)}
}

@keyframes moveEngineerArrowGuide6 {
    from {opacity:1; transform: translate(-30%, -23.4%)}
	to	{opacity:1; transform: translate(-65%, -22.4%)}
}

@keyframes moveEngineerHorizCursor2 {
    from {opacity:0; transform: translateY(0)}
	to	{opacity:0; transform: translateY(44.6%)}
}

@keyframes moveEngineerArrowGuide7 {
    from {opacity:0; transform: translate(-65%, -22.4%)}
	to	{opacity:0; transform: translate(-6.2%, -23.4%)}
}

@keyframes moveEngineerDimCursor1 {
    from {opacity:1; transform: translate(0, 0)}
	to	{opacity:1; transform: translate(58.8%, -1%)}
}

@keyframes moveEngineerArrowGuide8 {
    from {opacity:0; transform: translate(-6.2%, -23.4%)}
	to	{opacity:0; transform: translate(11%, -23.4%)}
}

@keyframes moveEngineerDimCursor2 {
    from {opacity:1; transform: translate(0, 0)}
	to	{opacity:1; transform: translate(17.2%, 0)}
}

@keyframes moveEngineerArrowGuide9 {
    from {opacity:0; transform: translate(11%, -23.4%)}
	to	{opacity:0; transform: translate(2.4%, -28%)}
}

@keyframes moveEngineerDimAnchor1 {
    from {opacity:1; transform: translate(0, 0)}
	to	{opacity:1; transform: translate(-8.6%, -4.4%)}
}

@keyframes moveEngineerArrowGuide10 {
    from {transform: translate(2.4%, -28%)}
	to	{transform: translate(22%, -12%)}
}


@keyframes moveArchitectArrow1 {
    from {transform: translate(0, 0)}
	to	{transform: translate(-23%, -72%)}
}

@keyframes moveArchitectArrow2 {
    from {transform: translate(-23%, -72%)}
	to	{transform: translate(-15%, -29%)}
}

@keyframes moveArchitectArrow3 {
    from {transform: translate(-15%, -29%)}
	to	{transform: translate(-15%, -32%)}
}

@keyframes moveArchitectArrow4 {
    from {transform: translate(-15%, -32%)}
	to	{transform: translate(-5%, -16%)}
}

@keyframes moveArchitectArrow5 {
    from {transform: translate(-5%, -16%)}
	to	{transform: translate(-15%, -80%)}
}

@keyframes moveArchitectArrow6 {
    from {transform: translate(-15%, -80%)}
	to	{transform: translate(-15%, -31%)}
}

@keyframes moveArchitectArrow7 {
    from {transform: translate(-15%, -31%)}
	to	{transform: translate(-14%, -10%)}
}

@keyframes moveArchitectArrow8 {
    from {transform: translate(-14%, -10%)}
	to	{transform: translate(-9%, -5%)}
}

@keyframes moveArchitectArrow9 {
    from {transform: translate(-9%, -5%)}
	to	{transform: translate(23.5%, -67%)}
}

@keyframes moveArchitectArrow10 {
    from {transform: translate(23.5%, -67%)}
	to	{transform: translate(15.5%, 22.5%)}
}

@keyframes moveArchitectArrow11 {
    from {transform: translate(15.5%, 22.5%)}
	to	{transform: translate(21%, -28%)}
}

@keyframes moveArchitectArrow12 {
    from {transform: translate(21%, -28%)}
	to	{transform: translate(21%, -67%)}
}


@keyframes moveLayoutArrow1 {
    from {transform: translate(0, 0)}
	to	{transform: translate(-28%, -17%)}
}

@keyframes moveLayoutArrow2 {
    from {transform: translate(-28%, -17%)}
	to	{transform: translate(-9.5%, 3%)}
}

@keyframes moveLayoutLibraryItem {
    from {transform: translate(0, 0) scale(1); transform-origin: center}
	
	to	{transform: translate(13%, 24%) scale(0.5); transform-origin: center}
}

@keyframes moveLayoutArrow3 {
    from {transform: translate(-9.5%, 3%)}
	to	{transform: translate(-63%, -29.5%)}
}

@keyframes moveLayoutArrow4 {
    from {transform: translate(-63%, -29.5%)}
	to	{transform: translate(-30%, -40%)}
}

@keyframes moveLayoutArrow5 {
    from {transform: translate(-30%, -40%)}
	to	{transform: translate(-20.5%, -45%)}
}

@keyframes moveLayoutArrow6 {
    from {transform: translate(-20.5%, -45%)}
	to	{transform: translate(-30%, -15%)}
}

@keyframes moveLayoutLink1 {
    from {transform: translate(-20.5%, -45%)}
	to	{transform: translate(-30%, -15%)}
}


.guide-nav-wrapper	{width: 100%; height: auto; background: rgba(0, 0, 0, 0.75); position: absolute; z-index: 390000}

.fixed-guide-nav	{position: fixed; top: 0; left:0; margin-top: 0;  backdrop-filter: saturate(180%) blur(20px); -webkit-backdrop-filter: saturate(180%) blur(20px); border-bottom: 1px solid rgba(0, 0, 0, 1.0);}

.userguide-nav-inner-container	{width: 87%; max-width: 1200px; margin: 0 auto; height: 58px; display: flex; justify-content: space-between; align-items: center;}
.userguide-content-button	{flex-shrink: 0;}

.guide-nav-inner-container	{width: 87%; max-width: 1200px; margin: 0 auto; height: 58px; display: flex; align-items: center;}
.guide-nav-content	{flex: 1; display: flex; justify-content: center;}
.guide-nav-content:first-child	{margin-right: auto; justify-content: flex-start}
.guide-nav-content:last-child	{margin-left: auto; justify-content: flex-end}

.guide-sticky-buy-wrapper	{width:87%; max-width: 1200px; margin:70px auto 100px auto; display: flex; flex-wrap:nowrap;}
.guide-sticky-buy-left	{width: 240px; max-width: 240px; min-width: 240px; background: #ffffff; padding-top: 50px; position: sticky; position: -webkit-sticky; bottom:30px; top: 50px;  overflow: hidden;}
.guide-sticky-buy-right	{height: auto; padding: 0 70px;  background: #ffffff; margin-left: 0;  padding-top:50px;  z-index: 1;}
.guide-nav-sticky	{position: sticky; position: -webkit-sticky; bottom:0; top: 80px; overflow: hidden;}
#guide-nav-sticky-button	{max-width: 120px}
#guide-nav-contact		{max-width: 120px}	

.guide-sticky-buy-right.change-padding-right	{padding-top:50px}

.guide-sticky-buy-right.not-nav	{margin-left: -260px;}

.guide-resp-nav-container	{width: 100%; height: auto; background: #606060; padding: 15px 0}

#guide-nav-resp	{display:none;}

ul#guide-subnav {width: 100%; height: 100%; margin: 0; padding: 0; list-style: none;}
ul#guide-subnav li {height: auto; text-align: left; color: #121212; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:14px; text-rendering: optimizeLegibility; border-bottom: 1px solid #e5e5e5; line-height: 20px}
ul#guide-subnav li:last-child {border:none;}
ul#guide-subnav li a {display: block; width: 100%; height: 100%; padding: 15px 0; text-decoration: none; color: #121212; line-height: 20px;}
ul#guide-subnav li a:hover {color: #1E76E3!important; transition: all .1s cubic-bezier(0,0,.5,1);}
ul#guide-subnav li a:visited {color: #121212;}
ul#guide-subnav li a.active-guide-subnav {color: #1E76E3; font-weight: 700; margin-left: 0!important;}
ul#guide-subnav li a i {border: none; margin-right: 10px; padding: 0; text-align: center; width: 20px; line-height: 20px}
ul#guide-subnav li a.with-sub-nav	{display: flex; justify-content: space-between}

ul#guide-subnav-inner {width: 100%; height: 100%; margin: 0; padding: 0; list-style: none; margin-bottom: 20px; box-sizing: border-box}
ul#guide-subnav-inner li {height: auto; text-align: left; color: #606060; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:14px; text-rendering: optimizeLegibility; border: none;}
ul#guide-subnav-inner li a {display: block; width: 100%; height: 100%; padding: 6px 0; text-decoration: none; color: #606060;}
ul#guide-subnav-inner li a:hover {color: #1E76E3!important; transition: all .1s cubic-bezier(0,0,.5,1);}
ul#guide-subnav-inner li a:visited {color: #121212;}
ul#guide-subnav-inner li a.active-guide-subnav {color: #1E76E3; font-weight: 700; margin-left: 0!important}
ul#guide-subnav-inner li a i {border: none; margin-right: 10px; padding: 0; text-align: center; width: 20px}

ul#userguide-subnav {width: 100%; height: 100%; margin: 0; padding: 0; list-style: none;}
ul#userguide-subnav li {height: auto; text-align: left; color: #121212; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:15px; text-rendering: optimizeLegibility; line-height: 20px}
ul#userguide-subnav li a {display: block; width: 100%; height: 100%; padding: 8px 0; text-decoration: none; color: #121212; line-height: 20px;}
ul#userguide-subnav li a:hover {color: #1E76E3!important; transition: all .1s cubic-bezier(0,0,.5,1);}
ul#userguide-subnav li a:visited {color: #121212;}
ul#userguide-subnav li a.active-guide-subnav {color: #1E76E3; font-weight: 700; margin-left: 0!important;}
ul#userguide-subnav li a i {border: none; margin-right: 10px; padding: 0; text-align: center; width: 20px; line-height: 20px}
ul#userguide-subnav li a.with-sub-nav	{display: flex; justify-content: space-between}

ul#userguide-subnav-inner {width: 100%; height: 100%; margin: 0; padding: 0; list-style: none; margin-bottom: 4px; margin-left: 15px; box-sizing: border-box}
ul#userguide-subnav-inner li {height: auto; text-align: left; color: #535356; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:14px; text-rendering: optimizeLegibility; border: none;}
ul#userguide-subnav-inner li a {display: block; width: 100%; height: 100%; padding: 6px 0; text-decoration: none; color: #535356;}
ul#userguide-subnav-inner li a:hover {color: #1E76E3!important; transition: all .1s cubic-bezier(0,0,.5,1);}
ul#userguide-subnav-inner li a:visited {color: #535356;}
ul#userguide-subnav-inner li a.active-guide-subnav {color: #1E76E3; font-weight: 700; margin-left: 0!important}
ul#userguide-subnav-inner li a i {border: none; margin-right: 10px; padding: 0; text-align: center; width: 20px}

/* Masking icons */
ul#guide-subnav li a .nav-mask {background:#606060; width: 16px; height: 16px; -webkit-mask-size: cover; margin-right: 10px;}
ul#guide-subnav li a:hover .nav-mask {background:#1E76E3;}
ul#guide-subnav li a.active-guide-subnav .nav-mask {background:#1E76E3;}

.nav-mask {width: 16px; height: 16px; -webkit-mask-size: cover; margin-right: 10px;}
.house-mask	{-webkit-mask-image: url("../images/products/md8/house.png");}

#guide-nav-button	{display: block}
#guide-nav-button-resp {display:none}

.guide-text {width: 100%; height: auto; margin: 30px auto 0 auto; padding-left: 20px;}
.guide-text li {height: auto; text-align: left; color: #121212; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:bold; font-size:17px; color:#121212; text-rendering: optimizeLegibility; line-height: 30px; margin-bottom: 30px}
.guide-text li span {font-weight: 400;}

.guide-info-grid-container	{display: flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-start; gap: 40px; margin:40px auto; width: 100%; height:auto;}
.guide-info-grid-item	{flex: 1 1 240px; padding: 40px; background:#F5F5F7; overflow:hidden; transition: all .3s cubic-bezier(0,0,.5,1); cursor:pointer; -webkit-border-radius:20px; -moz-border-radius:20px; border-radius: 20px; position: relative;}
.guide-info-grid-item-inner	{ display: flex; align-items: center; justify-content: space-between;}
.guide-info-grid-item:hover	{transform: scale(1.02);}
.guide-info-grid-item:hover .blue-hover-frame	{border: 2px solid #1E76E3; opacity: 1}
.guide-info-grid-item:hover .blue-main-button	{animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;}

.guide-color-grid-container	{display: grid;  grid-gap: 30px; grid-row-gap: 40px; grid-template-columns: repeat(3, 1fr); margin:40px auto; width: 100%; height:auto;}
.guide-color-grid-inner	{cursor:pointer; position: relative; height: auto;}
.guide-color-grid-inner	.guide-block-title {font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:600; font-size:; color:#121212; padding:0; margin:15px 0 0 0;
}
.guide-color-grid-inner:hover .guide-color-grid-item	{opacity: 0.8}
.guide-color-grid-item	{background:#F5F5F7; overflow:hidden; transition: all .3s cubic-bezier(0,0,.5,1); cursor:pointer; -webkit-border-radius:20px; -moz-border-radius:20px; border-radius: 20px; position: relative; height: auto;}
.guide-color-grid-inner a {text-decoration: none; color: #12121212;}
.guide-color-grid-inner a:hover {color: #12121212!important; transition: all .1s cubic-bezier(0,0,.5,1);}
.guide-color-grid-inner a:visited {color: #12121212;}


.guide-faq-item	{overflow:hidden; transition: all .3s cubic-bezier(0,0,.5,1); border-bottom: 1px solid #e5e5e5;}
.guide-faq-item:last-child	{border-bottom: none;}

.guide-faq-item-inner	{padding: 25px 0; display: flex; align-items: center; justify-content: space-between; cursor:pointer; transition: all .2s cubic-bezier(0,0,.5,1);}
.guide-faq-item-inner:hover {opacity: 0.5;}
.guide-faq-content	{padding:0 0 40px 0;}

.benefits-wrapper	{height: auto; display: flex; flex-wrap: wrap; gap:40px; margin-top: 30px; -webkit-border-radius:20px; -moz-border-radius:20px; border-radius: 20px; padding: 50px; background:#F5F5F7;}

.guide-products-wrapper	{height: auto; display: flex; flex-wrap: wrap; gap:40px; margin-top: 30px;}

.button-guide-license-wrapper	{position: absolute; bottom: 0; left: 0; right: 0; padding: 40px}
ul.guide-license-choose {height: auto; padding-left: 20px; margin:0; margin-bottom: 82px;}
ul.guide-license-choose li {height: auto; text-align: left; color: #121212; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:400; font-size:15px; text-rendering: optimizeLegibility; margin: 20px 0 0 0;}

ol.guide-license-choose {height: auto; padding-left: 20px; margin:0; margin-bottom: 82px;}
ol.guide-license-choose li {height: auto; text-align: left; color: #121212; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:400; font-size:15px; text-rendering: optimizeLegibility; margin: 20px 0 0 0;}

.md-hero-screen	{will-change: transform; z-index: 2; right: 0; margin-top: 170px; transform-origin: center 200px; max-width: 1100px; height: 673px; position: relative; left: 50%; margin-left: -550px;}
.md-hero-sticky-wrapper	{position: sticky; min-height: 100vh; overflow: hidden; top: 0; width: 100%; background-color: #ffffff; will-change: transform;}
.md-sticky-section-wrapper	{max-width: 100%; height: 275vh; min-height: 3800px; overflow: initial; margin-top:0; margin-left: auto; margin-right: auto; display: block; width: 100%}
.md-hero-text-wrapper	{position: relative; left: 0; right: 0; bottom:0; box-sizing: border-box; width: 87%; max-width: 820px; margin: 0 auto; padding: 0 0 165px; text-align: center; color: #121212; will-change: opacity, transform;}

.last-slide-spacer	{width: 30px; transform: translateX(calc(max(1024px, 100vw)/2 - 630px));}

.main-image-rounded-block	{width: 86%; max-width: 1200px; height: auto; margin: 100px auto; border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px;  -webkit-box-shadow: 2px 4px 12px rgba(0,0,0,0.5); -moz-box-shadow: 2px 4px 12px rgba(0,0,0,0.5); box-shadow: 2px 4px 12px rgba(0,0,0,0.5); overflow: hidden;}

.slider-with-nav-dark {width: 86%; max-width:640px; background: #2F2F2F; margin: 50px auto; padding: 0; height: auto; -webkit-border-radius: 26px; -moz-border-radius: 26px; border-radius: 26px;}
.slider-with-nav-dark ul {width: 100%; height: auto; list-style: none; padding: 0; margin: 0; display: flex; flex-direction: row;}
.slider-with-nav-dark ul li {height: 52px; line-height: 52px; -webkit-border-radius: 26px; -moz-border-radius: 26px; border-radius: 26px; color: #ffffff; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:15px; text-rendering: optimizeLegibility; overflow: hidden; flex: 1 1 auto;}
.slider-with-nav-dark ul li a {width:100%; height:100%; display: block; color: #ffffff; text-decoration: none; transition: all .3s ease-in-out; overflow: hidden;}
.slider-with-nav-dark ul li a:hover {color:#1E76E3!important; transition: all .1s ease-in-out;}
.slider-with-nav-dark ul li a:visited {color:#ffffff;}
.slider-with-nav-dark ul li a.active {color:#ffffff!important; background:#1E76E3; transition: all .3s ease-in-out;}

.slider-with-nav-dark-circle {width: 86%; max-width:94px;  margin: 50px auto; padding: 0; height: auto; -webkit-border-radius: 26px; -moz-border-radius: 26px; border-radius: 26px;}
.slider-with-nav-dark-circle ul {width: 100%; height: auto; list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 10px;}
.slider-with-nav-dark-circle ul li {width: 16px; height: 16px; background: #2F2F2F; line-height: 16px; -webkit-border-radius: 26px; -moz-border-radius: 26px; border-radius: 26px; color: #ffffff; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:15px; text-rendering: optimizeLegibility; overflow: hidden; flex: 1 1 auto;}
.slider-with-nav-dark-circle ul li a {width:100%; height:100%; display: block; color: #ffffff; text-decoration: none; transition: all .3s ease-in-out; overflow: hidden;}
.slider-with-nav-dark-circle ul li a:hover {color:#1E76E3!important; transition: all .1s ease-in-out;}
.slider-with-nav-dark-circle ul li a:visited {color:#ffffff;}
.slider-with-nav-dark-circle ul li a.active {color:#ffffff!important; background:#1E76E3; transition: all .3s ease-in-out;}

.slider-with-nav-light {width: 86%; max-width:640px; background: #efefef; margin: 50px auto; padding: 0; height: auto; -webkit-border-radius: 26px; -moz-border-radius: 26px; border-radius: 26px;}
.slider-with-nav-light ul {width: 100%; height: auto; list-style: none; padding: 0; margin: 0; display: flex; flex-direction: row;}
.slider-with-nav-light ul li {height: 52px; line-height: 52px; -webkit-border-radius: 26px; -moz-border-radius: 26px; border-radius: 26px; color: #121212; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:15px; text-rendering: optimizeLegibility; overflow: hidden; text-align: center; flex: 1 1 auto;}
.slider-with-nav-light ul li a {width:100%; height:100%; display: block; color: #121212; text-decoration: none; transition: all .3s ease-in-out; overflow: hidden;}
.slider-with-nav-light ul li a:hover {color:#1E76E3!important; transition: all .1s ease-in-out;}
.slider-with-nav-light ul li a:visited {color:#121212;}
.slider-with-nav-light ul li a.active {color:#ffffff!important; background:#1E76E3; transition: all .3s ease-in-out;}

.slider-with-nav-purple {width: 86%; max-width:640px; background: #2F2F2F; margin: 50px auto; padding: 0; height: auto; -webkit-border-radius: 26px; -moz-border-radius: 26px; border-radius: 26px;}
.slider-with-nav-purple ul {width: 100%; height: auto; list-style: none; padding: 0; margin: 0; display: flex; flex-direction: row;}
.slider-with-nav-purple ul li {height: 52px; line-height: 52px; -webkit-border-radius: 26px; -moz-border-radius: 26px; border-radius: 26px; color: #ffffff; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:15px; text-rendering: optimizeLegibility; overflow: hidden; flex: 1 1 auto;}
.slider-with-nav-purple ul li a {width:100%; height:100%; display: block; color: #ffffff; text-decoration: none; transition: all .3s ease-in-out; overflow: hidden;}
.slider-with-nav-purple ul li a:hover {color:#9444B8!important; transition: all .1s ease-in-out;}
.slider-with-nav-purple ul li a:visited {color:#ffffff;}
.slider-with-nav-purple ul li a.active {color:#ffffff!important; background:#9444B8; transition: all .3s ease-in-out;}

.slider-box-wrapper {width: 86%; max-width: 1200px; height: auto; margin: 0 auto; padding: 0; overflow: hidden; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; -webkit-box-shadow: 2px 4px 12px rgba(0,0,0,0.2); -moz-box-shadow: 2px 4px 12px rgba(0,0,0,0.2); box-shadow: 2px 4px 12px rgba(0,0,0,0.2);}
.slider-box-wrapper ul {width: 100%; height:auto; list-style: none; margin: 0; padding: 0;}
.slider-box-wrapper ul li {width: 100%;}

.image-wrap-shadow {-webkit-box-shadow: 2px 4px 12px rgba(0,0,0,0.2); -moz-box-shadow: 2px 4px 12px rgba(0,0,0,0.2); box-shadow: 2px 4px 12px rgba(0,0,0,0.2);}

.padding-right-left-spacer	{padding: 30px 0 50px 0}

.technology-grid-container	{display: grid; grid-template-columns: auto auto auto; grid-gap: 40px; margin:100px auto; width: 86%; max-width: 1200px; height:auto; grid-auto-flow: row dense;}
.technology-grid-item	{background:#1D1C1F; overflow:hidden; -webkit-border-radius:20px; -moz-border-radius:20px; border-radius: 20px; display: flex; flex-direction: column;}

.technology-grid-container-light	{display: grid; grid-template-columns: auto auto auto; grid-gap: 40px; margin:100px auto; width: 86%; max-width: 1200px; height:auto; grid-auto-flow: row dense;}
.technology-grid-item-light	{background:#EFEFEF; overflow:hidden; -webkit-border-radius:20px; -moz-border-radius:20px; border-radius: 20px; display: flex; flex-direction: column;}


.page-buy-options-container	{display: grid; grid-template-columns: auto auto auto auto; grid-gap: 30px; width: 90%; max-width: 1700px; height:auto; grid-auto-flow: row dense; margin:100px auto 0 auto;}
.page-buy-capterra-container	{display: grid; grid-template-columns: auto auto; grid-gap: 30px; width: 90%; max-width: 1700px; height:auto; grid-auto-flow: row dense; margin:100px auto 0 auto;}


.page-buy-options-content-wrapper	{-webkit-box-shadow: 2px 4px 12px rgba(204,204,204,0.8);
-moz-box-shadow: 2px 4px 12px rgba(204,204,204,0.8);
box-shadow: 2px 4px 12px rgba(204,204,204,0.8); border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; background:#ffffff; overflow:hidden; height:auto; transition: all .3s cubic-bezier(0,0,.5,1); display: flex; flex-direction: column; padding: 45px;}

.page-buy-options-content-wrapper:hover	{-webkit-box-shadow: 2px 4px 16px rgba(0,0,0,0.16);
-moz-box-shadow: 2px 4px 16px rgba(0,0,0,0.16);
box-shadow: 2px 4px 16px rgba(0,0,0,0.16); transform: scale(1.03);}

.page-buy-options-content-wrapper:hover .blue-hover-frame	{border: 2px solid #1E76E3; opacity: 1; cursor: pointer; }

.slider-product-wrapper	{display: flex; justify-content: space-between; padding: 0; gap:10px;}
.font-awesome-star	{color:#D00000; margin: 0; font-size: 17px;}
.slider-image-strip-wrapper-noRound	{width:100%; height: auto; overflow: hidden;}

.slider-new-action-wrapper	{display: flex; justify-content: space-between; margin-bottom: 40px; width: calc(100% - 90px); padding: 0 45px 0 45px; gap:20px;}
.slider-buy-action-wrapper	{display: flex; justify-content: space-between; margin-bottom: 40px; width: calc(100% - 90px); padding: 0 45px 0 45px; gap:20px; align-items: center;}


.key-feature-grid-set-container	{display: grid; grid-template-columns: auto auto auto; grid-template-rows: auto auto; grid-gap: 40px; margin:70px auto 0 auto; width: 87%; max-width: 1200px; height:auto; grid-auto-flow: row dense;}
.key-feature-grid-set-item	{border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; background:#1D1C1F; overflow:hidden; display: flex; flex-direction: column;}
.key-feature-grid-set-item4 {grid-column: auto / span 2;}
.key-feature-grid-set-item5 {grid-column: auto / span 1;}
.key-feature-grid-set-item6 {grid-column: auto / span 1;}
.key-feature-grid-set-item7 {grid-column: auto / span 2;}

.key-feature-header-wrapper	{display: flex; flex-direction:row; align-items: center}
.key-feature-header-wrapper img {margin-right: 20px}

.title-scolltop-wrapper	{display: flex; flex-direction:row; gap:50px; width: 86%; max-width: 1400px; margin: 0 auto; align-items: center; justify-content: space-between}
.title-scroll-top-button	{width: 50px; height: 50px; line-height: 50px; text-align: center; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:700; font-size:23px; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; flex-shrink: 0; flex-grow: 0; cursor: pointer;}
.title-scroll-top-button i	{border: none; margin: 0; padding: 0; line-height: 50px}
.title-scroll-top-button:hover	{opacity:0.8;}
.title-scroll-top-button:hover i	{animation: bounce 1s both;
        animation-timing-function: cubic-bezier(0.280, 0.840, 0.420, 1);}

@keyframes bounce {
        0%   { transform: scale(1,1)      translateY(0); }
        10%  { transform: scale(1.1,.9)   translateY(0); }
        30%  { transform: scale(.9,1.1)   translateY(-20px); }
        50%  { transform: scale(1.05,.95) translateY(0); }
        57%  { transform: scale(1,1)      translateY(-3px); }
        64%  { transform: scale(1,1)      translateY(0); }
        100% { transform: scale(1,1)      translateY(0); }
    }

.image-strip-tool-icons	{display:flex; flex-direction: row; justify-content: flex-start; flex-wrap: wrap; padding: 0 45px 0 45px; gap:20px; height: auto;}
.image-strip-tool-icons .span-space	{width: 50px;}

.key-feature-grid-set-item-large1	{border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; background:#1D1C1F; overflow:hidden; display: flex; flex-direction: row;}
.key-feature-grid-set-item-large2	{border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; background:#1D1C1F; overflow:hidden; display: flex; flex-direction: row;}

.key-feature-right-image-wrapper1	{min-width: 48%; border-radius: 0 20px 20px 0; -webkit-border-radius:0 20px 20px 0; -moz-border-radius:0 20px 20px 0; overflow: hidden; background: url("../images/products/md8/macdraft-light-scales.jpg") no-repeat top left; background-size: cover;}
.key-feature-right-image-wrapper2	{min-width: 48%; border-radius: 0 20px 20px 0; -webkit-border-radius:0 20px 20px 0; -moz-border-radius:0 20px 20px 0; overflow: hidden; background: url("../images/products/md8/macdraft-light-library.jpg") no-repeat top left; background-size: cover;}

.key-feature-wide-replace1 img	{display: none}
.key-feature-wide-replace2 img	{display: none}

.features-info-grid-container	{display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 49px; margin:100px auto 0 auto; width: 86%; max-width: 1400px; height:auto; grid-auto-flow: row dense;}
.features-info-grid-item	{background:#efefef; overflow:hidden; -webkit-border-radius:20px; -moz-border-radius:20px; border-radius: 20px; display: flex; flex-direction: column;}

.features-spacer	{width: 86%; max-width: 1400px; height: 1px; box-sizing: border-box; border-bottom: 1px dashed #bcbcbc; margin: 70px auto;}

.features-slider-image-strip-wrapper	{width:100%; height: auto; border-radius: 0 0 20px 20px; -webkit-border-radius:0 0 20px 20px; -moz-border-radius:0 0 20px 20px; overflow: hidden;}
.features-slider-image-strip	{width:100%; height: auto; overflow: hidden;}
.features-slider-image-strip img	{overflow:hidden; -webkit-border-radius:0 0 20px 20px; -moz-border-radius:0 0 20px 20px; border-radius: 0 0 20px 20px;}

.features-long-grid-item-wrapper	{width:calc(86% - 120px); max-width:1280px; height: auto; padding:60px; background:#efefef; overflow:hidden; -webkit-border-radius:20px; -moz-border-radius:20px; border-radius: 20px; margin: 0 auto; display: flex; flex-wrap:wrap; gap:60px;}
.features-long-grid-item	{flex: 1 1 250px; display: flex; flex-direction: column;}

.features-lower-grid-item-wrapper	{width:86%; max-width: 1400px; display: grid; grid-template-columns: auto auto auto; grid-gap: 50px; grid-auto-flow: row dense; margin: 0 auto;}
.features-lower-grid-item	{grid-column: auto / span 1; display: flex; flex-direction: column;}

.versions-long-grid-container	{width:calc(86% - 90px); max-width:1110px; height: auto; padding:45px; background:#efefef; overflow:hidden; -webkit-border-radius:20px; -moz-border-radius:20px; border-radius: 20px; margin: 0 auto;}
.versions-long-grid-item-wrapper	{display: grid; grid-template-columns: repeat(auto-fill, minmax(200px , 1fr)); grid-gap:60px;}
.versions-long-grid-item	{grid-column: auto / span 1;}

.body-hide-for-panel	{width: 100%; height: 100vh; position: fixed; top: 0; left: 0; z-index: 998000; cursor: pointer; background-color: rgba(22, 22, 22, 0.8); overflow:auto; padding: 63px 40px; box-sizing: border-box; backdrop-filter: saturate(180%) blur(20px); -webkit-backdrop-filter: saturate(180%) blur(20px);}

.body-hide-for-panel2	{width: 100%; height: 100vh; position: fixed; top: 0; left: 0; z-index: 998000; cursor: pointer; background-color: rgba(22, 22, 22, 0.8); overflow:auto; padding: 63px 40px; box-sizing: border-box; backdrop-filter: saturate(180%) blur(20px); -webkit-backdrop-filter: saturate(180%) blur(20px);}

.body-hide-for-panel-light	{width: 100%; height: 100vh; position: fixed; top: 0; left: 0; z-index: 998000; cursor: pointer; background-color: rgba(255, 255, 255, 0.75); overflow:auto; padding: 63px 40px; box-sizing: border-box; backdrop-filter: saturate(180%) blur(20px); -webkit-backdrop-filter: saturate(180%) blur(20px);}

.lock-scroll-position	{max-width: 100%; max-height: 100%; overflow: hidden;}

.see-info-panel	{width: 100%; max-width: 1000px; -webkit-box-shadow: 2px 4px 12px rgba(0,0,0,0.3); -moz-box-shadow: 2px 4px 12px rgba(0,0,0,0.3); box-shadow: 2px 4px 12px rgba(0,0,0,0.3); border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; background:#ffffff; cursor: default!important; overflow: hidden; position: relative;  margin: 0 auto; box-sizing: border-box;}

.see-search-panel	{width: 100%; max-width: 1000px; -webkit-box-shadow: 2px 4px 12px rgba(0,0,0,0.3); -moz-box-shadow: 2px 4px 12px rgba(0,0,0,0.3); box-shadow: 2px 4px 12px rgba(0,0,0,0.3); border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; background:#ffffff; cursor: default!important; overflow: hidden; position: relative;  margin: 0 auto; box-sizing: border-box;}

.see-info-panel2	{width: 100%; max-width: 550px; -webkit-box-shadow: 2px 4px 12px rgba(0,0,0,0.3); -moz-box-shadow: 2px 4px 12px rgba(0,0,0,0.3); box-shadow: 2px 4px 12px rgba(0,0,0,0.3); border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; background:#ffffff; cursor: default!important; overflow: hidden; position: relative;  margin: 0 auto; box-sizing: border-box;}

.see-info-inner-container	{display: flex; flex-direction: column;}
.see-info-close	{font-size: 30px; color:#121212; position: absolute; top:30px; left:30px; width: 30px; height: 30px;}
.see-info-close i {cursor: pointer; transition: color 130ms ease-in-out;}

.see-info-close i:hover {color:#1E76E3;}
.see-info-menu-select	{position: absolute; top:30px; right:30px; width: 160px;}

.see-info-content-grow	{padding: 100px 80px; flex-grow:1;}

ul.see-info-list {height: auto; margin:0; padding-left: 20px;}
ul.see-info-list li {height: auto; text-align: left; color: #333333; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:400; font-size:17px; text-rendering: optimizeLegibility; line-height: 1.62}

.whatsnew-image-center-block	{width: 86%; max-width: 1200px; height: auto; margin: 100px auto; border-radius:14px; -webkit-border-radius:14px; -moz-border-radius:14px; overflow: hidden;}

.version-select-control { display:block; padding:0; margin: 0; width: 100%; overflow: hidden; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif;  font-weight:400; color: #1E76E3; font-size: 15px; position:relative; cursor:pointer; height:40px; background:#ffffff; line-height:40px;}
.version-select-control select {font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; padding: 0; width: 130%; height:40px; border: none; box-shadow: none; background-color: transparent; background-image: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial", sans-serif;  font-weight:400; color: #1E76E3; font-size: 15px; cursor:pointer; max-width: 100%; float:left; /*Altered two below to make word wrap work */ word-wrap: normal !important; white-space: normal; border-radius:0; -webkit-border-radius:0; -moz-border-radius:0;}
.version-select-control i {padding:0; position:absolute;  top:48%; right:0;  transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); background: #ffffff; pointer-events: none; font-size:17px; border: none}
.version-select-control span {padding:0; position:absolute;  top:0; left:0; font-weight: 600!important; background: none; pointer-events: none; background: #ffffff; font-size:17px}
.version-select-control select:focus {outline: none !important; border: none!important; -webkit-box-shadow:0!important; -moz-boz-shadow:0!important; box-shadow:0!important;}
.version-select-control i:focus {outline: none !important; border: none!important;}
.version-select-control:hover {opacity: 0.8; transition: opacity 130ms ease-in-out;}

.trial-long-grid-wrapper	{width:86%; max-width:700px; height: auto; padding:60px; background:#efefef; overflow:hidden; -webkit-border-radius:20px; -moz-border-radius:20px; border-radius: 20px; margin: 0 auto; box-sizing: border-box;}

.trial-why-wrapper	{display:flex; flex-direction: column; align-items: center; margin-top:10px}

.contactRequest .blue-main-button {width: 100%; max-width:100%; background-color:#1E76E3; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:16px; color:#ffffff; text-align:center; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius:10px;
	-webkit-font-smoothing: antialiased; height:50px; line-height:50px; border:none; padding:0; margin:20px auto; -webkit-appearance: none; cursor:pointer; text-rendering: optimizeLegibility;}

.contactRequest .blue-main-button:hover, .contactRequest .blue-main-button:focus {opacity:0.8;}

.contactRequest .pink-main-button {width: 100%; max-width:100%; background-color:#D12B78; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:16px; color:#ffffff; text-align:center; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius:10px; -webkit-font-smoothing: antialiased; height:50px; line-height:50px; border:none; padding:0; margin:20px auto; -webkit-appearance: none; cursor:pointer; text-rendering: optimizeLegibility;}
.contactRequest .pink-main-button:hover, .contactRequest .pink-main-button:focus {opacity:0.8;}


.why-try-container	{width:86%; max-width:800px; margin:0 auto; display:grid; grid-template-columns: auto auto auto auto; grid-auto-flow: row dense; grid-gap: 30px}

.feature-panel-image-wrapper	{-webkit-border-radius:10px; -moz-border-radius:10px; border-radius: 10px; margin: 0 auto 50px auto; overflow: hidden; width: 100%;}


.pack-buy-options-container	{display: grid; grid-template-columns: auto auto auto; grid-gap: 50px; width: 86%; max-width: 1210px; height:auto; grid-auto-flow: row dense; margin:100px auto 0 auto;}

.pack-buy-options-content-wrapper	{-webkit-box-shadow: 2px 4px 12px rgba(204,204,204,0.8);
-moz-box-shadow: 2px 4px 12px rgba(204,204,204,0.8);
box-shadow: 2px 4px 12px rgba(204,204,204,0.8); border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; background:#ffffff; overflow:hidden; height:auto; transition: all .3s cubic-bezier(0,0,.5,1); display: flex; flex-direction: column;}

.stop-user-selection	{-webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}

/*Product Filter */
.filter-container	{width:100%; height: 60px; box-sizing: border-box; padding: 0 20px; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; position: relative; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:20px; color:#121212; text-rendering: optimizeLegibility; line-height: 60px; cursor: pointer; display: grid; grid-template-columns: repeat(4, 1fr); -webkit-box-shadow: 0px 0px 0px 1px rgba(204,204,204,1);
-moz-box-shadow: 0px 0px 0px 1px rgba(204,204,204,1);
box-shadow: 0px 0px 0px 1px rgba(204,204,204,1);}
.filter-container:hover	{-webkit-box-shadow: 0px 0px 0px 2px rgba(30,118,227,1);
-moz-box-shadow: 0px 0px 0px 2px rgba(30,118,227,1);
box-shadow: 0px 0px 0px 2px rgba(30,118,227,1); color: #1E76E3;}

ul.all-products-list-wrapper	{width: 90%; max-width: 1600px; margin: 70px auto 0 auto; display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 30px; grid-row-gap: 60px; padding: 0; list-style: none;}
ul.all-products-list-wrapper li.all-products-list-content	{width: 100%; display: flex; flex-direction: column; cursor: pointer; -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;}

ul.all-products-list-wrapper-wide	{width: 90%; max-width: 1600px; margin: 70px auto 0 auto; display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 30px; grid-row-gap: 60px; padding: 0; list-style: none;}
ul.all-products-list-wrapper-wide li.all-products-list-content	{width: 100%; display: flex; flex-direction: column; cursor: pointer; -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;}

.all-products-list-box	{width: 100%; background:#ececec; -webkit-border-radius:25px; -moz-border-radius:25px; border-radius:25px; margin-bottom: 30px; position: relative; overflow: hidden; border:2px solid #ffffff;}

.new-prod-badge	{width: 70px; height: 36px; line-height: 36px; -webkit-border-radius:6px; -moz-border-radius:6px; border-radius:6px; background: #F7000E; text-align: center; color: #ffffff; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:bold; font-size:18px; z-index: 2}

.rec-prod-badge	{width: 170px; height: 36px; line-height: 36px; -webkit-border-radius:18px; -moz-border-radius:18px; border-radius:18px; background: #D51F78; text-align: center; color: #ffffff; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:bold; font-size:13px; z-index: 2; text-transform: uppercase;}

.os-prod-badge	{padding: 0 15px; box-sizing: border-box; height: 36px; line-height: 36px; background: rgba(255, 255, 255, 0.85); text-align: center; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:bold; font-size:15px; color: #121212; z-index: 2}

.os-top-prod-badge	{padding: 0 15px; box-sizing: border-box; height: 34px; line-height: 34px; background: #D51F78; text-align: center; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:14px; color: #ffffff; z-index: 2;  -webkit-border-radius:6px; -moz-border-radius:6px; border-radius:6px;}

.all-products-list-box .new-prod-badge	{position: absolute; top: 34px; right: 34px}
.all-products-list-box .rec-prod-badge	{position: absolute; top: 34px; right: 34px}
.all-products-list-box .os-prod-badge	{position: absolute; bottom: 34px; left: 34px}
.technology-grid-item .os-top-prod-badge	{position: absolute; top: 23px; right: 23px}
.pre-features-flexslide-content-wrapper .os-top-prod-badge {position: absolute; top: 23px; right: 23px}

.all-products-list-button-wrapper {height: auto; position: absolute; left: 34px; right: 34px; bottom: 34px; opacity: 0; z-index: 3}

.prod-box-shot {opacity: 1; z-index: 1; -webkit-border-radius:25px; -moz-border-radius:25px; border-radius:25px; overflow: hidden}
.prod-example-shot {opacity: 0; position: absolute; top:0; left:0; z-index: 1; -webkit-border-radius:25px; -moz-border-radius:25px; border-radius:25px; overflow: hidden;}

.all-products-list-content:hover .all-products-list-button-wrapper {opacity: 1; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.all-products-list-content:hover .os-prod-badge {display: none}
.all-products-list-content:hover .all-products-list-box {border-color: #1E76E3;  -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}

.see-filter-panel	{width: 100%; max-width: 500px; height: 100%; max-height: 100%; -webkit-box-shadow: 2px 4px 12px rgba(0,0,0,0.3); -moz-box-shadow: 2px 4px 12px rgba(0,0,0,0.3); box-shadow: 2px 4px 12px rgba(0,0,0,0.3); border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; background:#ffffff; cursor: default!important; overflow: hidden; position: relative;  margin: 0 auto; box-sizing: border-box; min-height: 400px; display: flex; flex-direction: column; padding: 60px 0 111px 0;}

.see-filter-inner-container	{height: auto; overflow-y: scroll; overflow-x: hidden; padding: 0 40px; flex-grow: 1;}

.filter-buttons	{position: absolute; left: 0; right: 0; bottom:0; width: 100%; box-sizing: border-box; background: #ffffff; border-top: 1px solid #e7e7e7; display: grid; grid-template-columns: repeat(2, 1fr); grid-gap:20px; padding: 30px 40px; border-radius:0 0 20px 20px; -webkit-border-radius:0 0 20px 20px; -moz-border-radius:0 0 20px 20px; }

.filter-content	{padding-bottom:30px}

.filter-content-item	{padding:25px; box-sizing: border-box; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:20px; color:#000000; border-top: 1px solid #e7e7e7;}
.filter-content-item .filter-header	{text-align: left;}
.filter-content-item .filter-chevron	{display: block; text-align: right; -moz-transition: all .2s linear;
    -webkit-transition: all .2s linear;
    transition: all .2s linear;}

.rotate	{-ms-transform: rotateX(180deg);
    -moz-transform: rotateX(180deg);
    -webkit-transform: rotateX(180deg);
    transform: rotateX(180deg);}

.filter-select-header	{display: flex; flex-direction: row; align-items: center; justify-content: space-between; cursor: pointer;}



/* Customize the label (the container) */
.filter-checkbox-label {
  display: block;
  position: relative;
  padding: 0 0 0 50px;
  margin:0;
  cursor: pointer;
  font-size: 16px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
	text-align: left;
	width: 100%;
	box-sizing: border-box;
	line-height: 30px;
	font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; 
	font-weight:500;
	color:#000000;
}

/* Hide the browser's default checkbox */
.filter-checkbox-label input[type='checkbox'] {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.filter-checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 30px;
  width: 30px;
  border: 2px solid #c4c4c4;
	border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px;
}

/* On mouse-over, add a grey background color */
.filter-checkbox-label:hover input[type='checkbox'] ~ .filter-checkmark {
  border-color: #606060;
}

/* When the checkbox is checked, add a blue background */
.filter-checkbox-label input[type='checkbox']:checked ~ .filter-checkmark {
  border-color: #606060;
}

/* Create the checkmark/indicator (hidden when not checked) */
.filter-checkmark:after {
  content: "";
  position: absolute;
  display: none;
	width: 22px;
	height: 22px;
	background-color: #1E76E3;
	top: 50%;
	left: 50%;
	-webkit-transform:translate(-50%, -50%); -moz-transform:translate(-50%, -50%); transform:translate(-50%, -50%);
	border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px;
}

/* Show the checkmark when checked */
.filter-checkbox-label input[type='checkbox']:checked ~ .filter-checkmark:after {
  display: block;
}

/* Customize the label (the container) */
.filter-radio-label {
  display: block;
  position: relative;
  padding: 0 0 0 50px;
  margin:0;
  cursor: pointer;
  font-size: 16px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
	text-align: left;
	width: 100%;
	box-sizing: border-box;
	line-height: 30px;
	font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; 
	font-weight:500;
	color:#000000;
}

/* Hide the browser's default checkbox */
.filter-radio-label input[type='radio'] {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.filter-radio-checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 30px;
  width: 30px;
  border: 2px solid #c4c4c4;
	border-radius:16px; -webkit-border-radius:16px; -moz-border-radius:16px;
}

/* On mouse-over, add a grey background color */
.filter-radio-label:hover input[type='radio'] ~ .filter-checkmark {
  border-color: #606060;
}

/* When the checkbox is checked, add a blue background */
.filter-radio-label input[type='radio']:checked ~ .filter-radio-checkmark {
  border-color: #606060;
}

/* Create the checkmark/indicator (hidden when not checked) */
.filter-radio-checkmark:after {
  content: "";
  position: absolute;
  display: none;
	width: 22px;
	height: 22px;
	background-color: #1E76E3;
	top: 50%;
	left: 50%;
	-webkit-transform:translate(-50%, -50%); -moz-transform:translate(-50%, -50%); transform:translate(-50%, -50%);
	border-radius:11px; -webkit-border-radius:11px; -moz-border-radius:11px;
}

/* Show the checkmark when checked */
.filter-radio-label input[type='radio']:checked ~ .filter-radio-checkmark:after {
  display: block;
}

.filter-sort-buttons	{width:90%; max-width: 1600px; margin: 0 auto; display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 30px;}

.sort-menu-wrapper	{position: absolute; z-index: 10; top:70px; left: 0; right: 0; width: 100%; height: auto; background-color: #ffffff;  padding: 30px; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; border:1px solid #cccccc; box-sizing: border-box; display: none;}

#totalFilterCount	{background: #dedede; padding: 7px 12px; -webkit-border-radius:3px; -moz-border-radius:3px; border-radius: 3px; font-size: 17px; color:#000000!important; margin-right: 20px; display: none;}
.filter-count-icon	{text-align: right; display: flex; flex-direction: row; justify-content: flex-end; align-items: center; line-height: normal}


ul#surveyContainer2022	{list-style:none; padding:0; margin:0; width:100%; overflow:hidden; height:auto; position:relative}
ul#surveyContainer2022 li	{width:100%; height:auto; text-align:center; color:#333333; padding:0; margin:0;}
#mainControlsContainer2022	{width:100%; height:85px; position:fixed; bottom:0; left:0; background:#1E417E; z-index:50000}
#surveyProgressContainer2022	{height:85px; margin:0 300px;}
#surveyProgress2022	{width:90%; max-width:700px; height:50px; background:#162D53; border-radius:8px; -webkit-border-radius:8px; -moz-border-radius:8px; margin:17px auto 0 auto; text-align:center; font-family: 'Lato', sans-serif; font-weight:400; font-size:25px; color:#ffffff; line-height:50px; padding:0; outline: 1px solid transparent;}
.surveyProgressBar2022	{width:0%; height:50px; background:#86C342; float:left; border-radius:8px; -webkit-border-radius:8px; -moz-border-radius:8px; margin:0; padding:0; transition: all 0.1s linear; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear;}
.surveyProgressBarText2022	{position:absolute; top:0; left:0; width:100%; line-height:50px}
#survey-slider-prev2022	a {width:260px; height:55px; text-align:center; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:400; font-size:24px; background:#D12B78; position:absolute; left:15px; bottom:15px; text-decoration:none; color:#ffffff; line-height:55px; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px;}
#survey-slider-prev2022 .disabled	{display:none}
#survey-slider-next2022 a	{width:260px; height:55px; text-align:center; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:400; font-size:24px; background:#D12B78; position:absolute; right:15px; bottom:15px; text-decoration:none; color:#ffffff; line-height:55px; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px;}
#survey-slider-next2022 .disabled	{display:none}

.answers-slider2022 {width:260px; height:55px; text-align:center; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:400; font-size:24px; background:#D12B78; position:absolute; right:15px; bottom:15px; text-decoration:none; color:#ffffff; line-height:55px; -webkit-appearance: none;; -moz-appearance:none; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px;}

.survey-image-icon	{width: 200px; height: auto; margin: 120px auto 20px auto;}

.surveyTextBox2022	{width: 30%; height:55px; padding:0; margin:0; background:#ffffff; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:400; font-size:18px; color:#121212; text-indent:15px; box-sizing: border-box; border: none;}

.surveyTextBox2022:focus	{outline:none; box-sizing: border-box;}

.surveyTextBox2022::-webkit-input-placeholder { color:#969696 }
.surveyTextBox2022::-moz-placeholder { color:#969696 }
.surveyTextBox2022:-ms-input-placeholder { color:#969696 }
.surveyTextBox2022:-moz-placeholder { color:#969696 }

.nameTextBox2022	{float:left; margin:0}
.emailTextBox2022	{margin: 0 auto}
.companyTextBox2022	{float:right; margin:0}

.select-style-survey2022 {
    padding: 0;
    margin: 0;
    border: none;
    width: 100%;
	height:55px;
    border-radius:9px; -webkit-border-radius:9px; -moz-border-radius:9px;
    overflow: hidden;
    background-color: #ffffff;
	font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:400; font-size:18px; color:#121212; box-sizing: border-box; cursor:pointer;
	text-indent:15px;
	position: relative;
	}

.select-style-survey2022 .down-awesome {position: absolute; height:55px; right: 15px; top: 0; color: #121212; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:400; font-size:18px; line-height: 55px; pointer-events: none;}

.select-style-survey2022 select {
    padding: 5px 8px;
    width: 100%;
	height:100%;
    border: none;
    box-shadow: none;
    background-color: transparent;
    background-image: none;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
	font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:400; font-size:18px; color:#121212; cursor:pointer;
}


.select-style-survey2022 select:focus {
    outline: none; border:none;
}

.surveyselectleft2022	{width:30%; height:auto; float:left}
.surveyselectright2022	{width:30%; height:auto; float:right}
.surveyselectcenter2022	{width:30%; height:auto; margin:0 auto}

.otherTextBox2022	{width: 100%; height:55px; padding:0; margin:15px 0 0 0; background:#ffffff; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:400; font-size:18px; color:#121212; text-indent:15px; box-sizing: border-box; border:none;}
.otherTextBox2022:focus	{outline:none; box-sizing: border-box; border:none}

.otherTextBox2022::-webkit-input-placeholder { color:#969696 }
.otherTextBox2022::-moz-placeholder { color:#969696 }
.otherTextBox2022:-ms-input-placeholder { color:#969696 }
.otherTextBox2022:-moz-placeholder { color:#969696 }


.surveyRadio2022	{width:100%; height:auto; margin:0 auto 0 auto; padding:0; overflow:auto}
.surveyRadioProd2022	{width:40%; height:auto; margin:0 auto 0 auto; padding:0; overflow:auto}
.surveyRadio2022 input[type=radio]	{display:none;}

.surveyRadioProd2022 input[type=radio] + label	{width:calc(100% / 2); height:auto; line-height:35px; border:none; display:block; text-align:center; border-radius:0; -moz-border-radius:0; -webkit-border-radius:0; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif;  font-weight:500;  font-size:20px; color:#ffffff; cursor:pointer; -webkit-font-smoothing: antialiased; background:none; padding:0; float:left; margin:10px 0}
.surveyRadioProd2022 input[type=radio]:checked + label {color:#ffffff}
.surveyRadioProd2022 input[type=radio] + label .outer {display:block; width:60px; height:60px; background:#4388FF; margin:0 auto; border-radius:30px; -moz-border-radius:30px; -webkit-border-radius:30px; padding:0; overflow:auto}
.surveyRadioProd2022 input[type=radio] + label .inner {display:block; width:52px; height:52px; background:#162D53; margin:4px auto; border-radius:26px; -moz-border-radius:26px; -webkit-border-radius:26px; padding:0; overflow:auto}
.surveyRadioProd2022 input[type=radio] + label .innerCircle {display:block; width:34px; height:34px; background:#162D53; margin:9px auto; border-radius:17px; -moz-border-radius:17px; -webkit-border-radius:17px; padding:0}
.surveyRadioProd2022 input[type=radio]:checked + label .outer {background:#C4DAFE;}
.surveyRadioProd2022 input[type=radio]:checked + label .inner {background:#162D53;}
.surveyRadioProd2022 input[type=radio]:checked + label .innerCircle {background:#D12B78;}

.surveyRadioProd2022 input[type=radio]:hover + label .outer {background:#C4DAFE;}

.surveyRadioRanking2022	{width:90%; height:auto; margin:40px auto 0 auto; padding:0; overflow:auto}

.surveyRadioRanking2022 input[type=radio] + label	{width:calc(100% / 5); height:auto; line-height:35px; border:none; display:block; text-align:center; border-radius:0; -moz-border-radius:0; -webkit-border-radius:0; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif;  font-weight:600;  font-size:28px; color:#ffffff; cursor:pointer; -webkit-font-smoothing: antialiased; background:none; padding:0; float:left; margin:10px 0}

.surveyRadioRanking2022 input[type=radio]:checked + label {color:#ffffff}
.surveyRadioRanking2022 input[type=radio] + label .outer {display:block; width:74px; height:74px; background:#4388FF; margin:0 auto; border-radius:37px; -moz-border-radius:37px; -webkit-border-radius:37px; padding:0; overflow:auto}
.surveyRadioRanking2022 input[type=radio] + label .inner {display:block; width:66px; height:66px; background:#162D53; margin:4px auto; border-radius:33px; -moz-border-radius:33px; -webkit-border-radius:33px; padding:0; overflow:auto}
.surveyRadioRanking2022 input[type=radio] + label .innerCircle {display:block; width:48px; height:48px; background:#162D53; margin:9px auto; border-radius:24px; -moz-border-radius:24px; -webkit-border-radius:24px; padding:0;}
.surveyRadioRanking2022 input[type=radio]:checked + label .outer {background:#C4DAFE;}
.surveyRadioRanking2022 input[type=radio]:checked + label .inner {background:#162D53;}
.surveyRadioRanking2022 input[type=radio]:checked + label .innerCircle {background:#D12B78;}

.surveyRadioRanking2022 input[type=radio]:hover + label .outer {background:#C4DAFE;}

.surveyRadioRanking2022 input[type=radio] + label .choice1:before { content:"1"; font-size:28px; line-height:48px; text-align:center;  color: #77B4DC; font-weight:600}
.surveyRadioRanking2022 input[type=radio] + label .choice2:before { content:"2"; font-size:28px; line-height:48px; text-align:center;  color: #77B4DC; font-weight:600}
.surveyRadioRanking2022 input[type=radio] + label .choice3:before { content:"3"; font-size:28px; line-height:48px; text-align:center;  color: #77B4DC; font-weight:600}
.surveyRadioRanking2022 input[type=radio] + label .choice4:before { content:"4"; font-size:28px; line-height:48px; text-align:center;  color: #77B4DC; font-weight:600}
.surveyRadioRanking2022 input[type=radio] + label .choice5:before { content:"5"; font-size:28px; line-height:48px; text-align:center;  color: #77B4DC; font-weight:600}

.surveyRadioRanking2022 input[type=radio]:checked + label .choice1:before { color: #ffffff;}
.surveyRadioRanking2022 input[type=radio]:checked + label .choice2:before { color: #ffffff;}
.surveyRadioRanking2022 input[type=radio]:checked + label .choice3:before { color: #ffffff;}
.surveyRadioRanking2022 input[type=radio]:checked + label .choice4:before { color: #ffffff;}
.surveyRadioRanking2022 input[type=radio]:checked + label .choice5:before { color: #ffffff;}

#arrowSurveyLeft2022			{float: left;  border: solid #6795E2;
  border-width: 0 3px 3px 0;
  display: inline-block;
  padding: 12px;transform: rotate(135deg);
  -webkit-transform: rotate(135deg); margin-top: -12px; margin-left: 2px;}
#arrowSurveyRight2022			{float: right;  border: solid #6795E2;
  border-width: 0 3px 3px 0;
  display: inline-block;
  padding: 12px;transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg); margin-top: -12px; margin-right: 2px}

.surveyTextAreaContainer2022	{width:90%; height:auto; margin:0 auto 0 auto}

.surveyTextArea2022	{width: 100%; height:150px; padding:20px; margin:0; background:#ffffff; border-radius:9px; -webkit-border-radius:9px; -moz-border-radius:9px; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:400; font-size:17px; color:#121212; text-indent:15px; box-sizing: border-box; border:none; resize:none}

.surveyTextArea2022:focus	{outline:none; box-sizing: border-box;}

.surveyTextArea2022::-webkit-input-placeholder { color:#969696 }
.surveyTextArea2022::-moz-placeholder { color:#969696 }
.surveyTextArea2022:-ms-input-placeholder { color:#969696 }
.surveyTextArea2022:-moz-placeholder { color:#969696 }

.surveyRateFeaturesContainer2022	{width:100%; height:auto; margin:0 auto 10px auto; overflow:auto; box-sizing:border-box; display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 30px; grid-row-gap: 10px}

.surveyRateFeaturesleft2022	{width: 100%; height:auto; padding:15px; margin:0; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:400; font-size:18px; color:#ffffff;  box-sizing: border-box; border:4px solid #4388FF; overflow:auto; display: flex; justify-content: space-between; align-items: center; box-sizing: border-box; gap: 10px;}

.surveyRateFeaturesright2022	{width: 100%; height:auto; padding:15px; margin:0; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:400; font-size:18px; color:#ffffff;  box-sizing: border-box; border:4px solid #4388FF; overflow:auto; display: flex; justify-content: space-between; align-items: center; box-sizing: border-box; gap: 10px;}

.featureStarRatingContainer2022	{height:auto; margin:0; overflow:auto; flex-shrink: 0}

.featureStarRating2022 {
    overflow: hidden;
    display: inline-block;
    font-size: 0;
    position: relative;
}
.featureStarRating-input2022 {
    float: right;
    padding: 0;
    margin: 0;
    opacity: 0;
	border:none;
}
.featureStarRating2022:hover .featureStarRating-star2022:hover {
    background: url("../images/products/md8/star-pink-on.png");
	background-size: 36px 34px;
}

.featureStarRating2022:hover .featureStarRating-star2022:hover ~ .featureStarRating-star2022 {
    background: url("../images/products/md8/star-pink-on.png");
	background-size: 36px 34px;
}

.featureStarRating-input2022:checked ~ .featureStarRating-star2022 {
    background: url("../images/products/md8/star-pink-on.png");
	background-size: 36px 34px;
}

.featureStarRating2022:active .featureStarRating-star2022:active {
    background: url("../images/products/md8/star-pink-focus.png");
	background-size: 36px 34px;
}

.featureStarRating2022:active .featureStarRating-star2022:active ~ .featureStarRating-star2022 {
    background: url("../images/products/md8/star-pink-focus.png");
	background-size: 36px 34px;
}

.featureStarRating-star2022 {
    position: relative;
    float: right;
    display: block;
    width: 36px;
    height: 34px;
    background: url("../images/products/md8/star-blue-off.png");
	background-size: 36px 34px;
	border:none;
	margin:0;
	cursor:pointer;
}

.featureStarRating2022:hover .featureStarRating-star2022 {
    position: relative;
    float: right;
    display: block;
    width: 36px;
    height: 34px;
    background: url("../images/products/md8/star-blue-off.png");
	background-size: 36px 34px;
	border:none;
	margin:0;
	cursor:pointer;
}


.featureTitleSub2022	{height:auto; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:18px; color:#ffffff; text-align:left; margin: 0; line-height:25px;  -webkit-font-smoothing: antialiased;}


.surveyCheck2022	{width:100%; height:auto; margin:0 auto 0 auto; padding:0; overflow:auto; display: flex; flex-direction: row; flex-wrap: wrap; gap:30px; justify-content: space-between;}

.surveyCheckWrapper2022	{display: flex; justify-content: center; flex: 1 1 150px}

.surveyCheck2022 input[type=checkbox]	{display:none;}

.surveyCheck2022 input[type=checkbox] + label	{height:auto; line-height:35px; border:none; display:block; text-align:center; border-radius:0; -moz-border-radius:0; -webkit-border-radius:0; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif;  font-weight:500;  font-size:18px; color:#ffffff; cursor:pointer; -webkit-font-smoothing: antialiased; background:none; padding:0; margin:0}

.surveyCheck2022 input[type=checkbox]:checked + label {color:#ffffff}

.surveyCheck2022 input[type=checkbox] + label .outer {display:block; width:60px; height:60px; background:#4388ff; margin:0 auto; border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px; padding:0; overflow:auto}
.surveyCheck2022 input[type=checkbox] + label .inner {display:block; width:52px; height:52px; background:#162D53; margin:4px auto; border-radius:8px; -moz-border-radius:8px; -webkit-border-radius:8px; padding:0; overflow: auto;}
.surveyCheck2022 input[type=checkbox] + label .innerRect {display:block; width:34px; height:34px; background:#162D53; margin:9px auto; border-radius:6px; -moz-border-radius:6px; -webkit-border-radius:6px; padding:0}

.surveyCheck2022 input[type=checkbox]:checked + label .outer {background:#c4dafe;}
.surveyCheck2022 input[type=checkbox]:checked + label .inner {background: #162D53;}
.surveyCheck2022 input[type=checkbox]:checked + label .innerRect {background: #D12B78;}

.surveyCheck2022 input[type=checkbox]:hover + label .outer {background:#c4dafe;}

.starRatingContainer2022	{width:100%; height:auto; margin:50px auto 60px auto; overflow:auto}

.starRating2022 {
    overflow: hidden;
    display: inline-block;
    font-size: 0;
    position: relative;
}
.starRating2022-input {
    float: right;
    padding: 0;
    margin: 0;
    opacity: 0;
	border:none;
}
.starRating2022:hover .starRating2022-star:hover {
    background: url(../images/products/md8/star-pink-on-large.png);
	background-size: 134px 128px;
}

.starRating2022:hover .starRating2022-star:hover ~ .starRating2022-star{
    background: url(../images/products/md8/star-pink-on-large.png);
	background-size: 134px 128px;
}

.starRating2022-input:checked ~ .starRating2022-star {
    background: url(../images/products/md8/star-pink-on-large.png);
	background-size: 134px 128px;
}

.starRating2022:active .starRating2022-star:active {
    background: url(../images/products/md8/star-pink-focus-large.png);
	background-size: 134px 128px;
}

.starRating2022:active .starRating2022-star:active ~ .starRating2022-star {
    background: url(../images/products/md8/star-pink-focus-large.png);
	background-size: 134px 128px;
}

.starRating2022-star {
    position: relative;
    float: right;
    display: block;
    width: 134px;
    height: 128px;
    background: url(../images/products/md8/star-blue-off-large.png);
	background-size: 134px 128px;
	border:none;
	margin:0 10px;
	cursor:pointer;
}

.starRating2022:hover .starRating2022-star {
    position: relative;
    float: right;
    display: block;
    width: 134px;
    height: 128px;
    background: url(../images/products/md8/star-blue-off-large.png);
	background-size: 134px 128px;
	border:none;
	margin:0 10px;
	cursor:pointer;
}


.trial-download-card {border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; overflow: hidden; width: 90%; height: auto; margin: 70px auto 0 auto; display: flex; flex-direction: row; justify-content: space-between; max-width: 1200px; background: #EFEFEF;}
.trial-download-card-info {padding: 60px; width: 100%; box-sizing: border-box;}
.trial-download-card-info .contactRequest {max-width:400px}
.trial-download-card-image {width: 50%; max-width:600px; flex: 0 0 auto; overflow: hidden; padding-top: 60px; box-sizing: border-box;}

.round-panel-resp-title-trial	{width: 100%; height:auto; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:600; font-size:32px; color:#121212; padding:0; margin: 0 auto 0 auto; max-width: 400px;}
.trial-card-sr	{width:100%; height:auto; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:13px; color:#121212; line-height:15px; padding:0; margin:5PX auto 0 auto; text-rendering: optimizeLegibility;}

.main-image-ad-block	{width: 90%; max-width: 1200px; height: auto; margin: 60px auto 40px auto; overflow: hidden;}
.main-image-ad-block img {width: 100%; height: auto}

.trial-download-card-small {border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; overflow: hidden; width: 90%; max-width: 950px; height: auto; margin: 50px auto 0 auto; display: flex; flex-direction: row; justify-content: space-between; background: #EFEFEF; padding: 40px 50px; box-sizing: border-box; gap: 40px; align-items: center;}
.trial-download-card-small .pink-main-button	{max-width: 250px; align-content: flex-end}
.round-panel-resp-title-trial-small	{width: 100%; height:auto; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:600; font-size:30px; color:#121212; padding:0; margin: 0 auto 0 auto; align-content: flex-start;}

.pro-only-badge	{font-size: 13px; border: 2px solid #ffffff; vertical-align: middle; display: inline-block; padding: 5px; box-sizing: border-box; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; margin-left: 10px}
.pro-only-badge-dark	{font-size: 13px; border: 2px solid #121212; vertical-align: middle; display: inline-block; padding: 5px; box-sizing: border-box; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; margin-left: 10px}

.reasons-buy-card-light-wrapper	{width: 90%; height: auto; -webkit-border-radius:20px; -moz-border-radius:20px; border-radius:20px; padding: 40px; box-sizing: border-box; max-width: 1000px; margin: 40px auto 0 auto; background:#f5f5f7;}
.reasons-buy-card-light-container {display: flex; flex-wrap: wrap; flex-direction: row; gap:30px;}
.reasons-buy-card-light-item	{width: 33.3333%; height: auto; flex: 1 1 60px; display: flex; flex-direction:row; gap:15px; align-items: center;}

.reasons-buy-card-buy-wrapper	{width: 90%; height: auto; max-width: 1000px; margin: 70px auto 0 auto;}
.reasons-buy-card-buy-container {display: flex; flex-wrap: wrap; flex-direction: row; gap:30px;}
.reasons-buy-card-buy-item	{width: 33.3333%; height: auto; flex: 1 1 200px; display: flex; flex-direction:row; gap:15px; align-items: center;}
.reasons-buy-card-buy-info	{height: auto; flex: 1 1 200px; display: flex; flex-direction:column; gap:15px;}

.step-info-grid-container	{display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 40px; margin:70px auto; width: 86%; max-width: 950px; height:auto; grid-auto-flow: row dense;}

.col-21	{display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 40px; margin:70px auto 0 auto; width: 100%; max-width: 1000px; height:auto; grid-auto-flow: row dense; overflow: hidden;}

.col-21-short	{display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 40px; margin:40px auto 0 auto; width: 100%; max-width: 1200px; height:auto; grid-auto-flow: row dense;}

.education-summary-grid	{display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 20px; grid-auto-flow: row}
.education-summary-grid	.box-shape { padding:30px; box-sizing: border-box; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; background: #f5f5f7;}
.education-summary-grid	.box-shape img { margin-bottom: 10px;}


.education-buy-card {border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; overflow: hidden; width: 90%; max-width: 950px; height: auto; margin: 50px auto 0 auto; background: #EFEFEF; padding: 40px 50px; box-sizing: border-box;}

.all-versionUSD	{height: 0; opacity:0; transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; overflow: hidden;}
.all-versionUSD.showVers	{height: auto; opacity: 1; transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out;}

.all-versionGBP	{height: 0; opacity:0; transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; overflow: hidden;}
.all-versionGBP.showVers	{height: auto; opacity: 1; transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out;}

.all-versionEUR	{height: 0; opacity:0; transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; overflow: hidden;}
.all-versionEUR.showVers	{height: auto; opacity: 1; transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out;}

.breadcrumb-nav	{font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:15px; color:#121212; padding:0; margin:40px auto 60px auto; text-rendering: optimizeLegibility; width: 90%; max-width: 1200px;}
.breadcrumb-nav .inner-bcn {text-align: center; padding: 0 5px; line-height: 19px; display: inline-block;}
.breadcrumb-nav .inner-bcn a {text-decoration:none!important; width:100%; height: 100%; color:#121212!important; padding:0; line-height: 22px}
.breadcrumb-nav .inner-bcn a:hover {opacity: 0.8}
.breadcrumb-nav .inner-bcn a:visited	{color:#121212!important; text-decoration:none!important;}

.breadcrumb2-nav	{font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:13px; color:#ffffff; padding-bottom:20px; margin:0 auto 30px auto; text-rendering: optimizeLegibility; width: 90%; max-width: 1400px; text-align: left; border-bottom: 1px solid #4d4d4d; display: flex; flex-direction: row; align-items: center;}
.breadcrumb2-nav .inner-bcn {text-align: left; padding: 0 10px;}
.breadcrumb2-nav .inner-bcn a {display: block; text-decoration:none!important; width:100%; height: 100%; color:#ffffff!important; padding:0;}
.breadcrumb2-nav .inner-bcn a:hover {opacity: 0.8}
.breadcrumb2-nav .inner-bcn a:visited	{color:#ffffff!important; text-decoration:none!important;}
.breadcrumb2-nav img {display: block}

.doc-select-w {width: 90%; max-width: 1000px; margin: 70px auto 0 auto; display: grid; grid-template-columns: auto; grid-gap: 30px;}
.doc-select-w a {display: block; color: #121212}
.doc-select-w a:visited {color: #121212}
.doc-select-w a:hover .doc-select {-webkit-box-shadow: 0px 0px 0px 2px #1E76E3; -moz-box-shadow: 0px 0px 0px 2px #1E76E3; box-shadow: 0px 0px 0px 2px #1E76E3;}

.doc-select {width: 100%; -webkit-border-radius:20px; -moz-border-radius:20px; -o-border-radius:20px; -webkit-box-shadow: 0px 0px 0px 1px #cccccc; -moz-box-shadow: 0px 0px 0px 1px #cccccc; box-shadow: 0px 0px 0px 1px #cccccc; 
display: flex; justify-content: space-between; gap:30px; align-items: center; padding: 30px 40px; box-sizing: border-box;}
.doc-select i {margin: 0; padding: 0; border: none; font-size: 19px}
.doc-select-img {width: 60px; max-width: 60px; min-width: 60px; height: auto;}
.doc-select-desc {display: block}

.polh-w {width: 87%; max-width: 1000px; margin: 50px auto 0 auto;}
.polh-inner {margin: 0; padding: 0; border-bottom: 1px solid #cccccc}
.polh-1 {border-top: 1px solid #cccccc}
.polh-click {padding: 30px 0; display: flex; justify-content: space-between; align-items: center; cursor: pointer; gap:10px}
.polh-click:hover {opacity: 0.5}
.polh-chevron {transition: transform 0.5s}
.polh-chevron.open {-webkit-transform: rotateX(180deg); -moz-transform: rotateX(180deg); -o-transform: rotateX(180deg); transform: rotateX(180deg);}
.polh-content {padding-bottom: 40px; display: none}

.pol-title {width: 87%; max-width: 1200px; height:auto; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:600; font-size:30px; color:#000000; padding:0; margin:0;}
.pol-title-small {width: 87%; max-width: 1200px; height:auto; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:600; font-size:22px; color:#000000; padding:0; margin:0;}
.pol-title-mini {width: 87%; max-width: 1200px; height:auto; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:600; font-size:17px; color:#000000; padding:0; margin:0; line-height: 25px;}
.pol-body	{width:87%; max-width:1200px; height:auto; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:400; font-size:18px; color:#121212; line-height:27px; padding:0; margin:30px auto 0 auto; text-rendering: optimizeLegibility;}

.polmi-w {width: 87%; max-width: 1000px; background: #efefef; -webkit-border-radius:20px; -moz-border-radius:20px; -o-border-radius:20px; border-radius:20px; padding: 40px; box-sizing: border-box; margin: 60px auto 0 auto;}
.pol-sub-title {width: 87%; max-width: 1200px; height:auto; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:400; font-size:23px; color:#606060; padding:0; margin:0; line-height: 25px}

.pol-glyph {font-size: 70px}

ul.pol-list {height: auto; padding-left: 20px; margin:30px auto 0 auto; margin-bottom: 82px; line-height: 25px; box-sizing: border-box}
ul.pol-list li {height: auto; text-align: left; color: #121212; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:400; font-size:18px; text-rendering: optimizeLegibility; margin: 20px 0 0 0; padding-left: 15px; box-sizing: border-box;}

ol.pol-list {height: auto; padding-left: 20px; margin:30px auto 0 auto; margin-bottom: 82px; line-height: 25px; box-sizing: border-box}
ol.pol-list li {height: auto; text-align: left; color: #121212; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:400; font-size:18px; text-rendering: optimizeLegibility; margin: 20px 0 0 0; padding-left: 15px; box-sizing: border-box;}

.faq-cat-w	{width: 100%; height: auto; display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 20px; margin-top:50px; }

.faq-cat-item	{padding: 20px 25px; -webkit-box-shadow: 0px 0px 0px 1px rgba(165,165,165,1); -moz-box-shadow: 0px 0px 0px 1px rgba(165,165,165,1); box-shadow: 0px 0px 0px 1px rgba(165,165,165,1); box-sizing: border-box; -webkit-border-radius:15px; -moz-border-radius:15px; -o-border-radius:15px; border-radius:15px; cursor: pointer; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; display: flex; align-items: center;}

.cat-img	{width: 42px; margin-right: 15px;}

.faq-cat-item:hover	{-webkit-box-shadow: 0px 0px 0px 2px rgba(30,118,227,1); -moz-box-shadow: 0px 0px 0px 2px rgba(30,118,227,1); box-shadow: 0px 0px 0px 2px rgba(30,118,227,1);}
.faq-cat-item.active-cat	{-webkit-box-shadow: 0px 0px 0px 2px rgba(30,118,227,1); -moz-box-shadow: 0px 0px 0px 2px rgba(30,118,227,1); box-shadow: 0px 0px 0px 2px rgba(30,118,227,1);}
.faq-cat-title	{height:auto; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:18px; color:#121212; line-height:25px; padding:0; margin:0; text-rendering: optimizeLegibility;}
.faq-q-title	{height:auto; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:600; font-size:22px; color:#121212; line-height:25px; padding:0; margin:0; text-rendering: optimizeLegibility;}

.hide-faq	{display: none;}

ul.buy-list {height: auto; padding:0; margin:0; box-sizing: border-box; list-style: none;}
ul.buy-list li {height: auto; text-align: left; color: #121212; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:400; font-size:15px; text-rendering: optimizeLegibility; margin: 15px 0 0 0; padding:0; box-sizing: border-box; line-height: 22px}

ul.all-products-buy-list-wrapper	{width: 90%; max-width: 1510px; margin: 70px auto 0 auto; display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 50px; grid-row-gap: 70px; padding: 0; list-style: none;}
ul.all-products-buy-list-wrapper li.all-products-list-content	{width: 100%; display: flex; flex-direction: column; cursor: pointer; -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;}

ul.all-products-buy-list-wrapper2	{width: 90%; max-width: 1120px; margin: 70px auto 0 auto; display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 50px; grid-row-gap: 70px; padding: 0; list-style: none;}
ul.all-products-buy-list-wrapper2 li.all-products-list-content	{width: 100%; display: flex; flex-direction: column; cursor: pointer; -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;}

.full-buy-w	{width: 90%; height: auto; max-width: 1200px; margin: 0 auto 0 auto; display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 70px;}
.full-buy-pic	{background: #f5f5f5; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; overflow: hidden;}

/* Column layout */
.full-buy-title	{width:100%; max-width:960px; height:auto; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:700; font-size:40px; color:#121212; padding:0; margin:0; text-rendering: optimizeLegibility;}
.full-buy-r	{display: flex; flex-direction: column;}
.qty-buy	{margin-top: 20px; position: relative;}

.qty-amount {display: flex; flex-direction: row; align-items: center;}
.qty-amount form {margin-right: 20px}
.qty-amount .input-text.qty {width: 75px; height: 50px; padding: 0; text-align: center; background-color: transparent; border: 1px solid #cccccc; margin: 0; position: relative; -webkit-appearance: none; -webkit-border-radius: 0; border-radius: 0; }
.qty-amount.buttons_added {text-align: left; position: relative; white-space: nowrap; vertical-align: top; margin: 20px 0 0 0;}
.qty-amount.buttons_added input {display: inline-block; margin: 0; vertical-align: top; box-shadow: none; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:19px; -webkit-appearance: none;}
.qty-amount.buttons_added .qty-minus, .qty-amount.buttons_added .qty-plus { padding: 6px 20px 9px; height: 52px; background-color: #ffffff; border: 1px solid #cccccc; cursor:pointer; font-size: 21px!important; font-weight: 500!important;}
.qty-amount.buttons_added .qty-minus {border-right: 0; font-size:15px; font-weight: 500; -webkit-border-radius:10px 0 0 10px; -moz-border-radius:10px 0 0 10px; -o-border-radius:10px 0 0 10px; border-radius:10px 0 0 10px;}
.qty-amount.buttons_added .qty-plus {border-left: 0;  -webkit-border-radius:0 10px 10px 0; -moz-border-radius:0 10px 10px 0; -o-border-radius:0 10px 10px 0; border-radius:0 10px 10px 0;}
.qty-amount.buttons_added .qty-minus:hover, .qty-amount.buttons_added .qty-plus:hover {background:#f5f5f5;}
.qty-amount input::-webkit-outer-spin-button, .qty-amount input::-webkit-inner-spin-button {-webkit-appearance: none; -moz-appearance: none; margin: 0;}
.qty-amount.buttons_added .qty-minus:focus, .qty-amount.buttons_added .qty-plus:focus {outline: none; }

.val-w	{width: 100%; max-width: 450px; padding: 25px; box-sizing: border-box; background:#FFE5E5; display: none; -webkit-border-radius:10px; -moz-border-radius:10px; -o-border-radius:10px; border-radius:10px; margin: 20px 0 0 0;}
.ml-click:hover {opacity: 0.8;}
.subPriceBlock	{display: block;}
.qty-and-price	{display: flex; flex-direction:column;}
.star-percent	{display: flex; flex-direction: row; align-items: center;}






.lic-r	{display: grid; grid-template-columns: repeat(4, 1fr); grid-gap:20px; border-bottom: 1px solid #cccccc; padding: 10px 0}
.lic-r-left	{text-align: left; grid-column: auto / span 3;}
.lic-r-right	{text-align: right}

.pop-badge {background: #CF3078; font-size: 11px; font-weight: 600; text-transform: uppercase; color: #FFFFFF; display: inline-block; height: 20px; line-height: 20px; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; padding:0 10px; margin-left: 20px}

.disc-badge {background: #CF3078; font-size: 11px; font-weight: 600; text-transform: uppercase; color: #FFFFFF; display: inline-block; height: 24px; line-height: 24px; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; padding:0 10px; margin-left: 10px}

.opt-w	{width: 90%; max-width: 1200px; margin: 80px auto 100px auto; border-bottom: 1px solid #d9d9d9;}
.opt-inner	{width: 100%; max-width: 390px; margin: 0 auto; display: grid; grid-template-columns: repeat(3, 1fr);}
.opt-inner-item	{-webkit-box-shadow: 0px 1px 0px 0px rgba(217,217,217,1); -moz-box-shadow: 0px 1px 0px 0px rgba(217,217,217,1); box-shadow: 0px 1px 0px 0px rgba(217,217,217,1); font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:15px; text-align: center; height: auto;}
.opt-inner-item a {display: block; width: 100%; padding-bottom: 15px; color: #121212; margin: 0; text-decoration: none;}
.opt-inner-item a:hover {color: #1E76E3!important; text-decoration: none;}
.opt-inner-item a:visited {color: #121212; text-decoration: none;}
.opt-inner-item.active-item{-webkit-box-shadow: 0px 2px 0px 0px rgba(18,18,18,1); -moz-box-shadow: 0px 2px 0px 0px rgba(18,18,18,1); box-shadow: 0px 2px 0px 0px rgba(18,18,18,1);}

.opt-inner-item .img-w	{width: 40px; height: auto; margin: 0 auto 10px auto; padding: 0;}

.grid-ben	{display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 60px;}

.wi-grid	{display:grid; grid-template-columns: repeat(3, 1fr); grid-gap: 30px; margin-top: 40px}

.lander-panel-wrapper	{width:100%; height:auto; background:#171D27;}
.lander-panel-inner-wrapper	{width:100%; max-width:1570px; height:auto; margin:0 auto; 
background-image: url("../images/products/md8/cad-software-banner.jpg");
background-size:cover; background-repeat:  no-repeat; background-position: center; background-color: #171D27}
.lander-panel-content-wrapper	{width:100%; max-width:1200px; height:auto; margin:0 auto; overflow:auto; padding: 100px 40px; box-sizing: border-box;}

.lander-panel-inner-wrapper-architect	{width:100%; max-width:1570px; height:auto; margin:0 auto; 
background-image: url("../images/products/md8/cad-for-mac.jpg");
background-size:cover; background-repeat:  no-repeat; background-position: center; background-color: #171D27}

.lander-panel-inner-wrapper-landscape	{width:100%; max-width:1570px; height:auto; margin:0 auto; background-color: #171D27}

.lander-top-q	{display: grid; grid-template-columns: repeat(2, 1fr); align-items: stretch;}
.lander-card-w	{width: 100%; height: auto; -webkit-border-radius:20px; -moz-border-radius:20px; border-radius:20px; padding: 0; box-sizing: border-box; max-width: 1000px; margin: 40px auto 0 auto; background:#efefef;}
.lander-card-t	{padding: 50px;}
.right-right-card-inner	{width:100%; height: auto; overflow: hidden; padding: 50px 0 50px 0; box-sizing: border-box;}
.right-right-card-inner img {width: 100%; height: 100%; object-fit: cover; object-position: left top;}

.right-home-card-inner	{width:100%; height: auto; overflow: hidden; padding: 50px 0 50px 0; box-sizing: border-box; position: relative;}
.right-home-card-inner img {width: 100%; height: 100%; object-fit: cover; object-position: left top;}


.pgrid-w2	{width: 87%; max-width: 840px; height: auto; margin: 0 auto; display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 40px;}
.pgrid-w3	{width: 87%; max-width: 1200px; height: auto; margin: 0 auto; display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 40px;}
.pgrid-w4	{width: 87%; max-width: 1200px; height: auto; margin: 0 auto; display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 40px; grid-row-gap: 60px}
.pgrid-img	{width: 100%; height: auto; margin: 0; padding: 0; border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; overflow: hidden;}

.lander-card-w2	{width: 100%; height: auto; -webkit-border-radius:20px; -moz-border-radius:20px; border-radius:20px; padding: 0; box-sizing: border-box; max-width: 1000px; margin: 40px auto 0 auto; background:#efefef;}
.lander-card-t2	{padding: 50px;}
.right-right-card-inner2	{width:100%; height: auto; overflow: hidden; padding: 50px 0 50px 0; box-sizing: border-box;}
.right-right-card-inner2 img {width: 100%; height: 100%; object-fit: cover; object-position: right top;}
.lander-card-order1	{order: 1}
.lander-card-order2	{order: 2}

.faqgr-inner {margin: 0 0 15px 0; padding: 0; border-bottom: 1px solid #cccccc; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; overflow: hidden; background: #ffffff; border: 1px solid #cccccc;}
.faqgr-click {padding: 25px; display: flex; justify-content: space-between; align-items: center; cursor: pointer; gap:10px; box-sizing: border-box;}
.faqgr-click:hover {opacity: 0.5}
.faqgr-chevron {transition: transform 0.5s}
.faqgr-chevron.open {-webkit-transform: rotateX(180deg); -moz-transform: rotateX(180deg); -o-transform: rotateX(180deg); transform: rotateX(180deg);}
.faqgr-content {padding: 0 20px 20px 30px; display: none; box-sizing: border-box;}

.faqgr-d-inner {margin: 0 0 15px 0; padding: 0; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; overflow: hidden; background: #2C2931; border: 1px solid #4E4A57;}
.faqgr-d-click {padding: 25px; display: flex; justify-content: space-between; align-items: center; cursor: pointer; gap:10px; box-sizing: border-box;}
.faqgr-d-click:hover {opacity: 0.5}
.faqgr-d-chevron {transition: transform 0.5s}
.faqgr-d-chevron.open {-webkit-transform: rotateX(180deg); -moz-transform: rotateX(180deg); -o-transform: rotateX(180deg); transform: rotateX(180deg);}
.faqgr-d-content {padding: 0 30px 30px 30px; display: none; box-sizing: border-box;}

.mini-nav-os {width: 100%; max-width:100%; background: #f5f5f5; margin: 0 auto 90px auto; padding: 20px 0; height: auto;}
.mini-nav-os ul {width: 87%; max-width: 210px; height: auto; list-style: none; padding: 0; margin: 0 auto; display: flex; flex-direction: row; gap:10px;}
.mini-nav-os ul li {width: 100px; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; color: #121212; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:0.875rem; text-rendering: optimizeLegibility; text-align: center; box-sizing: border-box;}
.mini-nav-os ul li a {width:100%; height:auto; display: block; color: #121212; text-decoration: none; transition: all .3s ease-in-out;-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; padding: 15px 0;}
.mini-nav-os ul li a i {font-size: 40px; margin: 0 0 5px 0}
.mini-nav-os ul li a:hover {color:#1E76E3!important; transition: all .1s ease-in-out;}
.mini-nav-os ul li a:visited {color:#121212;}
.mini-nav-os ul li a.active {color:#121212!important; transition: all .3s ease-in-out; -webkit-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
-moz-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);}

.form-v {opacity: 0;
        position: absolute;
        top: 0;
        left: 0;
        height: 0;
        width: 0;
        z-index: -50;}

.frm-compact input:-webkit-autofill,
.frm-compact textarea:-webkit-autofill,
.frm-compact select:-webkit-autofill {
        -webkit-appearance:none; -webkit-box-shadow: inset 0 0 0 1000px #f7f7f7!important; box-shadow: inset 0 0 0 1000px #f7f7f7!important; outline:none;
		background: none!important;
}

.frm-compact {
	width: 100%;
	margin: 0 auto 0 auto;
	text-align: center;
	position: relative;
}
.frm-compact fieldset {
	border: 0 none;	
	box-sizing: border-box;
	width: 100%;	
	/*stacking fieldsets above each other - CHANGE to hide and show*/
}
/*Hide all except first fieldset*/
.frm-compact fieldset:not(:first-of-type) {
	display: none;
}
/*inputs*/
.frm-compact input, .frm-compact textarea {
	padding: 0 0 15px 0;
	border: 0 none;
	border-bottom: 1px solid #d9d9d9;
	border-radius: 0;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	margin-bottom: 20px;
	width: 100%;
	box-sizing: border-box;
	font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; 
	font-weight:500;
	color: #121212;
	font-size: 15px;
	background: none;
	-webkit-font-smoothing:antialiased;
	outline: none;
	-webkit-appearance: none;
}

.frm-compact input::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #9f9f9f;
  opacity: 1; /* Firefox */
}

/*buttons*/
.frm-compact .blue-main-button-thin {
	width: 100%; max-width: 200px; height:50px; text-align:center; color:#ffffff!important; border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px; outline:none; border:none; cursor:pointer; line-height:50px; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:600; font-size:1rem; box-sizing: border-box; background: #1E76E3; padding: 0; -webkit-appearance: none;
}
.frm-compact .blue-main-button-thin:hover, .frm-compact .blue-main-button-thin:focus {
	opacity:1.0!important;
}

.lander-right-card	{width:100%; height: auto; overflow: hidden; box-sizing: border-box;}
.lander-right-card img {width: 100%; height: 100%; object-fit: cover; object-position: right top;}

.lander-checklist-wrapper {display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 50px; grid-row-gap: 20px; margin:60px auto 0 auto; width: 100%; max-width: 800px; height:auto; grid-auto-flow: row dense;}
.lander-checklist {border-bottom: 1px solid #404040; padding:0 0 20px 0; display: flex; flex-direction: row; align-items: center; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:21px; color: #ffffff; text-align: left; margin: 0;}
.lander-checklist i {color:#D90778; border: none; margin: 0 15px 0 0; padding: 0;}

.lander-checklist-light {border-bottom: 1px solid #cccccc; padding:0 0 20px 0; display: flex; flex-direction: row; align-items: center; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:21px; color: #121212; text-align: left; margin: 0;}
.lander-checklist-light i {color:#D90778; border: none; margin: 0 15px 0 0; padding: 0;}

/*.lander-checklist-light:nth-last-child(-n + 2) {border: none;}*/


.lesson-objective-wrapper {display: grid; grid-template-columns: repeat(1, 1fr); grid-gap: 50px; grid-row-gap: 30px; margin:40px auto 0 auto; width: 100%; max-width: 800px; height:auto; grid-auto-flow: row dense;}
.lesson-objective {padding: 0; display: flex; flex-direction: row; align-items: center; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:21px; color: #121212; text-align: left; margin:0}
.lesson-objective:last-child {margin: 0;}
.lesson-objective i {color:#D90778; border: none; margin: 0 15px 0 0; padding: 0;}

.lander-steps-wrapper {width: 100%; max-width: 1200px; margin: 0 auto; height: auto; background: #efefef; -webkit-border-radius:25px; -moz-border-radius:25px; -o-border-radius:25px; border-radius:25px; -webkit-box-shadow: inset 0px 0px 0px 1px rgba(204,204,204,1); -moz-box-shadow: inset 0px 0px 0px 1px rgba(204,204,204,1); box-shadow: inset 0px 0px 0px 1px rgba(204,204,204,1); display: flex; flex-direction: row; overflow: hidden;}

.lander-steps-left	{width:100px; max-width: 100px; background: #D91278; padding: 45px 0; flex: 0 0 100px; box-sizing: border-box;}
.lander-steps-right	{padding: 45px; box-sizing: border-box;}
.l-step-h {display:none}
.lander-sd {width: 50px; height: 6px; background: #D91278; -webkit-border-radius:3px; -moz-border-radius:3px; -o-border-radius:3px; border-radius:3px; margin: 40px auto;}

.user-sliding-container {overflow: hidden; /*max-width: 1262px;*/ width: 100%; margin: 70px auto 0 auto; padding: 0; box-sizing: border-box;}
.user-sliding-background {
background-image: url("../images/products/picture-serve/lander/landscape-users-full@2x.jpg");
 background-image: image-set(
    "../images/products/picture-serve/lander/landscape-users-full@2x.webp" type("image/webp"),
    "../images/products/picture-serve/lander/landscape-users-full@2x.jpg" type("image/jpeg")
 );
	height: 80px; width: 5976px; background-repeat: repeat-x; background-size: 1992px 80px; background-position: center;animation: userSlide 60s linear infinite;
}

@keyframes userSlide{
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-1992px);
  }
}

.lesson-select-control { display:block; padding:0; margin: 0 0 0 20px; width: 350px; overflow: hidden; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif;  font-weight:bold; color: #121212; font-size: 13px; position:relative; cursor:pointer; height:30px; background:#ffffff; line-height:30px; border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px;-moz-border-radius:6px; -webkit-box-shadow: 0px 0px 0px 1px rgba(204,204,204,1);
-moz-box-shadow: 0px 0px 0px 1px rgba(204,204,204,1);
box-shadow: 0px 0px 0px 1px rgba(204,204,204,1);}
.lesson-select-control select {font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; padding: 0 20px 0 20px; width: 130%; height:30px; border: none; box-shadow: none; background-color: #ffffff; background-image: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial", sans-serif;  font-weight:500; color: #121212; font-size: 13px; cursor:pointer; max-width: 100%; float:left; /*Altered two below to make word wrap work */ word-wrap: normal !important; white-space: normal;}
.lesson-select-control i {padding:0; position:absolute;  top:50%; right:15px;  transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); background: none; pointer-events: none; font-size:13px; border: none}
.lesson-select-control select:focus {outline: none !important;}
.lesson-select-control:hover {color:#1E76E3; -webkit-box-shadow: 0px 0px 0px 2px rgba(30,118,227,1);
-moz-box-shadow: 0px 0px 0px 2px rgba(30,118,227,1);
box-shadow: 0px 0px 0px 2px rgba(30,118,227,1);}

.lesson-time-est-wrapper {width: 100%; max-width: 360px; height: auto; display: grid; grid-template-columns: repeat(2, 1fr); grid-column-gap: 40px; grid-row-gap: 30px;}
.lesson-time-est {height: auto; border: 2px solid #D12B78; -webkit-border-radius:10px; -moz-border-radius:10px; -o-border-radius:10px; border-radius:10px; padding: 10px 20px 15px 20px; box-sizing: border-box; margin: 30px 0 0 0;}

.lesson-sticky-wrapper {width: 100%; display: flex; flex-direction: row; position: relative; margin-top: 120px}
.lesson-left {width: 40%; margin-right: 4%; -webkit-box-flex: 0; -ms-flex-none; flex: none; margin-bottom: calc(60vh - 120px); margin-top: 100px; padding-bottom:120px}
.lesson-right {width: calc(50vw + 6%); background: #f5f5f5; -webkit-box-flex: 0; -ms-flex-none; flex: none; position: sticky; top: 70px; height: calc(100vh - 70px); display: grid;}

.lesson-asset-wrapper { width: 80%; align-self: center;}
.lesson-asset {height: 100%; display: flex; display: -webkit-box; display: -ms-flexbox; -webkit-box-align:center; -ms-flex-align:center;  align-items: center; box-sizing: border-box; padding: 70px 0 70px 70px; min-height: 320px; }

.lesson-step {height: auto; background:#FBFBFD; -webkit-border-radius:20px; -moz-border-radius:20px; -o-border-radius:20px; border-radius:20px; padding: 30px 35px; box-sizing: border-box; margin-top: 120px; position: relative;}
.lesson-step:first-child {margin-top: 0;}
.lesson-step::before {content:""; position: absolute; top: 0; left: 0; width:10px; height: 100%; opacity: 0; -webkit-transition: opacity .15s ease-in; transition: opacity .15s ease-in; background: #D12B78; border-top-left-radius: 20px; border-bottom-left-radius: 20px; -webkit-border-top-left-radius: 20px; -webkit-border-bottom-left-radius: 20px; -o-border-top-left-radius: 20px; -o-border-bottom-left-radius: 20px;}

.focusedStep.lesson-step::before {opacity: 1;}

.lesson-asset img {max-height: calc(100vh - 210px); width: auto; max-width: 600px; margin: 0}

.lesson-asset-small {width: 100%; -webkit-border-radius:20px; -moz-border-radius:20px; -o-border-radius:20px; border-radius:20px; padding: 40px; background: #f5f5f5; box-sizing: border-box; margin-top: 30px; display: none;}

.quiz-image {width: 100%; max-width: 266px; margin: 0 auto 30px auto;}
.quiz-progress-wrapper {width:100%; height: auto; position: absolute; left: 0; right: 0; bottom:0; box-sizing: border-box; background: #ffffff; border-top: 1px solid #e7e7e7;padding: 30px 40px; border-radius:0 0 20px 20px ; -webkit-border-radius:0 0 20px 20px; -moz-border-radius:0 0 20px 20px; gap:30px}

#quizPrevious .disabled {display:none}
#quizNext .disabled {display:none}

#quizPrevious a {width:120px; height:50px; text-align:center; color:#ffffff!important; background:#1E76E3; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; outline:none; border:none; cursor:pointer; line-height:50px; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:16px; position:absolute; left:40px; bottom:30px; text-decoration:none;transition: all 0.1s linear; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear;}

#quizNext a {width:120px; height:50px; text-align:center; color:#ffffff!important; background:#1E76E3; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; outline:none; border:none; cursor:pointer; line-height:50px; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:16px; position:absolute; right:40px; bottom:30px; text-decoration:none; transition: all 0.1s ease; -webkit-transition: all 0.1s ease; -moz-transition: all 0.1s ease;}

#quizFinish {width:120px; height:50px; text-align:center; color:#ffffff!important; background:#1E76E3; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; outline:none; border:none; cursor:pointer; line-height:50px; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:16px; position:absolute; right:40px; bottom:30px; text-decoration:none; transition: all 0.1s ease; -webkit-transition: all 0.1s ease; -moz-transition: all 0.1s ease;}

#quizPrevious a:hover {opacity: 0.8}
#quizNext a:hover {opacity: 0.8}
#quizFinish:hover {opacity: 0.8}

#quizProgressContainer2022	{height:50px; margin:0 150px; display: grid; align-items: center;}
#quizProgress2022	{width:100%; max-width:700px; height:20px; background:#efefef; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; margin:0 auto 0 auto; text-align:center; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:13px; color:#121212; line-height:20px; padding:0; outline: 1px solid transparent; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear;}
.quizProgressBar2022	{width:calc((100% / 9)); height:20px; background:#D12B78; float:left; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; margin:0; padding:0; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear;}
.quizProgressBarText2022	{position:absolute; top:0; left:0; width:100%; line-height:20px; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:13px;}

.quiz-scroll-content {overflow-y: scroll; height: calc(100% - 111px); padding-bottom: 40px; box-sizing: border-box; border-radius:20px 20px 0 0; -webkit-border-radius:20px 20px 0 0; -moz-border-radius:20px 20px 0 0;}
.quiz-sticky-qt {position: sticky; top: 0; padding: 80px 50px 20px 50px; box-sizing: border-box; background:#ffffff; border-radius:20px 20px 0 0; -webkit-border-radius:20px 20px 0 0; -moz-border-radius:20px 20px 0 0; z-index: 500;}
.quiz-answers {margin: 0; padding: 0 50px; box-sizing: border-box; display: grid; grid-template-columns: repeat(1, 1fr); grid-gap: 30px; grid-row-gap: 9px}

.quizShowAnswersContainer {margin: 30px auto 0 auto; width: 100%; max-width: 800px; height: auto;}
.quizShowAnswersItem {width:100%; height: auto; padding: 30px 0; box-sizing: border-box; border-top: 1px dashed #cccccc; display: flex; flex-direction:row; justify-content: space-between; align-items: center;}
.displayQuiz {display: none;}

.survey-progress-wrapper {width:100%; height: 115px; position: fixed; left: 0; right: 0; bottom:0; box-sizing: border-box; border-top: 1px solid #e7e7e7;padding: 30px 40px; background:rgba(255, 255, 255, 0.75); backdrop-filter: saturate(180%) blur(20px); -webkit-backdrop-filter: saturate(180%) blur(20px);}

#survey2023Previous a {width:120px; height:50px; text-align:center; color:#ffffff!important; background:#1E76E3; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; outline:none; border:none; cursor:pointer; line-height:50px; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:16px; text-decoration:none;transition: all 0.1s linear; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear;position:absolute; left:40px; bottom:30px; -webkit-user-select: none; /* Safari */ -ms-user-select: none; /* IE 10 and IE 11 */ user-select: none; /* Standard syntax */}

#survey2023Next a {width:120px; height:50px; text-align:center; color:#ffffff!important; background:#1E76E3; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; outline:none; border:none; cursor:pointer; line-height:50px; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:16px; text-decoration:none; transition: all 0.1s ease; -webkit-transition: all 0.1s ease; -moz-transition: all 0.1s ease; position:absolute; right:40px; bottom:30px;-webkit-user-select: none; /* Safari */ -ms-user-select: none; /* IE 10 and IE 11 */ user-select: none; /* Standard syntax */}

.answers-slider2023 {width:120px; height:50px; text-align:center; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:16px; background:#D12B78; text-decoration:none; color:#ffffff; line-height:50px; -webkit-appearance: none;; -moz-appearance:none; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; position:absolute; right:40px; bottom:30px;transition: all 0.1s linear; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear;-webkit-user-select: none; /* Safari */ -ms-user-select: none; /* IE 10 and IE 11 */ user-select: none; /* Standard syntax */}

#survey2023Previous .disabled	{display:none;}
#survey2023Next .disabled	{display:none;}

#survey2023Previous a:hover {opacity: 0.8}
#survey2023Next a:hover {opacity: 0.8}
.answers-slider2023:hover {opacity: 0.8}

ul#surveyContainer2023	{list-style:none; padding:0; margin:0; width:100%; overflow:hidden; height:auto; position:relative;}
ul#surveyContainer2023 li	{width:100%; height:auto; text-align:center; color:#333333; padding:80px 0 0 0; margin:0;}

.newTextBoxInput	{width: 100%; height:56px; padding:15px 25px 0 25px; margin:0; background:#ffffff; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:400; font-size:17px!important; line-height: 20px; color:#494949; text-indent:25px; box-sizing: border-box; border: 1px solid #cccccc;}

.with-image-icon {position: relative;}
.with-image-icon img {position: absolute; left: 18px; width: 20px; height: auto; top: 18px;z-index: 3; pointer-events: none; white-space: nowrap; overflow: hidden;}

.input-placeholder {font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:400; font-size:17px!important; color: #86868b; position: absolute; top: 18px; height: 20px; line-height: 20px; left: 50px; z-index: 3; pointer-events: none; white-space: nowrap; overflow: hidden; max-width: calc(100% - 50px); -webkit-transition: all 0.125s ease; transition: all 0.125s ease;}

.survey-details2023 {width:100%; max-width: 400px; height:auto; margin:50px auto 0 auto; padding:0; display:grid; grid-gap: 20px; grid-template-columns: repeat(1, 1fr);}

.survey-2col {width:100%; max-width: 1000px; height:auto; margin:50px auto 0 auto; padding:0; display:grid; grid-gap: 20px; grid-template-columns: repeat(2, 1fr);}

.answer-with-img {display: flex; flex-direction: row; justify-content: space-between; align-items: center;}

.answer-with-img img {width: 30px; height: auto; margin-right: 15px;}

input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill {
        -webkit-appearance:none; -webkit-box-shadow: inset 0 0 0 1000px #ffffff!important; box-shadow: inset 0 0 0 1000px #ffffff!important; outline:none;
		background: none!important;
      }
#surveyContainer2023 input:-webkit-autofill:focus,
#surveyContainer2023 textarea:-webkit-autofill:focus,
#surveyContainer2023 select:-webkit-autofill:focus {
  -webkit-appearance:none; -webkit-box-shadow: inset 0 0 0 1000px #ffffff, 0 0 0 4px rgba(0,125,250,.6)!important; box-shadow: inset 0 0 0 1000px #ffffff, 0 0 0 4px rgba(0,125,250,.6)!important; outline:none;
}

#surveyContainer2023 input:focus {-webkit-appearance:none; outline: none!important; border-color: #0071e3; box-shadow: 0 0 0 4px rgba(0,125,250,.6); -webkit-box-shadow: 0 0 0 4px rgba(0,125,250,.6);}
#surveyContainer2023 textarea:focus {-webkit-appearance:none; outline: none!important; border-color: #0071e3; box-shadow: 0 0 0 4px rgba(0,125,250,.6); -webkit-box-shadow: 0 0 0 4px rgba(0,125,250,.6);}
#surveyContainer2023 select:focus {-webkit-appearance:none; outline: none!important; border-color: #0071e3; box-shadow: 0 0 0 4px rgba(0,125,250,.6); -webkit-box-shadow: 0 0 0 4px rgba(0,125,250,.6);}

.newTextBoxInput:focus,
.newTextBoxInput:focus-visible {-webkit-appearance:none; outline: none!important; border-color: #0071e3; box-shadow: 0 0 0 4px rgba(0,125,250,.6); -webkit-box-shadow: 0 0 0 4px rgba(0,125,250,.6);}

.newTextBoxInput:focus~ .input-placeholder {font-size: 12px!important; top: 9px;}
/*.surveyTextBox2023:valid~ .input-placeholder {font-size: 12px!important; top: 9px;}*/
.newTextBoxInput.focus-filled~ .input-placeholder {font-size: 12px!important; top: 9px;}

.newTextAreaInput	{width: 100%; height:200px; padding:15px 25px 0 25px; margin:40px 0 0 0; background:#ffffff; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:400; font-size:17px!important; line-height: 20px; color:#494949; box-sizing: border-box; border: 1px solid #cccccc; resize: none;}

.newTextAreaInput:focus,
.newTextAreaInput:focus-visible {-webkit-appearance:none; outline: none!important; border-color: #0071e3; box-shadow: 0 0 0 4px rgba(0,125,250,.6); -webkit-box-shadow: 0 0 0 4px rgba(0,125,250,.6);}

#surveyContainer2023 input:-webkit-autofill~ .input-placeholder,
#surveyContainer2023 textarea:-webkit-autofill~ .input-placeholder,
#surveyContainer2023 select:-webkit-autofill~ .input-placeholder {
        font-size: 12px!important; top: 9px;
      }

#surveyContainer2023 input::-webkit-contacts-auto-fill-button,
#surveyContainer2023 textarea::-webkit-contacts-auto-fill-button,
#surveyContainer2023 select::-webkit-contacts-auto-fill-button {
  visibility: hidden;
  display: none !important;
  pointer-events: none;
  position: absolute;
  right: 0;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

.new-select-control { display:block; padding:0; margin: 0; width: 100%; overflow: visible; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif;  font-weight:400; color: #121212; font-size: 17px; position:relative; cursor:pointer; height:56px; background:#ffffff; line-height:56px; border-radius:8px; -webkit-border-radius:8px; -moz-border-radius:8px; color:#494949; text-indent:25px; box-sizing: border-box;}

.new-select-control select {font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; padding:15px 25px 0 50px; width: 100%; height:56px; border: none; box-shadow: none; background-color: transparent; background-image: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; font-weight:400; color: #494949; font-size: 17px; cursor:pointer; max-width: 100%; float:left; /*Altered two below to make word wrap work */ word-wrap: normal !important; white-space: normal; box-sizing: border-box; border: 1px solid #cccccc; border-radius:8px; -webkit-border-radius:8px; -moz-border-radius:8px;}

.new-select-control i {padding:0; position:absolute;  top:50%; right:15px;  transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); background: none; pointer-events: none; font-size:17px; border: none}

.new-select-control img {position: absolute; left: 18px; width: 20px; height: auto; top: 18px; z-index: 3; pointer-events: none; white-space: nowrap; overflow: hidden;}

#newMainSelect:focus,
#newMainSelect:focus-visible {-webkit-appearance:none; outline: none!important; border-color: #0071e3; box-shadow: 0 0 0 4px rgba(0,125,250,.6); -webkit-box-shadow: 0 0 0 4px rgba(0,125,250,.6);}

#newMainSelect.focus-filled~ .input-placeholder {font-size: 12px!important; top: 9px;}

.survey-start-button {width: 100%; height:auto; padding: 0; border-radius: 20px;-webkit-border-radius: 20px;-moz-border-radius: 20px; background:#ffffff; -webkit-box-shadow: inset 0px 0px 0px 1px rgba(204,204,204,1);
-moz-box-shadow: inset 0px 0px 0px 1px rgba(204,204,204,1);
box-shadow: inset 0px 0px 0px 1px rgba(204,204,204,1); margin:0;}

.survey-start-button a {display: block; width: 100%; height: 100%; padding: 25px; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:400; font-size:19px; color:#121212; line-height:27px; margin:0; text-rendering: optimizeLegibility; display: -webkit-box;  
  display: -moz-box;  
  display: -ms-flexbox;  
  display: -webkit-flex; 
  display: flex; flex-direction:row; align-items:center;  box-sizing: border-box; overflow: hidden; text-decoration:none!important; color:#121212; font-weight: 500;}

.survey-start-button a:visited {color:#121212!important; text-decoration:none!important;}
.survey-start-button:hover {-webkit-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
-moz-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1); background: #F0F6FD;}

.survey-start-button.activeClick {-webkit-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
-moz-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1); background: #F0F6FD;}

.surveySpacerPanel {width: 100%; height: 190px;}

.survey-category-check-prod {height:auto; border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; padding:0; margin:30px auto;}

.survey-category-check-prod label {width: 100%; height:auto;border-radius: 20px;-webkit-border-radius: 20px;-moz-border-radius: 20px; background:#ffffff; -webkit-box-shadow: inset 0px 0px 0px 1px rgba(204,204,204,1);
-moz-box-shadow: inset 0px 0px 0px 1px rgba(204,204,204,1);
box-shadow: inset 0px 0px 0px 1px rgba(204,204,204,1); position:relative; padding:30px; margin:0; display: -webkit-box;  
  display: -moz-box;  
  display: -ms-flexbox;  
  display: -webkit-flex; 
  display: flex; flex-direction:row; align-items:center;  box-sizing: border-box; overflow: hidden;}

.survey-category-check-prod label p {box-sizing: border-box; padding-right: 30px;}

/* hide input */
.survey-category-check-prod input.radioSelUSD:empty {margin-top: -50000px;
	visibility:hidden;
}

.survey-category-check-prod .radioSelUSD {
	width:10px;
}

/* style label */
.survey-category-check-prod input.radioSelUSD:empty ~ label {
	position: relative;
	
	line-height: 30px;
	text-indent: 0;
	margin-top: 0;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.survey-category-check-prod input.radioSelUSD:empty ~ label::after {
	position: absolute;
	display: block;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	right: 25px;
	content: '';
	width: 25px;
	height:25px;
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	  z-index: 3;
	-webkit-box-shadow: inset 0px 0px 0px 1px rgba(204,204,204,1);
-moz-box-shadow: inset 0px 0px 0px 1px rgba(204,204,204,1);
box-shadow: inset 0px 0px 0px 1px rgba(204,204,204,1);
	box-sizing: border-box;
}

.survey-category-check-prod input.radioSelUSD:hover:not(:checked) ~ label::after {
	content: '';
	line-height:25px;
	color: #ffffff;
	text-align:center;
	opacity:1.0;
	font-size:14px;
	font-weight: bold;
	font-family: "Font Awesome 5 Free";

}

.survey-category-check-prod input.radioSelUSD:hover:not(:checked) ~ label {
	color: #ffffff;
	-webkit-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
-moz-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
	opacity:1.0;

}


.survey-category-check-prod input.radioSelUSD:checked ~ label::after {
	content: '\f00c';
	line-height:25px;
	color: #1E76E3;
	padding:0;
	margin:0;
	text-align:center;
	font-size:14px;
	font-weight: bold;
	background-color:#ffffff;
	font-family: "Font Awesome 5 Free";
	-webkit-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
-moz-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
	
}

.survey-category-check-prod input.radioSelUSD:checked ~ label::after {
	content: '\f00c';
	line-height:25px;
	color: #1E76E3;
	padding:0;
	margin:0;
	text-align:center;
	font-size:14px;
	font-weight: bold;
	background-color:#ffffff;
	font-family: "Font Awesome 5 Free";
	-webkit-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
-moz-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
}

.survey-category-check-prod input.radioSelUSD:checked ~ label {
-webkit-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
-moz-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);	opacity:1.0; background: #F0F6FD;
}

.survey-5col {width:100%; max-width: 1000px; height:auto; margin:50px auto 0 auto; padding:0; display:grid; grid-gap: 0; grid-template-columns: repeat(5, 1fr); border:1px solid #cccccc; border:1px solid rgba(204,204,204,1); border-radius: 20px;-webkit-border-radius: 20px;-moz-border-radius: 20px; overflow: hidden;}

.rate-ring {width:54px; height:54px; -webkit-border-radius: 27px; -moz-border-radius: 27px; border-radius: 27px; padding: 10px; -webkit-box-shadow: inset 0px 0px 0px 1px rgba(204,204,204,1);
-moz-box-shadow: inset 0px 0px 0px 1px rgba(204,204,204,1);
box-shadow: inset 0px 0px 0px 1px rgba(204,204,204,1);
	box-sizing: border-box; display: flex; justify-content: center; align-items: center; margin: 0 auto; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight: 500; font-size: 23px; text-align: center; line-height: 54px}

.rate-ring-small  {width:30px; height:30px; -webkit-border-radius: 27px; -moz-border-radius: 27px; border-radius: 27px; padding: 10px; -webkit-box-shadow: inset 0px 0px 0px 1px rgba(204,204,204,1);
-moz-box-shadow: inset 0px 0px 0px 1px rgba(204,204,204,1);
box-shadow: inset 0px 0px 0px 1px rgba(204,204,204,1);
	box-sizing: border-box; display: flex; justify-content: center; align-items: center; margin: 0 auto; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight: 500; font-size: 17px; text-align: center; line-height: 30px}

.survey-rate-radio {height:auto; border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; padding:0; margin:30px auto;}

.survey-rate-radio label {width: 100%; height:auto; background:#ffffff; position:relative; padding:17px 25px; margin:0; display: -webkit-box;  
  display: -moz-box;  
  display: -ms-flexbox;  
  display: -webkit-flex; 
  display: flex; flex-direction:row; align-items:center;  box-sizing: border-box; overflow: hidden; -webkit-box-shadow: inset -1px 0px 0px 0 rgba(204,204,204,1);
-moz-box-shadow: inset -1px 0px 0px 0 rgba(204,204,204,1);
box-shadow: inset -1px 0px 0px 0 rgba(204,204,204,1);}

.survey-rate-radio label.last-rating {
	-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}

/* hide input */
.survey-rate-radio input.radioSelUSD:empty {margin-top: -50000px;
	visibility:hidden;
}

.survey-rate-radio .radioSelUSD {
	width:10px;
}

/* style label */
.survey-rate-radio input.radioSelUSD:empty ~ label {
	position: relative;
	
	line-height: 19px;
	text-indent: 0;
	margin-top: 0;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.survey-rate-radio input.radioSelUSD:hover:not(:checked) ~ label .rate-ring {
	-webkit-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
-moz-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
	opacity:1.0;

}

.survey-rate-radio input.radioSelUSD:checked ~ label .rate-ring {
-webkit-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
-moz-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);	opacity:1.0; background: #F0F6FD;
}

.survey-rate-radio-small {height:auto; border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; padding:0; margin:30px auto;}

.survey-rate-radio-small label {width: 100%; height:auto; background:#ffffff; position:relative; padding:17px 15px; margin:0; display: -webkit-box;  
  display: -moz-box;  
  display: -ms-flexbox;  
  display: -webkit-flex; 
  display: flex; flex-direction:row; align-items:center;  box-sizing: border-box; overflow: hidden; -webkit-box-shadow: inset -1px 0px 0px 0 rgba(204,204,204,1);
-moz-box-shadow: inset -1px 0px 0px 0 rgba(204,204,204,1);
box-shadow: inset -1px 0px 0px 0 rgba(204,204,204,1);}

.survey-rate-radio-small label.last-rating {
	-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}

/* hide input */
.survey-rate-radio-small input.radioSelUSD:empty {margin-top: -50000px;
	visibility:hidden;
}

.survey-rate-radio-small .radioSelUSD {
	width:10px;
}

/* style label */
.survey-rate-radio-small input.radioSelUSD:empty ~ label {
	position: relative;
	
	line-height: 19px;
	text-indent: 0;
	margin-top: 0;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.survey-rate-radio-small input.radioSelUSD:hover:not(:checked) ~ label .rate-ring-small {
	-webkit-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
-moz-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
	opacity:1.0;

}

.survey-rate-radio-small input.radioSelUSD:checked ~ label .rate-ring-small {
-webkit-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
-moz-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);	opacity:1.0; background: #F0F6FD;
}

.home-hero-sl-wrapper {width: 100%; max-width: 1400px; margin: 0 auto 0 auto; padding: 60px 40px 0 40px; box-sizing: border-box; height: auto;}

.home-hero-sl-nav {width: 100%; max-width: 1000px; margin: 0 auto 60px auto; height: auto; -webkit-border-radius: 25px; -moz-border-radius: 25px; -o-border-radius: 25px; border-radius: 25px; padding: 0; background: rgba(0, 0, 0, 0.2); border: 2px solid rgba(255, 255, 255, 0.2); box-sizing: border-box;}

.home-hero-sl-nav ul {width: 100%; height: auto; list-style: none; padding: 0; margin: 0; display: flex; flex-direction: row;}

.home-hero-sl-nav ul li {height: 50px; -webkit-border-radius: 25px; -moz-border-radius: 25px; -o-border-radius: 25px; border-radius: 25px; color: #ffffff; font-family:"SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica", -apple-system, BlinkMacSystemFont, "Arial",sans-serif; font-weight:500; font-size:15px; text-rendering: optimizeLegibility; flex: 1 1 auto;}

.home-hero-sl-nav ul li a {width:100%; height:100%; display: block; color: #ffffff; text-decoration: none; transition: all .3s ease-in-out; line-height: 50px; -webkit-border-radius: 25px; -moz-border-radius: 25px; -o-border-radius: 25px; border-radius: 25px;}

.home-hero-sl-nav ul li a:hover {opacity:0.5; transition: all .1s ease-in-out;}

.home-hero-sl-nav ul li a:visited {color:#ffffff!important; text-decoration: none!important;}
.home-hero-sl-nav ul li a.active {background: rgba(30, 118, 227, 0.2); transition: all .1s ease-in-out; -webkit-box-shadow: 0px 0px 0px 2px rgba(30,118,227,1); -moz-box-shadow: 0px 0px 0px 2px rgba(30,118,227,1); box-shadow: 0px 0px 0px 2px rgba(30,118,227,1); color: #ffffff!important; opacity: 1!important;}


.home-hero-sl-content {width: 100%; color: #ffffff;}
.home-hero-sl-inner {width: 100%; height: auto; display: flex!important; flex-direction: row; padding-bottom: 80px;}
.home-hero-sl-inner-left {width: 100%; max-width: 530px; min-width: 465px; margin-right: 60px;}
.home-hero-sl-inner-right {width: 100%; min-width: 730px}
.home-hero-sl-inner-right img {object-fit: cover; object-position: left; width:100%; height: 100%}
 
.home-hero-sl-medium {display: inline-block}
.home-hero-sl-small {display: inline-block}
.home-hero-sl-tiny {display: inline-block}


.hero-banner-main {display: block; padding-top: 50px; background: #080808;}
.hero-banner-wrapper {background-image: url("../images/products/picture-serve/homepage/hero-banner-architect2.jpg"); background-repeat: no-repeat; background-position: top center; background-color: #080808; background-size: cover; display: flex; flex-direction: column;}


.home-hero-sl-wrapper2 {width: 100%; max-width: 100%; margin: 0 auto 0 auto; padding: 0; box-sizing: border-box; height: auto; background: rgba(0, 0, 0, 0.4);}

.home-hero-sl-nav2 {width: 100%; max-width: 1400px; margin: 0 auto 0 auto; height: auto; padding: 0; box-sizing: border-box; display: flex; justify-content: space-between; align-items: center;}

.hero-banner-wrapper::before {width: 100%; content: ""; background:hsla(0,0%,40%,0.2); height: 30px; display: block; -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px)}

.bg-hero-left-right {display: flex; width: 100%;}
.bg-hero-left-right::before {content: ""; width: calc(50vw - 700px); display: block; background:hsla(0,0%,40%,0.2); height: 60px; -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px)}
.bg-hero-left-right::after {content: ""; width: calc(50vw - 700px); display: block; background:hsla(0,0%,40%,0.2); height: 60px; -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px)}

.home-hero-sl-nav2 ul {width: 100%; max-width: 1000px; height: auto; list-style: none; padding: 0; margin: 0; display: flex; flex-direction: row; order: 1;}

.home-hero-sl-nav2::after {content: ""; width: calc(100% - 1000px); display: block; background:hsla(0,0%,40%,0.2); height: 60px; order: 2; -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px)}

.home-hero-sl-nav2 ul li {height: 60px; color: #878B93; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif;font-weight:500; font-size:1rem; text-rendering: optimizeLegibility; flex: 1 1 auto;}

.home-hero-sl-nav2 ul li a {width:100%; height:100%; display: block; color: #878B93; text-decoration: none; transition: all .3s ease-in-out; line-height: 60px; background:hsla(0,0%,40%,0.2); -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px)}

.home-hero-sl-nav2 ul li a:hover {color: #636261; transition: all .1s ease-in-out;}

.home-hero-sl-nav2 ul li a:visited {opacity: 0.5; text-decoration: none!important;}
.home-hero-sl-nav2 ul li a.active {background: none; transition: all .1s ease-in-out; -webkit-box-shadow: inset 0px 2px 0px 0px rgba(255,255,255,1); -moz-box-shadow: inset 0px 2px 0px 0px rgba(255,255,255,1); box-shadow: inset 0px 2px 0px 0px rgba(255,255,255,1); color: #ffffff!important; opacity: 1!important;}

.home-hero-sl-content-wrap {width: 100%; padding: 70px 40px 100px 40px; box-sizing: border-box; height: auto;}
.home-padding-wrap {max-width: 1350px; margin: 0 auto;}
.home-hero-bc-wrapper {display: flex; flex-direction: row; justify-content: space-between; flex-wrap: wrap;}
.hero-bc-1 {flex: 0 0 auto; width: 55%; order: 1;}
.hero-bc-2 {flex: 0 0 auto; width: 35%; order: 2;}
.hero-bc-3 {flex: 0 0 auto; width: 100%; margin-top: 70px; order: 3; background: #0F396C; padding: 5% 6% 0 6%; box-sizing: border-box; -webkit-border-radius:20px; -moz-border-radius:20px; -o-border-radius:20px; border-radius:20px;}
.home-hero-button-wrap {width:100%; max-width: 270px; display: flex; flex-direction: row; gap:20px; margin-top: 20px}
	.hero-bc-3 img	{margin-top:40px}


.bxHeroNext a {color:#ffffff}
.bxHeroPrev a {color:#ffffff}

.bxHeroNext i {border: 0; margin: 0; paddin:0;}
.bxHeroPrev i {border: 0; margin: 0; paddin:0;}

.bxHeroNext a:hover {color: #606060}
.bxHeroPrev a:hover {color: #606060}

.bxHeroNext .disabled {visibility: hidden}
.bxHeroPrev .disabled {visibility: hidden}


.bx-hero-controls {width: 50px; display: grid; grid-template-columns: repeat(2, 1fr); padding-left: 10px; background:hsla(0,0%,40%,0.2); height: 60px; align-items: center; order: 3; -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px)}

.home-hero-panel-title	{width:100%; height:auto; font-family: "SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:800; font-size: 2.875rem; color:#ffffff; padding:10px 0 0 0; margin:0 auto 0 auto; text-rendering: optimizeLegibility; line-height: 1.2; -webkit-font-smoothing: subpixel-antialiased!important;}

.home-hero-panel-sub-title	{width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:600; font-size: 1rem; color:#ffffff; padding: 0; margin:0 auto 0 auto; text-rendering: optimizeLegibility; line-height: 1.2; text-transform: uppercase;}

.home-hero-panel-body	{width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:400; font-size:1.125rem; color:#CECECE; padding:25px 0 0 0; margin:0; text-rendering: optimizeLegibility; line-height: 1.5}

.hero-banner-content {width: 100%!important; margin: 0 auto; padding: 100px 50px; box-sizing: border-box;}

.hero-banner-content-inner {width: 100%!important; max-width: 1320px; height: auto; margin: 0 auto; padding:0;}

.hero-banner-content-inner .hb-content {width: 100%!important;}

.hb-flex-wrap {width: 100%!important; display: flex; flex-direction: row; height: auto; gap:50px}
.hb-col-left {width: 38%; min-width: 530px;}
.hb-col-right {width: 62%; overflow: visible;}

.btn-wc-hollow	{width: auto; height:auto; text-align:center; color:#ffffff!important; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; outline:none; border:none; cursor:pointer; line-height:1.2; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1.125rem; border: 2px solid #ffffff!important; box-sizing: border-box; display: inline-block; -webkit-font-smoothing: subpixel-antialiased!important;}
.btn-wc-hollow:hover {opacity:0.8!important;}
.btn-wc-hollow a {text-decoration:none!important; display:block; height:auto; color:#ffffff!important; line-height: 1.2; padding: 18px 30px;}
.btn-wc-hollow a:visited {color:#ffffff!important; text-decoration:none!important;}
.btn-wc-hollow i {border: none; margin: 0; line-height: 1.2; padding: 0;}

.btn-wc-solid	{width: auto; height:auto; text-align:center; color:#121212!important; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; outline:none; border:none; cursor:pointer; line-height:1.2; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1.125rem; border: 2px solid #ffffff!important; box-sizing: border-box; background: #ffffff; display: inline-block; -webkit-font-smoothing: subpixel-antialiased!important; }
.btn-wc-solid:hover {opacity:0.8!important;}
.btn-wc-solid a {text-decoration:none!important; display:block; height:auto; color:#121212!important; line-height: 1.2; padding:18px 30px;}
.btn-wc-solid a:visited {color:#121212!important; text-decoration:none!important;}
.btn-wc-solid i {border: none; margin: 0; line-height: 1.2; padding: 0;}

.btn-blk-solid	{width: auto; height:auto; text-align:center; color:#ffffff!important; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; outline:none; border:none; cursor:pointer; line-height:1.2; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1.125rem; border: 2px solid #0f0f0f!important; box-sizing: border-box; background: #0f0f0f; display: inline-block; -webkit-font-smoothing: subpixel-antialiased!important;}
.btn-blk-solid:hover {opacity:0.8!important;}
.btn-blk-solid a {text-decoration:none!important; display:block; height:auto; color:#ffffff!important; line-height: 1.2; padding:18px 30px;}
.btn-blk-solid a:visited {color:#ffffff!important; text-decoration:none!important;}
.btn-blk-solid i {border: none; margin: 0; line-height: 1.2; padding: 0;}

.btn-blk-hollow	{width: auto; height:auto; text-align:center; color:#121212!important; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; outline:none; border:none; cursor:pointer; line-height:1.2; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1.125rem; border: 2px solid #121212!important; box-sizing: border-box; display: inline-block; -webkit-font-smoothing: subpixel-antialiased!important;}
.btn-blk-hollow:hover {opacity:0.8!important;}
.btn-blk-hollow a {text-decoration:none!important; display:block; height:auto; color:#121212!important; line-height: 1.2; padding:18px 30px;}
.btn-blk-hollow a:visited {color:#121212!important; text-decoration:none!important;}
.btn-blk-hollow i {border: none; margin: 0; line-height: 1.2; padding: 0;}

.btn-bl-hollow	{width: auto; height:auto; text-align:center; color:#1E76E3!important; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; outline:none; border:none; cursor:pointer; line-height:1.2; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1.125rem; border: 2px solid #1E76E3!important; box-sizing: border-box; display: inline-block; -webkit-font-smoothing: subpixel-antialiased!important;}
.btn-bl-hollow:hover {opacity:0.8!important;}
.btn-bl-hollow a {text-decoration:none!important; display:block; height:auto; color:#1E76E3!important; line-height: 1.2; padding:18px 30px;}
.btn-bl-hollow a:visited {color:#1E76E3!important; text-decoration:none!important;}
.btn-bl-hollow i {border: none; margin: 0; line-height: 1.2; padding: 0;}

.btn-bl-solid	{width: auto; height:auto; text-align:center; color:#ffffff!important; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; outline:none; border:none; cursor:pointer; line-height:1.2; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1.125rem; border: 2px solid #1E76E3!important; box-sizing: border-box; background: #1E76E3; display: inline-block; -webkit-font-smoothing: subpixel-antialiased!important; }
.btn-bl-solid:hover {opacity:0.8!important;}
.btn-bl-solid a {text-decoration:none!important; display:block; height:auto; color:#ffffff!important; line-height: 1.2;padding:18px 30px;}
.btn-bl-solid a:visited {color:#ffffff!important; text-decoration:none!important;}
.btn-bl-solid i {border: none; margin: 0; line-height: 1.2; padding: 0;}

.btn-pnk-hollow	{width: auto; height:auto; text-align:center; color:#D12B78!important; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; outline:none; border:none; cursor:pointer; line-height:1.2; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1.125rem; border: 2px solid #D12B78!important; box-sizing: border-box; display: inline-block; -webkit-font-smoothing: subpixel-antialiased!important;}
.btn-pnk-hollow:hover {opacity:0.8!important;}
.btn-pnk-hollow a {text-decoration:none!important; display:block; height:auto; color:#D12B78!important; line-height: 1.2; padding:18px 30px;}
.btn-pnk-hollow a:visited {color:#D12B78!important; text-decoration:none!important;}
.btn-pnk-hollow i {border: none; margin: 0; line-height: 1.2; padding: 0;}

.btn-pnk-solid	{width: auto; height:auto; text-align:center; color:#ffffff!important; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; outline:none; border:none; cursor:pointer; line-height:1.2; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1.125rem; border: 2px solid #D12B78!important; box-sizing: border-box; background: #D12B78; display: inline-block; -webkit-font-smoothing: subpixel-antialiased!important; }
.btn-pnk-solid:hover {opacity:0.8!important;}
.btn-pnk-solid a {text-decoration:none!important; display:block; height:auto; color:#ffffff!important; line-height: 1.2;padding:18px 30px;}
.btn-pnk-solid a:visited {color:#ffffff!important; text-decoration:none!important;}
.btn-pnk-solid i {border: none; margin: 0; line-height: 1.2; padding: 0;}

.btn-red-solid	{width: auto; height:auto; text-align:center; color:#ffffff!important; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; outline:none; border:none; cursor:pointer; line-height:1.2; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1.125rem; border: 2px solid #D0544B!important; box-sizing: border-box; background: #D0544B; display: inline-block; -webkit-font-smoothing: subpixel-antialiased!important; }
.btn-red-solid:hover {opacity:0.8!important;}
.btn-red-solid a {text-decoration:none!important; display:block; height:auto; color:#ffffff!important; line-height: 1.2;padding:18px 30px;}
.btn-red-solid a:visited {color:#ffffff!important; text-decoration:none!important;}
.btn-red-solid i {border: none; margin: 0; line-height: 1.2; padding: 0;}

.btn-red-hollow	{width: auto; height:auto; text-align:center; color:#D0544B!important; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; outline:none; border:none; cursor:pointer; line-height:1.2; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1.125rem; border: 2px solid #D0544B!important; box-sizing: border-box; display: inline-block; -webkit-font-smoothing: subpixel-antialiased!important;}
.btn-red-hollow:hover {opacity:0.8!important;}
.btn-red-hollow a {text-decoration:none!important; display:block; height:auto; color:#D0544B!important; line-height: 1.2; padding:18px 30px;}
.btn-red-hollow a:visited {color:#D0544B!important; text-decoration:none!important;}
.btn-red-hollow i {border: none; margin: 0; line-height: 1.2; padding: 0;}

.home-hero-btn-wrap {display: flex; gap:20px; margin-top:30px}

.car-scroll-snap-position-container	{width: 100%; position:relative; overflow: hidden; height:auto;}
.car-scroll-snap-main-wrapper	{position: relative; overflow-x: scroll; padding-bottom: 0; /*scroll-behavior: smooth;*/ -ms-overflow-style:none; scrollbar-width:none;}

.car-scroll-snap-main-wrapper::-webkit-scrollbar	{display:none}
.car-flex-slide-scroll-snap-container	{width:100%; vertical-align: top; display: inline-flex; gap:30px }
.car-flex-slider-scroll-wrapper	{display: flex; padding: 0; flex-shrink: none; scroll-snap-align: start; scroll-snap-stop: normal;}

#scroll-left-button	{width: 60px; height: 60px; line-height: 60px; color: #ffffff; position: absolute; left: 30px; top: calc(50% - 30px); background: rgba(0,0,0,0.4); transition: transform 0.5s ease-in, opacity 0.7s cubic-bezier(0.15, 0, 0.2, 1) 0.1s; opacity: 0; cursor: pointer; border-radius:35px; -webkit-border-radius:35px; -moz-border-radius:35px; -webkit-transform: scale(0.75); -moz-transform: scale(0.75); transform: scale(0.75);}

#scroll-right-button	{width: 60px; height: 60px; line-height: 60px; color: #ffffff; position: absolute; right: 30px; top: calc(50% - 30px); background: rgba(0,0,0,0.4); transition: transform 0.5s ease-in, opacity 0.7s cubic-bezier(0.15, 0, 0.2, 1) 0.1s; opacity: 0; cursor: pointer; border-radius:35px; -webkit-border-radius:35px; -moz-border-radius:35px; -webkit-transform: scale(0.75); -moz-transform: scale(0.75); transform: scale(0.75);}

.car-scroll-snap-position-container:hover #scroll-left-button	{opacity: 1; -webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1);}
.car-scroll-snap-position-container:hover #scroll-right-button	{opacity: 1; -webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1);}

#scroll-left-button:hover, #scroll-right-button:hover	{background: rgba(96,96,96,0.75); transition: all .3s cubic-bezier(0,0,.5,1);}
#scroll-left-button i, #scroll-right-button i	{border: none; padding: 0; margin: 0; line-height: 60px; font-size: 21px;}

.car-mask-scroll-stopper	{width: 100%; height: 100%; position: absolute; top: 0; left:0; right: 0; bottom: 0; background: none; display: none}

.car-scroll-prod-wrapper	{border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; background:#ffffff; width:420px; max-width:420px; overflow:hidden; height:auto; 
	-webkit-transform: translateX(calc(max(1024px, 100vw)/2 - 660px)); 
	-moz-transform: translateX(calc(max(1024px, 100vw)/2 - 660px));
	transform: translateX(calc(max(1024px, 100vw)/2 - 660px)); 
	transition: all .3s cubic-bezier(0,0,.5,1); display: flex; flex-direction: column;}


.panel-h1-bold	{width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:800; font-size: clamp(1.3125rem, calc(1.21rem + 0.463vw), 1.625rem); color:#121212; padding:0; margin:0 auto 0 auto; text-rendering: optimizeLegibility; line-height: 1.2; -webkit-font-smoothing: subpixel-antialiased!important;}

.panel-h1-less-bold	{width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:700; font-size: clamp(1.3125rem, calc(1.21rem + 0.463vw), 1.625rem); color:#121212; padding:0; margin:0 auto 0 auto; text-rendering: optimizeLegibility; line-height: 1.2; -webkit-font-smoothing: subpixel-antialiased!important;}

.panel-h1-bolder	{width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:800; font-size: clamp(1.3125rem, calc(1.81rem + 0.463vw), 2.5rem); color:#121212; padding:0; margin:0 auto 0 auto; text-rendering: optimizeLegibility; line-height: 1.2; -webkit-font-smoothing: subpixel-antialiased!important;}

.panel-h-small	{width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:700; font-size: 1.125rem; color:#121212; padding:0; margin:0 auto 0 auto; text-rendering: optimizeLegibility; line-height: 1; -webkit-font-smoothing: subpixel-antialiased!important;}

.panel-sub-h1-bold	{width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:600; font-size:0.875rem; color:#6e6e73; padding: 0; margin:0 auto 20px auto; text-rendering: optimizeLegibility; line-height: 1.2; text-transform: uppercase;}

.panel-sub-h1-bolder	{width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:bold; font-size:1.25rem; color:#6e6e73; padding: 0; margin:0 auto 20px auto; text-rendering: optimizeLegibility; line-height: 1.2; text-transform: uppercase;}

.panel-p-body-bold	{width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1.125rem; color:#121212; padding:25px 0 0 0; margin:0; text-rendering: optimizeLegibility; line-height: 1.5}

.panel-p-price	{width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1rem; color:#121212; padding:0; margin:0; text-rendering: optimizeLegibility; line-height: 1.2}

.panel-h4-bold	{width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:bold; font-size: 1.25rem; color:#121212; padding:0; margin:0 auto 0 auto; text-rendering: optimizeLegibility; line-height: 1.2; -webkit-font-smoothing: subpixel-antialiased!important;}

.flex-col2-sb {display: -webkit-box!important; display: -webkit-flex!important; display: flex!important; flex-direction: row; justify-content: space-between; align-items: center}
.flex-col2-ns {display: -webkit-box!important; display: -webkit-flex!important; display: flex!important; flex-direction: row; align-items: center;}

.flex-col2-ns-no {display: -webkit-box; display: -webkit-flex; display: flex; flex-direction: row; align-items: center;}

.flex-col2-sb-rc {display: -webkit-box!important; display: -webkit-flex!important; display: flex!important; flex-direction: row; justify-content: space-between; align-items: center}

.flex-title {display: -webkit-box!important; display: -webkit-flex!important; display: flex!important; flex-direction: row; justify-content: space-between; align-items: center; gap: 20px}

.flex-title2 {display: flex; gap:10px; align-items: flex-end; flex-direction: column}

.col-bor-inset-light {-webkit-box-shadow: inset 0px 0px 0px 1px rgba(255,255,255,0.1);
-moz-box-shadow: inset 0px 0px 0px 1px rgba(255,255,255,0.1);
box-shadow: inset 0px 0px 0px 1px rgba(255,255,255,0.1);}

.col-bor-inset {-webkit-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.1);
-moz-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.1);
box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.1);}

.col-shad-outer {-webkit-box-shadow: 0px 4px 12px 0px rgba(0,0,0,0.08);
-moz-box-shadow: 0px 4px 12px 0px rgba(0,0,0,0.08);
box-shadow: 0px 4px 12px 0px rgba(0,0,0,0.08);}

.bor-radius-bottom {border-bottom-left-radius: 20px; border-bottom-right-radius: 20px;}
.bor-radius-top {border-top-left-radius: 20px; border-top-right-radius: 20px;}

.row-bor-bottom {margin-top:30px;}

.prod-image-pro-dark	{background:url(../images/products/picture-serve/pro-dark-bg-big.jpg) no-repeat bottom center #0f0f0f; background-size:contain; box-sizing: border-box;}

.new-image-sonoma	{background:url("../images/products/picture-serve/dwg-viewer/sonoma.jpg") no-repeat top center #ffffff; background-size:cover; box-sizing: border-box;}

.header-flex-wrap {width: 100%; max-width: 1320px; margin: 0 auto 50px auto; display: flex; flex-direction: row; justify-content: space-between; align-items: center;}
.bxnav-wrap {width: 100%; max-width: 1320px; margin: 0 auto 50px auto; display: flex; flex-direction: row; justify-content: space-between; align-items: center}
.padding-wrap {width: 100%; height: auto; padding: 0 50px; box-sizing: border-box;}
.sect-inner-wrap {width: 100%; max-width: 1320px; margin: 0 auto;}

.car-bxnav-light {background: #ffffff; margin: 0; padding: 0; height: auto; -webkit-border-radius: 25px; -moz-border-radius: 25px; border-radius: 25px; -webkit-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,.1); -moz-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,.1); box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,.1);}
.car-bxnav-light ul {height: auto; list-style: none; padding: 0; margin: 0; display: flex; flex-direction: row;}
.car-bxnav-light ul li {height: 50px; line-height: 50px; -webkit-border-radius: 25px; -moz-border-radius: 25px; border-radius: 25px; color: #121212; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1rem; text-rendering: optimizeLegibility; overflow: hidden; text-align: center; flex: 1 1 auto; display: inline-block;}
.car-bxnav-light ul li a {width:100%; height:100%; display: block; color: #121212; text-decoration: none; transition: all .3s ease-in-out; overflow: hidden; padding: 0 25px; box-sizing: border-box;  -webkit-border-radius: 25px; -moz-border-radius: 25px; border-radius: 25px;}
.car-bxnav-light ul li a:hover {color:#606060; transition: all .1s ease-in-out;}
.car-bxnav-light ul li a:visited {color:#121212;}
.car-bxnav-light ul li a.active {color:#1E76E3!important; transition: all .3s ease-in-out; -webkit-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1); -moz-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1); box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);}

.car-wmnav-light {background: #ffffff; margin: 0; padding: 0; height: auto; -webkit-border-radius: 25px; -moz-border-radius: 25px; border-radius: 25px; -webkit-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,.1); -moz-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,.1); box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,.1);}
.car-wmnav-light ul {height: auto; list-style: none; padding: 0; margin: 0; display: flex; flex-direction: row;}
.car-wmnav-light ul li {height: 50px; line-height: 50px; -webkit-border-radius: 25px; -moz-border-radius: 25px; border-radius: 25px; color: #121212; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1rem; text-rendering: optimizeLegibility; overflow: hidden; text-align: center; flex: 1 1 auto; display: inline-block;}
.car-wmnav-light ul li a {width:100%; height:100%; display: block; color: #121212; text-decoration: none; transition: all .3s ease-in-out; overflow: hidden; padding: 0 25px; box-sizing: border-box;  -webkit-border-radius: 25px; -moz-border-radius: 25px; border-radius: 25px;}
.car-wmnav-light ul li a:hover {color:#606060; transition: all .1s ease-in-out;}
.car-wmnav-light ul li a:visited {color:#121212;}
.car-wmnav-light ul li a.active {color:#1E76E3!important; transition: all .3s ease-in-out; -webkit-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1); -moz-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1); box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);}

.sect-bxnav-dark {background: #121212; margin: 0; padding: 0; height: auto; -webkit-border-radius: 25px; -moz-border-radius: 25px; border-radius: 25px; -webkit-box-shadow: inset 0px 0px 0px 2px rgba(255,255,255,.15); -moz-box-shadow: inset 0px 0px 0px 2px rgba(255,255,255,.15); box-shadow: inset 0px 0px 0px 2px rgba(255,255,255,.15);}
.sect-bxnav-dark ul {height: auto; list-style: none; padding: 0; margin: 0; display: flex; flex-direction: row;}
.sect-bxnav-dark ul li {height: 50px; line-height: 50px; -webkit-border-radius: 25px; -moz-border-radius: 25px; border-radius: 25px; color: #7c7c7c; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1rem; text-rendering: optimizeLegibility; overflow: hidden; text-align: center; flex: 1 1 auto; display: inline-block;}
.sect-bxnav-dark ul li a {width:100%; height:100%; display: block; color: #7c7c7c; text-decoration: none; transition: all .3s ease-in-out; overflow: hidden; padding: 0 30px; box-sizing: border-box;  -webkit-border-radius: 25px; -moz-border-radius: 25px; border-radius: 25px;}
.sect-bxnav-dark ul li a:hover {color:#ffffff!important; transition: all .1s ease-in-out;}
.sect-bxnav-dark ul li a:visited {color:#7c7c7c;}
.sect-bxnav-dark ul li a.active {color:#ffffff!important; transition: all .3s ease-in-out; -webkit-box-shadow: inset 0px 0px 0px 2px rgba(255,255,255,1); -moz-box-shadow: inset 0px 0px 0px 2px rgba(255,255,255,1); box-shadow: inset 0px 0px 0px 2px rgba(255,255,255,1);}

.sect-bxnav-light {background: #ffffff; margin: 0; padding: 0; height: auto; -webkit-border-radius: 25px; -moz-border-radius: 25px; border-radius: 25px; -webkit-box-shadow: inset 0px 0px 0px 2px rgba(0,0,0,.15); -moz-box-shadow: inset 0px 0px 0px 2px rgba(0,0,0,.15); box-shadow: inset 0px 0px 0px 2px rgba(0,0,0,.15);}
.sect-bxnav-light ul {height: auto; list-style: none; padding: 0; margin: 0; display: flex; flex-direction: row;}
.sect-bxnav-light ul li {height: 50px; line-height: 50px; -webkit-border-radius: 25px; -moz-border-radius: 25px; border-radius: 25px; color: #7c7c7c; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1rem; text-rendering: optimizeLegibility; overflow: hidden; text-align: center; flex: 1 1 auto; display: inline-block;}
.sect-bxnav-light ul li a {width:100%; height:100%; display: block; color: #7c7c7c; text-decoration: none; transition: all .3s ease-in-out; overflow: hidden; padding: 0 30px; box-sizing: border-box;  -webkit-border-radius: 25px; -moz-border-radius: 25px; border-radius: 25px;}
.sect-bxnav-light ul li a:hover {color:#000000!important; transition: all .1s ease-in-out;}
.sect-bxnav-light ul li a:visited {color:#7c7c7c;}
.sect-bxnav-light ul li a.active {color:#000000!important; transition: all .3s ease-in-out; -webkit-box-shadow: inset 0px 0px 0px 2px rgba(0,0,0,1); -moz-box-shadow: inset 0px 0px 0px 2px rgba(0,0,0,1); box-shadow: inset 0px 0px 0px 2px rgba(0,0,0,1);}

.car-content-pad {padding: 35px 40px 35px 40px!important;}
.car-content-pad-low {padding: 35px 40px 0 40px!important;}
.car-btn-pad {padding: 0 40px 35px 40px!important;}
.car-content-pad-large {padding: 70px 60px!important;}

.col21 {width: 100%; max-width: 1320px; display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 40px; margin: 0 auto;}
.col-wrap {width: 100%; height: auto;}
.col-wrap img {-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; }

.flex-w-wrap {display: -webkit-box; display: -webkit-flex; display: flex;
	-webkit-flex-wrap: wrap;
  flex-wrap: wrap;}

.flex-r-wrap {display: -webkit-box; display: -webkit-flex; display: flex; flex-direction: row}
.flex-c-wrap {display: -webkit-box; display: -webkit-flex; display: flex; flex-direction: column}

.dark-drawing-bg {background:url("../images/products/picture-serve/homepage/drawing-dark@2x.jpg") no-repeat top center #0f0f0f; background-size:cover;}

.rating-drawing-bg {background:url("../images/products/picture-serve/homepage/ratings-bg@2x.jpg") no-repeat top center #0f0f0f; background-size: cover;}

.col-comp {width: 100%; max-width: 1319px; height: auto; border: 1px solid #f7f7f7; margin-top: 50px}
.col-comp-item {width: calc(100% / 6); height: auto; flex: 0 0 auto; border: 1px solid #f7f7f7; box-sizing: border-box; display: flex; justify-content: center;}
.comp-item-fill {display: flex; align-items: center; justify-content: center; box-sizing: border-box; padding: 2rem!important;}
.comp-item-fill img {width:100%; max-width: 260px; max-height: 100px; -o-object-fit:contain; object-fit: contain;}

.h-border-bottom {padding-bottom: 40px; border-bottom: 1px solid #efefef}

.review-flex-wrap {width: 100%; margin: 50px auto 0 auto; padding: 0; max-width: 1320px; gap:40px; display: -webkit-box; display: -webkit-flex; display: flex; padding-bottom: 50px; border-bottom: 1px dashed #efefef;}
.review-flex-item-fixed {min-width: 180px;}
.review-flex-item {width: 100%;}
.reviewTextLeftRight {text-align: left}

.rating-ring-wrap {width: 100%; max-width: 1000px; margin: 60px auto 0 auto; display:grid; grid-template-columns: repeat(3, 1fr); grid-gap: 40px;}

.rating-ring-item {padding: 40px; box-sizing: border-box; 
background: rgba(0,0,0, 0.65);
background: -moz-linear-gradient(180deg, rgba(0,0,0,0.35) 0%, rgba(0,0,0,0.35) 5%, rgba(0,0,0,1) 66%, rgba(0,0,0,1) 100%);
background: -webkit-linear-gradient(180deg, rgba(0,0,0,0.35) 0%, rgba(0,0,0,0.35) 5%, rgba(0,0,0,1) 66%, rgba(0,0,0,1) 100%);
background: linear-gradient(180deg, rgba(0,0,0,0.35) 0%, rgba(0,0,0,0.35) 5%, rgba(0,0,0,1) 66%, rgba(0,0,0,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#000000",GradientType=1);
-webkit-border-radius:25px; -moz-border-radius:25px; border-radius:25px; overflow: hidden; display: -webkit-box; display: -webkit-flex; display: flex; flex-direction: column;}

.rating-ring-container {width: 100%; max-width: 190px; height:auto; max-height: 190px; position: relative; margin: 0 auto;}

.rating-ring-container span {position: absolute; top:50%; left:50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%) scale(0); transform: translate(-50%, -50%) scale(0); font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:700; font-size:3rem; color:#ffffff;}

.circular-ring {
  display: block;
  margin: 10px auto;
  width: 100%;
	height:auto;
}

.circle-ring {
  stroke: #FF9D00;
  fill: none;
  stroke-width: 1;
  stroke-linecap: round;
}
.is-animating .circle-anim86 {animation: progress86 1s ease-out forwards; animation-delay: 1s; opacity: 0}
.is-animating .circle-anim90 {animation: progress90 1s ease-out forwards; animation-delay: 1s; opacity: 0}
.is-animating .circle-anim88 {animation: progress88 1s ease-out forwards; animation-delay: 1s; opacity: 0}

.is-animating .rating-ring-container span {animation: countOpacity 0.7s ease-out forwards; animation-delay: 1s; opacity: 0; }

.circle-ring-inside {
  stroke: rgba(255,255,255,0.1);
  fill: none;
  stroke-width: 1;
  stroke-linecap: round;
}

.col-grid-set-container	{display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 40px; margin:0 auto; width: 100%; max-width: 1320px; height:auto; grid-auto-flow: row dense;}

.col-grid-set-item	{border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; background:#ffffff; overflow:hidden; transition: all .3s cubic-bezier(0,0,.5,1); display: flex; flex-direction: column;}

.col-grid-set-item4 {grid-column: auto / span 2;}
.col-grid-set-item5 {grid-column: auto / span 1;}

.col-grid-set-inner	{width: 100%; height: auto; margin-top:40px; display: grid; grid-template-columns: repeat(1, 1fr); grid-gap: 30px;}

.col-321	{display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 40px; margin:0 auto; width: 100%; max-width: 1320px; height:auto; grid-auto-flow: row dense;}

.col-321-30	{display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 30px; margin:0 auto; width: 100%; max-width: 1320px; height:auto; grid-auto-flow: row dense;}

.col-oc	{display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 20px; margin:0 auto; width: 100%; max-width: 1000px; height:auto; grid-auto-flow: row dense;}


@keyframes countOpacity {
  0% {
	  opacity: 0;
	   transform: translate(-50%, -50%) scale(0)
  }
	100% {
	  opacity: 1;
		 transform: translate(-50%, -50%) scale(1)
  }
}

@keyframes progress86 {
  0% {
	  opacity: 1;
    stroke-dasharray: 0, 100;
  }
	100% {
	  opacity: 1;
  }
}
@keyframes progress90 {
  0% {
	  opacity: 1;
    stroke-dasharray: 0, 100;
  }
	100% {
	  opacity: 1;
  }
}
@keyframes progress88 {
  0% {
	  opacity: 1;
    stroke-dasharray: 0, 100;
  }
	100% {
	  opacity: 1;
  }
}

.col-321-item	{border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; background:#ffffff; overflow:hidden; transition: all .3s cubic-bezier(0,0,.5,1); display: flex; flex-direction: column; position: relative;}

.col-321-item .save-block {position: absolute; top: 0; right: 0; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:0.875rem; color:#ffffff; text-transform: uppercase; background:#e13636; height: 34px; padding:0 15px; line-height: 34px; -webkit-border-radius: 0 20px 0 20px; -moz-border-radius: 0 20px 0 20px; border-radius: 0 20px 0 20px}

.was-strike-red {color: #e13636; text-decoration: line-through;}

.trial-bg-img {background-image: url("../images/products/picture-serve/macdraft-pro/mdpro-trial-banner@2x.jpg"); background-repeat: no-repeat; background-size: cover; width: 100%; position: absolute; overflow: hidden; height: 700px; z-index: 0}

.trial-col21 {width: 100%; display: flex; flex-direction: row; flex-wrap: wrap; gap: 80px; align-items: flex-start;}

.trial-col21-heading {margin-top: 60px; flex: 1 0}
.trial-col21-form {position: sticky; top: 120px; margin-top: 60px; flex:0 0 auto; width: 485px}
.trial-col21-description {height: auto; flex:0 0 auto; width: 100%; display: grid; grid-template-columns: auto 485px; grid-gap: 80px;}

ul.panel-p-list {width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1.125rem; color:#121212; text-rendering: optimizeLegibility; line-height: 1.5; text-align: left; margin-top: 30px; padding-left: 0;}

ul.panel-p-list li {margin-top:15px; display: flex;}

ul.list-check li::before { list-style: none; content: "\f058"; /* FontAwesome Unicode */
  font-family: FontAwesome;
  display: inline-block;
padding-right: 15px;
color: #73A954;}

ul.list-checkpe li::before { list-style: none; content: "\f058"; /* FontAwesome Unicode */
  font-family: FontAwesome;
  display: inline-block;
padding-right: 15px;
color: #6AACA9;}

ul.list-checkdwg li::before { list-style: none; content: "\f058"; /* FontAwesome Unicode */
  font-family: FontAwesome;
  display: inline-block;
padding-right: 15px;
color: #9F24D3;}

ul.list-checkAll li::before { list-style: none; content: "\f058"; /* FontAwesome Unicode */
  font-family: FontAwesome;
  display: inline-block;
padding-right: 15px;
color: #121212;}

ol.tut-p-list {width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1.125rem; color:#121212; text-rendering: optimizeLegibility; line-height: 1.5; text-align: left; margin-top: 30px; padding-left: 0;}

ol.tut-p-list li {margin-left: 20px; margin-bottom: 20px; margin-top: 0; padding-left: 10px}

ul.tut-p-list {width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1.125rem; color:#121212; text-rendering: optimizeLegibility; line-height: 1.5; text-align: left; margin-top: 30px; padding-left: 0;}

ul.tut-p-list li {margin-left: 20px; margin-bottom: 20px; margin-top: 0; padding-left: 10px}

ol.tut-p-list-tiny {width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:0.875rem; color:#121212; text-rendering: optimizeLegibility; line-height: 1.5; text-align: left; margin-top: 30px; padding-left: 0;}

ol.tut-p-list-tiny li {margin-left: 15px; margin-bottom: 20px; margin-top: 0; padding-left: 5px}

ul.tut-p-list-tiny {width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:0.875rem; color:#121212; text-rendering: optimizeLegibility; line-height: 1.5; text-align: left; margin-top: 30px; padding-left: 0;}

ul.tut-p-list-tiny li {margin-left: 15px; margin-bottom: 20px; margin-top: 0; padding-left: 5px}

.hide-btn-wrap {display: none; gap:20px; margin-top:30px; }

.hide-wrap {display: none;}

.sub-nav-try {display: inline-block; vertical-align: middle;}

.pgroup-h1	{width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:800; font-size: clamp(1.625rem, calc(1.25rem + 3.6666vw), 4.375rem); color:#121212; padding:0; margin:0 auto 0 auto; text-rendering: optimizeLegibility; line-height: 1.2; -webkit-font-smoothing: subpixel-antialiased!important;}

.pgroup-h2	{width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:800; font-size: clamp(1.625rem, calc(1.25rem + 2.6666vw), 3.75rem); color:#121212; padding:0; margin:0 auto 0 auto; text-rendering: optimizeLegibility; line-height: 1.2; -webkit-font-smoothing: subpixel-antialiased!important;}

.pgroup-h3	{width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:800; font-size: clamp(1.625rem, calc(1.25rem + 2.6666vw), 3.125rem); color:#121212; padding:0; margin:0 auto 0 auto; text-rendering: optimizeLegibility; line-height: 1.2; -webkit-font-smoothing: subpixel-antialiased!important;}

.pgroup-h3-s	{width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:800; font-size: clamp(1.625rem, calc(1.25rem + 2.6666vw), 2.5rem); color:#121212; padding:0; margin:0 auto 0 auto; text-rendering: optimizeLegibility; line-height: 1.2; -webkit-font-smoothing: subpixel-antialiased!important;}

.pgroup-h4	{width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:800; font-size: clamp(1.625rem, calc(1.25rem + 1.6666vw), 1.875rem); color:#121212; padding:0; margin:0 auto 0 auto; text-rendering: optimizeLegibility; line-height: 1.2; -webkit-font-smoothing: subpixel-antialiased!important;}

.pgroup-h4-s	{width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:800; font-size: clamp(1.3125rem, calc(1.21rem + 0.463vw), 1.625rem); color:#121212; padding:0; margin:0 auto 0 auto; text-rendering: optimizeLegibility; line-height: 1.2; -webkit-font-smoothing: subpixel-antialiased!important;}

.pgroup-h5	{width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:800; font-size: clamp(1.25rem, calc(1.25rem + 0.6666vw), 1.375rem); color:#121212; padding:0; margin:0 auto 0 auto; text-rendering: optimizeLegibility; line-height: 1.2; -webkit-font-smoothing: subpixel-antialiased!important;}

.pgroup-h6	{width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:700; font-size: 1.25rem; color:#121212; padding:0; margin:0 auto 0 auto; text-rendering: optimizeLegibility; line-height: 1.2; -webkit-font-smoothing: subpixel-antialiased!important;}

.pgroup-p-large	{width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size: clamp(1.125rem, calc(0.75rem + 0.6666vw), 1.5rem); color:#121212; padding:0; margin:0 auto 0 auto; text-rendering: optimizeLegibility; line-height: 1.5; -webkit-font-smoothing: subpixel-antialiased!important;}

.pgroup-p	{width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1.125rem; color:#121212; margin:25px auto 0 auto; padding:0; text-rendering: optimizeLegibility; line-height: 1.5}

.pgroup-p-small	{width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1rem; color:#121212; margin:25px auto 0 auto; padding:0; text-rendering: optimizeLegibility; line-height: 1.5}

.pgroup-p-tiny	{width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:0.875rem; color:#121212; margin:25px auto 0 auto; padding:0; text-rendering: optimizeLegibility; line-height: 1.5}

.pgroup-p-sub	{width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:600; font-size:1rem; color:#121212; margin:0 auto 20px auto; padding:0; text-rendering: optimizeLegibility; line-height: 1.2; text-transform: uppercase;}

.pgroup-p-small-title	{width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1rem; color:#121212; margin:25px auto 0 auto; padding:0; text-rendering: optimizeLegibility; line-height: 1.3}

.pgroup-p-title	{width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1.125rem; color:#121212; margin:25px auto 0 auto; padding:0; text-rendering: optimizeLegibility; line-height: 1.3}

.pgroup-p-tiny-title	{width:100%; height:auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:0.875rem; color:#121212; margin:25px auto 0 auto; padding:0; text-rendering: optimizeLegibility; line-height: 1.3}

.prod-screen-block	{width: 100%; max-width: 1200px; height: auto; margin: 60px auto 60px auto; overflow: hidden; padding: 0}
.prod-screen-block img {width: 100%; height: auto}

.prod-screen-block-round	{width: 100%; max-width: 1320px; height: auto; margin: 60px auto 60px auto; overflow: hidden; padding: 0; -webkit-border-radius:10px; -moz-border-radius:10px; -o-border-radius:10px; border-radius:10px;}
.prod-screen-block-round img {width: 100%; height: auto}

.prod-btn-double {display: flex; gap:20px; margin: 40px auto 0 auto; justify-content: center;}
.prod-btn-double-p-low {display: flex; gap:20px; margin: 0; justify-content: center; padding: 0 40px 35px 40px}

.flex-grow-c {flex-grow:1; display: -webkit-box; display: -webkit-flex; display: flex;  justify-content: center; align-items: center; flex-direction: column;}
.flex-grow-nc {flex-grow:1;}

.sect-nav-wrap {width: 100%; max-width: 1320px; margin: 50px auto 50px auto; display: flex; flex-direction: row; justify-content: space-around; align-items: center;}

.col-grid-21 {display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 40px; margin:60px auto 0 auto; width: 100%; max-width: 1000px; height:auto; grid-auto-flow: row dense;}

.col-grid-321	{display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 40px; margin:60px auto 0 auto; width: 100%; max-width: 1320px; height:auto; grid-auto-flow: row dense;}

.col-grid-321-b	{display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 30px; margin:60px auto 0 auto; width: 100%; max-width: 1320px; height:auto; grid-auto-flow: row dense;}

.col-grid-321-c	{display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 30px; margin:60px auto 0 auto; width: 100%; max-width: 1320px; height:auto; grid-auto-flow: row dense;}

.col-grid-421	{display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 40px; margin:60px auto 0 auto; width: 100%; max-width: 1320px; height:auto; grid-auto-flow: row dense; overflow: hidden;}

.text-left-center {text-align: left;}

.br-20	{-webkit-border-radius:20px; -moz-border-radius:20px; -o-border-radius:20px; border-radius:20px; overflow: hidden;}

.compare-vers-wrap {width:100%; max-width: 1000px; height: auto; margin: 60px auto 0 auto; padding: 0;}
.compare-vers-row {display: -webkit-box; display: -webkit-flex; display: flex; flex-direction: row;}
.compare-vers-left {width: 40%; align-items: center;}
.compare-vers-right {display: grid; grid-template-columns: repeat(4, 1fr); width: 60%; align-items: center;}

.compare-vers-left-title {background: #E5DCE7; padding: 25px 40px; box-sizing: border-box;}
.compare-vers-right-title {background: #F7F7F7; padding: 25px 40px; box-sizing: border-box;}
.compare-vers-left-light {background: #E5DCE7; padding: 25px 40px; box-sizing: border-box;}
.compare-vers-left-dark {background: #DDD4E0; padding: 25px 40px; box-sizing: border-box;}
.compare-vers-right-light {background: #F7F7F7; padding: 25px 40px; box-sizing: border-box;}
.compare-vers-right-dark {background: #F1F1F1; padding: 25px 40px; box-sizing: border-box;}

.buy-col21	{width:100%; max-width: 1320px; margin:60px auto 0 auto; display: flex; flex-direction: row; gap:70px}
.buy-col21-left	{width: 100%; max-width: 750px}
.buy-col21-right	{width: 100%; max-width: 500px; min-width: 500px}

.buy-sticky	{position: sticky; top: 120px;}

.buy-carousel-wrap {width: 100%; height: auto; position: relative}
ul.slider-buy {margin: 0; padding: 0;}
ul.slider-buy li {height: auto; max-height: calc(100vh - 190px); background: #E4E2E5; max-width: 550px; -webkit-border-radius:10px; -moz-border-radius:10px; -o-border-radius:10px; border-radius:10px; overflow: hidden;}

.buy-controls {position: absolute; top: 50%; height: 60px; left: 0; width: 100%; transform: translateY(-50%); -webkit-transform: translateY(-50%); z-index: 50}
.buy-controls .bxPrev a {position: absolute; left: 30px; background: rgba(95,95,95,1); font-size: 24px; display: block; width: 60px; height: 60px; -webkit-border-radius:30px; -moz-border-radius:30px; -o-border-radius:30px; border-radius:30px; overflow: hidden; line-height: 60px; color: #ffffff}
.buy-controls .bxNext a {position: absolute; right: 30px; background: rgba(95,95,95,1); font-size: 24px; display: block; width: 60px; height: 60px; -webkit-border-radius:30px; -moz-border-radius:30px; -o-border-radius:30px; border-radius:30px; overflow: hidden; line-height: 60px; color: #ffffff}
.buy-controls .bxPrev a:visited {color: #ffffff}
.buy-controls .bxNext a:visited {color: #ffffff}

.buy-controls .bxPrev .disabled {display: none}
.buy-controls .bxNext .disabled {display: none}

.buy-controls {
   opacity: 0;
    transition: opacity .25s ease-in-out;
    -moz-transition: opacity .25s ease-in-out;
    -webkit-transition: opacity .25s ease-in-out;
}

.buy-carousel-wrap:hover .buy-controls {
    opacity: 1;
}
.plan-carousel-wrap:hover .buy-controls {
    opacity: 1;
}

.buy-controls .bxPrev i {border:none; padding: 0; margin: 0;}
.buy-controls .bxNext i {border:none; padding: 0; margin: 0;}

.buy-controls2 {position: absolute; top: 20px; height: 30px; right: 20px; z-index: 100; display: flex; gap:5px;}
.buy-controls2 .bxPrev a {position: relative; left: 0; background: #333333; font-size: 24px; display: block; width: 30px; height: 30px; -webkit-border-radius:15px; -moz-border-radius:15px; -o-border-radius:15px; border-radius:15px; overflow: hidden; line-height: 30px; color: #ffffff; font-size: 75%}
.buy-controls2 .bxNext a {position: relative; right: 0; background: #333333; font-size: 24px; display: block; width: 30px; height: 30px; -webkit-border-radius:15px; -moz-border-radius:15px; -o-border-radius:15px; border-radius:15px; overflow: hidden; line-height: 30px; color: #ffffff; font-size: 75%}
.buy-controls2 .bxPrev a:visited {color: #ffffff}
.buy-controls2 .bxNext a:visited {color: #ffffff}

.buy-controls2 .bxPrev .disabled {opacity:0.1; cursor: default}
.buy-controls2 .bxNext .disabled {opacity:0.1; cursor: default}

.buy-controls2 .bxPrev i {border:none; padding: 0; margin: 0;}
.buy-controls2 .bxNext i {border:none; padding: 0; margin: 0;}

.wm-badge {font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:700; font-size:0.875rem; color:#121212; height: 34px; line-height: 34px; padding: 0 15px; -webkit-border-radius: 17px; -moz-border-radius: 17px; -o-border-radius: 17px; border-radius: 17px; position: absolute; top: 20px; left: 20px; background: #ffffff; text-transform: uppercase;}

.bu-badge {font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:700; font-size:0.875rem; color:#121212; height: 34px; line-height: 34px; padding: 0 15px; -webkit-border-radius: 17px; -moz-border-radius: 17px; -o-border-radius: 17px; border-radius: 17px; position: absolute; top: 20px; right: 20px; background: #ffce00; text-transform: uppercase;}

.wm-nav-wrap {width: 100%; max-width: 1320px; margin: 0 auto 50px auto; display: flex; flex-direction: row; justify-content: space-between; align-items: center}

.wmnav-label-tiny {display: inline-block}

.compare-scroll-snap-position-container	{width: 100%; position:relative; overflow: hidden; height:auto;}
.compare-scroll-snap-main-wrapper	{position: relative; overflow-x: scroll; padding-bottom: 0; /*scroll-behavior: smooth;*/ -ms-overflow-style:none; scrollbar-width:none;}

.compare-scroll-snap-main-wrapper::-webkit-scrollbar	{display:none}
.compare-flex-slide-scroll-snap-container	{width:100%; vertical-align: top; display: inline-flex; gap:30px }
.compare-flex-slider-scroll-wrapper	{display: flex; padding: 0; flex-shrink: none; scroll-snap-align: start; scroll-snap-stop: normal;}

.compare-scroll-snap-position-container:hover #scroll-left-button	{opacity: 1; -webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1);}
.compare-scroll-snap-position-container:hover #scroll-right-button	{opacity: 1; -webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1);}

#scroll-left-button:hover, #scroll-right-button:hover	{background: rgba(96,96,96,0.75); transition: all .3s cubic-bezier(0,0,.5,1);}
#scroll-left-button i, #scroll-right-button i	{border: none; padding: 0; margin: 0; line-height: 60px; font-size: 21px;}

.compare-mask-scroll-stopper	{width: 100%; height: 100%; position: absolute; top: 0; left:0; right: 0; bottom: 0; background: none; display: none}

.compare-scroll-prod-wrapper	{width:420px; max-width:420px; overflow:visible; height:auto; 
	-webkit-transform: translateX(calc(max(1024px, 100vw)/2 - 660px)); 
	-moz-transform: translateX(calc(max(1024px, 100vw)/2 - 660px));
	transform: translateX(calc(max(1024px, 100vw)/2 - 660px)); 
	transition: all .3s cubic-bezier(0,0,.5,1); display: flex; flex-direction: column;}

.compare-scroll-snap-position-container #scroll-left-button {width: 60px; height: 60px; line-height: 60px; color: #ffffff; position: absolute; left: 30px; top: calc(50% - 30px); background: rgba(0,0,0,0.4); transition: transform 0.5s ease-in, opacity 0.7s cubic-bezier(0.15, 0, 0.2, 1) 0.1s; opacity: 0; cursor: pointer; border-radius:35px; -webkit-border-radius:35px; -moz-border-radius:35px; -webkit-transform: scale(0.75); -moz-transform: scale(0.75); transform: scale(0.75);}
	.compare-scroll-snap-position-container #scroll-right-button {width: 60px; height: 60px; line-height: 60px; color: #ffffff; position: absolute; right: 30px; top: calc(50% - 30px); background: rgba(0,0,0,0.4); transition: transform 0.5s ease-in, opacity 0.7s cubic-bezier(0.15, 0, 0.2, 1) 0.1s; opacity: 0; cursor: pointer; border-radius:35px; -webkit-border-radius:35px; -moz-border-radius:35px; -webkit-transform: scale(0.75); -moz-transform: scale(0.75); transform: scale(0.75);}

.compare-p-scroll	{width:100%; height:auto; overflow:auto; display:flex; flex: 1 1 auto;}
.opacity-feat p {opacity: 0.1}
.rounded10 {-webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; border-radius: 10px; overflow: hidden; position: relative;}

/* COOKI BOT - START */
#CybotCookiebotDialog {font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif!important;}

#CookiebotWidget {font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif!important;}

#CookiebotWidget #CookiebotWidget-buttons button {-webkit-border-radius:8px!important; -moz-border-radius:8px!important; -o-border-radius:8px!important; border-radius:8px!important;}

#CybotCookiebotDialogFooter .CybotCookiebotDialogBodyButton {-webkit-border-radius:8px!important; -moz-border-radius:8px!important; -o-border-radius:8px!important; border-radius:8px!important;}

/* COOKI BOT - END */

.img-bor-inset-overlay {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}

.tut-scroll-snap-position-container	{width: 100%; position:relative; overflow: hidden; height:auto;}
.tut-scroll-snap-main-wrapper	{position: relative; overflow-x: scroll; padding-bottom: 0; /*scroll-behavior: smooth;*/ -ms-overflow-style:none; scrollbar-width:none;}

.tut-scroll-snap-main-wrapper::-webkit-scrollbar	{display:none}
.tut-flex-slide-scroll-snap-container	{vertical-align: top; display: inline-flex; gap:10px }
.tut-flex-slider-scroll-wrapper	{display: flex; padding: 0; flex-shrink: 0; scroll-snap-align: start; scroll-snap-stop: normal;}

#scroll-left-button3	{width: 30px; height: 50px; line-height: 50px; color: #121212; position: absolute; left: 0; top: 0; background: #f5f5f7; opacity: 1; cursor: pointer; text-align: left;}

#scroll-right-button3	{width: 30px; height: 50px; line-height: 50px; color: #121212; position: absolute; right: 0; top: 0; background: #f5f5f7; opacity: 1; cursor: pointer; text-align: right;}

.tut-scroll-snap-position-container:hover #scroll-left-button3	{opacity: 1; -webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1);}
.tut-scroll-snap-position-container:hover #scroll-right-button3	{opacity: 1; -webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1);}

#scroll-left-button3 i, #scroll-right-button3 i	{border: none; padding: 0; margin: 0; line-height: 50px; font-size: 1.125rem;}

.tut-mask-scroll-stopper	{width: 100%; height: 100%; position: absolute; top: 0; left:0; right: 0; bottom: 0; background: none; display: none}

.tut-scroll-prod-wrapper	{display: inline-flex;}

.topic-list-radio-label {
	background: #ffffff; margin: 0; padding: 0; height: 50px; line-height: 50px; -webkit-border-radius: 25px; -moz-border-radius: 25px; border-radius: 25px; -webkit-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,.1); -moz-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,.1); box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,.1); font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight: 500; font-size: 1rem; color: #121212; flex: 0 0 auto; padding: 0; margin: 0; transition: all 0.3s ease-in-out; cursor: pointer; user-select: none; display: block;
}

.tut-scroll-prod-wrapper input[type='radio'] {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

.tut-scroll-prod-wrapper input[type='radio']:checked + .topic-list-radio-label {
  background: #1E76E3;
	-webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none;
	color: #ffffff;
}


.drop-down-wrap {position: relative; display: inline-block; width: auto;}

.filter-list	{height: 30px; box-sizing: border-box; padding: 0 0 0 15px; position: relative; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1rem; color:#121212; text-rendering: optimizeLegibility; line-height: 30px; cursor: pointer; transition: color 0.3s ease-in-out; display: inline-block; user-select: none;}

.filter-list:hover	{color: #1E76E3;}

.filter-list-f	{height: auto; box-sizing: border-box; padding: 0 25px; position: relative; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1rem; color:#121212; text-rendering: optimizeLegibility; line-height: 60px; cursor: pointer; transition: all 0.2s ease-in-out; display: flex; user-select: none; -webkit-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.15);
-moz-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.15);
box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.15); -webkit-border-radius:10px; -moz-border-radius:10px; border-radius: 10px; background: #ffffff; width: 100%; flex-direction:row; align-items: center;}

.filter-list-f:hover	{color: #1E76E3; -webkit-box-shadow: inset 0px 0px 0px 2px #1E76E3;
-moz-box-shadow: inset 0px 0px 0px 2px #1E76E3;
box-shadow: inset 0px 0px 0px 2px #1E76E3;}

.filter-list-fsort	{height: auto; box-sizing: border-box; padding: 0 25px; position: relative; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1rem; color:#121212; text-rendering: optimizeLegibility; line-height: 60px; cursor: pointer; transition: all 0.2s ease-in-out; display: inline-block; user-select: none; -webkit-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.15);
-moz-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.15);
box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.15); -webkit-border-radius:10px; -moz-border-radius:10px; border-radius: 10px; background: #ffffff; width: 100%;}

.filter-list-fsort:hover	{color: #1E76E3; -webkit-box-shadow: inset 0px 0px 0px 2px #1E76E3;
-moz-box-shadow: inset 0px 0px 0px 2px #1E76E3;
box-shadow: inset 0px 0px 0px 2px #1E76E3;}

.chevron-list {transition: transform 0.5s;}

.filter-sublist {width: 200px; position: absolute; top: 35px; left: 0; z-index: 500000; background: #ffffff; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; -webkit-box-shadow: 0px 1px 4px rgba(0,0,0,0.15);
-moz-box-shadow: 0px 1px 4px rgba(0,0,0,0.15);
box-shadow: 0px 1px 4px rgba(0,0,0,0.15);
border: 1px solid #cacaca; box-sizing: border-box; padding: 5px 0; display: none;}

.filter-sublist-f {width: 200px; position: absolute; top: 68px; left: 0; z-index: 500000; background: #ffffff; -webkit-border-radius: 5px; -moz-border-radius: 10px; -o-border-radius: 10px; border-radius: 10px; -webkit-box-shadow: 0px 1px 4px rgba(0,0,0,0.2), 0px 0px 0px 1px rgba(0,0,0,0.1);
-moz-box-shadow: 0px 1px 4px rgba(0,0,0,0.2), 0px 0px 0px 1px rgba(0,0,0,0.1);
box-shadow: 0px 1px 4px rgba(0,0,0,0.2), 0px 0px 0px 1px rgba(0,0,0,0.1); box-sizing: border-box; padding: 5px 0; display: none; overflow: hidden; max-height: 340px; overflow-y: scroll;}

.filter-sublist-fsort {width: 200px; position: absolute; top: 68px; left: 0; z-index: 500000; background: #ffffff; -webkit-border-radius: 5px; -moz-border-radius: 10px; -o-border-radius: 10px; border-radius: 10px; -webkit-box-shadow: 0px 1px 4px rgba(0,0,0,0.2), 0px 0px 0px 1px rgba(0,0,0,0.1);
-moz-box-shadow: 0px 1px 4px rgba(0,0,0,0.2), 0px 0px 0px 1px rgba(0,0,0,0.1);
box-shadow: 0px 1px 4px rgba(0,0,0,0.2), 0px 0px 0px 1px rgba(0,0,0,0.1); box-sizing: border-box; padding: 5px 0; display: none; overflow: hidden; max-height: 270px; overflow-y: scroll;}


.filter-list-radio-label {
  display: block;
  position: relative;
  padding: 0 40px 0 15px;
  margin:0;
	height: 36px; 
	line-height: 36px;
  cursor: pointer;
  font-size: 0.9375rem;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
	text-align: left;
	width: 100%;
	box-sizing: border-box;
	font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif;
	font-weight:500;
	color:#121212;
}

/* Hide the browser's default checkbox */
.filter-inner-choice input[type='radio'] {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

.filter-inner-choice input[type='radio']:checked + .filter-list-radio-label {
  background: #f7f7f7;
}

.filter-list-radio-label:hover {background: #f7f7f7;}

.filter-list-radio-label:after {
	
	content: '\2713';
  position: absolute;
	display: none;
	width: 36px;
	height: 36px;
	top: 50%;
	right: 15px;
	-webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); transform:translateY(-50%);
	font-family: "SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif;
	font-weight: 700;
	text-align: right;
	color: #1E76E3;
}


/* Show the checkmark when checked */
.filter-inner-choice input[type='radio']:checked + .filter-list-radio-label:after {
  display: block;
}

.filter-f-list-radio-label {
  display: block;
  position: relative;
  padding: 10px 15px 10px 42px;
  margin:0;
	height: auto; 
	line-height: 1.2;
  cursor: pointer;
  font-size: 1rem;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
	text-align: left;
	width: 100%;
	box-sizing: border-box;
	font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif;
	font-weight:500;
	color:#121212;
}

/* Hide the browser's default checkbox */
.filter-f-inner-choice input[type='checkbox'] {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

.filter-f-inner-choice input[type='checkbox']:checked + .filter-f-list-radio-label {
  background: #ffffff;
}

.filter-f-list-radio-label:hover {background: #f7f7f7!important;}

.filter-f-list-radio-label:before {
	
	content: '';
  position: absolute;
	width: 16px;
	height: 16px;
	top: 11px;
	left: 15px;
	-webkit-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.2);
	-moz-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.2);
	box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.2);
	-webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;
	text-align: right;
	background: #ffffff;
	display: flex;
	align-items: center;
	justify-content: center;
}


/* Show the checkmark when checked */
.filter-f-inner-choice input[type='checkbox']:checked + .filter-f-list-radio-label:before {
	content: '\2713';
	font-family: "SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif;
	font-weight: 700;
	text-align: center;
	color: #ffffff;
	background: #1E76E3;
	font-size: 0.8rem;
}


.filter-tut-menus {margin: 30px 0 60px 0; display: inline-flex; gap:20px; align-items: center}
.filter-tut-wrap {display: inline-flex; align-items: center;}
.filter-f-wrap {display: inline-flex; align-items: center; gap:15px}

.sort-divide {width: 1px; margin: 0 10px; height: 30px; background: #cccccc;}

.is-hidden-filter {
display: none!important;
}

ul.all-prod-filter-wrapper {width: 100%; max-width: 1320px; margin: 70px auto 0 auto; display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 30px; grid-row-gap: 30px; padding: 0; list-style: none;}

ul.all-prod-filter-wrapper li {background:#ffffff; overflow:hidden; -webkit-border-radius:12px; -moz-border-radius:12px; border-radius: 12px; display: flex; flex-direction: column; transition: all 0.3s ease-in-out; }

.border-inset-overlay {position: absolute; top: 0; left: 0; right: 0; bottom: 0; -webkit-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.1);
-moz-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.1);
box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.1); -webkit-border-radius:12px; -moz-border-radius:12px; border-radius: 12px; transition: all 0.3s ease-in-out;}

.border-inset-overlay-20 {
	position: absolute;
	top: 0;
	left: 1px;
	right: 0;
	bottom: 0;
	-webkit-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.20);
	-moz-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.20);
	box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.20);
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
	transition: all 0.3s ease-in-out;
}

ul.all-prod-filter-wrapper li:hover .border-inset-overlay {-webkit-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
-moz-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);}

ul.all-prod-filter-wrapper li:hover .border-inset-overlay-20 {-webkit-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
-moz-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);}

ul.all-prod-filter-wrapper li a {width: 100%; height: 100%; display: flex; text-decoration: none!important;}

ul.all-prod-filter-wrapper li img {transition: all 0.3s ease-in-out;}
ul.all-prod-filter-wrapper li:hover img {transform: scale(1.06)}

ul.filter-ul-wrap-4321 {width: 100%; max-width: 1500px; margin: 70px auto 0 auto; display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 20px; padding: 0; list-style: none; }

ul.filter-ul-wrap-4321 li {background:#ffffff; overflow:hidden; -webkit-border-radius:12px; -moz-border-radius:12px; border-radius: 12px; display: flex; flex-direction: column; transition: all 0.3s ease-in-out; }

ul.filter-ul-wrap-4321 li:hover .border-inset-overlay-20 {-webkit-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
-moz-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);}

ul.filter-ul-wrap-4321 li a {width: 100%; height: 100%; display: flex; text-decoration: none!important; }

ul.filter-ul-wrap-4321 li img {transition: all 0.3s ease-in-out;}
ul.filter-ul-wrap-4321 li:hover img {transform: scale(1.06)}

.clearfilter {display: inline-block; height: 30px;line-height: 30px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; background: #dedede; padding: 0 10px; font-family: "SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight: 500; user-select: none; font-size:1rem; cursor: pointer; }

.clearfilter:hover {background:#cccccc;}

.filterandsort { height: 30px;line-height: 30px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; background: #f5f5f7; padding: 0 10px; font-family: "SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight: 500; user-select: none; font-size:1.125rem; cursor: pointer; display: none; }

.filterandsort:hover {color: #1E76E3;}

.filterTutCount {display: inline-block; height: 30px;line-height: 30px;padding: 0 10px 0 30px; font-family: "SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight: 500; user-select: none; font-size:1rem; border-left: 1px solid #cccccc; margin-left: 10px;}

.filterPlanCount {display: inline-block; height: 60px;line-height: 60px;padding: 0; font-family: "SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight: 500; user-select: none; font-size:1rem; margin-left: 10px;}

#topicFilter {display: none;}

.time-badge {font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:700; font-size:0.875rem; color:#ffffff; height: 34px; line-height: 34px; padding: 0 15px; -webkit-border-radius: 17px; -moz-border-radius: 17px; -o-border-radius: 17px; border-radius: 17px; position: absolute; bottom: 20px; right: 20px; background: rgba(209,43,120,0.9);}

.time-badge-tiny {font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:700; font-size:0.75rem; color:#ffffff; height: 24px; line-height: 24px; padding: 0 10px; -webkit-border-radius: 12px; -moz-border-radius: 12px; -o-border-radius: 12px; border-radius: 12px; position: absolute; bottom: 10px; right: 10px; background: rgba(209,43,120,0.9);}

.cost-badge {font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:700; font-size:0.75rem; color:#ffffff; height: 30px; line-height: 30px; padding: 0 15px; -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; border-radius: 15px; position: absolute; top: 18px; right: 18px; background: rgba(0,0,0,0.8); backdrop-filter: saturate(180%) blur(20px); -webkit-backdrop-filter: saturate(180%) blur(20px);}

.plan-badge {font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:700; font-size:0.75rem; height: 30px; line-height: 30px; padding: 0 15px; -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; border-radius: 15px; position: absolute; top: 18px; left: 18px;}

.house-set {color: #121212; background: #FFCE00;}
.barn-set {color: #ffffff; background: #BC02BC;}
.inlaw-set {color: #ffffff; background: #1FA4D5;}
.multi-set {color: #121212; background: #9AC11A;}
.garage-set {color: #ffffff; background: #DB3B72;}


.rounded20 {-webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; overflow: hidden; position: relative;}

.rounded5 {-webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; overflow: hidden; position: relative;}

.col-bor-inset-image::after {content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; -webkit-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.1);
-moz-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.1);
box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.1); -webkit-border-radius: inherit; -moz-border-radius: inherit; border-radius: inherit; }

.col-bor-inset-plan::after {content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; -webkit-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.2);
-moz-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.2);
box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.2); -webkit-border-radius: inherit; -moz-border-radius: inherit; border-radius: inherit; }

.dl-btn {-webkit-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.1);
-moz-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.1);
box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.1); -webkit-border-radius: 12px; -moz-border-radius: 12px; -o-border-radius: 12px; border-radius: 12px; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:600; font-size:1.125rem; color:#121212; line-height: 1.2; height: auto; display: inline-flex; text-align: left; background: #f5f5f7; transition: background 0.2s ease-in-out}

.dl-btn:hover {background: #e5e5e5}

.dl-btn a {display: inline-flex; width: 100%; height: 100%; text-decoration:none!important; color: #121212; padding: 20px 25px; align-items: center; }
.dl-btn a .dl-link {color: #1E76E3!important;}
.dl-btn a:visited {color:#121212!important; text-decoration:none!important;}

.sp-wrap {position: relative; width: 100%; max-width: 760px; margin: 50px auto;}

.sp-wrap::before {content: ""; position: absolute; left: 20px; top: 18px; background-image: url("../images/products/picture-serve/plans/search-icon25x25@2x.png"); background-size: 25px 25px; background-repeat: no-repeat; width: 25px; height: 25px; }

input.search-plan {width: 100%; height: 60px; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1rem; color:#121212; outline: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: none; padding: 0 20px 0 55px; box-sizing: border-box; -webkit-box-shadow: 0px 0px 0px 1px rgba(0,0,0,0.1);
-moz-box-shadow: 0px 0px 0px 1px rgba(0,0,0,0.1);
box-shadow: 0px 0px 0px 1px rgba(0,0,0,0.1); -webkit-border-radius: 12px; -moz-border-radius: 12px; -o-border-radius: 12px; border-radius: 12px;}

input.search-plan::placeholder {
  color: #ADADAD;
  opacity: 1; /* Firefox */
}

input.search-plan::-ms-input-placeholder { /* Edge 12 -18 */
  color: #ADADAD;
}

.clearable {position: absolute; right: 0; top: 0; background: url("../images/products/picture-serve/plans/search-clear20x20@2x.png") no-repeat right -30px center; background-size: 20px 20px; width: 60px; height: 60px; transition: background 0.2s}

.clearable.x {background-position: center; cursor: pointer}

ul#my-search-list 	{height:auto; list-style:none;  margin:0; width: 100%; background: #ffffff; padding: 0 20px 20px 20px; box-sizing: border-box; overflow: hidden; position: absolute; top: 68px; z-index: 50000; -webkit-box-shadow: 0px 1px 4px rgba(0,0,0,0.2), 0px 0px 0px 1px rgba(0,0,0,0.1);
-moz-box-shadow: 0px 1px 4px rgba(0,0,0,0.2), 0px 0px 0px 1px rgba(0,0,0,0.1);
box-shadow: 0px 1px 4px rgba(0,0,0,0.2), 0px 0px 0px 1px rgba(0,0,0,0.1); -webkit-border-radius: 12px; -moz-border-radius: 12px; -o-border-radius: 12px; border-radius: 12px; max-height: 280px; overflow-y: scroll;}
ul#my-search-list li	{height:auto; line-height:17px; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:400; font-size:11px; color:#999999; box-sizing:border-box;  padding:0; display:none; text-align:left; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; border-radius: 10px; overflow: hidden;}
ul#my-search-list li a	{text-decoration:none; height:100%; width: 100%; display: block; color:#121212; text-align:left; font-weight:500; padding:10px 15px; display: flex; justify-content: space-between; gap:30px; box-sizing: border-box; align-items: center; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; border-radius: 10px;}
ul#my-search-list li a, ul#my-search-list li a .blclick	{transition: all 0.3s}
ul#my-search-list li:hover a	{background-color: #F0F6FD; -webkit-box-shadow: inset 0px 0px 0px 2px #1E76E3;
-moz-box-shadow: inset 0px 0px 0px 2px #1E76E3;
box-shadow: inset 0px 0px 0px 2px #1E76E3; }
ul#my-search-list li a:visited	{color:#121212; text-decoration:none;}

.p-filter {width: 100%; display: flex; flex-direction: row; justify-content: space-between;}
.pl-filter {display: inline-flex; align-items: center; gap: 15px; flex-wrap: wrap;}
.pl-filter-prompt {display: flex; align-items: center; gap: 10px; flex-wrap: wrap;}
.filterprompt {display: inline-block; height: 28px; line-height: 28px; padding: 0 10px; background: #cccccc;  -webkit-border-radius: 14px; -moz-border-radius: 14px; -o-border-radius: 14px; border-radius: 14px; cursor: pointer; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:0.875rem; color:#121212; text-rendering: optimizeLegibility; transition: opacity 0.2s; display: none; user-select: none}

.filterprompt:hover {opacity: 0.8;}

.clear-filter-btn {display: inline-block; height: 28px; line-height: 28px; padding: 0 10px; background: #ffffff; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; cursor: pointer; margin: 0; -webkit-box-shadow: 0px 0px 0px 1px rgba(0,0,0,0.1);
-moz-box-shadow: 0px 0px 0px 1px rgba(0,0,0,0.1);
box-shadow: 0px 0px 0px 1px rgba(0,0,0,0.1); font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:0.875rem; color:#121212; text-rendering: optimizeLegibility; transition: all 0.2s; user-select: none}

.clear-filter-btn:hover {-webkit-box-shadow: 0px 0px 0px 2px #1E76E3;
-moz-box-shadow: 0px 0px 0px 2px #1E76E3;
box-shadow: 0px 0px 0px 2px #1E76E3; color: #1E76E3}

.count-c {padding: 0 10px; border-radius:15px; display: inline; margin-left: 5px; font-size: 0.875rem; font-weight: bold; line-height: 28px;}

.open-filter-btn {height: 60px; line-height: 60px; padding: 0 25px; background: #ffffff; -webkit-border-radius: 12px; -moz-border-radius: 12px; -o-border-radius: 12px; border-radius: 12px; cursor: pointer; margin: 0; -webkit-box-shadow: 0px 0px 0px 1px rgba(0,0,0,0.1);
-moz-box-shadow: 0px 0px 0px 1px rgba(0,0,0,0.1);
box-shadow: 0px 0px 0px 1px rgba(0,0,0,0.1); font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1rem; color:#121212; text-rendering: optimizeLegibility; transition: all 0.2s; user-select: none; display: none; justify-content: space-between; box-sizing: border-box;}

.open-filter-btn:hover {-webkit-box-shadow: 0px 0px 0px 2px #1E76E3;
-moz-box-shadow: 0px 0px 0px 2px #1E76E3;
box-shadow: 0px 0px 0px 2px #1E76E3; color: #1E76E3}

.sort-menus {width: auto}

.main-filter {display: inline-flex; align-items: center; gap: 15px; flex-wrap: wrap;}

#totalFilterSelected	{background: #dedede; padding: 0 10px; -webkit-border-radius:14px; -moz-border-radius:14px; border-radius: 14px; font-size: 0.875rem; color:#000000!important; margin: 0; display: none; line-height: 28px; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500;}

.filter-selected-icon	{text-align: right; display: flex; flex-direction: row; justify-content: flex-end; align-items: center;}

.filter-resp-wrap {display: block;}
#filter-apply-btn {display: none;}

.plan-col-321 {display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 20px; margin:0 auto; width: 100%; max-width: 1320px; height:auto; grid-auto-flow: row dense; overflow: hidden;}

.plan-col-321 div {-webkit-box-shadow: 0px 0px 0px 1px #dedede;
-moz-box-shadow: 0px 0px 0px 1px #dedede;
box-shadow: 0px 0px 0px 1px #dedede;}

.sc-wrap {position: sticky; top: 0; width: 100%; background: rgba(255, 255, 255, 1); }

.plan-pricing-flex-wrap {width: 100%; display: flex; flex-direction: row; gap:70px; align-items: flex-start}

.plan-pricing-sticky {width: 100%; height: auto; position: sticky; top: 60px; box-sizing: border-box; height: calc(100vh - 120px); display: flex; flex-direction: column}

.plan-pricing-inner {height: auto; overflow: hidden; overflow-y: scroll; background: #f5f5f7; box-sizing: border-box;}

.delivery-pay {-webkit-box-shadow: 0px 0px 0px 1px #dedede;
-moz-box-shadow: 0px 0px 0px 1px #dedede;
box-shadow: 0px 0px 0px 1px #dedede; margin: 0!important; width: auto!important; padding: 3px 15px}

.plan-col-21	{display: inline-flex; margin:0; height:auto; overflow: hidden; gap:1px}

.filter-plan-list-radio-label {
  display: block;
  position: relative;
  padding: 20px 25px 20px 50px;
  margin:0;
	height: auto; 
	line-height: 1.2;
  cursor: pointer;
  font-size: 1.125rem;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
	text-align: left;
	width: 100%;
	box-sizing: border-box;
	font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif;
	font-weight:500;
	color:#121212;
	background: #ffffff;
	border-radius:12px; -webkit-border-radius:12px; -moz-border-radius:12px; -webkit-box-shadow: 0px 0px 0px 1px rgba(204,204,204,1);
-moz-box-shadow: 0px 0px 0px 1px rgba(204,204,204,1);
box-shadow: 0px 0px 0px 1px rgba(204,204,204,1);
}

/* Hide the browser's default checkbox */
.filter-plan-inner-choice input[type='checkbox'] {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

.filter-plan-inner-choice input[type='checkbox']:checked + .filter-plan-list-radio-label {
  background: #ffffff;
}

.filter-plan-list-radio-label:hover {-webkit-box-shadow: 0px 0px 0px 2px rgba(30,118,227,1);
-moz-box-shadow: 0px 0px 0px 2px rgba(30,118,227,1);
box-shadow: 0px 0px 0px 2px rgba(30,118,227,1);}

.filter-plan-list-radio-label:before {
	
	content: '';
  position: absolute;
	width: 16px;
	height: 16px;
	top: 50%;
	transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%);
	left: 20px;
	-webkit-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.2);
	-moz-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.2);
	box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.2);
	-webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;
	text-align: right;
	background: #ffffff;
	display: flex;
	align-items: center;
	justify-content: center;
}


/* Show the checkmark when checked */
.filter-plan-inner-choice input[type='checkbox']:checked + .filter-plan-list-radio-label:before {
	content: '\2713';
	font-family: "SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif;
	font-weight: 700;
	text-align: center;
	color: #ffffff;
	background: #1E76E3;
	font-size: 0.8rem;
}

.license-list-sel {margin-bottom: 10px}


.license-list-sel input[type='radio'] {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

.license-list-sel input[type='radio']:checked + .license-list-radio-label {
  background: #E8F3FF;
	-webkit-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
	-moz-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
	box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);
}

.license-list-sel input[type='radio']:checked + .license-list-radio-label:before {
	content: '';
	-webkit-box-shadow: inset 0px 0px 0px 5px rgba(30,118,227,1);
	-moz-box-shadow: inset 0px 0px 0px 5px rgba(30,118,227,1);
	box-shadow: inset 0px 0px 0px 5px rgba(30,118,227,1);
}

.license-list-radio-label {
  display: flex;
	flex-direction: row;
	align-items: center;
  position: relative;
  padding: 15px 25px 15px 50px;
  margin:0;
	height: auto; 
	line-height: 1.2;
  cursor: pointer;
  font-size: 1.125rem;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
	text-align: left;
	width: 100%;
	box-sizing: border-box;
	font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif;
	font-weight:500;
	color:#121212;
	background: #ffffff;
	border-radius:12px; -webkit-border-radius:12px; -moz-border-radius:12px; -webkit-box-shadow: 0px 0px 0px 1px rgba(204,204,204,1);
-moz-box-shadow: 0px 0px 0px 1px rgba(204,204,204,1);
box-shadow: 0px 0px 0px 1px rgba(204,204,204,1);
	text-rendering: optimizeLegibility;
}

.license-list-radio-label:hover {-webkit-box-shadow: 0px 0px 0px 2px rgba(30,118,227,1);
-moz-box-shadow: 0px 0px 0px 2px rgba(30,118,227,1);
box-shadow: 0px 0px 0px 2px rgba(30,118,227,1);}

.license-list-radio-label:before {
	
	content: '';
  position: absolute;
	width: 16px;
	height: 16px;
	top: 50%;
	transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%);
	left: 20px;
	-webkit-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.2);
	-moz-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.2);
	box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.2);
	-webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px;
	text-align: right;
	background: #ffffff;
	display: flex;
	align-items: center;
	justify-content: center;
}

.plan-feature-wrap {-webkit-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.2);
	-moz-box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.2);
	box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.2);
	-webkit-border-radius: 14px; -moz-border-radius: 14px; border-radius: 14px; background: #ffffff; width: 100%; height: auto; padding: 0; box-sizing: border-box; margin-top: 40px;}

.plan-feature-grid-wrap {display: grid; grid-template-columns: repeat(5,1fr); grid-gap: 1px; overflow: hidden;}

.plan-feature-grid-wrap .plan-feature-item {-webkit-box-shadow: 0px 0px 0px 1px #dedede;
-moz-box-shadow: 0px 0px 0px 1px #dedede;
box-shadow: 0px 0px 0px 1px #dedede; padding: 30px 0}

.plan-feature-grid-wrap .plan-feature-item img {height: 50px; width: auto;}

.flex-plan-buy {width: 500px; max-width: 500px; flex: 0 0 auto; transition: all 0.2s}

.plan-carousel-wrap {width: 100%;  max-height: calc(100vh - 325px); height: auto; position: relative; overflow: hidden; -webkit-border-radius:10px; -moz-border-radius:10px; -o-border-radius:10px; border-radius:10px; overflow: hidden; width: 100%; -webkit-box-shadow: 0px 0px 0px 1px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 0px 0px 1px rgba(0,0,0,0.2);
box-shadow: 0px 0px 0px 1px rgba(0,0,0,0.2);}
ul.slider-plan {margin: 0; padding: 0; width: 100%}
ul.slider-plan li {height: auto; max-height: calc(100vh - 325px); background: #E4E2E5; -webkit-border-radius:10px; -moz-border-radius:10px; -o-border-radius:10px; border-radius:10px; overflow: hidden; width: 100%;}

.preorder-pager-container {width: 90px; display: flex; justify-content: space-between; position: absolute; top: 0; right: 30px}

.preorderslickprevStyle, .preorderslicknextStyle	{width:40px; height:40px; background:#121212; border-radius:20px; -moz-border-radius:20px; -webkit-border-radius:20px; line-height:40px; text-align:center; font-size:1rem; color:#ffffff; padding:0; font-family: "SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight: bold}
.preorderslickprevStyle:hover, .preorderslicknextStyle:hover	{opacity:0.8}
.preorderslickprevStyle i, .preorderslicknextStyle i {border:none; line-height:40px; padding:0; color:#ffffff; text-decoration:none}
.preorderslickprevStyle a	{width:100%; line-height:40px; display:block; text-decoration:none; color:#ffffff;}
.preorderslicknextStyle a	{width:100%; line-height:40px; display:block; text-decoration:none; color:#ffffff;}


.preorderslickprevStyle.slick-disabled, .preorderslicknextStyle.slick-disabled {
    opacity: 0.2;
    pointer-events:none;
}

.recommended-tab {margin: 0; line-height: 20px; background: #FFCE00; text-align: center; height: auto; border-radius: 15px; -webkit-border-radius: 15px; -moz-border-radius: 15px; padding: 5px 10px; width: auto; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:0.875rem; color:#121212; text-rendering: optimizeLegibility; display: inline-flex; text-align: left; flex-direction: row; align-items: center}

ul#toc-tut {width: 100%; height: auto; padding: 0;}
ul#toc-tut li {width: 100%; height: auto; line-height: 20px; border-bottom: 1px solid #e5e5e5; font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif; font-weight:500; font-size:1.125rem; color:#121212; text-rendering: optimizeLegibility; box-sizing: border-box; list-style: none; text-align: left; padding: 20px 0 20px 28px; position: relative; cursor: pointer;}
ul#toc-tut li:last-child {border-bottom:none;}
ul#toc-tut li a {color:#121212; text-decoration: none;}
ul#toc-tut li.openable::before {content: ""; position: absolute; display: block; top: 26px; left: 20px; width: 8px; height: 8px; background-position: 0 0; background-repeat: no-repeat; transition: 130ms ease-in-out; transform: translateX(-100%) rotate(0); background-image: url("../images/products/picture-serve/tutorials/disclosure@2x.png"); background-size: 8px 8px}
ul#toc-tut li.openable.open::before {transform:translateX(-100%) rotate(90deg);}
ul#toc-tut li ul {display:block; overflow: hidden; max-height: 0; height: auto; opacity: 0; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; padding:0;}
ul#toc-tut li ul li {width: 100%; height: auto; font-size:1rem; padding: 10px 0 0 28px; border: none; line-height: 18px}
ul#toc-tut li ul li:first-child {padding-top: 20px}
ul#toc-tut li ul li:last-child {padding-bottom: 10px}
ul#toc-tut li a:hover {color:#1E76E3!important}
ul#toc-tut li span:hover {color:#1E76E3!important}
ul#toc-tut li.open > ul {max-height: 2000px; height: auto; opacity: 1; padding: 0;}
ul#toc-tut li a.activeTut {color:#1E76E3!important;}
ul#toc-tut li a:visited {color:#121212}
ul#toc-tut li a.activeTut:after {font-family: "Font Awesome 6 Free"; content: "\f00c"; display: inline-block; font-weight: 900; position: absolute; right: 10px; line-height: 20px;}

.delay-bg	{width: 100%; height: 100vh; position: fixed; top: 0; left: 0; z-index: 998000; cursor: pointer; background-color: rgba(22, 22, 22, 0.8); overflow:auto; padding: 63px 40px; box-sizing: border-box; backdrop-filter: saturate(180%) blur(20px); -webkit-backdrop-filter: saturate(180%) blur(20px);}

.delay-panel {width: 100%; max-width: 200px; padding: 40px; box-sizing: border-box; background: #ffffff; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px;}

.employee-btn a {display: block; width: 100%; height: 100%; box-sizing: border-box;}

.employee-btn a .col-bor-inset-light:hover {background: rgba(30,118,227,0.2); -webkit-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1); -moz-box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1); box-shadow: inset 0px 0px 0px 2px rgba(30,118,227,1);}

.license-list-pink-sel {margin-bottom: 10px}


.license-list-pink-sel input[type='radio'] {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

.license-list-pink-sel input[type='radio']:checked + .license-list-pink-radio-label {
  background: #1D1C1F;
	-webkit-box-shadow: inset 0px 0px 0px 2px rgba(209,43,120,1);
	-moz-box-shadow: inset 0px 0px 0px 2px rgba(209,43,120,1);
	box-shadow: inset 0px 0px 0px 2px rgba(209,43,120,1);
}

.license-list-pink-sel input[type='radio']:checked + .license-list-pink-radio-label:before {
	content: '';
	-webkit-box-shadow: inset 0px 0px 0px 5px rgba(209,43,120,1);
	-moz-box-shadow: inset 0px 0px 0px 5px rgba(209,43,120,1);
	box-shadow: inset 0px 0px 0px 5px rgba(209,43,120,1);
}

.license-list-pink-radio-label {
  display: flex;
	flex-direction: row;
	align-items: center;
  position: relative;
  padding: 15px 25px 15px 50px;
  margin:0;
	height: auto; 
	line-height: 1.2;
  cursor: pointer;
  font-size: 1.125rem;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
	text-align: left;
	width: 100%;
	box-sizing: border-box;
	font-family:"SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif;
	font-weight:500;
	color:#ffffff;
	background: #1D1C1F;
	border-radius:12px; -webkit-border-radius:12px; -moz-border-radius:12px; -webkit-box-shadow: 0px 0px 0px 1px rgba(255,255,255,0.3);
-moz-box-shadow: 0px 0px 0px 1px rgba(255,255,255,0.3);
box-shadow: 0px 0px 0px 1px rgba(255,255,255,0.3);
	text-rendering: optimizeLegibility;
}

.license-list-pink-radio-label:hover {-webkit-box-shadow: 0px 0px 0px 2px rgba(209,43,120,1);
-moz-box-shadow: 0px 0px 0px 2px rgba(209,43,120,1);
box-shadow: 0px 0px 0px 2px rgba(209,43,120,1);}

.license-list-pink-radio-label:before {
	
	content: '';
  position: absolute;
	width: 16px;
	height: 16px;
	top: 50%;
	transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%);
	left: 20px;
	-webkit-box-shadow: inset 0px 0px 0px 1px rgba(255,255,255,0.3);
	-moz-box-shadow: inset 0px 0px 0px 1px rgba(255,255,255,0.3);
	box-shadow: inset 0px 0px 0px 1px rgba(255,255,255,0.3);
	-webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px;
	text-align: right;
	background: #1D1C1F;
	display: flex;
	align-items: center;
	justify-content: center;
}

.license-list-pink-radio-label .pgroup-p {color: #ffffff!important}

#dealCouponClick{width: 100%; height: 50px; line-height: 50px; margin-top: 30px; border: 1px dashed #DB1D6D; position: relative; cursor: pointer; transition: border 0.2s ease, color 0.2s ease; color: #DB1D6D}
#dealCouponClick:hover {border-color:#ffcc00!important; color: #ffcc00}
#closeDealPanel {cursor: pointer; margin: 0; position: absolute; top: 15px; right: 15px; color: #ffffff; font-size:30px; transition: opacity 0.2s ease}
#closeDealPanel:hover {opacity: 0.5;}
#deal {background: #121212; max-width: 850px; margin: 0 auto; -webkit-box-shadow: 2px 4px 12px rgba(0,0,0,0.5);
-moz-box-shadow: 2px 4px 12px rgba(0,0,0,0.5); box-shadow: 2px 4px 12px rgba(0,0,0,0.5); position: relative; cursor:default}



@media all and (max-width: 1950px) {

}


@media all and (max-width: 1760px) {
	
	.tb-grid-wrapper-large	{max-width: 1000px; grid-template-columns: repeat(2, 1fr); grid-gap: 30px}

}



@media all and (max-width: 1600px) {

	.page-buy-options-container	{grid-template-columns: auto auto; grid-gap: 40px; max-width: 900px;}
	.page-buy-capterra-container	{grid-template-columns: auto auto; grid-gap: 40px; max-width: 900px;}
	.review-grid-container	{grid-template-columns: repeat(2, 1fr);}
.bx-hero-controls {padding-right: 10px}
	
	.grey-back-frame	{margin-top: 100px; margin-bottom:100px; padding: 100px 0;}
	.dark-back-frame	{margin-top: 100px; margin-bottom:100px; padding: 100px 0;}
	.blue-back-frame	{margin-top: 100px; margin-bottom:100px;}
	.empty-back-frame	{padding: 100px 0;}

}
@media all and (max-width: 1520px) {

		ul.all-products-list-wrapper-wide	{grid-template-columns: repeat(3, 1fr);}


}
	

@media all and (max-width: 1485px) {
		.surveyRateFeaturesContainer2022	{grid-template-columns: repeat(2, 1fr);}
	
}

@media all and (max-width: 1420px) {

.car-scroll-prod-wrapper {transform: translateX(50px);}
	.car-slider-spacer-end	{transform: translateX(50px);}
	.compare-slider-spacer-end	{transform: translateX(50px);}
	.compare-scroll-prod-wrapper {transform: translateX(50px);}
}


@media all and (max-width: 1400px) {
ul.all-products-list-wrapper	{grid-template-columns: repeat(3, 1fr); }

	.info-center-grid-wrapper-large	{grid-template-columns: repeat(3, 1fr);}	

}

@media all and (max-width: 1380px) {

}


@media all and (max-width: 1360px) {
	.initial-hide {display: none}
	
}

@media all and (max-width: 1335px) {
.right-full-align-wrapper	{margin-left: auto}
.home-grid-set-container	{grid-template-columns: auto auto; grid-template-rows: auto auto auto;}
.home-grid-set-item4 {grid-column: auto / span 1;}
.home-grid-set-item5 {grid-column: auto / span 2;}
.home-grid-set-inner	{grid-template-columns: auto auto; grid-template-rows: auto auto; grid-gap: 40px;}
	
	
.col-grid-set-container	{grid-template-columns: repeat(2, 1fr);}
.col-grid-set-item4 {grid-column: auto / span 1;}
.col-grid-set-item5 {grid-column: auto / span 2;}
.col-grid-set-inner	{grid-template-columns: repeat(2, 1fr); grid-gap: 40px;}
	
.col-321-30	{grid-template-columns: repeat(2, 1fr);}

.key-feature-grid-set-container	{grid-template-columns: auto auto; grid-template-rows: auto auto auto;}
.key-feature-grid-set-item4 {grid-column: auto / span 1;}
.key-feature-grid-set-item5 {grid-column: auto / span 1;}
	.key-feature-grid-set-item6 {grid-column: auto / span 1;}
.key-feature-grid-set-item7 {grid-column: auto / span 2;}

.features-lower-grid-item-wrapper	{grid-template-columns: auto auto;}
	
.key-feature-grid-set-item-large1	{flex-direction: column;}
.key-feature-right-image-wrapper1	{min-width: 100%; border-radius: 0 0 20px 20px; -webkit-border-radius:0 0 20px 20px; -moz-border-radius:0 0 20px 20px; overflow: hidden; background: none;}
.key-feature-wide-replace1 img	{display: block}
	
.more-info-grid-container	{grid-template-columns: repeat(2, 1fr);}
.features-info-grid-container	{grid-template-columns: repeat(2, 1fr);}
.technology-grid-container	{grid-template-columns: auto auto;}
.technology-grid-container-light	{grid-template-columns: auto auto;}	

.slick-slide.main-slide-1200 {opacity: 1.0;}
.slick-center.main-slide-1200 {opacity: 1.0;}

	.step-info-grid-container	{grid-template-columns: repeat(2, 1fr);}
	
	ul.all-products-buy-list-wrapper	{grid-template-columns: repeat(2, 1fr); max-width: 726px;}
	ul.all-products-buy-list-wrapper2	{grid-template-columns: repeat(2, 1fr); max-width: 726px;}

.lesson-asset-wrapper { width: 100%;}
	.lesson-asset {padding: 0 70px;}
	.lesson-asset img {max-width: 100%;}
	.lesson-section-asset img {max-width: 100%;}
	
	.hero-bc-1 {width: 55%}
.hero-bc-2 {width: 40%}
	
	.home-hero-panel-title {font-size: 1.875rem}
	.home-hero-panel-sub-title {font-size: 0.875rem}
	.home-hero-panel-body {font-size: 1.0625rem}
	.panel-p-body-bold {font-size: 1.0625rem}
	.panel-h4-bold {font-size: 1.1875rem}
	.hb-col-left {width: 45%; min-width: auto;}
	.hb-col-right {width: 55%;}
	.hero-banner-content {padding-top: 80px; padding-bottom: 80px;}
	
}




@media all and (max-width: 1290px) {
	.pgrid-w2	{grid-template-columns: repeat(2, 1fr);}
.pgrid-w3	{grid-template-columns: repeat(2, 1fr);}
		.pgrid-w4	{grid-template-columns: repeat(3, 1fr); grid-gap: 40px;}
	
	ul.slider-buy li {width:450px; max-width: 450px;}
	
	.car-content-pad {padding: 30px!important;}
	.car-content-pad-low {padding: 30px 30px 0 30px!important;}
	.car-btn-pad {padding: 0 30px 30px 30px!important;}
	
	.car-content-pad-large {padding: 40px!important;}
	
	
	.plan-feature-grid-wrap .plan-feature-item {padding: 25px 0}
	.plan-feature-grid-wrap .plan-feature-item img {height: 40px; width: auto;}
	

	
}


@media all and (max-width: 1280px) {
.slide-round-main2	{with:100%; margin:0 auto!important; overflow:hidden; padding-left: 40px; padding-right: 40px; box-sizing: border-box;}
	
	.filter-resp-wrap {display: none; width: 100%; height: 100vh; position: fixed; top: 0; left: 0; z-index: 998000; cursor: pointer; background-color: rgba(22, 22, 22, 0.8); overflow:auto; padding: 63px 20px; box-sizing: border-box; backdrop-filter: saturate(180%) blur(20px); -webkit-backdrop-filter: saturate(180%) blur(20px);}	
	
	.main-filter {display: flex; flex-direction: column; padding: 25px; box-sizing: border-box; background: #ffffff; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; max-width: 600px; margin: 0 auto; gap:0;}
	
	.drop-down-wrap {width: 100%}
	
	
	.open-filter-btn {display: flex; width: 100%}
	/*.pl-filter-prompt {display: none;}*/
	.sp-wrap {margin-bottom: 30px; max-width: 100%;}
	.pl-filter {display: flex; flex-wrap: nowrap; width: 100%; flex-direction: column; align-items: flex-start}
	.p-filter {gap:20px}
	.filterPlanCount {width: auto; margin: 0; height: auto; line-height: 40px}
	.sort-menus {width: 100%;}
	
	.filter-list-f	{padding: 0 10px; display: flex; user-select: none; -webkit-box-shadow: none;
-moz-box-shadow: none; box-shadow: none; -webkit-border-radius:0; -moz-border-radius:0; border-radius: 0; border-bottom: 1px solid #dedede;}
	
	.filter-list-f:hover	{-webkit-box-shadow: none;
-moz-box-shadow: none; box-shadow: none;}
		
	.filter-list-f i {margin-left: auto!important;}
	
	.filter-sublist-f {width: 100%; position: static; -webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0; border-radius: 0; -webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none; padding: 20px 0; display: none; max-height: 100%; overflow: auto; border-bottom: 1px solid #DEDEDE; width: 100%!important;}
	
	#filter-apply-btn {display: flex; gap:10px}
	.filter-sublist-fsort {width: 100%!important}
	
	ul.filter-ul-wrap-4321 {grid-template-columns: repeat(3, 1fr); margin-top: 30px!important;}

}

@media all and (max-width: 1262px) {
.user-sliding-background {
	animation: userSlide 60s linear infinite;}
	.rating-col-3-hide {display: none}	
		

}

@media all and (max-width: 1250px) {
	
.pre-features-grid-content-wrapper	{transform: none}
.pre-features-grid-content-wrapper:hover	{transform: scale(1.01);}
.prefeaturesSlickSteps .slick-list	{padding:40px 0 40px 6%}

.pre-features-flexslide-content-wrapper {transform: translateX(6%);}
.pre-features-flexslide-content-wrapper:hover {transform: translateX(6%) scale(1.01);}

.pack-buy-options-container	{grid-template-columns: auto auto; width: 86%; margin:70px auto 0 auto;}
	
.grey-back-frame	{margin-top: 85px; margin-bottom:85px; padding: 85px 0;}
.dark-back-frame	{margin-top: 85px; margin-bottom:85px; padding: 85px 0;}
.blue-back-frame	{margin-top: 85px; margin-bottom:85px;}	
.empty-back-frame	{padding: 85px 0;}
	
	.col-grid-321-c	{grid-template-columns: repeat(2, 1fr);}
	
	
	
}



@media all and (max-width: 1240px) {
	.md-hero-screen	{max-width: 600px; height: 367px; margin-left: -300px;}
	.md-hero-screen	{transform-origin: center 100px;}
	
	.home-hero-sl-content-wrap {padding-top: 50px; padding-bottom: 70px}
	.hero-bc-3 {margin-top: 60px;}
		
	.preorder-pager-container {right: 50px}

}
	
@media all and (max-width: 1220px) {
	
}

@media all and (max-width: 1200px) {
	
	.full-image-secton-wrapper	{margin-top:20px}
	.full-image-inner-container {display: none;}
	.main-image-block	{display: block}
	.main-image-ad-block	{display: block}
	.hideFade	{opacity:1; transform: unset}
	
	.tech-wrapper	{height: 70px; position: relative; overflow: hidden}
	.tech-inner-top	{width: 100%; height: 60px; background:url('../macdraft-pre-order/images/tech-slide1.png') repeat-x center; background-size: 2031px 60px; position: absolute; top: 0;}
	.tech-inner-bottom	{width: 100%; height: 60px; background:url('../macdraft-pre-order/images/tech-slide2.png') repeat-x center; background-size: 1811px 60px;  position: absolute; bottom: 0;}

	.tech-wrapper	{opacity:0}

.tech-wrapper.heightChange	{height:70px; opacity:0}
.tech-wrapper.heightChange.changeOn	{height:120px; opacity:1}
	
	.round-panel-resp-title-inner	{margin: 70px auto 0 auto;}
	
	.large-anim-title	{display: none}
	.small-anim-title	{display: block}
	.animation-nav-wrapper	{width:80%}
	.guide-color-grid-container	{grid-template-columns: repeat(2, 1fr);}
	
.info-center-grid-wrapper-large	{grid-template-columns: repeat(2, 1fr);}
					.faq-q-title	{font-size: 19px}
	ul.all-products-list-wrapper-wide	{grid-template-columns: repeat(2, 1fr);}

.round-panel-resp-title-prod	{font-size: 18px}
	
	.col-comp-item {width: calc(100% / 4);}
	
	.padding-wrap {padding: 0 40px;}
	.hero-banner-content {padding-left: 40px; padding-right: 40px;}
	
	.car-scroll-prod-wrapper {transform: translateX(40px);}
	.car-slider-spacer-end	{transform: translateX(40px);}
	.compare-slider-spacer-end	{transform: translateX(40px);}
	.compare-scroll-prod-wrapper {transform: translateX(40px);}
	
	.panel-h1-main {font-size: clamp(1.625rem, calc(1.25rem + 2vw), 3.5rem);}

	.buy-col21	{gap:50px}
	.buy-col21-left	{width: 100%; max-width: 830px;}
	.buy-col21-right	{width: 100%; max-width: 430px; min-width: 430px;}
	
	.flex-plan-buy {width: 425px; max-width: 425px; flex: 0 0 auto;}

		.plan-pricing-flex-wrap {gap:50px;}
	
}
	
	

@media all and (max-width: 1130px) {
	
	.round-panel-resp-title-trial	{font-size: 28px}
	.plan-feature-grid-wrap .plan-feature-item img {height: 30px; width: auto;}

}



@media all and (max-width: 1120px) {
	
.slider-control-flex-with-title { flex-direction: column}
.features-slider-control-wrapper-inner	{margin-top: 30px;}

.features-control-title	{ order: 1}
.features-control-select	{order: 3}
.features-control-text { order: 2}
	
	
	.starRating2022:hover .starRating2022-star:hover,
		.starRating2022:hover .starRating2022-star:hover ~ .starRating2022-star,
		.starRating2022-input:checked ~ .starRating2022-star {
    		background: url(../images/products/md8/star-pink-on-large.png);
			background-size: 100px 95px;
		}
	
		.starRating2022:active .starRating2022-star:active,
.starRating2022:active .starRating2022-star:active ~ .starRating2022-star {
    background: url(../images/products/md8/star-pink-focus-large.png);
	background-size: 100px 95px;
}
	
		.starRating2022-star,
		.starRating2022:hover .starRating2022-star {
   		 position: relative;
   		 float: right;
    display: block;
    width: 100px;
    height: 95px;
    background: url(../images/products/md8/star-blue-off-large.png);
	background-size: 100px 95px;
	border:none;
	margin:0 10px;
		}
	
	

	
.filter-container	{height: 40px; box-sizing: border-box; padding: 0 20px; font-size:17px; line-height: 40px;}
	ul.all-products-list-wrapper	{margin-top: 40px}
	ul.all-products-list-wrapper-wide	{margin-top: 40px;}

	ul.all-products-buy-list-wrapper	{margin-top: 40px}
	ul.all-products-buy-list-wrapper2	{margin-top: 40px}

/*.main-select-control {font-size: 15px; height:40px; line-height:40px; font-weight: bold; box-sizing: border-box;}
	.main-select-control select {height:40px; line-height:40px; font-size: 15px;}*/
	
.trial-col21 {gap: 60px}

	.trial-col21-form {width: 440px;}
	.trial-col21-description {grid-template-columns: auto 440px; grid-gap: 60px}	

}

@media all and (max-width: 1100px) {

	.more-new-inner	{width: 350px;}
	ul#surveyContainer2022	{height:700px}

	.hero-bc-1 {width: 50%;}
	.hero-bc-2 {width: 45%;}
	
		ul.slider-buy li {width:400px; max-width: 400px;}
	
	.buy-controls {height: 50px;}
.buy-controls .bxPrev a {width: 50px; height: 50px; line-height: 50px; font-size: 20px}
.buy-controls .bxNext a {width: 50px; height: 50px; line-height: 50px; font-size: 20px}

	.col-grid-321-b	{grid-template-columns: repeat(2, 1fr);}

		ul.all-prod-filter-wrapper { grid-template-columns: repeat(2, 1fr);}
	
	.filter-tut-wrap {display: none}
	.sort-divide {display: none;}
	.filterandsort {display: inline-block;}

	
}
	
	

@media all and (max-width: 1068px) {
	
	
.benefits-bar-wrapper	{display: block; height: 26px;}
	.benefits-bar-wrapper > .benefit-item {visibility: hidden; position: absolute;
  top: 0; left: 0; animation: 15s autoplay1 infinite; width: 100%; justify-content: center;}

	@keyframes autoplay1 {
  0% {visibility: visible; opacity: 1}
  15% {opacity: 1}
  20% {visibility: hidden; opacity: 0;}
}
	.benefits-bar-wrapper > .benefit-item:nth-child(1) {animation-delay: 0s}
	.benefits-bar-wrapper > .benefit-item:nth-child(2) {animation-delay: 3s}
	.benefits-bar-wrapper > .benefit-item:nth-child(3) {animation-delay: 6s}
		.benefits-bar-wrapper > .benefit-item:nth-child(4) {animation-delay: 9s}
	.benefits-bar-wrapper > .benefit-item:nth-child(5) {animation-delay: 12s}
	
	.mbi {display:inline;}
	
	
	.full-buy-title	{font-size: 34px}
	.round-panel-resp-title-inner	{font-size:37px;}
	.round-panel-lander-title-inner	{font-size:37px;}
	
.lander-steps-left	{width:80px; max-width: 80px; flex: 0 0 80px;}
	
.home-hero-sl-inner-left {min-width: 400px;}
.home-hero-sl-medium {display: none;}
	.initial-hide {display: block}
	
	.home-hero-sl-nav2 ul {max-width: 800px}
.home-hero-sl-nav2::after {width: calc(100% - 800px);}

.col-grid-321	{grid-template-columns: repeat(2, 1fr);}
	.col-grid-421	{grid-template-columns: repeat(2, 1fr);}
	.col-grid-421 .grid-inner	{padding: 40px 0;}
	
		.plan-feature-grid-wrap .plan-feature-item {padding: 20px 0}


}

@media all and (max-width: 1020px) {

	.round-panel-resp-title-trial-small	{font-size: 25px}
		.education-summary-grid	{grid-template-columns: repeat(2, 1fr);}
	
		

	.pgrid-w4	{grid-template-columns: repeat(2, 1fr); grid-gap: 40px;}


		
}
@media all and (max-width: 1000px) {
.rating-col-3-hide2 {display: none}	
	
	.hb-flex-wrap {flex-direction: column; align-items: center}
.hb-col-left {width: 100%; min-width: auto;}
	.hb-col-right {width: 100%;}
	.hero-banner-content {padding-top: 60px; padding-bottom: 60px;}
	.hero-banner-wrapper {background-position: bottom;}
	.col21 {grid-template-columns: repeat(1, 1fr);}

	ul.slider-buy li {width:310px; max-width: 310px;}
	
	.buy-controls {height: 40px;}
.buy-controls .bxPrev a {width: 40px; height: 40px; line-height: 40px; font-size: 18px}
.buy-controls .bxNext a {width: 40px; height: 40px; line-height: 40px; font-size: 18px}
		

}

@media all and (max-width: 980px) {
	.lesson-select-control {width: 100%; font-size: 15px; height:40px; line-height:40px; margin: 0;}
.lesson-select-control select {height:40px; font-size: 15px;}
.lesson-select-control i {font-size:15px;}

}


@media all and (max-width: 985px) {

	.surveyRateFeaturesContainer2022	{grid-template-columns: repeat(1, 1fr); grid-gap: 10px}
	
	.full-buy-w	{grid-template-columns: repeat(1, 1fr); grid-gap: 40px;}
	.full-buy-pic	{max-width: 100%; margin: 0 auto; background: #f5f5f5;}
	.full-buy-pic .full-pic-inner	{max-width: 500px; margin: 0 auto;}
	/*.qty-and-price	{flex-direction:row; gap:15px; align-items: center;}
	#t-price	{margin-top:20px; margin-bottom: 20px;}
	.price-and-was	{display:grid; grid-template-columns: repeat(2, 1fr); grid-gap: 15px;}*/
			
	.lander-top-q	{grid-template-columns: repeat(1, 1fr);}
	.right-right-card-inner {padding: 0 50px 50px 50px}
	.right-right-card-inner	img {width: 100%;}
	.right-home-card-inner {padding: 0 50px 50px 50px}
	.right-home-card-inner	img {width: 100%; height: auto;}
	.right-right-card-inner2 {padding: 0 50px 50px 50px}
	.right-right-card-inner2	img {width: 100%;}
	.lander-card-order1	{order: 2}
.lander-card-order2	{order: 1}

		.mini-nav-os	{margin-bottom: 50px;}

	

}

@media all and (max-width: 980px) {

	.sub-nav-try {display: block; margin: 10px 0!important; }
	.plan-col-321 {grid-template-columns: repeat(2, 1fr);}
	
}


@media all and (max-width: 925px) {
	
	/*Sticky Change*/
	.sticky-buy-left	{display: none}
	.sticky-buy-right	{width: 100%; max-width: 100%; min-width: 100%;}
	.sticky	{position: static; top: 0;}
	.resp-image {display: block;}
	.round-panel-buy-title.prodTextAlignLeft	{text-align: center; width: 100%}
	.pre-order-with-new	{justify-content: center;}
	.sticky-buy-wrapper	{margin:120px auto 70px auto;}
	.sticky-buy-wrapper	{flex-direction: column; gap: 0}
	
	
.pre-order-buy-wrapper {flex-direction: column}
.pre-order-grid-content-wrapper	{margin:0 0 40px 0; max-width: 100%}
.round-panel-resp-title	{font-size:37px; margin-top:120px}
.round-panel-resp-body-large	{font-size:19px; color:#606060; line-height:25px; margin: 20px auto; width: 80%}	
.round-panel-resp-title-medium	{font-size:30px;}
.grey-back-frame	{margin-top: 70px; margin-bottom:70px; padding: 70px 0;}
.dark-back-frame	{margin-top: 70px; margin-bottom:70px; padding: 70px 0;}
.blue-back-frame	{margin-top: 70px; margin-bottom:70px;}	
.empty-back-frame	{padding: 70px 0;}
.empty-back-frame-with-banner	{width: 100%; padding: 50px 0 0 0;}



.left-center	{text-align: center;}

.round-panel-buy-title	{font-size:37px;}
.main-image-center-block	{margin: 40px auto;}
	.whatsnew-image-center-block	{margin: 40px auto;}

	.main-image-block	{margin: 40px auto 20px auto;}
	.prod-screen-block	{margin: 40px auto 40px auto;}
	.prod-screen-block-round	{margin: 40px auto 40px auto;}

	
.info-center-wrapper	{flex-direction: column;}
.info-center-inner	{width: 100%; max-width: 100%; margin: 0 auto;}
.info-center-inner:first-child	{margin: 0 auto 40px auto}
.info-center-inner:last-child	{margin-left:0;}
	
.left-full-align-wrapper	{flex-direction: column; margin-top: 50px; width: 100%; max-width: 100%; padding:0 40px;}
.right-inner	{margin:40px auto 0 auto; width: 100%; max-width: 100%; min-width: 100%;}
.left-edge-inner	{width:100%; height: auto; margin: 0 auto; -webkit-border-radius: 10px; -moz-border-radius:10px; border-radius:10px;}
.right-container-wrapper	{width: 100%; max-width: 100%; min-width: 100%; margin: 0 auto;}


.right-full-align-wrapper	{flex-direction: column; margin-top: 50px; width: 100%; max-width: 100%; margin-left: 0; padding:0 40px;}
.right-left-inner	{width: 100%; max-width: 100%; min-width: 100%; margin:40px auto 0 auto;}
.right-right-edge-inner	{width:100%; height: auto; margin:0 auto; -webkit-border-radius: 10px; -moz-border-radius:10px; border-radius:10px; order: 1;}
.right-left-container-wrapper {width: 100%; max-width: 100%; min-width: 100%; margin: 0 auto; order:2;}

	.padding-right-left-spacer	{padding: 0}

	

.round-panel-resp-body	{font-size:17px; line-height: 23px}
	.pol-title-mini {font-size:15px; line-height: 23px}
	
.section-spacer	{padding-bottom: 100px;}

.more-new-container	{margin: 70px auto 0 auto; display: flex; flex-direction: row; flex-wrap: wrap; align-content: flex-start; gap:40px;}
.more-info-grid-container	{margin:70px auto;}
	.features-info-grid-container	{margin:70px auto 0 auto;}
	.technology-grid-container	{margin:70px auto;}
	.technology-grid-container-light	{margin:70px auto;}

.padding-align	{padding: 0 60px 60px 60px; width: calc(100% - 120px)!important; min-width: calc(100% - 120px)!important;}
.info-center-inner-large	{flex-direction: column;}
.info-center-inner-large-image	{width:100%; max-width:100%; min-width: 100%; max-height: 400px}

	.what-new-select-wrapper	{ display: block;}
	.pre-order-what-new-grid { display: none;}
	
	.tech-wrapper	{opacity:1}

	.tech-wrapper.heightChange	{height:120px; opacity:1}
	
	.round-panel-resp-title-inner	{margin: 70px auto 0 auto}
	
	.fadeInSel.fadeInMove	{opacity: 1; transform: translateY(0);}
	.fadeInSel.fadeInMove.fadeOn	{opacity: 1; transform: translateY(0)}
	
	.home-top-image-wrapper	{padding-bottom: 70px}
	
	.home-grid-set-container	{grid-template-columns: auto; grid-template-rows: auto auto auto auto auto;}
	.home-grid-set-item4 {grid-column: auto / span 1;}
	.home-grid-set-item5 {grid-column: auto / span 1;}
	.home-grid-set-inner	{grid-template-columns: auto; grid-template-rows: auto auto auto auto; grid-gap: 40px;}
	
	
	.col-grid-set-container	{grid-template-columns: repeat(1, 1fr);}
	.col-grid-set-item4 {grid-column: auto / span 1;}
	.col-grid-set-item5 {grid-column: auto / span 1;}
	.col-grid-set-inner	{grid-template-columns: repeat(1, 1fr); grid-gap: 40px;}
	
	.col-321-30	{grid-template-columns: repeat(1, 1fr);}
	
	.more-info-grid-container	{grid-template-columns: repeat(1, 1fr);}
	.more-info-grid-container2	{grid-template-columns: repeat(1, 1fr);}
	.features-info-grid-container	{grid-template-columns: repeat(1, 1fr);}
	.technology-grid-container	{grid-template-columns: auto;}
	.technology-grid-container-light	{grid-template-columns: auto;}
	

	
	
	.guide-sticky-buy-wrapper	{width:86%; position: relative}
	#left-guide-panel	{display: none;}
	.guide-sticky-buy-right	{margin-left: 0; padding-top: 120px; padding-left: 0; padding-right: 0;}
	#guide-nav-resp	{display:block;}
	
	#guide-nav-button {display:none}
	#guide-nav-button-resp {display:block}
	
	.page-buy-options-container	{grid-template-columns: auto; width: 86%; margin:70px auto 0 auto;}
	.page-buy-capterra-container	{grid-template-columns: auto; width: 86%; margin:70px auto 0 auto;}


	.key-feature-grid-set-container	{grid-template-columns: auto; grid-template-rows: auto auto auto auto auto;}
	.key-feature-grid-set-item4 {grid-column: auto / span 1;}
	.key-feature-grid-set-item5 {grid-column: auto / span 1;}
	.key-feature-grid-set-item6 {grid-column: auto / span 1;}
	.key-feature-grid-set-item7 {grid-column: auto / span 1;}
	
	.key-feature-grid-set-item-large2	{flex-direction: column;}
	.key-feature-right-image-wrapper2	{min-width: 100%; border-radius: 0 0 20px 20px; -webkit-border-radius:0 0 20px 20px; -moz-border-radius:0 0 20px 20px; overflow: hidden; background: none;}
	.key-feature-wide-replace2 img	{display: block}
	
	.starRating2022:hover .starRating2022-star:hover,
		.starRating2022:hover .starRating2022-star:hover ~ .starRating2022-star,
		.starRating2022-input:checked ~ .starRating2022-star {
    		background: url(../images/products/md8/star-pink-on-large.png);
			background-size: 85px 81px;
		}
	
		.starRating2022:active .starRating2022-star:active,
.starRating2022:active .starRating2022-star:active ~ .starRating2022-star {
    background: url(../images/products/md8/star-pink-focus-large.png);
	background-size: 85px 81px;
}
	
		.starRating2022-star,
		.starRating2022:hover .starRating2022-star {
   		 position: relative;
   		 float: right;
    display: block;
    width: 85px;
    height: 81px;
    background: url(../images/products/md8/star-blue-off-large.png);
	background-size: 85px 81px;
	border:none;
	margin:0 10px;
		}

	

.round-panel-resp-title-trial-small	{font-size: 21px}

.pol-title {font-size:25px}
	.pol-sub-title {font-size: 18px; line-height: 22px}
	.pol-glyph {font-size:60px}
	
		ul.all-products-list-wrapper	{grid-template-columns: repeat(2, 1fr);}
		ul.all-products-buy-list-wrapper	{grid-template-columns: repeat(2, 1fr);}

		.lesson-sticky-wrapper {margin-top: 70px}

			.col-321	{grid-template-columns: repeat(2, 1fr);}
				
	
	.trial-col21 {width: 100%; display: flex; flex-direction: column; flex-wrap: nowrap; gap: 70px;}
.trial-col21-heading {width: 100%}
.trial-col21-form {position: static; margin-top: 0; width: 100%}
.trial-col21-description {height: auto; width: 100%; display: block;}
	
	.hide-btn-wrap {display: flex;}
	.hide-wrap {display: block;}

.buy-col21	{flex-direction: column; gap:40px}
.buy-col21-left	{width: 100%; max-width: 100%;}
.buy-col21-right	{width: 100%; max-width: 100%; min-width: 100%;}
.buy-sticky	{position: static; top: 0;}
	
			
	
	.buy-controls {height: 60px;}
.buy-controls .bxPrev a {width: 60px; height: 60px; line-height: 60px; font-size: 24px}
.buy-controls .bxNext a {width: 60px; height: 60px; line-height: 60px; font-size: 24px}
	
	
	
	
	
	.filter-tut-menus {margin: 30px 0 40px 0; }
	
	.plan-pricing-flex-wrap {width: 100%; display: flex; flex-direction: column; gap:40px; align-items: center}

	.plan-pricing-sticky {width: 100%; height: auto; position: static; box-sizing: border-box;}
	
	.plan-feature-grid-wrap {grid-template-columns: repeat(5,1fr);}
	.plan-feature-grid-wrap .plan-feature-item img {height: 34px; width: auto;}
	.flex-plan-buy {width: 100%; max-width: 100%; flex: 0 0 auto;}
	
	.plan-feature-wrap {margin-top: 40px}
	
	.plan-carousel-wrap {max-height: none;}
		ul.slider-plan li {max-height: none; }

	}


@media all and (max-width: 870px) {
	
	.tb-grid-wrapper-large	{max-width:550px; grid-template-columns: repeat(1, 1fr); grid-gap: 30px}

		.wi-grid	{grid-template-columns: repeat(2, 1fr); grid-gap: 30px; grid-row-gap: 20px}

.survey-2col {grid-template-columns: repeat(1, 1fr);}
.answer-with-img img {width: 30px;}

 .rating-ring-wrap {grid-template-columns: repeat(2, 1fr); max-width: 640px}

.wmnav-label-tiny {display: none}

	
}


@media all and (max-width: 850px) {
#mainControlsContainer2022	{width:100%; height:155px;}
		
		#surveyProgressContainer2022	{width:100%; float:left; clear:both; margin:0;}
		
		#surveyProgress2022	{width:95%; max-width:95% }
		
		#survey-slider-prev2022	a {width:46%;}

		#survey-slider-next2022 a	{width:46%;}
	
		#quizProgressContainer2022	{width:100%; float:left; clear:both; margin:0; height: 20px;}
		#quizProgress2022	{width:100%; max-width:100% }
		#quizPrevious	a {width:40%;}
		#quizNext a	{width:40%;}
		#quizFinish	{width:40%;}
		.quiz-progress-wrapper	{width:100%; height:155px;}
	.quiz-scroll-content {height: calc(100% - 156px);}
	
	#survey2023Previous a {width:40%;}
	#survey2023Next a {width:40%;}
	.answers-slider2023 {width:40%;}
	
	ul#surveyContainer2023 li	{padding:70px 0 0 0;}


	
	
		.answers-slider2022	{width:46%;}
	ul#surveyContainer2022	{height:650px}
	
	.survey-image-icon	{width: 150px;}
	
	.surveyTextBox2022	{width:100%; margin:10px auto 0 auto;}
		
		.nameTextBox2022	{float:left;}
		.emailTextBox2022	{float:left;}
		.companyTextBox2022	{float:left;}
	
		.surveyselectleft2022	{float:left; width:100%; margin-bottom: 40px}
		.surveyselectright2022	{float:left; width:100%; }
		.surveyselectcenter2022	{float:left; width:100%; margin:40px 0 0 0;}
	
	.surveyRadioProd2022	{width:60%;}
	
	.trial-download-card {flex-direction: column;}
.trial-download-card-image {padding-top: 0; width:100%; max-width:100%; min-width: 100%; max-height: 400px; padding-left: 40px;}
.round-panel-resp-title-trial	{font-size: 30px;}
.trial-download-card-info .contactRequest {max-width: 100%}
.trial-download-card-info {padding: 40px; width: 100%;}
	

	.trial-download-card-small {flex-direction: column; padding: 40px; gap:20px;}
.trial-download-card-small .pink-main-button	{width: 100%; max-width: 100%; align-content: center}
.round-panel-resp-title-trial-small	{align-content: center; font-size: 28px}

		.step-info-grid-container	{grid-template-columns: repeat(1, 1fr);}
	.col-21	{grid-template-columns: repeat(1, 1fr); max-width: 100%; margin-top: 50px}
	
	

.home-hero-sl-inner {flex-direction: column;}
	.home-hero-sl-inner-left {margin-right: 0; min-width: 100%}
	.home-hero-sl-inner-right {margin-top: 40px; min-width: 100%}
.home-hero-sl-inner-right img {object-fit: contain; object-position: center; width:100%; height: auto;}
	.review-grid-container	{grid-template-columns: repeat(1, 1fr);}
	
	
	.review-flex-wrap {flex-wrap: wrap; justify-content: space-between}
	.review-flex-item-fixed {min-width: auto;}
	.review-flex-item {width: 100%;}
	.reviewTextLeftRight {text-align: right}
	
	.col-oc	{grid-template-columns: repeat(2, 1fr); grid-gap: 20px; max-width: 490px;}
	
	.col-grid-321-c	{grid-template-columns: repeat(1, 1fr);}


}

@media all and (max-width: 820px) {
	.hero-bc-1 {width: 100%;}
	.hero-bc-2 {width: 100%; order: 3; margin-top: 30px;}
	.hero-bc-3 {order: 2; margin-top: 30px; -webkit-border-radius:10px; -moz-border-radius:10px; -o-border-radius:10px; border-radius:10px;}
	.home-hero-sl-content-wrap {padding: 30px 25px 50px 25px;}

	.flex-title {flex-direction: column; align-items: flex-start;}
	.flex-title2 {align-items: flex-start;}
	

}

@media all and (max-width: 790px) {	
	ul.filter-ul-wrap-4321 {grid-template-columns: repeat(2, 1fr);}
	.plan-col-321 {grid-template-columns: repeat(3, 1fr);}
	

}
	
@media all and (max-width: 768px) {
	
	
	
	.more-new-inner	{width: 100%;}
	.small-anim-title	{display:none}
	.image-anim-title	{display:block}
	.font-awesome-nav-edit	{margin:0}
	.animation-nav-text	{margin:0 40px;}
		.animation-nav-wrapper	{width:90%}

	
	.slick-home-main .slick-list {padding-left: 5%!important; padding-right: 5%!important;}
	.slick-home-main {margin:40px auto 40px auto; }
	.slick-home-main .slick-snext,
.slick-home-main .slick-sprev,
.slick-home-main .slick-snext2,
.slick-home-main .slick-sprev2,
.slick-home-main .slick-snext3,
.slick-home-main .slick-sprev3{
  display: block;
	opacity:0;
}
	
.image-right-text-left	{flex-direction:column;}
.image-right-text-left-image	{width: 100%; height: 50vw}
.image-right-text-left-text	{width: 100%;}
	

	.features-lower-grid-item-wrapper	{grid-template-columns: auto;}

	.body-hide-for-panel	{padding: 0; width: 100%; height: 100%; background: #ffffff;}
	.body-hide-for-panel2	{padding: 30px;}
	.body-hide-for-panel-light	{padding: 40px 50px;}
	.see-info-panel	{-webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none;}
	.see-filter-panel	{-webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; max-width: 100%; max-height: 100%!important; height: 100%!important;}

	.see-info-content-grow	{padding-left:30px; padding-right:30px; flex-grow:1;}


	
	.body-hide-for-learn-panel	{padding: 0; width: 100%; height: 100%; background: #ffffff;}

.see-learn-more-panel	{-webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none;}
	
.see-learn-content-grow	{padding-left:30px; padding-right:30px; padding-bottom: 0;}
	
	.see-learn-inner-container	{flex-direction: column; width: 100%}

.see-learn-image	{width: 100%; position: static; height: 300px}

	.why-try-container	{width:80%; grid-template-columns: auto auto; grid-gap: 30px}
.trial-long-grid-wrapper	{padding:45px;}
	.pack-buy-options-container	{grid-template-columns: auto; width: 86%; margin:70px auto 0 auto;}
	
	.filter-sort-buttons	{grid-template-columns: repeat(1, 1fr); grid-template-rows: repeat(2, 1fr); grid-gap: 20px;}
	
	.filter-container	{height: 40px; box-sizing: border-box; padding: 0 20px; font-size:17px; line-height: 40px;}
	
	.starRating2022:hover .starRating2022-star:hover,
		.starRating2022:hover .starRating2022-star:hover ~ .starRating2022-star,
		.starRating2022-input:checked ~ .starRating2022-star {
    		background: url(../images/products/md8/star-pink-on-large.png);
			background-size: 50px 48px;
		}
	
		.starRating2022:active .starRating2022-star:active,
.starRating2022:active .starRating2022-star:active ~ .starRating2022-star {
    background: url(../images/products/md8/star-pink-focus-large.png);
	background-size: 50px 48px;
}
	
		.starRating2022-star,
		.starRating2022:hover .starRating2022-star {
   		 position: relative;
   		 float: right;
    display: block;
    width: 50px;
    height: 48px;
    background: url(../images/products/md8/star-blue-off-large.png);
	background-size: 50px 48px;
	border:none;
	margin:0 10px;
		}

	
.pol-title {font-size:22px}
	.pol-glyph {font-size:50px}
	
.faq-cat-w	{grid-template-columns: repeat(1, 1fr); margin-top:30px; grid-gap: 15px}
.faq-cat-item	{padding: 10px 15px; -webkit-border-radius:10px; -moz-border-radius:10px; -o-border-radius:10px; border-radius:10px;}
.cat-img	{width: 30px;}
.faq-cat-title	{font-size:15px; font-weight: 600;}

			ul.all-products-list-wrapper-wide	{grid-template-columns: repeat(1, 1fr);}

		.col-comp-item {width: calc(100% / 3);}

	.bxnav-wrap {flex-direction: column; margin-bottom: 30px}
	.car-bxnav-light {width: 100%; margin-bottom: 20px}
	
.col-grid-21	{grid-template-columns: repeat(1, 1fr); margin:40px auto 0 auto;}
	

}
	
@media all and (max-width: 750px) {
		.col-grid-321-b	{grid-template-columns: repeat(1, 1fr);}

	}
@media all and (max-width: 735px) {
	
	.lesson-sticky-wrapper {flex-direction: column; margin-top: 70px; border-bottom: 1px solid #cccccc;}

.lesson-left {width: 100%; margin: 0; padding-bottom: 70px;}
.lesson-step {margin-top: 60px}
.lesson-step::before {opacity: 1;}
	
	.lesson-asset-small {display: block;}
	.lesson-right {display: none;}
	


	

}



@media all and (max-width: 690px) {
	
	ul.all-products-list-wrapper	{grid-template-columns: repeat(1, 1fr);}

	ul.all-products-buy-list-wrapper	{grid-template-columns: repeat(1, 1fr);}
	ul.all-products-buy-list-wrapper2	{grid-template-columns: repeat(1, 1fr);}
	.info-center-grid-wrapper	{grid-template-columns: repeat(1, 1fr);}
	.info-center-grid-wrapper-large	{grid-template-columns: repeat(1, 1fr);}
	
	
	ul#surveyContainer2022	{height:500px}
		
		#survey-slider-prev2022	a {width:46%; height:35px; font-size:19px; line-height:35px}

		#survey-slider-next2022 a	{width:46%; height:35px; font-size:19px; line-height:35px}

		.answers-slider2022	{width:46%; height:35px; font-size:19px; line-height:35px}
		
		#mainControlsContainer2022	{width:100%; height:110px;}
		
		#surveyProgressContainer2022	{width:100%; float:left; clear:both; margin:0; height:60px}
		
		#surveyProgress2022	{width:95%; max-width:95%; height:30px }

		.surveyProgressBar2022	{width:0%; height:30px; float:left; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; margin:0; padding:0;}
		
		.surveyProgressBarText2022	{position:absolute; top:0; left:0; width:100%; line-height:30px; font-size:17px; font-weight:400}
	
		#quizPrevious	a {width:40%; height:35px; font-size:15px; line-height:35px}
		#quizNext a	{width:40%; height:35px; font-size:15px; line-height:35px}
		#quizFinish	{width:40%; height:35px; font-size:15px; line-height:35px}
		.quiz-progress-wrapper	{width:100%; height:140px;}
		.quiz-scroll-content {height: calc(100% - 141px);}
	
		.survey-progress-wrapper {height: 100px;}
		#survey2023Previous a {width:35%; height:35px; font-size:15px; line-height:35px}
		#survey2023Next a {width:35%; height:35px; font-size:15px; line-height:35px}
		.answers-slider2023 {width:35%; height:35px; font-size:15px; line-height:35px}
	
		ul#surveyContainer2023 li	{padding:50px 0 0 0;}



		.round-panel-resp-title-trial-small	{font-size: 21px}
	
	.doc-select-desc {display: none}
	.doc-select-img {width: 40px; max-width: 40px; min-width: 40px;}
	.doc-select {padding: 20px 25px; gap:15px}
	.doc-select .round-panel-resp-title-small {font-size: 19px}
	.doc-select-w {grid-gap: 20px;}
	.faq-q-title	{font-size: 19px}

	.qty-and-price	{display: block}
	#t-price	{margin-top:0; margin-bottom: 0;}
	.price-and-was	{display:block;}
	
	.lander-panel-content-wrapper	{padding: 70px 40px;}
	.pgrid-w2	{grid-template-columns: repeat(1, 1fr);}
		.pgrid-w3	{grid-template-columns: repeat(1, 1fr);}
	.round-panel-lander-title-inner	{font-size: 30px; font-weight: 600;}

	.lander-checklist-wrapper {grid-template-columns: repeat(1, 1fr);}
	.lesson-objective-wrapper {grid-template-columns: repeat(1, 1fr);}

	.lander-steps-wrapper {flex-direction: column;}
	.lander-steps-left	{width:100%; max-width: 100%; padding: 20px 45px; flex: 0 0 100%;}
	.l-step-h {display:inline;}
	
	.rate-ring {width:40px; height:40px; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; font-size: 17px; line-height: 40px}
	.survey-rate-radio label {padding:15px;}
	
	.rate-ring-small {width:40px; height:40px; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; font-size: 17px; line-height: 40px}
	.survey-rate-radio-small label {padding:15px;}
	
	.home-hero-sl-small {display: none}
	
	.rating-col-3-wrap	{display: none;}
	
	.hero-bc-3 img	{margin:0}
	
.col-grid-321	{grid-template-columns: repeat(1, 1fr); margin:40px auto 0 auto;}
	
	
	.text-left-center {text-align: center;}
	
	.compare-vers-wrap {margin:40px auto 0 auto;}
	.compare-vers-row {flex-direction: column;}
.compare-vers-left {width: 100%;}
.compare-vers-right {width: 100%;}
	
	.compare-vers-left-title {background: #E5DCE7; padding: 20px 25px 10px 25px;}
.compare-vers-right-title {background: #E5DCE7; padding: 10px 25px 20px 25px;}
	
	.compare-vers-left-light {padding: 15px 20px;}
.compare-vers-left-dark {padding: 15px 20px;}
.compare-vers-right-light {padding: 15px 20px;}
.compare-vers-right-dark {padding: 15px 20px;}
	
	
	
	.buy-controls {height: 50px;}
.buy-controls .bxPrev a {width: 50px; height: 50px; line-height: 50px; font-size: 20px}
.buy-controls .bxNext a {width: 50px; height: 50px; line-height: 50px; font-size: 20px}

	ul.all-prod-filter-wrapper {margin: 40px auto 0 auto; grid-template-columns: repeat(1, 1fr); grid-gap: 20px; grid-row-gap: 20px;}
	
	.plan-col-321 {grid-template-columns: repeat(2, 1fr);}
	
}
@media all and (max-width: 620px) {

	.header-flex-wrap {flex-direction: column; margin-bottom: 30px; gap:5px; align-items: flex-start;}

			.col-321	{grid-template-columns: repeat(1, 1fr)}
				.col-grid-421	{grid-template-columns: repeat(1, 1fr); margin:40px auto 0 auto;}

	#topicFilter {display: block;}
	.tut-scroll-snap-position-container {display: none}
	

	
}

@media all and (max-width: 580px) {
	
	.body-hide-for-panel-light	{padding: 40px 20px;}
	
	.grey-back-frame	{margin-top: 50px; margin-bottom:50px; padding: 50px 0;}
	.dark-back-frame	{margin-top: 50px; margin-bottom:50px; padding: 50px 0;}
	.blue-back-frame	{margin-top: 50px; margin-bottom:50px;}
	.empty-back-frame	{padding: 50px 0;}
	
	.background-light-wash .main-sub-navigation-site-content-resp	{font-size:17px!important}
	.order-summary-included div {flex-direction: column; align-items: flex-start!important;}
	.flex-category-list {flex-direction: column; gap:0;}
	
	.pre-features-flexslide-content-wrapper	{width: 100%; margin: 0 auto; transform: translateX(0); max-width: 100%}
	.car-scroll-prod-wrapper	{width: 100%; margin: 0 auto; transform: translateX(0); max-width: 100%;}
	
	.compare-scroll-prod-wrapper	{max-width: 320px; margin: 0 auto; transform: translateX(20px);}
	
	.slider-buy-action-wrapper	{flex-direction:column!important;}
	
	.slider-product-wrapper	{flex-direction:column!important;}

	.slider-absolute-margin	{margin-bottom:440px}

	.slider-image-strip-wrapper	.blue-main-button-hollow	{max-width: 100%!important; width: 100%!important}
.slider-image-strip-wrapper	.blue-main-button	{max-width: 100%!important; width: 100%!important}
	.features-long-grid-item .blue-main-button	{max-width: 100%!important; width: 100%!important}
	
	.slider-image-strip-wrapper-noRound	.blue-main-button-hollow	{max-width: 100%!important; width: 100%!important}
.slider-image-strip-wrapper-noRound	.blue-main-button	{max-width: 100%!important; width: 100%!important}
	
	
	.pre-features-flexslide-content-wrapper:hover {transform: translateX(0) scale(1);}
	.flex-slider-scroll-wrapper	{padding: 0; width: 100%; margin: 20px auto;}
	.car-flex-slider-scroll-wrapper	{padding: 0 20px; width: 100%; margin: 0 auto; box-sizing: border-box}
.blue-main-button-wrapper {flex-direction: column;}
	.blue-main-button-wrapper .blue-main-button {margin-left:auto; margin-right: auto; width: 100%}
	.blue-main-button-wrapper .blue-main-button-hollow {margin-left:auto; margin-right: auto; width: 100%}
	.last-slide-spacer	{display: none;}

	
	.flex-slide-scroll-snap-container	{display: block;}
	.car-flex-slide-scroll-snap-container	{display: flex; flex-direction: column;}
	.slider-spacer-end	{display: none;}
		.car-slider-spacer-end	{display: none;}
	.compare-slider-spacer-end	{transform: translateX(20px); width: 20px}

	#scroll-right-button	{display: none!important;}
#scroll-left-button	{display: none!important;}
	
	.compare-scroll-snap-position-container #scroll-left-button {display: block!important; width: 30px; height: 30px; line-height: 30px; top: calc(50% - 15px); border-radius:15px; -webkit-border-radius:15px; -moz-border-radius:15px;}
	.compare-scroll-snap-position-container #scroll-right-button {display: block!important; width: 30px; height: 30px; line-height: 30px; top: calc(50% - 15px); border-radius:15px; -webkit-border-radius:15px; -moz-border-radius:15px;}
	
	.compare-scroll-snap-position-container #scroll-left-button i	{border: none; padding: 0; margin: 0; line-height: 30px; font-size: 1rem;}
	
	.compare-scroll-snap-position-container #scroll-right-button i	{border: none; padding: 0; margin: 0; line-height: 30px; font-size: 1rem;}
	
	.animation-nav-text	{margin:0 20px;}
	.animation-nav-wrapper	{width:90%}
	
	.slider-grey-header	{margin-bottom: 10px}
	
		.guide-color-grid-container	{grid-template-columns: repeat(1, 1fr);}

	
	.education-summary-grid	{grid-template-columns: repeat(1, 1fr);}
	
		.opt-w	{margin: 40px auto 50px auto;}
	.opt-inner	{max-width: 300px;}

.opt-inner-item	{font-size:13px;}
.opt-inner-item .img-w	{width: 30px;}
	
	.wi-grid	{grid-template-columns: repeat(1, 1fr);}
	
	
	.right-right-card-inner2 {padding:0 0 50px 50px}
	.right-right-card-inner2	img {width: 140%; object-position: left top;}

	.pgrid-w4	{grid-template-columns: repeat(1, 1fr); grid-gap: 40px;}

	.mini-nav-os	{margin-bottom: 50px;}
	.mini-nav-os ul {max-width: 180px;}
.mini-nav-os ul li {width: 80px; font-size:13px;}
.mini-nav-os ul li a i {font-size: 30px; margin: 0 0 5px 0}
		.lesson-content-grow	{padding:35px;}
	
		.home-hero-sl-tiny {display: none}
	
	.home-hero-btn-wrap {flex-direction: column;}
	.prod-btn-double {flex-direction: column;}
	.prod-btn-double-p-low {flex-direction: column; padding: 0 30px 30px 30px}


	.home-hero-panel-title {font-size: 1.875rem}
	.hero-banner-content {padding: 40px 20px 50px 20px;}

.car-content-pad {padding: 25px!important;}
	.car-content-pad-low {padding: 25px 25px 0 25px!important;}
	.car-btn-pad {padding: 0 25px 25px 25px!important;}
	.padding-wrap {padding: 0 20px;}
	
	.car-content-pad-large {padding: 30px!important;}

	
			.rating-ring-wrap {grid-template-columns: repeat(1, 1fr);}

ul.slider-buy li {width:100%; max-width: 100%;}
	.plan-carousel-wrap {max-height: 100%;}
	
	.col-21-short	{grid-template-columns: repeat(1, 1fr); max-width: 100%; margin-top: 40px}
	
	.flex-col2-sb-rc {flex-direction: column; align-items: flex-start; gap: 10px}
	
		.slick-main-steps {margin:20px auto 0 auto; }
	
	.right-full-align-wrapper {padding: 0 20px; margin-top: 40px}
	
	.left-full-align-wrapper {padding: 0 20px; margin-top: 40px}


	
}
@media all and (max-width: 550px) {

	
		.starRating2022:hover .starRating2022-star:hover,
		.starRating2022:hover .starRating2022-star:hover ~ .starRating2022-star,
		.starRating2022-input:checked ~ .starRating2022-star {
    		background: url(../images/products/md8/star-pink-on.png);
			background-size: 44px 42px;
		}
	
		.starRating2022:active .starRating2022-star:active,
.starRating2022:active .starRating2022-star:active ~ .starRating2022-star {
    background: url(../images/products/md8/star-pink-focus.png);
	background-size: 44px 42px;
}
	
		.starRating2022-star,
		.starRating2022:hover .starRating2022-star {
   		 position: relative;
   		 float: right;
    display: block;
    width: 44px;
    height: 42px;
    background: url(../images/products/md8/star-blue-off.png);
	background-size: 44px 42px;
	border:none;
	margin:0 5px;
		}
	
	
	.surveyRateFeaturesleft2022	{flex-direction: column}
.surveyRateFeaturesright2022	{flex-direction: column}
	
	.surveyRadioRanking2022 input[type=radio] + label .outer {width:58px; height:58px; border-radius:29px; -moz-border-radius:29px; -webkit-border-radius:29px;}
	.surveyRadioRanking2022 input[type=radio] + label .inner {width:50px; height:50px; border-radius:25px; -moz-border-radius:25px; -webkit-border-radius:25px;}
	.surveyRadioRanking2022 input[type=radio] + label .innerCircle {width:32px; height:32px; border-radius:16px; -moz-border-radius:16px; -webkit-border-radius:16px;}
	
	.surveyRadioRanking2022 input[type=radio] + label .choice1:before {font-size:18px; line-height:32px; }
	.surveyRadioRanking2022 input[type=radio] + label .choice2:before { font-size:18px; line-height:32px;}
	.surveyRadioRanking2022 input[type=radio] + label .choice3:before {font-size:18px; line-height:32px; }
	.surveyRadioRanking2022 input[type=radio] + label .choice4:before { font-size:18px; line-height:32px;}
	.surveyRadioRanking2022 input[type=radio] + label .choice5:before { font-size:18px; line-height:32px; }

	.trial-download-card {margin: 40px auto 0 auto;}
	.main-image-ad-block	{margin: 30px auto 0 auto;}
.trial-download-card-small {margin: 30px auto 0 auto;}
	
		.pol-title {font-size:20px}
	.pol-title-small {font-size:20px}
	
	.buy-controls {height: 40px;}
.buy-controls .bxPrev a {width: 40px; height: 40px; line-height: 40px; font-size: 18px}
.buy-controls .bxNext a {width: 40px; height: 40px; line-height: 40px; font-size: 18px}

	.wm-nav-wrap {flex-direction: column;}
	.car-wmnav-light {width: 100%; margin-bottom: 20px;}
	
	.p-filter {flex-direction: column; max-width:100%}
	.pl-filter {display: block; order: 2;}
	.filter-sublist-f {width:100%}
	.sp-wrap {margin-bottom: 20px}
	.open-filter-btn {margin-bottom: 10px}
	
	ul.filter-ul-wrap-4321 {grid-template-columns: repeat(1, 1fr);}
	.plan-col-321 {grid-template-columns: repeat(3, 1fr);}
	
	.plan-feature-grid-wrap {grid-template-columns: repeat(12,4fr); }
	.plan-feature-item {grid-column: span 4}
	.feature-wide {grid-column: span 6}
		
}

@media all and (max-width: 480px) {
		ul#surveyContainer2022	{height:500px}
				
		#survey-slider-prev2022	a {width:44%; height:35px; font-size:19px; line-height:35px}

		#survey-slider-next2022 a	{width:44%; height:35px; font-size:19px; line-height:35px}

		.answers-slider2022	{width:44%; height:35px; font-size:19px; line-height:35px}
		
		#mainControlsContainer2022	{width:100%; height:110px;}
		
		#surveyProgressContainer2022	{width:100%; float:left; clear:both; margin:0; height:60px}
		
		#surveyProgress2022	{width:95%; max-width:95%; height:30px }

		.surveyProgressBar2022	{width:0%; height:30px; float:left; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; margin:0; padding:0;}
		
		.surveyProgressBarText2022	{position:absolute; top:0; left:0; width:100%; line-height:30px; font-size:17px; font-weight:400}
	
	
		#quizPrevious	a {width:35%;}
		#quizNext a	{width:35%;}
		#quizFinish	{width:35%;}
	
		.surveyRadioProd	{width:100%;}
		
		.surveyRadioProd input[type=radio] + label	{font-size:15px; line-height:30px}
	
	.round-panel-resp-title	{font-size: 30px; font-weight: 600;}
	.round-panel-resp-title-trial	{font-size: 28px; font-weight: 600;}
	.round-panel-resp-title-inner	{font-size: 30px; font-weight: 600;}
	
		.mbi {display:none;}
	
	.reasons-buy-card-buy-container {display: flex; flex-wrap: wrap; flex-direction: column; gap:20px;}
	.reasons-buy-card-buy-item	{width: 100%; height: auto; flex: 1 1 auto; display: flex; flex-direction:row; gap:15px; align-items: center;}

	.rate-ring {width:20px; height:20px; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; font-size: 12px; line-height: 20px}
	.survey-rate-radio label {padding:10px;}
	
	.rate-ring-small {width:20px; height:20px; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; font-size: 12px; line-height: 20px}
	.survey-rate-radio-small label {padding:10px;}
	
		.pink-main-button-hollow {width: 100%;}
	
	

		.comp-item-fill {padding-left: 1.625rem!important; padding-right: 1.625rem!important;}


	.review-flex-wrap {flex-wrap: nowrap; justify-content: center; flex-direction: column;}
	.review-flex-item-fixed {min-width: auto;}
	.review-flex-item {width: 100%;}
	.reviewTextLeftRight {text-align: left}
	
	.save-block + .car-content-pad {margin-top:15px}
	
	.filter-tut-menus {display: flex; flex-direction: column; gap:10px;}
	.filterTutCount {display: block; padding: 0; border-left: none; margin: 0;}
	.plan-col-21	{flex-direction: column; max-width: 100%;}
		
}

@media all and (max-width: 400px) {

}

@media all and (max-width: 380px) {
	
	.lesson-time-est-wrapper {max-width: 100%; grid-column-gap: 20px}
		.home-hero-panel-title {font-size: 1.625rem}
	.home-hero-panel-body {font-size: 1rem}
	.panel-p-body-bold {font-size: 1rem}
	.panel-h4-bold {font-size: 1.125rem}
	.col-comp-item {width: calc(100% / 2);}

	.col-oc	{grid-template-columns: repeat(1, 1fr); grid-gap: 20px; max-width: 235px;}
	
	.compare-scroll-prod-wrapper	{max-width: 280px; margin: 0 auto; transform: translateX(20px);}
	
		


}

@media all and (max-width: 350px) {
	.round-panel-resp-title	{font-size: 26px; font-weight: 600;}
	.round-panel-resp-title-trial	{font-size: 22px; font-weight: 600;}
	.round-panel-resp-title-inner	{font-size: 26px; font-weight: 600;}
		.round-panel-resp-title-trial-small	{font-size: 17px}
	.round-panel-lander-title-inner	{font-size: 26px; font-weight: 600;}
	
	.compare-scroll-prod-wrapper	{width: calc(100vw - 40px);  max-width: 100vw; margin: 0 auto; transform: translateX(20px);}
	
	.plan-col-321 {grid-template-columns: repeat(2, 1fr);}
	
	

}
	
@media all and (max-width: 330px) {
}

@media all and (max-width: 250px) {
	.plan-col-321 {grid-template-columns: repeat(1, 1fr);}
}

	
