/*  cache version   ?cv=1   2017/08/08  */

/* --- 
BDT to MitsubishiElectric versions are same except 
MAKE SURE THESE ARE KEEPT UPTODATE BETWEEN EACH OTHER
--- */

.mob-flow {
	/*to be used if you want a grid to flow in mobile*/
}
.mob-flow-portrait {
	/*to be used if you want a grid to flow in mobile portrait only landscape of 560 up will be normal*/
}
.block-a.mob-reverse-ab,
.block-b.mob-reverse-ab {
	/*used to switch block a b around using js */
}

.grid-a,
.grid-b,
.grid-c,
.grid-d {
    overflow: hidden;
}
.block-a,
.block-b,
.block-c,
.block-d,
.block-e {
    padding-bottom: 500em;
    margin-bottom: -500em;
    min-height: 1px;
    overflow: hidden;
}
.block-a {
	clear: left;
}
.grid-a .block-a,
.grid-a .block-b {
	width: 49.5%;
	float: left;
}
.grid-a.margin .block-a {
	width: 48.5%;
	padding-right: 1%;
}
.grid-a.margin .block-b {
	width: 48.5%;
	padding-left: 1%;
}

.grid-b .block-a,
.grid-b .block-b,
.grid-b .block-c {
	width: 33.25%;
	float: left;
}
.grid-b.margin .block-a {
	width: 31.25%;
	margin-right: 1%;
}
.grid-b.margin .block-b {
	width: 31.25%;
	margin-left: 1%;
	margin-right: 1%;
}
.grid-b.margin .block-c {
	width: 31.25%;
	margin-left: 1%;
}
.grid-c .block-a,
.grid-c .block-b,
.grid-c .block-c,
.grid-c .block-d {
	width: 22.5%;
	float: left;
}
.grid-c.margin .block-a,
.grid-c.margin .block-b,
.grid-c.margin .block-c {
	width: 24%;
	margin-right: 1%;
}
.grid-c.margin .block-d {
	width: 24%;
}


.grid-d .block-a,
.grid-d .block-b,
.grid-d .block-c,
.grid-d .block-d,
.grid-d .block-e {
	width: 19.5%;
	float: left;
}


/* OFFSET GRIDS */
.grid-os-a, .grid-os-a-f, .grid-os-b {
	overflow: hidden;
}
.block-a {
	clear: left;
}

.grid-os-a .block-a {
	width: 65%;
	float: left;
}
.grid-os-a .block-b {
	width: 33%;
	float: left;
	padding-left: 2%;
}
.grid-os-a-f .block-a {
	width: 33%;
	float: left;
}
.grid-os-a-f .block-b {
	width: 65%;
	float: left;
	padding-left: 2%;
}

.grid-os-b .block-a {
	width: 75%;
	float: left;
}
.grid-os-b .block-b {
	width: 23%;
	float: left;
	padding-left: 2%;
}

@media (max-width: 560px) {
    .mob-flow .block-a:not(.mob-static),
    .mob-flow .block-b:not(.mob-static),
    .mob-flow .block-c:not(.mob-static),
    .mob-flow .block-d:not(.mob-static),
    .mob-flow .block-e:not(.mob-static) {
	    width: 100%;
	    float: none;
	    padding: 0 0 0 0;
	    margin: 0 0 0 0;
    }
    .mob-flow.margin .block-a:not(.mob-static),
    .mob-flow.margin .block-b:not(.mob-static),
    .mob-flow.margin .block-c:not(.mob-static),
    .mob-flow.margin .block-d:not(.mob-static),
    .mob-flow.margin .block-e:not(.mob-static) {
	    width: 100%;
	    margin: 3em 0 0 0;
    }
/*}   
@media screen and (max-width: 767px) {*/
    .mob-flow-portrait .block-a:not(.mob-static),
    .mob-flow-portrait .block-b:not(.mob-static),
    .mob-flow-portrait .block-c:not(.mob-static),
    .mob-flow-portrait .block-d:not(.mob-static),
    .mob-flow-portrait .block-e:not(.mob-static),
    .mob-flow-portrait.margin .block-a:not(.mob-static),
    .mob-flow-portrait.margin .block-b:not(.mob-static),
    .mob-flow-portrait.margin .block-c:not(.mob-static),
    .mob-flow-portrait.margin .block-d:not(.mob-static),
    .mob-flow-portrait.margin .block-e:not(.mob-static) {
	    width: 100%;
	    float: none;
	    padding: 0 0 0 0;
	    margin: 3em 0 0 0;
    }
}

/* MOBILE SITE */
@media screen and (max-width: 560px) {
    .mob .mob-flow-portrait .block-a:not(.mob-static),
    .mob .mob-flow-portrait .block-b:not(.mob-static),
    .mob .mob-flow-portrait .block-c:not(.mob-static),
    .mob .mob-flow-portrait .block-d:not(.mob-static),
    .mob .mob-flow-portrait .block-e:not(.mob-static) {
	    width: 100%;
	    float: none;
	    padding: 0 0 0 0;
	    margin: 0 0 0 0;
    }
}
@media screen and (max-width: 960px) {
    .mob .mob-flow .block-a:not(.mob-static),
    .mob .mob-flow .block-b:not(.mob-static),
    .mob .mob-flow .block-c:not(.mob-static),
    .mob .mob-flow .block-d:not(.mob-static),
    .mob .mob-flow .block-e:not(.mob-static) {
	    width: 100%;
	    float: none;
	    padding: 0 0 0 0;
	    margin: 0 0 0 0;
    }
    .mob .mob-flow.margin .block-a:not(.mob-static),
    .mob .mob-flow.margin .block-b:not(.mob-static),
    .mob .mob-flow.margin .block-c:not(.mob-static),
    .mob .mob-flow.margin .block-d:not(.mob-static),
    .mob .mob-flow.margin .block-e:not(.mob-static) {
	    width: 100%;
	    margin: 3em 0 0 0;
    }
    
}