@charset "utf-8";
/* Common Styles */

* {margin:0;padding:0;list-style-type:none;outline:none;text-decoration:none;border:none;
font-family: Arial, Helvetica, sans-serif;font-size: 12px;}

a, a:hover, a:selected, a:visited{ color:#662600; }

.clear {clear:both;}

textarea {
    resize: none;
}

.cursorPointer {cursor:pointer;}

.seudoLink{
    text-decoration: none;
    color:#999999;
}

.seudoLink:hover{
    text-decoration: underline;
    color:#999999;
}


body {
	background: #000 url(http://media02.gameloft.com/layout/default/web/minisites/glive/images/bodyBg.jpg) repeat;
}
		
#container {
	width: 1079px;
	margin: auto;
	position: relative;
}

	#container h4 {
		font-size: 14px;
		font-weight: bold;
		color:#a8a8a8;
		padding: 10px 0 10px 10px;	
	}
	
	#leftRanking {
		float: left;
		display: inline;
		margin-top: -70px;
		margin-left: 60px;
	}
	
			#main h5 img {
				margin: 0 2px 0;
				width: 10px;
				height: 8px;
			}
			
		#rankingInfo ul {float:left;}
		
		
/* Header Section */

	#header {
		background:url(http://media01.gameloft.com/layout/default/web/minisites/glive/images/header.png) no-repeat scroll 0px 0;
		height: 190px;
	}

		#logo{
				background:url("http://media02.gameloft.com/layout/default/web/minisites/glive/images/logo.png") no-repeat scroll 0 0 transparent;
				height:113px;
				margin:-2px 0 0 85px;
				position:absolute;
				width:150px;
			}
			
			#logo a{
				display:block;
				float:left;
				height:113px;
				margin:0 0 23px 5px;
				text-indent:-999999px;
				width:149px;
			}

		.members {
			position: absolute;
			top: 79px;
			left: 445px;
			color:#fff;
		}
		
			.members span {
				font-size: 14px;
				font-weight: bold;
				color:#fff;
			}
		
			.members p {
				font-size: 13px;
				color:#fff;
				display: inline;
			}

		#leftSection {
			position: absolute;
			top: 78px;
			left: 252px;
		}

			#leftSection li {
				display: inline;
				margin-left: 20px;
			}

				#leftSection li.noMargin, 
				.loginSection p.noMargin, 
				.scoreContainer img.noMargin, 
				#scoreText p.noMargin {
					margin: 0;	
				}
				
				#leftSection li.noMargin.home {
					position: relative;
					top: -2px;
				}
				
				#leftSection li.noMargin.logout {
					position: relative;
					left: 20px;
					top: -2px;
				}

		#rightSection {
			position: absolute;
			top: 77px;
			left: 725px;
			width:323px;
		}
		
			#search {
				float: left;
				/*margin-right: 20px;*/
				position: relative;
				top: -4px;
			}
			
				#search  input {
					background-color:#e3e3e3;
					height: 20px;
					position:relative;
					top: -3px;
				}
				
				#search  img {
					position: relative;
					top: 4px;
					left: -3px;
                    cursor: pointer;
				}
				
			#gameloftStore {
				float: right;	
			}
		

/* End Header Section */

/* Next and Prev buttons for all the rankings */

/* Pager Login.php and profile.php */
#pagerLinksHome{
	width:200px; height:50px;
	position:absolute; left:300px; top:571px;}


#pagerLinks {
	float: right;
	width: 200px;
	height: 50px;
    text-align: left;
}

	#pagerLinks h5 {
		color:#FFAA00;
		font-weight:lighter;
		margin:10px 20px 10px 0;
		text-align:right;	
	}


#pagerLinksLeft {
	float: left;
	width: 200px;
	height: 50px;
    color:#ffaa00;
    font-weight: bold;
    text-align: left;
    margin: 10px 20px 10px 10px;
    cursor:pointer;
}

#rankingNext, #rankingPrev {
	cursor: pointer;
	position: absolute;
	top: 15px;
}

#rankingNext {	
	right: 5px;
	width: 90px;
}

#rankingPrev {
	right: 105px;
	width: 105px;
}	

#publicRankingNext, #publicRankingPrev {
	cursor: pointer;
	position: absolute;
	top: 8px;
}

#publicRankingNext {	
	right: 5px;
	width: 90px;
}

#publicRankingPrev {
	right: 105px;
	width: 105px;
}	

/*******************************************/

/* Ranking common classes */


/* Loading images */
.loading {
	background-color:#dddddb;
	clear: both;
	height: 55px;
	text-align: center;
	height: 480px;
}

.loading img, .loading p {
	position: relative;
	top: 260px;
}

.loading2 {
	background-color:#dddddb;
	text-align: center;
	height: 720px;
}

.loading2 img {
	position: relative;
	top: 360px;
}

.loading3 {
background-color:#DDDDDB;
height:444px;
text-align:center;
}

.loading3 img {
	position: relative;
	top: 222px;
}

.loadingFriends {
	background-color:#dddddb;
	clear: both;
	text-align: center;
	height: 628px;
}

.loadingFriends img {
	position: relative;
	top: 340px;
}
/* End Loading images */

.disabled {
	color:#ccc !important;
	font-style: italic;
	cursor:default !important;
}

.hoverBg {
	background:url(http://media02.gameloft.com/layout/default/web/minisites/glive/images/columnBgHover.jpg) repeat-x !important;
}

.hoverBg2 {
	background:#fff url(http://media02.gameloft.com/layout/default/web/minisites/glive/images/columnBgHover.jpg) repeat-x scroll 0 9px !important;
}

input.error {
	background-color:#ff0000;
}

/* Online/Offline images */
.connection {
	clear: both;
	text-align: right;
	margin-right: 5px;
}

	.connection label {
		float: left;
		font-size: 10px;
		margin-left: 12px;
		text-align: left;
		width: 150px;
	}
	
	.connection p {
		display: inline;
		font-size: 11px !important;
		font-weight: lighter;
		margin-left: 3px;
		position: relative;
		top: -2px;
	}
	
	.connection img {
		height: 9px;
		width: 9px;
		position: relative;
		top: -1px;
	}
/* End Online/Offline images */	

		
/* End Common Styles */



/* Ranking Section */

	#main2 {
		width: 775px;
		margin-left: 271px;
		margin-top: -70px;
		border: 1px solid #dddddb;	
		background-color:#fff;
		overflow: hidden;
		position: relative;
	}
	
	.websitelink { 
		position: absolute;
		top: 350px;
		left: 550px;
	}
	
	.websitelink a {
		color:#fff;	
	}
	
	.btnLf{
		float:left; width:15px; height:35px;
		background-image:url(http://media01.gameloft.com/layout/default/web/minisites/glive/images/officialborderleft.png);}
		
	.btnMd{ 
		float:left; height:35px;
		padding-left:10px; padding-right:10px; padding-top:10px;
		font-weight:bold;
		background-image:url(http://media01.gameloft.com/layout/default/web/minisites/glive/images/officialrepeat.png); background-repeat:repeat-x}
	
	.btnRg{
		float:left; width:15px; height:35px;
		background-image:url(http://media01.gameloft.com/layout/default/web/minisites/glive/images/officialborderright.png);
		background-position: -2px 0;}

	
		#main2 span {
			font-weight: bold;
			display: block;
		}
		
				#main2 h5 a {
					color:#ffaa00;
					font-weight: bold;
				}

	#main h4, 
	#friends h4  {
		font-size: 14px;
		font-weight: bold;
		color:#a8a8a8;
		padding: 10px 0 10px 10px;
	}

	#main3 {
		width: 775px;
		margin-left: 271px;
		margin-top: -70px;
		background:url(http://media02.gameloft.com/layout/default/web/minisites/glive/images/trophyImageSelectorBg.png) no-repeat;

	}
	
			#main3 h4 span {
				color:#636363;
				margin-left: 15px;
			}

/* Common Ranking Styles */
	/*	
		.title1 li, .title2 li, .title3 li, .title4 li, .title5 li, 
		.title1.titleranking1 li, .title2.titleranking2 li, .title3.titleranking3 li, 
		.title4.titleranking4 li, .title5.titleranking5 li, .title6.titleranking6 li, 
		.title1.titlefriendslist1 li, .title2.titlefriendslist2 li, .title3.titlefriendslist3 li, 
		.title4.titlefriendslist4 li, .title5.titlefriendslist5 li {
			background:url(http://media02.gameloft.com/layout/default/web/minisites/glive/images/listBg.jpg) repeat-x;
			height: 27px;
			padding: 0;
		}
		
			.title1 li p, .title2 li p, .title3 li p, .title4 li p, .title5 li p,
			.title1.titleranking1 li p, .title2.titleranking2 li p, .title3.titleranking3 li p, 
			.title4.titleranking4 li p, .title5.titleranking5 li p, .title6.titleranking6 li p, 
			.title1.titlefriendslist1 li p, .title2.titlefriendslist2 li p, .title3.titlefriendslist3 li p, 
			.title4.titlefriendslist4 li p, .title5.titlefriendslist5 li p{
				font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
				text-transform: uppercase;
				color:#a8a8a8;
				text-align: center;
				font-size: 10px;
				font-weight: bold;
			}
	*/	
		.column1 li, .column2 li, .column3 li, .column4 li, .column5 li {
			background:url(http://media02.gameloft.com/layout/default/web/minisites/glive/images/columnBg.jpg) repeat-x;
			height: 48px;	
		}
		
		.column1.ranking1 li, .column2.ranking2 li, .column3.ranking3 li, .column4.ranking4 li, .column5.ranking5 li, 
		.column6.ranking6 li, .column1.friendslist1 li, .column2.friendslist2 li, .column3.friendslist3 li, 
		.column4.friendslist4 li, .column5.friendslist5 li, #friends li, #news li{
			background:url(http://media02.gameloft.com/layout/default/web/minisites/glive/images/columnBg.jpg) repeat-x;
			height: 55px;
		}
		
			.userInfo {
				overflow: hidden;
			}
			
				.userInfo ul {
					border-right: none !important;	
					position: relative;
					left: 13px;
					float: left;
				}
				
				.userInfo ul li {
					display:inline;
					height:16px;
					background: none;
				}
				
				.userInfo ul li img {
					width: 13px !important;
					height: 12px !important;
					margin-left: 0px !important;
				}
			
				.userInfo p {
					font-size: 11px;
					color:#484544;
					margin-top: 5px;
				}
			
				.userInfo .stars {
					border-right: none !important;	
				}
				
				.userInfo span.lastGame{
					color:#666666; font-size:10px; font-style:italic;
					position:absolute; left:127px; top:80px;}
            
            .newUserInfo {
                overflow: hidden;
                position: relative;
                left: -30px;
            }

                .newUserInfo ul {
                    border-right: none !important;	
                    position: relative;
                    left: 13px;
                    float: left;
                }
                
                .newUserInfo ul li {
                    display:inline;
                    height:16px;
                    background: none;
                }
                
                .newUserInfo ul li img {
                    width: 13px !important;
                    height: 12px !important;
                    margin-left: 0px !important;
                }

                .newUserInfo p {
                    font-size: 11px;
                    color:#484544;
                    margin-top: 5px;
                }

                .newUserInfo .stars {
                    border-right: none !important;	
                }
                
                .newUserInfo span.lastGame{
                    color:#666666; font-size:10px; font-style:italic;
                    position:absolute; left:127px; top:80px;
                }
   
			.column1 li p, .column2 li p, .column3 li p, .column4 li p, .column5 li p,  
			.column1.ranking1 li p, .column2.ranking2 li p, .column3.ranking3 li p, .column4.ranking4 li p, 
			.column5.ranking5 li p, .column6.ranking6 li p, .column1.friendslist1 li p, .column2.friendslist2 li p, 
			.column3.friendslist3 li p, .column4.friendslist4 li p, .column5.friendslist5 li p{
				font-size: 18px;
				font-weight: bold;
				color:#a8a8a8;
				text-align: center;
				padding-top: 15px;
			}

			.column2 li span, .column2.ranking2 li span, .column2.friendslist2 li span{
				color:#662600;
				padding: 0;
				border: none;
				font-family: Arial, Helvetica, sans-serif;
				display: block;
				overflow: hidden;
				font-weight: bold;
			}
		
			.column2 li label, .column2.ranking2 li label, 
			.column2.friendslist2 li label, #friends li label{
				font-size: 11px;
				color:#484544;
			}
			
			.column2 li img.user {
				width: 40px;
				height: 40px;	
				margin: 3px 13px 0px 12px;	
				display: inline;
				float:left;
				padding: 0;
			}
			
			.column2.ranking2 li img.user, 
			.column2.friendslist2 li img.user, #friends li img.user{
				margin: 3px 13px 0px 5px;	
				display: inline;
				float:left;
				width: 50px;
				height: 50px;
				padding: 0;
			}
		
				.column2 li div ul, .column2.ranking2 li div ul, 
				.column2.friendslist2 li div ul, #friends li div ul{
					float:none; 
				}	
		
					.column2 li div ul li, .column2.ranking2 li div ul li, 
					.column2.friendslist2 li div ul li, #friends li div ul li{
						display:inline;
						height:16px;
						background: none;
					}
		
		
		.column3 div.flagsRanking {
			width:48px;
			height:48px;
			margin:0px auto;
		}
		
				.column3 li img, .column3.ranking3 li img, .column3.friendslist3 li img{
					height:20px;
					display:inline;
				}
		
		.column4 li p, .column5 li p, .column6 li p, .column4.ranking4 li p, 
		.column5.ranking5 li p, .column6.ranking6 li p, .column4.friendslist4 li p, .column5.friendslist5 li p{
			font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
			font-size: 14px;
			color:#484544;
			text-align: center;
			padding-top: 15px;	
			border: none;
		}
		
/* End Common Table Styles */


/* Send Friend Request Section */

.friendRequestWindow {
	/*width: 430px;
	height: 120px;
	padding: 10px;*/
	background-color:#fff;
}
    .floatFlag{
        position:absolute;
        top: 135px;        
        left:17px;
        height: 30px;
        width: 30px;
    }
    
    .floatFlagRequest{
        height:30px;
        left:-90px;
        position:relative;
        top:60px;
        width:30px;
        float:  left;
    }
     
    .floatFlagDelete{
        position: absolute;
        left:30px;
        top:140px;
        height:30px;
        width:30px; 
    }
    
    .controlButtons{
        margin-top:-20px;
        text-align:right;
        float: right;
        width: 270px;
    }

	#friendRequestWindowContainer {
		width: 393px;
		margin: auto;
	}

	#friendRequestWindowDl {
		float: left;
		display: inline;
		width: 440px;
	}
        
	#floatWin .topClose{
        height:40px;
        float:right;
        margin-top:-10px;
        margin-right:-5px;
        position:relative;
        overflow:hidden;
    }
    
        .friendRequestWindow dd {
			background-color:transparent;
            background-image:url("http://media02.gameloft.com/layout/default/web/minisites/glive/images/columnBg.jpg");
            background-position:0 80px;
            background-repeat:repeat-x;
            height:110px;
		}
		
			.friendRequestWindow dd img.user {
				float: left;
				height: 80px;
				width: 80px;
				margin-left: 18px;
			}
			
			.friendRequestWindow dd .userInfo a span {
				color:#662600;
				font-weight: bold;
				display: block;
				left: 15px;
				position: relative;
			}
            
            .friendRequestWindow dd .newUserInfo a span {
				color:#662600;
				font-weight: bold;
				display: block;
				left: 15px;
				position: relative;
			}
			
			.friendRequestWindow dd .connection {
				text-align: left;	
				margin: 0 0 0 15px;
			}
		
        #deleteDD{
            background-color:transparent;
            background-image:url("http://media02.gameloft.com/layout/default/web/minisites/glive/images/columnBg.jpg");
            background-position:0 27px;
            background-repeat:repeat-x;
            height:90px;
        }
        
		#friendRequestWindowForm {
			/*clear: both;*/
			padding-top: 10px;
			width: 440px;
			margin: auto;
		}
		
        #titleBar{
            background-color:#DDDDDD;
            color:#FFFFFF;
            font-size:18px;
            margin:-40px -10px 10px -20px; /*-20px -20px 10px -20px;*/
            padding:10px;
        }

        #titleBarDelete{
            padding-top: 20px;
            background-color:#DDDDDD;
            color:#FFFFFF;
            font-size:18px;
            margin:-20px -20px 10px -20px;
            padding:10px;
        }

        #titleBarRequest{
            background-color:#DDDDDD;
            color:#FFFFFF;
            font-size:18px;
            margin:-20px -20px 10px;
            padding:10px;
        }

        #requestMessage{
			height:37px;
			left:240px;
			margin-top:5px;
			position:absolute;
			text-align:center;
			top:100px;
			width:230px;
		}
		
			.friendRequestWindow label {
				display: block;	
				color:#484544;
			}
			
			.friendRequestWindow input {
				border:1px solid #ccc;
				height: 21px;
				margin: 10px 0 10px 0;
				width: 381px;
			}
			
			.friendRequestWindow input.buttonEdit {
				width: 103px;
				float: right;
				display: inline;
				margin-left: 10px;
			}
/* End Send Friend Request Section */

#searchTitle{
    background-color:#DDDDDD;
    color:#FFFFFF;
    font-size:18px;
    margin:-20px;
    padding: 10px 30px 10px 10px;
}

#requestMessage2{
    clear:both; 
    padding-top:15px;
    text-align:center;
}

#loginImg{
    padding-bottom:10px; 
    position:relative; 
    top:-30px;
}

/*begin rate friend section */

    #rateFrienWindowForm {        
        padding-top: 10px;
        width: 440px;
        margin: auto;
        left: 183px;        
        position: relative;
        top: -20px;       
    }
    
    #rateTitle{
        background-color:#DDDDDD;
        color:#FFFFFF;
        font-size:18px;
        margin:-41px -10px 10px -20px;
        padding:10px;
    }
/*end rate friend section */


#searchFriendsContainer{
	border:1px solid #DDDDDB;
	margin:0 0 10px 10px;
	overflow:hidden;
	width:511px;}

	#searchFriendsContainer div.sectionTitle{
		background:url("http://media02.gameloft.com/layout/default/web/minisites/glive/images/listBg.jpg") repeat-x scroll 0 0 transparent;
		height:27px;
		overflow:hidden;
		position:relative;
		text-align:left;}

	#searchFriendsContainer div.sectionTitle h4{
		font-size: 14px;
		font-weight: bold;
		color:#a8a8a8;
		padding: 10px 0 10px 10px;
	}

	#searchFriendsContainer div#searchBody{
		padding:10px; color:#484544;
		background-color:#FFF;}


    	#searchFriendsForm {
            bottom: 2px;
            width: 450px;
            padding-left: 8px;
			margin: 10px 0 10px 0;
        }
	
		#searchFriendsForm div.button {
			background:url("http://www.mdc.gameloft.org/common/layout/default/web/minisites/glive/images/select.jpg") no-repeat scroll 0 0 transparent;
            color:#171717;
            float:left;
            font-weight:bold;
            height:22px;
            padding-left:10px;
            padding-top:3px;
            width:63px;
            cursor: pointer;
        }
	
		#searchFriendsForm #searchFriendName2 {
			float:left;
            border:1px solid #C9C9C9;
            height:17px;
            padding-top:3px;
            width:310px;
		}

		#searchFriendsForm #searchFriendsBtn, #searchFriendsForm #goToEditMyProfile {
			
			background:url("http://media02.gameloft.com/layout/default/web/minisites/glive/images/userPanelButtonBg.jpg") repeat-x scroll 0 0 transparent;
			border:1px solid #DDDDDB;
			color:#636363;
			cursor:pointer;
			display:block;
			font-weight:bold;
			height:17px;
			margin-bottom:10px;
			width:103px;
		}
/*Begin sectio suggestion a friend*/

#suggestionContainer {
	width: 200px;
	background-color:#fff;
	border: 1px solid #dddddb;
	margin-top: 10px;
	overflow: hidden;
}

.suggestionTitle{
    background:url("http://media02.gameloft.com/layout/default/web/minisites/glive/images/listBg.jpg") repeat-x scroll 0 0 transparent;
    height:27px;
    overflow:hidden;
    position:relative;
    text-align:left;
    }

.btn_suggestion{
    padding: 5px 5px 5px 10px;
    cursor:pointer;
}

#suggestionsContent {
	width: 486px;
	height: 330px;
}

    #suggestionsContent #message{
        height: 80px; 
        display: inline;
        border:1px solid #C1C1C1;
        padding:5px;
        width:468px;
        margin-left: 2px;
    }
    
    #suggestionsContent label{
        display:block;
        font-weight:bold;
    }
    
	#suggestionsContent h2 {
		color:#484544;
		font-size: 17px;
		text-align: center;
		margin: auto auto 10px auto;
		width: 400px;       
	}
	
	#suggestionsContent ul {
		margin: 20px auto;
		width: 422px;
		text-align: center;
	}
	
		#suggestionsContent ul li {
			display: inline;
			float: left;
			margin-right: 40px;
		}
		
		#suggestionsContent ul li.noMargin {
			margin-right: 0;	
		}
		
			#suggestionsContent ul li img {
				cursor: pointer;	
			}

#suggestionsbuttons{
    width: 476px;
	height: 25px;
    margin:auto auto 10px;
    border: 1px solid #C1C1C1;
    overflow: hidden;
}

#suggestionsbuttons div h5{
    color:#FFAA00;
    font-weight:lighter;
    margin:6px 20px 10px 0;
    text-align:right;	
    cursor: pointer;
}

#suggestionsList{
    width: 476px;
	height: 80px;
    margin:auto auto 0px;
    border: 1px solid #C1C1C1;
    overflow: hidden;
}

#selectedList{
    width: 476px;
	height: 50px;
    margin: auto auto 10px;
    border: 1px solid #C1C1C1;
    overflow: auto;
}   

.friend_off{
    float:left;
    padding:5px;
    height:70px;
    width:55px;
    text-align: center;
    cursor: pointer;
    color: #000000;
    background: none repeat scroll 0 0 #FFFFFF;    
}

.friend_on{
    float:left;
    padding:5px;
    height:70px;
    width:55px;
    text-align: center;
    cursor: pointer;
    color: #FFFFFF;
    background: url("http://media02.gameloft.com/layout/default/web/minisites/glive/images/friend_selected_background.png") no-repeat scroll 50px 45px #526EA6;    
}

.selectedFriend{
    background:none repeat scroll 0 0 #F2F2F2;
    float:left;
    margin-bottom:4px;
    margin-right:3px;
    padding:3px;
}

.closeFriend{
    background:url("http://media02.gameloft.com/layout/default/web/minisites/glive/images/friend_selected_remove.png") no-repeat scroll left top transparent;
    cursor:pointer;
    width: 15px;
}

#radioButtons{
    text-align: right;
    padding: 5px;
    margin-top:10px;
}

#radioButtons label{
    margin-left: 15px;
    margin-right: 3px;
    display:inline;
}

.orangetext{
    color:#FFAA00;
    font-weight:bold;
}
/* end section suggestion a friend*/