* {box-sizing: border-box; font-family: 'Titillium Web', Arial, sans-serif; outline: none; -webkit-tap-highlight-color: transparent;}
html {font-size: 10px;}
html.zoom2 {font-size: 12px;}
html.zoom4 {font-size: 13px;}
body {margin: 0;}
#sh135-temp h1, #sh135-temp h2, #sh135-temp h3, #sh135-temp h4, #sh135-temp h5, #sh135-temp h6, #sh135-temp li, #sh135-temp p, #sh135-temp ul {margin: 0; padding: 0; font-weight: normal; line-height: 1.25;}
#sh135-temp a {text-decoration: none;}
#sh135-temp button {cursor: pointer;}
#sh135-temp ul {list-style: none;}
#sh135-temp img {width: auto; max-width: 100%; height: auto; border: none;}
#sh135-temp textarea {resize: none;}

#sh135-temp .f-12 {font-size: 1.2rem;}
#sh135-temp .f-14 {font-size: 1.4rem;}
#sh135-temp .f-16 {font-size: 1.6rem;}
#sh135-temp .f-18 {font-size: 1.8rem;}
#sh135-temp .f-20 {font-size: 2.0rem;}
#sh135-temp .f-22 {font-size: 2.2rem;}
#sh135-temp .f-24 {font-size: 2.4rem;}
#sh135-temp .f-26 {font-size: 2.6rem;}
#sh135-temp .f-28 {font-size: 2.8rem;}
#sh135-temp .f-30 {font-size: 3.0rem;}
#sh135-temp .f-32 {font-size: 3.2rem;}
#sh135-temp .f-34 {font-size: 3.4rem;}
#sh135-temp .f-36 {font-size: 3.6rem;}
#sh135-temp .f-38 {font-size: 3.8rem;}
#sh135-temp .f-40 {font-size: 4.0rem;}
#sh135-temp .f-42 {font-size: 4.2rem;}
#sh135-temp .f-48 {font-size: 4.8rem;}
#sh135-temp .f-60 {font-size: 6.0rem;}
#sh135-temp .f-68 {font-size: 6.8rem;}
#sh135-temp .f-70 {font-size: 7.0rem;}

#sh135-temp .center {text-align: center;}
#sh135-temp .uppercase {text-transform: uppercase;}
#sh135-temp .thin {font-weight: 300;}
#sh135-temp .bold {font-weight: bold;}
#sh135-temp .semibold {font-weight: 600;}
#sh135-temp .teal {color: #008285;}
#sh135-temp .green {color: #8BCB21;}
#sh135-temp .magenta {color: #E2007E;}

#sh135-temp .special-page-background {position: relative; padding-bottom: 150px; background: #EEF5F6; background: linear-gradient(0deg, rgba(238, 245, 246, 1) 40%, rgba(246, 246, 246, 1) 100%);}
#sh135-temp .special-page-background > * {position: relative; z-index: 2;}
.contrast #sh135-temp .special-page-background {background: #000 !important;}
#sh135-temp .special-page-background .special-bg-decoration {position: absolute; z-index: 1; display: block; width: auto; height: auto; max-height: 100%;}
.contrast #sh135-temp .special-page-background .special-bg-decoration {display: none !important;}
#sh135-temp .special-page-background .special-bg-decoration.decoration-1 {bottom: 20%; left: 0; max-width: 320px;}
#sh135-temp .special-page-background .special-bg-decoration.decoration-2 {bottom: 20%; right: 0; max-width: 325px;}
#sh135-temp .special-page-background .special-bg-decoration.decoration-3 {bottom: 20%; right: 20%; max-width: 350px;}

#sh135-temp {position: relative;}
#sh135-temp .container-box {width: 100%; max-width: 1430px; margin-right: auto; margin-left: auto; padding-right: 15px; padding-left: 15px;}

#sh135-temp .section-space-top {margin-top: 48px;}
#sh135-temp .section-space-bottom {margin-bottom: 48px;}

#sh135-temp .btn-magenta {overflow: hidden; position: relative; z-index: 2; display: flex; align-items: center; justify-content: center; width: 100%; max-width: 300px; padding: 8px 16px; background-color: #E2007E; color: #FFF; border: 1px solid #E2007E; border-radius: 250px; transition: background-color .3s, color .3s, border-color .3s;}
#sh135-temp .btn-magenta:hover {background-color: #AA036C; border-color: #AA036C;}

#sh135-temp .btn-white {overflow: hidden; position: relative; z-index: 2; display: flex; align-items: center; justify-content: center; width: 100%; max-width: 300px; padding: 8px 16px; background-color: #FFF; color: #E2007A; border: 1px solid #E2007E; border-radius: 250px; transition: background-color .3s, color .3s, border-color .3s;}
.contrast #sh135-temp .btn-white {background-color: #000 !important; color: #FFF !important; border-color: #FFE800 !important;}
#sh135-temp .btn-white:hover {background-color: #E2007A; color: #FFF;}
.contrast #sh135-temp .btn-white:hover {background-color: #FFE800 !important; color: #000 !important; border-color: #FFE800 !important;}

#sh135-temp .sh-template-breadcrumbs {display: flex; align-items: center; gap: 6px; padding-top: 32px;}
#sh135-temp .sh-template-breadcrumbs .single-breadcrumbs-text {color: #000;}
#sh135-temp .sh-template-breadcrumbs .single-breadcrumbs-link {color: #757575; text-decoration: none; transition: color .3s;}
#sh135-temp .sh-template-breadcrumbs .single-breadcrumbs-link:hover {color: #E2007A;}
.contrast #sh135-temp .sh-template-breadcrumbs .single-breadcrumbs-link:hover {color: #FFE800 !important;}
#sh135-temp .sh-template-breadcrumbs .breadcrumbs-separator {display: block; min-width: 15px; max-width: 15px; height: auto;}
.contrast #sh135-temp .sh-template-breadcrumbs .breadcrumbs-separator path[fill] {fill: #FFE800 !important;}
.contrast #sh135-temp .sh-template-breadcrumbs .breadcrumbs-separator path[stroke] {stroke: #FFE800 !important;}

#sh135-temp .section-page-heading {position: relative;}
#sh135-temp .section-page-heading .top-info-heading-box {display: flex; flex-direction: column; gap: 24px; margin-bottom: 32px;}
#sh135-temp .section-page-heading .top-info-heading-box .heading-title {line-height: 1.2;}
#sh135-temp .section-page-heading .top-info-heading-box .heading-subtitle {line-height: 1.2;}
.contrast #sh135-temp .section-page-heading .top-info-heading-box .semibold {color: #FFE800 !important;}
#sh135-temp > #sh135-wrapper > .cards > .card {box-shadow: 0 10px 24px 0 rgba(0, 0, 0, 0); transition: box-shadow .3s;}
#sh135-temp > #sh135-wrapper > .cards > .card:hover {box-shadow: 0 10px 24px 0 rgb(33 33 33 / 10%);}

@supports (-webkit-touch-callout: none) {
		#sh135-temp .section-sliding-boxes {min-height: 620px;}
		#sh135-temp .special-page-background {padding-bottom: 140px;}
		#sh135-temp .section-sliding-boxes .sliding-btn {bottom: 8px !important;}
		#sh135-temp .section-sliding-boxes .sliding-boxes-grid {overflow: scroll; padding-bottom: 15px;}
		#sh135-temp .section-sliding-boxes .sliding-boxes-grid::-webkit-scrollbar {display: none;}
}

@media all and (max-width: 1600px) {
		html.zoom-x2 {font-size: 11px !important;}
		html.zoom-x4 {font-size: 12px !important;}

		/*#sh135-temp .f-18 {font-size: 1.6rem;}*/
		#sh135-temp .f-20 {font-size: 1.6rem;}
		#sh135-temp .f-22 {font-size: 1.8rem;}
		#sh135-temp .f-24 {font-size: 1.8rem;}
		#sh135-temp .f-26 {font-size: 2.2rem;}
		#sh135-temp .f-28 {font-size: 2.2rem;}
		#sh135-temp .f-30 {font-size: 2.4rem;}
		#sh135-temp .f-32 {font-size: 2.4rem;}
		#sh135-temp .f-34 {font-size: 2.6rem;}
		/*#sh135-temp .f-36 {font-size: 2.6rem;}*/
		#sh135-temp .f-38 {font-size: 3.0rem;}
		#sh135-temp .f-40 {font-size: 3.0rem;}
		#sh135-temp .f-42 {font-size: 3.2rem;}
		#sh135-temp .f-48 {font-size: 4.0rem;}
		#sh135-temp .f-60 {font-size: 4.8rem;}
		#sh135-temp .f-70 {font-size: 5.2rem;}
}

@media all and (max-width: 1200px) {
		#sh135-temp .f-18 {font-size: 1.7rem;}
		#sh135-temp .f-22 {font-size: 1.6rem;}
		#sh135-temp .f-24 {font-size: 1.6rem;}
		#sh135-temp .f-26 {font-size: 2.0rem;}
		#sh135-temp .f-28 {font-size: 2.0rem;}
		#sh135-temp .f-30 {font-size: 2.2rem;}
		#sh135-temp .f-32 {font-size: 2.2rem;}
		#sh135-temp .f-34 {font-size: 2.4rem;}
		#sh135-temp .f-36 {font-size: 3.2rem;}
		#sh135-temp .f-38 {font-size: 2.8rem;}
		#sh135-temp .f-40 {font-size: 2.8rem;}
		#sh135-temp .f-42 {font-size: 3.0rem;}
		#sh135-temp .f-48 {font-size: 3.4rem;}
		#sh135-temp .f-60 {font-size: 4.0rem;}
		#sh135-temp .f-70 {font-size: 4.6rem;}
}

@media all and (max-width: 768px) {
		#sh135-temp .f-26 {font-size: 1.8rem;}
		#sh135-temp .f-28 {font-size: 1.8rem;}
		#sh135-temp .f-30 {font-size: 2.0rem;}
		#sh135-temp .f-32 {font-size: 2.0rem;}
		#sh135-temp .f-34 {font-size: 2.2rem;}
		#sh135-temp .f-36 {font-size: 3.0rem;}
		#sh135-temp .f-38 {font-size: 2.4rem;}
		#sh135-temp .f-40 {font-size: 2.4rem;}
		#sh135-temp .f-42 {font-size: 2.8rem;}
		#sh135-temp .f-48 {font-size: 2.8rem;}
		#sh135-temp .f-60 {font-size: 3.4rem;}
		#sh135-temp .f-70 {font-size: 3.8rem;}

}

body { background: linear-gradient(90deg, #FFF 0%, #FFF 55%, #D6F4F5 0%); }

#sh135-temp { width: 100%; max-width: 1430px; margin: 20px auto 110px; padding: 0 15px; }
#sh135-temp > #sh135-wrapper > .title { font-weight: 600; }

#sh135-temp > #sh135-wrapper > .cards { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 28px; margin-top: 40px; }
#sh135-temp > #sh135-wrapper > .cards > .card { padding: 2px; background: linear-gradient(272deg, #306EE8, #0B24A0); color: inherit; text-decoration: none; border: none; border-radius: 20px; transition: background 0.4s ease-in-out; outline: none;}
#sh135-temp > #sh135-wrapper > .cards > .card:hover { background: linear-gradient(272deg, #0B24A0, #0B24A0); }

#sh135-temp > #sh135-wrapper > .cards > .card > .inner { display: flex; flex-direction: column; gap: 16px; height: 100%; padding: 40px 40px 35px 40px; background-color: #FFF; border-radius: 18px; }
#sh135-temp > #sh135-wrapper > .cards > .card > .inner > .img { overflow: hidden; width: 100%; height: 134px; border-radius: 8px; }
#sh135-temp > #sh135-wrapper > .cards > .card > .inner > .img > img { width: 100%; height: 100%; object-fit: cover; transition: scale 0.3s; }
#sh135-temp > #sh135-wrapper > .cards > .card:hover > .inner > .img > img { scale: 1.25; }

#sh135-temp > #sh135-wrapper > .cards > .card > .inner > .title { font-weight: 600; }
#sh135-temp > #sh135-wrapper > .cards > .card > .inner > .usage { margin-top: -8px; padding: 8px 16px; background: linear-gradient(130deg, #344CC3 0%, #1D219E 41%, #FF008A 150%); color: #FFF; border-radius: 8px; }
#sh135-temp > #sh135-wrapper > .cards > .card:first-child > .inner > .usage { background: linear-gradient(#306EE8, #679AFF); }
#sh135-temp > #sh135-wrapper > .cards > .card > .inner > .usage > .strong { font-weight: 600; }
#sh135-temp > #sh135-wrapper > .cards > .card > .inner > .subtitle { min-height: 56px; }
#sh135-temp > #sh135-wrapper > .cards > .card > .inner > .descr { min-height: 60px; }

#sh135-temp > #sh135-wrapper > .cards > .card > .inner > .btn { display: flex; align-items: center; gap: 10px; color: #E2007A; font-weight: 600; align-self: flex-end; }
#sh135-temp > #sh135-wrapper > .cards > .card:hover > .inner > .btn { color: #D30072; transition: color 0.4s; }
#sh135-temp > #sh135-wrapper > .cards > .card:hover > .inner > .btn > svg * { stroke: #D30072; }

@media (max-width: 1600px) {
		#sh135-temp > #sh135-wrapper > .cards > .card > .inner > .subtitle { min-height: 45px; }
}

@media (max-width: 1500px) {
		#sh135-temp > #sh135-wrapper > .cards > .card > .inner { padding: 30px; }
}

@media (max-width: 1400px) {
		#sh135-temp > #sh135-wrapper > .cards > .card > .inner { padding: 20px; }
}

@media (max-width: 1350px) {
		body {background: inherit !important;}
}

@media (max-width: 1300px) {
		#sh135-temp > #sh135-wrapper > .cards { gap: 16px; }
		#sh135-temp > #sh135-wrapper > .cards > .card > .inner > .usage > strong { display: inline-block; }
}

@media (max-width: 1130px) {
		#sh135-temp > #sh135-wrapper > .cards { grid-template-columns: 1fr 1fr; gap: 28px; }
}

@media (max-width: 800px) {
		#sh135-temp > #sh135-wrapper > .cards { gap: 16px; }
		#sh135-temp > #sh135-wrapper > .cards > .card > .inner > .descr { min-height: 90px; }
		#sh135-temp > #sh135-wrapper > .cards > .card > .inner > .subtitle { min-height: 68px; }

}

@media (max-width: 650px) {
		#sh135-temp > #sh135-wrapper > .cards { grid-template-columns: 1fr; gap: 16px; }
		#sh135-temp > #sh135-wrapper > .cards > .card > .inner > .descr { min-height: fit-content; }
		#sh135-temp > #sh135-wrapper > .cards > .card > .inner > .subtitle { min-height: fit-content; }

		#sh135-temp .sh-template-breadcrumbs {justify-content: center;}
		#sh135-temp > #sh135-wrapper > .title {text-align: center;}
}

#sh135-temp > #sh135-wrapper > .cards > .card {transform: translateY(30px); opacity: 0; transition: opacity 1s ease-out, transform 1s ease-out;}
#sh135-temp > #sh135-wrapper > .cards > .card.animate-in {transform: translateY(0); opacity: 1;}

@media all and (max-width: 900px) {
		#sh135-temp .sh-template-breadcrumbs .single-breadcrumbs-text {font-size: 1.6rem;}
		#sh135-temp > #sh135-wrapper > .title {font-size: 3.0rem;}
}

@media all and (max-width: 550px) {
		#sh135-temp .sh-template-breadcrumbs .single-breadcrumbs-text {font-size: 1.6rem;}
		#sh135-temp > #sh135-wrapper > .title {font-size: 2.4rem;}
}
