Team:IvyTech SouthBend IN/css/stylesheet/standard

From 2014.igem.org

(Difference between revisions)
(Created page with "/* ---------------- WikiMedia Elements / Page Structure ---------------- */ - HIDE SEARCH CONTROLS AND PAGE TITLE: #p-logo, #search-controls, .firstHeading { display: non...")
Line 101: Line 101:
}
}
 +
 +
/* CSS Document */
 +
body{padding:0px; margin:0px; background:url(images/ivy_main-bg.gif) 0 0 repeat-x #fff; color:#5F7A77; font:13px/19px Arial, Helvetica, sans-serif;}
 +
div, p, ul, h2, h3, h4, h5, img{padding:0px; margin:0px;}
 +
ul{list-style-type:none}
 +
 +
/*----MAIN PANEL----*/
 +
#mainPan{width:778px; position:relative; margin:0 auto;}
 +
 +
/*----TOP PANEL----*/
 +
#topPan{width:778px; height:65px; background:url(images/ivy_topbg.jpg) 0 0 no-repeat #fff; color:#828282; position:relative; margin:0 auto;}
 +
#topPan img.logo{width:136px; height:31px; position:absolute; top:12px; left:235px;}
 +
#topPan p.caption{width:300px; background:#fff; color:#828282; position:absolute; top:43px; left:235px;}
 +
/*----/TOP PANEL----*/
 +
 +
/*----HEADER PANEL----*/
 +
#headerPan{width:686px; height:153px; background:url(images/ivy_header.jpg) 0 0 no-repeat; position:relative; margin:0 auto; padding:11px 0 0 92px;}
 +
 +
#headerPan ul.leftmenu{width:87px;}
 +
#headerPan ul.leftmenu li{width:87px; height:22px; border-bottom:1px dashed #AECCCA;}
 +
#headerPan ul.leftmenu li a{width:72px; height:22px; display:block; background:url(images/ivy_bullet-normal.gif) 0 7px no-repeat #fff; color:#305E5C; line-height:22px; text-decoration:none; padding:0 0 0 15px;}
 +
#headerPan ul.leftmenu li a:hover{background:url(images/ivy_bullet-hover.gif) 0 7px no-repeat #fff; color:#305E5C; line-height:22px; text-decoration:none; padding:0 0 0 15px;}
 +
#headerPan ul.leftmenu li.clients{width:87px; height:22px; border-bottom:none;}
 +
 +
#headerPan ul.botton{width:150px; height:45px; position:absolute; top:-50px; left:80px;}
 +
#headerPan ul.botton li{float:left; height:45px;}
 +
#headerPan ul.botton li.igem a{width:96px; height:45px; display:block; background:url(images/ivy_igem.png) 0 0 no-repeat; text-indent:-200000px; margin:0 12px 0 0;}
 +
/*----/HEADER PANEL----*/
 +
 +
/*----BODY PANEL----*/
 +
#bodyPan{width:686px; background:url(images/ivy_bodybg.gif) 0 0 no-repeat; position:relative; margin:0 auto; padding:22px 0 0 92px;}
 +
/*----Body Left Panel----*/
 +
#leftPan{width:114px; float:left;}
 +
 +
#leftPan h2{width:114px; height:34px; background:#fff; color:#5F7A77; font-size:18px; line-height:34px;}
 +
 +
#leftPan ul{width:114px;}
 +
#leftPan ul li{width:114px; height:24px;}
 +
#leftPan ul li a{width:102px; height:24px; display:block; background:url(images/ivy_bullet2-normal.gif) 0 10px no-repeat #fff; color:#5F7A77; text-decoration:none; line-height:24px; padding:0 0 0 12px;}
 +
#leftPan ul li a:hover{background:url(images/ivy_bullet2-hover.gif) 0 10px no-repeat #fff; color:#5F7A77; text-decoration:none;}
 +
#leftPan ul li span{text-decoration:underline;}
 +
/*----/Body Left Panel----*/
 +
/*----Body Right Panel----*/
 +
#rightPan{width:511px; float:left; border-left:1px solid #C8E8E2; margin:28px 0 0; padding:0 30px;}
 +
#rightPan p{padding:0 0 10px 0;}
 +
#rightPan p.more{width:502px; height:25px; float:left; background:url(images/ivy_sky-color-bg.gif) 0 10px repeat-x; padding:0 0 20px 0;}
 +
#rightPan p.more a{width:92px; height:21px; display:block; background:url(images/ivy_icon2.jpg) 0 0 no-repeat #fff; color:#958201; line-height:21px; text-transform:uppercase; text-decoration:none; margin:0 0 0 328px; padding:4px 0 0 50px;}
 +
#rightPan p.more a:hover{background:url(images/ivy_icon2.jpg) 0 0 no-repeat #fff; color:#645804; text-decoration:none;}
 +
 +
#rightPan h2{width:96px; height:77px; float:left; display:block; background:url(images/ivy_icon3.jpg) 8px 38px no-repeat #B1DED5; color:#fff; font-size:16px; font-weight:bold; line-height:18px; text-transform:uppercase; padding:46px 0 0 75px; margin:0 0 5px 0;}
 +
 +
#rightPan ul.parts{width:137px; height:114px; float:left; border:1px solid #B1DED5; background:#fff; color:#5F7A77; padding:7px 0 0 25px;}
 +
 +
#rightPan ul.parts li.captionone{background:#fff; color:#AC9601; font-size:12px; font-weight:bold; text-decoration:underline;}
 +
 +
#rightPan ul.parts li{width:137px; height:20px;}
 +
#rightPan ul.parts li a{width:125px; height:20px; display:block; background:url(images/ivy_bullet2-normal.gif) 0 7px no-repeat #fff; color:#5F7A77; text-decoration:none; line-height:20px; padding:0 0 0 12px;}
 +
#rightPan ul.parts li a:hover{background:url(images/ivy_bullet2-hover.gif) 0 7px no-repeat #fff; color:#5F7A77; text-decoration:none;}
 +
 +
#rightPan ul.partstwo{width:137px; height:114px; float:left; border-bottom:1px solid #B1DED5; border-top:1px solid #B1DED5;  border-right:1px solid #B1DED5;background:#fff; color:#5F7A77; padding:7px 0 0 25px;}
 +
 +
#rightPan ul.partstwo li.captiontwo{background:#fff; color:#AC9601; font-size:12px; font-weight:bold; text-decoration:underline;}
 +
 +
#rightPan ul.partstwo li{width:137px; height:20px;}
 +
#rightPan ul.partstwo li a{width:125px; height:20px; display:block; background:url(images/ivy_bullet2-normal.gif) 0 7px no-repeat #fff; color:#5F7A77; text-decoration:none; line-height:20px; padding:0 0 0 12px;}
 +
#rightPan ul.partstwo li a:hover{background:url(images/ivy_bullet2-hover.gif) 0 7px no-repeat #fff; color:#5F7A77; text-decoration:none;}
 +
 +
#rightPan h4{width:96px; height:77px; float:left; display:block; background:url(images/ivy_icon4.jpg) 8px 38px no-repeat #DFD79C; color:#fff; font-size:16px; font-weight:bold; line-height:18px; text-transform:uppercase; padding:46px 0 0 75px;  margin:0 0 5px 0;}
 +
 +
#rightPan ul.team{width:305px; height:114px; float:left; border:1px solid #B1DED5; background:#fff; color:#5F7A77; padding:7px 0 0 25px;}
 +
 +
#rightPan ul.team li.captionthree{background:#fff; color:#AC9601; font-size:12px; font-weight:bold; text-decoration:none;}
 +
 +
#rightPan ul.team li{width:305px; height:20px;}
 +
#rightPan ul.team li a{width:293px; height:20px; display:block; background:url(images/ivy_bullet2-normal.gif) 0 7px no-repeat #fff; color:#959595; text-decoration:underline; line-height:20px; padding:0 0 0 12px;}
 +
#rightPan ul.team li a:hover{background:url(images/ivy_bullet2-hover.gif) 0 7px no-repeat #fff; color:#5F7A77; text-decoration:underline;}
 +
 +
/*----/Body Right Panel----*/
 +
/*----/BODY PANEL----*/
 +
/*----/MAIN PANEL----*/
 +
 +
/*----FOOTER PANEL----*/
 +
#footermainPan{height:103px; background:url(images/ivy_footerbg.gif) 0 0 repeat-x #D3F0F0; color:#2F5958; font:13px/20px "Trebuchet MS", Arial, Helvetica, sans-serif; position:relative; margin:0 auto; clear:both; padding:36px 0 0;}
 +
#footerPan{width:778px; position:relative; margin:0 auto;}
 +
 +
#footerPan ul{width:608px; height:20px; position:relative; margin:0 auto;}
 +
#footerPan li{float:left; }
 +
#footerPan ul li a{padding:0 10px 0; color:#2F5958; background:#EBF8F7; text-decoration:none; font-size:13px;}
 +
#footerPan ul li a:hover{text-decoration:underline;}
 +
 +
#footerPan p.copyright{width:250px; margin:10px 0 0 92px;}
 +
 +
#footerPan ul.templateworld{width:250px; background:#D3F0F0; color:#007163; display:block; font-size:10px; position:absolute; top:49px; left:92px;}
 +
#footerPan ul.templateworld li{height:20px;}
 +
#footerPan ul.templateworld li a{background:#D3F0F0; display:block; color:#007163; text-decoration:none; padding:0px; font-size:10px;}
 +
#footerPan ul.templateworld li a:hover{text-decoration:underline;}
 +
/*----/FOOTER PANEL----*/

Revision as of 16:46, 8 October 2014

/* ---------------- WikiMedia Elements / Page Structure ---------------- */

/* HIDE SEARCH CONTROLS AND PAGE TITLE */

  1. p-logo,
  2. search-controls,

.firstHeading {

   display: none;

}

h1, h2, h3, h4, h5, h6 { color: #373737; }

/* REMOVE DEFAULT TOP HEADER */

  1. top-section { /*-- styling for default menu bar (edit, page, history, etc.) --*/

background-color: #f8f8f8; border: 0 none; height: 10px; top: 0; position: fixed; width: 100%; left: 50%; z-index: 1900; margin-left: -487px; -webkit-transition: all 500ms ease;

  -moz-transition: all 500ms ease;
  -ms-transition: all 500ms ease;
  -o-transition: all 500ms ease;
   transition: all 500ms ease;

}

  1. top-section-bar { /*-- styling full width bar which hides behind default menu bar (edit, page, history, etc.) --*/

background-color: #f8f8f8; height: 10px; display: block; z-index: 10; position: fixed; width: 100%; top: 0; } /*

  1. top-section {
   background: #f8f8f8;
   position: fixed;
   top: -10px;
   border: none;
   width: 100%;
   height: auto;
   z-index: -1000;
   margin: 0px auto;
  

}

  • /

/* EDIT AND USER MENU */

  1. menubar {
   font-family: "Lato", Helvetica, sans-serif;
   top: 0 !important;
   font-size: 0.45em;

}

  1. menubar li,
  2. menubar li a:link {
   text-transform: uppercase;

}

/* Highlight with background colour on hover */

  1. top-section:hover #menubar li a {
   color: #777777;

}

  1. menubar li a:link,
  2. menubar li a:visited {
   color: #777777;
   background-color: #f8f8f8;;

}

  1. menubar li a:hover,
  2. menubar li a:focus {
   color: #777777;
   text-decoration: underline;

}


/* EDIT */

  1. menubar.left-menu {
    position: fixed;

background: #f8f8f8;

    margin-left: 0px;

}

  1. menubar.left-menu:hover {
   background-color: #f8f8f8;;

}

/* USER */

  1. menubar.right-menu {

background: #f8f8f8;

   position: fixed;
   margin-right: 0px;

}

/* CSS Document */ body{padding:0px; margin:0px; background:url(images/ivy_main-bg.gif) 0 0 repeat-x #fff; color:#5F7A77; font:13px/19px Arial, Helvetica, sans-serif;} div, p, ul, h2, h3, h4, h5, img{padding:0px; margin:0px;} ul{list-style-type:none}

/*----MAIN PANEL----*/

  1. mainPan{width:778px; position:relative; margin:0 auto;}

/*----TOP PANEL----*/

  1. topPan{width:778px; height:65px; background:url(images/ivy_topbg.jpg) 0 0 no-repeat #fff; color:#828282; position:relative; margin:0 auto;}
  2. topPan img.logo{width:136px; height:31px; position:absolute; top:12px; left:235px;}
  3. topPan p.caption{width:300px; background:#fff; color:#828282; position:absolute; top:43px; left:235px;}

/*----/TOP PANEL----*/

/*----HEADER PANEL----*/

  1. headerPan{width:686px; height:153px; background:url(images/ivy_header.jpg) 0 0 no-repeat; position:relative; margin:0 auto; padding:11px 0 0 92px;}
  1. headerPan ul.leftmenu{width:87px;}
  2. headerPan ul.leftmenu li{width:87px; height:22px; border-bottom:1px dashed #AECCCA;}
  3. headerPan ul.leftmenu li a{width:72px; height:22px; display:block; background:url(images/ivy_bullet-normal.gif) 0 7px no-repeat #fff; color:#305E5C; line-height:22px; text-decoration:none; padding:0 0 0 15px;}
  4. headerPan ul.leftmenu li a:hover{background:url(images/ivy_bullet-hover.gif) 0 7px no-repeat #fff; color:#305E5C; line-height:22px; text-decoration:none; padding:0 0 0 15px;}
  5. headerPan ul.leftmenu li.clients{width:87px; height:22px; border-bottom:none;}
  1. headerPan ul.botton{width:150px; height:45px; position:absolute; top:-50px; left:80px;}
  2. headerPan ul.botton li{float:left; height:45px;}
  3. headerPan ul.botton li.igem a{width:96px; height:45px; display:block; background:url(images/ivy_igem.png) 0 0 no-repeat; text-indent:-200000px; margin:0 12px 0 0;}

/*----/HEADER PANEL----*/

/*----BODY PANEL----*/

  1. bodyPan{width:686px; background:url(images/ivy_bodybg.gif) 0 0 no-repeat; position:relative; margin:0 auto; padding:22px 0 0 92px;}

/*----Body Left Panel----*/

  1. leftPan{width:114px; float:left;}
  1. leftPan h2{width:114px; height:34px; background:#fff; color:#5F7A77; font-size:18px; line-height:34px;}
  1. leftPan ul{width:114px;}
  2. leftPan ul li{width:114px; height:24px;}
  3. leftPan ul li a{width:102px; height:24px; display:block; background:url(images/ivy_bullet2-normal.gif) 0 10px no-repeat #fff; color:#5F7A77; text-decoration:none; line-height:24px; padding:0 0 0 12px;}
  4. leftPan ul li a:hover{background:url(images/ivy_bullet2-hover.gif) 0 10px no-repeat #fff; color:#5F7A77; text-decoration:none;}
  5. leftPan ul li span{text-decoration:underline;}

/*----/Body Left Panel----*/ /*----Body Right Panel----*/

  1. rightPan{width:511px; float:left; border-left:1px solid #C8E8E2; margin:28px 0 0; padding:0 30px;}
  2. rightPan p{padding:0 0 10px 0;}
  3. rightPan p.more{width:502px; height:25px; float:left; background:url(images/ivy_sky-color-bg.gif) 0 10px repeat-x; padding:0 0 20px 0;}
  4. rightPan p.more a{width:92px; height:21px; display:block; background:url(images/ivy_icon2.jpg) 0 0 no-repeat #fff; color:#958201; line-height:21px; text-transform:uppercase; text-decoration:none; margin:0 0 0 328px; padding:4px 0 0 50px;}
  5. rightPan p.more a:hover{background:url(images/ivy_icon2.jpg) 0 0 no-repeat #fff; color:#645804; text-decoration:none;}
  1. rightPan h2{width:96px; height:77px; float:left; display:block; background:url(images/ivy_icon3.jpg) 8px 38px no-repeat #B1DED5; color:#fff; font-size:16px; font-weight:bold; line-height:18px; text-transform:uppercase; padding:46px 0 0 75px; margin:0 0 5px 0;}
  1. rightPan ul.parts{width:137px; height:114px; float:left; border:1px solid #B1DED5; background:#fff; color:#5F7A77; padding:7px 0 0 25px;}
  1. rightPan ul.parts li.captionone{background:#fff; color:#AC9601; font-size:12px; font-weight:bold; text-decoration:underline;}
  1. rightPan ul.parts li{width:137px; height:20px;}
  2. rightPan ul.parts li a{width:125px; height:20px; display:block; background:url(images/ivy_bullet2-normal.gif) 0 7px no-repeat #fff; color:#5F7A77; text-decoration:none; line-height:20px; padding:0 0 0 12px;}
  3. rightPan ul.parts li a:hover{background:url(images/ivy_bullet2-hover.gif) 0 7px no-repeat #fff; color:#5F7A77; text-decoration:none;}
  1. rightPan ul.partstwo{width:137px; height:114px; float:left; border-bottom:1px solid #B1DED5; border-top:1px solid #B1DED5; border-right:1px solid #B1DED5;background:#fff; color:#5F7A77; padding:7px 0 0 25px;}
  1. rightPan ul.partstwo li.captiontwo{background:#fff; color:#AC9601; font-size:12px; font-weight:bold; text-decoration:underline;}
  1. rightPan ul.partstwo li{width:137px; height:20px;}
  2. rightPan ul.partstwo li a{width:125px; height:20px; display:block; background:url(images/ivy_bullet2-normal.gif) 0 7px no-repeat #fff; color:#5F7A77; text-decoration:none; line-height:20px; padding:0 0 0 12px;}
  3. rightPan ul.partstwo li a:hover{background:url(images/ivy_bullet2-hover.gif) 0 7px no-repeat #fff; color:#5F7A77; text-decoration:none;}
  1. rightPan h4{width:96px; height:77px; float:left; display:block; background:url(images/ivy_icon4.jpg) 8px 38px no-repeat #DFD79C; color:#fff; font-size:16px; font-weight:bold; line-height:18px; text-transform:uppercase; padding:46px 0 0 75px; margin:0 0 5px 0;}
  1. rightPan ul.team{width:305px; height:114px; float:left; border:1px solid #B1DED5; background:#fff; color:#5F7A77; padding:7px 0 0 25px;}
  1. rightPan ul.team li.captionthree{background:#fff; color:#AC9601; font-size:12px; font-weight:bold; text-decoration:none;}
  1. rightPan ul.team li{width:305px; height:20px;}
  2. rightPan ul.team li a{width:293px; height:20px; display:block; background:url(images/ivy_bullet2-normal.gif) 0 7px no-repeat #fff; color:#959595; text-decoration:underline; line-height:20px; padding:0 0 0 12px;}
  3. rightPan ul.team li a:hover{background:url(images/ivy_bullet2-hover.gif) 0 7px no-repeat #fff; color:#5F7A77; text-decoration:underline;}

/*----/Body Right Panel----*/ /*----/BODY PANEL----*/ /*----/MAIN PANEL----*/

/*----FOOTER PANEL----*/

  1. footermainPan{height:103px; background:url(images/ivy_footerbg.gif) 0 0 repeat-x #D3F0F0; color:#2F5958; font:13px/20px "Trebuchet MS", Arial, Helvetica, sans-serif; position:relative; margin:0 auto; clear:both; padding:36px 0 0;}
  2. footerPan{width:778px; position:relative; margin:0 auto;}
  1. footerPan ul{width:608px; height:20px; position:relative; margin:0 auto;}
  2. footerPan li{float:left; }
  3. footerPan ul li a{padding:0 10px 0; color:#2F5958; background:#EBF8F7; text-decoration:none; font-size:13px;}
  4. footerPan ul li a:hover{text-decoration:underline;}
  1. footerPan p.copyright{width:250px; margin:10px 0 0 92px;}
  1. footerPan ul.templateworld{width:250px; background:#D3F0F0; color:#007163; display:block; font-size:10px; position:absolute; top:49px; left:92px;}
  2. footerPan ul.templateworld li{height:20px;}
  3. footerPan ul.templateworld li a{background:#D3F0F0; display:block; color:#007163; text-decoration:none; padding:0px; font-size:10px;}
  4. footerPan ul.templateworld li a:hover{text-decoration:underline;}

/*----/FOOTER PANEL----*/