Difference between revisions of "Team:ZJU-China/css/survey/mootools-core js"

Line 1: Line 1:
 +
 +
.orange { color: #f74e12; }
 +
.grey { color: #323333; }
 +
.wrapper
 +
{
 +
position: relative;
 +
margin: auto;
 +
max-width: 960px;
 +
width: 100%;
 +
}
 +
 +
header
 +
{
 +
background-color: #111111;
 +
padding-bottom: 100px;
 +
text-align: right;
 +
 
 +
}
 +
header .wrapper { padding: 0 10px; }
 +
 +
h2
 +
{
 +
font-size: 64px;
 +
line-height: 0.9;
 +
color: #ffffff;
 +
font-family: 'Nexa';
 +
text-transform: uppercase;
 +
margin-bottom: 25px;
 +
text-align: center;
 +
}
 +
 +
header h2 + p.home
 +
{
 +
color: #000;
 +
text-align: left;
 +
}
 +
 +
header h2 + p
 +
{
 +
display: block;
 +
font-family: 'Nexa';
 +
font-size: 19px;
 +
font-weight: bold;
 +
line-height: 1.5;
 +
text-transform: uppercase;
 +
color: #ffffff;
 +
text-align: center;
 +
margin-bottom: 55px;
 +
}
 +
 +
header .team
 +
{
 +
text-align: center;
 +
font-size: 0;
 +
line-height: 0;
 +
letter-spacing: -1px;
 +
max-width: 960px;
 +
margin: 0 auto;
 +
}
 +
 +
header .team .item
 +
{
 +
width: 180px;
 +
display: inline-block;
 +
font-size: 15px;
 +
line-height: 1.2;
 +
letter-spacing: 0;
 +
vertical-align: top;
 +
margin: 0 6px 70px;
 +
}
 +
 +
header .team .item .img_wrapper
 +
{
 +
position: relative;
 +
width: 100%;
 +
height: 159px;
 +
margin-bottom: 10px;
 +
margin-top: 30px;
 +
}
 +
 +
header .team .item .img_wrapper img
 +
{
 +
left: 5%;
 +
    position: absolute;
 +
    top: -31%;
 +
}
 +
 +
header .team .item p.name
 +
{
 +
font-size: 15px;
 +
font-weight: bold;
 +
font-family: 'Nexa';
 +
color: #FFF;
 +
text-transform: uppercase;
 +
}
 +
 +
header .team .item p.position
 +
{
 +
font-size: 12px;
 +
font-family: 'Open Sans';
 +
color: #434647;
 +
}
 +
 +
img.img_hover{opacity:0; }
 +
.img_wrapper:hover > img.img_hover{
 +
opacity:1;
 +
z-index:1000;
 +
moz-transition: opacity 0.7s; /* Firefox 4 */
 +
-webkit-transition: opacity 0.7s; /* Safari and Chrome */
 +
-o-transition: opacity 0.7s;
 +
transition: opacity 0.7s;
 +
}
 +
.img_wrapper:hover > img.img_hover2{
 +
opacity:0;
 +
moz-transition: opacity 0.5s; /* Firefox 4 */
 +
-webkit-transition: opacity 0.5s; /* Safari and Chrome */
 +
-o-transition: opacity 0.5s;
 +
transition: opacity 0.5s;
 +
}
 +
* {
 +
padding: 0;
 +
margin: 0
 +
}
 +
 
#mbOverlay {
 
#mbOverlay {
 
position: fixed;
 
position: fixed;
Line 11: Line 135:
  
 
#mbOverlay.mbOverlayFF {
 
#mbOverlay.mbOverlayFF {
−
background: transparent url() repeat;
+
background: transparent url(80.png) repeat;
 
}
 
}
  
Line 75: Line 199:
  
 
#mbNumber {
 
#mbNumber {
−
background: url() no-repeat center;
+
background: url(images/mbNumber_bg.gif) no-repeat center;
 
display: inline;
 
display: inline;
 
color: #C00;
 
color: #C00;
Line 101: Line 225:
 
margin: 0;
 
margin: 0;
 
outline: none;
 
outline: none;
 +
}
 +
 +
#mbPrevLink {
 +
width: 32px;
 +
height: 100px;
 +
background: transparent url(images/CustomBlackPrevious.gif) no-repeat center;
 +
position: absolute;
 +
top: 38%;
 +
left: -32px;
 +
}
 +
 +
#mbNextLink {
 +
width: 32px;
 +
height: 100px;
 +
background: transparent url(images/CustomBlackNext.gif) no-repeat center;
 +
position: absolute;
 +
top: 38%;
 +
right: -32px;
 +
}
 +
 +
#mbCloseLink {
 +
width: 24px;
 +
background: transparent url(images/CustomBlackClose.gif) no-repeat center;
 +
position: absolute;
 +
top: 10px;
 +
right: 10px;
 
}
 
}
  

Revision as of 15:14, 15 September 2015

.orange { color: #f74e12; } .grey { color: #323333; } .wrapper { position: relative; margin: auto; max-width: 960px; width: 100%; }

header { background-color: #111111; padding-bottom: 100px; text-align: right;

} header .wrapper { padding: 0 10px; }

h2 { font-size: 64px; line-height: 0.9; color: #ffffff; font-family: 'Nexa'; text-transform: uppercase; margin-bottom: 25px; text-align: center; }

header h2 + p.home { color: #000; text-align: left; }

header h2 + p { display: block; font-family: 'Nexa'; font-size: 19px; font-weight: bold; line-height: 1.5; text-transform: uppercase; color: #ffffff; text-align: center; margin-bottom: 55px; }

header .team { text-align: center; font-size: 0; line-height: 0; letter-spacing: -1px; max-width: 960px; margin: 0 auto; }

header .team .item { width: 180px; display: inline-block; font-size: 15px; line-height: 1.2; letter-spacing: 0; vertical-align: top; margin: 0 6px 70px; }

header .team .item .img_wrapper { position: relative; width: 100%; height: 159px; margin-bottom: 10px; margin-top: 30px; }

header .team .item .img_wrapper img { left: 5%; 

   position: absolute;
   top: -31%;

}

header .team .item p.name { font-size: 15px; font-weight: bold; font-family: 'Nexa'; color: #FFF; text-transform: uppercase; }

header .team .item p.position { font-size: 12px; font-family: 'Open Sans'; color: #434647; }

img.img_hover{opacity:0; } .img_wrapper:hover > img.img_hover{ opacity:1; z-index:1000; moz-transition: opacity 0.7s; /* Firefox 4 */ -webkit-transition: opacity 0.7s; /* Safari and Chrome */ -o-transition: opacity 0.7s; transition: opacity 0.7s; } .img_wrapper:hover > img.img_hover2{ opacity:0; moz-transition: opacity 0.5s; /* Firefox 4 */ -webkit-transition: opacity 0.5s; /* Safari and Chrome */ -o-transition: opacity 0.5s; transition: opacity 0.5s; }

  • {

padding: 0; margin: 0 }

  1. mbOverlay {

position: fixed; z-index: 9998; top: 0; left: 0; width: 100%; height: 100%; background-color: #000; cursor: pointer; }

  1. mbOverlay.mbOverlayFF {

background: transparent url(80.png) repeat; }

  1. mbOverlay.mbOverlayIE {

position: absolute; }

  1. mbCenter {

position: absolute; z-index: 9999; left: 50%; background-color: #fff; -moz-border-radius: 10px; -webkit-border-radius: 10px; -moz-box-shadow: 0 10px 40px rgba(0, 0, 0, 0.70); -webkit-box-shadow: 0 10px 40px rgba(0, 0, 0, 0.70); }

  1. mbCenter.mbLoading {

background: #fff url(ZJU-CHINA_AjaxLoader.gif) no-repeat center; -moz-box-shadow: none; -webkit-box-shadow: none; }

  1. mbImage {

left: 0; top: 0; font-family: Myriad, Verdana, Arial, Helvetica, sans-serif; line-height: 20px; font-size: 12px; color: #fff; text-align: left; background-position: center center; background-repeat: no-repeat; padding: 10px; }

  1. mbImage a, #mbImage a:link, #mbImage a:visited {

color: #ddd; }

  1. mbImage a:hover, #mbImage a:active {

color: #fff; }

  1. mbBottom {

min-height: 20px; font-family: Myriad, Verdana, Arial, Helvetica, sans-serif; line-height: 20px; font-size: 12px; color: #999; text-align: left; padding: 0 10px 10px; }

  1. mbTitle {

display: inline; color: #999; font-weight: bold; line-height: 20px; font-size: 12px; }

  1. mbNumber {

background: url(images/mbNumber_bg.gif) no-repeat center; display: inline; color: #C00; line-height: 26px; font-size: 12px; position: absolute; bottom: 10px; right: 10px; text-align: center; width: 65px; height: 26px; }

  1. mbCaption {

display: block; color: #999; line-height: 14px; font-size: 10px; }

  1. mbPrevLink, #mbNextLink, #mbCloseLink {

display: block; float: right; height: 20px; margin: 0; outline: none; }

  1. mbPrevLink {

width: 32px; height: 100px; background: transparent url(images/CustomBlackPrevious.gif) no-repeat center; position: absolute; top: 38%; left: -32px; }

  1. mbNextLink {

width: 32px; height: 100px; background: transparent url(images/CustomBlackNext.gif) no-repeat center; position: absolute; top: 38%; right: -32px; }

  1. mbCloseLink {

width: 24px; background: transparent url(images/CustomBlackClose.gif) no-repeat center; position: absolute; top: 10px; right: 10px; }

  1. mbError {

position: relative; font-family: Myriad, Verdana, Arial, Helvetica, sans-serif; line-height: 20px; font-size: 12px; color: #fff; text-align: center; border: 10px solid #700; padding: 10px 10px 10px; margin: 20px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }

  1. mbError a, #mbError a:link, #mbError a:visited, #mbError a:hover, #mbError a:active {

color: #d00; font-weight: bold; text-decoration: underline; }

.layout_default { float: left; margin: 5px }

.mod_gallerylist { width: 665px; margin: 0 auto }

.meta { font-size: 12px; text-align: center; }

.image_container img { border: 1px solid #CCC; padding: 2px }

.meta a { color: #333; text-decoration: none } 

   #bars_box { 
     display:block;
   }

 /*Main page right column, the on page menu will be placed here */
   #menu_BarsBox{
     width: 180px;
     background-color: #fff;
   }



   #menu_BarsBox  h4 { 
     color: #656459;
     padding: 5px 10px;
     padding-left: 5px;
   }



   #menu_BarsBox a {
     text-decoration: none;
   }



   #menu_BarsBox ul {background: #ffffff;} 

 /*Styling for the the list item */
   #menu_BarsBox ul li{
     
     padding-left: 10px;
     margin-bottom: -1px;
     margin-left: 0px;

     display:block;
     border: 1px solid #ccc;
     border-right: 0px solid white;
     border-left: 0px solid white;

     height:20px;
     width: 143px;

     font-size: 11px;
     font-weight: bold;
     color: #565656;
     list-style: none;

     /*animate transition */
     -webkit-transition: background 0.2s linear;
     -moz-transition: background 0.2s linear;
     -ms-transition: background 0.2s linear;
     -o-transition: background 0.2s linear;
     transition: background 0.2s linear;
   }

 /*For the list item, changes the color on hover.*/
   #menu_BarsBox ul li:hover{
     background-color:#c1dfa6;
   }



 /*styling for the menu header*/
   .accordion-header, .accordion-header_noaction {
     background: #f2f2f2;
     font-family: "Arial", Gadget, sans-serif; 
     border: 1px solid #ccc;
     cursor: pointer;
     /*animate transition */
     -webkit-transition: background 0.2s linear;
     -moz-transition: background 0.2s linear;
     -ms-transition: background 0.2s linear;
     -o-transition: background 0.2s linear;
     transition: background 0.2s linear;
   } 

   .accordion-header_noaction:hover {
     background: #c1dfa6;
   }

 /* switches background color to green */
   .active-header {
     background: #d3d3d3;
   }
     
 /* switches background color to light green */
   .active-header:hover {
     background: #c1dfa6;
   }

 /* switches background color to default gray */
   .inactive-header {
     background: #f2f2f2;
   }

 /* switches background color to light green */
   .inactive-header:hover {
     background: #c1dfa6;
   }

 /* styling for the submenus */
   .accordion-content {
     display: none;
     background: #ffffff;
     border: 1px solid #cccccc;
     border-top: 0;
     float: left;
     margin-bottom:  10px;
   }