.back {
    width: 100%;
    height: 100%;
    background-image: url('../intro.jpg');
    background-size: cover;

    position: fixed;
    white-space: nowrap;
    z-index:1;
}


.front
{
	width: 100%;
    height: 100%;
    margin: auto;
    background-color:rgba(45, 45, 45, 0);
    background-size: cover;
     box-shadow: 0 4px 8px 0 rgba(255, 255, 255, 0.2), 0 6px 20px 0 rgba(255, 255, 255, 0.19);
     overflow: auto;
     position: absolute;
    z-index:11;
    top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}


.top
{
	height:80px;
//	border:2px solid black;
	width:100%;
}
.left
{
	height:1720px;
	width:400px;
	//border:2px solid black;
	float:left;
}
.mid
{
	height:1720px;
	width:400px;
	//border:2px solid black;
	float:left;
}
.right
{
	height:1720px;
	width:400px;
	//border:2px solid black;
	float:left;
}



.left3
{
	height:1720px;
	width:400px;
	//border:2px solid black;
	float:left;
}
.right3
{
	height:1720px;
	width:770px;
	//border:2px solid black;
	float:left;
}


img
{
	width:99%;
	height:99%;
}
/* sub divs of left */
.h1
{
	width: 400px;
	height:215px;
	float: left;
	//border:2px solid red;
}
.s1
{
	width: 198px;
	height:215px;
	float: left;
	//border:2px solid red;
}
.s2
{
	width: 198px;
	height:215px;
	float: left;
	//border:2px solid red;
}
.v1
{
	width: 198px;
	height:430px;
	float: left;
	
}
.s4
{
	width: 198px;
	height:215px;
	float: left;
	//border:2px solid red;
}
.s9
{
	width: 198px;
	height:215px;
	float: left;
	//border:2px solid red;
}
.h3
{
	width: 400px;
	height:215px;
	float: left;
	//border:2px solid red;
}
.s7
{
	width: 198px;
	height:215px;
	float: left;
}
.s8
{
	width: 198px;
	height:215px;
	float: left;
	
}
.v3
{
	width: 198px;
	height:430px;
	float: left;
	
}
.s14
{
	width: 198px;
	height:215px;
	float: left;
	//border:2px solid red;
}
.s15
{
	width: 198px;
	height:215px;
	float: left;
	//border:2px solid red;
}

/*sub divs of mid*/
.r1
{
	width:400px;
	height:352px;
	float: left;
	//border:2px solid red;
}
.h2
{
	width: 400px;
	height:286px;
	float: left;
	//border:2px solid red;
}
.v2
{
	width: 400px;
	height:489px;
	float: left;
	
}
.s11
{
	width: 198px;
	height:215px;
	float: left;
}
.s12
{
	width: 198px;
	height:215px;
	float: left;
	
}
.s16
{
	width:400px;
	height:378px;
	float: left;
	//border:2px solid red;
}

/*sub divs of right*/
.s3
{
	width:400px;
	height:339px;
	float: left;
}
.s6
{
	width:400px;
	height:339px;
	float: left;
}
.s13
{
	width:400px;
	height:358px;
	float: left;
}
.s5
{
	width:400px;
	height:345px;
	float: left;
}
.s10
{
	width:400px;
	height:339px;
	float: left;
}



/* ***********************************res **************************************** */
.h1r
{
	width:400px;
	height:280px;
	float:left;

}
.s1r
{
	width:200px;
	height:195px;
	float:left;

}
.s2r
{
	width:200px;
	height:195px;
	float:left;

}
.v1r
{
	width: 200px;
	height:430px;
	float: left;
	
}
.s4r
{
	width: 200px;
	height:215px;
	float: left;
	//border:2px solid red;
}
.s5r
{
	width: 200px;
	height:215px;
	float: left;
	//border:2px solid red;
}
.s7r
{
	width: 400px;
	height:365px;
	float: left;
	//border:2px solid red;
}
.s10r
{
	width: 200px;
	height:195px;
	float: left;
	//border:2px solid red;
}
/*sub divs of mid starts here*/
.r1r
{
	width:400px;
	height:378px;
	float: left;
}
.v2r
{
	width: 400px;
	height:502px;
	float: left;
	
}
.s8r
{
	width: 400px;
	height:390px;
	float: left;
}
.s11r
{
	width: 200px;
	height: 195px;
	float: left;
}
/*sub divs of right*/
.s3r
{
	width: 400px;
	height:390px;
	float: left;
}
.s6r
{
	width: 400px;
	height:358px;
	float: left;
}
.s9r
{
	width: 400px;
	height:326px;
	float: left;
}


/* ***********************************com **************************************** */

.upper
{
	width:1152px;
	height:330px;
}

.lower
{
	width:1200px;
	height:330px;
}
/*upper */
.c7
{
width:392px;
height:163px;
float:left;
}
.c2
{
width:495px;
height:325.5px;
float:right;
}
.c1
{
width:253px;
height:325.5px;
//float:right;
}

.c6
{
width:195px;
height:163px;
float:left;
}
.c8
{
width:195px;
height:163px;
float:left;
}

/*lower*/
.c3
{
width:385px;
height:325.5px;
float:left;
}
.c4
{
width:385px;
height:325.5px;
float:left;
}
.c5
{
width:385px;
height:325.5px;
float:left;
}




		@media only screen and (max-device-width: 480px) {
	



.left
{
	height:1720px;
	width:400px;
	zoom:2.3;
	margin-left:10px;
	//border:2px solid black;
	//float:left;
}
.mid
{
	height:1720px;
	width:400px;
	zoom:2.3;
	margin-left:10px;
	//border:2px solid black;
	//float:left;
}
.right
{
	height:1720px;
	width:400px;
	zoom:2.3;
	margin-left:10px;
	//border:2px solid black;
	//float:left;
}


.left3
{
	height:662px;
	width:400px;
	zoom:2.3;
	//border:2px solid black;
	float:left;
}
.right3
{
	height:672px;
	width:770px;
	zoom:1.2;
	//border:2px solid black;
	float:left;
}




			}

