/* Main
=====================================================================*/
#main2 {
	position: relative;
	width: 900px;
	margin: -30px 20px 30px 0px;
}

/* Sidebar
=====================================================================*/
.side { float: left; display: inline; width: 310px; }
#side { padding: 300px 0 0 0; }
#mapside { padding: 165px 155px 0 0; width: 155px; }
#mapside h3 {
	margin: 0 0 7px 0;
	padding: 0;
	color: #4677C8;
	font-size: 15px;
	font-family: georgia, serif;
	line-height: 18px;
}
#mapside p.instructions {
	margin: 0;
	padding: 0;
	color: #4677C8;
	font-size: 13px;
	line-height: 22px;
	font-family: georgia, serif;
	text-align: left;
}
#mapside p.cred { margin-top: 215px; width: 200px; }
#mapside p a { color: #58A9BA; }
.side p { font-size: 12px; line-height: 18px; color: #5D9772; }
.side a { color: #58A9BA; text-decoration: none; border-bottom: 1px dotted #58A9BA; }
.side a:hover { border: none; }

/* Homepage
=====================================================================*/
#homepage { float: left; display: inline; width: 580px; margin: 40px 0 0px 10px; }

#mappromo { position: relative; width: 580px; height: 210px; margin: 30px 0; background: url('/ooc/css/photonics/images/mappromo.jpg'); }
#mappromo a { display: block; position: absolute; width: 580px; height: 210px; top: 0; left: 0; text-align: justify; text-decoration: none; border: none; }
#mappromo a:hover { border: none; }
#mappromo a span { position: absolute; color: #fff; font-size: 15px; line-height: 22px; top: 50px; left: 25px; width: 230px; }

/* Maincontent
=====================================================================*/
#maincontent { float: left; display: inline; width: 580px; margin: 40px 0 40px 10px;  }

/* Content
=====================================================================*/
.content { font-size: 14px; font-family: georgia, serif; color: #489645; line-height: 20px; }
.content a { color: #57A9BB; text-decoration: none; border-bottom: 1px dotted #57A9BB; text-decoration: none; }
.content a:hover { border-bottom: 1px solid #57A9BB; }
.content p { margin: 0 0 20px 0; }
.content h3 { font-size: 18px; line-height: 25px; color: #81BD7F; font-weight: normal; margin: 20px 0; }
.content h3 strong { font-weight: bold; color: #F6AB1F; }
.content h4  { margin: 20px 0 0 0; font-size: 15px; line-height: 20px; }
.content h5 { font-weight: normal; font-size: 14px; }
.content ul { margin: 0 0 0 30px; }
.content ul ul  { margin: 0 0 0 48px; list-style: disc; }
.content ul.carolist { list-style: disc; margin: 0 0 20px 38px; }

/* Map
=====================================================================*/
#mapcontainer2 { position: relative; height: 600px; margin-top: 20px; margin-left: 100px; }

#legend {
	position: absolute;
	width: 211px;
	height: 414px;
	top: 30px;
	right: 700px;
	right: 535px;
	text-align:left;
	background: url('/ooc/css/photonics/map/legend.jpg');
	background-image: url(/ooc/css/photonics/map/legend.jpg);
}
#legend h3, #legend li { 
	cursor: default; 
}



#legend h3 {
	margin: 0;
	padding: 0;
	position: absolute;
	top: 10px;
	left: 18px;
	width: 22px;
	height: 386px;
	text-indent: -9999em;
	cursor: pointer;
	cursor: hand;
	}


#legend ul {
	position: absolute;
	margin: 0 0 0 6px;
	top: 43px;
	left: 43px;
	font-family: arial, sans-serif;
	width: 160px;
}
#legend ul li {
	color: #4677C8;
	font-size: 11px;
	line-height: 31px;
}

/*
#map { position: absolute; width: 700px; height: 470px; top: 0; right: 0; background: url('map/map.jpg'); overflow: hidden; }
*/

#map {
	position: absolute;
	width: 700px;
	height: 470px;
	top: 0;
	right: 0;
	background: url('/ooc/css/photonics/map/map.jpg');
	overflow: hidden;
	background-image: url(/ooc/css/photonics/map/map.jpg);
	

}


#map2 {
	position: absolute;
	width: 700px;
	height: 470px;
	top: 0;
	right: 0;
	background: url('   ');
	overflow: hidden;
	background-image: url(   );
	

}




#returnlink { 
	display: block; 
	position: absolute; 
	width: 146px; 
	height: 30px; 
	right: 0px; 
	bottom: -160px; 
	background: url('/ooc/css/photonics/map/return-background.png'); 
	border: none; 
	color: white; 
	line-height: 26px; 
	padding: 0 0 0 38px; 
}


#nw.hover { background: url('/ooc/css/photonics/map/nw-thumb.jpg'); }
#ne.hover { background: url('/ooc/css/photonics/map/ne-thumb.jpg'); }
#sw.hover { background: url('/ooc/css/photonics/map/sw-thumb.jpg'); }
#se.hover { background: url('/ooc/css/photonics/map/se-thumb.jpg'); }

/* Big Bullets */
#map a.bullet { display: none; position: absolute; display: block; width: 20px; height: 20px; background: url('/ooc/css/photonics/map/bullets.png'); background-repeat: no-repeat; z-index: 2; border: none; }
#map a.bullet:hover { text-decoration: none; border: none; }
#map a:active, #map a:focus { outline: 0; }





#map a.sfm              {  background-position: 0px -2px; }
#map a.cfm  {  background-position: 0px -2px }
#map a.optics                  {  background-position: 0px -2px }
#map a.electronics        {  background-position: 0px -2px }
#map a.investor              {  background-position: 0px -2px }
#map a.imaging                {  background-position:0px -2px }
#map a.sensors                {  background-position: 0px -2px }
#map a.semiconductors  {  background-position: 0px -2px }
#map a.medical                {  background-position: 0px -2px}
#map a.energy                  {  background-position: 0px -2px }
#map a.miscellaneous    {  background-position: 0px -2px}


/* POPUP BOX */
#map div.popup{ 
	display: none; 
	position: absolute; 
	overflow: hidden; 
	width: 290px; 
	height: 160px; 
	min-width: 250px; background: 
	url('/ooc/css/photonics/map/popup.png') 
	no-repeat; 
	z-index: 1000; }

#map div.north-west { bottom: 0px; left: 410px; }
#map div.north-east { bottom: 0px; left: 410px; }
#map div.south-east { bottom: 0px; left: 410px; }
#map div.south-west { bottom: 0px; left: 410px; }


/* popup Course Title */
#map div.popup h3 { 
margin: 10px 0px 0px 10px; 
padding: 0px; 
font-family:Arial, Helvetica, sans-serif;
font-size: 11px; 
font-weight:bold;
color: white; 
float: left;
top: 0px; 
line-height: 18px; 
width:280px;
text-align:left;
overflow: hidden;
z-index:20
}



/* popup Subtitle */
#map div.popup h4 { 
position: absolute; 
margin: 10px 5px 5px -14px; 
padding: 0px; 
height: 30px; 
line-height: 30px; 
color: white; 
text-align:left; 
top: 25px; 
font-weight: normal; 
font-size: 11px; 
float: left;
}

#map div.popup h4 span{ display: inline-block; margin-right: 2px; width: 30px; height: 30px; background-repeat: no-repeat; z-index: 2; border: none; }
#map div.popup h4 span.sfm              {  background-position: 0px 0px; }
#map div.popup h4 span.cfm  {  background-position: -20px 0px; }
#map div.popup h4 span.optics                  {  background-position: -60px 0px; }
#map div.popup h4 span.electronics        {  background-position: -90px 0px; }
#map div.popup h4 span.investor              {  background-position: -120px 0px; }
#map div.popup h4 span.imaging                {  background-position: -150px 0px; }
#map div.popup h4 span.sensors                {  background-position: -180px 0px; }
#map div.popup h4 span.semiconductors  {  background-position: -210px 0px; }
#map div.popup h4 span.medical                {  background-position: -240px 0px; }
#map div.popup h4 span.energy                  {  background-position: -270px 0px; }
#map div.popup h4 span.miscellaneous    {  background-position: -300px 0px; }


/* popup body contents */
#map div.popup div.popupcontent {
	padding: 0px 5px 5px 5px; 
	float: left;
	width: 275px; Height: 110px; 
	font-size: 11px; line-height: 15px; 
	margin:5px 5px 0px 5px;
	z-index:10;
	}



#map div.popup div.popupcontent p{ font-family:Arial, Helvetica, sans-serif; color:#666; margin: 5px 0; font-size:11px; line-height:14px; }
#map div.popup div.popupcontent a { color: #55A9C1; border-bottom: 1px dotted #55A9C1; }

#map div.popup div.popupcontent a:hover { color: #105694; border-bottom: 1px solid #105694; }

#map div.popup a.close { 
	display: block; 
	position: absolute; 
	bottom: 4px; 
	right: 5px; 
	width: 80px; 
	height: 30px; 
	text-indent: -9999em; 
	border: none; }
	
#map div.popup a.close:hover { border: none; }





*-----------------------------SOCIAL MEDIA Menu ------------------*/


.fl_right{
	text-align: center; 
padding:10px 10px 0 10px;
color:#6996c0;
margin-left:auto;
margin-right:auto
;}


/*-----------------------------Tooltip for social media and others ------------------*/
/* Tooltip */
#tooltip{
	position:absolute;
	border:1px solid #999;
	background:#CBE0F1;
	padding:2px 5px;
	color:#333;
	display:none;
	}