body {
	font-family: 'font_normal';
	font-size: 16px;
	margin: 0px;
	padding: 0px;
}

/* inputs */
	.input_common {
		background-color: #ffffff;
		border: 1px solid #cecece;
		border-radius: .25rem;
		color: #000;
		font-family: 'font_normal';
		font-size: 16px;
		padding: 10px;
	}
	.input_common:focus {
		outline: 2px solid #4444FF;
		outline-offset: 2px;
	}
	
/* textareas */
	.textarea_common {
		background-color: #ffffff;
		border: 1px solid #cecece;
		border-radius: .25rem;
		color: #000;
		font-family: 'font_normal';
		font-size: 16px;
		padding: 10px;
		min-height: 48px;
		max-height: 400px;
	}
	.textarea_common:focus {
		outline: 2px solid #4444FF;
		outline-offset: 2px;
	}

/* selects */
	.select_common {
		background-color: #fff;
		background-clip: padding-box;
		border: 1px solid #cecece;
		border-radius: .25rem;
		color: #000;
		cursor: pointer;
		font-family: 'font_normal';
		font-size: 16px;
		padding: 8px;
	}.select_common:focus {
		outline: 2px solid #4444FF;
		outline-offset: 2px;
	}

/* margins */
	.mt0 { margin-top: 0px !important; }
	.mb0 { margin-bottom: 0px !important; }
	.ml0 { margin-left: 0px !important; }
	.mr0 { margin-right: 0px !important; }
	
	.mt2 { margin-top: 2px; }
	.mb2 { margin-bottom: 2px; }
	.ml2 { margin-left: 2px; }
	.mr2 { margin-right: 2px; }
	
	.mt3 { margin-top: 3px; }
	.mb3 { margin-bottom: 3px; }
	.ml3 { margin-left: 3px; }
	.mr3 { margin-right: 3px; }
	
	.mt4 { margin-top: 4px; }
	.mb4 { margin-bottom: 4px; }
	.ml4 { margin-left: 4px; }
	.mr4 { margin-right: 4px; }
	
	.mt4 { margin-top: 4px; }
	.mb4 { margin-bottom: 4px; }
	.ml4 { margin-left: 4px; }
	.mr4 { margin-right: 4px; }
	
	.mt8 { margin-top: 8px; }
	.mb8 { margin-bottom: 8px; }
	.ml8 { margin-left: 8px; }
	.mr8 { margin-right: 8px; }
	
	.mt16 { margin-top: 16px; }
	.mb16 { margin-bottom: 16px; }
	.ml16 { margin-left: 16px; }
	.mr16 { margin-right: 16px; }
	
	.mt32 { margin-top: 32px; }
	.mb32 { margin-bottom: 32px; }
	.ml32 { margin-left: 32px; }
	.mr32 { margin-right: 32px; }
	
	.mt64 { margin-top: 64px; }
	.mb64 { margin-bottom: 64px; }
	.ml64 { margin-left: 64px; }
	.mr64 { margin-right: 64px; }
	
	.mt25 { margin-top: 25px; }
	.mb25 { margin-bottom: 25px; }
	.ml25 { margin-left: 25px; }
	.mr25 { margin-right: 25px; }
	
	.mt50 { margin-top: 50px; }
	.mb50 { margin-bottom: 50px; }
	.ml50 { margin-left: 50px; }
	.mr50 { margin-right: 50px; }
	
	.mt100 { margin-top: 100px; }
	.mb100 { margin-bottom: 100px; }
	.ml100 { margin-left: 100px; }
	.mr100 { margin-right: 100px; }


/* paddings */
	.pt0 { padding-top: 0px !important; }
	.pb0 { padding-bottom: 0px !important; }
	.pl0 { padding-left: 0px !important; }
	.pr0 { padding-right: 0px !important; }
	
	.pt2 { padding-top: 2px; }
	.pb2 { padding-bottom: 2px; }
	.pl2 { padding-left: 2px; }
	.pr2 { padding-right: 2px; }
	
	.pt3 { padding-top: 3px; }
	.pb3 { padding-bottom: 3px; }
	.pl3 { padding-left: 3px; }
	.pr3 { padding-right: 3px; }
	
	.pt4 { padding-top: 4px; }
	.pb4 { padding-bottom: 4px; }
	.pl4 { padding-left: 4px; }
	.pr4 { padding-right: 4px; }
	
	.pt8 { padding-top: 8px; }
	.pb8 { padding-bottom: 8px; }
	.pl8 { padding-left: 8px; }
	.pr8 { padding-right: 8px; }
	
	.pt16 { padding-top: 16px; }
	.pb16 { padding-bottom: 16px; }
	.pl16 { padding-left: 16px; }
	.pr16 { padding-right: 16px; }
	
	.pt32 { padding-top: 32px; }
	.pb32 { padding-bottom: 32px; }
	.pl32 { padding-left: 32px; }
	.pr32 { padding-right: 32px; }
	
	.pt64 { padding-top: 64px; }
	.pb64 { padding-bottom: 64px; }
	.pl64 { padding-left: 64px; }
	.pr64 { padding-right: 64px; }
	
	.pt25 { padding-top: 25px; }
	.pb25 { padding-bottom: 25px; }
	.pl25 { padding-left: 25px; }
	.pr25 { padding-right: 25px; }
	
	.pt50 { padding-top: 50px; }
	.pb50 { padding-bottom: 50px; }
	.pl50 { padding-left: 50px; }
	.pr50 { padding-right: 50px; }
	
	.pt100 { padding-top: 100px; }
	.pb100 { padding-bottom: 100px; }
	.pl100 { padding-left: 100px; }
	.pr100 { padding-right: 100px; }

/* widths */
	.mw400 { max-width: 400px; }
	.mw600 { max-width: 600px; }
	.mw900 { max-width: 900px; }
	.mw1200 { max-width: 1200px; }

/* flex templates */
	.flex_row_cen_cen { display: flex; flex-direction: row; justify-content: center; align-items: center; }
	.flex_row_sta_cen { display: flex; flex-direction: row; justify-content: flex-start; align-items: center; }
	.flex_row_sbe_cen { display: flex; flex-direction: row; justify-content: space-between; align-items: center; }
	.flex_row_cen_sta { display: flex; flex-direction: row; justify-content: center; align-items: flex-start; }
	.flex_row_sta_sta { display: flex; flex-direction: row; justify-content: flex-start; align-items: flex-start; }
	.flex_row_sta_str { display: flex; flex-direction: row; justify-content: flex-start; align-items: stretch; }
	
	.flex_col_sta_cen { display: flex; flex-direction: column; justify-content: flex-start; align-items: center; }
	.flex_col_cen_cen { display: flex; flex-direction: column; justify-content: center; align-items: center; }
	.flex_col_cen_sta { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; }
	
	.flex_wrap { flex-wrap: wrap; }

/* flex&margins templates */
	.flex_row_margins_32 div { margin-right: 32px; }

/* links */
	.link {
		color: #4b37e1;
		font-family: 'font_normal';
	}
	.link:hover { filter: brightness(1.2); }
	.link:active { filter: brightness(0.9); }
	
	.link_custom {
		border-bottom: 2px solid;
		border-bottom-color: rgba(75, 55, 225, 0.4);
		color: #4b37e1;
		font-family: 'font_semibold';
		text-decoration: none;
	}
	.link_custom:hover { filter: brightness(1.2); }
	.link_custom:active { filter: brightness(0.9); }
	
	.link_header {
		color: #eee;
		font-family: 'font_semibold';
		font-size: 1.1em;
		text-decoration: none;
	}
	.link_header:hover {
		filter: brightness(1.2);
	}

/* common table style */
	.table_common tr th {
		color: #646464;
		font-size: 0.9em;
		padding: 10px;
		text-align: left;
	}
	
	.table_common tr td {
		padding: 10px;
		text-align: left;
	}
	
	.table_common, .table_common tr, .table_common td, .table_common th {
		border: 1px solid #cecece;
		border-collapse: collapse;
	}
	
	.table_common tr:hover {
		background-color: #fafafa;
	}
	
	.td_cen {
		text-align: center !important;
		vertical-align: middle !important;
	}

/* texts */
	h1 {
		font-family: 'font_bold';
		font-weight: normal;
		margin-top: 0px;
		padding-top: 0px;
	}
	
	h2 {
		font-family: 'font_semibold';
		font-weight: normal;
		margin-top: 50px;
		padding-top: 0px;
	}
	
	h3 {
		font-family: 'font_semibold';
		font-weight: normal;
		margin-top: 25px;
		padding-top: 0px;
	}
	
	p {
		margin-top: 0px;
		padding-top: 0px;
		line-height: 1.5;
	}
	
	.text_story {
		font-size: 1.1em;
		max-width: 900px;
	}
	
	.text_guide {
		font-size: 1.1em;
	}

/* header */
	#header {
		width: 100%;
		height: 50px;
		background-color: #000;
		color: #fff;
		position: fixed;
		z-index: 100;
		top: 0px;
		left: 0px;
		right: 0px;
	}
	
	.div_header {
		margin-right: 32px;
		padding: 0px 0px 2px 16px;
	}

/* different */
	#tooltip {
		background: rgba(255, 255, 255, 0.95);
		border: 1px solid #cacaca;
		border-radius: 2px;
		color: #444;
		display: none;
		font-family: 'font_light';
		font-size: 0.9em;
		line-height: 16px;
		padding: 5px;
		position: absolute;
		text-align: center;
		z-index: 50;
	}
	
	.img_screenshot {
		border: 1px #777 solid;
	}

/* lists */
	ul {
		margin: 0px;
	}
	
	ul li {
		font-size: 1.1em;
		line-height: 1.5;
		padding: 4px 0px 4px 0px;
	}
	
	ol {
		margin: 0px;
	}
	
	ol li {
		font-size: 1.1em;
		line-height: 1.5;
		padding: 4px 0px 4px 0px;
	}
	
	dl {
		margin: 0px;
	}
	
	dl li {
		font-size: 1.1em;
		line-height: 1.5;
	}

/* common button */
	.btn_common {
		background-color: #5f4ee4;
		border: none;
		color: #fff;
		cursor: pointer;
		border-radius: 8px;
		font-family: "font_semibold";
		font-size: 1em;
		padding: 9px 12px 9px 12px;
	}
	.btn_common:hover { filter: brightness(0.94); }
	.btn_common:active { filter: brightness(1.1); }
	.btn_common:focus {
		outline: 3px solid #4444FF;
		outline-offset: 2px;
	}

/* horizontal switcher */
	.btn_switcher_horiz_link {
		font-family: 'font_semibold';
		font-size: 0.8em;
		text-decoration: none;
	}
	
	.btn_switcher_horiz_link:active {
		color: yellow;
	}
	
	.btn_switcher_horiz_1 .btn_switcher_horiz_link {
		color: #fff !important;
	}
	
	.btn_switcher_horiz_0 .btn_switcher_horiz_link {
		color: #2c1bb1 !important;
	}
	
	.btn_switcher_horiz {
		border: 1px solid #2c1bb1;
		display: inline-block;
		font-family: 'font_semibold';
		font-size: 1.1em;
		padding: 6px 14px 8px 14px;
		text-align: center;
		-moz-transition: all 300ms ease-out;
		-o-transition: all 300ms ease-out;
		-webkit-transition: all 300ms ease-out;
	}.btn_switcher_horiz:hover {
		filter: brightness(1.2);
	}
	
	.btn_switcher_horiz_0 {
		background-color: #fff;
		color: #2c1bb1;
		cursor: pointer;
	}
	
	.btn_switcher_horiz_1 {
		background-color: #2c1bb1;
		color: #fff;
		cursor: pointer;
	}
	
	.btn_switcher_horiz_left {
		border-radius: 16px 0px 0px 16px;
	}
	
	.btn_switcher_horiz_right {
		border-radius: 0px 16px 16px 0px;
	}
	
	.btn_switcher_horiz_no_r_b {
		border-right: 0px;
	}
	
	.btn_switcher_horiz_small {
		font-size: 0.8em !important;
		padding: 2px 8px 3px 8px !important;
	}