Difference between revisions of "Template:UIUC Illinois STYLE"

 
(48 intermediate revisions by one other user not shown)
Line 2: Line 2:
 
<style>
 
<style>
  
 +
/*Navigation bar styling*/
 +
.topnav {
 +
    background-color: white;
 +
    overflow: hidden;
 +
    left: 0;
 +
    right: 0;
 +
    height: 150px;
 +
    padding-right: 15px;
 +
}
 +
/* Style the links inside the navigation bar */
 +
 +
.topnav a {
 +
    float: left;
 +
    display: block;
 +
    color: rgb(44, 166, 226);
 +
    text-align: center;
 +
    padding: 16px;
 +
    text-decoration: none;
 +
    font-size: 17px;
 +
    width: 11%;
 +
    position: relative;
 +
 +
}
 +
 +
/*Center the navbar elements with words*/
 +
#centered{
 +
    top:76px;
 +
}
 +
/* Change the color of links on hover */
 +
 +
.topnav a:hover {
 +
    background-color: rgb(44, 166, 226);
 +
    color: white;
 +
}
 +
/* Hide the link that should open and close the topnav on small screens */
 +
 +
.topnav .icon {
 +
    display: none;
 +
}
 +
 +
/*Back to the top button styling*/
 +
#myBtn{
 +
    display: none; /* Hidden by default */
 +
    position: fixed; /* Fixed/sticky position */
 +
    /* Place the button at the bottom of the page */
 +
    bottom: 0px;
 +
    left: 0px;
 +
    z-index: 99; /* Make sure it does not overlap */
 +
    border: none; /* Remove borders */
 +
    outline: none; /* Remove outline */
 +
    background-color: rgb(44, 166, 226); /* Set a background color */
 +
    color: white; /* Text color */
 +
    cursor: pointer; /* Add a mouse pointer on hover */
 +
    padding: 15px; /* Some padding */
 +
    border-radius: 10px; /* Rounded corners */
 +
}
 +
 +
#myBtn:hover {
 +
    background-color: #555; /* Add a dark-grey background on hover */
 +
}
 +
 +
#teamHeading h2{
 +
    top: -100px;
 +
 +
}
 +
 +
 +
/*================================================================================*/
 +
.image_wrap{
 +
 +
  position: relative;
 +
  width: 100%;
 +
 +
}
 +
h2 {
 +
  position: absolute;
 +
  top: 200px;
 +
  left: 0;
 +
  width: 100%;
 +
}
 +
 +
#home_logo, #sideMenu { display:none; }
 +
#sideMenu, #top_title, .patrollink  {display:none;}
 +
#content { width:1490px; padding:0px;  margin-top:7px; margin-left:0px;}
 +
body {background-color:white; }
 +
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
 +
 +
 +
 +
#fh5co-footer {
 +
  padding: 7em 0;
 +
  float: left;
 +
  width: 100%;
 +
  position: relative;
 +
  background: #262626;
 +
}
 +
 +
.container- {
 +
  margin-right: auto;
 +
  margin-left: auto;
 +
  padding-left: 15px;
 +
  padding-right: 15px;
 +
}
 +
 +
.text-center {
 +
  text-align: center;
 +
}
 +
 +
.fh5co-copyright {
 +
  border-top: 1px solid rgba(255, 255, 255, 0.1);
 +
  clear: both;
 +
  margin-top: 40px !important;
 +
  padding: 40px 0 0 0;
 +
}
 +
.fh5co-copyright span {
 +
  display: block;
 +
  color: rgba(255, 255, 255, 0.5);
 +
}
 +
@media screen and (max-width: 480px) {
 +
  .fh5co-copyright {
 +
    text-align: left !important;
 +
  }
 +
  .fh5co-copyright span {
 +
    display: inline;
 +
  }
 +
}
 +
 +
 +
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
 +
  position: relative;
 +
  min-height: 1px;
 +
  padding-left: 15px;
 +
  padding-right: 15px;
 +
}
 +
 +
 +
.dropdown {
 +
   
 +
    overflow: hidden;
 +
}
 +
 +
.dropdown .dropbtn {
 +
    font-size: 16px;   
 +
    border: none;
 +
    outline: none;
 +
    color: white;
 +
 
 +
    background-color: inherit;
 +
}
 +
 +
.dropdown:hover .dropbtn {
 +
    background-color: red;
 +
}
 +
 +
.dropdown-content {
 +
    display: none;
 +
    position: relative;
 +
    background-color: #f9f9f9;
 +
    min-width: 160px;
 +
   
 +
    z-index: 100;
 +
}
 +
 +
.dropdown-content a {
 +
 
 +
    color: black;
 +
   
 +
    text-decoration: none;
 +
    display: block;
 +
    text-align: left;
 +
}
 +
 +
.dropdown-content a:hover {
 +
    background-color: #ddd;
 +
}
 +
 +
.dropdown:hover .dropdown-content {
 +
    display: block;
 +
}
  
  
Line 8: Line 187:
 
     background-color: #333;
 
     background-color: #333;
 
     overflow: hidden;
 
     overflow: hidden;
 +
    left:0;
 +
    right:0;
 +
   
 +
    padding-right: 15px;
 +
 
 
}
 
}
  
 
/* Style the links inside the navigation bar */
 
/* Style the links inside the navigation bar */
 
.topnav a {
 
.topnav a {
−
     float: left;
+
     float:left;
 
     display: block;
 
     display: block;
 
     color: #f2f2f2;
 
     color: #f2f2f2;
Line 19: Line 203:
 
     text-decoration: none;
 
     text-decoration: none;
 
     font-size: 17px;
 
     font-size: 17px;
 +
    width:12.5%;
 
}
 
}
  
Line 42: Line 227:
  
 
}
 
}
−
 
+
−
 
+
lnr-envelope{
 +
  color:white;
 +
  font-size:10px;
 +
}
 
  #menu-icon .lnr-home {
 
  #menu-icon .lnr-home {
 
   position:absolute;
 
   position:absolute;
−
   left:20px;
+
   left:1.4cm;
 
   top:1px;
 
   top:1px;
 
   color: #0F52BA;
 
   color: #0F52BA;
Line 57: Line 245:
 
#menu-icon .lnr-rocket {
 
#menu-icon .lnr-rocket {
 
   position: absolute;
 
   position: absolute;
−
  left:110px;
+
  left:5.3cm;
 
   top:1px;
 
   top:1px;
 
   color: #0F52BA;
 
   color: #0F52BA;
Line 69: Line 257:
 
#menu-icon .lnr-users {
 
#menu-icon .lnr-users {
 
   position: absolute;
 
   position: absolute;
−
  left:190px;
+
  left:9.3cm;
 
   top:1px;
 
   top:1px;
 
   color: #0F52BA;
 
   color: #0F52BA;
Line 80: Line 268:
 
#menu-icon .lnr-cog {
 
#menu-icon .lnr-cog {
 
   position: absolute;
 
   position: absolute;
−
   left:270px;
+
   left:13.3cm;
 
   top:1px;
 
   top:1px;
 
   color: #0F52BA;
 
   color: #0F52BA;
Line 91: Line 279:
 
#menu-icon .lnr-drop {
 
#menu-icon .lnr-drop {
 
   position:absolute;
 
   position:absolute;
−
   left:360px;
+
   left:17.2cm;
 
   top:1px;
 
   top:1px;
 
   color: #0F52BA;
 
   color: #0F52BA;
Line 102: Line 290:
 
.lnr-phone-handset {
 
.lnr-phone-handset {
 
   position: relative;
 
   position: relative;
−
   left:630px;
+
   left:21cm;
 
   top:1px;
 
   top:1px;
 
    
 
    
Line 114: Line 302:
 
.lnr-hourglass {
 
.lnr-hourglass {
 
   position:absolute;
 
   position:absolute;
−
   left:500px;
+
   left:25cm;
 
   top:1px;
 
   top:1px;
 
   color: #0F52BA;
 
   color: #0F52BA;
Line 125: Line 313:
 
.lnr-earth {
 
.lnr-earth {
 
   position:absolute;
 
   position:absolute;
−
  left:730px;
+
left:29cm;
 
   top:1px;
 
   top:1px;
 
   color: #0F52BA;
 
   color: #0F52BA;
Line 1,409: Line 1,597:
 
   
 
   
  
−
 
+
.icon-facebook-square:before {
 +
    content: "\f082";
 +
}
  
  

Latest revision as of 17:30, 29 July 2017