/**
 * responsive CSS for MarioNipples.com
 * breakpoints for mobile phone and tablet
 */

/**
 * phone/tablet portrait
 * alternate mobile navigation, columns stack
 */
 
@media only screen and (max-width: 890px) {
	
	.site-width {
		width:calc(100% - 20px);
		padding-left:10px;
		padding-right:10px;
	}
	
	h2 {
		line-height: 30px;
	}
	
	article h2.entry-title {
		padding-bottom: 0px;
		margin-bottom: 6px;
	}
	
	.ptr--ptr {
		margin-top:74px !important;
		margin-bottom:-74px !important;
		background:#43B047 !important;
	}
	.ptr--ptr * {
		color:#fff !important;
	}
	
	/**
	 * primary header / navigation
	 */
	header.site-header {
		min-height: 70px;
	}
	header.site-header .site-logo {
		min-height:48px;
	}
	header.site-header .site-logo img {
		max-height:38px;	
	}
	header.site-header .mario-1 {
		display: none !important;
	}
	header.site-header nav.main-navigation {
		display: none !important;
	}
	header.site-header .site-logo img {
		width: auto;
		height: 100%;
		max-height: 50px;
		margin-top: 4px;
		margin-bottom: -4px;
	}
	header.site-header .col.span_4_of_12 {
		width: calc(100% - 80px);
	}
	header.site-header .col.span_6_of_12 {
		width: 80px;
		text-align: right;
	}
	header.site-header .hamburger {
		display: inline-block;
		width: 62px;
	}
	header.site-header .hamburger .fa {
		display: inline-block;
		color: #214187;
		font-size: 40px;
		width: 70px;
		text-align:center;
		padding: 8px 0px;
	
		-webkit-transition: color 160ms ease-out;
		-moz-transition: color 160ms ease-out;
		-o-transition: color 160ms ease-out;
		transition: color 160ms ease-out;
	}
	header.site-header .hamburger .fa:hover {
		cursor: pointer;	
		color: #fff;
	}
	header.site-header .mobile-navigation {
		display: none;
		position: absolute;
		top: 69px;
		left: 0px;
		width: 100%;
		margin: 0px;
		padding: 0px 0px 16px 0px;
		width:100%;
		background-color: rgba(3,138,206,0.95);
		background-position: right center;
		background-repeat: no-repeat;
		-webkit-backdrop-filter:blur(3px);
		background-size:180px 180px;
		box-shadow: 0px 4px rgba(0,0,0,0.1);
	}
	header.site-header nav .primary-menu {
		
	}
	header.site-header nav .primary-menu li {
		display: block;
		margin: 0px;
		padding: 0px 18px;
	}
	header.site-header nav .primary-menu li a {
		display: block;
		margin: 8px 4px;
		max-width: 180px;
	}
	
	/**
	 * main content
	 */
	.site-content {
		margin-top: 80px;
	}
	h2.entry-title {
		font-size:28px;
		line-height:32px;
	}
	
	/**
	 * primary footer / navigation
	 */
	
	footer.site-footer .main-navigation {
		display: none;
	}
	footer.site-footer .site-logo {
		padding-top: 12px;
	}
	footer.site-footer .site-logo img {
		width: 80%;
	}
	footer.site-footer .site-logo h2 {
		font-size: 16px;
		padding: 13px 24px 6px 24px;
	}
	footer.site-footer img.mario-graphic {
		display:none;
	}
	
	/**
	 * sidebar / categories
	 */
	.sidebar {
		display: none;
	}
	
	/**
	 * post thumbnail
	 */
	.post-thumbnail {
		width: calc(100% + 20px);
		margin-left: -10px;
		margin-right: -10px;
	}
	.post-thumbnail img {
		width: 100%;
		padding: 0px;
		margin: 0px;
		border: none;
		background: none;
	}
	.post-thumbnail ul.actions {}
	.post-thumbnail ul.actions li {}
	.post-thumbnail ul.actions li a,
	.post-thumbnail ul.actions li span {
		font-size: 22px;
		width: 40px;
		height: 40px;
		line-height: 40px;
		padding-top:4px;
		padding-bottom: 4px;
	}
	.post-thumbnail ul.actions li a .number {
		font-size: 10px;
		padding-top:4px;
	}
	.post-thumbnail ul.actions li.author {
		padding: 4px 8px 0px 0px;
	}
	
	article {
		margin-bottom: 12px;
		padding-top: 12px;
	}
	article:first-child {
		padding-top: 0px;
	}
	
	/**
	 * comments area
	 */
	
	.comments-area {
		width: calc(100% - 20px);
		margin-left: -10px;
		margin-bottom: -40px;
		
		-webkit-border-radius: 0px;
		-moz-border-radius: 0px;
		border-radius: 0px;
	}
	
	/**
	 * forms
	 */
	
	#usp_form,
	.um-form form {
		width: 100% !important;
	}
	
	#user-submitted-posts input[type="text"],
	#user-submitted-posts select,
	.um-form .um-field-area input[type="text"],
	.um-form .um-field-area input[type="email"],
	.um-form .um-field-area input[type="password"],
	.um-form select,
	#usp_form select {
		width: 100%;
		max-width: 100%;
	}
	
	#user-submitted-posts input[type="submit"],
	#user-submitted-posts input[type="submit"]:focus,
	#user-submitted-posts button,
	#user-submitted-posts button:focus,
	.comments-area input[type="submit"],
	.comments-area input[type="submit"]:focus,
	.um-form input[type="submit"],
	.um-form input[type="submit"]:focus,
	.um-form .um-button,
	.um-form .um-button:focus,
	.um input[type=submit].um-button, 
	.um input[type=submit].um-button:focus, 
	.um a.um-button, 
	.um a.um-button.um-disabled:hover, 
	.um a.um-button.um-disabled:focus, 
	.um a.um-button.um-disabled:active {
		padding: 8px 12px 4px 12px !important;
		margin: 0px;
	}
	
	/**
	 * WP User Manager
	 */
	
	.wpum-registration-form,
	.wpum-login-form,
	.wpum-password-form {
		
	}
	.wpum-registration-form fieldset,
	.wpum-login-form p,
	.wpum-password-form p {
		border: none !important;
	}
	.wpum-registration-form label,
	.wpum-login-form label,
	.wpum-password-form label {
		display:block !important;
		float:none !important;
		width:100% !important;
	}
	.wpum-registration-form label .wpum-required-star,
	.wpum-login-form label .wpum-required-star,
	.wpum-password-form label .wpum-required-star {
		display: inline-block;
		margin-left:4px;
	}
	.wpum-password-form fieldset div.field, 
	.wpum-profile-form fieldset div.field, 
	.wpum-registration-form fieldset div.field, 
	.wpum-update-password-form fieldset div.field {
		display:block !important;
		float:none !important;
		width:100% !important;
	}
	.wpum-login-form form input[type=email], 
	.wpum-login-form form input[type=password], 
	.wpum-login-form form input[type=text], 
	.wpum-login-form form select, 
	.wpum-login-form form textarea {
		display:block !important;
		float:none !important;
		width:100% !important;
	}
	#wpum-psw-footer {
		display: none;
	}
	.wpum-registration-form input[type="text"],
	.wpum-registration-form input[type="email"],
	.wpum-registration-form input[type="password"],
	.wpum-login-form input[type="text"],
	.wpum-login-form input[type="email"],
	.wpum-login-form input[type="password"],
	.wpum-password-form input[type="text"],
	.wpum-password-form input[type="email"],
	.wpum-password-form input[type="password"] {
		
	}
	
	.content-right-of-form {
		display: block;
		padding-top: 30px;
		padding-left: 0px;
		font-size: 16px;
		line-height: 26px;
	}
	
	/**
	 * terms of use page
	 */
	
	article.post-3 {
		width: 100%;
	}
	
	/**
	 * pagination
	 */
	
	.pagination {
		width: 100%;
	}
	
	/**
	 * user profiles
	 */
	
	.um-profile {
		width: 100% !important;
	}
	.wpum-single-profile .wpum-user-details .wpum-user-display-name {
		font-size:24px;
		padding-top:0px;
		padding-left:28px;
	}
	.wpum-single-profile .wpum-user-details .wpum-user-display-name small {
		padding-top:0px;
	}
	.wpum-single-profile .wpum-user-details .wpum-avatar-img img {
		padding:2px;
		width: 60px;
		min-width: 60px;
		max-width: 60px;
		margin: -10px 0px 10px -10px;
	}
	
	/**
	 * Modals
	 */
	
	.modal {
		width: 100%;
		min-width: calc(100% - 70px) !important;
	}
	.modal .wpum-password-form fieldset, 
	.modal .wpum-profile-form fieldset, 
	.modal .wpum-registration-form fieldset, 
	.modal .wpum-update-password-form fieldset,
	.modal .wpum-login-form form p.login-password, 
	.modal .wpum-login-form form p.login-remember, 
	.modal .wpum-login-form form p.login-username {
		margin: 0 0 0;
		padding: 0 0 0;
	}
	.modal .wpum-password-form fieldset label, 
	.modal .wpum-profile-form fieldset label, 
	.modal .wpum-registration-form fieldset label, 
	.modal .wpum-update-password-form fieldset label,
	.modal .wpum-login-form form label {
		padding-bottom:0px;
		padding-top:10px;
	}
	
	/**
	 * social share widget
	 */
	.social-share {
		margin-top:0px;
		margin-bottom:-20px;
		text-align:right;
	}
}

/**
 * smaller phones
 */
 
@media only screen and (max-width: 320px) {
	
	
	
}