@media only screen and (min-width: 640px) and (max-width: 766px) {

.gridContainer {
	position:absolute;
	top:0;
	left:0;
	width:650px;
	height:776px;
}

.ndi-mainPic-start{
	position:absolute;
    top:0;
	left:0;
	width:328px;
	height:210px;
	background-color:#FFF;
	background-image:url(../images/mainImage_L.jpg);
	background-size:cover;
	z-index:10;	
}
.ndi-mainPic-on{
	position:absolute;
    top:16px;
	left:18px;
	width:169px;
	height:189px;
	background-color:#FFF;
	border-style:solid;
	border-width:4px;
	border-color:#FFF;
	-ms-transform: rotate(-5deg); /* IE 9 */
    -webkit-transform: rotate(-5deg); /* Safari */
    transform: rotate(-5deg);
	box-shadow:3px 3px 9px #000;	
	background-image:url(../images/mainImage_L.jpg);
	background-size:cover;
}
.ndi-headlineHolder-start{
	position:absolute;
    top:0px;
	left:248px;
	width:317px;
	height:190px;
	padding:20px 20px 0 65px;
	z-index:10;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,000000+18&0+0,1+19,1+91,1+91 */

background: rgba(237,237,237,0);
background: -moz-linear-gradient(left, rgba(237,237,237,0) 0%, rgba(0,0,0,0.78) 14%, rgba(0,0,0,1) 18%);
background: -webkit-gradient(left top, right top, color-stop(0%, rgba(237,237,237,0)), color-stop(14%, rgba(0,0,0,0.78)), color-stop(18%, rgba(0,0,0,1)));
background: -webkit-linear-gradient(left, rgba(237,237,237,0) 0%, rgba(0,0,0,0.78) 14%, rgba(0,0,0,1) 18%);
background: -o-linear-gradient(left, rgba(237,237,237,0) 0%, rgba(0,0,0,0.78) 14%, rgba(0,0,0,1) 18%);
background: -ms-linear-gradient(left, rgba(237,237,237,0) 0%, rgba(0,0,0,0.78) 14%, rgba(0,0,0,1) 18%);
background: linear-gradient(to right, rgba(237,237,237,0) 0%, rgba(0,0,0,0.78) 14%, rgba(0,0,0,1) 18%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ededed', endColorstr='#000000', GradientType=1 );
}
.ndi-headlineHolder-out{
	position:absolute;
    top:32px;
	left:850px;
	width:317px;
	height:180px;
	padding:30px 20px 0 65px;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,000000+18&0+0,1+19,1+91,1+91 */

background: rgba(237,237,237,0);
background: -moz-linear-gradient(left, rgba(237,237,237,0) 0%, rgba(0,0,0,0.78) 14%, rgba(0,0,0,1) 18%);
background: -webkit-gradient(left top, right top, color-stop(0%, rgba(237,237,237,0)), color-stop(14%, rgba(0,0,0,0.78)), color-stop(18%, rgba(0,0,0,1)));
background: -webkit-linear-gradient(left, rgba(237,237,237,0) 0%, rgba(0,0,0,0.78) 14%, rgba(0,0,0,1) 18%);
background: -o-linear-gradient(left, rgba(237,237,237,0) 0%, rgba(0,0,0,0.78) 14%, rgba(0,0,0,1) 18%);
background: -ms-linear-gradient(left, rgba(237,237,237,0) 0%, rgba(0,0,0,0.78) 14%, rgba(0,0,0,1) 18%);
background: linear-gradient(to right, rgba(237,237,237,0) 0%, rgba(0,0,0,0.78) 14%, rgba(0,0,0,1) 18%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ededed', endColorstr='#000000', GradientType=1 );
}
.ndi-gradientHolder{
	display:none;
}
.ndi-headline{
	margin-bottom:6px;
}
/*.ndi-headline{
	font-family: "Guardian Sans Cond Web", sans-serif;
	font-style:normal;
	font-weight: 700;
    font-size: 52px;
	line-height:54px;
	text-align:center;
	color:#000;
	text-shadow:none;
}*/
.ndi-btnContainer{
	position:absolute;
    top:217px;
	left:52px;
	width:545px;
	height:550px;
	padding:8px 0 0 8px;
}
.ndi-btn-off{
	float:left;
	width:99px;
	height:130px;
	background-color:#FFF;
	margin:0 8px 7px 0;
	opacity:1;
	-webkit-transition: all 0.5s ease-in-out 0s;
	-moz-transition: all 0.5s ease-in-out 0s;
	-ms-transition: all 0.5s ease-in-out 0s;
	-o-transition: all 0.5s ease-in-out 0s;
	transition: all 0.5s ease-in-out 0s;
}
.ndi-btn-off:hover{
	opacity:.6;
}
.ndi-btn-on{
	float:left;
	width:99px;
	height:130px;
	background-color:#FFF;
	margin:0 8px 7px 0;
	opacity:0.5;
	-webkit-transition: all 0.5s ease-in-out 0s;
	-moz-transition: all 0.5s ease-in-out 0s;
	-ms-transition: all 0.5s ease-in-out 0s;
	-o-transition: all 0.5s ease-in-out 0s;
	transition: all 0.5s ease-in-out 0s;
}
.ndi-tap{
	float:left;
	width:99px;
	height:90px;
	background-color:#FFF;
	padding-top:40px;
	margin:0 8px 7px 0;
	font-family: "Guardian Sans Cond Web", sans-serif;
	font-style:normal;
	font-weight: 700;
    font-size: 15px;
	line-height:15px;
	text-align:center;
	color:#000;
}
.ndi-btn-pic{
	position:relative;
    top:0;
	left:0;
    width:99px;
	height:99px;
	border-radius:58px;
	background-color:#FFF;
	overflow:hidden;
}
.ndi-gone-icon{
	position:relative;
    top:-135px;
	left:0;
    width:83px;
	height:83px;
	border-radius:58px;
	border-style:solid;
	border-color:#FF0004;
	border-width:8px;
	overflow:hidden;
	background-image:url(../images/crossOut.svg);
	background-repeat: no-repeat;
	background-position:center;
}
.ndi-btn-name{
    position:relative;
    bottom:5px;
	left:0;
    width:89px;
	height:26px;
	padding:8px 4px 0 4px;
	background-color:#FFF;
	border-style:solid;
	border-width:1px;
	border-color:#c6c6c6;
	border-radius:4px;
	font-family: "Guardian Sans Cond Web", sans-serif;
	font-style:normal;
	font-weight: 700;
    font-size: 17px;
	line-height:17px;
	text-align:center;
	color:#585858;
}
.ndi-btn-icon{
    position:relative;
    bottom:126px;
	left:0;
    width:26px;
	height:26px;
	border-radius:14px;
}
/*.love{
	background-image:url(../images/Heart.png);
	background-repeat: no-repeat;
	}
.thumbsUp{
	background-image:url(../images/thumbs.svg);
	background-repeat: no-repeat;
	background-position: top; 
	}
.thumbsDown{
	background-image:url(../images/thumbs.svg);
	background-repeat: no-repeat;
	background-position: bottom; 
	}*/
.arrowUp{
	background-image:url(../images/arrowUp.svg);
	background-repeat: no-repeat;
	background-size:cover;
	background-position: center; 
	}
.arrowDown{
	background-image:url(../images/arrowDown.svg);
	background-repeat: no-repeat;
	background-size:cover;
	background-position: center; 
	}
.noChange{
	background-image:url(../images/noChange.svg);
	background-repeat: no-repeat;
	background-size:cover;
	background-position: center; 
	}


.ndi-person-out{
	position:absolute;
    bottom:568px;
	left:700px;
	width:475px;
	height:200px;
}
.ndi-person-in{
	position:absolute;
    bottom:568px;
	left:147px;
	width:475px;
	height:200px;
	-webkit-transition: all 0.5s ease-in-out 0.5s;
	-moz-transition: all 0.5s ease-in-out 0.5s;
	-ms-transition: all 0.5s ease-in-out 0.5s;
	-o-transition: all 0.5s ease-in-out 0.5s;
	transition: all 0.5s ease-in-out 0.5s;
}
.ndi-person-text{
	position:absolute;
    top:0;
	left:207px;
	width:267px;
	height:185px;
	text-align:center;
}
.ndi-person-pic{
    position:absolute;
    top:7px;
	left:15px;
	width:169px;
	height:189px;
	background-color:#FFF;
	border-style:solid;
	border-width:4px;
	border-color:#FFF;
	-ms-transform: rotate(5deg); /* IE 9 */
    -webkit-transform: rotate(5deg); /* Safari */
    transform: rotate(5deg);
	box-shadow:3px 3px 9px #000;	
	overflow:hidden;
}

.ndi-key-in{
	position:absolute;
    bottom:0;
	left:0;
	width:360px;
	height:88px;
	padding:10px;
	-webkit-transition: all 0.5s ease-in-out 0.45s;
	-moz-transition: all 0.5s ease-in-out 0.45s;
	-ms-transition: all 0.5s ease-in-out 0.45s;
	-o-transition: all 0.5s ease-in-out 0.45s;
	transition: all 0.5s ease-in-out 0.45s;
	background-color:#FF0004;
}
.ndi-key-out{
	position:absolute;
    bottom:-130px;
	left:0;
	width:360px;
	height:88px;
	padding:10px;
	background-color:#FF0004;
}
.ndi-person-icon{
	display:inline-block;
	width:26px;
	height:26px;
	border-radius:14px;
	margin-top:3px;
}
.ndi-bodycopy-sans{
	font-family: "Guardian Sans Web", sans-serif;
	font-style:normal;
	font-weight: 400;
    font-size: 14px;
	line-height:15px;
	text-align:left;
	color:#000;
}
.odds{
	display:inline-block;
	font-family: "Guardian Sans Web", sans-serif;
	font-style:normal;
	font-weight: 700;
    font-size: 15px;
	line-height:15px;
	text-align:center;
	color:#000;
	position:relative;
	bottom:7px;
	height:34px;
	/*text-transform:uppercase;*/
}

.ndi-headlineBreak{
	display:block;
}
.resetButton_on {
	display:none;
}
.resetButton_off {
	display:none;
}
}