Difference between revisions of "Template:Fudan/css.css"

Revision as of 05:17, 10 October 2018 (view source) Ripple (Talk | contribs) ← Older edit		Revision as of 05:20, 10 October 2018 (view source) Ripple (Talk | contribs) (Undo revision 234647 by Ripple (talk)) Newer edit →
Line 2:		Line 2:
	*Font Styles		*Font Styles
	*****/		*****/
−	#FudanBody h1,
−	#FudanBody h2,
−	#FudanBody h3,
−	#FudanBody h4,
−	#FudanBody h5,
−	#FudanBody h6,
−	#nav-mobile{
−	font-family: Helvetica,sans-serif;
−	}
−	#FudanBody h3,
−	#FudanBody h4,
−	#FudanBody h5,
−	#FudanBody h6,
−	#nav-mobile{
−	color: rgba(0,0,0,0.87);
−	}
−	#FudanBody p,
−	#FudanBody div{
−	font-family: Calibri,sans-serif;
−	color: rgba(0,0,0,0.87);
−	}
	#FudanBody .slides h3{		#FudanBody .slides h3{
	color: #ff8c28;		color: #ff8c28;
−	font-size: 40px;	+	font: 40px Futura;
	}		}
	#FudanBody .slides h5{		#FudanBody .slides h5{
	color: #ff7617;		color: #ff7617;
−	font-size: 20px;	+	font: 20px Futura;
	}		}
	#FudanBody nav ul a{		#FudanBody nav ul a{
Line 51:		Line 30:
	text-align: center;		text-align: center;
	color: white;		color: white;
		+	background: #60A9C2;
	opacity: 0.8;		opacity: 0.8;
−	z-index: 998;
	}		}
	#FudanBody .floatingBtn .btn:first-child{		#FudanBody .floatingBtn .btn:first-child{
	right: 100px;		right: 100px;
−	background: #FFE600;
	}		}
	#FudanBody .floatingBtn .btn:last-child{		#FudanBody .floatingBtn .btn:last-child{
	right: 40px;		right: 40px;
−	background: #60A9C2;
	}		}
	#FudanBody #nav-mobile li a{		#FudanBody #nav-mobile li a{
−	color: rgba(0,0,0,0.87);	+	color: #000000;
	text-align: center;		text-align: center;
	}		}
	#FudanBody #nav-mobile>li>a{		#FudanBody #nav-mobile>li>a{
−	font-size: 18px;	+	font-size: 16px;
−	font-weight: 400;	+	font-weight: 300;
	letter-spacing: 1px;		letter-spacing: 1px;
	}		}
	#FudanBody #nav-mobile>li>ul a{		#FudanBody #nav-mobile>li>ul a{
	font-size: 14px;		font-size: 14px;
−	font-weight: 300;	+	font-weight: 200;
	}		}
	#contentBanner div.col{		#contentBanner div.col{
Line 83:		Line 60:
	margin-left: 20%;		margin-left: 20%;
	text-align: left;		text-align: left;
−	color: #FFF;
	}		}
	#contentBanner div.col>span{		#contentBanner div.col>span{
Line 89:		Line 65:
	margin-right: 20%;		margin-right: 20%;
	text-align: justify;		text-align: justify;
−	color: #FFF;
−	}
−	#contentBanner div.col>h1,
−	#contentBanner div.col>span{
−	z-index: 10;
−	}
−	#figureBannerTitle h1,
−	#figureBannerTitle span{
−	color: #fff;
−	}
−	#figureBannerTitle h1{
−	text-decoration: none;
−	font-size: 80px;
−	font-weight: 900;
−	margin-bottom: 10%;
−	}
−	#figureBannerTitle span{
−	font-size: 2rem;
−	line-height: 3rem;
	}		}
	@media only screen and (max-width: 991px){		@media only screen and (max-width: 991px){
−	#figureBannerTitle h1{	+	#contentBanner div.col>h1{
−	font-size: 60px;	+	font-size: 30px;
−	font-weight: 900;	+	word-break: break-all;
−	line-height: 50px;	+
−	margin-bottom: 4%;	+
	}		}
−	#figureBannerTitle span{	+	#contentBanner div.col>span{
−	font-size: 2rem;	+	font-size: 17px;
−	line-height: 2rem;	+
	}		}
	}		}
	@media only screen and (max-width: 600px){		@media only screen and (max-width: 600px){
	#contentBanner div.col>h1{		#contentBanner div.col>h1{
−	font-size: 40px;	+	margin: 0 10%;
−	font-weight: 900;	+
	}		}
	#contentBanner div.col>span{		#contentBanner div.col>span{
−	font-size: 19px;	+	margin: 0 10%;
	}		}
−	#contentBanner div.col:first-child{
−	height: 40%;
−	vertical-align: bottom;
−	padding: 7% 10%;
−	}
−	#contentBanner div.col:last-child{
−	height: 60%;
−	vertical-align: top;
−	padding: 5% 10%;
−	}
−	}
−	#pageContent .section:first-child h2{
−	margin: 40px 0 30px 0;
	}		}
−	#pageContent h2{
−	color: #60A9C2;
−	font-size: 36px;
−	margin: 30px 0 40px 0;
−	text-align: center;
−	}
	#pageContent h3{		#pageContent h3{
−	font-size: 28px;	+	font-size: 30px;
−	margin: 30px 0 10px 0;	+	margin: 40px 0 10px 0;
−	list-style-type: disc;	+
−	}	+
−	#pageContent h3:before{	+
−	content: "▪ ";	+
−	}	+
−	#pageContent #FudanFooter h3:before{	+
−	content: normal;	+
	}		}
	#pageContent h4{		#pageContent h4{
Line 165:		Line 92:
	}		}
	#pageContent p{		#pageContent p{
−	font-size: 19px;	+	font-size: 17px;
−	margin: 23px 0 0 0;	+	margin: 15px 0 0 0;
−	line-height: 27px;	+
	text-align: justify;		text-align: justify;
	}		}
Line 179:		Line 105:
	display: none;		display: none;
	color: #fff;		color: #fff;
−	background: rgba(0,0,0,0.87);	+	background: rgba(0,0,0,0.8);
	font-size: 20px;		font-size: 20px;
	}		}
−	#FudanFooter #usefulLinks{	+
−	color: #cacaca;	+
−	padding-left: 1rem;	+
−	}	+
−	#FudanFooter #usefulLinks ul{	+
−	font-size: 13px;	+
−	line-height: 14px;	+
−	border-top: solid 2px;	+
−	color: inherit;	+
−	text-decoration: none;	+
−	padding-top: 5px;	+
−	}	+
−	#FudanFooter #usefulLinks div{	+
−	color: #cacaca;	+
−	}	+
−	#FudanFooter #usefulLinks div:hover{	+
−	color: white;	+
−	}	+
−	#FudanFooter #usefulLinks a{	+
−	color: inherit;	+
−	}	+
−	#FudanFooter #usefulLinks a:hover{	+
−	text-decoration: underline;	+
−	}	+
−	#FudanFooter #usefulLinks div.active,	+
−	#FudanFooter #usefulLinks div.active a{	+
−	color: white;	+
−	}	+
−	#FudanFooter #usefulLinks div.active ul{	+
−	border-top: solid white 2px;	+
−	}	+
−	#FudanFooter #usefulLinks li{	+
−	padding: 3px 0 6px 3px;	+
−	}	+
−	#usefulLinks span{	+
−	font-size: 20px;	+
−	}	+
−	#usefulLinks>div>div{	+
−	padding-left: 1.2rem;	+
−	}	+
−	#FudanFooter div.footer-copyright{	+
−	font-size: 13px;	+
−	line-height: 15px;	+
−	}	+
−	#FudanBody .tableHolder caption{	+
−	font-size: 19px;	+
−	margin-bottom: 2px;	+
−	}	+
	/*****		/*****
Line 244:		Line 123:
	}		}
	#top_menu_14{		#top_menu_14{
−	position: relative; /* Override the default fixed login bar */	+	position: absolute; /* Override the default fixed login bar */
	z-index: 996;		z-index: 996;
	}		}
Line 288:		Line 167:
	position: fixed;		position: fixed;
	z-index: 995;		z-index: 995;
−	}
−
−	@media only screen and (min-width: 992px){
−	#FudanBody #nav-mobile.orangeBorder{
−	border-top: solid 13px #F78E41;
−	}
−	#FudanBody #nav-mobile.blueBorder{
−	border-top: solid 13px #60A9C2;
−	}
−	#FudanBody #nav-mobile{
−	margin-right: 20px;
−	}
	}		}
	#nav-mobile>li>a{		#nav-mobile>li>a{
Line 311:		Line 178:
	#nav-mobile li ul{		#nav-mobile li ul{
	top: 1px;		top: 1px;
−	}
−	@media only screen and (min-width: 600px){
−	#nav-mobile li:last-child{
−	line-height: 75px;
−	}
	}		}
	#teamLogo{		#teamLogo{
Line 357:		Line 219:
	min-height: 300px;		min-height: 300px;
	background: #60A9C2;		background: #60A9C2;
−	width: 100%;
	}		}
	#contentBanner div.row{		#contentBanner div.row{
	height: 100%;		height: 100%;
	}		}
−	#figureBannerTitle{	+	#contentBanner div.col{
−	position: absolute;	+	height: 100%;
−	left: 4%;	+
−	bottom: 15%;	+
−	right: 40%;	+
−	background: rgba(0,0,0,0);	+
−	z-index: 10;	+
−	padding: 3%;	+
	}		}
−	@media only screen and (min-width: 601px){	+	@media only screen and (max-width: 600px){
−	#contentBanner.figureBanner{	+	#contentBanner div.col:first-child{
−	min-height: 0;	+	height: 40%;
−	background: rgba(0,0,0,0);	+
	}		}
−	#contentBanner.figureBanner > div:last-child{	+	#contentBanner div.col:last-child{
−	position: absolute;	+	height: 60%;
−	width: 100%;	+
−	height: 100%;	+
−	top: 0;	+
−	right: 0;	+
−	overflow: hidden;	+
−	z-index: 9;	+
−	}	+
−	#contentBanner.figureBanner > div:last-child img{	+
−	width: 100%;	+
−	}	+
−	#contentBanner div.col{	+
−	height: 100%;	+
	}		}
	}		}
−		+	.contactUS li{
−	#FudanFooter .contactUS{	+
	display: block;		display: block;
−	}
−	#FudanFooter .contactUS > div{
	margin: 5px 0;		margin: 5px 0;
−	color: rgba(255,255,255,0.8);	+	word-break: break-all;
	}		}
	#pageContentNav,		#pageContentNav,
Line 412:		Line 251:
	border: 0;		border: 0;
	position: fixed;		position: fixed;
−	width: 190px;	+	width: 150px;
	right: 10%;		right: 10%;
	}		}
Line 418:		Line 257:
	#FudanBody .sidenav li{		#FudanBody .sidenav li{
	float: none;		float: none;
−	line-height: 34px;	+	line-height: 30px;
−	font-size: 19px;	+	color: #000;
−	padding: 0 10px;	+
−	color: #60A9C2;	+
	}		}
−	#FudanBody .sidenav .collapsible-header,	+	#pageContentNav li div.description,
−	#FudanBody .sidenav .collapsible-body,	+	#FudanBody .sidenav li div.description{
−	#FudanBody .sidenav .collapsible-body li a{	+
−	height: auto;	+
−	line-height: 28px;	+
−	}	+
−	#FudanBody .sidenav li.active .collapsible-header{	+
−	background: #FFE600;	+
−	}	+
−	#pageContent li.onThisPageNav a,	+
−	#FudanBody .sidenav li.onThisPageNav a{	+
−	font-size: 15px;	+
−	padding: 0 10px;	+
	line-height: 24px;		line-height: 24px;
−	color: rgba(0,0,0,0.87);
−	height: auto;
	}		}
	#FudanBody #nav-mobile li >a.thisPageLink,		#FudanBody #nav-mobile li >a.thisPageLink,
	#pageContentNav li > a.thisPageLink,		#pageContentNav li > a.thisPageLink,
	#FudanBody .sidenav li > a.thisPageLink {		#FudanBody .sidenav li > a.thisPageLink {
−	background-color: #FFE600;	+	background-color: #f2c825;
	}		}
	#pageContentNav li.onThisPageNav.active,		#pageContentNav li.onThisPageNav.active,
Line 451:		Line 275:
	#pageContentNav li > a,		#pageContentNav li > a,
	#FudanBody .sidenav li > a{		#FudanBody .sidenav li > a{
−	color: #60A9C2;	+	color: #000;
	display: block;		display: block;
−	font-size: 19px;	+	font-size: 14px;
		+	font-weight: 500;
		+	height: 30px;
	line-height: 30px;		line-height: 30px;
		+	padding: 0 10px;
	}		}
	#pageContentNav li.onThisPageNav > a:hover,		#pageContentNav li.onThisPageNav > a:hover,
Line 469:		Line 296:
	@media only screen and (min-width: 992px) {		@media only screen and (min-width: 992px) {
	#pageContent main{		#pageContent main{
−	margin: 0 270px 0 0;	+	margin: 0 200px 0 0;
	}		}
	}		}
Line 592:		Line 419:
	box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.2), 0 2px 0 -1px rgba(0, 0, 0, 0.16), 0 1px 3px 0 rgba(0, 0, 0, 0.22);		box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.2), 0 2px 0 -1px rgba(0, 0, 0, 0.16), 0 1px 3px 0 rgba(0, 0, 0, 0.22);
	}		}
−	#FudanFooter img{
−	margin: 5px 0;
−	}
−	#FudanFooter div.row{
−	margin: 5px 0;
−	padding: 0;
−	}
−	#FudanFooter div.row > img{
−	padding: 0 2%;
−	}
−	#FudanFooter #sponsor{
−	margin-top: 35px;
−	}
−	#pageContent p > img{
−	width: 97%;
−	}
−	@media only screen and (min-width: 601px) {
−	#pageContent p > img.left-on-med-and-up{
−	float: left;
−	margin: 1% 3% 1% 0;
−	}
−	#pageContent p > img.right-on-med-and-up{
−	float: right;
−	margin: 1% 0 1% 3%;
−	}
−	#pageContent p > img.width40{
−	width: 40%;
−	}
−	#pageContent p > img.width45{
−	width: 45%;
−	}
−	}
−	#pageContent .section .row {
−	margin: 25px 0 0 0;
−	}
−
−	#FudanBody .FudanGallery{
−	position: relative;
−	width: 70%;
−	}
−	#FudanBody .FudanGallery > .galleryActive{
−	width: 100%;
−	}
−	#FudanBody .FudanGallery > .galleryActive img{
−	width: 100%;
−	}
−	#FudanBody .FudanGallery > .galleryThumbnail{
−	position: relative;
−	width: 100%;
−	margin: 0;
−	overflow-x: scroll;
−	overflow-y: hidden;
−	white-space: nowrap;
−	}
−	#FudanBody .FudanGallery > .galleryThumbnail::-webkit-scrollbar{
−	display: none;
−	}
−	#FudanBody .FudanGallery > .galleryThumbnail img{
−	width: 15%;
−	display: inline-block;
−	opacity: 0.7;
−	cursor: pointer;
−	}
−	@media only screen and (max-width: 991px){
−	#FudanBody .FudanGallery > .galleryThumbnail img{
−	width: 22%;
−	}
−	}
−	#FudanBody .FudanGallery > .galleryBtnLeft,
−	#FudanBody .FudanGallery > .galleryBtnRight{
−	position: absolute;
−	width: 40px;
−	height: 40px;
−	border-radius: 50%;
−	background: rgba(0,0,0,0.2);
−	color: white;
−	font-size: 30px;
−	line-height: 35px;
−	text-align: center;
−	bottom: 3%;
−	cursor: pointer;
−	}
−	#FudanBody .FudanGallery > .galleryBtnLeft{
−	left: 2%;
−	}
−	#FudanBody .FudanGallery > .galleryBtnRight{
−	right: 2%;
−	}
−	#FudanBody .tableHolder{
−	width: 100%;
−	overflow: scroll;
−	margin: 20px 0 30px 0;
−	}
−	#FudanBody .tableHolder td,
−	#FudanBody .tableHolder th{
−	padding: 0 5px;
−	}
−	#FudanBody .tableHolder th{
−	text-align: center;
−	}
−	#FudanBody .figureHolder{
−	margin: 20px 0 30px 0;
−	}
−
−
	/*****		/*****

---

Revision as of 05:20, 10 October 2018

/*****

• Font Styles
  • • • • /

1. FudanBody .slides h3{

   color: #ff8c28;
   font: 40px Futura;

}

1. FudanBody .slides h5{

   color: #ff7617;
   font: 20px Futura;

}

1. FudanBody nav ul a{

   color: #60A9C2;

}

1. FudanBody .dropdown-content li a{

   color: #60A9C2;

}

1. FudanBody a{

   text-decoration: none;
   outline: none;
   color: #60A9C2;

}

1. FudanBody .floatingBtn .btn{

   position: fixed;
   bottom: 40px;
   width: 50px;
   height: 50px;
   padding: 0;
   text-align: center;
   color: white;
   background: #60A9C2;
   opacity: 0.8;

}

1. FudanBody .floatingBtn .btn:first-child{

   right: 100px;

}

1. FudanBody .floatingBtn .btn:last-child{

   right: 40px;

}

1. FudanBody #nav-mobile li a{

   color: #000000;
   text-align: center;

}

1. FudanBody #nav-mobile>li>a{

   font-size: 16px;
   font-weight: 300;
   letter-spacing: 1px;

}

1. FudanBody #nav-mobile>li>ul a{

   font-size: 14px;
   font-weight: 200;

}

1. contentBanner div.col{

   color: white;
   padding: 0;

}

1. contentBanner div.col>h1{

   font-size: 40px;
   margin-left: 20%;
   text-align: left;

}

1. contentBanner div.col>span{

   font-size: 20px;
   margin-right: 20%;
   text-align: justify;

} @media only screen and (max-width: 991px){

   #contentBanner div.col>h1{
       font-size: 30px;
       word-break: break-all;
   }
   #contentBanner div.col>span{
       font-size: 17px;
   }

} @media only screen and (max-width: 600px){

   #contentBanner div.col>h1{
       margin: 0 10%;
   }
   #contentBanner div.col>span{
       margin: 0 10%;
   }

}

1. pageContent h3{

   font-size: 30px;
   margin: 40px 0 10px 0;

}

1. pageContent h4{

   font-size: 24px;
   margin: 50px 0 0 10px;

}

1. pageContent p{

   font-size: 17px;
   margin: 15px 0 0 0;
   text-align: justify;

}

1. pageContent #FudanFooter h3{

   margin: 10px 0 10px 0;

}

1. acknowledgementPhoto span{

   position: absolute;
   bottom: 5%;
   z-index: 10;
   display: none;
   color: #fff;
   background: rgba(0,0,0,0.8);
   font-size: 20px;

}

/*****

• Structure Styles
  • • • • /

1. content{

   z-index: auto; /* #slide-out is not on the top of all elements when using default z-index number(2) */

} div{

   box-sizing: content-box; /* Solve the conflict between Materialize(inherit) and igem.org default setting */

}

1. FudanBody div{

   box-sizing: border-box;

}

1. top_menu_14{

   position: absolute; /* Override the default fixed login bar */
   z-index: 996;

}

1. globalWrapper{ /* Solve the overflow of login */

   overflow: hidden;
   padding: 0;

}

1. FudanWrapper {

   position: relative;
   width: 100%;

}

1. FudanBody {

   position: relative;
   width: 100%;
   overflow: hidden;

}

1. FudanBody ul{

   margin: 0;
   line-height: inherit;

}

1. FudanBody img{

   vertical-align: inherit;

}

1. FudanBody .fa{

   height: inherit;
   line-height: inherit;
   font-size: inherit;

}

1. FudanBody .container{

   width: 90%;

} @media only screen and (max-width: 600px) {

   #emptyBar{
       height: 56px;
   }

} @media only screen and (min-width: 601px) {

   #emptyBar{
       height: 75px;
   }

}

1. topNav{

   position: fixed;
   z-index: 995;

}

1. nav-mobile>li>a{

   cursor:default;
   width: 135px;

}

1. FudanBody #nav-mobile>li:last-child>a{

   width: 50px;
   color: #888;

}

1. nav-mobile li ul{

   top: 1px;

}

1. teamLogo{

   padding: 0 40px 0 40px;

}

1. teamLogo img{

   height: 100%;

}

1. teamLogo {

   margin: 5px 0;
   height: 46px;

} @media only screen and (min-width: 601px) {

   #teamLogo {
       margin: 5px 0;
       height: 65px;
   }

}

1. navList{

   line-height: inherit;

}

1. navList.sidenav-trigger {

   margin: 0 10px;

}

1. FudanBody .slider .indicators{

   bottom: 60px;
   z-index: 100;

}

1. homepageDivider{

   width: 100%;
   height: 20px;
   position: relative;
   top: -40px;

}

1. homepageContent{

   position: relative;
   top: -20px;

}

1. contentBanner{

   position: relative;
   min-height: 300px;
   background: #60A9C2;

}

1. contentBanner div.row{

   height: 100%;

}

1. contentBanner div.col{

   height: 100%;

} @media only screen and (max-width: 600px){

   #contentBanner div.col:first-child{
       height: 40%;
   }
   #contentBanner div.col:last-child{
       height: 60%;
   }

} .contactUS li{

   display: block;
   margin: 5px 0;
   word-break: break-all;

}

1. pageContentNav,
2. FudanBody .sidenav{

   overflow-y: auto;

}

1. FudanBody .sidenav{

   height: auto;
   bottom: 0;

} ul#pageContentNav{

   background-color: #fff;
   border: 0;
   position: fixed;
   width: 150px;
   right: 10%;

}

1. pageContentNav li,
2. FudanBody .sidenav li{

   float: none;
   line-height: 30px;
   color: #000;

}

1. pageContentNav li div.description,
2. FudanBody .sidenav li div.description{

   line-height: 24px;

}

1. FudanBody #nav-mobile li >a.thisPageLink,
2. pageContentNav li > a.thisPageLink,
3. FudanBody .sidenav li > a.thisPageLink {

   background-color: #f2c825;

}

1. pageContentNav li.onThisPageNav.active,
2. FudanBody .sidenav li.onThisPageNav.active {

   background-color: rgba(96, 169, 194, 0.05);

}

1. pageContentNav li > a,
2. FudanBody .sidenav li > a{

   color: #000;
   display: block;
   font-size: 14px;
   font-weight: 500;
   height: 30px;
   line-height: 30px;
   padding: 0 10px;

}

1. pageContentNav li.onThisPageNav > a:hover,
2. FudanBody .sidenav li.onThisPageNav > a:hover{

   background-color: rgba(96, 169, 194, 0.05);
   border-left: solid #60A9C2 2px;
   transition-duration: 0ms;

}

1. pageContentNav li.onThisPageNav > a.active,
2. FudanBody .sidenav li.onThisPageNav > a.active{

   border-left: solid #60A9C2 4px;
   background-color: rgba(96, 169, 194, 0.05);

} @media only screen and (min-width: 992px) {

   #pageContent main{
       margin: 0 200px 0 0;
   }

}

1. pageContent{

   display: flex;
   min-height: 100vh;
   flex-direction: column;

}

1. FudanBody main{

   flex: 1 0 auto;

}

1. FudanBody .sidenavBanner{

   position: relative;
   padding: 32px 32px 0;
   margin-bottom: 8px;

}

1. FudanBody .sidenavBanner > a{

   height: auto;
   padding: 0;
   display: block;
   line-height: 48px;

}

1. FudanBody .sidenavBanner .background{

   overflow: hidden;
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
   z-index: -1;

}

1. slide-out{

   overflow-y: scroll;

}

1. slide-out .background{

   background: #60A9C2;

}

1. figDescription{

   position: fixed;
   top: 64px;
   width: 100%;
   height: 600px;
   z-index: 900;
   display: none;
   background: white;

}

1. figDescription .card{

   position: fixed;
   top: 450px;
   left: 50px;
   width: 30%;
   border-radius: 10px;
   overflow: hidden;
   opacity: 0.95;

}

1. FudanBody .section{

   margin-top: 50px;

}

1. FudanBody .section:first-child{

   margin-top: 70px;

}

1. FudanBody .section:last-child{

   margin-bottom: 150px;

}

1. FudanBody #abstractContent{

   width: 300px;
   height: 300px;
   position: fixed;
   background: #fff;
   left:50%;
   top:50%;
   margin: -150px 0 0 -150px;
   overflow-y: scroll;
   border-radius: 10px;
   padding: 30px 0 20px 0;
   display: none;
   z-index: 998;

}

1. FudanBody #abstractContent > a{

   height: 30px;
   width: 30px;
   position: absolute;
   right:10px;
   top:10px;

} @media only screen and (min-width: 601px) and (min-height: 501px) {

   #FudanBody #abstractContent{
       width: 700px;
       height: 500px;
       margin: -250px 0 0 -350px;
   }
   #FudanBody #abstractContent > a{
       font-size: 40px;
       line-height: 40px;
       position: absolute;
       right:20px;
       top:20px;
   }

}

1. acknowledgementPhoto{

   width: 100%;
   position: relative;

}

1. acknowledgementPhoto > div{

   width: 100%;
   position: relative;
   vertical-align: top;

}

1. acknowledgementPhoto div.row >div{

   position: relative;
   padding: 0 10px;
   margin: 10px 0;
   overflow: hidden;
   text-align: center;
   bottom: 0;

}

1. acknowledgementPhoto img{

   width: 100%;

}

1. FudanBody .z-depth-0_5{

   -webkit-box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.2), 0 2px 0 -1px rgba(0, 0, 0, 0.16), 0 1px 3px 0 rgba(0, 0, 0, 0.22);
   box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.2), 0 2px 0 -1px rgba(0, 0, 0, 0.16), 0 1px 3px 0 rgba(0, 0, 0, 0.22);

}

/*****

• print media
  • • • • /

@media print{

   #topNav{display: none}
   #pageContentNav{display: none}
   #FudanFooter{display: none}
   #pageContent{margin: 100px}
   #top_menu_14{display: none}
   #emptyBar{display: none}
   #FudanBody .fixed-action-btn{display: none}
   #FudanBody .switch{display: none}

}