@charset "utf-8";

@font-face {
    font-family:MontserratRegular;
    src: url(../fonts/MontserratRegular.otf);	
}

@font-face {
    font-family:MontserratLight;
    src: url(../fonts/Montserrat-Light.otf);	
}

/* BODY
 * -------------------------- */
body {
	overflow-x: hidden;
    width: 100%;
	margin:0px;
	padding:0px;
	background-color:#e4dacf;
	}


/* WRAPPER
 * -------------------------- */
#wrapper{
	overflow-x:hidden;
	overflow-y: hidden;
	position:absolute;
	top:0;
	left:0;
    width:100%; 
	height:100%;
	background:url(../images/INDX_01.png);
	background-repeat: no-repeat;
	background-size: cover;

	-webkit-animation-delay: 5s;
	 -moz-animation-delay: 5s;
	-o-animation-delay: 5s;
	animation-delay: 5s;
	-webkit-animation: fadein 3s ; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadein 3s; /* Firefox < 16 */
    -o-animation: fadein 3s; /* Opera < 12.1 */
    animation: fadein 3s;	
	}


.im1{
	width:22%;
	height:auto;
	margin-top:3%;
	margin-left:25%;
	margin-right:auto;
	position: absolute;
	z-index: 1;
	}

.im2{
	width:52%;
	height:auto;
	margin-top: 22.5%;
	margin-left:10%;
	margin-right:auto;
	position: absolute;
	z-index: 1;
	}

.im3{
	width:auto;
	height:100%;
	margin-left:65%;
	margin-right:auto;
	margin-bottom: 0;
	position: absolute;
	z-index: 1;
	}


.im4{
	width:46%;
	height:auto;
	margin-top: 44%;
	margin-left:13.5%;
	margin-right:auto;
	position: absolute;
	z-index: 1;
	}

.img1{
	opacity: 0.5;
	width:41%;
	height:auto;
	margin-top: 17.5%;
	margin-left:17%;
	margin-right:auto;
	position: absolute;
	z-index: 1;
	}

.img1:hover {
  	opacity: 1;
	box-shadow: 0 6px 6px 0 rgba(0,0,0,0.24), 0 6px 6px 0 rgba(0,0,0,0.19);
}

.img2:active {
  	width:39%;
	opacity: 1;
	box-shadow: 0 6px 6px 0 rgba(0,0,0,0.24), 0 6px 6px 0 rgba(0,0,0,0.19);
}	

.img2{
	width:11%;
	height:auto;
	margin-top:40%;
	margin-left:19.5%;
	margin-right:auto;
	position: absolute;
	z-index: 1;
	}

.img3{
	width:19%;
	height:auto;
	margin-top: 40%;
	margin-left:35%;
	margin-right:auto;
	position: absolute;
	z-index: 1;
	}



.rds2{
	width:3%;
	height:auto;
	margin-top: 50%;
	margin-left:26%;
	margin-right:auto;
	position: absolute;
	z-index: 1;
	}

.rds3{
	width:3%;
	height:auto;
	margin-top: 50%;
	margin-left:33%;
	margin-right:auto;
	position: absolute;
	z-index: 1;
	}
/*
.rds4{
	width:3.5%;
	height:auto;
	margin-top: 50.7%;
	margin-left:34%;
	margin-right:auto;
	position: absolute;
	z-index: 1;
	}

.rds5{
	width:3.5%;
	height:auto;
	margin-top: 50.7%;
	margin-left:42%;
	margin-right:auto;
	position: absolute;
	z-index: 1;
	}*/

.rds6{
	width:3%;
	height:auto;
	margin-top: 50%;
	margin-left:40%;
	margin-right:auto;
	position: absolute;
	z-index: 1;
	}

.rdsm{
	width:10%;
	height:auto;
	margin-top: 55%;
	margin-left:20%;
	margin-right:auto;
	position: absolute;
	z-index: 1;
}

.rdsm2{
	width:2.5%;
	height:auto;
	margin-top: 55%;
	margin-left:32%;
	margin-right:auto;
	position: absolute;
	z-index: 1;
	}

.rdsm3{
	width:2.5%;
	height:auto;
	margin-top: 55%;
	margin-left:37%;
	margin-right:auto;
	position: absolute;
	z-index: 1;
	}

.rdsm4{
	width:2.5%;
	height:auto;
	margin-top: 55%;
	margin-left:42%;
	margin-right:auto;
	position: absolute;
	z-index: 1;
	}


@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@media only screen and (max-width: 700px) {	
	
/* BODY
 * -------------------------- */
body {
	overflow-x: hidden;
	overflow-y: hidden;
    width: 100%;
	margin:0px;
	padding:0px;
	background-color:#e4dacf;
	}


/* WRAPPER
 * -------------------------- */
#wrapper{
	overflow-x:hidden;
	overflow-y: hidden;
	position:absolute;
	top:0;
	left:0;
    width:100%; 
	height:100%;
	background:url(../images/INDX_01.png);
	background-repeat: no-repeat;
	background-size: cover;

	-webkit-animation-delay: 5s;
	 -moz-animation-delay: 5s;
	-o-animation-delay: 5s;
	animation-delay: 5s;
	-webkit-animation: fadein 3s ; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadein 3s; /* Firefox < 16 */
    -o-animation: fadein 3s; /* Opera < 12.1 */
    animation: fadein 3s;	
	}


.im1{

	width:46%;
	height:auto;
	margin-top:7%;
	margin-left:22%;
	margin-right:auto;
	position: absolute;
	z-index: 1;
	}

.im2{
	width:90%;
	height:auto;
	margin-top: 49%;
	margin-left:5%;
	margin-right:auto;
	position: absolute;
	z-index: 1;
	}

.im3{
	width:auto;
	height:21%;
	margin-left:74%;
	margin-right:auto;
	margin-bottom: 0;
	position: absolute;
	z-index: 1;
	}
	
.im4{
	width:85%;
	height:auto;
	margin-top: 91%;
	margin-left:7.6%;
	margin-right:auto;
	position: absolute;
	z-index: 1;
	}

.img1{
	width:82%;
	height:auto;
	margin-top: 36%;
	margin-left:9%;
	margin-right:auto;
	position: absolute;
	z-index: 1;
	}

.img2{
	width:24%;
	height:auto;
	margin-top:81%;
	margin-left:20%;
	margin-right:auto;
	position: absolute;
	z-index: 1;
	}

.img3{
	width:35%;
	height:auto;
	margin-top: 81%;
	margin-left:50%;
	margin-right:auto;
	position: absolute;
	z-index: 1;
	}



.rds2{
	width:8%;
	height:auto;
	margin-top: 102%;
	margin-left:33%;
	margin-right:auto;
	position: absolute;
	z-index: 1;
	}

.rds3{
	width:8%;
	height:auto;
	margin-top: 102%;
	margin-left:47%;
	margin-right:auto;
	position: absolute;
	z-index: 1;
	}

.rds4{
	width:8%;
	height:auto;
	margin-top: 102%;
	margin-left:44%;
	margin-right:auto;
	position: absolute;
	z-index: 1;
	}

.rds5{
	width:8%;
	height:auto;
	margin-top: 102%;
	margin-left:58%;
	margin-right:auto;
	position: absolute;
	z-index: 1;
	}

.rds6{
	width:8%;
	height:auto;
	margin-top: 102%;
	margin-left:61%;
	margin-right:auto;
	position: absolute;
	z-index: 1;
	}

.rdsm{
	width:24%;
	height:auto;
	margin-top: 117%;
	margin-left:37%;
	margin-right:auto;
	position: absolute;
	z-index: 1;

	}

.rdsm2{
	width:6%;
	height:auto;
	margin-top: 127%;
	margin-left:37%;
	margin-right:auto;
	position: absolute;
	z-index: 1;
	}

.rdsm3{
	width:6%;
	height:auto;
	margin-top: 127%;
	margin-left:46%;
	margin-right:auto;
	position: absolute;
	z-index: 1;
	}
	

.rdsm4{
	width:6%;
	height:auto;
	margin-top: 127%;
	margin-left:56%;
	margin-right:auto;
	position: absolute;
	z-index: 1;
	}
	
}