body,
html {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	overflow: hidden;
}
div {
    position: absolute;
}
img {
    width: 100%;
    height: auto;
}
.mainwrapper, .Desktop, .mobilelandscape, .mobileportrait, .tabletlandscape, .tabletportrait {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%;
}
/* banner */

.Desktopbanner {
	width: 100%;
	height: 14%;
	background: #575396;
	left: 50%;
	transform: translateX(-50%);
}

.bannerRaymourlogo {
	left: 3%;
	top: 50%;
	transform: translateY(-50%);
}

.bannerjoneslogo {
	left: 28%;
	top: 50%;
	transform: translateY(-50%);
}

.bannerlogo {
	left: 38%;
	top: 51%;
	transform: translateY(-50%) scale(1.1);
}

.bannertext {
	left: 52%;
	top: 50%;
	transform: translateY(-50%);
}

.bannerlearnmore {
	left: 80%;
	top: 50%;
	transform: translateY(-50%);
}

.plus {
	left: 97%;
	top: 50%;
	transform: translateY(-50%);
	cursor: pointer;
}
/* expand */
.Desktopmain {
	width: 100%;
	left: 0%;
	right: 0%;
	margin: 0 auto;
	height: 70%;
	background: #575396;
	overflow: hidden;
	top: 0%;
	z-index: 2;
}

.expandclose {
	width: 1.5%;
	right: 0.5%;
	top: 1.5%;
	cursor: pointer;
	z-index: 2;
}

.expandmattresstext {
	width: 58%;
	top: 27%;
	left: 0;
	right: 0;
	margin: auto;
}

.expandcometext {
	width: 60%;
	top: 37%;
	left: 50%;
	transform: translateX(-50%);
}

.expandpizzatext {
	width: 60%;
	top: 62%;
	left: 0;
	right: 0;
	margin: auto;
}

.clouds {
	transform: scale(1.3);
}

.expandimg {
	width: 100%;
	top: 0%;
}

.expandlogo {
	width: 12%;
	top: 50%;
	transform: translateY(-50%);
	left: 54%;
}

.expandRaymourlogo {
	top: 6%;
	right: 9%;
}

.expandjoneslogo {
	top: 6%;
	right: 2%;
}

.videoposter {
	top: 18%;
	right: 2%;
}

.expandtext {
	top: 62%;
	right: 2%;
}

.expandlearnmore {
	top: 80%;
	right: 7%;
	cursor: pointer;
}

.expandoffer {
	top: 94%;
	right: 7.5%;
}


/* mobile-banner */

.Mobilebanner {
	width: 100%;
	height: 10%;
	background: #575396;
	left: 0;
	top: 0;
}

.mobilebannerRaymourlogo {
	width: 20%;
	left: 2%;
	top: 9%;
}

.mobilebannerjoneslogo {
	top: 50%;
	transform: translateY(-50%);
	left: 25%;
	width: 12%;
}

.mobilebannerlogo {
	width: 24%;
	left: 38%;
}

.mobilebannertext {
	width: 36%;
	left: 63%;
}

.mobilebannerlearnmore {
	width: 24%;
	left: 65%;
	top: 50%;
}

.mobileplus {
	left: 92%;
	top: 50%;
	width: 5%;
	cursor: pointer;
}
/* mobile-expand */

.Mobilemain {
	width: 100%;
	height: 100%;
	background: #575396;
    z-index: 2;
    overflow: hidden;
}

.mobileexpandclose {
	width: 6.5%;
	right: 1.5%;
	top: 1.5%;
	cursor: pointer;
	z-index: 2;
}

.mobileexpandmattresstext {
	width: 86%;
	top: 36%;
	left: 0;
	right: 0;
	margin: auto;
}

.mobileclouds {
	bottom: 0%;
	transform: scale(2.3);
}

.mobileexpandcometext {
	width: 86%;
	top: 41%;
	left: 50%;
	transform: translateX(-50%);
}

.mobileexpandpizzatext {
	width: 85%;
	top: 50%;
	left: 0;
	right: 0;
	margin: auto;
}

.mobileexpandimg {
	width: 100%;
	top: 0;
}

.mobileexpandlogo {
	width: 29%;
	left: 0%;
	right: 0;
	margin: auto;
	top: 27%;
}

.mobileexpandRaymourlogo {
	width: 43%;
	top: 93%;
	left: 10%;
}

.mobileexpandtext {
	width: 82%;
	top: 54%;
	left: 50%;
	transform: translateX(-50%);
}

.mobilevideoposter {
	top: 70%;
	width: 36%;
	left: 2%;
}

.mobileexpandjoneslogo {
	top: 90%;
	right: 5%;
	width: 18%;
}

.mobileexpandlearnmore {
	top: 72%;
	width: 38%;
	right: 2%;
}

.mobileexpandoffer {
	top: 80%;
	width: 31%;
	right: 6.5%;
}

/* mobile-land-banner */

.MobileLandbanner {
	width: 100%;
	height: 18%;
	background: #575396;
	left: 0;
	top: 0;
}

.mobilelandbannerRaymourlogo {
	left: 3%;
	width: 20%;
	top: 50%;
	transform: translateY(-50%);
}

.mobilelandbannerjoneslogo {
	width: 7%;
	left: 25%;
	top: 50%;
	transform: translateY(-50%);
}

.mobilelandbannerlogo {
	left: 24%;
	top: 51%;
	transform: translateY(-50%) scale(0.5);
}

.mobilelandbannertext {
	left: 52%;
	width: 28%;
	top: 50%;
	transform: translateY(-50%);
}

.mobilelandbannerlearnmore {
	left: 80%;
	width: 15%;
	top: 50%;
	transform: translateY(-50%);
}

.mobilelandplus {
	left: 96%;
	top: 50%;
	transform: translateY(-50%);
	cursor: pointer;
}

/* mobile-land-expand */

.MobileLandmain {
	width: 100%;
	left: 0%;
	right: 0%;
	height: 100%;
	background: #575396;
    z-index: 2;
    overflow: hidden;
}

.mobilelandexpandclose {
	right: 1%;
	top: 2%;
	cursor: pointer;
	z-index: 2;
	width: 5%;
}

.mobilelandclouds {
	top: 0%;
	transform: scale(1.5);
}

.mobilelandexpandmattresstext {
	width: 58%;
	top: 27%;
	left: 0;
	right: 0;
	margin: auto;
}

.mobilelandexpandcometext {
	width: 60%;
	top: 37%;
	left: 50%;
	transform: translateX(-50%);
}

.mobilelandexpandpizzatext {
	width: 60%;
	top: 55%;
	left: 0;
	right: 0;
	margin: auto;
}

.mobilelandexpandimg {
	width: 100%;
	left: 0;
	top: 0;
}

.mobilelandexpandlogo {
	width: 12%;
	top: 50%;
	transform: translateY(-50%);
	left: 40%;
}

.mobilelandexpandRaymourlogo {
	top: 12%;
	width: 25%;
	right: 25%;
}

.mobilelandexpandtext {
	top: 79%;
	width: 29%;
	right: 20%;
}

.mobilelandvideoposter {
	top: 28%;
	right: 3%;
}

.mobilelandexpandjoneslogo {
	top: 8%;
	right: 10%;
	width: 10%;
}

.mobilelandexpandlearnmore {
	width: 16%;
	top: 78%;
	right: 3%;
	cursor: pointer;
}

.mobilelandexpandoffer {
	top: 88%;
	width: 11%;
	right: 5%;
}

/* tab-land-banner */

.TabletLandbanner{
	width: 100%;
	height: 15%;
	background: #575396;
	top: 0%;
	}
	
.tabletlandbannerRaymourlogo{
    left: 2%;
    width: 15%;
    top: 50%;
    transform: translateY(-50%);
}

.tabletlandbannerjoneslogo{
    left: 19%;
    width: 6%;
    top: 50%;
    transform: translateY(-50%);
}

.tabletlandbannerlogo{
    left: 17%;
    top: 51%;
    transform: translateY(-50%) scale(0.38);
}

.tabletlandbannertext{
    left: 42%;
    width: 27%;
    top: 50%;
    transform: translateY(-50%);
}

.tabletlandbannerlearnmore{
    width: 20%;
    left: 70%;
    top: 50%;
    transform: translateY(-50%);
}

.tabletlandplus{
    left: 94%;
    width: 3.5%;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
}

/* tab-land-expand */

.TabletLandmain {
	width: 100%;
	height: 100%;
	background: #575396;
    z-index: 2;
    overflow: hidden;
}

.tabletlandexpandclose {
	width: 2.5%;
	right: 0.5%;
	top: 1.5%;
	cursor: pointer;
	z-index: 2;
}

.tabletclouds {
	transform: scale(1.3);
	top: 18%;
	left: 0%;
}

.tabletlandexpandmattresstext {
	width: 58%;
	top: 27%;
	left: 0;
	right: 0;
	margin: auto;
}

.tabletlandexpandcometext {
	width: 60%;
	top: 37%;
	left: 50%;
	transform: translateX(-50%);
}

.tabletlandexpandpizzatext {
	width: 60%;
	top: 54%;
	left: 0;
	right: 0;
	margin: auto;
}

.tabletlandexpandimg {
	width: 100%;
	top: 11%;
	left: 4%;
	transform: scale(1.3);
}

.tabletlandexpandlogo {
	width: 12%;
	top: 50%;
	transform: translateY(-50%);
	left: 43%;
}

.tabletlandexpandRaymourlogo {
	top: 9%;
	right: 16%;
	width: 24%;
}

.tabletlandexpandjoneslogo {
	top: 7%;
	right: 4%;
	width: 9%;
}

.tabletlandvideoposter {
	top: 21%;
	right: 1%;
}

.tabletlandexpandtext {
	top: 62%;
	right: 2%;
	width: 41%;
}

.tabletlandexpandlearnmore {
	top: 79%;
	right: 14%;
	width: 20%;
	cursor: pointer;
}

.tabletlandexpandoffer {
	top: 91%;
	right: 18.5%;
	width: 12%;
}

/* tab-banner */

.Tabletbanner {
	width: 100%;
	height: 10%;
	background: #575396;
	left: 0;
	top: 0%;
}

.tabletbannerRaymourlogo {
	width: 20%;
	left: 2%;
	top: 50%;
	transform: translateY(-50%);
}

.tabletbannerjoneslogo {
	top: 50%;
	transform: translateY(-50%);
	left: 25%;
	width: 8%;
}

.tabletbannerlogo {
	width: 16%;
	left: 34%;
}

.tabletbannertext {
	width: 26%;
	top: 50%;
	left: 51%;
	transform: translateY(-50%);
}

.tabletbannerlearnmore {
	width: 17%;
	left: 78%;
	top: 50%;
	transform: translateY(-50%);
}

.tabletplus {
	left: 96%;
	top: 50%;
	transform: translateY(-50%);
	width: 3%;
	cursor: pointer;
}


/* tab-expand */

.Tabletmain {
	width: 100%;
	left: 0;
	height: 100%;
	background: #575396;
    z-index: 2;
    overflow: hidden;
}

.tabletexpandclose {
	width: 2.5%;
	right: 1.5%;
	top: 1.5%;
	cursor: pointer;
	z-index: 2;
}

.tabletexpandmattresstext {
	width: 70%;
	top: 34%;
	left: 0;
	right: 0;
	margin: auto;
}

.tabletportclouds {
	bottom: 0%;
	transform: scale(1.5);
}

.tabletexpandcometext {
	width: 70%;
	top: 41%;
	left: 50%;
	transform: translateX(-50%);
}

.tabletexpandpizzatext {
	width: 70%;
	top: 53%;
	left: 0;
	right: 0;
	margin: auto;
}

.tabletexpandimg {
	width: 100%;
	top: 0;
	left: 0;
}

.tabletexpandlogo {
	width: 15%;
	left: 0;
	right: 0;
	margin: auto;
	top: 39%;
}

.tabletexpandRaymourlogo {
	width: 35%;
	top: 93%;
	left: 6%;
}

.tabletexpandtext {
	width: 53%;
	top: 54%;
	left: 50%;
	transform: translateX(-50%);
}

.tabletvideoposter {
	top: 68%;
	width: 46%;
	left: 6%;
}

.tabletexpandjoneslogo {
	top: 91%;
	right: 11%;
	width: 14%;
}

.tabletexpandlearnmore {
	top: 73%;
	width: 27%;
	right: 6%;
}

.tabletexpandoffer {
	top: 80%;
	width: 18%;
	right: 9.5%;
}