input[type=text], textarea{
	padding: 8px;
    border-radius: 4px;
    background-color: rgb(200,220,255);
    box-shadow: inset 0 2px 4px rgba(0,0,0,.39), 0 -1px 1px #FFF, 0 1px 0 #FFF;
    border: 1px solid transparent;
    border-top: none;
    border-bottom: 1px solid #DDD;
}

select{
	background-color: rgb(200,220,255);
	padding: 5px;
	border-radius: 5px;
	border-width: 0;
	max-width: 300px;
}

.page .logo_title img{
    width: 180px;
}

.page .page_desc{
	clear:both;
	padding: 0 10px;
}

.splat_info {
	position: relative;
	margin: 0 0 30px;
}

.splat_info > div:last-child > div + div {
	margin-top: 15px;
}

.splat_info > div:first-child{
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: rgba(180,200,220,0.3);
	z-index: -1;
	filter: blur(8px);
}

.contact {
	background-color: rgba(0,0,0,0.1);
	border-radius: 5px;
	box-shadow: 2px 2px 2px rgba(150,150,150,0.5);
	padding: 20px 8%;
	font-size: 15px;
	margin: 0 0 50px;
}
.contact input {
	width: 180px;
}
.contact textarea {
	width: 390px;
	height: 50px;
	padding: 8px;
	margin-top: 10px;
}
.contact .title {
	font-size: 20px;
	font-family: boomer;
	color: #379;
}

.contact > div + div {
	margin-top: 10px;
}
.contact form > div:first-child, .contact form > div:nth-child(2){
	display: inline-block;
}

.contact form > div:last-child {
	margin-top: 10px;
}
.contact .response_received {
	display: none;
}

.contact .response_received > div:first-child{
	padding: 10px;
	background-color: #9ca;
}
.contact .response_received > div:last-child{
	margin-top: 10px;
}

.emph{
	font-weight: bold;
}

.page_desc .core_features{
	margin: 0 4% 50px;
}

.page_desc .core_feature{
	display: inline-block;
}

.page_desc .core_feature + .core_feature{
	margin-left: 20px;
}

.page_desc .core_feature img{
	height: 60px;
	vertical-align:middle;
}
.page_desc .core_feature > div{
	display: inline-block;
	vertical-align: middle;
	font-size: 13px;
	color: rgb(70,70,70);
	margin-left: 10px;
}

.page_desc .disabled{
	display: none;
}


.subtitle{
	font-weight: bold;
	font-size: 18px;
	color: rgb(100,100,100);
	margin-bottom: 30px;
}

.splat_info > div:last-child{
	padding: 20px 4%;
	font-size: 15px;
}

.splat_info a{
	font-weight: bold;
}

.page_index_panel > div{
	border-radius: 8px;
    /* display: table; */
   /* width: 100%; */
}

.page_index_panel > div > div:first-child{
    font-family: boomer;
    font-size: 50px;
    color: rgb(100,150,150);
    opacity: 0.5;
    margin-bottom: 40px;
}

.page_index_panel > div > div + div {
	/* margin-top: 20px; */
    /* display: table-row; */
}

.page_index_panel > div > div {
	display: flex;
}

.page_index_panel > div > div > div {
    flex-grow: 1;
    /* display: inline-block; */
    vertical-align:top;
}

.page_index_panel > div > div > div + div {
    margin-left: 4%;
}

.page_index_panel > div > div:first-child > div:first-child{
    /* width: 30%;  */
}



.inferred_panel .file_viewer, .inferred_panel .layout_viewer, .inserted_panel .file_viewer, .inserted_panel .layout_viewer {
    /* width: 50%; */
	flex-grow: 2;
	max-width: 600px;
	box-shadow: 4px 4px 8px rgb(150,150,150);
	border-top-right-radius: 5px;
	border-top-left-radius: 5px;
}


.step_arrow_right{
    width: 0;
    height: 0;
    border: 0 solid transparent;
    border-bottom-width: 100px;
    border-top-width: 100px;
    border-left: 60px solid black;
}

.twisty{
    /* margin-top: 20px; */
}

.twisty .down{
    background-image: url(/media/2020/02/twisty_down.svg);
}

.twisty .up {
    background-image: url(/media/2020/06/twisty_up.svg);
}

.twisty .down, .twisty .up{
    background-size: 16px;
    width: 16px;
    height: 16px;
    margin-top: 4px;
    vertical-align: middle;
    background-repeat: no-repeat;
    display: inline-block;
    cursor: pointer;
}

.layout_viewer .twisty .down {
    background-image: url(/media/2020/06/twisty-down-black.svg);
}


.layout_viewer .twisty .up {
    background-image: url(/media/2020/06/twisty-up-black.svg);
}

.twisty_contents{
    display: none;
    font-weight: normal;
    background-color: rgba(255,255,255,0.25);
    padding: 10px 5%;
    text-align:left;
	margin: 0px 10px;
}

.twisty_contents > div > div:first-child {
    color: white;
}
.twisty_contents > div > div:last-child {
    margin: 8px 3%;
}

.infer_schema_panel{
	background-color: rgba(255,255,255,0.3);
	padding: 20px 3%;
}

.infer_schema_panel .options{
    /* display: none; */
}

.infer_schema_panel > form > div + div {
    margin-top: 20px;
}

.infer_schema_panel .gen_type{
    margin: 20px;
}

.options_box{
    padding: 20px 2%;
    background-color: rgba(255,255,255,0.5);
    margin-left: 15px;
    padding: 15px;
	margin-bottom: 15px;
	display:table;
}
.options_box > div {
	display: table-row;
}
.options_box > div > div {
	display: table-cell;
	padding-bottom: 8px;
}
.options_box > div > div:last-child{
	padding-left: 8px;
	text-align: right;
}

.progress{
    display:none;
    max-width: 300px;
    /* height: 40px; */
    position: relative;
    margin-top: 25px;
}
.progress > div:first-child {
	display: table;
	width: 100%;
}
.progress > div:first-child > div{
	display: table-row;
}
.progress > div:first-child > div > div{
	display: table-cell;
}

.progress > div:first-child > div > div:last-child{
	vertical-align: top;
	text-align: right;
}

.progress > div:last-child{
    height: 40px;
    position: relative;
    background-color: rgb(200,200,200);
    margin-top: 5px;
}

.progress > div:last-child > div:first-child{
    position: absolute;
    height: 100%;
    background-color: rgb(100,120,140);
}

.progress > div:last-child > div:last-child{
    position: absolute;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    left: 50%;
    top: 50%;
    font-weight:bold;
}

.progress .small_button{
	margin-top: 5px;
}

.button .img{
    display: none;
}

.clear_files{
    margin-left: 10px;
	background-color: #a02020;
}

.clear_files img{
	height: 12px;
}

.file_viewer > div:first-child {
    background-color: rgb(200,200,200);
    font-weight: bold;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
}

.file_viewer .twisty > div:first-child,
.layout_viewer .twisty > div:first-child{
	padding: 15px;
	text-align: left;
}

.file_viewer .twisty td,
.layout_viewer .twisty td{
	font-size: 13px;
	padding: 3px;
}
.file_viewer .twisty td:last-child,
.layout_viewer .twisty td:last-child{
	font-weight: bold;
}

.file_viewer > div:last-child{
    padding: 30px;
    background-color: white;
    max-height: 350px;
    overflow: scroll;
}

.file_viewer_wrap{
	/*box-shadow: 4px 4px 8px rgb(150,150,150);*/
	overflow: auto;
	padding-bottom: 16px;
	padding-right: 16px;
	position: relative;
}

.file_viewer_wrap > img {
	position: absolute;
	left: calc(50% - 64px);
	top: calc(50% - 64px);
	z-index: -1;
}

.tabs {
	padding-right: 23px;
}

.tabs_title{
	background-color: #217346;
	height: 30px;
	font-weight:bold;
	text-align:center;
	padding: 0 8px;
}

.tab{
    position:relative;
    cursor: pointer;
}

.tab.selected{
    z-index: 999;
	cursor: auto;
}

/*.tab > div {
    display: table-row;
}*/

.tab > div > div{
    /* display: table-cell; */
	box-shadow: 2px 2px 4px 0px rgb(100,100,100);
}

.tab > div > div:nth-child(2){
    height: 30px;
    background-color: #217346;
    vertical-align: middle;
    text-align:center;
	margin: 2px 0;
	color: white;
	padding: 6px 8px 2px;
	max-width: 200px;
	overflow: hidden;
	text-overflow: ellipsis;
}

.tab.inactive > div > div:nth-child(2){
	color: black;
	font-weight: bold;
	margin-top: 0;
}

.tab.selected > div > div:nth-child(2) {
    background-color: transparent;
	color: rgb(50,50,50);
	font-weight: bold;
	box-shadow: none;
}


.tab > div > div:first-child{
    width: 0;
    height: 0;
/*    border-style: solid;
    border-width: 0 0 30px 30px;
    border-color: transparent transparent rgb(220,220,220) transparent;*/

}

.tab.selected > div > div:first-child{
    border-color: transparent transparent white transparent;
}

.tab > div > div:last-child{
    position: relative;
/*    width: 30px;
    height: 30px;
    transform: rotate(45deg);
    background-color: white;*/
/*    border-style: solid;
    border-width: 30px 0 0 30px;
    border-color: transparent transparent transparent rgb(220,220,220);*/

}

/*.tab > div > div:last-child::after{
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    border: 10px solid black;
    border-color: transparent transparent #bada55 #bada55;
    box-shadow: 0 3px 3px 0 gray;
}*/



.tab.selected > div > div:last-child{
    border-color: transparent transparent transparent white;
}

.layout_viewer .tabs > div {
	display: table-row;
}

.layout_viewer .tabs {
/*	display: table; */
}

/* .worksheets > div {
	display: table;
} */

.worksheets {
	position: absolute;
	width: 100%;
    overflow-x: auto;
}

.worksheets > table {
	width: 100%;
}

.worksheets > table + table {
	display: none;
}

/*.worksheets > div > div {
	display: table-row;
}*/

.worksheets td {
	height: 25px;
	text-align: center;
	background-color: white;
	padding: 0 10px;
	border: 1px solid rgb(200,200,200);
}

.worksheets td > div {
    height: 25px;
    overflow: auto;
}

.worksheets tr:first-child td{
	background-color: rgb(220,220,220);
	border-top: none;
}

.worksheets td:first-child{
	background-color: rgb(220,220,220);
	border-left: none;
	width: 25px;
}

.layout_viewer {
	background-color: rgb(220,220,220);
}

.layout_viewer .tabs{
	height: 266px;
	overflow-y: auto;
}

.layout_viewer > div:last-child {
/*	display: table;*/
	width: 100%;
}

.layout_viewer > div:first-child {
	padding: 0 0 10px;
	text-align: center;
	color: black;
	background-color: #217346;
	font-weight: bold;
	border-top-right-radius: 5px;
	border-top-left-radius: 5px;
}

.layout_viewer > div:last-child > div {
	white-space: nowrap;
}
.layout_viewer > div:last-child > div > div {
	display: table-cell;
}

.layout_viewer > div:last-child > div > div:last-child {
/*	width: 100%; */
	vertical-align: top;
	position: relative;
	width: 40vw;
}

.file_list tr .download{
	width: 24px;
	opacity: 0.5;
}
.file_list_panel .file_list .total td,
.file_list_panel .file_list .selected_total td{
	text-align:left;
}

.file_list_panel .file_list td.size{
	text-align: right;
}

.file_list tr {
    cursor: pointer;
}
.file_list tr.selected, .file_list tr.total, .file_list tr.selected_total{
    cursor: auto;
}

.file_list .file td:nth-child(2) img {
    width: 32px;
}

.site_menu_wrap{
    float: right;
	margin-bottom: 20px;
}

.user_form {
    background-color: white;
    box-shadow: 2px 2px 4px rgb(150,150,150);
    margin-top: 20px;
    background-image: url(/software/apps/delay-proxy/images/bodybg_trans.png);
    font-size: 14px;
    max-width: 300px;
	display: none;
	border-radius: 8px;
}

.launched .user_form{
	margin-top: 0;
}

/*.register_form, .login_form{
    display: none;
}*/

.user_form input[type=text], .user_form input[type=password]{
    font-size: 14px;
}

.user_form.confirm_email_form, .user_form.unconfirmed_email{
	display: block;
}


.confirm_email_form .resend > span,
.confirm_email_form .resend > img,
.confirm_email_form .resend > a {
	vertical-align: middle;
}

.confirm_email_form img{
	height: 16px;
	display: none;
}

.user_info_panel{
    background-color: rgb(240,240,240);
    padding: 10px 20px;
    color: rgb(100,100,100);
    margin-top: 20px;
    box-shadow: 2px 2px 4px rgb(100,100,100);
    border-radius: 5px;
    width: 320px;
    margin-bottom: 20px;
	background-image: url(/software/apps/delay-proxy/images/bodybg_trans.png);
}


.user_label {
	text-align: left;
}

.user_label img {
    width: 20px;
}

.user_label img, .user_label span{
    vertical-align: middle;
}

.user_label .logout {
    float: right;
	font-size: 12px;
}

.user_info_panel .buy_button > div:first-child{
    background-color: rgb(255,167,0);
    font-size: 14px;
    width: 100%;
    margin: 0;
	text-align: center;
	padding: 8px 0;
	color: white;
	box-shadow: 2px 2px 2px rgb(200,200,200);
	cursor: pointer;
	border-radius: 4px;
}

.user_info_panel .balance{
    margin: 15px;
    text-align: center;
    background-color: white;
    padding: 10px 0;
	box-shadow: inset 2px 2px 4px rgb(200,200,200);
	background-color: rgba(255,255,255,0.5);
}

.user_info_panel .balance span{
	vertical-align: middle;
}

.user_info_panel .balance img{
    margin-left: 20px;
	height: 25px;
	vertical-align: middle;
	margin-top: 3px;
}

.user_info_panel .payment_panel{
    margin-top: 15px;
    display:none;
}

.payment_panel .amount{
    border: 0;
    background-color: white;
    padding: 5px;
    text-align: right;
    color: rgb(100,100,100);
    font-size: 20px;
}

.payment_panel .stripe {
    margin-top: 15px;
	font-weight: normal;
}

.user_info_panel .payment_panel .stripe{
	display: none;
}

.payment_panel .StripeElement{
    background-color: white;
    padding: 5px;
}

.payment_panel .submit_payment{
    width: 100%;
    padding: 10px 0;
    border-radius: 4px;
    margin-top: 15px;
    color: white;
    border:0;
    font-size: 16px;
    font-family: open sans;
}

.payment_panel .submit_payment img{
   height: auto;
}

.user_info_panel .buy_button > div:last-child {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 25px 157px 0 157px;
    border-color: rgb(255,167,0) transparent transparent transparent;
    display:none;
}

.user_info_panel .balance > span:last-child {
    font-size: 25px;
    padding-bottom: 3px;
    font-weight: bold;
    font-family: open sans light;
    color: rgb(200,140,0);
}

.payment_panel .bundle_control{
    display: inline-block;
}

.payment_panel .bundle_control > div:first-child{
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 10px 10px 10px;
    border-color: transparent transparent #305f82 transparent;
}

.payment_panel .bundle_control > div:last-child {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 10px 0 10px;
    border-color: #305f82 transparent transparent transparent;
    margin-top: 4px;
}

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

.payment_panel .bundle_select > div, .payment_panel .bundle_select > input {
    vertical-align: middle;
    display: inline-block;
}

.payment_panel .choose_bundle .dis_button img{
    width: auto;
}

.payment_panel .choose_bundle > div:first-child {
    display: table;
    width: 100%;
}

.payment_panel .choose_bundle > div:first-child > div{
    display:table-row;
}

.payment_panel .choose_bundle > div:first-child > div > div {
    display:table-cell;
}

.payment_panel .choose_bundle .button{
    border-radius: 4px;
    padding: 4px 0;
    width: 100%;
    margin-top: 15px;
}

.payment_panel .confirmation > div > div + div {
    margin-top: 15px;
}

.payment_panel .confirmation > div > div:nth-child(2){
    background-color: rgb(80,80,80);
    color: white;
    padding: 10px;
    text-align: center;
}

.payment_panel .confirmation .total_row{
    display: table;
    width: 100%;
}
.payment_panel .confirmation .total_row > div {
    display: table-row;
}

.payment_panel .confirmation .total_row > div > div {
    display: table-cell;
    vertical-align: middle;
}

.payment_panel .confirmation .total_row > div > div:last-child{
    text-align: right;
    font-size: 20px;
}

.payment_panel .confirmation .total_row > div > div:last-child > span{
    background-color: rgb(200,255,100);
    padding: 5px 10px;
}

.payment_panel .confirmation input[name=name]{
    background-color: white;
    padding: 6px;
    width: calc(100% - 8px);
    border: 0;
    color: rgb(50,50,50);
    font-size: 16px;
    margin-top: 25px;
    font-family: helvetica;
	box-shadow: none;
}

.payment_panel .card_errors{
    margin-top: 5px;
    font-size: 14px;
}

.payment_panel .payment_success, .payment_panel .payment_fail{
    display:none;
}

.payment_panel .payment_success img, .payment_panel .payment_fail img{
    height: 64px;
}

.payment_panel .payment_success > div, .payment_panel .payment_fail > div {
    display:table;
}
.payment_panel .payment_success > div > div, .payment_panel .payment_fail > div > div {
    display: table-row;
}
.payment_panel .payment_success > div > div > div, .payment_panel .payment_fail > div > div > div {
    display: table-cell;
    vertical-align: middle;
}

.payment_panel .payment_success > div > div > div:last-child, .payment_panel .payment_fail > div > div > div:last-child {
    padding-left: 10px;
    font-size: 14px;
}

.icon_message{
    display: table;
	max-width: 400px;
	font-size: 13px;
}
.icon_message > div {
    display: table-row;
}
.icon_message > div > div {
    display: table-cell;
    vertical-align: top;
    padding: 5px;
}

.icon_message img {
    width: 32px;
}

.report .icon_message{
	margin-top: 25px;
}

.footnote{
    font-size: 12px;
}

.invisible{
    display: none;
}

.insert_json_box{
	margin-top: 40px;
	background-color: rgba(255,255,255,0.3);
	padding: 20px 3%;
}

.insert_json{
	margin-top: 20px;
}

.insert_json .json_filename,
.insert_json .filename,
.infer_schema_panel .infer_from,
.sql_format > div:last-child > span {
	background-color: rgb(200,200,200);
	padding: 5px 10px;
	color: black;
}

.insert_json .dis_button{
	background-color: transparent;
}

.insert_json .button{
	margin-top: 10px;
}

.page_index_panel .dis_button{
	background-color: rgba(0,0,0,0.5);
}

.page_index_panel .report .icon_message img{
	width: 24px;
}


.infer_from_panel > div:first-child,
.insert_json > div:first-child {
	display: table;
}

.infer_from_panel > div:first-child > div,
.insert_json > div:first-child > div {
	display: table-row;
}

.infer_from_panel > div:first-child > div > div,
.infer_from_panel > div:first-child > div > span,
.infer_from_panel > div:first-child > div > input,
.insert_json > div:first-child > div > div {
	display: table-cell;
	padding-bottom: 15px;
}

.infer_from_panel > div:first-child > div > div:last-child,
.insert_json > div:first-child > div > div:last-child {
	padding-left: 10px;
}

.file_viewer .tab_row > div {
	display: inline-block;
}

.file_viewer .tab_row > div + div {
	margin-left: 3px;
}

.file_viewer .tab_row {
	background-color: rgb(200,200,200);
	padding-top: 10px;
}

.file_viewer .tab_row .tab > div > div:nth-child(2){
	background-color: rgb(180,180,180);
	color: black;
}

.file_viewer .tab_row .tab.selected > div > div:nth-child(2){
	background-color: transparent;
}

.file_viewer .contents > div + div {
	display: none;
}

.password_strength > div {
    margin-top: 5px;
}

.password_strength > div:first-child, .password_strength > div:last-child > div {
    display:none;
}

.password_strength > div:first-child {
    height: 10px;
    margin-top: 8px;
    border-radius: 5px;
    background-color: rgb(220,220,220);
}

.password_strength > div:first-child > div{
    height: 10px;
    border-radius: 5px;
}

.password_strength .strong > div{
    width: 100%;
    background-color: rgb(50,200,0);
}

.password_strength .medium > div{
    width: 60%;
    background-color: rgb(200,140,0);
}

.password_strength .weak > div{
    width: 20%;
    background-color: rgb(200,50,50);
}

.password_strength > div {
    text-align: left;
    font-size: 12px;
}

.username_check .busy, .email_check .busy{
    display: none;
}

.register_form .icon_message img {
    width: 20px;
}
.register_form .icon_message {
    margin-top: 0;
}

.register_form .confirm_check > div, .reset_password_form .confirm_check > div {
    display: none;
}

.user_form .panel_title{
    font-size: 15px;
}

.forgot_password_form .cancel, .reset_password_form .cancel{
	margin-left: 10px;
}

.reset_password_form .username{
	font-style: italic;
}

.tooltip{
    position: relative;
    font-size: 0;
    margin-left: 50%;
}

.tooltip.align_left{
	margin-left: calc(50% + 10px);
}

.tooltip .icon_message{
    margin-top: 0;
}

.tooltip > div {
    position: absolute;
    text-align: center;
    left: -150px;
    width: 300px;
    z-index: 999;
}

.tooltip.align_left > div{
	left: -300px;
	text-align: right;
}

.tooltip > div > div:first-child{
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid black;
    display: inline-block;
}
.tooltip > div > div:last-child{
    background-color: black;
    color: white;
    padding: 10px;
    font-size: 14px;
    border-radius: 0;
    box-shadow: 2px 2px 4px rgb(80,80,80);
	text-align: center;
}

.tooltip.align_left > div > div:last-child{
	border-top-right-radius: 0;
}


.tooltip .icon_message{
	text-align: left;
	font-weight: normal;
}

.tooltip .go_button{
	background-color: rgb(60,80,100);
	font-weight: normal;
}

.tooltip a{
	color: rgb(100,200,220);
}

a.cancel_link {
	font-size: 10px;
	margin-left: 8px;
	font-weight: normal;
}

.tooltip img {
	height: 32px;
}

.tooltip .payment_panel .StripeElement{
	background-color: rgb(20,20,20);
}

.tooltip .payment_panel .confirmation input[name=name] {
    background-color: rgb(20,20,20);
	color: rgb(200,200,200);
}

.tooltip .payment_panel .confirmation .total_row > div > div:last-child {
	color: rgb(50,50,50);
}

.tooltip .payment_panel .InputElement::placeholder {
	color: rgb(200,200,200);
	opacity: 1;
}

.tooltip .payment_panel .InputElement::-ms-input-placeholder {
	color: rgb(200,200,200);
}

.payment_panel .payment_success img.loading{
	height: auto;
	display: inline;
}

.tooltip .payment_panel .confirmation > div > div:nth-child(2){
	background-color: rgb(40,40,40);
}

.tooltip .dis_button{
	background-color: rgb(40,40,40);
	color: rgb(80,80,80);
}

.or_buy_credit_bundle{
	text-align: left;
	font-size: 12px;
	font-weight: normal;
}

.or_buy_credit_bundle > div {
	margin-top: 15px;
	position:relative;
}

.or_buy_credit_bundle .cancel_link{
	right: 0;
	position: absolute;
	bottom: 0;
}

.page-title {
	float: left;
}

.upload_form .report > div {
	background-color: rgba(255,255,255,0.3);
}

.info_box{
	float: none;
	margin-top: 20px;
}

@media(max-width:1200px){
	.page .logo_title img {
		width: 100px;
	}

	.page .logo_title span {
		font-size: 40px;
	}
}



@media (max-width:1000px){
	.page .logo_title img {
		width: 120px;
	}
	.page .logo_title span{
		font-size: 35px;
	}

	.site_menu input[type=button]{
		font-size: 15px;
		padding: 4px 8px;
		width: 120px;
	}

	.user_info_panel{
		width: 280px;
	}
	.user_info_panel .buy_button > div:last-child{
		border-width: 25px 137px 0 137px;
	}

	.tab > div > div:nth-child(2) {
		max-width: 100px;
	}

/* 	.progress{
		width: 260px;
	} */
}

@media (max-width: 800px){
	.page .logo_title img{
		width: 85px;
	}

	.page .logo_title span{
		font-size: 28px;
	}

	.site_menu input[type=button]{
		font-size: 14px;
		padding: 3px 6px;
		width: 100px;
	}

	.user_info_panel{
		width: 260px;
	}
	.user_info_panel .buy_button > div:last-child{
		border-width: 25px 127px 0 127px;
	}
}


@media (max-width:700px){

	.page_index_panel > div {
		border-radius: 0;
		box-shadow: none;
	}

	.page_index_panel > div > div {
		display: block;
	}
	.page_index_panel > div > div > div + div {
		margin-left: 0;
		margin-top: 20px;
		display:block;
	}

	.file_list_panel {
		display: block;
	}
/*	.infer_schema_panel {
		display: block;
	}*/
	.page{
		width: auto;
	}
	.page-title{
		margin-bottom: 0;
		float: none;
	}
	.logo_title{
		margin-top: 0;
		margin-left: 20px;
	}
	.site_menu {
		margin-top: 0;
	}
	.site_menu_wrap{
		margin-right: 0;
		float: none;
		margin-bottom: 30px;
	}
	.file_viewer_wrap{
		padding-bottom: 0px;
		padding-right: 0px;
	}

	.user_form{
		margin: auto;
	}
	.user_info_panel{
		margin: auto;
		width:auto;
		border-radius: 0px;
		box-shadow: none;
	}

	.layout_viewer > div:last-child > div > div:last-child {
		width: 100%;
	}

	.file_list_panel .filename{
		overflow:hidden;
		text-overflow: ellipsis;
		max-width: 30vw;
	}

	.page .logo_title span{
		font-size: 24px;
	}

	.page .logo_title img{
		width: 70px;
	}

	.user_info_panel .buy_button {
		width: 280px;
		margin: auto;
	}
	.user_info_panel .buy_button > div:last-child{
		border-width: 25px 137px 0 137px;
	}

	.file_list_panel .file_list td, .file_panel .file_list_panel th {
		padding: 2px 2px;
	}

	.page > .contents{
		width: 100vw;
	}

	.tab > div > div:nth-child(2) {
		max-width: 200px;
	}

	.page_desc .core_feature + .core_feature{
		margin: 30px 3%;
	}

	.page_desc .core_feature{
		display: block;
		margin: 30px 3%;
	}
}