*{
	margin:0;
	padding:0;
	outline:0;
}
body{
	/*min-width:980px;*/
	font-family:Tahoma, Geneva, sans-serif;
	color:#333333;
	background-color:#f2f2f2;
	padding:58px 0 25px 0;
	font-size:12px;
}
.lte8 body{
 	background-color:white;
 }
.lte7 body {
	display:none;
}
a{
	color:#3333FF;
	text-decoration:none;
}
label,input[type="radio"]{
	cursor:pointer;
} 
p, .bltList li{
 	margin-top:8px;
 }
.bltList li{
 	margin-left:20px;
 }
.notMobileOrTablet a:hover{
	text-decoration:underline;
 }
.headerShim{
	position:fixed;
	width:100%;
	height:58px;
	background:#F2F2F2;
	opacity:0.90;
	filter:alpha(opacity=90); /* For IE8 and earlier */
	z-index:2;
	top:0;
	left:0;
}
.lte8 .headerShim{
	background:white;
}
.topBar{
	top:0;
	left:0;
	width:98%;
	height:54px;
	z-index:1;
	position:fixed;
	padding:2px 0;
	width:100%;
	z-index:3;
	margin:0;
}
.goldBackground{
	background: #eab92d; /* Old browsers */
	background: -moz-linear-gradient(top, #eab92d 0%, #c79810 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eab92d), color-stop(100%,#c79810)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #eab92d 0%,#c79810 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #eab92d 0%,#c79810 100%); /* Opera11.10+ */
	background: -ms-linear-gradient(top, #eab92d 0%,#c79810 100%); /* IE10+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eab92d', endColorstr='#c79810',GradientType=0 ); /* IE6-9 */
	background: linear-gradient(top, #eab92d 0%,#c79810 100%); /* W3C */

 }
.logo{
 	color:navy;
 	font-weight:bold;
 	font-size:30px;
 	font-family:verdana;
 	margin-left:10px;
 	cursor:pointer;
 	font-family:Tahoma, Geneva, sans-serif;
 	line-height:50px;

 }
 .logo .face{
 	color:white;
 	margin-left:-3px;
 	padding-top:4px;
 	text-shadow: 0px 0px 25px navy;
 	/* Safari */
	-webkit-transform: rotate(-10deg);	
	/* Firefox */
	-moz-transform: rotate(-10deg);
	/* IE */
	-ms-transform: rotate(-10deg);
	/* Opera */
	-o-transform: rotate(-10deg);
	/* Internet Explorer */
	/*filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=10);*/
}
.ie .logo .face{
	color:#999;
}
.notMobileOrTablet .logo:hover{
 	text-shadow: 0px 0px 25px navy;
 }
.topBar *{
	display:inline-block;
	vertical-align:top;
 }
.topBar #profilePicture{
	height:50px;
	width:50px;
	margin-left:10px;
 }
.friendAction{
 	float:right;
 	margin:22px 1% 0 0;
 }
 .photoLeft{
	 width:15%;
	 float:left;
	 vertical-align:top;
	 text-align:center;
 }
 .lastFriendBtnContainer .btn{
 	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	max-width:150px;
 }
.mobileOrTablet .contentBox .friendAction{
  	margin:11px 1% 0 0;
 }
.mobileOrTablet .contentBox .friendAction .btn{
 	font-size:22px;
 }

 #userName{
 	font-size:18px;
 	line-height:22px;
 	display: block;
 }
 #userRatings, #totalVotes{
 	line-height:18px;
 }
 
 .contentBox{
 	padding-bottom:10px;
 	margin:10px 1% 0 1%;
 	width:98%;
 	text-align:center;
 	background:white;
 	box-shadow:0 0 8px #888888;
 }
 .contentBox.topPadding{
 	padding-top:20px;
 }
.leftPanel{
	margin:15px auto 0 auto;
 	width:84%;
 	float:right;
 }
 
 
.friendPhoto{
	display:inline-block;
	width:47%;
	height:450px;
	border:1px solid #999999;
	padding:4px;
	text-align:center;
	vertical-align:top;
	background:white;
	cursor:default;
	border-radius:3px;
	-moz-box-shadow: 3px
	-webkit-box-shadow: 3px;
}
.friendPhoto.right{
	margin-right:0;
	margin-left:2%;
}
#photo1,#photo2{
	width:100%;
	height:450px;
	background-color:black;
	display:block;
}
.notMobileOrTablet .friendPhoto:hover{
	border:1px solid gold;
	text-decoration: none;
	
	-moz-box-shadow: 0 0 2px #666666;
	-webkit-box-shadow: 0 0 2px #666666;
	box-shadow: 0 0 2px #666666;     		
}
.thisPhoto{
	opacity:.6;
	-moz-opacity:.6;
	filter:alpha(opacity=6); /* For IE8 and earlier */
	
	width:70px;
	visibility: hidden;
	float:right;
	font-size:15px;
	text-align:left;
	color:#333333;
	padding:2px 2px 2px 24px;
	text-shadow: 0px 0px 1px #EEEEEE;
	background-image:url(images/facebook-icon.png);
	background-position: 2px 50%;
	background-repeat:no-repeat;
	background-color:#EEEEEE;
	line-height:16px;
	cursor:pointer;
}
.votePhoto{
	float:left;
	width:100px;
	height:32px;
	cursor:pointer;
}
.notMobileOrTablet .friendPhoto:hover .photoSlider{
	visibility: visible;
}
.notMobileOrTablet .friendPhoto:hover .thisPhoto{
	visibility: visible;
}
.notMobileOrTablet .thisPhoto:hover{
	 opacity:.8;
	-moz-opacity:.8;
	filter:alpha(opacity=8); /* For IE8 and earlier */
	text-decoration: none;
}
.compPhoto{
	width:100%;
	height:450px;
	background-color:black;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size:100%;
}
.mobileOrTablet .compPhoto{
	background-size:cover;
}
.notMobileOrTablet .friendPhoto:hover .compPhoto{
	/*background-size:200%;*/
	cursor:pointer;
}
.listPhotoWrapper{
	width:150px;
	display:inline-block;
	color:navy;
	font-weight:bold;
}
.listPhoto{
	display:inline-block;
	margin: 8px 8px 0 8px;
	text-align: center;
	cursor:pointer;
	line-height:15px;
	border:1px solid #999999;
	padding:1px;
}
.notMobileOrTablet .listPhoto:hover{
	border:1px solid #333333;
	-moz-box-shadow: 0 0 2px gold;
	-webkit-box-shadow: 0 0 2px gold;
	box-shadow: 0 0 2px gold;  
}
.notMobileOrTablet .ratingPhoto:hover{
	background-size: cover;
}
.notMobileOrTablet .listPhoto:hover .ratingScore, .notMobileOrTablet .lastUserPhoto:hover .ratingScore{
	background-image:url(images/facebook-icon.png);
	background-position:5px 50%;
	background-repeat:no-repeat;
	background-color:transparent;
	font-size:0px;
	/*padding-left:20px;
	border-color:#333333;*/
}
.ratingPhoto, .lastUserPhoto{
	height:130px;
	width:130px;
	background-color:black;
	background-position:50% 50%;
	background-repeat:no-repeat;
	position:relative;
}
.ratingScore{
    color:white;
    opacity:.8;
	-moz-opacity:.8;
	filter:alpha(opacity=8); /* For IE8 and earlier */
	 background-color: black;
    bottom: 0;
    left:0;
    font-size: 40px;
    font-weight: bold;
    line-height: 40px;
    position: absolute;
    text-align: center;
    width: 100%;
}
.lastScore{
	font-size:20px;
}

.lastFriendBtnContainer{
	padding:14px 0 15px 0;
}
.lastUserPhoto{
	cursor:pointer;
	margin: 0 auto;
	border-style:solid;
	border-width:1px;
	border-color:black;
	background-size: contain;
}
.notMobileOrTablet .lastUserPhoto:hover{
	background-size: cover;
}
.lastUserPhoto.win, .win .lastScore{
	border-color:#00FF00;
	color:#00FF00;
}
.lastUserPhoto.lose, .lose .lastScore{
	border-color:#FF0000;
	color:#FF0000;
}
.loader{
	margin:-250px 0 0 38%;
	float:left;
	cursor: progress;
	display:inline-block;
	border:0;
	color:white;
}
#content{
	text-align:center;
	min-height:80px;
}
.footer{
    color: #333333;
    font-size: 10px;
    line-height:15px;
    text-align: center;
    width: 100%;
   /* min-width:980px;*/
    margin-top:5px;
    position:fixed;
    bottom:0;
    left:0;
    z-index:3;
    height:15px;
}
.footerShim{
	position:fixed;
	width:100%;
	height:15px;
	background:#F2F2F2;
	opacity:0.90;
	filter:alpha(opacity=90); /* For IE8 and earlier */
	z-index:2;
	bottom:0;
	left:0;
}
.lte8 .footerShim{
	background:white;
}
.friendThumb{
 	background: white;
    border: 1px solid #999999;
    padding: 1px;
    margin-bottom: -18px;
    width:50px;
    height:50px;
    display:inline-block;
}
#friendName{
	margin:10px 0 10px 1%;
	height:50px;
	float:left;
	font-size:24px;
	text-align:left;
}
 #friendName a{
 	font-size:24px;
 	color:#333333;
 }
.notMobileOrTablet  #friendName:hover .friendThumb{
 	border-color:gold;
 
 	-moz-box-shadow: 0 0 2px #666666;
	-webkit-box-shadow: 0 0 2px #666666;
	box-shadow: 0 0 2px #666666;    
 }
.notMobileOrTablet  #friendName:hover a, .notMobileOrTablet #friendName a:hover{
 	/*text-shadow: 0 0 2px gold;*/
 	text-decoration: none;
 }
 
 /*----Buttons---*/
.btn{
	border-width:1px;
	border-style:solid;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
	cursor:pointer;
	font-size:16px;
	line-height:1.35;
	margin:0;
	overflow:visible;
	padding:3px 10px 2px;
	*padding:2px 10px 1px;
	text-decoration:none;
	vertical-align:top;
	width:auto;
	background:#ECECEC;
	background:-moz-linear-gradient(top,#FFF 0,#ECECEC 100%);
	background:-o-linear-gradient(top,#FFF 0,#ECECEC 100%);
	background:-webkit-gradient(linear,left top,left bottom,color-stop(0,#FFF),color-stop(100%,#ECECEC));
	background:linear-gradient(top,#FFF 0,#ECECEC 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF',endColorstr='#ECECEC',GradientType=0);
	border-color:#CCCCCC;
	color:#585858;
		padding:6px 10px 5px;

}
a.btn{
	display:inline-block;
	*padding:3px 10px;
}
.notMobileOrTablet a.btn:hover{
	text-decoration:none!important;
}
.notMobileOrTablet .btn:hover {
    background: -moz-linear-gradient(center top , #F0F0F0 0pt, #D7D7D7 100%) repeat scroll 0 0 transparent;
    border-color: #B3B3B3;
	background:#D7D7D7;
	background:-moz-linear-gradient(top,#F0F0F0 0,#D7D7D7 100%);
	background:-o-linear-gradient(top,#F0F0F0 0,#D7D7D7 100%);
	background:-webkit-gradient(linear,left top,left bottom,color-stop(0,#F0F0F0),color-stop(100%,#D7D7D7));
	background:linear-gradient(top,#F0F0F0 0,#D7D7D7 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#F0F0F0',endColorstr='#D7D7D7',GradientType=0);
	border-color:#b3b3b3;
}
.btn:active{
	background:#F7F7F7;
	background:-moz-linear-gradient(top,#DFDFDF 0,#F7F7F7 100%);
	background:-o-linear-gradient(top,#DFDFDF 0,#F7F7F7 100%);
	background:-webkit-gradient(linear,left top,left bottom,color-stop(0,#DFDFDF),color-stop(100%,#F7F7F7));
	background:linear-gradient(top,#DFDFDF 0,#F7F7F7 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#DFDFDF',endColorstr='#F7F7F7',GradientType=0);
	border-color:#b3b3b3;
}
.btn.big{
	font-size:20px;
}
.mobileOrTablet .btn{
	font-size:18px
}
a.fbBtn{
 	background-image: url("http://static.ak.fbcdn.net/rsrc.php/v1/yL/r/FGFbc80dUKj.png");
 	background-repeat:no-repeat;
 	background-position: -1px -139px;
 	background-color:#5F78AB;
    border: 1px solid #1A356E;
    color: #FFFFFF;
    display: inline-block;
    font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
    font-weight: bold;
    padding: 0 6px 0 30px;
    text-decoration:none !important;
    cursor:pointer;
    font-size:14px;
    line-height:23px;
}
.mobileOrTablet a.fbBtn{
	font-size:22px;
	line-height:37px;
	padding:0 6px 0 44px;
 	background-position: -1px -100px;
}
.notMobileOrTablet .fbBtn:hover{
    border-top: 1px solid #879AC0;
    border-left: 1px solid #879AC0;

}
.accentColor{
	color:orange;
}
.definition{
	border:1px solid #DDDDFF;
	background:#EEEEFF;
	font-family:'Lucida Grande','Lucida Sans Unicode',Verdana,sans-serif;
	color:#5E5E5E;
	font-size: 18px;
	line-height: 26px;
	margin: 15px 1% 35px;
	display:inline-block;
	padding:10px;
}
.definition .lighter{
	color:#8E8E8E;
}
.mobileOrTablet .definition{
	font-size: 15px;
	text-align:left;
}
.mobileOrTablet .definition .word{
	display:block;
}

.splashRight{
 	float:right;
 	margin:0 5%;
 	width:39%;
	font-family:'Lucida Grande','Lucida Sans Unicode',Verdana,sans-serif;
	color:#5E5E5E;
	font-size: 18px;
	line-height: 26px;
	text-align:left;display:inline-block;
	box-shadow 1px 0 0 #888;
}
.splashLeft{
	float:left; 
	width: 48%;
	margin-left:1%;
}

.fbLoginDiv{
	font-family:'Lucida Grande','Lucida Sans Unicode',Verdana,sans-serif;
	color:#5E5E5E;
	font-size: 18px;
	line-height: 26px;
	overflow:hidden;
	margin:20px 5% 0 5%;
	width:39%;
	float:right;
	text-align:left;
}

.photoSlider{
	width:94%;
	visibility: hidden;
	bottom:30px;
	left:3%;
}
.lte8 .photoSlider{
	display: none;
}
.ui-slider .ui-slider-handle {
	width:0.7em;
	height:1.8em;
}
.ui-slider-horizontal .ui-slider-handle{
	top: -0.9em;
}
.ui-slider-horizontal{
	height: 0.2em;
}
	

/*facebok comments iframe*/
.fb_iframe_widget iframe {
	background:white;
}

/* For modern browsers */
.clearFix:before,
.clearFix:after {
    content:"";
    display:table;
}
.clearFix:after {
    clear:both;
}
/* For IE 6/7 (trigger hasLayout) */
.lte7 .clearFix {
    zoom:1;
}


/*----Icons-----*/
.icon{
    height: 16px;
	width:16px;
	display:inline-block;
  	background-image: url("images/iconSprite.png");
  	cursor:pointer;
}
.greenCheckIcon{
    background-position: -81px -27px;

}
.redCrossIcon{
    background-position: -1px -78px;
}

.filter{
	width:96%;
	margin:5px 1%;
	border:1px solid #DDDDFF;
	background:#EEEEFF;
	padding:1%;
	text-align:left;
	border-radius:5px;
}

.ui-combobox {
	position: relative;
	display: inline-block;
}
.ui-button {
	position: absolute;
	top: 0;
	bottom: 0;
	margin-left: -1px;
	padding: 0;
	/* adjust styles for IE 6/7 */
	*height: 1.7em;
	*top: 0.1em;
}
.ui-autocomplete-input {
	margin: 0;
	padding: 0.3em;
}
select, select option{
	color:#777777;
	font-size: 13px;
	padding:2px 0;
}


/* Portrait */
@media screen and (orientation:portrait) {
    /* Portrait styles */
    body{
    	padding:65px 0 25px 0;
    }
    .splashLeft{
		margin:0 1% 20px 1%;
		width:98%;
	}
	.splashRight{
		margin:0 1%;
		width:98%;
	}
	.friendPhoto{
		margin:0 1% 20px 1%;
		width:95.5%;
		padding:1%;
	}
	.friendPhoto.right{
		margin:0 1%;
	}
	.fbLoginDiv{
		margin: 20px 1% 0 1%;
		width:98%;
	}
	.mobileOrTablet .fbLoginDiv{
		font-size:25px;
	}
	 .photoLeft{
	 	float:right;
		 width:100%;
		 vertical-align:top;
		 text-align:center;
		 margin-bottom:15px;
	 }
	 .contentBox.leftPanel{
	 	float:right;
	 	width:98%;
	 	margin:0 1%;
	 }
	.lastFriendBtnContainer{
		display:inline-block;
		vertical-align:top;
		padding:55px 25px 0 0;
	}
	.lastFriendBtnContainer .btn{
		overflow:visible;
	}
	.mobileOrTablet .lastFriendBtnContainer .btn{
		font-size:22px;
		max-width:300px;
	 }
	/*.mobileOrTablet .compPhoto{
		height:500px;
	}*/
}
/* Landscape */
@media screen and (orientation:landscape) {
    /* Landscape styles */
    .mobileOrTablet .fbLoginDiv{
    	margin:40px 5% 0 5%;
    }
    .mobileOrTablet .definition{
		font-size: 11.5pt;
	}	
	.mobileOrTablet .photoLeft .friendAction .btn{
		max-width:100px;
	 }
}	