Difference between revisions of "Team:Central Calgary/Template:CentraliGEM/CSS"

Line 1: Line 1:
 
@charset "utf-8";
 
@charset "utf-8";
  
 +
#globalWrapper {
 +
    font-size: 127%;
 +
    margin: 0;
 +
    padding: 0;
 +
    position: relative;
 +
    width: 100%;
 +
}
  
 
#contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo {
 
#contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo {

Revision as of 21:19, 27 August 2015

@charset "utf-8";

  1. globalWrapper {
   font-size: 127%;
   margin: 0;
   padding: 0;
   position: relative;
   width: 100%;

}

  1. contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo {
   display:none;}
  1. top-section {
   border: none;
   height: 0px;}
  1. content {
   border: none;}

/* Removes "teams" from the menubar */

  1. menubar > ul > li:last-child {
   display: none;}

/* Resizes the menubar to fik the links (default is 400px) */

  1. menubar {
   width: auto;}


/*Make sure to update on launch*/ @font-face{ font-family: RobotoThin; src: url('RobotoThin.ttf'); font-stretch: thin; }

@font-face{ font-family: BebasNeue; src: url('BebasNeue.otf'); }

@font-face{ font-family: RobotoRegular; src: url('Roboto-Regular.ttf'); }

@font-face{ font-family: RobotoLight; src: url('Roboto-Light.ttf'); }

h1 { font-family: "RobotoLight"; font-size: 24px; } /*Remove all default margins of the browser*/

  • {

margin: 0; padding: 0; }


body {

   background-color: #F2FAFF;
   background-size: 100%

}

/*-----------Header stuff------------*/ /*********Empty header that is swapped with the following 2 headers**********/

/* Header text styling .header { background: #FFCA19; height: 220px; position: relative; }

  • //*(url(Central-menubar.jpg);

background-position: left bottom; background-repeat: no-repeat; /*Header that sticks to the top when scrolled*/ .headerSticky-scroll { position:fixed; width: 100%; height: 70px;

   background: #333333;

z-index: 2; whitespace: nowrap; }

  1. center {
 width: 70%;
 background: #eee;
 margin: 10px auto;
 position: relative;
 text-align: center;

}

/* Parent container that holds the header text */

  1. menuText {

position: absolute; font-size: 30; top: 5px; left: 12px; font-family: "RobotoLight"; color: #ffffff; margin-bottom: 20;

}

  1. homeText {

position: relative; font-family: "RobotoLight"; font-size: 36px; vertical-align: central; padding-bottom: 30px; display: table-cell; vertical-align: middle; }

  1. name {

position: fixed;

   margin-left: 80px;

margin-top: 10px; text-align:justify;

}

.parentMenu { position: fixed; width: 710px; top: 8px; margin-left: 25%; margin-right: 30%; font-weight: 300;

   font-family: "RobotoLight";
   font-weight: 100;
   vertical-align: middle;

}

.nav {

	  background-color: #1256DC 

/*border: 1px solid #FFFFFF;*/ border-radius: 5px; box-shadow: 0 0px 8px 10px #888888); color: #FFFFFF; display: inline-block; margin: 2px 22px 8px 22px; overflow: hidden; width:100%; align: center;


}

.nav ul { color: #FFFFFF

   margin: 0;
   padding: 0;

}

.nav ul li {

     display: inline-block;
     list-style-type: none;
       -webkit-transition: all 0.2s;
       -moz-transition: all 0.2s;
       -ms-transition: all 0.2s;
       -o-transition: all 0.2s;
       transition: all 0.2s; 

}

.nav > ul > li > a > .caret {

       border-top: 4px solid #FFFFFF;
       border-right: 4px solid transparent;
       border-left: 4px solid transparent;
       content: "";
       display: inline-block;
       height: 0;
       width: 0;
       vertical-align: middle;
 
       -webkit-transition: color 0.1s linear;
         -moz-transition: color 0.1s linear;
       -o-transition: color 0.1s linear;
         transition: color 0.1s linear; 
     }

.nav > ul > li > a {

       color: #FFFFFF;
       display: block;
       line-height: 56px;
       padding: 0 24px;
       text-decoration: none;
     }

.nav > ul > li:hover {

         background-color: 

}

.nav > ul > li:hover > a {

         color: #FFFFFF;

}

.nav > ul > li:hover > a > .caret {

         border-top-color: #FF9B19;

}

.nav > ul > li > div {

       background-color: #FF9B19;
       border-top: 0;
       border-radius: 0 0 4px 4px;
       box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.055);
       display: none;
       margin: 0;
       opacity: 0;
       position: absolute;
       width: 165px;
       visibility: hidden;
 
       -webkit-transiton: opacity 0.2s;
       -moz-transition: opacity 0.2s;
       -ms-transition: opacity 0.2s;
       -o-transition: opacity 0.2s;
       -transition: opacity 0.2s;

}

.nav > ul > li:hover > div {

         display: block;
         opacity: 1;
         visibility: visible;

}

.nav > ul > li > div ul > li {

           display: block;

}

.nav > ul > li > div ul > li > a {

             color: #fff;
             display: block;
             padding: 12px 24px;
             text-decoration: none;

}

.nav > ul > li > div ul > li:hover > a {

             background-color: rgba( 255, 255, 255, 0.1);

}


  1. socialParent {

position: fixed; display: inline-block; margin-left: 10%; }


/*Row 1 of the social icons*/

/*BODY SHAIZA--*/

  1. bodyContent {

position: relative; z-index: 1; }

  1. homeonetext {

position: absolute; display: block; width: 800px; margin-left: 500px; text-align: justify; }

  1. homeoneline {

color: #FFFFFF; margin-top: 4px; margin-bottom: 8px;

}

  1. homeoneimage {

position: absolute;

}

  1. hometwotext {

position: absolute; display: block; width: 800px; margin-left: 150px; text-align: justify; }

  1. hometwoline {

color: #FFFFFF; margin-top: 4px; margin-bottom: 8px;

}

  1. hometwoimage {

position: absolute; margin-right: 80; margin-left: 67%; }

  1. homeOne {

position: relative; display: block; padding-top:90px; padding-left: 20px; padding-right: 20px; width: 100%; height: 300px; background: #7F7F79; color: #ffffff; font-family: "RobotoLight";

}


  1. homeTwo {

position: relative; display: block; padding-top:90px; padding-left: 20px; padding-right: 20px; width: 100%; height: 300px; background: #4C4C49; color: #ffffff; font-family: "RobotoLight";

}

  1. homeThree {

position: relative; display: block; padding-top:90px; padding-left: 20px; padding-right: 20px; width: 100%; height: 300px; background: #8A7B65; color: #ffffff; font-family: "RobotoLight";

}


  1. homethreetext {

position: absolute; display: block; width: 800px; margin-left: 500px; text-align: justify; }

  1. homethreeline {

color: #FFFFFF; margin-top: 4px; margin-bottom: 8px;

}

  1. homethreeimage {

position: absolute;

}

  1. homeFour {

position: relative; display: block; padding-top:90px; padding-left: 20px; padding-right: 20px; width: 100%; height: 300px; background: #687F7D; color: #ffffff; font-family: "RobotoLight";

}

/*footer--------------------------------------------------------*/

  1. footer {

position: absolute; display: block; width: 100%; background: #333333; height: 450px; font-weight: bold;

}

  1. map {

position: absolute; margin-top: 118px; margin-left: 30px; box-shadow: 8px 8px 50px #000000;

}

  1. footerWords {

position: relative; width: 805px; margin-left: 35%; margin-top: 150px; font-family: "RobotoThin"; text-align: justify; color: white; font-size: 20px; }

  1. footerLine {

width: 805px; color: #FFFFFF; margin-top: 4px; margin-bottom: 8px; }

  1. footerTop {

position: absolute; background: #333333; box-shadow: 0px 5px 10px #000000; width: 100%; margin-bottom: 1000px; z-index: 2;


}

  1. footerText {

font-family: "RobotoLight"; margin-top: 1%; text-align: center; color: white; }