@charset "utf-8";
/* CSS Document */
@font-face {
    font-family: 'ProximaNovaLtRegular';
    src: url('../fonts/proximanova-light-webfont.eot');
    src: url('../fonts/proximanova-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/proximanova-light-webfont.woff') format('woff'),
         url('../fonts/proximanova-light-webfont.ttf') format('truetype'),
         url('../fonts/proximanova-light-webfont.svg#ProximaNovaLtRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ProximaNovaLtBold';
    src: url('../fonts/proximanova-semibold-webfont.eot');
    src: url('../fonts/proximanova-semibold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/proximanova-semibold-webfont.woff') format('woff'),
         url('../fonts/proximanova-semibold-webfont.ttf') format('truetype'),
         url('../fonts/proximanova-semibold-webfont.svg#ProximaNovaLtBold') format('svg');
    font-weight: normal;
    font-style: normal;
}


/* Generated by Font Squirrel (http://www.fontsquirrel.com) on August 11, 2014 */



@font-face {
    font-family: 'proxima_nova_rgbold';
    src: url('../fonts/proximanova-bold_0-webfont.eot');
    src: url('../fonts/proximanova-bold_0-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/proximanova-bold_0-webfont.woff') format('woff'),
         url('../fonts/proximanova-bold_0-webfont.ttf') format('truetype'),
         url('../fonts/proximanova-bold_0-webfont.svg#proxima_nova_rgbold') format('svg');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'franklin_gothic_demiregular';
    src: url('../fonts/fradm_0-webfont.eot');
    src: url('../fonts/fradm_0-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/fradm_0-webfont.woff') format('woff'),
         url('../fonts/fradm_0-webfont.ttf') format('truetype'),
         url('../fonts/fradm_0-webfont.svg#franklin_gothic_demiregular') format('svg');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'proxima_novablack';
    src: url('../fonts/proximanova-black_0-webfont.eot');
    src: url('../fonts/proximanova-black_0-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/proximanova-black_0-webfont.woff') format('woff'),
         url('../fonts/proximanova-black_0-webfont.ttf') format('truetype'),
         url('../fonts/proximanova-black_0-webfont.svg#proxima_novablack') format('svg');
    font-weight: normal;
    font-style: normal;

}

body, html {
    height: 100%;
    max-height: 100%}
* {
    margin: 0;
    padding: 0;
}
img {
    border: 0;
    outline: 0;
    vertical-align: middle;
}
.clear:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}
*html .clear, :first-child+html .clear {
    zoom: 1;
    clear: both;
    font-size: 1px!important;
    line-height: 1px!important;
}
article, aside, figcaption, figure, footer, header, nav, section {
    display: block;
}
a {
    text-decoration: none;
}
a:hover {
    text-decoration: underline;
}
.toLeft {
    float: left;
}
.toRight {
    float: right;
}

body, img {
    -o-transition: all .2s linear;
    -moz-transition: all .2s linear;
    -webkit-transition: all .2s linear;
    transition: all .2s linear;
}
body {
    margin: 0 auto;
    padding: 0;
    color: #2d2d2d;	
    font-family: Arial, Helvetica, sans-serif;
    -webkit-font-smoothing: subpixel-antialiased;
    font-size: 62.5%;
    line-height: 1.33;
    /*-webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;*/
}

.wrapper{
	width:100%;
	max-width:1366px;
	margin:0 auto;
	position:relative;
	background:#EAECEB;	
}

section {
	position:relative;
	width:100%;
}

section img{
	max-width:100%;	
}

/*-----------------------Header---------------------*/
header{
	background:url(../images/header-bg.png) repeat-x top left;
	width:100%;
	position: absolute;
	z-index: 99999;
	top: 0;
}

header .headerLHS{
	float:left;
	width:388px;
}

.headerLHSWrap{
	width:100%;
	background:url(../images/logo-bg.png) no-repeat top right;	
}

header .logo{
	float:left;
	margin:0 1em;
	width:auto;		
}

header .logo img{max-width:100%;}

header .countDownWrap{
	float:left;
	background:url(../images/count-bg.png) right top no-repeat;
	padding:1em 3em 0em 0;
}

header .countDownWrap .count{
	font-size: 2.2em;
	text-transform: uppercase;
	font-weight: bold;
}

header .countDownWrap .txt{ font-size:1.5em; letter-spacing:0.08em;}

header .countDownWrap span{color:#da251c;}

header .menuWrap{
	float:right;
	margin-right:2em;	
}

/* Video box */
.video{
	background:url(../images/videoBg.jpg) no-repeat top center fixed;
	width:100%;
	position: relative;
	background-size: cover !important;
}

.video .videoWrap{
	width:980px;
	*width:auto;
	margin:0 auto;	
	text-align:center;
	padding:3em 0em;
	position: fixed;
	left: 0;
	right: 0;
}

.video .videoTitle{
	color:#d01400;
	font-family: 'franklin_gothic_demiregular';
	font-size:4.8em;
	text-transform:uppercase;
	text-shadow:1px 1px 1px #cad2b3;
	padding:0em;
	letter-spacing: -0.03em;
}
.video .videoDescription{
	padding: 0.2em 0em;
	margin-top: -0.5em;
}

.video .videoDescription p{
	font-family: 'ProximaNovaLtBold';
	font-size:1.8em;
	padding:0.1em 0em;
	text-shadow:0px 1px 1px #cad2b3;
}

.video .videoBox{
	padding:1em 0em;	
}

.pageScroll{
	width:100%;
	text-align:center;
	padding:0.5em 0 2em 0;
	font-family: 'franklin_gothic_demiregular';
	font-size:1.8em;
	text-transform:uppercase;
	color:#fff;
	
}

.pageScroll.fixed{
	position: fixed;
	right: 1em;
	top: 50%;
	width: 150px;
	z-index: 99999;
	color: #5E5E5E;

}

.pageScroll a{
	color:#fff;
	text-decoration:none;
}

.pageScroll img{
	 -webkit-animation-name: Floatingx;
    -webkit-animation-duration: 3s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: ease-in-out;
    -moz-animation-name: Floating;
    -moz-animation-duration: 3s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: ease-in-out;	
    margin: 1em 0em 0em 0em;
}


.scrollTop {
	display: inline-block;
	padding-bottom: 1em;
}

/* Video box css ends here */

/* Rainday Timeline */
.raindayTimeline{
	background:url(../images/timeline-bg.png) #fff repeat-y;
}

.raindayTimeline .monsoonStory{
	padding:3em 0em 3em 0em;
	max-width:1024px;
	margin:0 auto;	
	text-align:center;
}

.raindayTimeline .monsoonStory .title{
	text-align:center;
	font-size:2.8em;
	font-family: 'franklin_gothic_demiregular';
	text-transform:uppercase;	
	color:#C7C7C7;
	border-top:#B1B1B1 solid 3px;
	padding:0.5em 0em;
	display: inline-block;

}

.raindayTimeline .monsoonStory .raindayTV{
	position:relative;	
}

.raindayTimeline .monsoonStory .raindayTV .visitbtn{
	position:absolute;
	bottom:15%;
	right:0%;
	width:256px;
	height:60px;
	background:url(../images/visit-btn.jpg) no-repeat center center;
}

.raindayTimeline .monsoonStory .raindayTV .visitbtn:hover{
	background:url(../images/visit-btn-hover.jpg) no-repeat center center;
}



.raindaySlider{
	background:url(../images/rainday-pc.png) no-repeat top center;
	width:1005px;
	height:723px;
	padding-top:2.8em;	
}

.raindaySlider .slider{
	width:837px;
	margin:0 auto;
}

.raindaySlider .slider.flexslider{
	border:none;
	background:none;	
}

.raindayTimeline .monsoonStory .description{
	text-align:center;
	font-size:2em;	
	color:#525252;	
	padding:1.5em 0em 1.5em 0em;
	font-family: 'ProximaNovaLtBold';
	border-top:#B1B1B1 solid 3px;

}
.raindayTimeline .monsoonStory .description p span{
	text-transform:uppercase;
	font-size:1em;	
	font-family: 'proxima_novablack';
}

.raindayTimeline .predictions{
	background:url(../images/predictions.png) no-repeat top center;
	min-height:720px;	
	position: relative;
	margin-top: -10em;
	z-index: 9999;
}

.raindayTimeline .predictions img{
	position:absolute;	
	 -webkit-animation-name: Floatingx;
    -webkit-animation-duration: 3s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: ease-in-out;
    -moz-animation-name: Floating;
    -moz-animation-duration: 3s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: ease-in-out;
}

@-webkit-keyframes Floatingx{
    from {-webkit-transform:translate(0, 0px);}
    65% {-webkit-transform:translate(0, 15px);}
    to {-webkit-transform: translate(0, -0px);    }    
}

@-moz-keyframes Floating{
    from {-moz-transform:translate(0, 0px);}
    65% {-moz-transform:translate(0, 15px);}
    to {-moz-transform: translate(0, -0px);}    
}


.predictions1{
	left:25%;
}

.predictions2{
	left:10%;
	top:15%;
}

.predictions3{
	right:10%;
	bottom:15%;
}

.predictions4{
	left:0%;
	bottom:35%;
}

.predictions5{
	right:10%;
	bottom:45%;
}

.predictionsEntry{
	width: 300px;
	*width: auto;
	margin: 0 auto;
	text-align: center;
	display: block;
	position: absolute;
	left: -0.6em;
right: 0;
top: -19em;
		
}

.predictionsEntry .title{
	font-family: 'proxima_novablack';
	font-size:1.8em;
	color:#da251c;
	text-transform:uppercase;
	padding:0.2em 0em;	
}

.predictionsEntry .description{
	font-size:1.8em;
	font-family: 'ProximaNovaLtBold';
	color:#515151;
}


.leftTimeline {
	float: left;
	width: 45%;
	margin-right:0.5em;
}



.rightTimeline {
	float: left;
	width: 45%;
	
}

.boxPost{
	width: 100%;
	max-width:500px;
	float: right;
	margin: 4em 0;
	position:relative;
}

.boxPost img{
	border:	#a4a5aa solid 3px;
}

.boxPost .postImage.borderCurve img{
	border-radius:40px;	
	-webkit-border-radius:40px;
	-moz-border-radius:40px;
	-ms-border-radius:40px;
}

.boxPost .pointer{
	position:absolute;
	top:10%;	
	width:1.7em;
	height:2.7em;
}


.boxPost.post2 .pointer{
	top:55%;
}

.boxPost.post3 .pointer{
	top:29%;
}

.boxPost.post4 .pointer{
	top:49%;
}


.boxPost .pointer.left{
	background:url(../images/box-pointer-left.png) no-repeat top center;
	left:-1.5em;
}

.boxPost .pointer.right{
	background:url(../images/box-pointer-right.png) no-repeat top center;
	right:-2em;
}

.boxPostcontent{
	width:100%;
	max-width:350px;
	position:relative;
	padding:1em;
	margin:5.5em 0em;
		
}


.boxPostcontent .pointer{
	position:absolute;
	top:20%;	
	width:10em;
	height:1em;
}

.boxPostcontent .pointer.left{
	background:url(../images/box-pointer-right2.png) no-repeat top center;
	left:-10em;
}

.boxPostcontent .pointer.right{
	background:url(../images/box-pointer-left2.png) no-repeat top center;
	right:-10em;
}

.boxPostcontent .postTitle{
	font-weight:bold;
	font-size:1.9em;
	padding:0.5em 0; 
	font-family: 'ProximaNovaLtBold';
	
}

.boxPostcontent .postDescription{
	font-size:1.7em;
	font-family: 'ProximaNovaLtRegular';
	
}

.boxPostcontent.postTxt1 {
	padding-bottom: 2.5em;
}


.boxPostcontent.postTxt2 {
	margin: 4.8em 0em 4em 6em;
}

.boxPostcontent.postTxt3 {
	margin: 4.8em 0em 5.3em 0em;
}

.boxPostcontent.postTxt4{
	margin:5.5em 0em 5.3em 0em;
}


.leftTimeline .boxPostcontent{
	float:right;
	text-align:right;	
	margin-right:6em;
}

.rightTimeline .boxPostcontent .pointer{
	top:30%;	
}

.rightTimeline .boxPostcontent{
	float:left;
	text-align:left;
	margin-left:6em;	
}


.timelinePole {
	background:url(../images/timeline-bg-line.png) repeat-y center top;
	height: 160em;
	width: 8em;
	float: left;
	margin-top: -4em;
	z-index: 9999;
	position: relative;
}

.timelinePole .dot{
	position:absolute;	
	left:0;
	right:0;
}

.timelinePole .dot.dotStart{
	top:-1em;	
}

.timelinePole .dot.dot2{
	top:11em;	
}

.timelinePole .dot.dot3{
	top:50em;	
}

.timelinePole .dot.dot4{
	top:74.5em;	
}

.timelinePole .dot.dot5{
	top:105.8em;	
}

.timelinePole .dot.dot6{
	top:130em;	
}

/* Timeline ends Here */

.mumbaiPrediction{
	background:#000;
	text-align:center;
	padding:2em 0em;	
}

.collageImage img{
	-webkit-transition: all .8s ease-in-out;
	-moz-transition: all .8s ease-in-out;
	-o-transition: all .8s ease-in-out;
	-ms-transition: all .8s ease-in-out;
	transition: all .8s ease-in-out;
}

.Img1Wrapper,
.Img2Wrapper,
.Img3Wrapper{
	overflow: hidden;
	margin:0.5em;
	float:left;
	position: relative;
	display:block;
	cursor:move;
}

.transition {
    -webkit-transform: scale(1.1); 
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
}


/*responsive css*/

@media screen and (max-width: 1024px){

.Img1Wrapper,
.Img2Wrapper,
.Img3Wrapper{
	float: left;
	text-align:center;
}

.Img1Wrapper{
	width: 60%;
}

.Img2Wrapper{
	width: 38%;
}

.Img3Wrapper{
	width: 38%;
}

.wrapper{
	max-width:none;
	width:100%;	
	overflow:hidden;
}

.video{
	background: url(../images/videoBg.jpg) no-repeat top center;
	background-position: fixed;
}


.video .videoDescription p{
	text-shadow:none;	
}

.headerLHSWrap{
	width:90%;	
}

header .logo{
	width:39%;
	margin:0em;	
}

.video .videoDescription {
	width: 80%;
	margin: 0 auto;
}

.video .videoDescription p{
	font-size: 1.6em;

}
.raindayTimeline .monsoonStory .title{
	font-size:3.5em;	
}


.boxPostcontent.postTxt2 {
	margin-top: 5em;
}

.boxPostcontent.postTxt3 {
	margin-top: 5em;
	margin-bottom: 5em;
}

.boxPostcontent.postTxt4 {
	margin-top: 5.2em;
}


}