Team:Central Calgary/css/central igem.css

@charset "utf-8";

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

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

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

/*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; }

• /

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

   background: #FFAF46;

z-index: 5; box-shadow: 0px 0px 10px #888888; 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: fixed; top: 15px; left: 12px; font-family: "RobotoThin"; color: #ffffff }

1. homeText {

position: fixed;

}

.parentMenu { position: absolute; left: 200px; width: 710px; top: -8px; }

.nav {

	  background-color: #FF900;

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

}

.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: #FF9B19

}

.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; }

/*Row 1 of the social icons*/ .icon { display: inline-block; padding: 15px 2px; margin-left: 23px; opacity: 0.7; filter: alpha(opacity=70); /* for IE*/ }

.icon:hover { padding: 15px 2px; margin-left: 23px; opacity: 2; }

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

1. footerTop {

font-family: "RobotoThin"; font-style: italic; text-align: center; color: white; position: relative; margin: 0px; height: 55px;

background: #7EC9FE; display: block; box-shadow: 0px 0px 10px #888888; width: 100%; display: table;

}

1. footerText {

display: table-cell; text-align: center; vertical-align: middle; font-size: 30; }