@charset "utf-8";

/*
========================
Variables
========================
*/
:root {
	--theme-color: #3fa9f5;
	--theme-light-color: #e1e9ee;
	--title-color: #11243e;
	--footer-bg-color: #11243e;
	--footer-title-color: #fff;
	--footer-text-color: #d0daea;
}

/*
========================
Color
========================
*/
.bg-white 	{ background-color: #fff;}
.bg-gray 	{ background-color: #f7f7f7;}
.bg-gray-white 	{ background: linear-gradient(180deg, rgba(247,247,247,1) 45%, rgba(255,255,255,1) 100%); }

.bg-white + .bg-white .inner	{ border-top: 1px solid #ddd;}
.bg-gray + .bg-gray .inner		{ border-top: 1px solid #ddd;}

.shape		{ position: absolute; /*border: 1px solid blue;*/}

/*
========================
Font
========================
*/
html, body 								{ color: #222; font-family:"Noto Sans TC", "Heiti TC", "微軟正黑體", "Microsoft JhengHei", "Helvetica Neue", Helvetica, "Arial";  font-size:14px; }


/*
========================
Elements
========================
*/
*						{ box-sizing:border-box; }
html, body				{ background-color: #f7f7f7; overflow-x: hidden; }
html 					{ scroll-behavior: smooth; }

a						{ color:inherit; text-decoration:none; transition: all .2s; }
strong					{ font-weight:500; }
em						{ font-style:italic; }

/** Table **/
table					{ width:100%; border-left:1px solid #ccc; border-top:1px solid #ccc; }
table th,
table td				{ padding:8px; border-right:1px solid #ccc; border-bottom:1px solid #ccc; }
caption					{ text-align:left; margin-bottom:10px; font-size:1.2em; }

/** Image **/
img						{ max-width:100%; }

/** Header **/
h1, h2, h3,
h4, h5, h6 				{ font-weight:500; line-height: 1.2em; color: var(--title-color); margin-bottom: .8em; }
h1 em, h2 em, h3 em,
h4 em, h5 em, h6 em		{ color: var(--theme-color); font-style: normal;}
h1 						{ font-size: 1.7em; }
h2 						{ font-size: 1.5em; }
h3 						{ font-size: 1.25em; }
h4 						{ font-size: 1.2em; }
h5 						{ font-size: .83em; }
h6 						{ font-size: .75em; }

/** Article **/
article	.contents				{ margin: 30px 0; }

/** Form **/
form							{ }
form fieldset					{ }
form legend						{ font-size:1.33em; margin-bottom:40px;  }
form .row						{ margin-bottom:25px; position:relative; }
form .row.collapse 				{ margin-bottom: 0;}
form .col						{ width:48.5%; }
form .col.small					{ width:auto; margin-right: 20px; }
form .col.tiny					{ width:140px; margin-right: 3%; }
form .col.large					{ flex-grow: 1; }
form .label						{ margin-bottom:10px; color: var(--title-color); font-size: 1.1em; font-weight: 500; }
form .label.collapse 			{ margin: 0 10px 0 0; white-space: nowrap; }
form .option-label 				{ display: flex; align-items: center;}
form .option-label .tip 		{ font-size: .92em; color: #666;}
form input[type="text"],
form input[type="date"],
form input[type="email"],
form input[type="tel"],
form input[type="password"],
form textarea,
form select						{ width:100%; height: 42px; padding:.7em 1em; background:#f7f7f7; border:1px solid #d2d2d2; border-radius:4px; font-family:inherit; outline:none; -webkit-appearance: none; -moz-appearance: none; }
form textarea					{ height:180px; }
form select						{ padding:5px; }
form input.fix-width			{ width: auto; max-width: 250px; margin-right: 15px;}
form button						{ font-family:inherit; outline:none; min-width: 120px; }
form button.button i			{ margin-left: .2em;}
form button:disabled			{ opacity: .5; pointer-events: none;}
form label input[type="radio"],
form label input[type="checkbox"] 	{ margin-right: 10px;}
form [type="submit"]:disabled,
form input[disabled] 			{ opacity: .5;}
form .col.disabled				{ opacity: .4; pointer-events: none;}
form .col.disabled input[disabled] { opacity: 1; }
form .bottom-row				{ margin-top: 30px;}
form .error						{ display:block; margin-top:5px; color:#d54449; font-size:.96em; line-height:1.25em; }
form .result					{ margin:20px auto 0 auto; max-width: 420px; text-align: center; line-height: 1.2em; color:#666; display: none; }
form .option-item 				{ margin-right: 40px;}
form hr 						{ border: none; border-top: 1px solid #ccc; margin-bottom: 20px;}

/** Select2 **/
.select2-container 																		{ width: 100% !important;}
.select2-container--default .select2-selection--single 									{ height: 40px; border: 1px solid #d2d2d2;  background-color: #f7f7f7; }
.select2-container--default .select2-selection--single .select2-selection__rendered 	{ line-height: 40px; }
.select2-container--default .select2-selection--single .select2-selection__arrow 		{ height: 40px; width: 40px; }
.select2-container .select2-selection--single .select2-selection__rendered				{ padding-left: 1em; line-height:38px;}

/** fr-view **/
.fr-view							{ line-height:1.7em; font-size: 15px;}
.fr-view ul							{ list-style:disc; padding-left:.8em; margin-left:10px;}
.fr-view ul li 						{ list-style:inherit; }
.fr-view ol							{ list-style:decimal; padding-left:.5em; margin-left:10px;}
.fr-view ol li 						{ list-style:inherit; }
.fr-view img						{ cursor:default !important; }
.fr-view img.fr-fic					{ margin: 8px 0;}
.fr-view a > img					{ cursor:pointer !important; }
.fr-view a 							{ text-decoration:underline; }
.fr-view sup 						{ line-height:0; }
.fr-view strong 					{ font-weight: 500;}
.fr-view blockquote					{ border-left:4px solid #aaa; background:#f5f5f5; color:#555; padding:1.1em; }
.fr-view hr 						{ margin: 15px 0; border: none; border-top: 1px solid #888;}
.fr-view table						{ width:100%; border:none; }
.fr-view table th,
.fr-view table td					{ padding:12px 8px; border:none; border-right: 1px solid #ddd; background-color: #fff; }
.fr-view table th:last-child,
.fr-view table td:last-child		{ border-right: none;}
.fr-view table th					{ background-color: var(--theme-color); color: #fff;}
.fr-view table tr:nth-child(2n) td  { background-color: var(--theme-light-color);}
.fr-view .link 						{ margin-top: 0;}
.fr-view .button 					{ margin-top: 10px; }

/** check list **/
.check-list ul						{ list-style:none; padding-left:0; margin-left: 0; }
.check-list ul li 					{ list-style:none; margin: 7px 0; }
.check-list ul li:first-child		{ margin-top: 0;}
.check-list ul li::before			{ content: ''; content: '\f058'; font-family: "Font Awesome 5 Pro"; font-weight: 900; font-size: 1.2em; margin-right: .8em; color: var(--theme-color); }

/** Flickity **/
.flickity-button 		                			  { }
.flickity-button:hover 		           			   	  { }
.flickity-button:disabled               			  { display: none; }
.flickity-prev-next-button              			  { }
.flickity-prev-next-button.previous     			  { }
.flickity-prev-next-button.next         			  { }
.flickity-page-dots                                   {width: 92%;}
.flickity-page-dots .flickity-page-dot                { background-color: var(--title-color); width: 8px; height: 8px; margin: 0 12px 0 0; }
.flickity-page-dots .flickity-page-dot.is-selected    { background-color: var(--theme-color); }
.flickity-page-dots .flickity-page-dot:only-child     { display: none; }


/** Flex layout **/
.flex         				      		{ display:flex; }
.flex-center  				  	 		{ display:flex; align-items:center; }
.flex-stretch 				  	 		{ display:flex; align-items:stretch; }
.flex-justify 				  	 		{ display:flex; justify-content:space-between; }
.flex-evenly  				  	 		{ display:flex; justify-content:space-evenly; }
.flex-reverse 				 	  		{ display:flex; flex-direction:row-reverse; }
.flex-vertical 				 	  		{ display:flex; flex-direction:column; }
.flex-wrap 				 	  			{ display:flex; flex-wrap:wrap; }
.flex-top 				 	  			{ display:flex; align-items: flex-start; }

/** Column layout **/
.column-2 							    { display:flex; flex-wrap:wrap; }
.column-2 .col-item 				    { width:45%; margin-top:4%; margin-right: 10%; }
.column-2 .col-item:nth-child(2n)	    { margin-right:0; }
.column-2 .col-item:nth-child(-n+2)    	{ margin-top:0; }

.column-3 								{ display:flex; flex-wrap:wrap; }
.column-3 .col-item 					{ width:28.66666666666667%; margin-right:7%; margin-top:60px; }
.column-3 .col-item:nth-child(3n)       { margin-right:0; }
.column-3 .col-item:nth-child(-n+3)     { margin-top:0; }

.column-4 								{ display:flex; flex-wrap:wrap; }
.column-4 .col-item			 			{ width:23.5%; margin-right:2%; margin-top:40px; }
.column-4 .col-item:nth-child(4n) 		{ margin-right:0; }
.column-4 .col-item:nth-child(-n+4) 	{ margin-top:0; }

.column-5 								{ display:flex; flex-wrap:wrap;  }
.column-5 .col-item			 			{ width:12%; margin-right:10%; margin-top:20px; }
.column-5 .col-item:nth-child(5n) 		{ margin-right:0; }
.column-5 .col-item:nth-child(-n+5) 	{ margin-top:0; }

/** Menu horizontal **/
.menu-horizontal						{ margin-bottom: 30px; }
.menu-horizontal li						{ display: inline-block; margin-right: 30px;}
.menu-horizontal li.active				{ text-decoration: underline; }

/** Image list **/
.image-list li							{ margin-top:15px; }
.image-list li:first-child				{ margin-top:0; }

.image-carousel							{ width: 100%; margin-bottom: 40px;}
.image-carousel	.carousel-cell			{ width: 100%; background-color: #f2f2f2;}

/** Thumb **/
.thumb,
.thumb-sq,
.thumb-rect,
.thumb-banner,
.thumb-vl								{ width: 100%; overflow:hidden; position:relative; display: block; }
.thumb-sq picture,
.thumb-rect picture,
.thumb-banner picture,
.thumb-vl picture 						{ position:absolute; left:0; top:0; width:100%; height:100%; }
.thumb img,
.thumb-sq img,
.thumb-rect img,
.thumb-banner img,
.thumb-vl img							{ width:100%; transition:all .6s; }
.thumb.zoom:hover img,
.thumb-sq.zoom:hover img,
.thumb-rect.zoom:hover img,
.thumb-banner.zoom:hover img,
.thumb-vl.zoom:hover img				{ transform:scale(1.1, 1.1); }
.thumb-sq								{ padding-top:100%; }
.thumb-rect								{ padding-top:67%; }
.thumb-banner							{ padding-top:58%; }
.thumb-vl								{ padding-top:140%; }
.thumb-sq img,
.thumb-rect img,
.thumb-banner img,
.thumb-vl img							{ position:absolute; left:0; top:0; right:0; bottom:0;
											width:auto; height:auto; max-width:100%; max-height:100%; margin:auto;}

/** Thumb info **/
.thumb-info								{ padding: 15px 0;}
.thumb-info	.subtitle					{ margin-bottom: 8px; }
.thumb-info	.title						{ font-size: 1.2em; line-height: 1.2em;}
.thumb-info	.summary					{ margin-top: 10px; color: #888;}

/** Zoom button **/
.zoom-button							{ position: absolute; right: 15px; top: 15px; opacity: 0; transition: opacity .4s; cursor: pointer; }
.is-selected .zoom-button				{ opacity: 1; transition: opacity .4s .6s; }

/** Play button **/
.play-button							{ position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); display:block;
											width:60px; height:60px; background:#fff; border-radius:50%; opacity:.85;
											transition:opacity .4s; cursor: pointer; z-index: 1; }
.play-button:after						{ content:''; position:absolute; left:50%; top:50%; transform:translate(-20%, -50%);
											border-left:12px solid #000; border-right:12px solid transparent;
											border-top:7px solid transparent; border-bottom:7px solid transparent;  }
.play-button:hover						{ opacity:1; }

/** Button **/
.button,
.button-md,
.button-lg							  	{ display:inline-block; padding: .72em 1.2em; font-weight: 500; letter-spacing: .05em; transition:background .2s; white-space:nowrap;
											background:var(--theme-color); color:#fff; border:none; border-radius:5px; text-align: center; text-decoration: none !important; cursor: pointer; }
.button									{ font-size:1em; }
.button-md				  	  			{ font-size:1.1em; padding:.8em 1.2em; }
.button-lg				  	  			{ font-size:1.4em; padding:1em; }
.button i,
.button-md i,
.button-lg i			   		  		{ margin-left:.8em; }
.button-wrapper							{ display:block; }
.button:hover,
.button-md:hover,
.button-lg:hover						{ background: var(--title-color);}
.button.disabled,
.button-md.disabled,
.button-lg.disabled						{ pointer-events: none; background:#ccc; color:#888;}
.button-arrow::after  					{ content: '\0f105'; font-family: "Font Awesome 5 Pro"; font-weight: 400; margin-left: .8em;}

/** Link **/
.link-wrapper				  			{ display:block; margin-top: 20px; }
.link 									{ display: inline-block; text-decoration: none !important; font-weight: 500; margin-bottom: .8em; display: inline-block; font-size:1.05em; color: var(--theme-color);}
.link:hover 							{ color: var(--title-color); }
.link:last-child						{ margin-bottom: 0;}
.link-arrow::after  					{ content: '\0f178'; font-family: "Font Awesome 5 Pro"; margin-left: 5px;}
.link-download::before  				{ content: '\0f33d'; font-family: "Font Awesome 5 Pro"; margin-right: 8px;}
.link-tel::before  						{ content: '\0f095'; font-family: "Font Awesome 5 Pro"; margin-right: 8px;}
.link-fax::before  						{ content: '\0f1ac'; font-family: "Font Awesome 5 Pro"; margin-right: 8px;}
.link-addr::before  					{ content: '\0f124'; font-family: "Font Awesome 5 Pro"; margin-right: 8px;}
.link i									{ margin-left:.8em; }

/** Tag **/
.tag-list								{ padding: 8px 0;}
.tag-list .tag							{ display:inline-block; margin:0 2px 5px 0; }
.tag-list .tag a						{ display:inline-block; padding:.36em 1em; background:#aaa; color:#fff; border-radius:15px; font-size:.96em; white-space:nowrap; transition:all .2s; }
.tag-list .tag a:hover,
.tag-list .tag a.active					{ background:#222; color:#fff; }
.tag-list .tag a i						{ margin-left:6px; font-size:12px; }

/** Breadcrumbs **/
.breadcrumbs							{ padding: 15px 0; display:flex; flex-grow:1; }
.breadcrumbs	.item					{ margin-right:18px; white-space:nowrap; }
.breadcrumbs	.item:after				{ /*font-family: "Font Awesome 5 Pro"; font-weight: 900;*/ content: "/"; margin-left:20px; font-size:12px; }
.breadcrumbs	.item:last-child		{ margin-right:0; }
.breadcrumbs	.item:last-child:after  { display:none; }

/** Dropodown menu **/
.dropdown								{ position:relative;  }
.dropdown .label						{ cursor:pointer; }
.dropdown .menu							{ z-index: 200; position:absolute; left:-30px; padding-top: 30px; display:none;    }
.dropdown .menu ul						{ position: relative; min-width: 160px; background: #fff; padding:8px 20px; border-radius: 10px; box-shadow: 0 0 20px rgba(0,0,0,.15); }
.dropdown .menu li						{ margin:14px 0; white-space:nowrap; }
.dropdown .menu ul::after				{ content: ''; position: absolute; left: 40px; top: -14px; border-bottom: 7px solid #fff; border-top: 7px solid transparent; border-left: 7px solid transparent; border-right: 7px solid transparent;}
.dropdown:hover .menu 					{ display:block; }

.dropdown.login .label					{ display: none;}
.dropdown.login .menu 					{ padding-top: 21px;}

.dropdown .menu .nav-menu				{ width: 540px; padding: 20px 30px; }
.dropdown .menu .nav-menu-item 			{ width: 48%; margin-bottom:18px; white-space:normal;  }
.dropdown .menu .nav-menu-item:nth-child(2n) { margin-left: 4%;}
.dropdown .menu .nav-item-title			{ font-size: 1.1em; font-weight: 500; color: var(--title-color); margin-bottom: .5em;}
.dropdown .menu .nav-item-desc			{ font-size: .95em; line-height: 1.2em; color: #666; }

/** Paragraph **/
.paragraphs								{ border-top: 1px solid #ccc;}
.paragraphs .paragraph					{ border-bottom: 1px solid #ccc; padding: 40px 10px;}
.paragraphs .paragraph h3 				{ font-size: 1.25em;}

/** Pagination **/
.pagination 							{ margin-top:30px; display:flex; justify-content: center; }
.pagination li							{ margin: 0 3px;}
.pagination a,
.pagination span 						{ width: 40px; height: 40px; line-height: 40px; text-align: center; display:inline-block; color:#999; border-radius: 50%; }
.pagination a:hover 					{ color:#000; background-color: #eee;}
.pagination .active	span				{ color:#fff; background-color: var(--theme-color); }
.pagination .prev						{ font-size:1.2em; }
.pagination .next						{ font-size:1.2em; }
.pagination .pager						{ display: none;}

/** Sharer **/
.social-share 							{ padding: 15px 0;}
.social-share .sharer-label 			{ margin-right: 15px;}
.social-share .sharer-icons				{ }
.social-share .jssocials-share-link 	{ border-radius: 50%; border: none !important; font-size:.8em; }
.social-share .jssocials-share-link:hover { color: #000; }

/** File list **/
.file-list-label 						{ margin: 30px 0 15px 0; color: #888; font-size: 1.05em; font-weight: 500;}
.file-list li							{ margin: 10px 0;}

/** Misc. **/
.center									{ text-align:center; }
.right									{ text-align:right; }
.left									{ text-align:left; }
.clear									{ clear:both; }
.overlay								{ position: relative; }

/** 404 **/
.http-error								{ padding:100px 4%; text-align: center; position:fixed; left: 50%; top: 45%; transform: translate(-50%, -50%);}
.http-error .code						{ font-size: 4em ; margin-bottom: .4em; color: #999;}
.http-error	.message					{ font-size: 1.2em; font-weight: 500; color: #999; margin-bottom: 4em;}


/*
========================
Section layout
========================
*/
.section-header 										{ max-width: 680px; margin-bottom: 80px;}
.section-header.center 									{ margin: 0 auto 60px auto;}
.section-header.full 									{ max-width: none;}

.layout-banner											{ background: #fff; }
.layout-banner .carousel-cell							{ width: 100%; overflow: hidden; }
.layout-banner .carousel-cell .inner 					{ position: absolute; left: 50%; top: 0; height: 100%; transform: translateX(-50%);}
.layout-banner .banner-box 								{ position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 30%; max-width: 400px; }
.layout-banner .banner-box .subtitle 					{ color: var(--theme-color); font-size: 1.2em; font-weight: 500; margin-bottom: 1em;}
.layout-banner .banner-box h2 							{ font-size: 1.8em; margin-bottom: .5em;}
.layout-banner .flickity-page-dots						{ max-width: 1400px; left: 50%; bottom:100px; transform: translateX(-50%); justify-content: flex-start;}
.layout-banner .banner-link								{ position: absolute; left: 0; top: 0; right: 0; bottom:0; display: block; }

.parallex-scene 										{ position: relative; height: 0; padding-top:47.9166%; }
.parallex-scene .parallex 								{ position: absolute !important; left: 0; top: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-position: 50% 50%; background-size:cover; }

.layout-col1 h2											{ margin-bottom: .7em;}
.layout-col1 .inner										{ padding: 60px 0;}
.layout-col1 .paragraph 								{ margin: 60px 0;}
.layout-col1 .paragraph:first-child						{ margin-top: 0;}
.layout-col1 .paragraph:last-child						{ margin-bottom: 0;}
.layout-col1 .paragraph .image 							{ margin-bottom: 30px;}
.layout-col1 .fr-view ul 								{ display:flex; flex-wrap:wrap; text-align: left; margin: 40px auto 0 auto; max-width: 800px; }
.layout-col1 .fr-view ul li 							{ width:30%; margin-right:5%; margin-top:5px; }
.layout-col1 .fr-view ul li:nth-child(3n)        		{ margin-right:0; }
.layout-col1 .fr-view ul li:nth-child(-n+3)      		{ margin-top:0; }

.layout-col2 .inner 									{ padding: 70px 0;}
.layout-col2 .column-2 .col-item 				    	{ margin-top:70px; }
.layout-col2 .column-2 .col-item:nth-child(-n+2)    	{ margin-top:0; }
.layout-col2 .column-2 .col-item .image 				{ margin-bottom: 20px;}

.layout-col2-icons										{ padding: 40px 0 80px 0;}
.layout-col2-icons .text 								{ width: 30%; max-width: 420px;}
.layout-col2-icons .icons 								{ width: 57%;}
.layout-col2-icons .icons .col-item						{ display: none;}
.layout-col2-icons .icons .col-item:nth-child(-n+10) 	{ display: block; }
.layout-col2-icons .more-icons							{ width: 100%; margin-top: 40px; text-align: center;}
.layout-col2-icons .more-icons .more,
.layout-col2-icons .more-icons .less 					{ color: #888; cursor: pointer; display: inline-block; }
.layout-col2-icons .more-icons .more i,
.layout-col2-icons .more-icons .less i 					{ margin-left: 8px;}
.layout-col2-icons .more-icons .less 					{ display:none; }
.layout-col2-icons.show-more-icon .more-icons .less 	{ display: block;}
.layout-col2-icons.show-more-icon .more-icons .more 	{ display: none;}
.layout-col2-icons.show-more-icon .icons .col-item		{ display: block;}

.layout-col2-box .inner									{ padding: 60px 0;}
.layout-col2-box .column-2								{ max-width: 1200px; margin: auto;}
.layout-col2-box .column-2 .col-item 				    { width:48%; margin-right: 4%; }
.layout-col2-box .column-2 .col-item:nth-child(2n)	    { margin-right:0; }
.layout-col2-box .box 									{ border-radius: 10px; box-shadow: 0 0 10px rgba(0,0,0,.15); background-color: #fff; padding: 40px;}
.layout-col2-box .box .subtitle 						{ font-size: 1.15em; margin-bottom: 1.2em; font-weight: 500; color: var(--theme-color);}
.layout-col2-box .box h2 								{ font-size: 1.33em;}
.layout-col2-box .box .image 							{ width: 64px; margin-right: 30px; }
.layout-col2-box .box img 								{ display: block; width: 64px; max-width: none; }
.layout-col2-box.wide-footer .box:last-child 			{ width: 100%; margin-right: 0;}
.layout-col2-box.wide-footer .column-2					{ max-width: 960px;}

.layout-col2-image-text	.inner							{ padding: 1px 0;}
.layout-col2-image-text .section 						{ margin: 50px 0; }
.layout-col2-image-text .section:nth-child(2n) 			{ flex-direction: row-reverse;}
.layout-col2-image-text .image  						{ width: 65%;}
.layout-col2-image-text .text   						{ width: 30%;}

.layout-col3 .inner 									{ padding: 70px 0;}
.layout-col3 h2 										{ font-size: 1.4em;}
.layout-col3 .column-3 .col-item .image 				{ margin-bottom: 20px;}
.layout-col3 .column-3 .col-item .image img 			{ max-width: 36px;}

.layout-col3-line 										{ padding: 60px 0; }
.layout-col3-line .image 								{ width: 48px; flex-shrink: 0; margin-right: 30px;}
.layout-col3-line .column-3 							{ position: relative; }
.layout-col3-line .column-3 .col-item 					{ width:26.66666666666667%; margin-right:10%; }
.layout-col3-line .column-3 .col-item:nth-child(3n) 	{ margin-right: 0;}
.layout-col3-line .column-3::before						{ content: ''; position: absolute; left: 31.66666666666667%; top: 0; bottom:0; border-left: 1px dotted #ccc;}
.layout-col3-line .column-3::after						{ content: ''; position: absolute; left: 68.33333333333334%; top: 0; bottom:0; border-left: 1px dotted #ccc;}

.layout-col3-box .column-3								{ justify-content: space-between;}
.layout-col3-box .inner									{ padding: 60px 0;}
.layout-col3-box .box 									{ border-radius: 10px; box-shadow: 0 0 10px rgba(0,0,0,.15); background-color: #fff; padding:30px; }
.layout-col3-box .box h2 								{ font-size: 1.33em;}
.layout-col3-box .box .image 							{ width: 64px; margin-right: 30px; }
.layout-col3-box .box img 								{ display: block; width: 64px; max-width: none; }

.layout-col4 .inner 									{ padding: 60px 0;}
.layout-col4 h2 										{ font-size: 1.33em;}
.layout-col4 .column-4 .col-item .image 				{ margin-bottom: 25px;}

.layout-vertical-list .inner							{ padding: 70px 0;}
.vertical-list-image									{ width: 60%;  }
.vertical-list-image .carousel-cell						{ width: 100%; transition: opacity 1s ease-in-out;}
.vertical-list-text										{ width: 34%; position: relative; padding-left: 50px; }
.vertical-list-text .item								{ padding-bottom: 70px; position: relative;}
.vertical-list-text .item::after						{ content: ''; position: absolute; left: -39px; top: 28px; bottom: 8px; border-left: 1px dotted var(--theme-color); }
.vertical-list-text .item h3::before					{ position: absolute; left: -50px; top: 0; font-family: "Font Awesome 5 Pro"; font-size: 22px; font-weight: 900; content: "\f058"; color: var(--theme-color); }

.layout-chronology .inner 								{ padding: 70px 0 120px 0;}
.layout-chronology h3									{ color: var(--theme-color);}
.layout-chronology .column-3 .col-item .image 			{ margin-bottom: 25px;}

.preview-warning 										{ z-index: 102; position: fixed; left: 50%; top: 90px; transform: translateX(-50%); padding: .5em 2em; border-radius: 20px; background-color: rgba(255,255,255,.9); color: var(--theme-color); font-size: 13px;}

/*
========================
Structure
========================
*/
#container								{}
.wrapper 								{}
.inner,
.inner-medium,
.inner-small,
.inner-tiny								{ width:92%; max-width:1400px; margin:auto; position:relative; }
.inner-medium							{ max-width: 1200px; }
.inner-small							{ max-width:960px; }
.inner-tiny								{ max-width:600px; }
.inner.has-padding						{ padding: 80px 0;}
.inner-tiny.has-padding					{ padding: 60px 0;}

/*
========================
Header
========================
*/
#header-wrapper							{ position: fixed; left: 0; top: 0; right: 0; z-index: 100;background-color: #fff; border-bottom: 1px solid #e6e6e6; transition: all .4s;}
#header-inner							{ height: 60px; transition: all .4s; }
#header-inner h1 						{ width: 110px; margin-bottom: 0; }
#header-inner h1 a 						{ display: block; width: 100%; height: 0; padding-top: 20%; text-indent: -300px; overflow: hidden; background: url(../image/logo-black.svg?v=1) no-repeat 0 0; background-size: contain; }

/*headroom*/
#header-wrapper.headroom--unpinned					{ transform: translateY(-110%);}

/*
========================
Nav
========================
*/
#nav-wrapper							{ position: relative; z-index: 100; flex-grow: 1; }
#nav-inner								{ }
#nav-inner > ul							{ }
#nav-inner > ul > li					{ margin-left: 80px; }
#nav-inner .label						{ font-size: 1.24em; font-weight: 500; }
#nav-inner .label:hover,
#nav-inner a:hover 						{ color: var(--theme-color);}
#nav-inner i 							{ font-size: .9em; margin-left: 5px;}
#nav-news								{ margin-right: auto !important;}
#nav-login								{ margin-left: 5px !important;}
#nav-login-button						{ padding: 12px 54px 0 22px; height: 40px; position: relative;}
#nav-login-button::after 				{ position: absolute; right: 0; top: 0; font-family: "Font Awesome 5 Pro"; font-weight: 400; content: "\f107"; display: inline-block; width: 36px; height: 40px; line-height: 40px; border-left: 1px solid rgba(255,255,255,.5); }
#nav-purchase 							{ margin-left: 5px !important; }
#nav-purchase-button					{ padding: 12px 22px; height: 40px; color: #fff !important; }
#nav-purchase .label 					{ display: none;}

#menu-button 							{ display: none;}
#nav-header								{ display: none;}

/*
========================
Main
========================
*/
.main-space 							{ height: 130px;}
.main-space.large 						{ height: 233px;}

#main-wrapper							{ min-height: calc(100vh - 590px);}
#main-inner								{}

#main-background						{ position: relative; }
#main-background img 					{ position: absolute; right: 0; top: 40px; /*width:90%; max-width: 1300px;*/  }

#page-header							{ padding:130px 0 60px 0;  }
#page-header h2							{ font-size: 1.8em; }
#page-aside								{ width: 200px; margin-right: 12%; flex-shrink: 0;}
#page-aside li							{ margin: 15px 0; position: relative;}
#page-aside li:first-child				{ margin-top: 0;}
#page-aside li:last-child				{ margin-bottom: 0;}
#page-aside li a						{ color: #666; font-size: 1.05em;}
#page-aside li a:hover					{ color: var(--theme-color);}
#page-aside li.active a					{ color: var(--title-color);}
#page-aside > ul > li > a::after 		{ position: absolute; right: 0; top:0; font-family: "Font Awesome 5 Pro"; content: "\f105"; }
#page-aside > ul > li.active > a::after { transform: rotate(90deg);}
#page-aside li ul 						{ margin: 20px 0 20px 2em;}
#page-content 							{ flex-grow: 1;}

#page-nav								{ pointer-events: none; z-index: 20; position: fixed; left: 0; top: 130px; width: 100%; padding: 30px 0; transition: all .3s; }
#page-nav nav							{ padding:14px 12px; border-radius: 30px; background-color: #fff; overflow: auto; margin: auto; gap: 4px; box-shadow: 0 0 10px rgba(0,0,0,.15); }
#page-nav nav a							{ pointer-events:all; display: inline-flex; white-space: nowrap; margin: 0 30px; font-weight: 500; font-size: 1.1em;}
#page-nav nav a:hover 					{ color: var(--theme-color); }
#page-nav nav a.active 					{ color: var(--theme-color); }
#page-nav nav a.is-preview 				{ opacity: .4;}

#page-nav.headroom--unpinned			{ top: 0; }

/*
========================
Footer
========================
*/
#footer-wrapper							{ position: relative; z-index: 2; background-color: var(--footer-bg-color); color: var(--footer-text-color);; padding: 70px 0;}
#footer-inner							{}
#footer-logo 							{ width: 110px;}
#footer-nav								{ width: 75%; margin-bottom: 80px; }
#footer-nav .title 						{ font-weight: 500; font-size: 1.2em; margin-bottom: 1.5em; color: var(--footer-title-color); }
#footer-nav li 							{ margin: 15px 0; font-size: .96em; line-height: 1.4em; white-space: nowrap;}
#footer-nav li a:hover 					{ color: #fff;}
#footer-nav li i 						{ margin-right: 10px;}
#footer-nav .has-icon li 				{ padding-left: 25px; position: relative;}
#footer-nav .has-icon li i 				{ position: absolute; left: 0; top: .3em; margin: 0;}
#footer-copyright						{ font-size: 12px; margin-right: 15px; }
#footer-credit							{ font-size: 12px; }

#footer-inner .toolbar					{ margin: 15px 0; font-size: .95em;}
#footer-inner .toolbar .label			{ font-weight: 500; }
#footer-inner .toolbar li				{ margin-left: 20px;}
#footer-inner .toolbar li.active a		{ text-decoration: underline;}

#footer-partners 						{ margin-left: 30px; margin-right: auto;}
#footer-partners .partner-icon			{ height: 60px; margin-right: 25px;}

/*
#footer-inner .social_link_messenger 	{ position: fixed; right: 25px; bottom:25px; right:25px; bottom:25px; width:48px; height:48px; line-height:48px; border-radius:50%; text-align:center; background:#000; color:#fff; font-size:1.5em; }
*/
.chat-toolbar 							{ position: fixed; right: 25px; bottom:25px; }
.chat-toolbar .switch-button			{ width:48px; height:48px; border-radius: 50%; background-color: #000; color: #fff; position: relative; cursor: pointer;}
.chat-toolbar .switch-button.close 		{ display: none;}
.chat-toolbar i 						{ font-size: 1.6em; position:absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}
.chat-toolbar .chat-buttons				{ position: absolute; bottom:48px; transform-origin: 50% bottom; transform: scale(0, 0); visibility: hidden; transition: transform .2s, visibility 0s 2s;}
.chat-toolbar .chat-buttons li 			{ margin-bottom: 15px; width:48px; height:48px; border-radius: 50%; position: relative; background: #fff; box-shadow: 0 0 10px rgba(0,0,0,.2); }
.chat-toolbar .chat-buttons .social_link_messenger 	{ color: #4193f7;}
.chat-toolbar .chat-buttons .social_link_line 		{ color: #53b535;}
.chat-toolbar .chat-buttons .social_link_instagram 	{ color: #d6249f;}
.chat-toolbar.show .chat-buttons		{ transform: scale(1, 1); visibility: visible; transition: transform .2s, visibility 0s;}
.chat-toolbar.show .switch-button.close { display: block;}
.chat-toolbar.show .switch-button.open  { display: none;}

/*
========================
Pages
========================
*/

/** Homepage **/
#index #main-background img   			{ width: 86%; max-width: 1255px;}


/** Application **/
#application #main-background img   			{ width: 64%; max-width: 781px;}

/** News **/
#news-section							{ padding: 60px 0 80px 0;}
#news-section .flickity-viewport		{ overflow: visible;}
#news-section .carousel-cell 			{ width: 30%; margin-right: 5%;}
#news-section .thumb-rect				{ margin-bottom: 20px; background: url(../image/logo-white.svg?v=1) no-repeat 50% 50% #d9e6f4; background-size: 50% 50%; }
#news-section .section-header			{ margin-bottom: 30px; max-width: none;}
#news-section .section-header h2 		{ margin-bottom: 0;}
#news-section .section-header a			{ font-size: 1.1em; color: var(--title-color);}
#news-section .section-header a:hover 	{ color: var(--theme-color);}
#news-section .section-header a i		{ margin-left: 10px;}

#news-list								{ border-top: 1px solid #ccc;}
#news-list li							{ border-bottom: 1px solid #ccc; padding: 30px 10px;}
#news-list .image						{ flex-shrink: 0; width: 240px; margin-left: 40px;}

/** About **/
#about #main-background img 			{ right: -30%; top: -250px; width: 70%; max-width: 1199px;}

/** Support center **/
#support-search-form					{ width: 92%; max-width: 600px; margin:0 auto 20px auto; position: relative;}
#support-search-form [type="text"]		{ background-color: #fff; border-radius: 30px; height: 48px; padding: .7em 1.5em; font-size: 1.1em;}
#support-search-form [type="submit"]	{ position: absolute; right: 10px; top: 50%; transform: translateY(-50%); width: 40px; height: 40px; min-width: 0; border: none; background: none; cursor: pointer;}

#support .col-item .image 				{ margin-bottom: 15px;}
#support .col-item .image img 			{ height: 48px;}

#support-list h3						{ font-size: 1.6em; margin-bottom: 20px;}
#support-list h4						{ font-size: 1.33em; margin-bottom: 20px;}
#support-list .paragraph				{ padding: 25px 0;}
#support-list .paragraph li				{ margin: 18px 0; font-size: 1.05em; line-height: 1.2em;}
#support-list .paragraph li:first-child	{ margin-top: 5px;}
#support-list .paragraph li:last-child	{ margin-bottom: 5px;}
#support-list .paragraph li a:hover 	{ color: var(--theme-color);}

.support-notes 							{ padding: 40px 0 80px 0; border-top: 1px solid #ccc;}
.support-notes h3 						{ font-size: 1.33em; margin-bottom: 30px;}

#search-info 							{ margin-bottom: 30px;}
#search-results							{ border-top: 1px solid #ccc;}
#search-results	li						{ border-bottom: 1px solid #ccc; padding: 30px 10px; }
#search-results em 						{ color: var(--theme-color); font-style: italic;}
#search-results .subtitle 				{ margin-bottom: 20px; color:var(--theme-color); }

/** Resource center **/
.resource-category						{ margin-bottom: 60px;}
.resource-category:last-child			{ margin-bottom: 0;}
.resource-category h3					{ font-size: 1.5em; margin-bottom: 30px;}
.resource-set							{ margin-bottom: 30px; padding: 30px 40px; border: 1px solid #eee; border-radius: 10px; box-shadow: 0 0 15px rgba(0,0,0,.12); background-color: #fff;}
.resource-set h4						{ font-size: 1.2em; margin-bottom: 20px;}
.resource-set .info 					{ flex-grow: 1; margin-right: 30px;}
.resource-set .resource-info 			{ margin-bottom: 20px;}
.resource-set .resource-info p			{ width: 25%; }
.resource-set .resource-info p.filename	{ flex-grow: 1; }
.resource-set .resource-info p.download	{ width: auto; }
.resource-set .fr-view 					{ color: #888; max-width: 680px;}

/** Contact **/
#contact-aside							{ width: 260px; margin-right: 10%; padding-top: 15px;}
#contact-aside #contact-info,
#contact-aside .fr-view 				{ margin-bottom: 50px;}
#contact-aside #contact-info			{ margin-top: 15px;}
#contact-aside #contact-info li			{ margin: 10px 0; padding-left: 25px; line-height: 1.4em; position: relative; }
#contact-aside #contact-info i			{ color: var(--title-color); position: absolute; left: 0; top: .2em; margin: 0; }

.feedback-form							{ margin-bottom: 80px; flex-grow: 1; padding:50px 40px; background-color: #fff; border-radius: 10px; box-shadow: 0 0 10px rgba(0,0,0,.15);}
.feedback-form legend					{ font-size: 1.5em; font-weight: 500; color: var(--title-color);}


/*
========================
Purchase
========================
*/
.box-round 								 						{ border-radius: 15px;}
.box-shadow 							 						{ box-shadow: 0 0 15px rgba(0,0,0,.15);}

.purchase-box 							 						{ max-width: 720px; padding: 50px 6%; margin:0 auto 50px auto; background-color: #fff; }
.purchase-box form .label 										{ font-size: 1em;}
.purchase-box form .row:not(.collapse)							{ margin-bottom:20px; font-size: 1.1em;  }
.purchase-box form .fieldset-note 								{ margin-bottom: 20px;}

.purchase-form .error 											{ font-size: .92em;}
.purchase-form [type="submit"].loading::after 					{ display:inline-block; content: '\f3f4'; font-family: "Font Awesome 5 Pro"; margin-left: 5px; animation:spin 2s linear infinite; }
@keyframes spin 												{ 100% { transform:rotate(360deg); } } 


#mis-step-contract 			 			 						{ overflow-y: hidden; }
#mis-step-contract #main-inner 			 						{ min-height: 70vh;}

#purchase-steps							 						{ justify-content: center; margin-bottom: 50px;}
#purchase-steps .step					 						{ margin: 0 15px; text-align: center;}
#purchase-steps .num					 						{ width: 72px; height: 72px; line-height: 72px; font-size: 2em; margin-bottom: 10px; background-color: #d9d9da; color:#fff; border-radius: 50%;}
#purchase-steps .label 											{ font-weight: 500; color: #aaa; font-size: 1.1em; letter-spacing: .1em;}
#purchase-steps .sep 					 						{ width: 90px; margin-top: -15px; border-top: 1px solid #ccc; }
#purchase-steps .step.active .num 		 						{ background-color: #b3bce7;}
#purchase-steps .step.active .label 	 						{ color: #6f7696;}

#purchase-contracts li 					   						{ margin: 10px 0; line-height: 1.33em;}
#purchase-contracts a 					   						{ text-decoration: underline;}
#purchase-contracts input[type="checkbox"] 						{ margin-top: 3px; margin-right: 10px; flex-grow: 0; flex-shrink: 0;}
#purchase-contracts .submit-wrapper 	   						{ margin-top: 30px;}
#purchase-contracts .error 										{ text-align: center; margin-top: 20px;}

#agreement-content 												{ z-index: 9999; position: fixed; left: 0; top: 0; right: 0; bottom:0; background-color: rgba(0,0,0,.5);}
#agreement-dialog												{ width: 92vw; max-width: 900px; max-height: 92vh;  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); background-color: #fff; }
#agreement-dialog .header 										{ height: 50px; flex-shrink: 0; position: relative;}
#agreement-dialog .footer 										{ padding: 20px 0 10px ;}
#agreement-dialog .footer p 									{ margin-bottom: 15px; color: #e36e6e;}
#agreement-dialog .footer .button 								{ margin-bottom: 10px; background-color: #e36e6e; font-weight: 600;}
#agreement-dialog .footer .button:hover 						{ background-color: #d25353;}
#agreement-dialog .body											{ padding: 30px; flex-grow: 1; overflow-y: auto; border-top:1px solid #ccc; border-bottom: 1px solid #ccc;}
#agreement-dialog .close 										{ position: absolute; right: 20px; top: 50%; transform: translateY(-50%); }
#agreement-dialog .body::-webkit-scrollbar 						{ width: 5px; height: 5px; }
#agreement-dialog .body::-webkit-scrollbar-track 				{ background: #fff; }
#agreement-dialog .body::-webkit-scrollbar-thumb 				{ background: #6f7696; border-radius: 5px; min-height: 80px; }
#agreement-dialog .body::-webkit-scrollbar-thumb:hover 			{ background: #6f7696; }

#purchase-plan .form-header 									{ margin-bottom: 30px;}
#purchase-plan .form-header h2 									{ margin-bottom: 0;}
#purchase-plan .links 											{ margin-left: 25px;}
#purchase-plan .links a 										{ margin-right: 2px; font-size: 13px; color: #fff; background-color: #0d3b51; transition: opacity .2s; }
#purchase-plan .links a:hover 									{ opacity: .7;}
#purchase-plan .tabs 											{ margin: 30px 0; display: flex;}
#purchase-plan .tab 											{ margin-right: 8px; padding: .5em 1em .6em 1em; font-size: 1.2em;  border: 2px solid var(--theme-color); background: #fff; border-radius: 6px; color: var(--theme-color); cursor: pointer; transition: all .2s;}
#purchase-plan .tab:hover 										{ opacity: .7;}
#purchase-plan .tab.active 										{ background-color: var(--theme-color); color: #fff;}
#purchase-plan .extra-options									{ margin-left: 25px;}
#purchase-plan .extra-options label 							{ margin-right: 30px; margin-bottom: 10px;}
#purchase-plan .extra-options .error 							{ width: 100%;}
#purchase-plan #spreadsheet 									{ margin-top: 20px;}
#purchase-plan #spreadsheet .item-name::before 					{ content: ''; content: '\f058'; font-family: "Font Awesome 5 Pro"; font-weight: 900; font-size: 1em; margin-right: .8em; color: var(--theme-color);}
#purchase-plan #spreadsheet .item-amount 						{ text-align: right;}
#purchase-plan #spreadsheet td,
#purchase-plan #spreadsheet th 									{ padding-left: 15px; padding-right: 15px;}
#purchase-plan #spreadsheet #spreadsheet-total					{ padding-left: 42px;}
#purchase-plan [name="company_account"] + .error 				{ margin-top: 0;}
#purchase-plan .submit-wrapper									{ margin-top: 30px;}
#purchase-plan .round-text										{ color: #01c300; font-size: 1.1em; font-weight: bold; margin: 0 5px; transform: translateY(.2em);}
#purchase-plan .yearly-field									{ display: none;}
#purchase-plan.yearly .yearly-field								{ display: flex;}
#purchase-plan.yearly .monthly-field							{ display: none;}
#purchase-plan .option-icon 									{ height: 27px;}

#purchase-profile fieldset 										{ margin-top: 30px;}
#purchase-profile fieldset:first-child							{ margin-top: 0;}
#purchase-profile .field-label 									{ font-size: 1em; display: inline-block; background-color: #0d3b51; color: #fff; margin-bottom: 30px; padding: .5em 1em .6em 1em; border-radius: 4px;}
#purchase-profile .field-label.collaspe 						{ margin-bottom: 0 !important;}
#purchase-profile label 										{ white-space: nowrap;}
#purchase-profile .attach-to-company-account-label				{ margin-top: 20px;}
#purchase-profile .store-set									{ border-bottom: 1px solid #ccc; padding-bottom: 15px; margin-bottom: 30px;}
#purchase-profile .store-set:last-child							{ margin-bottom: 10px; }
#purchase-profile .invoice-personal-col,
#purchase-profile .invoice-personal-col							{ width: auto; flex-grow: 1;}
#purchase-profile .invoice-personal-col span 					{ display: inline-block; margin-right: 10px; white-space: nowrap;}
#purchase-profile .invoice-personal-col .error 					{ margin-top: 0; }
#purchase-profile .same-data-col .label 						{ margin-bottom: 13px; visibility: hidden;}
#purchase-profile .same-data-col span.text						{ color: #888; font-size: 14px; cursor: pointer; }
#purchase-profile .same-data-col span.text:hover 				{ color: #666;}
#purchase-profile .same-data-col span.button 					{ display: inline-block; width: 36px; height: 36px; line-height: 36px; margin-right: 6px; padding: 0; background-color: #0d3b51; color: #fff;}
#purchase-profile .same-data-col span.button i 					{ margin: 0;}
#purchase-profile .canvas-label 								{ display: inline-block; background-color: #0d3b51; color: #fff; font-size: .95em; padding: .5em .9em; border-radius: 5px 5px 0 0;}
#purchase-profile .canvas-frame  								{ border: 2px solid #0d3b51; border-radius: 0 5px 5px 5px; padding-top: 68%; position: relative; }
#purchase-profile .canvas-frame .js-signature					{ position: absolute; left: 0; top: 0; right: 0; bottom:0;}
#purchase-profile .canvas-frame canvas 							{ border: none !important; outline: none !important;}
#purchase-profile .canvas-clear									{ display: none; position: absolute; right: 10px; top: 10px; width: 24px; height: 24px; line-height: 21px; text-align: center; border-radius: 4px; background-color: #0d3b51; color: #fff; cursor: pointer;}
#purchase-profile .canvas-clear i 								{ font-size: 13px;}
#purchase-profile .canvas-preview 								{ display: none; position: absolute; left: 0; top: 0; right: 0; bottom:0;}
#purchase-profile .canvas-preview img 							{ position: absolute; left: 0; top: 0; right: 0; bottom: 0; width: auto; height: auto; max-width: 100%; max-height: 100%; margin: auto;}
#purchase-profile .canvas-frame.has-content .canvas-clear,
#purchase-profile .canvas-frame.has-draw .canvas-clear,	
#purchase-profile .canvas-frame.has-content .canvas-preview		{ display: block;}
#purchase-profile .canvas-frame.has-content	.js-signature,
#purchase-profile .canvas-frame.has-content	#stamp-uploader,
#purchase-profile .canvas-frame.has-content	#stamp-button		{ display: none;}
#purchase-profile .submit-wrapper 	   							{ margin: 20px 0;}
#purchase-profile  .radio-options 								{ gap: 25px; margin: 10px 0 0 25px;}
#purchase-profile  .radio-options + .error 						{ margin-left: 30px;}
#purchase-profile #source-fieldset input:disabled + * 			{ opacity: .33;}

#purchase-profile #stamp-uploader								{ position: absolute; left: 0; top: 0; right: 0; bottom:0; overflow-y: auto; }
#purchase-profile #stamp-uploader::-webkit-scrollbar 			{ width: 5px; height: 5px; }
#purchase-profile #stamp-uploader::-webkit-scrollbar-track 		{ background: #dfe1e7; }
#purchase-profile #stamp-uploader::-webkit-scrollbar-thumb 		{ background: #6f7696; border-radius: 5px; min-height: 80px; }
#purchase-profile #stamp-uploader::-webkit-scrollbar-thumb:hover{ background: #6f7696; }
#purchase-profile #stamp-uploader .dz-preview					{ display: flex; align-items: center; justify-content: space-between; padding: 10px; border-bottom: 1px solid #ddd; position: relative;}
#purchase-profile #stamp-uploader .dz-progress					{ position: absolute; left: 0; bottom:0; right: 0; }
#purchase-profile #stamp-uploader .dz-upload					{ display: block; height: 1px; background-color: #0d3b51;}
#purchase-profile #stamp-uploader .dz-size 						{ color: #666; font-size: 13px; margin-top: 5px;}
#purchase-profile #stamp-uploader .dz-success .dz-success-mark,
#purchase-profile #stamp-uploader .dz-error .dz-error-mark 		{ display: block;}
#purchase-profile #stamp-uploader .dz-success-mark,
#purchase-profile #stamp-uploader .dz-error-mark 				{ display: none; margin-right: 10px; }
#purchase-profile #stamp-uploader .dz-error-mark				{ color: #c00; }
#purchase-profile #stamp-uploader .dz-error-message				{ color: #c00; font-size: 13px; margin-top: 5px;}
#purchase-profile #stamp-uploader .dz-remove 					{ margin-right: 4px; margin-left: auto; color: #ccc; cursor: pointer;}
#purchase-profile #stamp-uploader .dz-remove:hover 				{ color: #6f7696; }
#purchase-profile #stamp-button									{ position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); pointer-events: none; background-color: #0d3b51; color: #fff; font-size: 14px;}
#purchase-profile #stamp-button i 								{ margin: 0 2px 0 0;}
#purchase-profile #stamp-link 									{ display: none; color: #0d3b51; padding:15px 10px; pointer-events: none;}
#purchase-profile #stamp-link i 								{ margin: 0 2px 0 2px;}

#purchase-complete .bank-account								{ margin: 30px 0; align-items: stretch; border-radius: 10px; border: 1px solid #ddd; overflow: hidden; text-align: left;}
#purchase-complete .bank-account.hidden 						{ display: none;}
#purchase-complete .bank-account-label							{ padding: 15px 20px; width: 20%; min-width: 140px; background-color: #e6e9f7;}
#purchase-complete .bank-account-label p 						{ margin: auto 0; font-weight: 500;}
#purchase-complete .bank-account-data							{ padding: 15px 20px; flex-grow: 1;}
#purchase-complete .bank-account-data p 						{ margin: 8px 0;}
#purchase-complete .bank-account-data strong					{ margin-right: 10px;}
#purchase-complete .bank-account-data em						{ font-style: normal; color: #d25353;}

.purchase-result												{ padding-bottom: 80px;}
.purchase-result svg 											{ width: 120px; height: 120px; margin: 40px 0;}
.purchase-result p 												{ margin: 15px auto; max-width: 350px; color: #555; font-size: 1.1em; line-height: 1.6em;}
.purchase-result .back 											{ margin-top: 40px; color: #888; font-size: 1em; }
.purchase-result .back a 										{ border-bottom: 1px solid #888;}
.purchase-result .back a:hover 									{ border-bottom: 1px solid #0d3b51; color: #0d3b51;}
#purchase-failed svg 											{ width: 110px; height: 110px; margin: 40px 0;}