/*
please use https://cssminifier.com/ to minify the css file before production

CSS FOR FRONT PAGE
*/
:root {
	--bg-color: #e6e6e6;
	--support-tile-bg-color: #fdfdfd;
	--support-tile-bg-hover: #0f6692;
}
.googlefonts {
	visibility: hidden;
	height: 0px;
}

.googlefonts.bitter {
	font-family: 'Bitter', serif;
}

.googlefonts.cinzel {
	font-family: 'Cinzel', serif;
}

.googlefonts.comicneue {
	font-family: 'Comic Neue', cursive;
}

.googlefonts.courierprime {
	font-family: 'Courier Prime', monospace;
}

.googlefonts.dmsans {
	font-family: 'DM Sans', sans-serif;
}

.googlefonts.dotgothic16 {
	font-family: 'DotGothic16', sans-serif;
}

.googlefonts.fascinate {
	font-family: 'Fascinate', cursive;
}

.googlefonts.firasanscondensed {
	font-family: 'Fira Sans Condensed', sans-serif;
}

.googlefonts.fredokaone {
	font-family: 'Fredoka One', cursive;
}

.googlefonts.indieflower {
	font-family: 'Indie Flower', cursive;
}

.googlefonts.kronaone {
	font-family: 'Krona One', sans-serif;
}

.googlefonts.lobster {
	font-family: 'Lobster', cursive;
}

.googlefonts.oi {
	font-family: 'Oi', cursive;
}

.googlefonts.opensans {
	font-family: 'Open Sans', sans-serif;
}

.googlefonts.pacifico {
	font-family: 'Pacifico', cursive;
}

.googlefonts.permanentmarker {
	font-family: 'Permanent Marker', cursive;
}

.googlefonts.rammettoone {
	font-family: 'Rammetto One', cursive;
}

.googlefonts.rozhaone {
	font-family: 'Rozha One', serif;
}

.googlefonts.shadowsintolight {
	font-family: 'Shadows Into Light', cursive;
}

.googlefonts.stick {
	font-family: 'Stick', sans-serif;
}

.googlefonts.yanonekaffeesatz {
	font-family: 'Yanone Kaffeesatz', sans-serif;
}

.googlefonts.rampartone {
	font-family: 'Rampart One', cursive;
}

.googlefonts.blackopsone {
	font-family: 'Black Ops One', cursive;
}

.googlefonts.brunoace {
	font-family: 'Bruno Ace', cursive;
}

.googlefonts.creepster {
	font-family: 'Creepster', cursive;
}

.googlefonts.luckiestguy {
	font-family: 'Luckiest Guy', cursive;
}

.googlefonts.unifrakturmaguntia {
	font-family: 'UnifrakturMaguntia', cursive;
}

.googlefonts.librebaskerville {
	ont-family: 'Libre Baskerville', serif;
}

/* FONT PATH */
@font-face {
	font-family: 'FontAwesome';
	src: url('../fonts/fontawesome-webfont.eot?v=4.7.0');
	src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'), url('../fonts/fontawesome-webfont.woff?v=4.3.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.3.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular') format('svg');
	font-weight: normal;
	font-style: normal;
}

.fa {
	display: inline-block;
	font: normal normal normal 14px/1 FontAwesome;
	font-size: inherit;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	transform: translate(0, 0);
}

/* makes the font 33% larger relative to the icon container */
.fa-lg {
	font-size: 1.33333333em;
	line-height: 0.75em;
	vertical-align: -15%;
}

.fa-2x {
	font-size: 2em;
}

.fa-3x {
	font-size: 3em;
}

.fa-4x {
	font-size: 4em;
}

.fa-5x {
	font-size: 5em;
}

.fa-fw {
	width: 1.28571429em;
	text-align: center;
}

.fa-ul {
	padding-left: 0;
	margin-left: 2.14285714em;
	list-style-type: none;
}

.fa-ul>li {
	position: relative;
}

.fa-li {
	position: absolute;
	left: -2.14285714em;
	width: 2.14285714em;
	top: 0.14285714em;
	text-align: center;
}

.fa-li.fa-lg {
	left: -1.85714286em;
}

.fa-border {
	padding: .2em .25em .15em;
	border: solid 0.08em #eee;
	border-radius: .1em;
}

/* Font Awesome Colors */
.fa-black {
	color: #000;
}

.fa-green {
	color: #00B928;
}

.fa-yellow {
	color: #A4A703;
}

.fa-gold {
	color: #FFD700;
}

.fa-red {
	color: #D82929;
}

.fa-blue {
	color: #446BF7;
}

.fa-gray,
.icon-gray {
	color: #A59C9C;
}

.pull-right {
	float: right;
}

.pull-left {
	float: left;
}

.fa.pull-left {
	margin-right: .3em;
}

.fa.pull-right {
	margin-left: .3em;
}

.fa-spin {
	-webkit-animation: fa-spin 2s infinite linear;
	animation: fa-spin 2s infinite linear;
}

.fa-pulse {
	-webkit-animation: fa-spin 1s infinite steps(8);
	animation: fa-spin 1s infinite steps(8);
}

@-webkit-keyframes fa-spin {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	100% {
		-webkit-transform: rotate(359deg);
		transform: rotate(359deg);
	}
}

@keyframes fa-spin {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	100% {
		-webkit-transform: rotate(359deg);
		transform: rotate(359deg);
	}
}

.fa-rotate-90 {
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
	-webkit-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	transform: rotate(90deg);
}

.fa-rotate-180 {
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
	-webkit-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	transform: rotate(180deg);
}

.fa-rotate-270 {
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
	-webkit-transform: rotate(270deg);
	-ms-transform: rotate(270deg);
	transform: rotate(270deg);
}

.fa-flip-horizontal {
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);
	-webkit-transform: scale(-1, 1);
	-ms-transform: scale(-1, 1);
	transform: scale(-1, 1);
}

.fa-flip-vertical {
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);
	-webkit-transform: scale(1, -1);
	-ms-transform: scale(1, -1);
	transform: scale(1, -1);
}

:root .fa-rotate-90,
:root .fa-rotate-180,
:root .fa-rotate-270,
:root .fa-flip-horizontal,
:root .fa-flip-vertical {
	filter: none;
}

.fa-stack {
	position: relative;
	display: inline-block;
	width: 2em;
	height: 2em;
	line-height: 2em;
	vertical-align: middle;
}

.fa-stack-1x,
.fa-stack-2x {
	position: absolute;
	left: 0;
	width: 100%;
	text-align: center;
}

.fa-stack-1x {
	line-height: inherit;
}

.fa-stack-2x {
	font-size: 2em;
}

.fa-inverse {
	color: #fff;
}

/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
   readers do not read off random characters that represent icons */
.fa-glass:before {
	content: "\f000";
}

.fa-music:before {
	content: "\f001";
}

.fa-search:before {
	content: "\f002";
}

.fa-envelope-o:before {
	content: "\f003";
}

.fa-heart:before {
	content: "\f004";
}

.fa-star:before {
	content: "\f005";
}

.fa-star-o:before {
	content: "\f006";
}

.fa-user:before {
	content: "\f007";
}

.fa-film:before {
	content: "\f008";
}

.fa-th-large:before {
	content: "\f009";
}

.fa-th:before {
	content: "\f00a";
}

.fa-th-list:before {
	content: "\f00b";
}

.fa-check:before {
	content: "\f00c";
}

.fa-remove:before,
.fa-close:before,
.fa-times:before {
	content: "\f00d";
}

.fa-search-plus:before {
	content: "\f00e";
}

.fa-search-minus:before {
	content: "\f010";
}

.fa-power-off:before {
	content: "\f011";
}

.fa-signal:before {
	content: "\f012";
}

.fa-gear:before,
.fa-cog:before {
	content: "\f013";
}

.fa-trash-o:before {
	content: "\f014";
}

.fa-home:before {
	content: "\f015";
}

.fa-file-o:before {
	content: "\f016";
}

.fa-clock-o:before {
	content: "\f017";
}

.fa-road:before {
	content: "\f018";
}

.fa-download:before {
	content: "\f019";
}

.fa-arrow-circle-o-down:before {
	content: "\f01a";
}

.fa-arrow-circle-o-up:before {
	content: "\f01b";
}

.fa-inbox:before {
	content: "\f01c";
}

.fa-play-circle-o:before {
	content: "\f01d";
}

.fa-rotate-right:before,
.fa-repeat:before {
	content: "\f01e";
}

.fa-refresh:before {
	content: "\f021";
}

.fa-list-alt:before {
	content: "\f022";
}

.fa-lock:before {
	content: "\f023";
}

.fa-flag:before {
	content: "\f024";
}

.fa-headphones:before {
	content: "\f025";
}

.fa-volume-off:before {
	content: "\f026";
}

.fa-volume-down:before {
	content: "\f027";
}

.fa-volume-up:before {
	content: "\f028";
}

.fa-qrcode:before {
	content: "\f029";
}

.fa-barcode:before {
	content: "\f02a";
}

.fa-tag:before {
	content: "\f02b";
}

.fa-tags:before {
	content: "\f02c";
}

.fa-book:before {
	content: "\f02d";
}

.fa-bookmark:before {
	content: "\f02e";
}

.fa-print:before {
	content: "\f02f";
}

.fa-camera:before {
	content: "\f030";
}

.fa-font:before {
	content: "\f031";
}

.fa-bold:before {
	content: "\f032";
}

.fa-italic:before {
	content: "\f033";
}

.fa-text-height:before {
	content: "\f034";
}

.fa-text-width:before {
	content: "\f035";
}

.fa-align-left:before {
	content: "\f036";
}

.fa-align-center:before {
	content: "\f037";
}

.fa-align-right:before {
	content: "\f038";
}

.fa-align-justify:before {
	content: "\f039";
}

.fa-list:before {
	content: "\f03a";
}

.fa-dedent:before,
.fa-outdent:before {
	content: "\f03b";
}

.fa-indent:before {
	content: "\f03c";
}

.fa-video-camera:before {
	content: "\f03d";
}

.fa-photo:before,
.fa-image:before,
.fa-picture-o:before {
	content: "\f03e";
}

.fa-pencil:before {
	content: "\f040";
}

.fa-map-marker:before {
	content: "\f041";
}

.fa-adjust:before {
	content: "\f042";
}

.fa-tint:before {
	content: "\f043";
}

.fa-edit:before,
.fa-pencil-square-o:before {
	content: "\f044";
}

.fa-share-square-o:before {
	content: "\f045";
}

.fa-check-square-o:before {
	content: "\f046";
}

.fa-arrows:before {
	content: "\f047";
}

.fa-step-backward:before {
	content: "\f048";
}

.fa-fast-backward:before {
	content: "\f049";
}

.fa-backward:before {
	content: "\f04a";
}

.fa-play:before {
	content: "\f04b";
}

.fa-pause:before {
	content: "\f04c";
}

.fa-stop:before {
	content: "\f04d";
}

.fa-forward:before {
	content: "\f04e";
}

.fa-fast-forward:before {
	content: "\f050";
}

.fa-step-forward:before {
	content: "\f051";
}

.fa-eject:before {
	content: "\f052";
}

.fa-chevron-left:before {
	content: "\f053";
}

.fa-chevron-right:before {
	content: "\f054";
}

.fa-plus-circle:before {
	content: "\f055";
}

.fa-minus-circle:before {
	content: "\f056";
}

.fa-times-circle:before {
	content: "\f057";
}

.fa-check-circle:before {
	content: "\f058";
}

.fa-question-circle:before {
	content: "\f059";
}

.fa-info-circle:before {
	content: "\f05a";
}

.fa-crosshairs:before {
	content: "\f05b";
}

.fa-times-circle-o:before {
	content: "\f05c";
}

.fa-check-circle-o:before {
	content: "\f05d";
}

.fa-ban:before {
	content: "\f05e";
}

.fa-arrow-left:before {
	content: "\f060";
}

.fa-arrow-right:before {
	content: "\f061";
}

.fa-arrow-up:before {
	content: "\f062";
}

.fa-arrow-down:before {
	content: "\f063";
}

.fa-mail-forward:before,
.fa-share:before {
	content: "\f064";
}

.fa-expand:before {
	content: "\f065";
}

.fa-compress:before {
	content: "\f066";
}

.fa-plus:before {
	content: "\f067";
}

.fa-minus:before {
	content: "\f068";
}

.fa-asterisk:before {
	content: "\f069";
}

.fa-exclamation-circle:before {
	content: "\f06a";
}

.fa-gift:before {
	content: "\f06b";
}

.fa-leaf:before {
	content: "\f06c";
}

.fa-fire:before {
	content: "\f06d";
}

.fa-eye:before {
	content: "\f06e";
}

.fa-eye-slash:before {
	content: "\f070";
}

.fa-warning:before,
.fa-exclamation-triangle:before {
	content: "\f071";
}

.fa-plane:before {
	content: "\f072";
}

.fa-calendar:before {
	content: "\f073";
}

.fa-random:before {
	content: "\f074";
}

.fa-comment:before {
	content: "\f075";
}

.fa-magnet:before {
	content: "\f076";
}

.fa-chevron-up:before {
	content: "\f077";
}

.fa-chevron-down:before {
	content: "\f078";
}

.fa-retweet:before {
	content: "\f079";
}

.fa-shopping-cart:before {
	content: "\f07a";
}

.fa-folder:before {
	content: "\f07b";
}

.fa-folder-open:before {
	content: "\f07c";
}

.fa-arrows-v:before {
	content: "\f07d";
}

.fa-arrows-h:before {
	content: "\f07e";
}

.fa-bar-chart-o:before,
.fa-bar-chart:before {
	content: "\f080";
}

.fa-twitter-square:before {
	content: "\f081";
}

.fa-facebook-square:before {
	content: "\f082";
}

.fa-camera-retro:before {
	content: "\f083";
}

.fa-key:before {
	content: "\f084";
}

.fa-gears:before,
.fa-cogs:before {
	content: "\f085";
}

.fa-comments:before {
	content: "\f086";
}

.fa-thumbs-o-up:before {
	content: "\f087";
}

.fa-thumbs-o-down:before {
	content: "\f088";
}

.fa-star-half:before {
	content: "\f089";
}

.fa-heart-o:before {
	content: "\f08a";
}

.fa-sign-out:before {
	content: "\f08b";
}

.fa-linkedin-square:before {
	content: "\f08c";
}

.fa-thumb-tack:before {
	content: "\f08d";
}

.fa-external-link:before {
	content: "\f08e";
}

.fa-sign-in:before {
	content: "\f090";
}

.fa-trophy:before {
	content: "\f091";
}

.fa-github-square:before {
	content: "\f092";
}

.fa-upload:before {
	content: "\f093";
}

.fa-lemon-o:before {
	content: "\f094";
}

.fa-phone:before {
	content: "\f095";
}

.fa-square-o:before {
	content: "\f096";
}

.fa-bookmark-o:before {
	content: "\f097";
}

.fa-phone-square:before {
	content: "\f098";
}

.fa-twitter:before {
	content: "\f099";
}

.fa-facebook-f:before,
.fa-facebook:before {
	content: "\f09a";
}

.fa-github:before {
	content: "\f09b";
}

.fa-unlock:before {
	content: "\f09c";
}

.fa-credit-card:before {
	content: "\f09d";
}

.fa-rss:before {
	content: "\f09e";
}

.fa-hdd-o:before {
	content: "\f0a0";
}

.fa-bullhorn:before {
	content: "\f0a1";
}

.fa-bell:before {
	content: "\f0f3";
}

.fa-certificate:before {
	content: "\f0a3";
}

.fa-hand-o-right:before {
	content: "\f0a4";
}

.fa-hand-o-left:before {
	content: "\f0a5";
}

.fa-hand-o-up:before {
	content: "\f0a6";
}

.fa-hand-o-down:before {
	content: "\f0a7";
}

.fa-arrow-circle-left:before {
	content: "\f0a8";
}

.fa-arrow-circle-right:before {
	content: "\f0a9";
}

.fa-arrow-circle-up:before {
	content: "\f0aa";
}

.fa-arrow-circle-down:before {
	content: "\f0ab";
}

.fa-globe:before {
	content: "\f0ac";
}

.fa-wrench:before {
	content: "\f0ad";
}

.fa-tasks:before {
	content: "\f0ae";
}

.fa-filter:before {
	content: "\f0b0";
}

.fa-briefcase:before {
	content: "\f0b1";
}

.fa-arrows-alt:before {
	content: "\f0b2";
}

.fa-group:before,
.fa-users:before {
	content: "\f0c0";
}

.fa-chain:before,
.fa-link:before {
	content: "\f0c1";
}

.fa-cloud:before {
	content: "\f0c2";
}

.fa-flask:before {
	content: "\f0c3";
}

.fa-cut:before,
.fa-scissors:before {
	content: "\f0c4";
}

.fa-copy:before,
.fa-files-o:before {
	content: "\f0c5";
}

.fa-paperclip:before {
	content: "\f0c6";
}

.fa-save:before,
.fa-floppy-o:before {
	content: "\f0c7";
}

.fa-square:before {
	content: "\f0c8";
}

.fa-navicon:before,
.fa-reorder:before,
.fa-bars:before {
	content: "\f0c9";
}

.fa-list-ul:before {
	content: "\f0ca";
}

.fa-list-ol:before {
	content: "\f0cb";
}

.fa-strikethrough:before {
	content: "\f0cc";
}

.fa-underline:before {
	content: "\f0cd";
}

.fa-table:before {
	content: "\f0ce";
}

.fa-magic:before {
	content: "\f0d0";
}

.fa-truck:before {
	content: "\f0d1";
}

.fa-pinterest:before {
	content: "\f0d2";
}

.fa-pinterest-square:before {
	content: "\f0d3";
}

.fa-google-plus-square:before {
	content: "\f0d4";
}

.fa-google-plus:before {
	content: "\f0d5";
}

.fa-money:before {
	content: "\f0d6";
}

.fa-caret-down:before {
	content: "\f0d7";
}

.fa-caret-up:before {
	content: "\f0d8";
}

.fa-caret-left:before {
	content: "\f0d9";
}

.fa-caret-right:before {
	content: "\f0da";
}

.fa-columns:before {
	content: "\f0db";
}

.fa-unsorted:before,
.fa-sort:before {
	content: "\f0dc";
}

.fa-sort-down:before,
.fa-sort-desc:before {
	content: "\f0dd";
}

.fa-sort-up:before,
.fa-sort-asc:before {
	content: "\f0de";
}

.fa-envelope:before {
	content: "\f0e0";
}

.fa-linkedin:before {
	content: "\f0e1";
}

.fa-rotate-left:before,
.fa-undo:before {
	content: "\f0e2";
}

.fa-legal:before,
.fa-gavel:before {
	content: "\f0e3";
}

.fa-dashboard:before,
.fa-tachometer:before {
	content: "\f0e4";
}

.fa-comment-o:before {
	content: "\f0e5";
}

.fa-comments-o:before {
	content: "\f0e6";
}

.fa-flash:before,
.fa-bolt:before {
	content: "\f0e7";
}

.fa-sitemap:before {
	content: "\f0e8";
}

.fa-umbrella:before {
	content: "\f0e9";
}

.fa-paste:before,
.fa-clipboard:before {
	content: "\f0ea";
}

.fa-lightbulb-o:before {
	content: "\f0eb";
}

.fa-exchange:before {
	content: "\f0ec";
}

.fa-cloud-download:before {
	content: "\f0ed";
}

.fa-cloud-upload:before {
	content: "\f0ee";
}

.fa-user-md:before {
	content: "\f0f0";
}

.fa-stethoscope:before {
	content: "\f0f1";
}

.fa-suitcase:before {
	content: "\f0f2";
}

.fa-bell-o:before {
	content: "\f0a2";
}

.fa-coffee:before {
	content: "\f0f4";
}

.fa-cutlery:before {
	content: "\f0f5";
}

.fa-file-text-o:before {
	content: "\f0f6";
}

.fa-building-o:before {
	content: "\f0f7";
}

.fa-hospital-o:before {
	content: "\f0f8";
}

.fa-ambulance:before {
	content: "\f0f9";
}

.fa-medkit:before {
	content: "\f0fa";
}

.fa-fighter-jet:before {
	content: "\f0fb";
}

.fa-beer:before {
	content: "\f0fc";
}

.fa-h-square:before {
	content: "\f0fd";
}

.fa-plus-square:before {
	content: "\f0fe";
}

.fa-angle-double-left:before {
	content: "\f100";
}

.fa-angle-double-right:before {
	content: "\f101";
}

.fa-angle-double-up:before {
	content: "\f102";
}

.fa-angle-double-down:before {
	content: "\f103";
}

.fa-angle-left:before {
	content: "\f104";
}

.fa-angle-right:before {
	content: "\f105";
}

.fa-angle-up:before {
	content: "\f106";
}

.fa-angle-down:before {
	content: "\f107";
}

.fa-desktop:before {
	content: "\f108";
}

.fa-laptop:before {
	content: "\f109";
}

.fa-tablet:before {
	content: "\f10a";
}

.fa-mobile-phone:before,
.fa-mobile:before {
	content: "\f10b";
}

.fa-circle-o:before {
	content: "\f10c";
}

.fa-quote-left:before {
	content: "\f10d";
}

.fa-quote-right:before {
	content: "\f10e";
}

.fa-spinner:before {
	content: "\f110";
}

.fa-circle:before {
	content: "\f111";
}

.fa-mail-reply:before,
.fa-reply:before {
	content: "\f112";
}

.fa-github-alt:before {
	content: "\f113";
}

.fa-folder-o:before {
	content: "\f114";
}

.fa-folder-open-o:before {
	content: "\f115";
}

.fa-smile-o:before {
	content: "\f118";
}

.fa-frown-o:before {
	content: "\f119";
}

.fa-meh-o:before {
	content: "\f11a";
}

.fa-gamepad:before {
	content: "\f11b";
}

.fa-keyboard-o:before {
	content: "\f11c";
}

.fa-flag-o:before {
	content: "\f11d";
}

.fa-flag-checkered:before {
	content: "\f11e";
}

.fa-terminal:before {
	content: "\f120";
}

.fa-code:before {
	content: "\f121";
}

.fa-mail-reply-all:before,
.fa-reply-all:before {
	content: "\f122";
}

.fa-star-half-empty:before,
.fa-star-half-full:before,
.fa-star-half-o:before {
	content: "\f123";
}

.fa-location-arrow:before {
	content: "\f124";
}

.fa-crop:before {
	content: "\f125";
}

.fa-code-fork:before {
	content: "\f126";
}

.fa-unlink:before,
.fa-chain-broken:before {
	content: "\f127";
}

.fa-question:before {
	content: "\f128";
}

.fa-info:before {
	content: "\f129";
}

.fa-exclamation:before {
	content: "\f12a";
}

.fa-superscript:before {
	content: "\f12b";
}

.fa-subscript:before {
	content: "\f12c";
}

.fa-eraser:before {
	content: "\f12d";
}

.fa-puzzle-piece:before {
	content: "\f12e";
}

.fa-microphone:before {
	content: "\f130";
}

.fa-microphone-slash:before {
	content: "\f131";
}

.fa-shield:before {
	content: "\f132";
}

.fa-calendar-o:before {
	content: "\f133";
}

.fa-fire-extinguisher:before {
	content: "\f134";
}

.fa-rocket:before {
	content: "\f135";
}

.fa-maxcdn:before {
	content: "\f136";
}

.fa-chevron-circle-left:before {
	content: "\f137";
}

.fa-chevron-circle-right:before {
	content: "\f138";
}

.fa-chevron-circle-up:before {
	content: "\f139";
}

.fa-chevron-circle-down:before {
	content: "\f13a";
}

.fa-html5:before {
	content: "\f13b";
}

.fa-css3:before {
	content: "\f13c";
}

.fa-anchor:before {
	content: "\f13d";
}

.fa-unlock-alt:before {
	content: "\f13e";
}

.fa-bullseye:before {
	content: "\f140";
}

.fa-ellipsis-h:before {
	content: "\f141";
}

.fa-ellipsis-v:before {
	content: "\f142";
}

.fa-rss-square:before {
	content: "\f143";
}

.fa-play-circle:before {
	content: "\f144";
}

.fa-ticket:before {
	content: "\f145";
}

.fa-minus-square:before {
	content: "\f146";
}

.fa-minus-square-o:before {
	content: "\f147";
}

.fa-level-up:before {
	content: "\f148";
}

.fa-level-down:before {
	content: "\f149";
}

.fa-check-square:before {
	content: "\f14a";
}

.fa-pencil-square:before {
	content: "\f14b";
}

.fa-external-link-square:before {
	content: "\f14c";
}

.fa-share-square:before {
	content: "\f14d";
}

.fa-compass:before {
	content: "\f14e";
}

.fa-toggle-down:before,
.fa-caret-square-o-down:before {
	content: "\f150";
}

.fa-toggle-up:before,
.fa-caret-square-o-up:before {
	content: "\f151";
}

.fa-toggle-right:before,
.fa-caret-square-o-right:before {
	content: "\f152";
}

.fa-euro:before,
.fa-eur:before {
	content: "\f153";
}

.fa-gbp:before {
	content: "\f154";
}

.fa-dollar:before,
.fa-usd:before {
	content: "\f155";
}

.fa-rupee:before,
.fa-inr:before {
	content: "\f156";
}

.fa-cny:before,
.fa-rmb:before,
.fa-yen:before,
.fa-jpy:before {
	content: "\f157";
}

.fa-ruble:before,
.fa-rouble:before,
.fa-rub:before {
	content: "\f158";
}

.fa-won:before,
.fa-krw:before {
	content: "\f159";
}

.fa-bitcoin:before,
.fa-btc:before {
	content: "\f15a";
}

.fa-file:before {
	content: "\f15b";
}

.fa-file-text:before {
	content: "\f15c";
}

.fa-sort-alpha-asc:before {
	content: "\f15d";
}

.fa-sort-alpha-desc:before {
	content: "\f15e";
}

.fa-sort-amount-asc:before {
	content: "\f160";
}

.fa-sort-amount-desc:before {
	content: "\f161";
}

.fa-sort-numeric-asc:before {
	content: "\f162";
}

.fa-sort-numeric-desc:before {
	content: "\f163";
}

.fa-thumbs-up:before {
	content: "\f164";
}

.fa-thumbs-down:before {
	content: "\f165";
}

.fa-youtube-square:before {
	content: "\f166";
}

.fa-youtube:before {
	content: "\f167";
}

.fa-xing:before {
	content: "\f168";
}

.fa-xing-square:before {
	content: "\f169";
}

.fa-youtube-play:before {
	content: "\f16a";
}

.fa-dropbox:before {
	content: "\f16b";
}

.fa-stack-overflow:before {
	content: "\f16c";
}

.fa-instagram:before {
	content: "\f16d";
}

.fa-flickr:before {
	content: "\f16e";
}

.fa-adn:before {
	content: "\f170";
}

.fa-bitbucket:before {
	content: "\f171";
}

.fa-bitbucket-square:before {
	content: "\f172";
}

.fa-tumblr:before {
	content: "\f173";
}

.fa-tumblr-square:before {
	content: "\f174";
}

.fa-long-arrow-down:before {
	content: "\f175";
}

.fa-long-arrow-up:before {
	content: "\f176";
}

.fa-long-arrow-left:before {
	content: "\f177";
}

.fa-long-arrow-right:before {
	content: "\f178";
}

.fa-apple:before {
	content: "\f179";
}

.fa-windows:before {
	content: "\f17a";
}

.fa-android:before {
	content: "\f17b";
}

.fa-linux:before {
	content: "\f17c";
}

.fa-dribbble:before {
	content: "\f17d";
}

.fa-skype:before {
	content: "\f17e";
}

.fa-foursquare:before {
	content: "\f180";
}

.fa-trello:before {
	content: "\f181";
}

.fa-female:before {
	content: "\f182";
}

.fa-male:before {
	content: "\f183";
}

.fa-gittip:before,
.fa-gratipay:before {
	content: "\f184";
}

.fa-sun-o:before {
	content: "\f185";
}

.fa-moon-o:before {
	content: "\f186";
}

.fa-archive:before {
	content: "\f187";
}

.fa-bug:before {
	content: "\f188";
}

.fa-vk:before {
	content: "\f189";
}

.fa-weibo:before {
	content: "\f18a";
}

.fa-renren:before {
	content: "\f18b";
}

.fa-pagelines:before {
	content: "\f18c";
}

.fa-stack-exchange:before {
	content: "\f18d";
}

.fa-arrow-circle-o-right:before {
	content: "\f18e";
}

.fa-arrow-circle-o-left:before {
	content: "\f190";
}

.fa-toggle-left:before,
.fa-caret-square-o-left:before {
	content: "\f191";
}

.fa-dot-circle-o:before {
	content: "\f192";
}

.fa-wheelchair:before {
	content: "\f193";
}

.fa-vimeo-square:before {
	content: "\f194";
}

.fa-turkish-lira:before,
.fa-try:before {
	content: "\f195";
}

.fa-plus-square-o:before {
	content: "\f196";
}

.fa-space-shuttle:before {
	content: "\f197";
}

.fa-slack:before {
	content: "\f198";
}

.fa-envelope-square:before {
	content: "\f199";
}

.fa-wordpress:before {
	content: "\f19a";
}

.fa-openid:before {
	content: "\f19b";
}

.fa-institution:before,
.fa-bank:before,
.fa-university:before {
	content: "\f19c";
}

.fa-mortar-board:before,
.fa-graduation-cap:before {
	content: "\f19d";
}

.fa-yahoo:before {
	content: "\f19e";
}

.fa-google:before {
	content: "\f1a0";
}

.fa-reddit:before {
	content: "\f1a1";
}

.fa-reddit-square:before {
	content: "\f1a2";
}

.fa-stumbleupon-circle:before {
	content: "\f1a3";
}

.fa-stumbleupon:before {
	content: "\f1a4";
}

.fa-delicious:before {
	content: "\f1a5";
}

.fa-digg:before {
	content: "\f1a6";
}

.fa-pied-piper:before {
	content: "\f1a7";
}

.fa-pied-piper-alt:before {
	content: "\f1a8";
}

.fa-drupal:before {
	content: "\f1a9";
}

.fa-joomla:before {
	content: "\f1aa";
}

.fa-language:before {
	content: "\f1ab";
}

.fa-fax:before {
	content: "\f1ac";
}

.fa-building:before {
	content: "\f1ad";
}

.fa-child:before {
	content: "\f1ae";
}

.fa-paw:before {
	content: "\f1b0";
}

.fa-spoon:before {
	content: "\f1b1";
}

.fa-cube:before {
	content: "\f1b2";
}

.fa-cubes:before {
	content: "\f1b3";
}

.fa-behance:before {
	content: "\f1b4";
}

.fa-behance-square:before {
	content: "\f1b5";
}

.fa-steam:before {
	content: "\f1b6";
}

.fa-steam-square:before {
	content: "\f1b7";
}

.fa-recycle:before {
	content: "\f1b8";
}

.fa-automobile:before,
.fa-car:before {
	content: "\f1b9";
}

.fa-cab:before,
.fa-taxi:before {
	content: "\f1ba";
}

.fa-tree:before {
	content: "\f1bb";
}

.fa-spotify:before {
	content: "\f1bc";
}

.fa-deviantart:before {
	content: "\f1bd";
}

.fa-soundcloud:before {
	content: "\f1be";
}

.fa-database:before {
	content: "\f1c0";
}

.fa-file-pdf-o:before {
	content: "\f1c1";
}

.fa-file-word-o:before {
	content: "\f1c2";
}

.fa-file-excel-o:before {
	content: "\f1c3";
}

.fa-file-powerpoint-o:before {
	content: "\f1c4";
}

.fa-file-photo-o:before,
.fa-file-picture-o:before,
.fa-file-image-o:before {
	content: "\f1c5";
}

.fa-file-zip-o:before,
.fa-file-archive-o:before {
	content: "\f1c6";
}

.fa-file-sound-o:before,
.fa-file-audio-o:before {
	content: "\f1c7";
}

.fa-file-movie-o:before,
.fa-file-video-o:before {
	content: "\f1c8";
}

.fa-file-code-o:before {
	content: "\f1c9";
}

.fa-vine:before {
	content: "\f1ca";
}

.fa-codepen:before {
	content: "\f1cb";
}

.fa-jsfiddle:before {
	content: "\f1cc";
}

.fa-life-bouy:before,
.fa-life-buoy:before,
.fa-life-saver:before,
.fa-support:before,
.fa-life-ring:before {
	content: "\f1cd";
}

.fa-circle-o-notch:before {
	content: "\f1ce";
}

.fa-ra:before,
.fa-rebel:before {
	content: "\f1d0";
}

.fa-ge:before,
.fa-empire:before {
	content: "\f1d1";
}

.fa-git-square:before {
	content: "\f1d2";
}

.fa-git:before {
	content: "\f1d3";
}

.fa-hacker-news:before {
	content: "\f1d4";
}

.fa-tencent-weibo:before {
	content: "\f1d5";
}

.fa-qq:before {
	content: "\f1d6";
}

.fa-wechat:before,
.fa-weixin:before {
	content: "\f1d7";
}

.fa-send:before,
.fa-paper-plane:before {
	content: "\f1d8";
}

.fa-send-o:before,
.fa-paper-plane-o:before {
	content: "\f1d9";
}

.fa-history:before {
	content: "\f1da";
}

.fa-genderless:before,
.fa-circle-thin:before {
	content: "\f1db";
}

.fa-header:before {
	content: "\f1dc";
}

.fa-paragraph:before {
	content: "\f1dd";
}

.fa-sliders:before {
	content: "\f1de";
}

.fa-share-alt:before {
	content: "\f1e0";
}

.fa-share-alt-square:before {
	content: "\f1e1";
}

.fa-bomb:before {
	content: "\f1e2";
}

.fa-soccer-ball-o:before,
.fa-futbol-o:before {
	content: "\f1e3";
}

.fa-tty:before {
	content: "\f1e4";
}

.fa-binoculars:before {
	content: "\f1e5";
}

.fa-plug:before {
	content: "\f1e6";
}

.fa-slideshare:before {
	content: "\f1e7";
}

.fa-twitch:before {
	content: "\f1e8";
}

.fa-yelp:before {
	content: "\f1e9";
}

.fa-newspaper-o:before {
	content: "\f1ea";
}

.fa-wifi:before {
	content: "\f1eb";
}

.fa-calculator:before {
	content: "\f1ec";
}

.fa-paypal:before {
	content: "\f1ed";
}

.fa-google-wallet:before {
	content: "\f1ee";
}

.fa-cc-visa:before {
	content: "\f1f0";
}

.fa-cc-mastercard:before {
	content: "\f1f1";
}

.fa-cc-discover:before {
	content: "\f1f2";
}

.fa-cc-amex:before {
	content: "\f1f3";
}

.fa-cc-paypal:before {
	content: "\f1f4";
}

.fa-cc-stripe:before {
	content: "\f1f5";
}

.fa-bell-slash:before {
	content: "\f1f6";
}

.fa-bell-slash-o:before {
	content: "\f1f7";
}

.fa-trash:before {
	content: "\f1f8";
}

.fa-copyright:before {
	content: "\f1f9";
}

.fa-at:before {
	content: "\f1fa";
}

.fa-eyedropper:before {
	content: "\f1fb";
}

.fa-paint-brush:before {
	content: "\f1fc";
}

.fa-birthday-cake:before {
	content: "\f1fd";
}

.fa-area-chart:before {
	content: "\f1fe";
}

.fa-pie-chart:before {
	content: "\f200";
}

.fa-line-chart:before {
	content: "\f201";
}

.fa-lastfm:before {
	content: "\f202";
}

.fa-lastfm-square:before {
	content: "\f203";
}

.fa-toggle-off:before {
	content: "\f204";
}

.fa-toggle-on:before {
	content: "\f205";
}

.fa-bicycle:before {
	content: "\f206";
}

.fa-bus:before {
	content: "\f207";
}

.fa-ioxhost:before {
	content: "\f208";
}

.fa-angellist:before {
	content: "\f209";
}

.fa-cc:before {
	content: "\f20a";
}

.fa-shekel:before,
.fa-sheqel:before,
.fa-ils:before {
	content: "\f20b";
}

.fa-meanpath:before {
	content: "\f20c";
}

.fa-buysellads:before {
	content: "\f20d";
}

.fa-connectdevelop:before {
	content: "\f20e";
}

.fa-dashcube:before {
	content: "\f210";
}

.fa-forumbee:before {
	content: "\f211";
}

.fa-leanpub:before {
	content: "\f212";
}

.fa-sellsy:before {
	content: "\f213";
}

.fa-shirtsinbulk:before {
	content: "\f214";
}

.fa-simplybuilt:before {
	content: "\f215";
}

.fa-skyatlas:before {
	content: "\f216";
}

.fa-cart-plus:before {
	content: "\f217";
}

.fa-cart-arrow-down:before {
	content: "\f218";
}

.fa-diamond:before {
	content: "\f219";
}

.fa-ship:before {
	content: "\f21a";
}

.fa-user-secret:before {
	content: "\f21b";
}

.fa-motorcycle:before {
	content: "\f21c";
}

.fa-street-view:before {
	content: "\f21d";
}

.fa-heartbeat:before {
	content: "\f21e";
}

.fa-venus:before {
	content: "\f221";
}

.fa-mars:before {
	content: "\f222";
}

.fa-mercury:before {
	content: "\f223";
}

.fa-transgender:before {
	content: "\f224";
}

.fa-transgender-alt:before {
	content: "\f225";
}

.fa-venus-double:before {
	content: "\f226";
}

.fa-mars-double:before {
	content: "\f227";
}

.fa-venus-mars:before {
	content: "\f228";
}

.fa-mars-stroke:before {
	content: "\f229";
}

.fa-mars-stroke-v:before {
	content: "\f22a";
}

.fa-mars-stroke-h:before {
	content: "\f22b";
}

.fa-neuter:before {
	content: "\f22c";
}

.fa-facebook-official:before {
	content: "\f230";
}

.fa-pinterest-p:before {
	content: "\f231";
}

.fa-whatsapp:before {
	content: "\f232";
}

.fa-server:before {
	content: "\f233";
}

.fa-user-plus:before {
	content: "\f234";
}

.fa-user-times:before {
	content: "\f235";
}

.fa-hotel:before,
.fa-bed:before {
	content: "\f236";
}

.fa-viacoin:before {
	content: "\f237";
}

.fa-train:before {
	content: "\f238";
}

.fa-subway:before {
	content: "\f239";
}

.fa-medium:before {
	content: "\f23a";
}

html {
	-webkit-text-size-adjust: 100%;
	/* 2 */
	-ms-text-size-adjust: 100%;
	/* 2 */
	font-family: sans-serif;
	/* 1 */
}

/**
 * Remove default margin.
 */
body {
	margin: 0;
}

/* HTML5 display definitions
   ========================================================================== */
/**
 * Correct `block` display not defined for any HTML5 element in IE 8/9.
 * Correct `block` display not defined for `details` or `summary` in IE 10/11
 * and Firefox.
 * Correct `block` display not defined for `main` in IE 11.
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
	display: block;
}

/**
 * 1. Correct `inline-block` display not defined in IE 8/9.
 * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
 */
audio,
canvas,
progress,
video {
	display: inline-block;
	/* 1 */
	vertical-align: baseline;
	/* 2 */
}

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */
audio:not([controls]) {
	display: none;
	height: 0;
}

/**
 * Address `[hidden]` styling not present in IE 8/9/10.
 * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
 */
[hidden],
template {
	display: none;
}

/* Links
   ========================================================================== */
/**
 * Remove the gray background color from active links in IE 10.
 */
a {
	background-color: transparent;
}

/**
 * Improve readability when focused and also mouse hovered in all browsers.
 */
a:active,
a:hover {
	outline: 0;
}

/* Text-level semantics
   ========================================================================== */
/**
 * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
 */
abbr[title] {
	border-bottom: 1px dotted;
}

/**
 * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
 */
b,
strong {
	font-weight: bold;
}

/**
 * Address styling not present in Safari and Chrome.
 */
dfn {
	font-style: italic;
}

/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari, and Chrome.
 */
h1 {
	margin: 0.67em 0;
	font-size: 2em;
}

/**
 * Address styling not present in IE 8/9.
 */
mark {
	color: #000;
	background: #ff0;
}

/**
 * Address inconsistent and variable font size in all browsers.
 */
small {
	font-size: 80%;
}

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */
sub,
sup {
	position: relative;
	vertical-align: baseline;
	font-size: 75%;
	line-height: 0;
}

sup {
	top: -0.5em;
}

sub {
	bottom: -0.25em;
}

/* Embedded content
   ========================================================================== */
/**
 * Remove border when inside `a` element in IE 8/9/10.
 */
img {
	border: 0;
}

/**
 * Correct overflow not hidden in IE 9/10/11.
 */
svg:not(:root) {
	overflow: hidden;
}

/* Grouping content
   ========================================================================== */
/**
 * Address margin not present in IE 8/9 and Safari.
 */
figure {
	margin: 1em 40px;
}

/**
 * Address differences between Firefox and other browsers.
 */
hr {
	-moz-box-sizing: content-box;
	box-sizing: content-box;
	height: 0;
}

/**
 * Contain overflow in all browsers.
 */
pre {
	overflow: auto;
}

/**
 * Address odd `em`-unit font size rendering in all browsers.
 */
code,
kbd,
pre,
samp {
	font-size: 1em;
	font-family: monospace, monospace;
}

/* Forms
   ========================================================================== */
/**
 * Known limitation: by default, Chrome and Safari on OS X allow very limited
 * styling of `select`, unless a `border` property is set.
 */
/**
 * 1. Correct color not being inherited.
 *    Known issue: affects color of disabled elements.
 * 2. Correct font properties not being inherited.
 * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
 */
button,
input,
optgroup,
select,
textarea {
	margin: 0;
	/* 3 */
	font: inherit;
	/* 2 */
	color: inherit;
	/* 1 */
}

/**
 * Address `overflow` set to `hidden` in IE 8/9/10/11.
 */
button {
	overflow: visible;
}

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
 * Correct `select` style inheritance in Firefox.
 */
button,
select {
	text-transform: none;
}

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
	cursor: pointer;
	/* 3 */
	-webkit-appearance: button;
	/* 2 */
}

/**
 * Re-set default cursor for disabled elements.
 */
button[disabled],
html input[disabled] {
	cursor: default;
}

/**
 * Remove inner padding and border in Firefox 4+.
 */
button::-moz-focus-inner,
input::-moz-focus-inner {
	padding: 0;
	border: 0;
}

/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */
input {
	line-height: normal;
}

/**
 * It's recommended that you don't attempt to style these elements.
 * Firefox's implementation doesn't respect box-sizing, padding, or width.
 *
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */
input[type="checkbox"],
input[type="radio"] {
	box-sizing: border-box;
	/* 1 */
	padding: 0;
	/* 2 */
}

/**
 * Fix the cursor style for Chrome's increment/decrement buttons. For certain
 * `font-size` values of the `input`, it causes the cursor style of the
 * decrement button to change from `default` to `text`.
 */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

/**
 * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari and Chrome
 *    (include `-moz` to future-proof).
 */
input[type="search"] {
	-webkit-box-sizing: content-box;
	/* 2 */
	-moz-box-sizing: content-box;
	box-sizing: content-box;
	-webkit-appearance: textfield;
	/* 1 */
}

/**
 * Remove inner padding and search cancel button in Safari and Chrome on OS X.
 * Safari (but not Chrome) clips the cancel button when the search input has
 * padding (and `textfield` appearance).
 */
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

/**
 * Define consistent border, margin, and padding.
 */
fieldset {
	margin: 0 2px;
	padding: 0.35em 0.625em 0.75em;
	border: 1px solid #c0c0c0;
}

/**
 * 1. Correct `color` not being inherited in IE 8/9/10/11.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */
legend {
	padding: 0;
	/* 2 */
	border: 0;
	/* 1 */
}

/**
 * Remove default vertical scrollbar in IE 8/9/10/11.
 */
textarea {
	overflow: auto;
}

/**
 * Don't inherit the `font-weight` (applied by a rule above).
 * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
 */
optgroup {
	font-weight: bold;
}

/* Tables
   ========================================================================== */
/**
 * Responsive Tables
 */
.flextable {
	margin-bottom: 15px;
}

.more-info-mobile {
	display: none;
}

.products_product {
	display: inline-block;
}

.products_product>.misc_icons {
	display: inline-block;
}

.product_bulk_options {
	margin-top: 15px;
}

.mobile-break {
	display: inline-block;
	margin: 0px 6px;
}

.explain_expand,
.pricing_product>.expand {
	display: none;
}

.flextable>.thead {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-content: center;
	justify-content: space-between;
	align-items: baseline;
	padding: 2px 0px;
	text-align: left;
	white-space: nowrap;
	font-size: 13px;
	font-weight: 600;
	background-color: var(--table-odd);
	background-image: url(/images/button.png);
	background-repeat: repeat-x;
	border-bottom: 1px solid var(--content-bg-border);
	font-weight: 500;
}

.flextable>.trow {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-content: center;
	justify-content: space-between;
	align-items: baseline;
	border-bottom: 1px solid var(--table-bottom-border);
}

.trow:nth-child(even) {
	background: var(--table-even);
}

.flextable.rtable {}

.flextable>.caption {
	text-align: left;
	font-size: 16px;
	font-weight: 600;
	border-bottom: 1px solid #ccc;
	padding: 6px 16px;
}

.caption>.note {
	font-size: 12px;
	color: #999999;
}

.col {
	flex: 3;
	padding: 6px 12px;
	text-align: left;
	flex-basis: 2%;
}

.col.light {
	color: #c8c8c9;
}

.col.empty,
.col.tiny {
	flex-grow: 0;
	white-space: nowrap;
	overflow-x: hidden;
}

.col.small {
	flex-grow: 1;
	overflow-x: hidden;
}

.col.medium {
	flex-grow: 1.4;
	overflow-x: hidden;
}

.col.large {
	flex-grow: 3;
	overflow-x: hidden;
}

.col.tright {
	text-align: right;
}

/**
 * Remove most spacing between table cells.
 */
table {
	border-spacing: 0;
	border-collapse: collapse;
}

td,
th {
	padding: 0;
}

.clearfix,
.container,
.container-fluid,
.row {
	*zoom: 1;
}

.clearfix:before,
.clearfix:after,
.container:before,
.container:after,
.container-fluid:before,
.container-fluid:after,
.row:before,
.row:after {
	display: table;
	content: "";
}

.clearfix:after,
.container:after,
.container-fluid:after,
.row:after {
	clear: both;
}

.clear {
	display: block;
	clear: both;
	content: '';
}
.advertisement-banner {
	width: 100%;
	display: flex;
	justify-content: center;
	line-height: 0;
}
.advertisement-banner * img {
	max-width: 100%;
}
.img-responsive {
	display: block;
	max-width: 100%;
	height: auto;
	backface-visibility: hidden;
}

.is-visible {
	visibility: visible;
	pointer-events: all;
}

.is-hidden {
	pointer-events: none;
	visibility: hidden;
}

.pull-left {
	float: left;
}

.pull-right {
	float: right;
}

.sr-only {
	position: absolute;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	margin: -1px;
	padding: 0;
	width: 1px;
	height: 1px;
	border: 0;
}

*,
*:before,
*:after {
	box-sizing: border-box;
}

html,
body {
	min-height: 100%;
	min-width: 320px;
}

body {
	overflow-x: hidden;
	min-width: 320px;
	color: #444;
	background-color: #eee;
}

* {
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

a {
	text-decoration: none;
	color: #693;
	outline: none;
	cursor: pointer;
}

a:hover {
	color: #73ac39;
}

a:focus {
	text-decoration: underline;
}

html {
	font-family: 'screen-phone';
}
iframe {
	border: 0;
	backface-visibility: hidden;
}

fieldset {
	margin: 0;
	padding: 0;
	border: 0;
}

::selection {
	text-shadow: none;
	color: #fff;
	background-color: #693;
}

hr {
	clear: both;
	margin-top: 22px;
	margin-bottom: 22px;
	padding: 0;
	width: 100%;
	height: 0;
	background: transparent;
	border: 0;
	border-top: 2px solid #eee;
}
.icon {
	display: inline-block;
	overflow: hidden;
	text-indent: 101%;
	white-space: nowrap;
	background-color: transparent;
	background-image: url("../images/sprite.png");
	background-image: none, url("../images/sprite.svg");
	background-repeat: no-repeat;
	backface-visibility: hidden;
	width: 16px;
	height: 16px;
	position: relative;
	top: -0.1em;
	content: '';
	vertical-align: middle;
	font-size: 10px;
	line-height: 1;
}
.icon-logo {
	background-position: -40px 0px;
	width: 20px;
	height: 20px;
	top: 0;
	vertical-align: top;
}

.icon-social-twitter {
	background-position: 0px -200px;
	opacity: .25;
}

a:hover>.icon-social-twitter {
	background-position: 0px -240px;
	opacity: 1;
}

.show-header-top-social.regular .icon-social-twitter,
.show-header-top-social a:hover>.icon-social-twitter {
	background-position: 0px -160px;
	opacity: 1;
}

.icon-social-facebook {
	background-position: -40px -200px;
	opacity: .25;
}

a:hover>.icon-social-facebook {
	background-position: -40px -240px;
	opacity: 1;
}

.show-header-top-social.regular .icon-social-facebook,
.show-header-top-social a:hover>.icon-social-facebook {
	background-position: -40px -160px;
	opacity: 1;
}

.icon-social-googleplus {
	background-position: -80px -200px;
	opacity: .25;
}

a:hover>.icon-social-googleplus {
	background-position: -80px -240px;
	opacity: 1;
}

.show-header-top-social.regular .icon-social-googleplus,
.show-header-top-social a:hover>.icon-social-googleplus {
	background-position: -80px -160px;
	opacity: 1;
}
.icon-social-youtube {
	background-position: -120px -200px;
	opacity: .25;
}

a:hover>.icon-social-youtube {
	background-position: -120px -240px;
	opacity: 1;
}

.show-header-top-social.regular .icon-social-youtube,
.show-header-top-social a:hover>.icon-social-youtube {
	background-position: -120px -160px;
	opacity: 1;
}

.icon-social-tumblr {
	background-position: -160px -200px;
	opacity: .25;
}

a:hover>.icon-social-tumblr {
	background-position: -160px -240px;
	opacity: 1;
}

.show-header-top-social.regular .icon-social-tumblr,
.show-header-top-social a:hover>.icon-social-tumblr {
	background-position: -160px -160px;
	opacity: 1;
}

.icon-social-pinterest {
	background-position: -200px -200px;
	opacity: .25;
}

a:hover>.icon-social-pinterest {
	background-position: -200px -240px;
	opacity: 1;
}

.show-header-top-social.regular .icon-social-pinterest,
.show-header-top-social a:hover>.icon-social-pinterest {
	background-position: -200px -160px;
	opacity: 1;
}

.icon-social-instagram {
	background-position: -240px -200px;
	opacity: .25;
}

a:hover>.icon-social-instagram {
	background-position: -240px -240px;
	opacity: 1;
}

.show-header-top-social.regular .icon-social-instagram,
.show-header-top-social a:hover>.icon-social-instagram {
	background-position: -240px -160px;
	opacity: 1;
}

html {
	font-size: 62.5%;
}

body {
	font-size: 16px;
	font-size: 1.6rem;
	font-family: "Open Sans", Helvetica, Arial, sans-serif;
	line-height: 1.4;
	font-weight: 400;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

strong,
b {
	font-weight: 700;
}

i,
em {
	font-style: italic;
}

p {
	margin-top: 0;
	margin-bottom: 22px;
}

ul,
ol {
	margin-bottom: 22px;
	padding-left: 22px;
}

ul li,
ol li {
	margin-bottom: 11px;
}

.base {
	font-weight: 400;
	font-style: normal;
}

.xx-small {
	font-size: 11px;
	font-size: 1.1rem;
}

.x-small {
	font-size: 12px;
	font-size: 1.2rem;
}

.small,
small {
	font-size: 14px;
	font-size: 1.4rem;
}

.medium {
	font-size: 20px;
}

.large {
	font-size: 26px;
}

.x-large {
	font-size: 32px;
}

.xx-large {
	font-size: 40px;
}

.weight-light {
	font-weight: 300;
}

.weight-normal {
	font-weight: 400;
}

.weight-medium {
	font-weight: 600;
}

.weight-heavy {
	font-weight: 700;
}

.align-left {
	text-align: left;
}

.align-center {
	text-align: center;
}

.align-right {
	text-align: right;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	margin-top: 0;
	margin-bottom: 0.3em;
	font-weight: 700;
}

h1 .fa,
h2 .fa,
h3 .fa,
h4 .fa,
h5 .fa,
h6 .fa {
	margin-right: 8px;
	font-size: 125%;
	line-height: 75%;
}

.color-green {
	color: #693;
}

.color-blue {
	color: #39c;
}

.color-red {
	color: #c33;
}

.color-grey {
	color: #696969;
}

.color-grey-light {
	color: #ccc;
}

.color-grey-dark {
	color: #666;
}

.display-inline {
	display: inline;
	margin: 0;
	padding: 0;
	vertical-align: baseline;
}

.gap {
	margin: 0 10px;
}

@-webkit-viewport {
	width: device-width;
}

@-moz-viewport {
	width: device-width;
}

@-ms-viewport {
	width: device-width;
}

@-o-viewport {
	width: device-width;
}

@viewport {
	width: device-width;
}

.visible-xs,
.visible-sm,
.visible-md,
.visible-lg {
	display: none !important;
}

.visible-xs-block,
.visible-xs-inline,
.visible-xs-inline-block,
.visible-sm-block,
.visible-sm-inline,
.visible-sm-inline-block,
.visible-md-block,
.visible-md-inline,
.visible-md-inline-block,
.visible-lg-block,
.visible-lg-inline,
.visible-lg-inline-block {
	display: none !important;
}

.visible-print {
	display: none !important;
}

.visible-print-block {
	display: none !important;
}

.visible-print-inline {
	display: none !important;
}
.visible-print-inline-block {
	display: none !important;
}
.container {
	margin-right: auto;
	margin-left: auto;
	padding-left: 10px;
	padding-right: 10px;
	transition: 0.15s ease;
	width: 100%;
	max-width:1600px;
}
.container-row {
	display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}
.container-left-panel {
	display: flex;
    flex-direction: column;
    width: 100%;
}
.container-right-panel {
	display: flex;
    flex-direction: column;
    width: 100%;
}

.container-fluid {
	margin-right: auto;
	margin-left: auto;
	padding-left: 10px;
	padding-right: 10px;
}
.row {
	margin-left: -10px;
	margin-right: -10px;
}
.col-xs-1,
.col-sm-1,
.col-md-1,
.col-lg-1,
.col-xs-2,
.col-sm-2,
.col-md-2,
.col-lg-2,
.col-xs-3,
.col-sm-3,
.col-md-3,
.col-lg-3,
.col-xs-4,
.col-sm-4,
.col-md-4,
.col-lg-4,
.col-xs-5,
.col-sm-5,
.col-md-5,
.col-lg-5,
.col-xs-6,
.col-sm-6,
.col-md-6,
.col-lg-6,
.col-xs-7,
.col-sm-7,
.col-md-7,
.col-lg-7,
.col-xs-8,
.col-sm-8,
.col-md-8,
.col-lg-8,
.col-xs-9,
.col-sm-9,
.col-md-9,
.col-lg-9,
.col-xs-10,
.col-sm-10,
.col-md-10,
.col-lg-10,
.col-xs-11,
.col-sm-11,
.col-md-11,
.col-lg-11,
.col-xs-12,
.col-sm-12,
.col-md-12,
.col-lg-12 {
	position: relative;
	min-height: 1px;
	padding-left: 10px;
	padding-right: 10px;
}
.col-xs-1,
.col-xs-2,
.col-xs-3,
.col-xs-4,
.col-xs-5,
.col-xs-6,
.col-xs-7,
.col-xs-8,
.col-xs-9,
.col-xs-10,
.col-xs-11,
.col-xs-12 {
	float: left;
}

.col-xs-12 {
	width: 100%;
}

.col-xs-11 {
	width: 91.66666667%;
}

.col-xs-10 {
	width: 83.33333333%;
}

.col-xs-9 {
	width: 75%;
}

.col-xs-8 {
	width: 66.66666667%;
}

.col-xs-7 {
	width: 58.33333333%;
}

.col-xs-6 {
	width: 50%;
}

.col-xs-5 {
	width: 41.66666667%;
}

.col-xs-4 {
	width: 33.33333333%;
}

.col-xs-3 {
	width: 25%;
}

.col-xs-2 {
	width: 16.66666667%;
}

.col-xs-1 {
	width: 8.33333333%;
}

.col-xs-pull-12 {
	right: 100%;
}

.col-xs-pull-11 {
	right: 91.66666667%;
}

.col-xs-pull-10 {
	right: 83.33333333%;
}

.col-xs-pull-9 {
	right: 75%;
}

.col-xs-pull-8 {
	right: 66.66666667%;
}

.col-xs-pull-7 {
	right: 58.33333333%;
}

.col-xs-pull-6 {
	right: 50%;
}

.col-xs-pull-5 {
	right: 41.66666667%;
}

.col-xs-pull-4 {
	right: 33.33333333%;
}

.col-xs-pull-3 {
	right: 25%;
}

.col-xs-pull-2 {
	right: 16.66666667%;
}

.col-xs-pull-1 {
	right: 8.33333333%;
}

.col-xs-pull-0 {
	right: auto;
}

.col-xs-push-12 {
	left: 100%;
}

.col-xs-push-11 {
	left: 91.66666667%;
}

.col-xs-push-10 {
	left: 83.33333333%;
}

.col-xs-push-9 {
	left: 75%;
}

.col-xs-push-8 {
	left: 66.66666667%;
}

.col-xs-push-7 {
	left: 58.33333333%;
}

.col-xs-push-6 {
	left: 50%;
}

.col-xs-push-5 {
	left: 41.66666667%;
}

.col-xs-push-4 {
	left: 33.33333333%;
}

.col-xs-push-3 {
	left: 25%;
}

.col-xs-push-2 {
	left: 16.66666667%;
}

.col-xs-push-1 {
	left: 8.33333333%;
}

.col-xs-push-0 {
	left: auto;
}

.col-xs-offset-12 {
	margin-left: 100%;
}

.col-xs-offset-11 {
	margin-left: 91.66666667%;
}

.col-xs-offset-10 {
	margin-left: 83.33333333%;
}

.col-xs-offset-9 {
	margin-left: 75%;
}

.col-xs-offset-8 {
	margin-left: 66.66666667%;
}

.col-xs-offset-7 {
	margin-left: 58.33333333%;
}

.col-xs-offset-6 {
	margin-left: 50%;
}

.col-xs-offset-5 {
	margin-left: 41.66666667%;
}

.col-xs-offset-4 {
	margin-left: 33.33333333%;
}

.col-xs-offset-3 {
	margin-left: 25%;
}

.col-xs-offset-2 {
	margin-left: 16.66666667%;
}

.col-xs-offset-1 {
	margin-left: 8.33333333%;
}

.col-xs-offset-0 {
	margin-left: 0%;
}
[class*="block-grid-"] {
	*zoom: 1;
	margin: 0;
	margin-right: -10px;
	margin-left: -10px;
	padding: 0;
	list-style: none;
	transition: margin 0.15s ease;
}

[class*="block-grid-"]:before,
[class*="block-grid-"]:after {
	display: table;
	content: "";
}

[class*="block-grid-"]:after {
	clear: both;
}

[class*="block-grid-"]>li {
	display: block;
	padding-right: 10px;
	padding-left: 10px;
	height: auto;
	transition: padding 0.15s ease;
}


.site-header {
	*zoom: 1;
	position: relative;
	top: 0;
	right: 0;
	left: 0;
	z-index: 10;
	max-height: 112px;
	max-height: 80px;
	color: #fff;
	background-color: #011d2c;
	background-image: linear-gradient(to top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.1) 100%);
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
	user-select: none;
}

.site-header:before,
.site-header:after {
	display: table;
	content: "";
}

.site-header:after {
	clear: both;
}

.site-header .container {
	padding-top: 16px;
	padding-bottom: 16px;
	transition: .25s ease;
}
.site-logo {
	font-size: 20px;
	position: relative;
	z-index: 3;
	float: left;
	margin: 0;
	font-weight: 700;
	line-height: 20px;
	transition: font-size 0.15s ease;
}
.site-logo > a {
	overflow: hidden;
	text-indent: 101%;
	white-space: nowrap;
	background-color: transparent;
	background-image: url("../images/tshirt-gang-logo-xs.png");
	background-image: none, url("../images/tshirt-gang-logo-xs.svg");
	background-repeat: no-repeat;
	backface-visibility: hidden;
	width: 115px;
	height: 20px;
	display: inline-block;
	vertical-align: top;
	color: #fff;
	transition: color 0.15s ease, opacity 0.15s ease;
}

.top-navigation-bar-wrapper {
	display: flex;
    justify-content: space-between;
    flex-direction: row;
}
.custom-gpt-left {
	display: flex;
}
	.gpt-item-wrapper {
	    background-color: rgba(255, 255, 255, 0.1);
	    margin: 0px 5px;
	    border-radius: 6px;
	    padding: 5px;
	    max-height: 63px;
	}
	.gpt-item-wrapper:hover {
		background-color: #025077;
	}
	.gpt-item-wrapper > a {
		text-decoration: none;
	}
		.gpt-item {
			display: flex;
    		flex-direction: row;
		}
		.gpt-item > .gpt-item-logo {

		}
			.gpt-item > .gpt-item-logo > img {
				display: block;
			    margin-left: auto;
			    margin-right: auto;
			    max-width: 50px;
			    max-height: 50px;
			    width: 50pc;
			    height: 50px;
			    border-radius: 50%;
			    object-fit: cover;
			}
		.gpt-item > .gpt-item-title {
			display: flex;
    		align-items: center;
			font-size: 12px;
		    color: #FFF;
		    max-width: 150px;
		    padding-left: 10px;
		    text-wrap: auto;
		    overflow: hidden;
   			max-height: 50px;
		}
.toggle-site-nav {
	font-size: 20px;
	float: right;
	margin-top: 4px;
	margin-bottom: 4px;
	padding: 10px;
	background-color: #3399cc;
	border: 0;
	border-radius: 4px;
	box-shadow: inset rgba(0, 0, 0, 0.05) 0 0 0 2px;
	cursor: pointer;
	transition: background 0.15s ease;
	appearance: none;
}

.toggle-site-nav .fa {
	display: block;
	min-width: 20px;
	text-align: center;
}

.toggle-site-nav .fa:before {
	content: "\f0c9";
}
.nav-open .toggle-site-nav {
	background-color: #025077;
}

.nav-open .toggle-site-nav .fa:before {
	content: "\f00d";
}

.site-nav {
	font-size: 16px;
	font-size: 1.6rem;
	display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.site-nav ul,
.site-nav ul>li {
	margin: 0;
	padding: 0;
	list-style: none;
}

.site-nav ul>li {
	position: relative;
}
.nav-user {
	padding-top: 4px;
	padding-bottom: 4px;
}

.nav-user.logged-in,
.nav-user.logged-in .button {
	text-align: left;
}

.nav-user.logged-in .button {
	padding-right: 12px;
	padding-left: 12px;
}

.nav-user.logged-in .nav-user-button-icon>span {
	display: none;
}

.nav-user.logged-in .nav-user-button-icon var {
	width: 20px;
	height: 20px;
	font-size: 13px;
	font-size: 1.3rem;
	display: inline-block;
	text-align: center;
	text-decoration: none;
	font-weight: 700;
	font-style: normal;
	line-height: 20px;
	color: #fff;
	background-color: #693;
	border-radius: 20px;
	box-shadow: rgba(0, 0, 0, 0.15) 0 1px 2px;
}

.site-nav .menu {
	margin-top: 8px;
	border-radius: 8px;
}

.site-nav .menu>li>span,
.site-nav .menu>li>a {
	font-size: 14px;
	font-size: 1.4rem;
	display: block;
	color: #fff;
}

.site-nav .menu>li.linebreak {
	height: 1px;
	border-bottom: 1px solid #0d5e86;
}


.nav-user-menu-open #toggle-nav-user-menu,
.nav-notifications-menu-open #toggle-nav-notifications-menu {
	background-color: #025077;
	background-color: rgba(2, 80, 119, 0.5);
}

.nav-user-menu-open #toggle-nav-user-menu:hover,
.nav-notifications-menu-open #toggle-nav-notifications-menu:hover {
	background-color: #025077;
}

.nav-user-menu-open .nav-user-menu,
.nav-notifications-menu-open .nav-notifications-menu {
	visibility: visible !important;
	opacity: 1 !important;
	pointer-events: all !important;
}
#NotificationsMenu {
	min-width:250px;
}
.footer-row {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-content: center;
	justify-content: space-around;
}

.footer-links-company {
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
}

.site-footer {
	font-size: 13px;
	font-size: 1.3rem;
	transition: 0.15s ease;
}
.footer-nav,
.footer-social {
	padding-top: 20px;
	padding-bottom: 20px;
}

.footer-nav ul,
.footer-social ul,
.footer-nav ul>li,
.footer-social ul>li {
	margin: 0;
	padding: 0;
	list-style: none;
}
.footer-social a {
	color: #aaa;
	font-size: 30px;
}

.footer-social ul {
	text-align: center;
	white-space: nowrap;
}

.footer-social ul>li {
	display: inline;
}

.footer-social ul>li+li {
	margin-left: 12px;
}

.footer-social ul>li>a {
	display: inline-block;
}

.footer-social ul>li>a .fa {
	font-size: 24px;
}

.footer-social ul>li>a>span {
	display: none;
}

.footer-copyright {
	color: #666;
	font-size: 13px;
	font-size: 1.3rem;
	padding-top: 20px;
	padding-bottom: 20px;
}
.footer-company {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	flex-wrap: wrap;
}
.main {
	position: relative;
	z-index: 9;
}

.content {
	background-color: #fff;
}

.content.connectapp {
	background-color: #025e8c;
}

.connectapp-button-center {
	/*col-sm-push-1 col-sm-4 col-md-push-2 col-md-8*/
	display: flex;
	justify-content: center;
}

.content-integrations {
	background-color: #757575;
}
.content-integration-reviews {
	background-color: #ffffff;
	width: 100%;
}
.content-integration-reviews > .container {
	max-width: 100%;
}
.featured-content-reviews {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    padding-top: 100px !important;
}
	.review-wrap {
	    display: flex;
	    flex-direction: column;
	    align-items: center;
	}
		.review-star-wrapper {
			color: #fff606; 
			font-size: 28px;
			background-color: #83c245;
			border-radius: 12px;
			padding: 8px 34px;
			display: flex;
			gap: 4px;
			align-items: center;
		}
		.review-star {
			display: flex;
		    flex-direction: row;
		    align-items: center;
		}

		.star-clip-wrap {
			overflow: hidden;
			display: inline-block;
		}
			.star-clip-wrap.star-90 { width:14%; }
			.star-clip-wrap.star-80 { width:13%; }
			.star-clip-wrap.star-70 { width:12%; }
			.star-clip-wrap.star-60 { width:11%; }
			.star-clip-wrap.star-50 { width:10%; }
			.star-clip-wrap.star-40 { width:9%; }
			.star-clip-wrap.star-30 { width:8%; }
			.star-clip-wrap.star-20 { width:7%; }
			.star-clip-wrap.star-10 { width:6%; }
		.review-rating-number {
			margin-left: 10px;
    		font-size: 20px;
		}
		.review-logo {
			padding:20px;
		}
		.review-logo > img,
		.review-logo > a > img {
		    max-width: 200px;
		}
		.review-text-wrap {
	        display: flex;
		    flex-wrap: nowrap;
		    max-width: 500px;
		}
			.quote-open,
			.quote-close {
				font-size: 12px;
				color: #c7c7c7;
			}
			.quote-close {
				display:flex;
				align-items: flex-end;
				padding-bottom: 18px;
			}
			.review-text {
				padding:0px 10px;
			    font-size: 18px;
    			font-family: 'Bitter';
    			text-align: center;
			}
		.review-username {
			display: flex;
		    justify-content: flex-end;
		    color: #8f8f8f;
		    font-style: italic;
		    font-size: 13px;
		    width: 100%;
		}
		.review-basedon {

		}
		.install-app-wrapper {

		}
			.install-app {
			    margin-top: 20px;
			    background-color: #fbbf00;
			    padding: 10px 35px;
			    border-radius: 5px;
			    color: #ffffff;
			    font-size: 24px;
			    font-weight: bold;
			}

.integration-images {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
}

.integration-images>img {
	height: 40px;
	margin: 13px 24px;
}

.container.connectapp>.region>.row {
	background-color: #fff;
	margin-top: 10%;
	box-shadow: inset rgba(255, 255, 255, .1) 0 1px 0, rgba(0, 0, 0, .15) 0 1px 2px;
	padding: 10px;
	margin-left: auto;
	margin-right: auto;
	max-width: 900px;
	border-radius: 4px;
}

.connecting-app-desc>img {
	width: 300px;
	float: left;
	padding-right: 20px;
}

.button {
	font-size: 16px;
	font-size: 1.6rem;
	position: relative;
	z-index: 2;
	display: inline-block;
	padding: 11px 16px;
	text-align: center;
	white-space: nowrap;
	font-weight: 400;
	line-height: 1;
	color: #444;
	background-color: #eee;
	background-image: linear-gradient(to top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.1) 100%);
	border: 1px solid #ddd;
	border-radius: 4px;
	box-shadow: inset rgba(255, 255, 255, 0.1) 0 1px 0, rgba(0, 0, 0, 0.15) 0 1px 2px;
	cursor: pointer;
	transition: 0.15s ease;
	appearance: none;
}

.button:focus {
	text-decoration: none;
	outline: none;
	box-shadow: #693 0 0 4px;
}

.button+.button {
	margin-left: 8px;
}
.button--primary {
	font-weight: 600;
	color: #fff;
	background-color: #693;
	border-color: #693;
}

.button--primary--order {
	font-weight: 600;
	color: #fff;
	background-color: #3b9df4;
	border-color: #2a94f5;
	display: inline;
	width: 50%;
}

.button--primary--facebook {
	font-weight: 600;
	color: #fff;
	background-color: #3b5999;
	border-color: #2d4984;
	display: inline !important;
	font-size: 15px !important;
}

.button--primary--twitter {
	font-weight: 600;
	color: #fff;
	background-color: #505050;
	border-color: #3b3b3b;
	display: inline !important;
	font-size: 16px;
}

.button--primary--google {
	font-weight: 600;
	color: #fff;
	background-color: #df4a32;
	border-color: #c83c26;
	display: inline !important;
	font-size: 16px;
}

.button--primary--apple {
	font-weight: 600;
	color: #fff;
	background-color: #000;
	border-color: #000;
	display: inline !important;
	font-size: 16px;
}

.button--primary--metamask {
	font-weight: 600;
	color: #fff;
	background-color: #eb9d47;
	border-color: #df8016;
	display: inline !important;
	font-size: 16px;
}

.button--primary--loginpage {
	min-width: 140px;
}

.button--primary--register {
	width: 100%;
	min-width: 120px;
}

.button--primary--register>img {
	max-height: 14px;
}

.button--primary--loginpage>img,
.connect-app-continue>img {
	max-height: 14px;
}

.cf-turnstile {
	text-align: center;
}

.login-modal-signin-btn {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
}

.reg-signup-buttons {
	display: flex;
	flex-direction: row;
	justify-content: center;
	flex-wrap: wrap;
}

.login-row,
.reg-signup-buttons>.signup-row {
	margin: 3px 4px;
}

.button--gallery {
	font-weight: 600;
	color: #fff;
	background-color: #5d90e8;
	border-color: #5d90e8;
}

.button--text {
	font-weight: 600;
	color: #fff;
	background-color: #e67300;
	border-color: #e67300;
}

.button--ai,
.button--shutterstock {
	font-weight: 600;
	color: #fff;
	background-color: #dc4040;
	border-color: #dc4040;
}

.button--productgallery {
	font-weight: 600;
	color: #fff;
	background-color: #2196F3;
	border-color: #2b83ca;
	width: 100% !important;
	font-size: 18px !important;
}

.button--hud {
	color: #fff;
	background-color: rgba(0, 0, 0, 0.35);
	background-image: none;
	border-color: rgba(0, 0, 0, 0.35);
	box-shadow: rgba(255, 255, 255, 0.1) 0 1px 0;
}

.button--hud:hover {
	background-color: rgba(6, 165, 90, 0.35);
}

.button--hud.active {
	background-color: rgba(25, 247, 142, 0.35);
}

.button--hud.active:hover {
	background-color: rgba(18, 199, 114, 0.35);
}
.button:disabled,
.button--disabled {
	opacity: .35;
	cursor: not-allowed;
	pointer-events: none;
}

.button:disabled:hover,
.button--disabled:hover,
.button:disabled:active,
.button--disabled:active {
	color: inherit;
	background-color: inherit;
	border-color: inherit;
}

.button--link,
.button--link:hover,
.button--link:active {
	color: inherit;
	background: none;
	background-color: transparent;
	border-color: transparent;
	box-shadow: none;
}
.button--link.button-link-bold {
	font-weight:bold;
}
.button--link.button-link-underline {
	text-decoration: underline;
}
.button--small {
	font-size: 14px;
	font-size: 1.4rem;
	padding: 7px 12px;
	border-radius: 3px;
}

.button--medium {
	font-size: 16px;
	font-size: 1.6rem;
	padding: 16px 5px;
}

.button--large {
	font-size: 18px;
	font-size: 1.8rem;
	padding: 16px 24px;
}
.design--button--top--wrap {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
.design--button--wrap {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-end;
	align-content: space-between;
}
.inner--design--button--wrap {
    flex: 1 1 50%;
    padding: 5px;
}
.inner--design--button--wrap > div,
.inner--design--button--wrap > a > div {
	width:100%;
}
.button--upload {
	font-size: 1.7rem;
	padding: 16px 16px;
	width: 48%;
	display: flex;
	flex-direction: row;
	text-wrap: balance;
	text-align: left;
	align-items: center;
	max-height: 60px;
	justify-content: flex-start;
	align-content: flex-start;
	flex-wrap: nowrap;
	min-height: 60px;
	margin-right: 5px;
}

.upload--icon {
	padding-right: 10px;
}

.button--block {
	display: inline-block;
	width: 100%;
}

.button--half {
	display: inline-block;
	width: 49%;
	min-width:220px;
}

.button--block+.button--block {
	margin-top: 8px;
}
.button--round {
	border-radius: 64px;
}

.button .fa {
	vertical-align: bottom;
	font-size: 120%;
	line-height: 75%;
	opacity: .75;
	transition: opacity 0.15s ease;
}

.button:hover .fa,
.button:active .fa,
.button:focus .fa {
	opacity: 1;
}

.button--icon-left .fa {
	margin-right: 4px;
}

.button--icon-left.button--small .fa {
	margin-right: 2px;
}

.button--icon-left.button--large .fa {
	margin-right: 8px;
}

.button--icon-left span {
	margin-left: 20px;
}

.button--icon-right .fa {
	margin-left: 4px;
}

.button--icon-right.button--small .fa {
	margin-left: 2px;
}

.button--icon-right.button--large .fa {
	margin-left: 8px;
}

.button-nav-container {
	display: table;
	margin-top: 12px;
	margin-bottom: 12px;
	width: 100%;
}

.button-nav-container>div {
	display: table-cell;
	width: auto;
}

.button-nav-container>div.button-nav-prev {
	padding-right: 6px;
	width: 20%;
}

.button-nav-container>div.button-nav-prev+.buttonnav-next {
	width: 80%;
	padding-left: 6px;
}

.button-nav-container>div.button-nav-next {
	width: 100%;
}

.button-nav-container--5050>div.button-nav-prev {
	padding-right: 6px;
	width: 50%;
}

.button-nav-container--5050>div.button-nav-prev+.buttonnav-next {
	width: 50%;
	padding-left: 6px;
}

#submit--error--message {
	display: none;
	margin-top: 5px;
}

.notice {
	*zoom: 1;
	font-size: 14px;
	font-size: 1.4rem;
	margin: 32px 0;
	padding: 12px 16px;
	background-color: rgba(0, 0, 0, 0.025);
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 4px;
}

.notice:before,
.notice:after {
	display: table;
	content: "";
}

.notice:after {
	clear: both;
}

.notice:before {
	display: inline-block;
	font: normal normal normal 14px/1 FontAwesome;
	font-size: inherit;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	transform: translate(0, 0);
	font-size: 20px;
	float: left;
	margin-left: -32px;
	line-height: 1;
}

.notice--alt.notice {
	color: #fff;
	background-color: rgba(0, 0, 0, 0.75);
	border: 1px solid rgba(255, 255, 255, 0.1);
	box-shadow: inset rgba(255, 255, 255, 0.1) 0 1px 0, rgba(0, 0, 0, 0.15) 0 1px 2px;
}

.notice--alt.notice.notice-dismissible .close {
	color: #fff;
	color: rgba(255, 255, 255, 0.8);
}

.notice--alt.notice.notice-dismissible .close:hover {
	color: #fff;
}
.notice.width80 {
	max-width:80% !important;
}
.notice-dismissible .close {
	float: right;
	margin: 0;
	padding: 0;
	font-size: 20px;
	line-height: 1;
	background-color: transparent;
	outline: none;
	border: transparent none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

.notice-dismissible .close:hover {
	color: #693;
}

.notice--info {
	padding-left: 48px;
	color: #31708f;
	background-color: #eee;
	background-color: #f5fcfd;
}

.notice--alt.notice--info {
	color: #fff;
	background-color: #84a2a9;
}

.notice--info:before {
	display: block;
	content: "\f05a";
}

.notice--success {
	padding-left: 48px;
	color: #387c2b;
	background-color: #f1f6ea;
}

.notice--alt.notice--success {
	color: #fff;
	background-color: #5f8224;
}

.notice--success:before {
	display: block;
	content: "\f058";
}

.notice--alert {
	padding-left: 48px;
	color: #e2ce70;
	background-color: #fff8d8;
}

.notice--alt.notice--alert {
	color: #fff;
	background-color: #b00808;
}

.notice--alert:before {
	display: block;
	content: "\f071";
}

.notice--error {
	padding-left: 48px;
	color: #a00000;
	background-color: #fce7e7;
}

.notice--alt.notice--error {
	color: #fff;
	background-color: #b00808;
}

.notice--error:before {
	display: block;
	content: "\f071";
}

.floating {
	position: fixed;
	bottom: 40px;
	z-index: 5;
	width: 70%;
	left: 15%;
}
.hidden {
	display:none;
}
.notice.hidden {
	display: none;
}

.breadcrumbs {
	*zoom: 1;
	color: #999;
}

.breadcrumbs:before,
.breadcrumbs:after {
	display: table;
	content: "";
}

.breadcrumbs:after {
	clear: both;
}

.breadcrumbs a {
	color: #666;
}

.breadcrumbs a:hover {
	color: #025077;
}

.breadcrumbs>.container {
	font-size: 12px;
	font-size: 1.2rem;
	padding-top: 20px;
	padding-bottom: 20px;
}


.breadcrumbs .chev {
	margin-right: 4px;
	margin-left: 4px;
}
#overlay {
	pointer-events: auto;
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	background-color: rgba(0, 0, 0, 0.6); /* dark translucent background */
	z-index: 9990; /* adjust to sit behind modal content */
	display: none; /* hidden by default */
}
.modal {
	position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 90%;
    height: auto;
    z-index: 20000;
    border-radius: 8px;
    display:none;
}

.modal.fade .modal-dialog {
	transition: 0.15s ease;
	transform: scale(0.8);
}

.modal.in .modal-dialog {
	transform: scale(1);
}

.modal-open .modal {
	overflow-x: hidden;
	overflow-y: auto;
}

.modal-dialog {
	position: relative;
	margin: 10px;
	width: auto;
}

.fade>.modal-dialog {
	opacity: 0;
	filter: alpha(opacity=0);
	transition: opacity .15s linear;
}

.in>.modal-dialog {
	opacity: 1;
	filter: alpha(opacity=100);
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
.modal-content {
	position: relative;
	background-color: #fff;
	background-clip: padding-box;
	outline: 0;
	border: 1px solid rgba(0, 0, 0, 0.25);
	border-radius: 4px;
	box-shadow: rgba(0, 0, 0, 0.25) 0 4px 16px;
}

.modal-backdrop {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 19990;
	background-color: #000;
	opacity: 0.7;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
}

.modal-backdrop.fade {
	opacity: 0;
	filter: alpha(opacity=0);
	transition: opacity .15s ease;
}

.modal-backdrop.in {
	opacity: 0.7;
	filter: alpha(opacity=70);
	z-index: 1;
}

.modal-header {
	position: relative;
	padding: 20px 16px;
	border-bottom: 1px solid #ddd;
}
.modal-header *:last-child {
	margin-bottom: 0;
}

.modal-header .modal-title {
	font-size: 20px;
	font-weight: 600;
}

.modal .close {
	font-size: 24px;
	position: absolute;
	top: 50%;
	right: 16px;
	z-index: 20005;
	display: inline-block;
	overflow: hidden;
	margin-top: -15px;
	padding: 2px;
	white-space: nowrap;
	font-weight: 400;
	line-height: 1;
	color: #444;
	background-color: #fff;
	border: 1px solid #ddd;
	border-radius: 32px;
	cursor: pointer;
	transition: 0.15s ease;
	appearance: none;
}

.modal .close:hover {
	color: #fff;
	background-color: #693;
	border-color: #693;
}

.modal .close>span {
	width: 24px;
	height: 24px;
	display: inline-block;
	vertical-align: top;
}

.modal-body {
	position: relative;
	padding: 32px 16px;
	word-break: break-word;
	hyphens: auto;
}

.modal-body>*:first-child {
	margin-top: 0;
}

.modal-body>*:last-child {
	margin-bottom: 0;
}

.modal-footer {
	*zoom: 1;
	padding: 16px;
	text-align: right;
	border-top: 1px solid #ddd;
}

.modal-footer:before,
.modal-footer:after {
	display: table;
	content: "";
}

.modal-footer:after {
	clear: both;
}

.modal-scrollbar-measure {
	display: none;
	position: absolute;
	top: -9999px;
	overflow: scroll;
	width: 50px;
	height: 50px;
}

.region {
	*zoom: 1;
	padding-top: 20px;
	padding-bottom: 120px;
}

.region:before,
.region:after {
	display: table;
	content: "";
}

.region:after {
	clear: both;
}
.region ul,
.region ol {
	margin-bottom: 22px;
}

.region li {
	margin-bottom: 11px;
}

.region li>ul,
.region li>ol {
	margin-top: 11px;
}

.region+.region {
	border-top: 2px solid #eee;
}

.data-table {
	*zoom: 1;
	display: table;
	margin-top: 11px;
	margin-bottom: 11px;
	width: 100%;
	table-layout: fixed;
	border-collapse: collapse;
}

.data-table:before,
.data-table:after {
	display: table;
	content: "";
}

.data-table:after {
	clear: both;
}

.data-table .data-table-row {
	display: table-row;
	border-bottom: 1px solid #eee;
}
.data-table .data-table-row>div {
	display: table-cell;
	padding: 8px;
	vertical-align: middle;
}

.data-table .data-table-row>div:first-child {
	padding-left: 0;
	width: 60%;
}

.data-table .data-table-row.data-table-header {
	color: #666;
	font-size: 14px;
	font-size: 1.4rem;
	font-weight: 600;
	background-color: #eee;
	border-bottom-color: #ddd;
}

.data-table .data-table-row.data-table-header>div {
	overflow: hidden;
	padding: 8px;
	text-overflow: ellipsis;
	white-space: nowrap;
}
table {
	margin: 8px 0;
	width: 100%;
	table-layout: fixed;
	border-collapse: collapse;
	font-size: 14px;
	font-size: 1.4rem;
}
table caption {
	font-size: 26px;
	padding: 6px 16px;
	text-align: left;
	font-weight: 600;
	border-bottom: 1px solid #ccc;
}

table caption .note {
	font-size: 12px;
	font-size: 1.2rem;
	color: #888;
}

table th {
	padding: 4px 8px;
	text-align: left;
	white-space: nowrap;
	font-weight: 600;
	font-size: 12px;
	font-size: 1.2rem;
	background-color: #eee;
	background-repeat: repeat-x;
	border-bottom: 1px solid #ddd;
}
table td {
	padding: 8px;
	text-align: left;
	border-bottom: 1px solid #eee;
}
table td.tleft {
	text-align: left;
}

table td.tright {
	text-align: right;
}

table td.tcenter {
	text-align: center;
}

table td.empty-table {
	color: #888;
	padding: 32px 16px;
	text-align: center;
}

.light {
	color: #c8c8c9;
}

.field {
	*zoom: 1;
	margin-bottom: 20px;
}

.field:before,
.field:after {
	display: table;
	content: "";
}

.field:after {
	clear: both;
}

.field label {
	font-size: 14px;
	font-size: 1.4rem;
	display: inline-block;
	font-weight: 400;
	cursor: pointer;
}

.field label:first-child {
	margin-bottom: 6px;
}

.field label:last-child {
	margin-bottom: 0;
}

.field label+.fieldnote {
	margin-left: 8px;
}

.field .fieldnote {
	color: #888;
	font-size: 13px;
	font-size: 1.3rem;
	font-weight: 400;
}

.field .input,
.field input[type=text],
.field input[type=password],
.field input[type=email],
.field input[type=tel],
.field input[type=number],
.field input[type=url],
.field input[type=file],
.field textarea,
.field .textarea,
.field select,
.field .select {
	font-size: 15px;
	font-size: 1.5rem;
	font-family: "Open Sans", Helvetica, Arial, sans-serif;
	line-height: 1.4;
	display: block;
	width: 100%;
	font-weight: 400;
	-webkit-font-smoothing: antialiased;
	color: #444;
	background-color: #fff;
	outline: none;
	border: 1px solid #ccc;
	border-radius: 2px;
	-moz-osx-font-smoothing: grayscale;
}

.field .input.error,
.field select.error {
	border: 2px solid #c00;
}

.field .input:focus,
.field input[type=text]:focus,
.field input[type=password]:focus,
.field input[type=email]:focus,
.field input[type=tel]:focus,
.field input[type=number]:focus,
.field input[type=url]:focus,
.field input[type=file]:focus,
.field textarea:focus,
.field .textarea:focus,
.field select:focus,
.field .select:focus {
	border-color: #693;
	box-shadow: #693 0 0 2px;
}

.field .input,
.field input[type=text],
.field input[type=password],
.field input[type=email],
.field input[type=tel],
.field input[type=number],
.field input[type=url],
.field textarea,
.field .textarea {
	padding: 5px 8px;
}

.field input[type=color] {
	padding: 0px;
}

.field .input.input--large,
.field input[type=text].input--large,
.field input[type=password].input--large,
.field input[type=email].input--large,
.field input[type=tel].input--large,
.field input[type=number].input--large,
.field input[type=url].input--large,
.field textarea.input--large,
.field .textarea.input--large {
	font-size: 16px;
	font-size: 1.6rem;
	padding: 8px;
}

.field input[type=file] {
	background-color: transparent;
	border: none;
}

.field select,
.field .select {
	padding: 5px 8px;
	padding-right: 20px;
	background-position: right center;
	background-repeat: no-repeat;
	border-radius: 4px;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
	background-image: url("../images/select.png");
}



.field select.select--large,
.field .select.select--large {
	font-size: 16px;
	font-size: 1.6rem;
	padding: 8px;
}

.field input[type=checkbox],
.field input[type=radio] {
	vertical-align: baseline;
}

.field input[type=checkbox]:focus,
.field input[type=radio]:focus {
	border-color: #693;
	box-shadow: #693 0 0 2px;
}

.field input[type=checkbox]:focus+label,
.field input[type=radio]:focus+label {
	font-weight: 600;
}

.field input[type=checkbox]+label,
.field input[type=radio]+label {
	margin-left: 4px;
	vertical-align: baseline;
}

.field.important label {
	font-weight: 600;
}

.field.required label {
	font-weight: 700;
}

.field.required label:after {
	content: ' *';
	font-weight: 400;
	color: #933;
}

.field--hidden-label label,
.field--hidden-label label+br {
	display: none;
}

label {
	cursor: pointer;
}

.shirt-builder {
	padding-top: 20px;
	padding-bottom: 20px;
	color: #fff;
	background-color: #025077;
	background-image: linear-gradient(to top, #025077 0%, #026190 100%);
	transition: .25s ease;
}

/* finished screen */

.design-alt-styles>.caption {
	font-size: 28px;
	font-weight: bold;
}

.design-alt-styles>.button {}

#style-options {
	display: inline-block;
	padding-top: 5px;
}

#style-options>.resize {
	display: inline-block;
	background-size: 100px;
	background-repeat: no-repeat;
	background-position-y: bottom;
	width: 105px;
	height: 130px;
	border: solid 2px rgba(0, 0, 0, 0);
}

#style-options>.style {
	display: inline-block;
	background-size: 100px;
	background-repeat: no-repeat;
	background-position-y: bottom;
	width: 110px;
	height: 130px;
	border: solid 2px rgba(0, 0, 0, 0);
	cursor: pointer;
	margin-right: 4px;
}

#style-options>.style.enabled {
	border: solid 2px #3399cc !important;
	background-color: rgba(51, 153, 204, 0.34);
	border-radius: 2px;
}

#style-options>.style.completed {
	border: solid 2px #8bc34a !important;
	background-color: rgba(76, 175, 80, 0.34);
	border-radius: 2px;
}

#style-options>.style>.selectbox {
	position: absolute;
	top: 0;
	width: 20px;
	height: 20px;
	margin: 4px 0px 0px 4px;
	border: solid 3px #3399cc;
	z-index: 5;
}

#style-options>.style.completed>.selectbox {
	border: solid 3px #aed581;
}

#style-options>.style>.selectbox>.title {
	color: #FFF;
	font-size: 14px;
	margin-left: 23px;
	width: 60px;
	height: 14px;
}

#style-options>.style>.selectbox>.title.small {
	font-size: 10px;
}

#style-options>.style>.selectbox>.title>div {
	position: relative;
	top: 50%;
	transform: translateY(-50%);
	width: 60px;
}

#style-options>.style.enabled>.selectbox>.checkmark,
#style-options>.style.completed>.selectbox>.checkmark {
	background-image: url(../images/altStyle_check.png);
	background-repeat: no-repeat;
	width: 24px;
	height: 24px;
	background-size: 24px;
	position: absolute;
	top: -6px;
	left: -4px;
	z-index: 10;
}

#style-options>.style.completed>.selectbox>.checkmark {
	background-image: url(../images/altStyle_check_green.png);
}

.design-alt-styles>.button.button--nothanks {
	float: right;
	font-weight: 400;
	color: #fff;
	background-color: #699fcc;
	border-color: #699fcc;
}

.shirt-builder h2 .fa {
	vertical-align: middle;
}

#add-text-options {
	width: 100%;
	max-width: 400px;
}

#all-product-gallery {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	align-items: stretch;
	padding-top: 9px;
	width: 100%;
	overflow-y: scroll;
	height: 600px;
	position: relative;
	padding: 7px 0px 0px 7px;
	margin-top: -27px;
}

#all-product-gallery>.product {
	min-width: 120px;
	display: inline-block;
	border: solid 1px #fff;
	max-width: 120px;
	min-height: 159px;
	font-size: 15px;
	text-align: center;
	vertical-align: top;
	cursor: pointer;
	margin-bottom: 8px;
	position: relative;
}

#all-product-gallery>.product>img {
	max-width: 120px;
	padding-top: 10px;
}

#all-product-gallery>.product.check {
	background-color: #d9e6cc;
	border: solid 1px #73a144;
}

#all-product-gallery>.product>.check {
	display: none;
	background-color: #6d9e3d;
	width: 35px;
	height: 35px;
	border-radius: 20px;
	font-size: 20px;
	margin: -6px;
	position: absolute;
}

#all-product-gallery>.product.check>.check {
	display: block;
}

#all-product-gallery>.product>.check:after {
	color: #fff;
	content: "\2713";
	font-size: 25px;
	margin-left: -2px;
	font-weight: bold;
}

#all-product-gallery>.product>.title {
	color: #dadada;
	position: absolute;
	bottom: 0;
	text-align: center;
	width: 100%;
}

#all-product-gallery>.product.check>.title,
#all-product-gallery>.product:hover>.title {
	color: #000;
	font-size: 15px;
	color: #5f5f5f;
}

#all-product-gallery>.product:hover {
	background-color: #e7f7ff;
	border: solid 1px #a0daf7;
}

#all-product-gallery>.product>.new-product {
	background-color: #ccc;
	width: 20px;
	height: 20px;
	position: absolute;
	top: 0;
	right: 0;
}

#all-product-gallery>.product>.new-product>div {
	background-color: #e22727;
	content: "NEW";
	width: 35px;
	height: 35px;
	border-radius: 20px;
	font-size: 20px;
	margin: -6px;
	position: absolute;
	color: #FFF;
	font-size: 12px;
	z-index: 2;
	line-height: 32px;
}

#all-product-gallery>.product>.new-product-beta {
	background-color: #ccc;
	width: 20px;
	height: 20px;
	position: absolute;
	top: 0;
	right: 0;
}

#all-product-gallery>.product>.new-product-beta>div {
	background-color: #27bbe2;
	content: "NEW";
	width: 35px;
	height: 35px;
	border-radius: 20px;
	font-size: 20px;
	margin: -6px;
	position: absolute;
	color: #FFF;
	font-size: 12px;
	z-index: 2;
	line-height: 32px;
}

#product-gallery-filters {
	display: flex;
}

#product-gallery-filters>.filter {
	display: flex;
	background-image: linear-gradient(#ffffff, #f7f7f7);
	flex-wrap: nowrap;
	width: 100%;
	padding: 0px 7px;
	font-size: 14px;
	height: 41px;
	align-items: center;
	justify-content: center;
	cursor: pointer;
}

#product-gallery-filters>.filter.selected,
#product-gallery-filters>.filter:hover {
	background-image: linear-gradient(#e0f7ff, #d0e5fb);
}

/* Design Guides */
.guide-wrap {}

.guide-wrap>.product {
	padding-bottom: 10px;
}

.guide-wrap>.product>.title {
	width: 100%;
	max-width: 917px;
	height: 35px;
	background-color: #e6e6e6;
	border: solid 2px #c1c1c1;
	font-size: 23px;
	padding-left: 11px;
	line-height: 33px;
	overflow: hidden;
}

.guide-wrap>.product>.title>.dropdown {
	float: right;
	border: solid black;
	border-width: 0 3px 3px 0;
	display: inline-block;
	padding: 4px;
	margin-right: 12px;
	margin-top: 9px;
}

.guide-wrap>.product>.title>.dropdown.down {
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
}

.guide-wrap>.product>.information {
	/*display:none;*/
	background-color: #ffffff;
	padding: 4px 22px;
	width: 100%;
	max-width: 915px;
	border: solid 1px #ececec;
}

dl {
	margin-bottom: 24px;
	overflow: hidden;
	zoom: 1;
}

dt {
	float: left;
	width: 250px;
	margin-right: 8px;
	clear: left;
	font-weight: 600;
	margin-bottom: 4px;
	min-height: 24px;
}

dd {
	margin-left: 255px;
	margin-bottom: 4px;
	border-left: 1px dotted #ddd;
	padding-left: 16px;
	min-height: 24px;
}

dt.line,
dd.line {
	border-top: solid 1px #ddd;
	max-width: 100px;
}

.product>.information>.desc {}

.product>.information>.detail {}

.product>.information>.detail:after {
	clear: both;
}

#template-gallery-options {
	width: 100%;
	height: 500px;
	overflow-y: scroll;
}

#template-gallery-options>.gallery-wrap {
	display: inline-block;
	padding: 1px 5px;
	vertical-align: top;
}

.gallery-wrap>a>.title {
	width: 110px;
	overflow: hidden;
	min-height: 44px;
	word-wrap: break-word;
	max-height: 44px;
	color: #FFF;
}

.temp_gen.black {
	background-color: #000 !important;
}

.temp_gen.white {
	background-color: #FFF !important;
}

.temp_gen.charcoalgrey {
	background-color: #787a81 !important;
}

.temp_gen.daisy {
	background-color: #efce1f !important;
}

.temp_gen.darkchocolate {
	background-color: #54453d !important;
}

.temp_gen.forestgreen {
	background-color: #214637 !important;
}

.temp_gen.gold {
	background-color: #d5ab47 !important;
}

.temp_gen.irishgreen {
	background-color: #50af72 !important;
}

.temp_gen.lightblue {
	background-color: #96bddf !important;
}

.temp_gen.lightpink {
	background-color: #e8a4a7 !important;
}

.temp_gen.militarygreen {
	background-color: #4e5347 !important;
}

.temp_gen.navy {
	background-color: #11285a !important;
}

.temp_gen.orange {
	background-color: #e76621 !important;
}

.temp_gen.purple {
	background-color: #52316d !important;
}

.temp_gen.red {
	background-color: #d72739 !important;
}

.temp_gen.royalblue {
	background-color: #3572b5 !important;
}

.temp_gen.sportgrey {
	background-color: #a9a9aa !important;
}

.temp_gen.tan {
	background-color: #ddccae !important;
}

.temp_gen.navyringer {
	background-color: #FFF !important;
}

.temp_gen.blackringer {
	background-color: #FFF !important;
}

.temp_gen.redringer {
	background-color: #FFF !important;
}

.temp_gen.burgundy {
	background-color: #b0486b !important;
}

.template-text-option-input.uppercase {
	text-transform: uppercase;
}

.template-text-option-input.lowercase {
	text-transform: lowercase;
}

#getting-started,
#completed,
#create-error,
#html5-text-tool,
#html5-template-tool,
#html5-template-tool-editor,
#html5-multiple-text-tool,
#shutterstock-gallery {
	transition: .35s ease;
}

#getting-started.is-hidden,
#completed.is-hidden,
#create-error.is-hidden,
#html5-text-tool.is-hidden,
#html5-template-tool.is-hidden,
#html5-template-tool-editor.is-hidden,
#html5-multiple-text-tool.is-hidden,
#shutterstock-gallery.is-hidden,
#ai-image-generator-gallery.is-hidden {
	opacity: 0;
	display: none;
}

.tshirt-controls-toggles,
.tshirt-aspect-options,
.tshirt-aspect-options-puzzle {
	margin-top: 15px;
	text-align: center;
}

.shirt-builder-tools {
	*zoom: 1;
	margin: 22px auto;
	text-align: center;
	white-space: nowrap;
}

.shirt-builder-tools:before,
.shirt-builder-tools:after {
	display: table;
	content: "";
}

.shirt-builder-tools:after {
	clear: both;
}

.shirt-builder-tools .button {
	min-width: 86px;
	vertical-align: middle;
}
.shirt-builder-cta {
	margin-right: auto;
	margin-left: auto;
	max-width: 500px;
	text-align: center;
}

.get-started .field {
	margin-bottom: 0;
}

.get-started .field:before {
	content: none;
}

.get-started .field > label,
.get-started-label > label {
	font-size: 18px;
	font-size: 1.8rem;
}
ol.get-started {
	*zoom: 1;
	margin: 0;
	margin-bottom: 22px;
	padding: 0;
	list-style: none;
	counter-reset: steps;
}

ol.get-started:before,
ol.get-started:after {
	display: table;
	content: "";
}

ol.get-started:after {
	clear: both;
}

ol.get-started>li {
	position: relative;
	margin: 0;
	margin-bottom: 22px;
	margin-left: 44px;
	padding: 0;
}

ol.get-started>li:before {
	font-size: 16px;
	font-size: 1.6rem;
	position: absolute;
	top: 0;
	right: 100%;
	display: block;
	float: left;
	margin-right: 12px;
	min-width: 32px;
	content: counter(steps);
	counter-increment: steps;
	text-align: center;
	font-weight: 600;
	line-height: 32px;
	color: #025077;
	background-color: #ffffff;
	background-color: rgba(255, 255, 255, 0.5);
	background-image: linear-gradient(to top, rgba(255, 255, 255, 0.25) 0%, #ffffff 100%);
	border-radius: 100px;
	box-shadow: inset rgba(255, 255, 255, 0.1) 0 1px 0, rgba(0, 0, 0, 0.15) 0 1px 2px;
}

ol.get-started>li.completed:before {
	display: inline-block;
	font: normal normal normal 14px/1 FontAwesome;
	font-size: inherit;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	transform: translate(0, 0);
	font-size: 16px;
	font-size: 1.6rem;
	display: block;
	content: counter(steps);
	font-weight: 600;
	line-height: 32px;
	color: #fff;
	background-color: #693;
	background-image: linear-gradient(to top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.1) 100%);
	border-color: #693;
}

#cover.puzzle {
	background-image: url("../images/puzzle_top.png");
	background-size: 70px;
}

.node,
.resize-handle {
	display: none;
	width: 12px;
	height: 12px;
	position: absolute;
	top: 126px;
	left: 70px;
	background-color: transparent;
	z-index: 100;
	cursor: w-resize;
	border: solid 2px #0000006e;
	background-color: #000;
}
.resize-handle.top,
.resize-handle.bottom {
cursor: ns-resize;
}
#tshirt.hide {}

.tshirt.hide:before {
	display: none;
}

.tshirt-designer-html5 {
	width: 50%;
	z-index: 2;
	margin-top: 15px;
}

.tshirt-designer-html5.dotted {
	border: dotted 1.5px grey;
}

.tshirt-designer-html5.dotted.removedot {
	border: dotted 1.5px transparent;
}

.tshirt-designer-html5.full {
	width: 100% !important;
	margin: 0 !important;
	max-width: 500px;
}

#tdesigner5.puzzle {
	background-color: #FFF;
}

.design-foot-note {
	display: none;
	text-align: center;
	font-size: 12px;
	color: #efefef;
}

.tshirt-designer-html5,
.tshirt-designer-html5.standard {
	width: 32%;
	margin: 60px 114px;
}

.tshirt-designer-html5.mensfitted {
	width: 35%;
	margin: 60px 105px;
}

.tshirt-designer-html5.ladies {
	width: 33%;
	margin: 68px 117px;
}

.tshirt-designer-html5.hoodie {
	width: 24%;
	margin: 71px 125px;
}

.tshirt-designer-html5.apron {
	width: 24%;
	margin: 54px 126px;
}

.tshirt-designer-html5.vneck {
	width: 32%;
	margin: 62px 116px;
}

.tshirt-designer-html5.tanktops {
	width: 34%;
	margin: 78px 115px;
}

.tshirt-designer-html5.kids {
	width: 36%;
	margin: 79px 108px;
}

.tshirt-designer-html5.babyonepiece {
	width: 36%;
	margin: 63px 106px;
}

.tshirt-designer-html5.longsleeve {
	width: 31%;
	margin: 60px 115px;
}

.tshirt-designer-html5.ladiespremium {
	width: 28%;
	margin: 68px 124px;
}

.tshirt-designer-html5.ladiestanktop {
	width: 27%;
	margin: 73px 125px;
}

.tshirt-designer-html5.crewnecksweatshirt {
	width: 28%;
	margin: 53px 119px;
}

.tshirt-designer-html5.sleeveraglan,
.tshirt-designer-html5.baseballraglan {
	width: 33%;
	margin: 68px 117px;
}

.tshirt-designer-html5.vintage {
	width: 33%;
	margin: 68px 117px;
}
.tshirt-designer-html5.ringer {
	width: 35%;
	margin: 60px 105px;
}
.tshirt-designer-html5.mug {
	width: 47%;
	margin: 48px 45px;
}

.tshirt-designer-html5.hat {
	width: 83%;
	margin: 107px 83px;
}

.tshirt-designer-html5.truckerhat {
	width: 57%;
	margin: 110px 75px;
}

.tshirt-designer-html5.totebag {
	width: 41%;
	margin: 76px 94px;
}

.tshirt-designer-html5.dog {
	width: 39%;
	margin: 45px 98px;
}

.tshirt-designer-html5.mousepad {
	width: 101%;
	margin: -1px -1px;
}

.tshirt-designer-html5.puzzle {
	width: 71%;
	margin: 0px -69px;
}

.tshirt-designer-html5.stretchedcanvas,
.tshirt-designer-html5.posterpaper,
.tshirt-designer-html5.framedcanvas,
.tshirt-designer-html5.peelandstick {
	width: 63%;
	margin: 3px -114px;
}

.tshirt-designer-html5.stretchedcanvas.ratio12,
.tshirt-designer-html5.posterpaper.ratio12,
.tshirt-designer-html5.framedcanvas.ratio12,
.tshirt-designer-html5.peelandstick.ratio12 {
	width: 66%;
	margin: -62px -35px;
}

.tshirt-designer-html5.stretchedcanvas.ratio11,
.tshirt-designer-html5.posterpaper.ratio11,
.tshirt-designer-html5.framedcanvas.ratio11,
.tshirt-designer-html5.peelandstick.ratio11 {
	width: 131%;
	margin: -64px -170px;
}

.tshirt-designer-html5.travelmug {
	width: 36%;
	margin: 20px 104px;
}

.tshirt-designer-html5.facemaskcover {
	width: 82%;
	margin: 0px -63px;
}

.tshirt-designer-html5.neckgaiter {
	width: 48%;
	margin: 37px 83px;
}

.tshirt-designer-html5.allovertshirt {
	width: 100%;
	margin: -59px -107px;
}

.tshirt-designer-html5.snowflakeornament {
	width: 60%;
	margin: 85px 8px;
}

.tshirt-designer-html5.tiedye {
	width: 50%;
	margin: 25px 4px;
}

.tshirt-designer-html5.youthhoodie {
	width: 35%;
	margin: 70px 20px;
}

.tshirt-designer-html5.kidstiedye {
	width: 50%;
	margin: 25px 4px;
}

.tshirt-designer-html5.babybib {
	width: 50%;
	margin: 165px 0px;
}

.tshirt-designer-html5.canvasthrowpillow,
.tshirt-designer-html5.suedethrowpillow {
	width: 100%;
	margin: -59px -107px;
}

#backgroundpreview.facemaskcover {
	width: 82%;
	margin: 0px -62px;
}

#backgroundpreview.snowflakeornament {
	width: 100%;
	margin: 0px -61px;
}

#backgroundpreview.facemaskcover.full,
#backgroundpreview.snowflakeornament.full {
	display: none;
}

.tshirt-designer-html5.back {
	margin-top: -20px;
}

.design-guide-link {
	color: #FFF;
	text-decoration: underline;
	margin-left: 100px;
}
/*model2*/
.tshirt-designer-html5.standard.model2,
.tshirt-designer-html5.mensfitted.model2 {
	width: 33%;
	margin: 62px 115px;
}

.tshirt-designer-html5.ladies.model2 {
	width: 29%;
	margin: 82px 126px;
}

.tshirt-designer-html5.hoodie.model2 {
	width: 23%;
	margin: 67px 135px;
}

.tshirt-designer-html5.vneck.model2 {
	width: 33%;
	margin: 91px 115px;
}

.tshirt-designer-html5.tanktops.model2 {
	width: 30%;
	margin: 105px 126px;
}

.tshirt-designer-html5.kids.model2 {
	width: 33%;
	margin: 77px 117px;
}

.tshirt-designer-html5.vintage.model2 {
	width: 33%;
	margin: 77px 117px;
}


#reg-domainname {
	text-transform: lowercase;
}

#tdesigner5 {
	z-index: 1;
}

#tdesigner5.full {
	z-index: 1;
	position: relative;
	/*left: -15px;*/
}

#tdesigner5_back,
#textlayer_back {
	display: none;
	z-index: 1;
}

#cover,
#wm,
#textlayer,
#textlayer_back,
#backgroundpreview {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 99;
}

#cover.full,
#wm.full {
	left: 15px;
}

.wrapCanvas {
	position: relative;
}

.wrapCanvas.small {
	position: absolute;
	top: 0px;
	left: -15px;
}
.offline-wrapper {
	display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    align-content: center;

}
.canvas-cover {
	position: absolute;
	z-index: 3;
	color: #fff;
	top: 44%;
	background: rgba(1, 1, 1, 0.5);
	width: 47%;
	font-size: 33px;
	left: 19px;
}

.canvas-covera.hide {
	z-index: 0;
}

.tshirt {
	position: relative;
	margin-right: auto;
	margin-bottom: 22px;
	margin-left: auto;
	max-width: 667px;
	background-position: center top;
	background-size: contain;
	background-repeat: no-repeat;
}

.tshirt.new {
	/*width: 400px;*/
	width: 100%;
}

.expandable_fieldname>.expand {
	display: none;
}

#order_price {
	display: inline-block;
}

.tshirt.droppler-active {
	cursor: crosshair;
}

.tshirt:before {
	display: block;
	padding-top: 96.15384615%;
	content: '';
}

.tshirt #DefaultShirt {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	display: block;
	margin-right: auto;
	margin-left: auto;
	width: 85.33653846%;
}
#tshirt {
	padding-left: 10px;
}
#tshirt > #bounds {
	width: 32%;
	height: 45%;
	top: 0;
	position: absolute;
	z-index: 5;
	left: 0;
	margin-left: 34%;
	margin-top: 23%;
}


.wizard {
	position: relative;
}

.wizard fieldset {
	position: absolute;
	visibility: hidden;
	margin: auto;
	max-width: 440px;
	padding-left: 10px;
	padding-right: 10px;
	width: 100%;
	text-align: left;
	opacity: 0;
	transition: .7s ease;
	pointer-events: none;
	left: 0;
	right: 0;
}

.wizard fieldset.next {
	transform: translateX(100%);
	position: absolute;
}

.wizard fieldset.current {
	visibility: visible;
	opacity: 1;
	transform: translateX(0%);
	pointer-events: all;
}

.wizard fieldset.completed {
	transform: translateX(-100%);
}

.wizard fieldset .field,
.wizard fieldset .button {
	margin-right: auto;
	margin-left: auto;
}

.wizard fieldset .button {
	display: block;
}

.wizard fieldset .button+.button {
	margin-top: 12px;
}

.dev-toolbar {
	*zoom: 1;
	font-size: 11px;
	position: relative;
	z-index: 10;
	padding-top: 8px;
	padding-bottom: 8px;
	text-align: center;
	color: #fff;
	background: repeating-linear-gradient(-45deg, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1) 12px, rgba(0, 0, 0, 0) 12px, rgba(0, 0, 0, 0) 24px);
	background-color: #BC2700;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

.dev-toolbar:before,
.dev-toolbar:after {
	display: table;
	content: "";
}

.dev-toolbar:after {
	clear: both;
}

.dev-toolbar a {
	color: #fff;
	text-decoration: underline;
}

.page-container {
	position: relative;
	min-height: 100%;
	min-height: 100vh;
	width: 100%;
	background-color: #eee;
}

.page-container#welcome {
	color: #fff;
	background-color: #025077;
	background-image: linear-gradient(to top, #025077 0%, #026190 100%);
}

.welcome-header {
	*zoom: 1;
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	z-index: 2;
	max-height: 112px;
	color: #fff;
	background-image: linear-gradient(rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0));
	user-select: none;
}

.welcome-header:before,
.welcome-header:after {
	display: table;
	content: "";
}

.welcome-header:after {
	clear: both;
}

.welcome-header .container {
	padding-top: 16px;
	padding-bottom: 16px;
	transition: .35s ease;
}


.fade-welcome-header .welcome-header .container {
	opacity: 0;
	white-space: nowrap;
}

.middle--frame {
	text-align: center;
}

.welcome-header .button--link {
	margin-top: 4px;
	margin-bottom: 4px;
	background-color: rgba(255, 255, 255, 0.1);
	position: relative;
}

.welcome-header .button--link.button-space {
	padding-left: 40px;
}

.button-icon {
	display: inline-block;
}

.button-icon {
	position: absolute;
	left: 5px;
	top: 5px;
	padding-right: 20px;
	font-size: 26px;
}

.button-icon>img {
	height: 30px;
}

.welcome-header .button--link.left {
	display: inline-block;
}

.welcome-header .button--link:hover {
	background-color: #025077;
	color: #FFF;
}

.button--login--right {
	float: right;
}

.welcome-panel {
	position: relative;
	z-index: 1;
	display: table;
	overflow: hidden;
	min-height: 100%;
	min-height: 100vh;
	width: 100%;
	color: #fff;
	transition: .35s ease;
}

.fade-welcome-header .welcome-panel {
	opacity: 0;
}

.welcome-panel .welcome-panel-wizard {
	width: 100%;
	height: 100%;
	position: relative;
	display: table-cell;
	padding: 80px 0;
	vertical-align: middle;
	text-align: center;
}

.welcome-panel .notice {
	margin-right: auto;
	margin-left: auto;
	max-width: 400px;
}

.welcome-panel-logo {
	margin-bottom: 20px;
	text-align: center;
}

.welcome-panel-logo img {
	margin-right: auto;
	margin-left: auto;
	transition: opacity 0.15s ease;
}

.welcome-panel-logo a:hover>img {
	opacity: .75;
}

.welcome-explore-tab {
	font-size: 16px;
	font-size: 1.6rem;
	position: absolute;
	bottom: 0;
	left: 50%;
	z-index: 1;
	display: block;
	padding-right: 36px;
	padding-left: 36px;
	text-align: center;
	text-decoration: none !important;
	white-space: nowrap;
	line-height: 40px;
	color: rgba(255, 255, 255, 0.75);
	background-color: rgba(0, 0, 0, 0.35);
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	transition: .35s ease;
	transform: translateX(-50%);
}

.welcome-explore-tab .fa {
	margin-right: 4px;
	color: rgba(255, 255, 255, 0.35);
	transition: .35s ease;
}

.welcome-explore-tab:hover {
	color: #ffffff;
	background-color: #193340;
}

.welcome-explore-tab:hover .fa {
	color: rgba(255, 255, 255, 0.6);
}

.fade-welcome-header .welcome-explore-tab {
	background-color: #193340;
}

.welcome-explore-button {
	display: block;
	margin-top: 32px !important;
	max-width: 236px;
}

.welcome-hero-bg {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 0;
	background-position: center center;
	background-size: cover;
}

.welcome-hero-bg:before {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1;
	display: block;
	content: '';
	background-color: rgba(0, 0, 0, 0.5);
}

.welcome-hero-bg img {
	width: auto;
	height: auto;
	position: absolute;
	right: 0;
	bottom: 0;
	z-index: 0;
	display: block;
	min-width: 100%;
	min-height: 100%;
}

.store-field {
	*zoom: 1;
	margin-right: auto;
	margin-bottom: 10px;
	margin-left: auto;
}

.store-field:before,
.store-field:after {
	display: table;
	content: "";
}

.store-field:after {
	clear: both;
}

.store-field:last-child {
	margin-bottom: 20px;
}

.store-field [type="radio"]:not(:checked),
.store-field [type="radio"]:checked,
.store-field [type="checkbox"]:not(:checked),
.store-field [type="checkbox"]:checked {
	position: absolute;
	left: -9999px;
}

.store-field [type="radio"]:not(:checked)+label,
.store-field [type="radio"]:checked+label,
.store-field [type="checkbox"]:not(:checked)+label,
.store-field [type="checkbox"]:checked+label {
	font-size: 16px;
	font-size: 1.6rem;
	position: relative;
	display: block;
	padding-left: 32px;
	min-height: 20px;
	max-width: 100%;
	vertical-align: top;
	cursor: pointer;
}

.store-field [type="radio"]:not(:checked)+label:last-child,
.store-field [type="radio"]:checked+label:last-child,
.store-field [type="checkbox"]:not(:checked)+label:last-child,
.store-field [type="checkbox"]:checked+label:last-child {
	margin-bottom: 0;
}

.store-field [type="radio"]:not(:checked)+label:before,
.store-field [type="radio"]:checked+label:before,
.store-field [type="checkbox"]:not(:checked)+label:before,
.store-field [type="checkbox"]:checked+label:before {
	width: 20px;
	height: 20px;
	position: absolute;
	top: 1px;
	left: 0;
	display: block;
	content: '';
	background-color: #fff;
	background-color: rgba(255, 255, 255, 0.75);
	background-image: linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
	border-radius: 2px;
	box-shadow: rgba(0, 0, 0, 0.15) 0 1px 2px;
	transition: 0.15s ease;
}

.store-field [type="radio"]:not(:checked)+label:after,
.store-field [type="radio"]:checked+label:after,
.store-field [type="checkbox"]:not(:checked)+label:after,
.store-field [type="checkbox"]:checked+label:after {
	font-size: 20px;
	width: 20px;
	height: 20px;
	display: inline-block;
	font: normal normal normal 14px/1 FontAwesome;
	font-size: inherit;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	transform: translate(0, 0);
	position: absolute;
	top: 1px;
	left: 0;
	display: block;
	content: "\f00c";
	text-align: center;
	line-height: 20px;
	transition: 0.15s ease;
	transform-origin: center center;
}

.store-field [type="radio"]:not(:checked)+label a,
.store-field [type="radio"]:checked+label a,
.store-field [type="checkbox"]:not(:checked)+label a,
.store-field [type="checkbox"]:checked+label a {
	text-decoration: underline;
	color: #fff;
}

.store-field [type="radio"]:not(:checked):disabled+label,
.store-field [type="radio"]:checked:disabled+label,
.store-field [type="checkbox"]:not(:checked):disabled+label,
.store-field [type="checkbox"]:checked:disabled+label {
	opacity: .5;
	cursor: default;
	pointer-events: none;
}

.store-field [type="radio"]:not(:checked)+label:after,
.store-field [type="checkbox"]:not(:checked)+label:after {
	visibility: hidden;
	opacity: 0;
	transition: opacity 0.15s ease, transform 3.5s ease;
	transform: scale(2);
}

.store-field [type="radio"]:not(:checked)+label:hover:before,
.store-field [type="checkbox"]:not(:checked)+label:hover:before {
	background-color: rgba(255, 255, 255, 0.85);
}

.store-field [type="radio"]:not(:checked)+label:active:before,
.store-field [type="checkbox"]:not(:checked)+label:active:before {
	background-color: rgba(255, 255, 255, 0.5);
	background-image: linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
}

.store-field [type="radio"]:checked+label:before,
.store-field [type="checkbox"]:checked+label:before {
	background-color: #693;
	background-image: linear-gradient(rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0));
	box-shadow: rgba(0, 0, 0, 0.15) 0 1px 2px, inset #693 0 0 0 1px, inset rgba(255, 255, 255, 0.1) 0 2px 0 0;
}

.store-field [type="radio"]:checked+label:after,
.store-field [type="checkbox"]:checked+label:after {
	visibility: visible;
	opacity: 1;
	transition: 0.15s ease;
	transform: scale(1);
}

.store-field [type="radio"]:checked+label:hover:before,
.store-field [type="checkbox"]:checked+label:hover:before {
	background-color: #73ac39;
	box-shadow: rgba(0, 0, 0, 0.15) 0 1px 2px, inset #73ac39 0 0 0 1px, inset rgba(255, 255, 255, 0.1) 0 2px 0 0;
}

.store-field [type="radio"]:checked+label:active:before,
.store-field [type="checkbox"]:checked+label:active:before {
	background-color: #360;
	box-shadow: rgba(0, 0, 0, 0.15) 0 1px 2px, inset #360 0 0 0 1px, inset rgba(255, 255, 255, 0.1) 0 2px 0 0;
}

.price-year {
	display: none;
}

.plan-field,
.plan-term {
	font-size: 14px;
	font-size: 1.4rem;
	position: relative;
	margin-bottom: 10px;
}

.plan-term.half {
	display: inline-block;
	width: 49%;
	text-align: center;
}

.plan-field [type="radio"],
.plan-field [type="checkbox"],
.plan-term [type="radio"],
.plan-term [type="checkbox"] {
	position: absolute;
	left: -9999px;
}

.plan-field [type="radio"]:checked+label,
.plan-field [type="checkbox"]:checked+label,
.plan-term [type="radio"]:checked+label,
.plan-term [type="checkbox"]:checked+label {
	color: #fff;
	background-color: #39c;
}

.plan-field [type="radio"]:checked+label:after,
.plan-field [type="checkbox"]:checked+label:after,
.plan-term [type="radio"]:checked+label:after,
.plan-term [type="checkbox"]:checked+label:after {
	opacity: 1;
	transition: opacity .35s ease, transform .35s ease;
	transform: scale(1);
}

.plan-field label,
.plan-term label {
	position: relative;
	display: block;
	overflow: hidden;
	padding: 10px;
	background-color: rgba(0, 0, 0, 0.5);
	border-radius: 4px;
	cursor: pointer;
	transition: .35s ease;
}

.plan-field label:hover {
	background-color: rgba(2, 80, 119, 0.65);
}

.plan-field label:after {
	display: inline-block;
	font: normal normal normal 14px/1 FontAwesome;
	font-size: inherit;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	transform: translate(0, 0);
	font-size: 24px;
	position: absolute;
	right: 10px;
	bottom: 10px;
	content: "\f00c";
	opacity: 0;
	transition: opacity 0.15s ease, transform 3.5s ease;
	transform: scale(2);
}

.plan-field ul {
	display: block;
	clear: both;
	margin: 0;
}

.plan-field ul li {
	margin: 0;
}

.plan-field ul li:last-child {
	padding-right: 24px;
}

.plan-field .plan-field-title {
	font-size: 18px;
	font-size: 1.8rem;
	float: left;
	margin: 0;
	margin-bottom: 5.5px;
	font-weight: 700;
}

.plan-field .plan-field-price {
	font-size: 24px;
	float: right;
	font-weight: 300;
}

.color-fields {
	*zoom: 1;
	margin-bottom: 20px;
	text-align: center;
}

.color-fields:before,
.color-fields:after {
	display: table;
	content: "";
}

.color-fields:after {
	clear: both;
}

.color-field {
	position: relative;
	display: inline-block;
	margin: 10px;
	vertical-align: middle;
}

.color-field [type="radio"],
.color-field [type="checkbox"] {
	position: absolute;
	left: -9999px;
}

.color-field [type="radio"]+label,
.color-field [type="checkbox"]+label {
	width: 48px;
	height: 48px;
	display: inline-block;
	overflow: hidden;
	text-align: center;
	white-space: nowrap;
	line-height: 48px;
	color: rgba(255, 255, 255, 0);
	background-image: linear-gradient(to top, rgba(0, 0, 0, 0.15) 0%, rgba(0, 0, 0, 0) 100%);
	border-radius: 100px;
	box-shadow: #fff 0 0 0 1px, rgba(0, 0, 0, 0.15) 0 1px 2px;
	transition: .35s ease;
}


.color-field [type="radio"]+label span,
.color-field [type="checkbox"]+label span {
	display: none;
}

.color-field [type="radio"]:checked+label,
.color-field [type="checkbox"]:checked+label {
	background-image: linear-gradient(to top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.25) 100%);
	box-shadow: #fff 0 0 0 3px, rgba(0, 0, 0, 0.15) 0 1px 2px 2px;
}

.color-field--yellow label {
	background-color: #c8c82d;
}

.color-field--red label {
	background-color: #660000;
}

.color-field--purple label {
	background-color: #602056;
}

.color-field--pink label {
	background-color: #d65aa9;
}

.color-field--orange label {
	background-color: #e59522;
}

.color-field--light-blue label {
	background-color: #71b8cc;
}

.color-field--brown label {
	background-color: #603d20;
}

.color-field--blue label {
	background-color: #223597;
}

.color-field--black label {
	background-color: #3a3a3a;
}

.color-field--green label {
	background-color: #406020;
}

.tile-fields {
	*zoom: 1;
	margin-bottom: 20px;
	text-align: center;
}

.tile-fields:before,
.tile-fields:after {
	display: table;
	content: "";
}

.tile-fields:after {
	clear: both;
}

.tile-field {
	position: relative;
	display: inline-block;
	margin: 10px;
	vertical-align: middle;
}

.tile-field [type="radio"],
.tile-field [type="checkbox"] {
	position: absolute;
	left: -9999px;
}

.tile-field [type="radio"]+label,
.tile-field [type="checkbox"]+label {
	width: 48px;
	height: 48px;
	display: inline-block;
	overflow: hidden;
	text-align: center;
	white-space: nowrap;
	line-height: 48px;
	color: rgba(255, 255, 255, 0);
	border-radius: 8px;
	box-shadow: #fff 0 0 0 1px, rgba(0, 0, 0, 0.15) 0 1px 2px;
	transition: .35s ease;
}


.tile-field [type="radio"]+label span,
.tile-field [type="checkbox"]+label span {
	display: none;
}

.tile-field [type="radio"]:checked+label,
.tile-field [type="checkbox"]:checked+label {
	box-shadow: #fff 0 0 0 3px, rgba(0, 0, 0, 0.15) 0 1px 2px 2px;
}

.tile-field--1 label {
	background-image: url("../images//pages/home/tile-1.png");
}

.tile-field--2 label {
	background-image: url("../images//pages/home/tile-2.png");
}

.tile-field--3 label {
	background-image: url("../images//pages/home/tile-3.png");
}

.tile-field--4 label {
	background-image: url("../images//pages/home/tile-4.png");
}

.tile-field--5 label {
	background-image: url("../images//pages/home/tile-5.png");
}

.tile-field--6 label {
	background-image: url("../images//pages/home/tile-6.png");
}

.how-it-works-step-img {
	display: block;
	max-width: 100%;
	height: auto;
	margin-left: auto;
	margin-right: auto;
}


.how-it-works-step p:last-child {
	margin-bottom: 0;
}

.shirt-icon {
	vertical-align: middle;
	margin-right: 8px;
}

.shirt-icon+.display-inline {
	vertical-align: middle;
	font-weight: 600;
}

/* Icons */
.iconset {
	background-image: url(../images/iconset_sprite.png);
	background-repeat: no-repeat;
	background-position: 20px 20px;
	display: inline-block;
	margin-top: 3px;
	width: 20px;
	height: 20px;
	margin-right: 2px;
}

.icon-delete {
	background-position: 0px 0px;
}

.icon-delete:hover {
	background-position: -20px 0px;
}

.icon-edit {
	background-position: 0px -20px;
}

.icon-edit:hover {
	background-position: -20px -20px;
}

.icon-cart {
	background-position: 0px -40px;
}

.icon-cart:hover {
	background-position: -20px -40px;
}

.icon-trash {
	background-position: 0px -60px;
}

.icon-trash:hover {
	background-position: -20px -60px;
}

.icon-barcode {
	background-position: 0px -80px;
}

.icon-barcode:hover {
	background-position: -20px -80px;
}

.icon-money {
	background-position: 0px -100px;
}

.icon-money:hover {
	background-position: -20px -100px;
}

.icon-arrow {
	background-position: 0px -120px;
}

.icon-arrow:hover {
	background-position: -20px -120px;
}

.icon-truck {
	background-position: 0px -140px;
}

.icon-truck:hover {
	background-position: -20px -140px;
}

.icon-tag {
	background-position: 0px -160px;
}

.icon-tag:hover {
	background-position: -20px -160px;
}

.icon-ebay {
	background-position: 0px -180px;
}

.icon-ebay:hover {
	background-position: -20px -180px;
}

.icon-sellinsta {
	background-position: 0px -200px;
}

.icon-sellinsta:hover {
	background-position: -20px -200px;
}

.icon-picture1 {
	background-position: 0px -220px;
}

.icon-picture1:hover {
	background-position: -20px -220px;
}

.icon-picture2 {
	background-position: 0px -240px;
}

.icon-picture2:hover {
	background-position: -20px -240px;
}

.icon-priority {
	background-position: 0px -260px;
}

.icon-priority:hover {
	background-position: -20px -260px;
}

.icon-comment {
	background-position: 0px -280px;
}

.icon-comment:hover {
	background-position: -20px -280px;
}

.icon-resend {
	background-position: 0px -300px;
}

.icon-resend:hover {
	background-position: -20px -300px;
}

.icon-uparrow {
	background-position: 0px -320px;
}

.icon-uparrow:hover {
	background-position: -20px -320px;
}

.icon-downarrow {
	background-position: 0px -340px;
}

.icon-downarrow:hover {
	background-position: -20px -340px;
}

.icon-uparrow2 {
	background-position: 0px -360px;
}

.icon-uparrow2.active {
	background-position: -20px -360px;
}

.icon-downarrow2 {
	background-position: 0px -380px;
}

.icon-downarrow2.active {
	background-position: -20px -380px;
}

.icon-checkbubble {
	background-position: 0px -400px;
}

.icon-checkbubble.active {
	background-position: -20px -400px;
}

.icon-crossbubble {
	background-position: 0px -420px;
}

.icon-crossbubble.active {
	background-position: -20px -420px;
}

.icon-caution {
	background-position: 0px -440px;
}

.icon-caution.active {
	background-position: -20px -440px;
}

.icon-checkorange {
	background-position: 0px -460px;
}

.icon-checkorange.active {
	background-position: -20px -460px;
}

#custom_categories,
#close_cus_cat {
	display: none;
}

.results_box {
	display: none;
	width: 100%;
	max-width: 795px;
	z-index: 1;
	position: absolute;
	background-color: #fff;
	padding-left: 15px;
	border: 1px solid #BBBBBB;
	color: #000;
	padding: 0px 5px;
	cursor: pointer;
}

.front-search-box {
	color: black;
	margin: 10px 0;
	border-width: 1px;
	border-style: solid;
	border-color: #bbb;
	border-radius: 4px;
	padding: 4px;
	min-height: 24px;
	vertical-align: middle;
	-webkit-appearance: textfield;
	background-color: #f2f2f2;
	background-image: url("/images/search_input.png");
	background-repeat: no-repeat;
	background-position: 6px 8px;
	padding-left: 28px !important;
	outline: none;
}

.front-search-box:hover {
	background-color: white;
}

#template-category-dropdown {
	color: black;
	margin: 10px 0;
	border-width: 1px;
	border-style: solid;
	border-color: #bbb;
	border-radius: 4px;
	padding: 4px;
	background-color: #f2f2f2;
	outline: none;
	-webkit-appearance: textfield;
}

.draw-shutter-img {
	cursor: pointer;
}

#shutterstock-gallery-images {
	width: 100%;
	height: 500px;
	overflow-y: scroll;
}

#shutterstock-gallery-images>.gallery-wrap {
	display: inline-block;
	padding: 0 5px 5px 0;
}

.shutterstock-image-info>.contributor {
	text-align: center;
	padding-top: 5px;
	font-size: 15px;
	cursor: pointer;
}

.shutterstock-search-loading {
	position: relative;
	top: -38px;
	z-index: 50;
	color: #000;
	right: -84%;
}

.shutterstock-search-loading.hidden {
	display: none;
}

.agree-shutterstock-terms>.royalty_table {
	display: flex;
	flex-wrap: wrap;
	padding: 0;
	font-size: 14px;
	color: #eaeaea;
	text-align: center;
}

.shutterstock-warn-agreement.hidden {
	display: none;
}

/**
 * AI Image generation
 */
.ai-search-credits-wrap {
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
	flex-wrap: nowrap;
	margin-bottom: 5px;
}

#remaining-ai-credits {
	font-weight: bold;
    margin-left: 10px;
    background-color: #FFF;
    padding: 1px 10px;
    color: #000000;
    border-radius: 5px;
}

#shirt-builder-ai-gen-close {
	margin-top: 50px;
}

.ai-image-search-wrap {

}

.ai-search-form {
	display: flex;
	flex-direction: row;
}
#ai-generate-button {
	background-color: #dc4040;
	border: solid 1px #dc4040;
	color: #FFF;
	display: flex;
    align-items: center;
}

.ai-search-box {
	width: 100%;
	height: 80px;
	padding: 0px 10px;
	color: #000;
}

#ai-image-result {
	height: 500px;
	margin-top: 20px;
	overflow-y: auto;
}

#ai-image-result > img {
	max-width: 400px;
	max-height: 400px;
	cursor: pointer;
	padding: 5px;
}
.ai-result-body-wrap {
	width: 100%;
    padding: 5px 10px;
    display: flex;
    border: solid 1px #065575;
    border-radius: 3px;
    margin-bottom: 20px;
    background-color: #065575;
}
.ai-result-body-wrap > .image-preview {

}
	.image-preview > img {
	    max-height: 200px;
	}
.ai-result-body-wrap > .description-wrap {
	padding-left: 20px;
	position: relative;
	width: 100%;
}
	
	.description-wrap > .prompt-title {
	    font-family: 'Bitter';
    	font-size: 10px;
    	
	}
	.description-wrap > .prompt-text {
	    margin-top: 10px;
    	font-size: 16px;
	}
	.description-wrap > .foot-note {
	    position: absolute;
	    bottom: 4px;
	    right: 4px;
	    font-size: 10px;
	}
#ai-message-result.hidden {
	display: none;
}

#ai-message-result.error {
	background-color: #E57373;
	margin-top: 10px;
	padding: 10px 20px;
}

#ai-message-result.success {
	background-color: #4CAF50;
	margin-top: 10px;
	padding: 10px;
	display:none;
}

.Rtable-cell {
	box-sizing: border-box;
	flex-grow: 1;
	width: 100%;
	padding: 1px 3px;
	overflow: hidden;
	list-style: none;
	border: solid 1px #c1c1c1;
}

.Rtable--2cols>.Rtable-cell {
	width: 50%;
}

.Rtable--3cols>.Rtable-cell {
	width: 33.33%;
}

.Rtable--4cols>.Rtable-cell {
	width: 25%;
}

.Rtable--5cols>.Rtable-cell {
	width: 20%;
}

.Rtable--6cols>.Rtable-cell {
	width: 16.6%;
}

#template-category-dropdown:hover {
	background-color: white;
}
.integration-center-wrap {
    display: flex;
    flex-direction: row;
    width: 100%;
    flex-wrap: wrap;
    justify-content: space-around;
}
.integrationDivs {
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
    flex: 0 0 30%;
	overflow: auto;
	float: left;
	border: solid 2px var(--bg-color);
	min-height: 370px;
	padding: 5px 10px;
	margin-bottom: 10px;
}
	.integration-contents {
		width:100%;
	}
	.integration-logo {
	    display: flex;
    	justify-content: center;
	}
		.integration-logo > img {
			position: center;
			vertical-align: middle;
			max-height: 50px;
			max-width: 280px;
			margin-left: auto;
			margin-right: auto;
			display: block;
			padding-bottom: 10px;
		}
		.integration-logo.large > img {
			 display: block;
		    margin-left: auto;
		    margin-right: auto;
		    max-width: 100px;
		    max-height: 100px;
		    width: 200px;
		    height: 200px;
		    border-radius: 50%;
		    object-fit: cover;
		    padding-bottom: 10px;
		}
	.integration-title {
		font-weight: bold;
    	font-size: 17px;
	    text-align: center;
	    margin-bottom: 10px;
	}
	.integration-description {

	}
	.integration-connect-button {
		position: absolute;
		bottom: 10px;
		width: 95%;
	}
		.integration-connect-button > a {
			width: 100%;
		}

		.integration-connect-button > a > .connect-button {
			border: solid 1px #cecece;
			background-color: var(--bg-color);
			font-size: 16px;
			text-align: center;
			color: var(--font-color);
			cursor: pointer;
			bottom: 0;
			width: 100%;
			height: 39px;
			line-height: 36px;
			font-size: 18px;
		}

		.integration-connect-button > a > .connect-button:hover {
			background-color: #c1bfbf;
		}

		.integration-connect-button > a > .connect-button.done,
		.integration-connect-button > a > .connect-button:active {
			background-color: var(--integration-button-color);
			border: solid 1px var(--integration-button-border);
		}
		.integration-connect-button > a > .connect-button.done-dark {
			background-color: var(--support-tile-bg-hover);
			border: solid 1px var(--support-tile-bg-hover);
			color:#FFF;
		}

	.new-banner > .new {
		position: absolute;
		right: 2px;
		top: 2px;
		z-index: 6;
		border: solid 1px #ce0606;
		background-color: #e40c0c;
		color: #FFF;
		padding: 5px 10px;
		font-size: 18px;
		border-radius: 3px;
	}

.integrationDivs:hover {
	background-color: var(--integration-tile-hover);
}

.integrationDivs > p {
	padding: 0px 4px;
}
#text-option-font-color {
	color: #000;
}/* ============================================================
   V6 HOMEPAGE — scoped under body.page-v6
   ============================================================ */
/* =========================================================
   BASE TOKENS (overridden per mockup via body class)
   Brand colours stay constant; surface colours change.
   NO gradients anywhere — solid fills only.
   ========================================================= */
:root{
  --green:#4e8c0e;
  --green-dark:#3d6e0a;
  --orange:#e67300;
  --orange-dark:#c56100;
  --red:#dc4040;
  --blue:#3399cc;
  --blue-dark:#2582b3;
  --navy:#025077;
  --yellow:#f4c430;

  --r-sm:6px;
  --r-md:10px;
  --r-lg:16px;

  --sans:'Inter',system-ui,-apple-system,Segoe UI,sans-serif;
}

body.page-v6 *{box-sizing:border-box;margin:0;padding:0}
body.page-v6{font-family:var(--sans);-webkit-font-smoothing:antialiased;line-height:1.45}
body.page-v6{background:var(--bg);color:var(--text)}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:0;background:0;color:inherit}
ul{list-style:none}

/* =========================================================
   PER-MOCKUP PALETTES (all use white header)
   ========================================================= */

/* M2 — Cream & Navy */
body.page-v6.palette-m2{
  --bg:#f6efdf;
  --surface:#ffffff;
  --surface-2:#f0e7d2;
  --line:#e6dcc4;
  --text:#1e2b3a;
  --text-mute:#4f5d6c;
  --text-dim:#6b7482;
  --accent-a:#025077;          /* Sell — navy */
  --accent-a-dark:#013e5c;
  --accent-a-soft:#d9e8f0;
  --accent-b:#c06f52;          /* Buy — terracotta */
  --accent-b-dark:#a3573c;
  --accent-b-soft:#f1dacf;
  --brand:#025077;
  --shirt-color:#1e2b3a;
}

/* =========================================================
   WHITE HEADER (shared)
   ========================================================= */
body.page-v6 .tg-context{
}
body.page-v6 .tg-context .wrap{display:flex;justify-content:space-between;gap:20px;padding:0 36px;max-width:1440px;margin:0 auto}
body.page-v6 .tg-context__ship i{color:var(--yellow);margin-right:6px}
body.page-v6 .tg-context a{color:#cbd5e1}
body.page-v6 .tg-context a:hover{color:#fff}

body.page-v6 .tg-header{background:#fff;padding:14px 0;border-bottom:1px solid #e5e7eb;position:sticky;top:44px;z-index:400;box-shadow:0 1px 2px rgba(15,23,42,.04)}
body.page-v6 .tg-header .wrap{max-width:1440px;margin:0 auto;padding:0 36px;display:grid;grid-template-columns:auto 1fr auto auto;gap:28px;align-items:center}
body.page-v6 .tg-logo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:22px;color:#0f172a}
body.page-v6 .tg-logo__mark{width:38px;height:38px;border-radius:8px;background:var(--brand);display:grid;place-items:center;color:#fff}
body.page-v6 .tg-logo__mark i{font-size:18px}
body.page-v6 .tg-logo b{color:var(--brand);font-weight:inherit}
body.page-v6 .tg-logo__tag{display:block;font-size:10px;font-weight:500;color:#64748b;letter-spacing:.04em;margin-top:-2px}

body.page-v6 .tg-nav{display:flex;gap:4px}
body.page-v6 .tg-nav a{padding:10px 14px;border-radius:6px;font-weight:600;font-size:14px;color:#334155}
body.page-v6 .tg-nav a:hover{background:#f1f5f9;color:#0f172a}
body.page-v6 .tg-nav a.is-active{color:var(--brand)}

body.page-v6 .tg-search{display:flex;align-items:center;gap:8px;background:#f1f5f9;border:1px solid #e5e7eb;padding:8px 14px;border-radius:22px;min-width:240px}
body.page-v6 .tg-search input{background:0;border:0;outline:0;font-size:14px;width:100%;color:#0f172a}
body.page-v6 .tg-search input::placeholder{color:#94a3b8}
body.page-v6 .tg-search i{color:#94a3b8}

body.page-v6 .tg-cta{display:flex;gap:10px;align-items:center}
body.page-v6 .btn{padding:10px 18px;border-radius:8px;font-weight:700;font-size:14px;display:inline-flex;align-items:center;gap:8px;transition:background .15s,border-color .15s;border:1px solid transparent}
body.page-v6 .btn-brand{background:var(--brand);color:#fff}
body.page-v6 .btn-brand:hover{background:var(--accent-a-dark)}
body.page-v6 .btn-a{background:var(--accent-a);color:#fff}
body.page-v6 .btn-a:hover{background:var(--accent-a-dark)}
body.page-v6 .btn-b{background:var(--accent-b);color:#fff}
body.page-v6 .btn-b:hover{background:var(--accent-b-dark)}
body.page-v6 .btn-ghost{color:#334155}
body.page-v6 .btn-ghost:hover{background:#f1f5f9}
body.page-v6 .btn-outline{background:#fff;border-color:var(--line);color:var(--text)}
body.page-v6 .btn-outline:hover{border-color:var(--brand);color:var(--brand)}
body.page-v6 .btn-lg{padding:14px 22px;font-size:15px}

/* =========================================================
   HERO — slogan + shirt preview + path toggle at BOTTOM
   ========================================================= */
body.page-v6 .hero{background:var(--hero-bg, var(--bg));padding:30px 0 0;transition:background .35s ease}
/* Mode-specific hero backgrounds — wash the whole top section */
body.page-v6.mode-sell   {--hero-bg:#eaf5dd}
body.page-v6.mode-buy    {--hero-bg:#fdecd9}
body.mode-market {--hero-bg:#efe3f7}
body.mode-brand  {--hero-bg:#dbeafe}
/* Mode accent colours used by the path toggle + preview stubs */
:root{
  --mode-market:#7c3aed; --mode-market-dark:#6d28d9; --mode-market-soft:#efe3f7;
  --mode-brand: #2563eb; --mode-brand-dark: #1d4ed8; --mode-brand-soft: #dbeafe;
}
body.page-v6 .hero__top{max-width:1440px;margin:0 auto;padding:0 36px 40px;display:grid;grid-template-columns:1.05fr 1fr;gap:60px;align-items:center}
body.page-v6 .hero__kicker{
  border-radius:100px;font-size:13px;font-weight:700;margin-bottom:22px;
}
body.page-v6 .hero h1{font-size:64px;line-height:1;font-weight:900;letter-spacing:-.02em;margin-bottom:20px;color:var(--text)}
body.page-v6 .hero h1 em{font-style:normal;color:var(--accent-a)}
body.page-v6 .hero h1 u{text-decoration:none;color:var(--accent-b)}
body.page-v6 .hero__lead{font-size:18px;color:var(--text-mute);margin-bottom:28px;max-width:520px}
body.page-v6 .hero__trust{display:flex;gap:26px;padding-top:22px;border-top:1px solid var(--line)}
body.page-v6 .hero__trust b{font-size:22px;font-weight:900;color:var(--text);line-height:1}
body.page-v6 .hero__trust small{display:block;font-size:12px;color:var(--text-dim);margin-top:3px}

/* Hero preview card — shows a real photo of a model wearing a tee */
body.page-v6 .preview{
  aspect-ratio:3/4;max-width:520px;justify-self:end;width:100%;
  overflow:hidden;
}
body.page-v6 .preview-photo{
  width:100%;height:100%;object-fit:cover;display:block;
}

body.page-v6 .preview-overlay{
  box-shadow:0 6px 16px rgba(0,0,0,.08);
}
body.page-v6 .preview-overlay i{
  width:40px;height:40px;border-radius:10px;background:var(--accent-a-soft);
}
body.page-v6 .preview-overlay b{display:block;font-size:14px;font-weight:800;color:var(--text);line-height:1.2}
body.page-v6 .preview-overlay span{display:block;font-size:12px;color:var(--text-mute);margin-top:3px;line-height:1.3}

body.page-v6 .preview-price{
  border-radius:12px;padding:10px 14px;font-weight:900;font-size:18px;line-height:1;
  box-shadow:0 6px 16px rgba(0,0,0,.15);
}
body.page-v6 .preview-price small{display:block;font-size:10px;font-weight:700;margin-top:2px;text-transform:uppercase;letter-spacing:.06em}

/* Path toggle — positioned at the TOP of the hero so the mode
   choice is the first decision the user makes on the page */
body.page-v6 .hero__toggle-wrap{
  max-width:1440px;margin:0 auto;padding:0 36px 28px;
}
body.page-v6 .hero__toggle-label{
  text-align:center;font-size:13px;font-weight:700;color:var(--text-mute);
  text-transform:uppercase;letter-spacing:.08em;margin-bottom:12px;
}
body.page-v6 .hero__paths{
  backdrop-filter:blur(4px);
}
body.page-v6 .path-btn{
}
body.page-v6 .path-btn i{font-size:20px;flex-shrink:0}
body.page-v6 .path-btn b{display:block;font-size:14px;color:inherit;margin-bottom:2px}
body.page-v6 .path-btn span{display:block;font-size:11px;font-weight:500;color:var(--text-dim);line-height:1.3}
body.page-v6 .path-btn:hover{background:#fff;color:var(--text)}
body.page-v6.mode-sell   .path-btn--sell  {background:var(--accent-a);    color:#fff}
body.page-v6.mode-sell   .path-btn--sell   span{color:rgba(255,255,255,.85)}
body.page-v6.mode-buy    .path-btn--buy   {background:var(--accent-b);    color:#fff}
body.page-v6.mode-buy    .path-btn--buy    span{color:rgba(255,255,255,.85)}
body.mode-market .path-btn--market{background:var(--mode-market); color:#fff}
body.mode-market .path-btn--market span{color:rgba(255,255,255,.85)}
body.mode-brand  .path-btn--brand {background:var(--mode-brand);  color:#fff}
body.mode-brand  .path-btn--brand  span{color:rgba(255,255,255,.85)}

/* Flow bridge — static neutral bg; designer is visually isolated from mode choice */
body.page-v6 .flow-bridge{height:30px;background:#f8fafc}

/* =========================================================
   DESIGNER — taller 11×15 print area, labeled tool buttons
   ========================================================= */
/* Designer section: static neutral bg — decoupled from mode choice */
body.page-v6 .designer-section{padding:10px 0 70px;background:#f8fafc}
body.page-v6 .designer-section__head{
  max-width:1340px;margin:0 auto 20px;padding:10px 36px 0;
}
body.page-v6 .designer-section__title{font-size:28px;font-weight:900;letter-spacing:-.01em;color:var(--text)}
body.page-v6 .designer-section__title em{font-style:normal;color:var(--accent-a)}
body.page-v6.mode-buy .designer-section__title em{color:var(--accent-b)}
body.page-v6 .designer-section__sub{color:var(--text-mute);font-size:14px;margin-top:4px}

body.page-v6 .designer{
  max-width:1340px;margin:0 auto;
  border-radius:var(--r-lg);overflow:hidden;
}
body.page-v6 .designer__topbar{display:flex;align-items:center;gap:14px;padding:12px 18px;border-bottom:1px solid #e5e7eb;background:#fff}
body.page-v6 .designer__title{font-weight:700;font-size:14px;flex:1}
body.page-v6 .designer__chips{display:flex;gap:6px}
body.page-v6 .chip{padding:6px 10px;border-radius:6px;font-size:12px;font-weight:600;background:#f1f5f9;color:#475569}
body.page-v6 .chip i{margin-right:5px}
body.page-v6 .chip--live{background:#dcfce7;color:#166534}

/* Wider tool column with LABELS */
body.page-v6 .designer__body{display:grid;grid-template-columns:150px 1fr 320px;min-height:640px}
body.page-v6 .designer__tools{border-right:1px solid #e5e7eb;background:#f8fafc;padding:14px 10px;display:flex;flex-direction:column;gap:6px}
body.page-v6 .designer__tool{
  width:100%;padding:12px 10px;border-radius:8px;
}
body.page-v6 .designer__tool i{width:18px;text-align:center;font-size:14px}
body.page-v6 .designer__tool:hover{border-color:var(--accent-a);color:var(--accent-a)}
body.page-v6 .designer__tool.is-active{background:var(--accent-a);border-color:var(--accent-a);color:#fff}
body.page-v6.mode-buy .designer__tool:hover{border-color:var(--accent-b);color:var(--accent-b)}
body.page-v6.mode-buy .designer__tool.is-active{background:var(--accent-b);border-color:var(--accent-b);color:#fff}

/* Canvas — taller (11×15 portrait print area) */
body.page-v6 .designer__canvas{
  background-color:#f8fafc;
  background-image:
    linear-gradient(45deg,#edf2f7 25%,transparent 25%,transparent 75%,#edf2f7 75%),
    linear-gradient(45deg,#edf2f7 25%,#f8fafc 25%,#f8fafc 75%,#edf2f7 75%);
  background-size:28px 28px;background-position:0 0,14px 14px;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:28px;
  overflow:hidden;
}
body.page-v6 .canvas-shirt{width:100%;max-width:420px;filter:drop-shadow(0 8px 18px rgba(15,23,42,.08))}
/* 11:15 ratio = 0.733. Portrait print area, chest-centered */
body.page-v6 .canvas-marquee{
  width:165px;height:225px;
  border:2px dashed var(--accent-a);border-radius:4px;pointer-events:none;
}
body.page-v6.mode-buy .canvas-marquee{border-color:var(--accent-b)}
body.page-v6 .canvas-marquee::before{
  content:"";position:absolute;top:-6px;left:-6px;width:10px;height:10px;
}
body.page-v6.mode-buy .canvas-marquee::before{background:var(--accent-b)}
body.page-v6 .canvas-label{
  border:1px solid #e5e7eb;border-radius:4px;padding:2px 6px;
  font-size:9px;font-weight:600;color:#475569;line-height:1.25;
}
body.page-v6 .canvas-label i{color:var(--accent-a);margin-right:4px;font-size:8px}

/* "View All" pill — hidden on desktop (desktop shows every tool). The
   mobile media query re-shows it and collapses .is-secondary tools
   behind it. */
body.page-v6 .designer__tool--more{display:none}
body.page-v6.mode-buy .canvas-label i{color:var(--accent-b)}
body.page-v6 .canvas-ruler{
  border:1px solid #e5e7eb;border-radius:6px;padding:6px 10px;
  font-size:11px;font-weight:700;color:#475569;
}

body.page-v6 .designer__panel{border-left:1px solid #e5e7eb;background:#fff;padding:18px;display:flex;flex-direction:column;gap:18px;overflow:auto}
body.page-v6 .panel-title{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:#64748b;margin-bottom:10px}
body.page-v6 .swatches{display:flex;flex-wrap:wrap;gap:8px}
/* Collapsible swatches — see /css/v6.css for full commentary. */
body.page-v6 .swatches.is-collapsible{
  max-height:126px;overflow:hidden;transition:max-height .2s ease;
}
body.page-v6 .swatches.is-collapsible.is-expanded{max-height:2000px}
body.page-v6 .swatch{width:32px;height:32px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #e5e7eb;cursor:pointer}
body.page-v6 .swatch.is-selected{box-shadow:0 0 0 2px var(--accent-a)}
body.page-v6.mode-buy .swatch.is-selected{box-shadow:0 0 0 2px var(--accent-b)}

body.page-v6 .sizes{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
body.page-v6 .size-btn{padding:10px 0;border:1px solid #e5e7eb;border-radius:6px;font-size:13px;font-weight:700;background:#fff;color:#475569;text-align:center}
body.page-v6 .size-btn.is-selected{background:var(--accent-b);border-color:var(--accent-b);color:#fff}
body.page-v6 .size-btn:hover{border-color:var(--accent-b)}

body.page-v6 .templates{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
body.page-v6 .template{aspect-ratio:1;border:1px solid #e5e7eb;border-radius:8px;background:#f8fafc;display:grid;place-items:center;font-size:20px;color:#94a3b8}
body.page-v6 .template:hover{border-color:var(--accent-a);color:var(--accent-a)}

body.page-v6 .only-sell,.only-buy,.only-market,.only-brand{display:none}
body.page-v6.mode-sell   .only-sell  {display:block}
body.page-v6.mode-buy    .only-buy   {display:block}
body.mode-market .only-market{display:block}
body.mode-brand  .only-brand {display:block}
/* Designer section fallback: market reuses buy-style content,
   brand reuses sell-style content — keeps the tool functional for all modes */
body.mode-market .designer__panel .only-buy,
body.mode-market .designer-section__title .only-buy,
body.mode-market .designer-section__sub .only-buy{display:block}
body.mode-brand  .designer__panel .only-sell,
body.mode-brand  .designer-section__title .only-sell,
body.mode-brand  .designer-section__sub .only-sell{display:block}
/* Designer visuals stay static: no mode-driven bg/color overrides here */

body.page-v6 .publish-list{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
body.page-v6 .publish-chip{padding:5px 9px;border:1px solid #e5e7eb;border-radius:20px;font-size:11px;font-weight:600;color:#475569;background:#fff}
body.page-v6 .publish-chip i{margin-right:4px}

body.page-v6 .price-card{background:#f8fafc;border:1px solid #e5e7eb;border-radius:10px;padding:14px;display:flex;justify-content:space-between;align-items:center}
body.page-v6 .price-card__main{font-size:22px;font-weight:800;color:#0f172a}
body.page-v6 .price-card__sub{font-size:12px;color:#64748b}

/* =========================================================
   SUPPORT SECTIONS
   ========================================================= */
body.page-v6 .section{max-width:1340px;margin:0 auto;padding:50px 36px}
body.page-v6 .stats{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;background:var(--line);border:1px solid var(--line);border-radius:14px;overflow:hidden}
body.page-v6 .stats__cell{background:var(--surface);padding:24px;text-align:center}
body.page-v6 .stats__cell i{font-size:22px;color:var(--brand);margin-bottom:8px;display:block}
body.page-v6 .stats__cell b{font-size:28px;font-weight:900;color:var(--text);display:block;line-height:1}
body.page-v6 .stats__cell span{font-size:13px;color:var(--text-mute)}

body.page-v6 .markets{margin-top:50px}
body.page-v6 .markets h2{font-size:28px;font-weight:900;margin-bottom:8px;text-align:center;color:var(--text)}
body.page-v6 .markets p{text-align:center;color:var(--text-mute);margin-bottom:28px}
body.page-v6 .markets__grid{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
body.page-v6 .market-card{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:18px;text-align:center;transition:border-color .2s,transform .2s}
body.page-v6 .market-card:hover{border-color:var(--brand);transform:translateY(-2px)}
body.page-v6 .market-card i{font-size:28px;margin-bottom:8px;display:block;color:var(--brand)}
body.page-v6 .market-card b{font-size:13px;color:var(--text);display:block}
body.page-v6 .market-card span{font-size:11px;color:var(--text-dim)}

/* =========================================================
   FOOTER (same look user approved)
   ========================================================= */
body.page-v6 .tg-footer{background:#0f172a;color:#94a3b8;padding:50px 0 24px}
body.page-v6 .tg-footer .wrap{max-width:1440px;margin:0 auto;padding:0 36px}
body.page-v6 .tg-footer__grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr 1fr;gap:40px;margin-bottom:36px}
body.page-v6 .tg-footer h4{color:#fff;font-size:14px;margin-bottom:14px;font-weight:700}
body.page-v6 .tg-footer ul li{margin-bottom:8px}
body.page-v6 .tg-footer a{color:#94a3b8}
body.page-v6 .tg-footer a:hover{color:#fff}
body.page-v6 .tg-footer__bottom{border-top:1px solid #1f2937;padding-top:20px;display:flex;justify-content:space-between;font-size:13px}
body.page-v6 .tg-footer .tg-logo{color:#fff}

/* =========================================================
   RESPONSIVE — tablet, small tablet, mobile
   ========================================================= */

/* Tablet landscape (≤ 1200px) */
@media (max-width:1200px){

  body.page-v6 .tg-header .wrap{grid-template-columns:auto 1fr auto;gap:20px}
  body.page-v6 .tg-nav{display:none}
  body.page-v6 .markets__grid{grid-template-columns:repeat(4,1fr)}
}

/* Tablet (≤ 1024px) */
@media (max-width:1024px){

  body.page-v6 .hero__top{grid-template-columns:1fr;gap:36px;padding:0 24px 30px}
  body.page-v6 .hero h1{font-size:48px}
  body.page-v6 .hero__lead{font-size:16px}
  body.page-v6 .preview{justify-self:center;max-width:480px}
  body.page-v6 .designer__body{grid-template-columns:140px 1fr}
  body.page-v6 .designer__panel{grid-column:1 / -1;border-left:0;border-top:1px solid #e5e7eb}
  body.page-v6 .markets__grid{grid-template-columns:repeat(3,1fr)}
  body.page-v6 .stats{grid-template-columns:repeat(2,1fr)}
  body.page-v6 .tg-search{min-width:180px}
  body.page-v6 .section{padding:40px 24px}
  body.page-v6 .designer-section__head{padding:10px 24px 0}
  body.page-v6 .hero__paths{max-width:560px}
}

/* Small tablet / large phone (≤ 768px) */
@media (max-width:768px){

  
  
  
  
  

  body.page-v6 .tg-header{padding:12px 0}
  body.page-v6 .tg-header .wrap{padding:0 16px;grid-template-columns:auto 1fr auto;gap:12px}
  body.page-v6 .tg-search{display:none}
  body.page-v6 .tg-logo{font-size:18px}
  body.page-v6 .tg-logo__mark{width:32px;height:32px}
  body.page-v6 .tg-logo__mark i{font-size:14px}
  body.page-v6 .tg-logo__tag{display:none}
  body.page-v6 .tg-cta .btn-ghost{display:none}
  body.page-v6 .tg-cta .btn{padding:8px 14px;font-size:13px}

  body.page-v6 .hero{padding-top:40px}
  body.page-v6 .hero__top{padding:0 16px 20px;gap:28px}
  body.page-v6 .hero h1{font-size:38px}
  body.page-v6 .hero__kicker{font-size:12px;padding:5px 12px;margin-bottom:16px}
  body.page-v6 .hero__lead{font-size:15px;margin-bottom:22px}
  body.page-v6 .hero__trust{gap:18px;flex-wrap:wrap}
  body.page-v6 .hero__trust b{font-size:18px}
  body.page-v6 .hero__trust small{font-size:11px}

  body.page-v6 .preview{border-radius:16px;aspect-ratio:4/5}
  body.page-v6 .preview-overlay{left:12px;right:12px;top:12px;padding:10px 12px;gap:10px}
  body.page-v6 .preview-overlay i{width:34px;height:34px;font-size:15px}
  body.page-v6 .preview-overlay b{font-size:13px}
  body.page-v6 .preview-overlay span{font-size:11px}
  body.page-v6 .preview-price{bottom:14px;right:14px;padding:8px 11px;font-size:15px}

  body.page-v6 .hero__toggle-wrap{padding:0 16px 30px}
  body.page-v6 .hero__toggle-label{font-size:12px;margin-bottom:10px}
  body.page-v6 .hero__paths{grid-template-columns:1fr;gap:6px;padding:6px;border-radius:12px}
  body.page-v6 .path-btn{padding:14px 16px;gap:12px}
  body.page-v6 .path-btn i{font-size:18px}
  body.page-v6 .path-btn b{font-size:14px}
  body.page-v6 .path-btn span{font-size:11px}

  body.page-v6 .designer-section__head{
    flex-direction:column;align-items:flex-start;gap:8px;padding:10px 16px 0;margin-bottom:14px;
  }
  body.page-v6 .designer-section__head > div:last-child{font-size:11px}
  body.page-v6 .designer-section__title{font-size:22px}
  body.page-v6 .designer-section__sub{font-size:13px}
  body.page-v6 .designer-section{padding:10px 0 40px}

  /* Designer stacks: tools become a scrollable horizontal row */
  body.page-v6 .designer{margin:0 16px;max-width:none;border-radius:12px}
  body.page-v6 .designer-section > div[style*="max-width:1340px"]{padding:0 !important}
  body.page-v6 .designer__topbar{padding:10px 12px;flex-wrap:wrap;gap:8px}
  body.page-v6 .designer__title{font-size:13px;flex:1 0 100%}
  body.page-v6 .designer__chips{gap:4px}
  body.page-v6 .chip{padding:5px 8px;font-size:11px}

  body.page-v6 .designer__body{grid-template-columns:1fr;min-height:0}
  body.page-v6 .designer__tools{
    order:2;border-right:0;border-top:1px solid #e5e7eb;
    /* Swapped horizontal scroll for wrap: only the 4 primary tools plus
       the "View All" pill are visible by default; secondary tools wrap
       below when the pill is toggled on. */
    flex-direction:row;flex-wrap:wrap;padding:10px;gap:6px;
    overflow-x:visible;scrollbar-width:none;
  }
  body.page-v6 .designer__tools::-webkit-scrollbar{display:none}
  body.page-v6 .designer__tool{
    width:auto;flex:0 0 auto;padding:10px 12px;font-size:12px;white-space:nowrap;
  }
  /* Collapse secondary tools on mobile until "View All" is pressed. */
  body.page-v6 .designer__tools .designer__tool.is-secondary{display:none}
  body.page-v6 .designer__tools.is-expanded .designer__tool.is-secondary:not([hidden]){display:inline-flex}
  /* Show the "View All" pill on mobile — always last in the row. */
  body.page-v6 .designer__tool--more{
    order:999;display:inline-flex !important;
    background:#eef2ff;border-color:#c7d2fe;color:#4338ca;
  }
  body.page-v6 .designer__tool--more:hover{
    border-color:#6366f1;color:#3730a3;background:#e0e7ff;
  }
  body.page-v6 .designer__tool--more i{color:inherit}
  body.page-v6 .designer__canvas{order:1;padding:24px 16px;min-height:380px}
  body.page-v6 .canvas-shirt{max-width:300px}
  body.page-v6 .canvas-marquee{width:120px;height:164px;transform:translate(-50%,-38%)}
  body.page-v6 .canvas-ruler{font-size:10px;padding:3px 7px;line-height:1.2;font-weight:700;top:10px;right:10px}
  body.page-v6 .canvas-label{font-size:9px !important;padding:2px 6px !important;line-height:1.2 !important;font-weight:600;color:#475569;top:10px !important;left:10px !important;bottom:auto !important;right:auto !important;max-width:60%;border-radius:4px}
  body.page-v6 .canvas-label i{font-size:8px !important;margin-right:3px !important}
  body.page-v6 .designer__panel{order:3;border-left:0;border-top:1px solid #e5e7eb;padding:16px;gap:16px}
  body.page-v6 .sizes{grid-template-columns:repeat(5,1fr)}

  body.page-v6 .section{padding:32px 16px}
  body.page-v6 .stats{grid-template-columns:repeat(2,1fr);border-radius:12px}
  body.page-v6 .stats__cell{padding:18px 12px}
  body.page-v6 .stats__cell b{font-size:22px}
  body.page-v6 .stats__cell span{font-size:12px}
  body.page-v6 .markets{margin-top:32px}
  body.page-v6 .markets h2{font-size:22px}
  body.page-v6 .markets__grid{grid-template-columns:repeat(2,1fr);gap:10px}
  body.page-v6 .market-card{padding:14px 10px}
  body.page-v6 .market-card i{font-size:22px}
  body.page-v6 .market-card b{font-size:12px}
  body.page-v6 .market-card span{font-size:10px}

  body.page-v6 .tg-footer{padding:36px 0 20px}
  body.page-v6 .tg-footer .wrap{padding:0 16px}
  body.page-v6 .tg-footer__grid{grid-template-columns:1fr 1fr;gap:28px;margin-bottom:28px}
  body.page-v6 .tg-footer__grid > div:first-child{grid-column:1 / -1}
  body.page-v6 .tg-footer__bottom{flex-direction:column;gap:8px;text-align:center;font-size:12px}
}

/* Phone (≤ 480px) */
@media (max-width:480px){

  body.page-v6 .hero h1{font-size:32px}
  body.page-v6 .hero__kicker{font-size:11px}
  body.page-v6 .hero__lead{font-size:14px}
  body.page-v6 .hero__trust{gap:14px}
  body.page-v6 .hero__trust > div{flex:1 0 40%}

  body.page-v6 .preview{padding:16px}
  body.page-v6 .preview-overlay{padding:8px 10px;gap:8px}
  body.page-v6 .preview-overlay i{width:30px;height:30px;font-size:13px}
  body.page-v6 .preview-overlay b{font-size:12px}
  body.page-v6 .preview-overlay span{font-size:10px;line-height:1.25}

  body.page-v6 .designer-section__head > div:last-child{display:none}

  body.page-v6 .canvas-shirt{max-width:240px}
  body.page-v6 .canvas-marquee{width:100px;height:136px}

  body.page-v6 .sizes{grid-template-columns:repeat(5,1fr);gap:4px}
  body.page-v6 .size-btn{font-size:12px;padding:8px 0}

  body.page-v6 .stats{grid-template-columns:1fr}
  /* Homepage marketplace grid — compact 3-up row on phones. The previous
     1fr (full-width stack) made the 12 cards dominate the page. Mirrors
     the rule in /css/v6.css which is the stylesheet actually loaded on
     the homepage (main_v6.php); kept here so style.css stays consistent. */
  body.page-v6 .markets__grid{grid-template-columns:repeat(3,1fr);gap:6px}
  body.page-v6 .market-card{padding:10px 6px;border-radius:10px}
  body.page-v6 .market-card i{font-size:18px;margin-bottom:5px}
  body.page-v6 .market-card b{font-size:10px;line-height:1.15}
  body.page-v6 .market-card span{font-size:9px;line-height:1.2}

  body.page-v6 .tg-footer__grid{grid-template-columns:1fr}
  body.page-v6 .tg-footer__grid > div:first-child{grid-column:auto}
}

/* =========================================================
   PREVIEW STUBS — one per mode (image placeholder)
   User will swap in real imagery later
   ========================================================= */
body.page-v6 .preview__stub{
  place-items:center;padding:26px;
}
body.page-v6.mode-sell   .preview__stub--sell  ,
body.page-v6.mode-buy    .preview__stub--buy   ,
body.mode-market .preview__stub--market,
body.mode-brand  .preview__stub--brand {display:grid}

/* Sell: keep the existing hero-model.png photo */
body.page-v6 .preview__stub--sell{padding:0}
body.page-v6 .preview__stub--sell .preview-photo{width:100%;height:100%;object-fit:cover;display:block}

/* Buy: single shirt in a gift box */
body.page-v6 .preview__stub--buy{background:linear-gradient(160deg,#fef3e6 0%,#fdd9aa 100%)}
body.page-v6 .preview__stub--buy .stub__shirt{
  width:58%;max-width:260px;color:#0f172a;
  filter:drop-shadow(0 10px 24px rgba(15,23,42,.18));
}
body.page-v6 .preview__stub--buy .stub__tag{
  box-shadow:0 6px 16px rgba(0,0,0,.1);
}

/* Market: grid of 4 shirt thumbs */
body.page-v6 .preview__stub--market{background:linear-gradient(160deg,#f5ecfa 0%,#d8c6e8 100%)}
body.page-v6 .preview__stub--market .stub__grid{
}
body.page-v6 .preview__stub--market .stub__tile{
  aspect-ratio:1;background:#fff;border-radius:12px;display:grid;place-items:center;
  box-shadow:0 4px 10px rgba(0,0,0,.06);
}
body.page-v6 .preview__stub--market .stub__tile svg{width:68%;height:68%}
body.page-v6 .preview__stub--market .stub__tile:nth-child(1) svg{color:#0f172a}
body.page-v6 .preview__stub--market .stub__tile:nth-child(2) svg{color:#dc4040}
body.page-v6 .preview__stub--market .stub__tile:nth-child(3) svg{color:#025077}
body.page-v6 .preview__stub--market .stub__tile:nth-child(4) svg{color:#4e8c0e}

/* Brand: team of 3 shirts with a flag/logo */
body.page-v6 .preview__stub--brand{background:linear-gradient(160deg,#eaf1fb 0%,#c7d8ef 100%)}
body.page-v6 .preview__stub--brand .stub__team{
}
body.page-v6 .preview__stub--brand .stub__team svg{
  width:140px;height:150px;
  filter:drop-shadow(0 10px 18px rgba(15,23,42,.15));
}
body.page-v6 .preview__stub--brand .stub__team svg:nth-child(1){color:#2563eb;transform:translateX(18px) translateY(6px) scale(.9)}
body.page-v6 .preview__stub--brand .stub__team svg:nth-child(2){color:#1d4ed8;z-index:2}
body.page-v6 .preview__stub--brand .stub__team svg:nth-child(3){color:#2563eb;transform:translateX(-18px) translateY(6px) scale(.9)}
/* stub__crest removed — brand mode no longer shows "Your logo here" */

/* Mode-specific overlay + price card tints */
body.mode-market .preview-overlay i{background:var(--mode-market-soft);color:var(--mode-market)}
body.mode-brand  .preview-overlay i{background:var(--mode-brand-soft); color:var(--mode-brand)}
body.mode-market .preview-price{background:var(--mode-market);color:#fff}
body.mode-brand  .preview-price{background:var(--mode-brand);color:#fff}

/* Extra accent: hero kicker tints per mode */
body.mode-market .hero__kicker{background:var(--mode-market-soft);color:var(--mode-market-dark)}
body.mode-brand  .hero__kicker{background:var(--mode-brand-soft); color:var(--mode-brand-dark)}
body.mode-market .hero h1 em{color:var(--mode-market)}
body.mode-brand  .hero h1 em{color:var(--mode-brand)}

/* 4-up path toggle responsive breakpoints */
@media (max-width:900px){

  body.page-v6 .hero__paths{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:520px){

  body.page-v6 .hero__paths{grid-template-columns:1fr}
}

/* =========================================================
   SHIRT STYLE PICKER (added v4) — trigger block + modal
   ========================================================= */
body.page-v6 .style-picker{
  border:1px solid var(--line);border-radius:10px;background:#fff;
  transition:border-color .15s;
}
body.page-v6 .style-picker:hover{border-color:var(--accent-a)}
body.page-v6.mode-buy .style-picker:hover{border-color:var(--accent-b)}
body.page-v6 .style-picker__thumb{
  width:46px;height:46px;border-radius:8px;background:var(--surface-2);
}
body.page-v6 .style-picker__thumb svg{width:78%;height:78%}
body.page-v6 .style-picker__body{flex:1;min-width:0}
body.page-v6 .style-picker__name{font-size:13px;font-weight:800;color:var(--text);line-height:1.2}
body.page-v6 .style-picker__meta{font-size:11px;color:var(--text-mute);margin-top:3px}
body.page-v6 .style-picker__chev{color:var(--text-mute);font-size:12px}

body.page-v6 .shirt-modal{
  position:fixed;inset:0;z-index:9000;
  background:rgba(15,23,42,.55);
  display:none;align-items:center;justify-content:center;
  padding:30px;
}
body.page-v6 .shirt-modal.is-open{display:flex}
body.page-v6 .shirt-modal__card{
  border-radius:14px;display:flex;flex-direction:column;overflow:hidden;
  box-shadow:0 24px 60px rgba(0,0,0,.25);
  background:#fff;width:100%;max-width:960px;max-height:86vh;
}
body.page-v6 .shirt-modal__head{
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 22px;border-bottom:1px solid var(--line);gap:12px;
}
body.page-v6 .shirt-modal__title{font-size:18px;font-weight:800;color:var(--text)}
body.page-v6 .shirt-modal__count{font-size:12px;color:var(--text-mute);font-weight:600;margin-left:10px}
body.page-v6 .shirt-modal__count b{color:var(--text);font-weight:700}
body.page-v6 .shirt-modal__close{
  width:36px;height:36px;border-radius:8px;border:1px solid var(--line);
  background:#fff;color:#64748b;cursor:pointer;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
}
body.page-v6 .shirt-modal__close:hover{background:var(--surface-2);color:var(--text)}
body.page-v6 .shirt-modal__search{
  grid-column:1 / -1;display:flex;align-items:center;gap:8px;
  padding:10px 14px;border:1px solid var(--line);border-radius:8px;
  background:#fff;margin:14px 22px 0;
}
body.page-v6 .shirt-modal__search input{background:0;border:0;outline:0;width:100%;font-size:14px;color:var(--text)}
body.page-v6 .shirt-modal__search i{color:#94a3b8}
body.page-v6 .shirt-modal__filters{
  display:flex;flex-wrap:wrap;gap:6px;
  padding:12px 22px;align-items:center;
  border-bottom:1px solid var(--line);
}
body.page-v6 .shirt-modal__filters--scroll{
  flex-wrap:nowrap;overflow-x:auto;padding:8px 22px;scrollbar-width:thin;
}
body.page-v6 .shirt-modal__filters--scroll::-webkit-scrollbar{height:6px}
body.page-v6 .shirt-modal__filters--scroll::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:3px}
body.page-v6 .shirt-modal__filter-label{
  font-size:11px;font-weight:700;color:var(--text-mute);
  text-transform:uppercase;letter-spacing:.05em;align-self:center;
  margin-right:4px;flex-shrink:0;
}
body.page-v6 .shirt-modal__filter{
  white-space:nowrap;flex-shrink:0;
  padding:6px 12px;border:1px solid var(--line);border-radius:999px;
  background:#fff;color:var(--text-mute);font-size:12px;font-weight:600;
  cursor:pointer;transition:all .15s;
}
body.page-v6 .shirt-modal__filter:hover{border-color:var(--accent-a);color:var(--accent-a)}
body.page-v6 .shirt-modal__filter.is-active{background:var(--accent-a);border-color:var(--accent-a);color:#fff}
body.page-v6.mode-buy .shirt-modal__filter.is-active{background:var(--accent-b);border-color:var(--accent-b)}
body.page-v6 .shirt-modal__body{overflow:auto;padding:18px 22px;flex:1;position:relative}
body.page-v6 .shirt-modal__grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:14px;
}
body.page-v6 .shirt-card{
  border:1px solid var(--line);border-radius:12px;padding:14px;
  transition:border-color .15s,transform .15s;
  background:#fff;cursor:pointer;
  display:flex;flex-direction:column;gap:8px;
}
body.page-v6 .shirt-card:hover{border-color:var(--accent-a);transform:translateY(-2px)}
body.page-v6.mode-buy .shirt-card:hover{border-color:var(--accent-b)}
body.page-v6 .shirt-card.is-selected{border-color:var(--accent-a);background:var(--accent-a-soft)}
body.page-v6.mode-buy .shirt-card.is-selected{border-color:var(--accent-b);background:var(--accent-b-soft)}
body.page-v6 .shirt-card__thumb{
  aspect-ratio:1;background:var(--surface-2);border-radius:8px;
  display:flex;align-items:center;justify-content:center;
}
body.page-v6 .shirt-card__thumb svg{width:70%;height:70%}
body.page-v6 .shirt-card__name{font-size:13px;font-weight:700;color:var(--text);line-height:1.3}
body.page-v6 .shirt-card__meta{font-size:11px;color:var(--text-mute);display:flex;justify-content:space-between}
body.page-v6 .shirt-card__badges{display:flex;gap:6px;flex-wrap:wrap}
body.page-v6 .shirt-card__badge{
  font-size:10px;font-weight:700;padding:2px 6px;border-radius:4px;
  text-transform:uppercase;letter-spacing:.04em;
}
body.page-v6 .shirt-card__badge--popular{background:#fdecd9;color:#a3573c}
body.page-v6 .shirt-card__badge--colors{background:var(--accent-a-soft);color:var(--accent-a-dark)}
body.page-v6.mode-buy .shirt-card__badge--colors{background:var(--accent-b-soft);color:var(--accent-b-dark)}
body.page-v6 .shirt-modal__empty{padding:40px;text-align:center;color:var(--text-mute);font-size:14px}
body.page-v6 .shirt-modal__loader{text-align:center;padding:14px;color:var(--text-mute);font-size:12px;display:none}
body.page-v6 .shirt-modal__loader.is-visible{display:block}
body.page-v6 .shirt-modal__sentinel{height:1px;margin-top:6px}
body.page-v6 .shirt-modal__foot{
  display:flex;align-items:center;justify-content:space-between;
  gap:12px;padding:16px 22px;
  border-top:1px solid var(--line);background:#fff;
}
body.page-v6 .shirt-modal__foot-info{font-size:13px;color:var(--text-mute)}
body.page-v6 .shirt-modal__foot-info b{color:var(--text)}
body.page-v6 .btn[disabled]{opacity:.5;cursor:not-allowed}
@media(max-width:640px){

  body.page-v6 .shirt-modal{padding:0}
  body.page-v6 .shirt-modal__card{max-height:100vh;border-radius:0}
  body.page-v6 .shirt-modal__head{flex-wrap:wrap;gap:10px}
  body.page-v6 .shirt-modal__grid{grid-template-columns:repeat(2,1fr);gap:10px}
}

/* ============================================================
   V6 LOGIN / REGISTER PAGES — scoped under body.page-v6.page-login / body.page-v6.page-register
   ============================================================ */
body.page-v6.page-login .auth, body.page-v6.page-register .auth{display:grid;place-items:center;padding:50px 20px;min-height:calc(100vh - 260px);background:var(--surface)}
body.page-v6.page-register .auth--split{display:grid;grid-template-columns:1.1fr 1fr;max-width:980px;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh);width:100%}
body.page-v6.page-register .auth__pitch{background:#0f172a;color:#fff;padding:44px}
body.page-v6.page-register .auth__pitch h2{font-size:26px;margin:0 0 16px;color:#fff;letter-spacing:-.01em;font-weight:900}
body.page-v6.page-register .auth__pitch h2 em{font-style:italic;color:var(--yellow)}
body.page-v6.page-register .auth__pitch ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:14px}
body.page-v6.page-register .auth__pitch li{display:flex;gap:12px;font-size:14px;color:#cbd5e1}
body.page-v6.page-register .auth__pitch li i{color:var(--green);flex-shrink:0;margin-top:3px}
body.page-v6.page-register .auth__form{padding:44px}
body.page-v6.page-register .auth__form h1{font-size:28px;color:var(--text);margin:0 0 8px;font-weight:900;letter-spacing:-.01em}
body.page-v6.page-register .auth__form p.lead{color:var(--text-mute);font-size:14px;margin:0 0 24px}
body.page-v6.page-login .auth__card, body.page-v6.page-register .auth__card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:44px;max-width:440px;width:100%;box-shadow:var(--sh)}
body.page-v6.page-login .auth__card h1, body.page-v6.page-register .auth__card h1{font-size:30px;color:var(--text);margin:0 0 8px;font-weight:900;letter-spacing:-.01em}
body.page-v6.page-login .auth__card p.lead, body.page-v6.page-register .auth__card p.lead{color:var(--text-mute);font-size:14px;margin:0 0 28px}
body.page-v6.page-login .sso, body.page-v6.page-register .sso{display:flex;flex-direction:column;gap:10px;margin-bottom:22px}
body.page-v6.page-login .sso-btn, body.page-v6.page-register .sso-btn{display:flex;align-items:center;gap:12px;padding:12px 18px;border-radius:var(--r-sm);border:1px solid var(--line);background:#fff;color:var(--text);font-size:14px;font-weight:600;transition:all .15s}
body.page-v6.page-login .sso-btn:hover, body.page-v6.page-register .sso-btn:hover{border-color:var(--line-2);background:#f8fafc}
body.page-v6.page-login .sso-btn i, body.page-v6.page-register .sso-btn i{font-size:18px;width:20px;text-align:center}
body.page-v6.page-login .sso-btn--facebook i, body.page-v6.page-register .sso-btn--facebook i{color:#1877f2}
body.page-v6.page-login .sso-btn--x i, body.page-v6.page-register .sso-btn--x i{color:#000}
body.page-v6.page-login .sso-btn--google i, body.page-v6.page-register .sso-btn--google i{color:#ea4335}
body.page-v6.page-login .sso-btn--apple i, body.page-v6.page-register .sso-btn--apple i{color:#000}
body.page-v6.page-login .divider, body.page-v6.page-register .divider{display:flex;align-items:center;gap:12px;color:var(--text-dim);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin:20px 0}
body.page-v6.page-login .divider::before, body.page-v6.page-login .divider::after, body.page-v6.page-register .divider::before, body.page-v6.page-register .divider::after{content:"";flex:1;height:1px;background:var(--line)}
body.page-v6.page-login .field, body.page-v6.page-register .field{margin-bottom:16px}
body.page-v6.page-login .field label, body.page-v6.page-register .field label{display:block;font-size:13px;font-weight:600;color:var(--text);margin-bottom:6px}
body.page-v6.page-login .field input[type=email], body.page-v6.page-login .field input[type=password], body.page-v6.page-login .field input[type=text], body.page-v6.page-register .field input[type=email], body.page-v6.page-register .field input[type=password], body.page-v6.page-register .field input[type=text]{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-sm);background:#fff;font-size:14px;color:var(--text);font-family:inherit}
body.page-v6.page-login .field input:focus, body.page-v6.page-register .field input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
body.page-v6.page-register .field .help{font-size:12px;color:var(--text-dim);margin-top:4px}
body.page-v6.page-login .field--row, body.page-v6.page-register .field--row{display:flex;justify-content:space-between;align-items:center;font-size:13px}
body.page-v6.page-login .field--row label, body.page-v6.page-register .field--row label{display:flex;align-items:flex-start;gap:8px;color:var(--text-mute);margin:0;font-weight:500;line-height:1.4}
body.page-v6.page-login .field--row a, body.page-v6.page-register .field--row a{color:var(--brand);font-weight:600}
body.page-v6.page-login .auth__foot, body.page-v6.page-register .auth__foot{margin-top:22px;text-align:center;font-size:14px;color:var(--text-mute)}
body.page-v6.page-login .auth__foot a, body.page-v6.page-register .auth__foot a{font-weight:700;color:var(--brand)}

@media(max-width:820px){ body.page-v6.page-register .auth--split{grid-template-columns:1fr;max-width:440px} body.page-v6.page-register .auth__pitch{display:none} }
@media(max-width:560px){ body.page-v6.page-login .auth__card, body.page-v6.page-register .auth__card{padding:30px 24px} body.page-v6.page-register .auth__form{padding:30px 24px} }

/* V6 pricing + marketplace styles moved to /css/v6.css (2026-04) */

/* ============================================================
   V6 ORDER YOURSELF PAGE — scoped under body.page-v6.page-orderyourself
   ============================================================ */
body.page-v6.page-orderyourself .oy-hero{background:var(--surface);padding:40px 0 30px;border-bottom:1px solid var(--line)}
body.page-v6.page-orderyourself .oy-hero h1{font-size:36px;color:var(--text);margin:0 0 6px;letter-spacing:-.01em;font-weight:900}
body.page-v6.page-orderyourself .oy-hero p{color:var(--text-mute);margin:0;font-size:15px}
body.page-v6.page-orderyourself .oy-hero strong{color:var(--brand)}
body.page-v6.page-orderyourself .oy-toolbar{background:#fff;border-bottom:1px solid var(--line);padding:16px 0;position:sticky;top:66px;z-index:300}
body.page-v6.page-orderyourself .oy-toolbar__row{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
body.page-v6.page-orderyourself .oy-cats{display:flex;gap:6px;overflow-x:auto;flex:1;padding-bottom:2px}
body.page-v6.page-orderyourself .oy-cats::-webkit-scrollbar{height:0}
body.page-v6.page-orderyourself .oy-cat{padding:8px 14px;background:#fff;border:1px solid var(--line);border-radius:999px;font-size:13px;font-weight:600;color:var(--text-mute);white-space:nowrap;cursor:pointer;transition:all .15s ease}
body.page-v6.page-orderyourself .oy-cat:hover{border-color:var(--brand);color:var(--brand)}
body.page-v6.page-orderyourself .oy-cat.is-active{background:var(--brand);border-color:var(--brand);color:#fff}
body.page-v6.page-orderyourself .oy-sort select{padding:8px 30px 8px 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M6 8L0 0h12z' fill='%23475569'/%3E%3C/svg%3E") no-repeat right 10px center;font-size:13px;font-weight:600;color:var(--text);appearance:none}
body.page-v6.page-orderyourself .blank-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;padding:40px 0}
body.page-v6.page-orderyourself .blank-card{background:#fff;border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;transition:all .2s ease;display:block;color:inherit;text-decoration:none;cursor:pointer}
body.page-v6.page-orderyourself .blank-card:hover{transform:translateY(-3px);box-shadow:var(--sh);border-color:var(--line-2)}
body.page-v6.page-orderyourself .blank-card__image{aspect-ratio:1;background:var(--surface);display:grid;place-items:center;position:relative}
body.page-v6.page-orderyourself .blank-card__image svg{width:78%;height:78%}
body.page-v6.page-orderyourself .blank-card__info{padding:14px}
body.page-v6.page-orderyourself .blank-card__brand{font-size:11px;font-weight:800;color:var(--orange);letter-spacing:.06em;text-transform:uppercase}
body.page-v6.page-orderyourself .blank-card__info h3{margin:3px 0 4px;font-size:14px;font-weight:800;color:var(--text);line-height:1.3}
body.page-v6.page-orderyourself .blank-card__sku{font-size:11px;color:var(--text-dim);font-family:monospace}
body.page-v6.page-orderyourself .blank-card__swatch-row{display:flex;gap:4px;margin-top:10px}
body.page-v6.page-orderyourself .blank-card__swatch{width:16px;height:16px;border-radius:50%;border:1px solid rgba(15,23,42,.15)}
body.page-v6.page-orderyourself .blank-card__swatch--more{background:var(--surface);color:var(--text-dim);font-size:9px;font-weight:700;display:grid;place-items:center;border-color:var(--line)}
body.page-v6.page-orderyourself .blank-card__foot{display:flex;justify-content:space-between;align-items:center;margin-top:12px;padding-top:10px;border-top:1px dashed var(--line)}
body.page-v6.page-orderyourself .blank-card__price{font-size:15px;font-weight:900;color:var(--text)}
body.page-v6.page-orderyourself .blank-card__price em{font-style:normal;font-size:11px;font-weight:600;color:var(--text-dim)}
body.page-v6.page-orderyourself .blank-card__cta{font-size:11px;font-weight:800;color:var(--brand)}
body.page-v6.page-orderyourself .oy-buy{position:fixed;top:0;right:0;bottom:0;width:min(520px,100%);background:#fff;border-left:1px solid var(--line);box-shadow:-10px 0 30px rgba(15,23,42,.12);z-index:500;transform:translateX(100%);transition:transform .25s ease;display:flex;flex-direction:column;overflow:hidden}
body.page-v6.page-orderyourself .oy-buy.is-open{transform:translateX(0)}
body.page-v6.page-orderyourself .oy-buy__head{padding:18px 22px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:14px}
body.page-v6.page-orderyourself .oy-buy__head h2{font-size:20px;color:var(--text);margin:0;flex:1;letter-spacing:-.01em;font-weight:900}
body.page-v6.page-orderyourself .oy-buy__close{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:#fff;color:var(--text);font-size:14px;display:grid;place-items:center;cursor:pointer}
body.page-v6.page-orderyourself .oy-buy__close:hover{background:var(--surface)}
body.page-v6.page-orderyourself .oy-buy__body{flex:1;overflow-y:auto;padding:22px}
body.page-v6.page-orderyourself .oy-preview{background:var(--surface);border-radius:var(--r-md);aspect-ratio:1;display:grid;place-items:center;margin-bottom:18px;position:relative;overflow:hidden}
body.page-v6.page-orderyourself .oy-preview svg{width:85%;height:85%}
body.page-v6.page-orderyourself .oy-preview__tag{position:absolute;top:12px;left:12px;background:rgba(15,23,42,.78);color:#fff;font-size:11px;font-weight:700;padding:4px 10px;border-radius:999px}
body.page-v6.page-orderyourself .oy-options{display:flex;flex-direction:column;gap:18px}
body.page-v6.page-orderyourself .oy-opt label{display:block;font-size:12px;font-weight:800;color:var(--text-dim);letter-spacing:.06em;text-transform:uppercase;margin-bottom:8px}
body.page-v6.page-orderyourself .oy-colors{display:flex;gap:8px;flex-wrap:wrap}
body.page-v6.page-orderyourself .oy-color{width:32px;height:32px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px var(--line);cursor:pointer;transition:transform .1s ease}
body.page-v6.page-orderyourself .oy-color.is-selected{box-shadow:0 0 0 2px var(--brand)}
body.page-v6.page-orderyourself .oy-color:hover{transform:scale(1.08)}
body.page-v6.page-orderyourself .oy-sizes{display:flex;gap:6px;flex-wrap:wrap}
body.page-v6.page-orderyourself .oy-size{padding:8px 14px;background:#fff;border:1px solid var(--line);border-radius:var(--r-sm);font-size:13px;font-weight:700;color:var(--text-mute);cursor:pointer;min-width:42px;text-align:center}
body.page-v6.page-orderyourself .oy-size:hover{border-color:var(--brand);color:var(--brand)}
body.page-v6.page-orderyourself .oy-size.is-selected{background:var(--brand);border-color:var(--brand);color:#fff}
body.page-v6.page-orderyourself .oy-qty{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:var(--r-sm);overflow:hidden}
body.page-v6.page-orderyourself .oy-qty button{width:36px;height:38px;background:#fff;color:var(--text);font-size:16px;cursor:pointer}
body.page-v6.page-orderyourself .oy-qty button:hover{background:var(--surface)}
body.page-v6.page-orderyourself .oy-qty input{width:56px;height:38px;border:none;border-left:1px solid var(--line);border-right:1px solid var(--line);text-align:center;font-size:14px;font-weight:700;color:var(--text)}
body.page-v6.page-orderyourself .oy-placements{margin-top:8px}
body.page-v6.page-orderyourself .oy-place-tabs{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:14px}
body.page-v6.page-orderyourself .oy-place-tab{padding:9px 12px;background:#fff;border:1px solid var(--line);border-radius:999px;font-size:12px;font-weight:700;color:var(--text-mute);cursor:pointer;display:flex;align-items:center;gap:6px;position:relative}
body.page-v6.page-orderyourself .oy-place-tab:hover{border-color:var(--brand);color:var(--brand)}
body.page-v6.page-orderyourself .oy-place-tab.has-art{background:var(--brand-soft);border-color:var(--brand);color:var(--brand-dark)}
body.page-v6.page-orderyourself .oy-place-tab.has-art::before{content:"●";color:var(--brand);font-size:10px}
body.page-v6.page-orderyourself .oy-place-tab.is-selected{background:var(--brand);border-color:var(--brand);color:#fff}
body.page-v6.page-orderyourself .oy-place-tab.is-selected.has-art::before{color:#fff}
body.page-v6.page-orderyourself .oy-place-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:16px}
body.page-v6.page-orderyourself .oy-place-card__head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
body.page-v6.page-orderyourself .oy-place-card__head h4{font-size:17px;color:var(--text);margin:0;font-weight:800}
body.page-v6.page-orderyourself .oy-place-card__head .price{font-size:14px;font-weight:900;color:var(--brand)}
body.page-v6.page-orderyourself .oy-place-card p.meta{font-size:12px;color:var(--text-dim);margin:0 0 12px}
body.page-v6.page-orderyourself .oy-drop{border:2px dashed var(--line-2);border-radius:var(--r-sm);padding:22px 16px;text-align:center;background:#fff;transition:all .15s;cursor:pointer;display:block}
body.page-v6.page-orderyourself .oy-drop:hover, body.page-v6.page-orderyourself .oy-drop.is-dragover{border-color:var(--brand);background:var(--brand-soft)}
body.page-v6.page-orderyourself .oy-drop i{font-size:26px;color:var(--brand);margin-bottom:8px;display:block}
body.page-v6.page-orderyourself .oy-drop strong{display:block;font-size:14px;color:var(--text);margin-bottom:3px}
body.page-v6.page-orderyourself .oy-drop span{font-size:12px;color:var(--text-dim)}
body.page-v6.page-orderyourself .oy-drop__hasart{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:var(--r-sm);padding:12px}
body.page-v6.page-orderyourself .oy-drop__hasart img{width:56px;height:56px;object-fit:contain;background:var(--surface);border-radius:var(--r-sm);padding:4px}
body.page-v6.page-orderyourself .oy-drop__hasart-info{flex:1;min-width:0}
body.page-v6.page-orderyourself .oy-drop__hasart-info strong{font-size:13px;color:var(--text);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.page-v6.page-orderyourself .oy-drop__hasart-info span{font-size:11px;color:var(--text-dim)}
body.page-v6.page-orderyourself .oy-drop__hasart button{width:30px;height:30px;border-radius:50%;background:#fff;border:1px solid var(--line);color:var(--red);cursor:pointer;flex-shrink:0}
body.page-v6.page-orderyourself .oy-drop__hasart button:hover{background:#fef2f2;border-color:var(--red)}
body.page-v6.page-orderyourself .oy-blank-toggle{display:flex;align-items:center;gap:10px;margin-top:10px;font-size:12px;color:var(--text-dim);cursor:pointer}
body.page-v6.page-orderyourself .oy-buy__foot{border-top:1px solid var(--line);padding:18px 22px;background:var(--surface)}
body.page-v6.page-orderyourself .oy-total{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:12px}
body.page-v6.page-orderyourself .oy-total__label{font-size:13px;color:var(--text-dim);font-weight:600}
body.page-v6.page-orderyourself .oy-total__value{font-size:28px;font-weight:900;color:var(--text);letter-spacing:-.01em}
body.page-v6.page-orderyourself .oy-breakdown{font-size:11px;color:var(--text-dim);margin:0 0 14px;line-height:1.6}
body.page-v6.page-orderyourself .oy-breakdown span{display:block}
body.page-v6.page-orderyourself .oy-actions{display:flex;gap:10px}
body.page-v6.page-orderyourself .oy-actions .btn{flex:1}
body.page-v6.page-orderyourself .oy-overlay{position:fixed;inset:0;background:rgba(15,23,42,.35);opacity:0;pointer-events:none;transition:opacity .2s ease;z-index:450}
body.page-v6.page-orderyourself .oy-overlay.is-open{opacity:1;pointer-events:auto}

@media(max-width:1024px){ body.page-v6.page-orderyourself .blank-grid{grid-template-columns:repeat(2,1fr);gap:14px} }
@media(max-width:560px){ body.page-v6.page-orderyourself .oy-hero h1{font-size:26px} body.page-v6.page-orderyourself .oy-buy{width:100%} }
}

/* ============================================================
   V6 Designer Canvas — stacked HTML5 canvases (2200x3000) for
   shirt mockup + user artwork, scaled down via CSS for display.
   Responsive: always fits viewport with ≥16px gutters each side.
   ============================================================ */
body.page-v6 .v6-canvas-wrap{
  position:relative;
  width:min(420px, 100% - 32px);
  max-width:100%;
  max-height:70vh;
  aspect-ratio:22/30;
  margin:0 auto;
  filter:drop-shadow(0 8px 18px rgba(15,23,42,.08));
}
body.page-v6 .v6-canvas{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  touch-action:none; /* allow drag gestures without page scroll */
}
body.page-v6 .v6-canvas--shirt{z-index:1;pointer-events:none}
body.page-v6 .v6-canvas--design{z-index:2;cursor:move;background:transparent}
body.page-v6 .v6-canvas--design.is-empty{cursor:default}

@media(max-width:768px){
  /* Height-first: cap canvas to ~55vh on mobile so it never dominates
     the viewport. Width flexes to maintain 22/30 aspect ratio. */
  body.page-v6 .v6-canvas-wrap{
    width:min(340px, 100% - 32px);
    max-height:55vh;
  }
  body.page-v6 .designer__canvas{padding:18px 16px}
}
@media(max-width:480px){
  body.page-v6 .v6-canvas-wrap{
    width:min(280px, 100% - 32px);
    max-height:50vh;
  }
  body.page-v6 .designer__canvas{padding:14px 12px}
}
@media(max-width:360px){
  body.page-v6 .v6-canvas-wrap{
    width:min(240px, 100% - 24px);
    max-height:48vh;
  }
  body.page-v6 .designer__canvas{padding:10px}
}

/* ============================================================
   V6 FIX BLOCK — fills in declarations that were stripped when
   the mockup was ported to style.css. Later rules win via cascade.
   Authoritative source: homepage_mockup_v6.html
   ============================================================ */

/* Hero kicker badge */
body.page-v6 .hero__kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 14px;
  background:var(--accent-a-soft);
  color:var(--accent-a-dark);
  border-radius:100px;
  font-size:13px;
  font-weight:700;
  margin-bottom:22px;
}

/* Preview card frame */
body.page-v6 .preview{
  position:relative;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:22px;
  overflow:hidden;
}
body.page-v6 .preview-overlay{
  position:absolute;
  bottom:20px;
  left:20px;
  right:20px;
  background:#ffffffc4;
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  border:1px solid var(--line);
  border-radius:12px;
  padding:12px 14px;
  display:flex;
  align-items:center;
  gap:12px;
  z-index:3;
}
body.page-v6 .preview-overlay i{
  color:var(--accent-a);
  display:grid;
  place-items:center;
  font-size:18px;
  flex-shrink:0;
}
body.page-v6 .preview-price{
  position:absolute;
  top:22px;
  right:22px;
  background:var(--yellow,#fde047);
  color:#2a1f12;
  padding:8px 14px;
  border-radius:999px;
  font-weight:800;
  font-size:14px;
  z-index:3;
}

/* Path selector — card grid */
body.page-v6 .hero__paths{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
  max-width:1180px;
  margin:0 auto;
  padding:6px;
  background:rgba(255,255,255,.65);
  border:1px solid var(--line);
  border-radius:14px;
  backdrop-filter:blur(4px);
}
body.page-v6 .path-btn{
  padding:14px 16px;
  min-height:56px; /* ≥44px tap target comfortably */
  border:0;
  border-radius:10px;
  text-align:left;
  background:transparent;
  color:var(--text-mute);
  font-weight:700;
  display:flex;
  align-items:center;
  gap:12px;
  cursor:pointer;
  transition:background .2s, color .2s, box-shadow .2s;
}
body.page-v6 .path-btn:hover{
  background:rgba(255,255,255,.85);
  color:var(--text);
}
body.page-v6 .path-btn.is-active{
  background:#fff;
  color:var(--text);
  box-shadow:0 2px 10px rgba(15,23,42,.08);
}
body.page-v6 .path-btn i{
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border-radius:8px;
  background:var(--surface);
  color:var(--accent-a);
  font-size:14px;
  flex-shrink:0;
}
body.page-v6 .path-btn b{
  display:block;
  font-size:14px;
  line-height:1.2;
  margin-bottom:2px;
}
body.page-v6 .path-btn span span,
body.page-v6 .path-btn > span > span{
  display:block;
  font-size:12px;
  font-weight:500;
  color:var(--text-dim);
  line-height:1.3;
}

/* Designer frame */
body.page-v6 .designer-section__head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:20px;
  flex-wrap:wrap;
  margin-bottom:16px;
}
body.page-v6 .designer{
  background:#fff;
  color:#0f172a;
  border:1px solid var(--line);
  border-radius:var(--r-lg,18px);
  overflow:hidden;
}
body.page-v6 .designer__tool{
  width:100%;
  padding:12px 10px;
  border-radius:8px;
  background:#fff;
  border:1px solid #e5e7eb;
  color:#475569;
  display:flex;
  align-items:center;
  gap:10px;
  font-size:13px;
  font-weight:600;
  text-align:left;
  cursor:pointer;
  transition:border-color .15s, color .15s, background .15s;
}
body.page-v6 .designer__tool:hover{
  border-color:var(--brand,#0ea5e9);
  color:var(--brand,#0ea5e9);
  background:var(--brand-soft,#f0f9ff);
}

/* Designer canvas container — ensures our stacked canvases center */
body.page-v6 .designer__canvas{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:28px;
  overflow:hidden;
  min-height:0;
}

/* Shirt picker modal — full-screen overlay. Matches real markup:
   .shirt-modal > .shirt-modal__card > (head, filters, body, foot) */
body.page-v6 .shirt-modal{
  position:fixed;
  inset:0;
  z-index:9000;
  background:rgba(15,23,42,.55);
  display:none;
  align-items:center;
  justify-content:center;
  padding:30px;
}
body.page-v6 .shirt-modal.is-open{display:flex}
body.page-v6 .shirt-modal__card{
  width:min(960px, 100%);
  max-height:90vh;
  background:#fff;
  border-radius:var(--r-lg,18px);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  box-shadow:0 30px 80px rgba(15,23,42,.35);
}
body.page-v6 .shirt-modal__head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding:18px 22px;
  border-bottom:1px solid var(--line);
}
body.page-v6 .shirt-modal__title{
  font-size:17px;
  font-weight:800;
  color:var(--text);
  display:flex;
  align-items:center;
  gap:8px;
}
body.page-v6 .shirt-modal__count{
  font-size:12px;
  font-weight:600;
  color:var(--text-dim);
  background:var(--surface);
  border:1px solid var(--line);
  padding:3px 8px;
  border-radius:999px;
}
body.page-v6 .shirt-modal__search{
  flex:1;
  max-width:360px;
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:10px;
  color:var(--text-dim);
}
body.page-v6 .shirt-modal__search i{font-size:13px}
body.page-v6 .shirt-modal__search input{
  flex:1;
  border:0;
  outline:0;
  background:transparent;
  font-size:13px;
  color:var(--text);
}
body.page-v6 .shirt-modal__close{
  width:34px;
  height:34px;
  border-radius:999px;
  border:1px solid var(--line);
  background:#fff;
  color:var(--text-dim);
  cursor:pointer;
  display:grid;
  place-items:center;
  flex-shrink:0;
}
body.page-v6 .shirt-modal__close:hover{background:var(--surface);color:var(--text)}

/* Filter row — pills with spacing, scroll on mobile */
body.page-v6 .shirt-modal__filters{
  display:flex;
  align-items:center;
  gap:8px;
  padding:12px 22px;
  border-bottom:1px solid var(--line);
  flex-wrap:wrap;
}
body.page-v6 .shirt-modal__filters--scroll{
  flex-wrap:nowrap;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin;
}
body.page-v6 .shirt-modal__filter-label{
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.04em;
  color:var(--text-dim);
  padding-right:4px;
  flex-shrink:0;
}
body.page-v6 .shirt-modal__filter{
  padding:7px 12px;
  border:1px solid var(--line);
  border-radius:999px;
  background:#fff;
  color:var(--text-mute);
  font-size:12px;
  font-weight:600;
  cursor:pointer;
  white-space:nowrap;
  flex-shrink:0;
  transition:border-color .15s, color .15s, background .15s;
}
body.page-v6 .shirt-modal__filter:hover{
  border-color:var(--brand,#0ea5e9);
  color:var(--brand,#0ea5e9);
}
body.page-v6 .shirt-modal__filter.is-active{
  background:var(--brand,#0ea5e9);
  border-color:var(--brand,#0ea5e9);
  color:#fff;
}

body.page-v6 .shirt-modal__body{
  flex:1;
  overflow-y:auto;
  position:relative;
}
body.page-v6 .shirt-modal__grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(160px, 1fr));
  gap:14px;
  padding:18px 22px;
}
body.page-v6 .shirt-modal__empty,
body.page-v6 .shirt-modal__loader{
  padding:40px 22px;
  text-align:center;
  color:var(--text-dim);
  font-size:13px;
}
body.page-v6 .shirt-modal__sentinel{height:1px}

body.page-v6 .shirt-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:12px;
  padding:12px;
  cursor:pointer;
  transition:border-color .15s, box-shadow .15s, transform .15s;
  display:flex;
  flex-direction:column;
  gap:8px;
}
body.page-v6 .shirt-card:hover{
  border-color:var(--brand,#0ea5e9);
  box-shadow:0 4px 14px rgba(15,23,42,.08);
}
body.page-v6 .shirt-card.is-selected{
  border-color:var(--brand,#0ea5e9);
  box-shadow:0 0 0 2px var(--brand-soft,#e0f2fe);
}
body.page-v6 .shirt-card__thumb{
  aspect-ratio:1;
  background:var(--surface);
  border-radius:8px;
  display:grid;
  place-items:center;
  color:var(--brand,#0ea5e9);
}
body.page-v6 .shirt-card__thumb svg{width:70%;height:70%}
body.page-v6 .shirt-card__name{font-size:13px;font-weight:700;color:var(--text);line-height:1.3}
body.page-v6 .shirt-card__badges{display:flex;gap:4px;flex-wrap:wrap}
body.page-v6 .shirt-card__badge{
  font-size:10px;
  font-weight:700;
  padding:2px 6px;
  border-radius:999px;
  background:var(--surface);
  color:var(--text-mute);
}
body.page-v6 .shirt-card__badge--popular{background:#fff7ed;color:#c2410c}
body.page-v6 .shirt-card__meta{
  display:flex;
  justify-content:space-between;
  font-size:11px;
  color:var(--text-dim);
}

body.page-v6 .shirt-modal__foot{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  padding:14px 22px;
  border-top:1px solid var(--line);
  background:var(--surface);
}
body.page-v6 .shirt-modal__foot-info{
  font-size:12px;
  color:var(--text-dim);
  flex:1;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* Context strip */
body.page-v6 .tg-context{
  padding:10px 0;
  font-size:13px;
  color:var(--text-dim);
}

/* Mobile vertical rhythm + typography */
@media(max-width:768px){
  body.page-v6 .hero{padding:22px 0 28px}
  body.page-v6 .hero__top{gap:24px;margin-bottom:22px}
  body.page-v6 .hero h1{font-size:clamp(28px, 7vw, 40px);line-height:1.1}
  body.page-v6 .hero__lead{font-size:15px;line-height:1.55}
  body.page-v6 .hero__toggle-wrap{margin-bottom:22px}
  body.page-v6 .hero__paths{
    grid-template-columns:1fr;
    gap:6px;
    padding:6px;
    border-radius:12px;
  }
  body.page-v6 .path-btn{
    padding:14px 16px;
    min-height:56px;
    gap:12px;
  }
  body.page-v6 .tg-cta .btn{
    padding:10px 14px;
    font-size:13px;
    min-height:40px;
  }
  body.page-v6 .designer-section{padding:24px 0}
  body.page-v6 .designer-section__head{gap:12px;margin-bottom:14px}
  body.page-v6 .designer{border-radius:14px}
}
@media(max-width:480px){
  body.page-v6 .hero h1{font-size:clamp(24px, 8vw, 32px)}
  body.page-v6 .preview-overlay{top:12px;left:12px;right:12px;padding:10px 12px;font-size:13px}
  body.page-v6 .preview-price{bottom:14px;right:14px;padding:6px 12px;font-size:13px}
  body.page-v6 .shirt-modal{padding:14px}
  body.page-v6 .shirt-modal__grid{grid-template-columns:repeat(2,1fr);gap:10px;padding:14px}
}

/* ============================================================
   V6 MOBILE HAMBURGER + SLIDEOUT DRAWER
   Desktop: hidden. Mobile (≤768px): hamburger visible, inline nav/search/cta hidden.
   ============================================================ */
body.page-v6 .tg-burger{
  display:none;
  width:40px;
  height:40px;
  border:0;
  background:transparent;
  cursor:pointer;
  padding:10px 8px;
  flex-direction:column;
  justify-content:space-between;
  align-items:stretch;
  margin-left:auto;
}
body.page-v6 .tg-burger span{
  display:block;
  height:2px;
  width:100%;
  background:var(--text,#0f172a);
  border-radius:2px;
  transition:transform .2s, opacity .2s;
}
body.page-v6 .tg-drawer-backdrop{
  position:fixed;
  inset:0;
  background:rgba(15,23,42,.5);
  z-index:9998;
  opacity:0;
  transition:opacity .22s ease;
}
body.page-v6 .tg-drawer-backdrop.is-open{opacity:1}
body.page-v6 .tg-drawer{
  position:fixed;
  top:0;
  right:0;
  bottom:0;
  width:min(320px, 85vw);
  background:#fff;
  z-index:9999;
  box-shadow:-8px 0 30px rgba(15,23,42,.18);
  transform:translateX(100%);
  transition:transform .22s ease;
  display:flex;
  flex-direction:column;
  overflow-y:auto;
}
body.page-v6 .tg-drawer.is-open{transform:translateX(0)}
body.page-v6 .tg-drawer__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px 18px;
  border-bottom:1px solid var(--line);
}
body.page-v6 .tg-drawer__close{
  width:36px;
  height:36px;
  border-radius:999px;
  border:1px solid var(--line);
  background:#fff;
  color:var(--text-dim);
  cursor:pointer;
  display:grid;
  place-items:center;
  font-size:16px;
}
body.page-v6 .tg-drawer__nav{
  display:flex;
  flex-direction:column;
  padding:8px 0;
  flex:1;
}
body.page-v6 .tg-drawer__nav a{
  display:flex;
  align-items:center;
  gap:14px;
  padding:14px 20px;
  color:var(--text);
  text-decoration:none;
  font-size:15px;
  font-weight:600;
  border-bottom:1px solid var(--line);
  min-height:52px;
}
body.page-v6 .tg-drawer__nav a:hover,
body.page-v6 .tg-drawer__nav a:active{background:var(--surface)}
body.page-v6 .tg-drawer__nav a i{
  width:22px;
  text-align:center;
  color:var(--brand,#0ea5e9);
  font-size:15px;
}
body.page-v6 .tg-drawer__cta{
  padding:16px 18px;
  border-top:1px solid var(--line);
  display:flex;
  flex-direction:column;
  gap:10px;
  background:var(--surface);
}
body.page-v6 .tg-drawer__cta .btn{
  width:100%;
  justify-content:center;
  padding:12px 16px;
  font-size:14px;
  min-height:44px;
}

@media(max-width:768px){
  body.page-v6 .tg-burger{display:flex}
  body.page-v6 .tg-nav,
  body.page-v6 .tg-search,
  body.page-v6 .tg-cta{display:none !important}
  body.page-v6 .tg-header .wrap{display:flex;align-items:center;gap:10px}
  body.page-v6 .tg-logo__tag{display:none}
}

/* =========================================================================
   DESIGNER — Empty-canvas "Click to upload" prompt
   -------------------------------------------------------------------------
   Lives inside .v6-print-area as an HTML overlay (NOT painted into the
   canvas), so it never bleeds into exports. Visibility is keyed off the
   existing .is-empty class that updateEmptyClass() toggles on the design
   canvas — the prompt auto-fades in when the active side has zero layers
   and fades out the moment any layer is added (upload / text / template).
   ========================================================================= */
body.page-v6 .v6-canvas-empty-prompt{
  position:absolute;inset:0;
  display:flex;align-items:center;justify-content:center;
  padding:18px;margin:0;
  background:transparent;border:0;
  cursor:pointer;
  opacity:0;pointer-events:none;
  transition:opacity .22s ease;
  z-index:4;
  -webkit-appearance:none;appearance:none;
  font:inherit;color:inherit;
}
/* Show the prompt only while the design canvas reports is-empty.
   :has() lets CSS react to the existing JS state without a second class. */
body.page-v6 .v6-print-area:has(.v6-canvas--design.is-empty) .v6-canvas-empty-prompt{
  opacity:1;pointer-events:auto;
}
body.page-v6 .v6-canvas-empty-prompt__inner{
  display:inline-flex;flex-direction:column;align-items:center;gap:10px;
  padding:22px 28px;min-width:200px;max-width:80%;
  border:2px dashed #cbd5e1;border-radius:14px;
  background:rgba(255,255,255,.92);
  color:#475569;font-size:14px;font-weight:600;
  line-height:1.3;text-align:center;letter-spacing:.01em;
  box-shadow:0 4px 12px rgba(15,23,42,.06);
  transition:border-color .18s ease, background .18s ease, color .18s ease, box-shadow .18s ease;
  pointer-events:none; /* clicks go to the button parent */
}
body.page-v6 .v6-canvas-empty-prompt__inner i{
  font-size:32px;color:#94a3b8;transition:color .18s ease;
}
body.page-v6 .v6-canvas-empty-prompt:hover .v6-canvas-empty-prompt__inner,
body.page-v6 .v6-canvas-empty-prompt:focus-visible .v6-canvas-empty-prompt__inner{
  border-color:var(--accent-a, #15803d);
  background:#fff;color:var(--accent-a, #15803d);
  box-shadow:0 6px 18px rgba(15,23,42,.10);
}
body.page-v6 .v6-canvas-empty-prompt:hover .v6-canvas-empty-prompt__inner i,
body.page-v6 .v6-canvas-empty-prompt:focus-visible .v6-canvas-empty-prompt__inner i{
  color:var(--accent-a, #15803d);
}
body.page-v6 .v6-canvas-empty-prompt:focus{outline:none}
body.page-v6.mode-buy .v6-canvas-empty-prompt:hover .v6-canvas-empty-prompt__inner,
body.page-v6.mode-buy .v6-canvas-empty-prompt:focus-visible .v6-canvas-empty-prompt__inner{
  border-color:var(--accent-b, #ea580c);color:var(--accent-b, #ea580c);
}
body.page-v6.mode-buy .v6-canvas-empty-prompt:hover .v6-canvas-empty-prompt__inner i,
body.page-v6.mode-buy .v6-canvas-empty-prompt:focus-visible .v6-canvas-empty-prompt__inner i{
  color:var(--accent-b, #ea580c);
}

/* =========================================================================
   DESIGNER — Mobile toolbar: labels hidden by default except Upload Image
   -------------------------------------------------------------------------
   On mobile the tool row is extremely tight; even the four primary tools
   struggle to fit if every label is rendered. The design rule: show the
   Upload Image label (the primary entry-point for a new design) + the
   "Show All" toggle, and collapse every other button down to its icon.
   Tapping "Show All" adds .is-expanded to the container, which re-reveals
   every label (and also reveals the .is-secondary tools as before).
   ========================================================================= */
@media (max-width: 768px){
  /* Trim every tool to icon-only when the tools list is not expanded,
     EXCEPT the Upload Image button and the Show All pill. */
  body.page-v6 .designer__tools:not(.is-expanded) .designer__tool:not(#v6UploadBtn):not(.designer__tool--more){
    font-size:0 !important;
    padding:10px 12px !important;
    min-width:42px;
    gap:0;
    justify-content:center;
  }
  body.page-v6 .designer__tools:not(.is-expanded) .designer__tool:not(#v6UploadBtn):not(.designer__tool--more) > i{
    font-size:15px !important;
    margin-right:0 !important;
  }
  /* Upload Image keeps its label on mobile — primary call-to-action. */
  body.page-v6 .designer__tools:not(.is-expanded) #v6UploadBtn{
    font-size:12px !important;
    padding:10px 12px !important;
  }
  body.page-v6 .designer__tools:not(.is-expanded) #v6UploadBtn > i{
    font-size:14px !important;margin-right:6px !important;
  }
  /* Show All pill always shows its text so users can discover the toggle. */
  body.page-v6 .designer__tools:not(.is-expanded) .designer__tool--more{
    font-size:12px !important;
    padding:10px 12px !important;
  }
  body.page-v6 .designer__tools:not(.is-expanded) .designer__tool--more > i{
    font-size:14px !important;margin-right:6px !important;
  }
  /* While collapsed, hide any spans inside non-upload tools (covers the
     js-expand-label / js-more-label wrappers). */
  body.page-v6 .designer__tools:not(.is-expanded) .designer__tool:not(#v6UploadBtn):not(.designer__tool--more) > span{
    display:none !important;
  }
}