@charset "utf-8";
/*
Theme Name: Gay Massage Table Responsive
CSS/Theme URI: http://www.gaymassagetable.com/
Description: Designed by GUYDOLLARS
Version: 1.0
Author: Guy Dollars
Author URI: http://www.guydollars.com/
*/

@media only screen and (max-width: 1920px) {
	.wrapper {
		width: 1440px;
	}

	.item-big {
		width: 700px;
	}

	.item-big .thumbs .left {
		width: 100%;
	}

	.item-big .thumbs .right {
		width: 140px;
	}


	.item a .overlay img {
		margin-top: 5px;
		max-width: 55%;
	}

	.item-model a .overlay img {
		margin-top: 65px;
	}

	.big-join a .label {
		width: 60%;
	}

	.item-big .thumbs .right a.placeholder {
		height: 77px;
	}
}

@media only screen and (max-width: 1460px) {
	body {
		overflow-x: hidden;
	}

	.wrapper,
	.join-wrapper {
		width: 1024px;
	}

	#testimonial {
		right: 0;
	}

	#logo {
		margin-left: 0;
	}

	.item-big {
		width: 500px;
	}

	.item-big .thumbs .left {
		width: 100%;
		margin-right: 0;
		margin-bottom: 5px;
	}

	.item-big .thumbs .right {
		width: 100%;
		margin: 0;
	}

	.item-big .thumbs .right a {
		width: 119px;
		margin: 0;
	}

	.item-big .thumbs .right a.redBtn span.small {
		font-size: 11px;
	}

	.item-big .thumbs .right a.redBtn span.top {
		line-height: 150%;
	}

	.call-to-action a span.left_shape {
		padding-left: 0;
	}

	.call-to-action a span.right_shape {
		padding-right: 0;
	}







	.item a .overlay img {
		max-width: 50%;
	}

	.item a .overlay h3 {
		font-size: 14px;
	}

	.item a .overlay h6 {
		font-size: 12px;
	}





	.item-big .thumbs .right a.placeholder {
		width: 119px;
		height: 69px;
	}
}

/* Tablet Portrait size to standard 960 */
@media only screen and (max-width: 1080px) {

	.wrapper,
	.inner-wrapper,
	.join-wrapper {
		width: 748px;
	}

	#testimonial {
		display: none;
	}

	#logo {
		width: 100%;
		text-align: center;
	}

	#logo h1 {
		float: none;
		display: inline-block;
	}

	#menu ul li a span.label {
		font-size: 20px;
	}

	.item,
	.item-model {
		width: 49%;
	}

	.item-big {
		width: 100%;
		margin-bottom: 25px;
	}

	.item-big .thumbs .left {
		width: 560px;
		margin-right: 5px;
		margin-bottom: 0px;
	}

	.item-big .thumbs .right {
		width: 160px;
		margin: 0;
	}

	.item-big .thumbs .right a {
		width: 100%;
		margin: 0;
	}

	.call-to-action a span.label {
		font-size: 26px;
	}

	.item a .overlay img {
		max-width: 50%;
		margin-top: 15px;
	}

	.item a .overlay h3 {
		font-size: 22px;
	}

	.item a .overlay h6 {
		font-size: 16px;
	}

	#hero a .overlay {
		width: 100%;
		right: 0;
		top: 60%;
	}

	#hero a .overlay h2 {
		font-size: 60px;
	}

	#hero a .overlay h5 {
		font-size: 28px;
	}

	#hero a .overlay h5 span.left_shape,
	#hero a .overlay h5 span.right_shape {
		display: none;
	}



	.item-model a .overlay {
		width: 240px;
		height: 367px;
	}

	.big-join a .label h3 {
		font-size: 48px;
		margin-top: 55px;
	}

	.big-join a .label h4 {
		font-size: 28px;
	}

	.social ul,
	.social ul li,
	.social ul li a {
		font-size: 13px;
	}

	.social ul li.label {
		display: none;
	}

	#topbar h2 {
		font-size: 14px;
	}

	.item-big .thumbs .right a.placeholder {
		margin-bottom: 5px;
		width: 160px;
		height: 81px;
	}

	.video-thumbs a {
		width: 189px;
	}
}

/* Mobile Landscape */
@media screen and (max-width: 767px) {
	body {
		font-size: 12px;
	}

	.wrapper,
	.inner-wrapper,
	.join-wrapper {
		width: 96%;
	}

	#topbar .left,
	#topbar .right {
		width: 100%;
		text-align: center;
	}

	#topbar h2 {
		font-size: 12px;
	}

	.social {
		float: none;
		display: inline-block;
		padding-top: 5px;
	}

	#header {
		height: 320px;
	}

	#menu ul li a span.label {
		padding: 0;
		font-size: 14px;
		line-height: 42px;
	}

	#menu ul li a span.left_shape,
	#menu ul li a span.right_shape {
		height: 42px;
	}

	.item-big .thumbs .left {
		width: 100%;
		margin-right: 0;
		margin-bottom: 5px;
	}

	.item-big .thumbs .right {
		width: 100%;
	}

	.item-big .thumbs .right a {
		display: none;
	}

	.item-big .thumbs .right a.redBtn {
		display: inline-block;
	}

	.item-big .thumbs .right a.redBtn span.small {
		font-size: 13px;
	}

	.item-big .thumbs .right a.redBtn span.top {
		line-height: 150%;
	}

	.call-to-action a span.left_shape,
	.call-to-action a span.right_shape {
		display: none;
	}

	.call-to-action a span.label {
		font-size: 17px;
		padding: 0;
		line-height: 50px;
	}

	.call-to-action a span.label::before,
	.call-to-action a span.label::after {
		height: 50px;
	}

	.section .title,
	.section .title h2 {
		font-size: 22px;
	}

	.item, .item-model{
		width: 48%;
	}

	

	#hero a .overlay {
		top: 45%;
	}

	#hero a .overlay h2 {
		font-size: 50px;
	}

	#hero a .overlay h5 {
		font-size: 20px;
	}

 

	.item-model a .overlay {
		width: 195px;
		height: 298px;
	}

	.item-model a .overlay img {
		margin-top: 35px;
	}

	.item-model .item-title h3 {
		font-size: 20px;
		padding: 5px 0;
	}

	.big-join a .label {
		width: 80%;
	}

	.big-join a .left_shape,
	.big-join a .right_shape {
		display: none;
	}

	.big-join a .label h4 {
		display: none;
	}

	.half-col {
		width: 100%;
	}

	.left-half-col {
		padding: 0;
	}

	.right-half-col {
		padding: 0;
	}

	.join-form {
		font-size: 12px;
	}

	.form-section label,
	.form-section i {
		font-size: 13px;
	}

	.form-section.ratio-inputs label {
		width: 100%;
		padding-bottom: 5px;
		text-align: center;
	}

	.form-section.ratio-inputs .input-holder {
		padding-left: 0;
		text-align: left;
	}

	.form-section.ratio-inputs .ratio-option label {
		text-align: left;
		float: left;
		width: 90%;
	}

	.form-section input[type=submit] {
		font-size: 16px;
	}

	.item-big .thumbs .right a.placeholder {
		margin-bottom: 5px;
		width: 170px;
		height: 81px;
	}

	.item-big .item-title h2 {
		font-size: 20px;
	}

	.item-big .item-title h4 {
		font-size: 15px;
	}

	.video-thumbs a {
		width: 208px;
	}
}

/* Mobile Portrait */
@media only screen and (max-width: 479px) {

	.wrapper,
	.inner-wrapper,
	.join-wrapper {
		width: 350px;
	}

	#header {
		height: 220px;
	}

	#menu ul li a {
		font-size: 11px;
	}

	#menu ul li a span.label {
		line-height: 32px;
		font-size: 11px;
		padding: 0 6px;
	}

	#menu ul li a span.left_shape,
	#menu ul li a span.right_shape {
		display: none;
	}

	.item-big .thumbs .left a .playBtn {
		width: 100px;
		height: 100px;
		margin-left: -50px;
		margin-top: -50px;
	}

	.call-to-action {
		margin: 10px 0;
	}

	.call-to-action a span.label {
		line-height: 26px;
		padding: 10px;
	}

	.call-to-action a span.label::before,
	.call-to-action a span.label::after {
		width: 51px;
		height: 73px;
	}

 

	

	.item a .overlay img {
		max-width: 45%;
	}

	.item a .overlay h3 {
		font-size: 16px;
	}

	.item a .overlay h6 {
		font-size: 14px;
	}

	#hero a .overlay h2 {
		font-size: 35px;
		letter-spacing: -2px;
	}

	#hero a .overlay h5 {
		font-size: 18px;
	}

	.item-model a {
		width: 162px;
	}

	.item-model a .overlay {
		width: 136px;
		height: 208px;
	}

	.item-model a .overlay img {
		margin-top: 25px;
	}

	.item-model .item-title h3,
	.item-model a .overlay h3,
	.item-model a .overlay h6 {
		font-size: 15px;
	}

	.big-join a .label {
		width: 100%;
		height: 190px;
	}

	.big-join a .label h3 {
		font-size: 35px;
	}

	.form-section label,
	.form-section i {
		width: 100%;
		text-align: center;
	}

	.form-section.text-inputs .input-holder {
		padding-left: 0;
	}

	.join-glasses-head {
		font-size: 22px;
	}

	ul.join-info li {
		font-size: 12px;
	}

	.item-big .item-title h2 strong {
		display: inline-block;
		width: 100%;
	}

	.video-thumbs a {
		width: 148px;
	}
}

@media only screen and (max-width: 280px) {
	.wrapper, .inner-wrapper, .join-wrapper {
		width: 272px;
	}
	.item, .item-model {
		width: 47.8%;
	}
	.section .title{
		margin-bottom: 0;
	}
	.item-big{
		margin-bottom: 15px;
	}
	.item a .overlay{
		border-width: 2px;
	}
	#hero a .overlay{
		top: 0;
	}
	 
	.item a .overlay h3 {
		font-size: 14px;
	}
	.item a .overlay h6 {
		font-size: 12px;
	}
}