.mobile_pane_slider {  }

@media (min-width:768px)
and (orientation : landscape) {
	.mobile_pane {
		font-size:1.2em;
	}
}

.mobile_pane button.app_topbar {
	border-radius: 0;
	margin-top: 0;
	border-left: 0;
	border-right: 0;
	display: block;
	padding: 0
}

.mobile_pane form[name=edit_account_info]>div:first-child {
	position: absolute;
	top: 0;
	bottom: 4em;
	left:0;
	right:0;
	overflow-y: auto;
}

.mobile_pane form[name=edit_account_info]>div:first-child>table {
	width: 80%;
	margin: auto;
}

.mobile_pane form[name=edit_account_info]>div:last-child>button {
	height: 100%;
	width: 100%;
	position: absolute;
	margin: 0;
	border-right: 0;
	border-radius: 0;
}

.mobile_pane .partial_pane_content form[name=require_password] {
	display:block;
	height:30%;
	position:relative;
}

.mobile_pane .partial_pane_content form {
	display: block;
	margin: auto;
	position: relative;
	width: 80%;
}

.mobile_pane .standard_pane.full_width_form, .mobile_pane .standard_pane .full_width_form {
	/*font-size:1.2em;*/
}

.mobile_pane .standard_pane {
	height:100%;
}

.mobile_pane .standard_pane_content {
	position: absolute;
	top: 0;
	bottom: 0em;
	left:0;
	right:0;
	overflow-y: auto;
	overflow:hidden;
	overflow-y:auto;
	overflow-scrolling: touch;
	-webkit-overflow-scrolling: touch;
	-moz-overflow-scrolling: touch;
	-o-overflow-scrolling: touch;
	-webkit-transform: translateZ(0px);
	transform: translateZ(0px);
}

.mobile_pane .standard_pane.full_width_form .standard_pane_content,
.mobile_pane .standard_pane .full_width_form .standard_pane_content,
.mobile_pane .standard_pane  .standard_pane_content .full_width_form,
.mobile_pane .standard_pane.standard_pane_content .full_width_form {
	padding-left: 10%;
	padding-right: 10%;
}

.mobile_pane .full_width_form .app_topbar {
	margin-left: -11.1111%;
	margin-right: -11.1111%;
	width: 122.2222%;
}

.mobile_pane .standard_pane_content:not(:last-child) {
	bottom:3.8em;
}

.mobile_pane .standard_pane_footer {
	position: absolute;
	font-size:1.2em;
	min-height:2em;
	bottom: 0em;
	left: 0em;
	right: 0em;
	box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.3);
	background: -moz-linear-gradient(center top , #efefef, #d5d5d5);
	background: -webkit-gradient(linear, left top, left bottom, from(#efefef), to(#d5d5d5));
}

.mobile_pane .standard_pane_footer>button,.mobile_pane  .standard_pane_footer *:not(.confirm_row) button {
	height: 2em;
	margin: .5em;
}

.mobile_pane .standard_pane_footer>button:first-child+button:last-of-type {
	float: right;
}

.mobile_pane .standard_pane_footer .confirm_row button {
	margin: 0;
}

.mobile_pane .standard_pane_footer button {
	-webkit-border-radius: 0.2em;
	-moz-border-radius: 0.2em;
	border-radius: 0.2em;
}

.mobile_pane .standard_pane .section>h1 {
	font-size:.9em;
}

.mobile_pane form.standard_pane {
	display: block;
	margin-top:-1px;
}

.mobile_pane .content_item_row,.mobile_pane  button.content_item_row {
	border-bottom: 1px solid #cccccc;
}


.mobile_pane .app_topbar, .mobile_pane .bar {
	height:3em;
	z-index:0;
	/*border-top: 1px solid #7e7e7e;*/
	border-top: 0px;
}

.mobile_pane .app_topbar + .content {
	top: 3em;
	overflow:hidden
}

.mobile_pane .app_bottombar {
	position:absolute;
	bottom:0;
	width: 100%;
	height:2em;
	-webkit-box-shadow: 0px -2px 10px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0px -2px 10px rgba(0, 0, 0, 0.3);
	box-shadow: 0px -2px 10px rgba(0, 0, 0, 0.3);
	color: #222222;
	border-radius: 0;
	border-left:0;
	border-right:0;
	font-size:2em;
}


@media (min-width:768px) {
	.mobile_pane .app_topbar, .mobile_pane .bar {
		height:4em;
	}
	.mobile_pane .app_topbar + .content {
		top: 4em;
	}
}

@media (max-width:768px) {

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

	.header .logo, .logo {
		background-image: url(graphics/placepay-logo-with-tagline-white.svg);
		background-size: auto 80%;
	}

	.header .logo {
		width: 100%;
		margin: 0;
		background-position: center center;
		display: block;
		position: relative;
	}

	.show_if_mobile {
		display: block;
	}

	.hide_if_mobile {
		display: none !important;
	}

	.header_container {
		height:2.5em;
		z-index: 12;
	}

	.header_height {
		height:2.5em;
	}

	.header {
		background-size: 12em;
		background-position: 0.5em center;
	}

	.content_container {
		z-index: 12;
		overflow: visible;
		top:2.5em;
		margin-top: 2px;
	}

	#header_help_btn {
		display:none;
	}

	#header_user_dropdown {
		display:none;
	}

	/*
	#header_user_dropdown > div {
		margin-left: 0;
	}*/

	.app_user_dropdown_container {
		width:270px;
	}

	.app_user_dropdown {
		width:250px;
	}

	.jtk_window_blocker {
		top: 0em !important;
	}


	.app_topbar.paid {
		background: -webkit-gradient(linear, left top, left bottom, from(#c3f464), to(#8ebf30));
		background: -moz-linear-gradient(top, #c3f464, #8ebf30);
		background: -ms-linear-gradient(top, #c3f464, #8ebf30);
		background: linear-gradient(top, #c3f464, #8ebf30);
		color: #658f22 !important;
	}

	.app_topbar.paid .light {
		color: #658f22;
	}

	.app_topbar button:active {
		background: rgba( 0, 0, 0, .1 );
	}



	.jtk_scroll_bar {
		width: 1em !important;
		-webkit-border-top-left-radius: 0.5em;
		-moz-border-radius-topleft: 0.5em;
		border-top-left-radius: 0.5em;
		-webkit-border-bottom-left-radius: 0.5em;
		-moz-border-radius-bottomleft: 0.5em;
		border-bottom-left-radius: 0.5em;
		-webkit-box-shadow: -0.1em 0px 0.5em rgba(0, 0, 0, 0.8);
		-moz-box-shadow: -0.1em 0px 0.5em rgba(0, 0, 0, 0.8);
		box-shadow: -0.1em 0px 0.5em rgba(0, 0, 0, 0.8);
	}

	.JTK-Form-submit-button-loader {
		background-size: 1em !important;
	}

	.jtk_calendar th {
		font-size: 1em;
	}

	.jtk_calendar td.day {
		height: 1.8em;
	}

	.table_rows_spaced tr td {
		padding: 0.5em 0
	}

	.rounded_corners {
		-webkit-border-radius: 0.2em;
		-moz-border-radius: 0.2em;
		border-radius: 0.2em;
	}

	#header_user_dropdown button {
		padding: 0 0.3em !important;
	}

	.mobile_landing_gradient_bg {
		background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#d5d5d5));
		background: -moz-linear-gradient( top, #ffffff, #d5d5d5 );
		background: -ms-linear-gradient(top, #ffffff, #d5d5d5);
		background: linear-gradient(top, #ffffff, #d5d5d5);
	}

	.page_body {
		top: -2.5em;
		margin-top: -2px;
	}

	.page_section {
		background: white;
		margin: 5% auto;
		width: 90%;
		position: relative;
	}

	.howitworks {
		width: auto;
	}

	.howitworks_image {
		margin: 0;
	}

	.howitworks_image img {
		width: 100%;
		height: auto;
		margin: auto;
		border-radius: 0;
	}

	#rentshare_extra_tools {
		bottom: 0 !important;
		left: 0 !important;
		font-size: .6em !important;
	}

	input, .input_wrapper, button, .button, textarea {
		/*padding: 4px 10px;*/
		padding: .2em 0.5em;
	}

	input {
		padding: 0.25em 0.5em 0.2em;
	}

	input[type="number"]::-webkit-outer-spin-button { display: none; }

	#mobile_splash_screen {
		z-index: 1000;
		background-image: url(graphics/placepay-logo-only.png),
		  -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#d5d5d5));
		background-image: url(graphics/placepay-logo-only.png),
		  -moz-linear-gradient( top, #ffffff, #d5d5d5 );
		background-image: url(graphics/placepay-logo-only.png),
		  linear-gradient(top, #ffffff, #d5d5d5);
		background-position: center 40%;
		background-repeat: no-repeat;
		text-align: center;
		padding-top: 100%;
		font-size:1.5em;
		font-weight:bold;
		color: #666666;
		transition: opacity 0.2s linear 0s;
	}

	.jtk_window {
		margin-left: 5%;
		margin-right: 5% !important;
		right: auto !important;
		top: 5% !important;
		width: 90% !important;
		z-index: 12 !important;
	}

	.jtk_window .top_bar .bar_inner {
		padding: 0.2em 0 !important;
	}

	.jtk_window_header, .jtk_window .top_bar h1 {
		font-size: 1.5em;
		color: #39424B;
	}

	/*.jtk_info_message_container {
		top:-2.5em;
	}*/

	.jtk_info_message {
		display: block;
		margin: 30% auto;
	}

	.tooltip_win {
		max-width: 80% !important;
	}

	.add_roommate {
		font-size:1.3em;
	}

	.notification_icon {
		display: none;
	}

	.notification_description {
		padding-left: 1em;
	}

	.notification_item .close_btn {
	/*	margin-right: 1em;*/
		top: .3em;
	}

	.terms_and_policies ol,
	.terms_and_policies ul {
		padding-left:1em;
	}

	/*.app_bottombar.invoice_pay_btn[disabled]:before {
		font-family: fontello;
		content: '\e80d';
	}*/

	.app_bottombar.invoice_pay_btn[disabled] {
		border:0;
		color: #84ba27;
		/*
		text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.4);
		background: #;
		color: white;
		*/
	}

	.uv-popover {
		left: 0 !important;
		right: 0 !important;
		top: 0 !important;
		height: 100%;
		width: 100%;
		background: rgba(0, 0, 0, 0.4);
	}

	.uv-popover-content {
		margin: auto;
		width: 90% !important;
		height: 80% !important;
		margin-top: 10%;
		position: relative;
	}

	.uv-popover-tail {
		display: none;
	}

	#user_voice_button {
		display: none;
	}


	.terms_and_policies {
		font-size: 1em;
	}

	.header .logo {
		transition: background-position 0.3s ease-in-out;
		-webkit-transition: background-position 0.3s ease-in-out;
		-moz-transition: background-position 0.3s ease-in-out;
	}

	.header .logo .back {
		transition: left 0.3s ease-in-out;
		-webkit-transition: left 0.3s ease-in-out;
		-moz-transition: left 0.3s ease-in-out;
		position: absolute;
		left: .4em;
		width: 1em;
		color: #888888;
		height: 100%;
		top: 0
	}

	.header .logo .back button {
		padding: .1em;
		font-size: 1.2em
	}

	.slidemenu_option {
		width: 100%;
		border-color:#cccccc  !important;
		border-bottom: 0px solid transparent !important;
		height: 3em;
		font-size: 1.2em;
		position: relative;
		margin-bottom:1px;
		padding:.5em;
		display:block;
		height:auto;
		background:#eeeeee;
		font-weight:normal;
		border-right:0;
		border-left:0;
	}


	.jtk_list_add_button .button_container .icon-down-open {
		display: none;
	}



	.switch {
		background: transparent none repeat scroll 0 0;
		border: 2px solid #e5e5e5;
		border-radius: 3px;
		display: inline-block;
		position: relative;
		width: 90%;
		margin-left: 5%;
	}
	.switch-label {
		color: black;
		cursor: pointer;
		float: left;
		padding: 13px 0;
		position: relative;
		text-align: center;
		width: 50%;
		z-index: 2;
	}
	.switch-label:active {
		font-weight: bold;
	}
	.switch-input {
		display: none;
	}
	.switch-input:checked + .switch-label {
		color: white;
		font-weight: bold;
		transition: all 0.15s ease-out 0s;
	}
	.switch-input:checked + .switch-label-on ~ .switch-selection {
		left: 50%;
	}
	.switch-selection {
		background: #8bc640 none repeat scroll 0 0;
		border-radius: 3px;
		bottom: -3px;
		display: block;
		left: 0;
		position: absolute;
		top: -3px;
		transition: left 0.15s ease-out 0s;
		width: 50%;
		z-index: 1;
	}
	#signup {
		text-align: center;
	}
	#signup .switch {
		width: 200px;
	}

	*[style*="translateZ"] { /*Fix for webkit*/
		display: block;
	}

	select {
		font-size:1em;
	}

	.pay_invoice .autopay_footer {
		line-height: .9em;
	}

	.pay_invoice .autopay_footer>div {
		 font-size:.7em;
		 padding: .1em;
	}
}

/*@media handheld and (max-width : 1080px) and (-webkit-min-device-pixel-ratio : 1.5),
screen and (max-width : 1080px) and (-webkit-min-device-pixel-ratio : 1.5)
{
	html, body {
		font-size:52px;
	}

	.tooltip_win {
		font-size:52px;
	}
}

@media handheld and (max-width : 960px) and (-webkit-min-device-pixel-ratio : 1.5),
screen and (max-width : 960px) and (-webkit-min-device-pixel-ratio : 1.5)
{
	html, body {
		font-size:48px;
	}

	.tooltip_win {
		font-size:48px;
	}
}*/

@media (max-width:768px)
{
	html, body {
		font-size:36px;
	}

	.tooltip_win {
		font-size:36px;
	}
}

@media only screen
  and (min-device-width: 768px)
  and (max-device-width: 1024px)
  and (orientation: portrait)
  and (-webkit-min-device-pixel-ratio: 1) {

	html, body {
		font-size:24px;
	}

	.tooltip_win {
		font-size:24px;
	}
}

@media (max-width : 720px)
{
	html, body {
		font-size:32px;
	}

	.tooltip_win {
		font-size:32px;
	}
}


@media (max-width : 640px)
{
	html, body {
		font-size:28px;
	}

	.tooltip_win {
		font-size:28px;
	}
}

@media (max-width : 480px)
{
	html, body {
		font-size:24px;
	}

	.tooltip_win {
		font-size:24px;
	}
}

@media (max-width : 420px)
{
	html, body {
		font-size:20px;
	}

	.tooltip_win {
		font-size:20px;
	}
}

@media (max-width : 360px)
{
	html, body {
		font-size:18px;
	}

	.tooltip_win {
		font-size:18px;
	}
}

@media (max-width : 320px)
{
	html, body {
		font-size:16px;
	}

	.tooltip_win {
		font-size:16px;
	}
}
