Template:KCII-CSIA-Main-Navigation-English

Revision as of 18:38, 29 October 2020 by Nick.frenette (talk | contribs)

Template:Inspire rainbow styles <html><style> /*Hide the first heading*/

  1. firstHeading {
   display: none;

} /*Hide the language box when not signed in*/ .langBox {

   display: none;

} /*Hide the "back" link at top of page for subpages (breadcrum)*/

  1. contentSub {
   display: none;

}

<head> <title>GCdocs Program Layout</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <style> body {

  margin: 0;
  padding: 0;

}

/* Style the header */

  • {
  box-sizing: border-box;
  margin: 0;
  padding: 0;

}

.img-container { margin:0;

  background-image: url(http://www.gcpedia.gc.ca/gcwiki/images/b/bb/GCdocs-GCpedia-banner-high-resolution%28BIL%29.png);
  background-size: 1178px 239px;
  min-height: 239px;
  margin: 0 auto;
  padding : 0;
  background-repeat: no-repeat;
  background-position: center top;
 }
.img-container a{

display: block;

   width: 1178px;
   height: 239px;
   text-decoration: none;
  text-align: center;
   cursor: pointer;
   overflow: hidden;
   text-indent: 100%;
   white-space:nowrap;
 }


/*Navigation Bar*/

.nav {

  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #2F6632;
  text-align: center;
  text-decorationː none;
  font-family: Helvetica, sans-serif;
  font-size:20pt;
  font-weight: bold;
  border-top: none;

line-height:20px; }

.nav li {

  display: inline-block; 
  text-decorationː none;

} .nav a {

  display: block;
  color: white;
  text-align: center;
  padding: 16px;
  border-bottom: none;
  text-transform: uppercase;

} .nav a:hover {

  background-color: #71bd66;
 text-decorationː none;
}
/*Responsive*/

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

  .nav a:not(:first-child) {display: none;}
  .nav a.icon {
   float: right;
   display: block;

}

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

 .nav.responsive {position: relative;}
 .nav.responsive .icon {
   position: absolute;
   right: 0;
   top: 0;
 }
 .nav.responsive a {
   float: none;
   display: block;
   text-align: left;
 }

</style> </head> <body>

</a>

</body> </html>