
/* 
	rose:  #db536a;
	maroon: #602320;
	grey: #968c6d;
*/

	#mapcontainer *{
		margin: 0;
		padding: 0;
		line-height: normal;
	}

	#mapcontainer{
		height: 530px; 
		width: 750px;
		/*border: 2px solid #333;*/
		position: relative;
		background-image: url('background.png');
	}
	
	#mapcontainer div.box{
		position: absolute;
		color: white;
		font-family: georgia;
	}
	#mapcontainer div.boxcontainer{
		display: none;
		position: absolute;
	
	}
	#mapcontainer div.eleven.box{
	
		background-color: #db536a;
	}
	
	#mapcontainer div.twenty.box{
	
		background-color: #602023;
	}
	
	#mapcontainer div.change.box{
	
		background-color: #939598;
	}
	
	#mapcontainer div.eleven.box, #mapcontainer div.twenty.box{
		height:  167px;
		width: 270px;
	}
	
	#mapcontainer div.change.box {
		height:  90px;
		width: 185px;
	}
	
	#mapcontainer div.eleven.box p, #mapcontainer div.twenty.box p, #mapcontainer div.change.box p{
		font-size: 21px;
		line-height: 24px;
		position: absolute;
	}
	
		#mapcontainer div.box p.intro{
			top: 20px;
			left: 15px;
		}
		
	#mapcontainer div.box div.bignumber{
		position: absolute;
		font-size: 70px;
		font-weight: bold;
		left: 132px;
		top: 33px;
	}	
	
	#mapcontainer div.box div.bignumber span{
		display: block;
		font-size: 24px;
		position: absolute;
		right: -22px;
		top: 25px;
	}
	
	#mapcontainer div.box p.detail{
		bottom: 20px;
		left: 15px;
	}
	
	#mapcontainer div.box div.tail{
		position: absolute;
	}
	
	#mapcontainer div.box.eleven div.tail{
		/*border-color:  #db536a;*/
	}
	
	/*#mapcontainer div.eleven div.tail.bottom.lefty{
			background-image: url('../rose/bottomleft.png');
			height: 26px;
			width: 46px;
			bottom: -26px;
		
	}*/
	
	/*Arrows*/
		/*Bottom Left*/
		#mapcontainer div.tail.bottom.lefty {
		   -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1, M12=-0.5773502691896246, M21=0, M22=1, SizingMethod='auto expand')";
		   filter: progid:DXImageTransform.Microsoft.Matrix(
					M11=1,
					M12=-0.5773502691896246,
					M21=0,
					M22=1,
					SizingMethod='auto expand');
		   margin-left: -3px; 
		   margin-top: -3px;
		} 
		#mapcontainer div.tail.bottom.lefty {
			border-bottom: 38px solid transparent;
			border-left: 40px solid #db536a;
			border-top: 6px solid transparent;
			height: 0;
			left: 50px;
			position: absolute;
			top: 161px;
			width: 0;
			-moz-transform:    skewX(-30deg);
			-o-transform:      skewX(-30deg);
			-webkit-transform: skewX(-30deg);
			transform:         skewX(-30deg);
		}
		#mapcontainer div.tail.bottom.lefty.change {
			top: 70px;
		}
		
		/*Bottom Right*/
		#mapcontainer div.tail.bottom.righty {
			-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1, M12=1.732050807568877, M21=0, M22=1, SizingMethod='auto expand')";
   
			filter: progid:DXImageTransform.Microsoft.Matrix(
            M11=1,
            M12=1.732050807568877,
            M21=0,
            M22=1,
            SizingMethod='auto expand');
		   margin-left: -3px; 
		   margin-top: -3px;
		   margin-left: -65px\9; 
		   margin-top: -6px\9;
		} 
		#mapcontainer div.tail.bottom.righty {
			border-bottom: 38px solid transparent;
			border-left: 40px solid #db536a;
			border-top: 6px solid transparent;
			height: 0;
			left: 240px;
			position: absolute;
			top: 161px;
			width: 0;
			-moz-transform:    skewX(60deg);
			-o-transform:      skewX(60deg);
			-webkit-transform: skewX(60deg);
			transform:         skewX(60deg);
		}
		
		/*Top Left*/
		#mapcontainer div.tail.top.lefty {
			-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=-1.0000000000000002, M12=-1.7320508075688767, M21=-1.2246467991473532e-16, M22=-1, SizingMethod='auto expand')";
   
			filter: progid:DXImageTransform.Microsoft.Matrix(
            M11=-1.0000000000000002,
            M12=-1.7320508075688767,
            M21=-1.2246467991473532e-16,
            M22=-1,
            SizingMethod='auto expand');
		   margin-left: -3px; 
		   margin-top: -3px;
		   margin-left: -40px\9; 
		   margin-top: -3px\9;
		} 
		#mapcontainer div.tail.top.lefty {
			border-bottom: 38px solid transparent;
			border-left: 40px solid #db536a;
			border-top: 6px solid transparent;
			height: 0;
			left: 22px;
			position: absolute;
			top: -30px;
			width: 0;
			-moz-transform:    skewX(60deg) rotate(180deg);
			-o-transform:      skewX(60deg) rotate(180deg);
			-webkit-transform: skewX(60deg) rotate(180deg);
			transform:         skewX(60deg) rotate(180deg);
		}
		
		/*Top Right*/
		#mapcontainer div.tail.top.righty {
			-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=-0.9999999999999999, M12=0.5773502691896247, M21=-1.2246467991473532e-16, M22=-1, SizingMethod='auto expand')";
   
			filter: progid:DXImageTransform.Microsoft.Matrix(
            M11=-0.9999999999999999,
            M12=0.5773502691896247,
            M21=-1.2246467991473532e-16,
            M22=-1,
            SizingMethod='auto expand');
		   margin-left: -4px; 
		   margin-top: -3px;
		   margin-left: -4px\9; 
		   margin-top: -3px\9;
		} 
		
		#mapcontainer div.tail.top.righty {
			border-bottom: 38px solid transparent;
			border-left: 40px solid #db536a;
			border-top: 6px solid transparent;
			height: 0;
			left: 198px;
			position: absolute;
			top: -30px;
			width: 0;
			-moz-transform:    skewX(-30deg) rotate(180deg);
			-o-transform:      skewX(-30deg) rotate(180deg);
			-webkit-transform: skewX(-30deg) rotate(180deg);
			transform:         skewX(-30deg) rotate(180deg);
		}
		
		/*Left Up*/
		#mapcontainer div.tail.left.up {
			-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1.4281480067421144, M12=1.0000000000000002, M21=0.3420201433256686, M22=0.9396926207859084, SizingMethod='auto expand')";
   
			filter: progid:DXImageTransform.Microsoft.Matrix(
            M11=1.4281480067421144,
            M12=1.0000000000000002,
            M21=0.3420201433256686,
            M22=0.9396926207859084,
            SizingMethod='auto expand');
		   margin-left: -3px; 
		   margin-top: -3px;
		   margin-left: -35px\9; 
		   margin-top: -9px\9;
		} 
		
		#mapcontainer div.tail.left.up {
			border-bottom: 38px solid transparent;
			border-left: 40px solid #db536a;
			border-top: 6px solid transparent;
			height: 0;
			left: -8px;
			position: absolute;
			top: 27px;
			width: 0;
			-moz-transform:    skewX(55deg) rotate(20deg);
			-o-transform:      skewX(55deg) rotate(20deg);
			-webkit-transform: skewX(55deg) rotate(20deg);
			transform:         skewX(55deg) rotate(20deg);
		}
		
		/*Left Down*/
		#mapcontainer div.tail.left.down {
			-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.7002075382097099, M12=-0.9999999999999998, M21=0.3420201433256686, M22=0.9396926207859084, SizingMethod='auto expand')";
   
			filter: progid:DXImageTransform.Microsoft.Matrix(
            M11=0.7002075382097099,
            M12=-0.9999999999999998,
            M21=0.3420201433256686,
            M22=0.9396926207859084,
            SizingMethod='auto expand');
		   margin-left: -3px; 
		   margin-top: -3px;
		   margin-left: -20px\9; 
		   margin-top: -11px\9;
		} 
		
		#mapcontainer div.tail.left.down {
			border-bottom: 38px solid transparent;
			border-left: 40px solid #db536a;
			border-top: 6px solid transparent;
			height: 0;
			left: -20px;
			position: absolute;
			top: 126px;
			width: 0;
			-moz-transform:    skewX(-35deg) rotate(20deg);
			-o-transform:      skewX(-35deg) rotate(20deg);
			-webkit-transform: skewX(-35deg) rotate(20deg);
			transform:         skewX(-35deg) rotate(20deg);
		}
		
		/*Right Down*/
		#mapcontainer div.tail.right.down {
			-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=-1.4281480067421146, M12=-0.9999999999999998, M21=-0.3420201433256689, M22=-0.9396926207859083, SizingMethod='auto expand')";
   
			filter: progid:DXImageTransform.Microsoft.Matrix(
            M11=-1.4281480067421146,
            M12=-0.9999999999999998,
            M21=-0.3420201433256689,
            M22=-0.9396926207859083,
            SizingMethod='auto expand');
		   margin-left: -3px; 
		   margin-top: -3px;
		   margin-left: -35px\9; 
		   margin-top: -6px\9;
		} 
		
		#mapcontainer div.tail.right.down {
			border-bottom: 38px solid transparent;
			border-left: 40px solid #db536a;
			border-top: 6px solid transparent;
			height: 0;
			left: 247px;
			position: absolute;
			top: 109px;
			width: 0;
			-moz-transform:    skewX(55deg) rotate(200deg);
			-o-transform:      skewX(55deg) rotate(200deg);
			-webkit-transform: skewX(55deg) rotate(200deg);
			transform:         skewX(55deg) rotate(200deg);
		}
		
		/*Right Up*/
		#mapcontainer div.tail.right.up {
			-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=-0.7002075382097096, M12=1, M21=-0.3420201433256689, M22=-0.9396926207859083, SizingMethod='auto expand')";
   
			filter: progid:DXImageTransform.Microsoft.Matrix(
            M11=-0.7002075382097096,
            M12=1,
            M21=-0.3420201433256689,
            M22=-0.9396926207859083,
            SizingMethod='auto expand');
		   margin-left: -3px; 
		   margin-top: -3px;
		   margin-left: -20px\9; 
		   margin-top: -11px\9;
		} 
		
		#mapcontainer div.tail.right.up {
			border-bottom: 38px solid transparent;
			border-left: 40px solid #db536a;
			border-top: 6px solid transparent;
			height: 0;
			left: 257px;
			position: absolute;
			top: 18px;
			width: 0;
			-moz-transform:    skewX(-35deg) rotate(200deg);
			-o-transform:      skewX(-35deg) rotate(200deg);
			-webkit-transform: skewX(-35deg) rotate(200deg);
			transform:         skewX(-35deg) rotate(200deg);
		}
		
		/*All*/
		#mapcontainer div.tail.eleven {
			border-left-color: #db536a !important;
		}
		
		#mapcontainer div.tail.twenty {
			border-left-color: #602023 !important;
		}
		
		#mapcontainer div.tail.change {
			border-left-color: #939598 !important;
		}
	
	
	#mapcontainer div.country {
		font-family: georgia;
		font-style: italic;
		color: #a32020;
		position: absolute;
		font-size: 16px;
		line-height: 17px;
		cursor: pointer;
		width: 71px;
		height: 30px;
	}
	
	#mapcontainer #rankings {
		position: absolute;
		height: 530px; 
		width: 750px;
		top: 0;
		left: 0;
		display: none;
	}
	
	#mapcontainer #rankings .rankbox {
		position: absolute;
		width: 40px;
		height: 40px;
	}
	
	#mapcontainer #rankings .rankbox p {
		color: white;
		font-size: 15px;
		font-family: georgia;
		text-align: center;
		font-style: italic;
		margin-top: 9px;
		font-weight: bold;
	
	}
	
	#mapcontainer #rankings #col1 .rankbox {
		background-color: #602023;
		left: 28px;
	}
	
	#mapcontainer #rankings #col2 .rankbox {
		background-color: #a32020;
		left: 239px;
	}
	
	#mapcontainer #rankings #col3 .rankbox {
		background-color: #db536a;
		left: 412px;
	}
	
	#mapcontainer #rankings #col4 .rankbox {
		background-color: #dc6900;
		left: 565px;
	}
	
	#mapcontainer #universitiesbutton {
		width: 255px;
		height: 50px;
		background-color: #602023;
		position: absolute;
		right: 0;
		top: 0;
		cursor: pointer;
	}
	
	#mapcontainer #universitiesbutton:hover {
		background-color: #a32020;
	}
	
	#mapcontainer #universitiesbutton p {
		color: white;
		font-family: georgia;
		font-style: italic;
		font-weight: bold;
		font-size: 14px;
		width: 225px;
		position: absolute;
		top: 6px;
		left: 12px;
	}
	
	#mapcontainer #universitiesbutton .rightArrow {
		width: 0; 
		height: 0; 
		border-top: 7px solid transparent;
		border-bottom: 7px solid transparent;
		border-left: 10px solid white;
		position: absolute;
		left: 236px;
		top: 15px;
	}
	
	#mapcontainer #backbutton {
		width: 150px;
		height: 30px;
		background-color: #602023;
		position: absolute;
		left: 0;
		top: 0;
		cursor: pointer;
		display: none;
	}
	
	#mapcontainer #backbutton:hover {
		background-color: #a32020;
	}
	
	#mapcontainer #backbutton p {
		color: white;
		font-family: georgia;
		font-style: italic;
		font-weight: bold;
		font-size: 14px;
		width: 225px;
		position: absolute;
		top: 5px;
		left: 52px;
	}
	
	#mapcontainer #backbutton .leftArrow {
		width: 0; 
		height: 0; 
		border-top: 7px solid transparent;
		border-bottom: 7px solid transparent;
		border-right: 10px solid white;
		position: absolute;
		left: 15px;
		top: 7px;
	}
	
	#mapcontainer #clickmask {
		height: 530px; 
		width: 750px;
		position: absolute;
		display: none;
	}