Difference between revisions of "Template:Rice"

Line 4: Line 4:
 
<style>
 
<style>
  
−
        /*-- Remove borders, float content left and remove padding/margin */
+
      /*-- Remove borders, float content left and remove padding/margin */
−
        #globalWrapper, #content{
+
      #globalWrapper, #content{
 
                 width: 100%;
 
                 width: 100%;
−
}
+
}
  
 
                 #top_menu_14 { padding-left:11%}
 
                 #top_menu_14 { padding-left:11%}
  
−
</style>
+
</style>
  
 
<!-- Declare that you are going to use html code instead of wiki code -->
 
<!-- Declare that you are going to use html code instead of wiki code -->
−
<html>
+
<html>
  
 
<!-- Start of CSS-->
 
<!-- Start of CSS-->
−
<style type="text/css">
+
<style type="text/css">
  
−
/* PAGE LAYOUT */
+
/* PAGE LAYOUT */
  
  
−
/* Change Background color*/
+
/* Change Background color*/
−
body {  
+
body {  
−
background-color: #1b1c3a;
+
background-color: #1b1c3a;
−
                }
+
              }
  
−
/* Creates a container that will wrap all of the content inside your wiki pages. */
+
/* Creates a container that will wrap all of the content inside your wiki pages. */
−
#mainContainer {   
+
#mainContainer {   
−
width: 100%;
+
width: 100%;
−
float:left;
+
float:left;
−
margin-left: 0px;
+
margin-left: 0px;
 
                                 margin-right: 0px;
 
                                 margin-right: 0px;
−
margin-bottom: 10px;
+
margin-bottom: 10px;
−
background-color: #FFFFFF;  
+
background-color: #FFFFFF;  
−
border-bottom: 0px solid #565656;
+
border-bottom: 0px solid #565656;
−
border-right: 0px solid #565656;
+
border-right: 0px solid #565656;
−
border-left: 0px solid #565656;
+
border-left: 0px solid #565656;
−
border-top: 0px solid #565656;
+
border-top: 0px solid #565656;
−
font-family: "Trebuchet MS", Helvetica, sans-serif;
+
font-family: "Trebuchet MS", Helvetica, sans-serif;
  
−
}
+
}
  
−
/* Creates the container for the menu */
+
/* Creates the container for the menu */
−
#menuContainer  {  
+
#menuContainer  {  
−
float: left;
+
float: left;
−
width: 100%;
+
width: 100%;
−
margin:0;
+
margin:0;
−
padding:0;
+
padding:0;
−
background-color: #1b1c3a;
+
background-color: #1b1c3a;
−
margin-top: 0px;
+
margin-top: 0px;
−
z-index:0;
+
z-index:0;
−
+
 
             }
 
             }
  
−
+
/* Creates the container for the content */
−
/* Creates the container for the content */
+
#contentContainer {
−
#contentContainer {
+
padding-top:20px;
−
padding-top:20px;
+
padding-bottom: 20px;
−
padding-bottom: 20px;
+
padding-right:20px;
−
padding-right:20px;
+
padding-left: 20px;
−
padding-left: 20px;
+
margin-bottom: 10px;
−
margin-bottom: 10px;
+
margin-left: 20px;
−
margin-left: 20px;
+
margin-right: 20px;
−
margin-right: 20px;
+
width: 92%;
−
width: 92%;
+
float: left;
−
float: left;
+
background-color: #FFFFFF;  
−
background-color: #FFFFFF;  
+
font-family: "Trebuchet MS", Helvetica, sans-serif;
−
font-family: "Trebuchet MS", Helvetica, sans-serif;
+
}
−
}
+
  
−
/*Set up height place holder for the title*/
+
/*Set up height place holder for the title*/
−
#titleContainer {
+
#titleContainer {
 
                         width: 100%;
 
                         width: 100%;
−
height:auto;
+
height:auto;
−
overflow:hidden;
+
overflow:hidden;
−
margin: 0px;
+
margin: 0px;
 
                         background-color: #1b1c3a;
 
                         background-color: #1b1c3a;
−
text-align:center;
+
text-align:center;
 
                         text-shadow: 2px 2px #000000;
 
                         text-shadow: 2px 2px #000000;
−
}
+
}
  
−
/*Set up height place holder for the banner*/
+
/*Set up height place holder for the banner*/
−
#bannerContainer {
+
#bannerContainer {
 
                         width: 100%;
 
                         width: 100%;
 
                         height: 75%;
 
                         height: 75%;
−
/*overflow:hidden;*/
+
/*overflow:hidden;*/
−
margin: 0px;
+
margin: 0px;
−
text-align:center;
+
text-align:center;
−
} */
+
} */
  
−
/*VISUAL STYLE (TABLES, FONTS, LINKS, IMAGES, UL) */
+
/*VISUAL STYLE (TABLES, FONTS, LINKS, IMAGES, UL) */
  
 +
/*Change the styling of text for everything inside main container*/
 +
#mainContainer p {
 +
font-size: 15px;
 +
color: #000000;
 +
}
 +
/*This changes the color and font family */
 +
#contentContainer h1, h2, h3, h4, h5, h6 {
 +
color: #565656;
 +
border-bottom: none;
 +
font-weight: bold;
 +
font-family: "Trebuchet MS", Helvetica, sans-serif;
 +
margin-top:0px;
 +
}
  
−
/*Change the styling of tables */
+
/*Style of the links - links are different inside the menu */
−
        #contentContainer table {
+
#contentContainer a {  
−
    border: 1px solid #565656;
+
font-weight: bold;
−
    border-collapse: collapse;
+
color: #000000;
−
    width: 90%
+
                                font-size: 100%;
−
    margin: auto;
+
}
−
    margin-bottom: 0px;
+
−
    margin-top: 0px;
+
−
    margin-right: 0px;
+
−
    margin-left: 0px;
+
−
    }
+
  
−
/*Change the styling of table cells*/
+
/* Styling links on hover- links are different inside the menu */
−
    #contentContainer  td {
+
/* #contentContainer a:hover {
−
    padding: 0px;
+
color: #59BF92;
−
    border: 1px solid #565656;
+
} */
−
    border-collapse: collapse;
+
 
−
    vertical-align: text-top;
+
/*Change the styling of tables */
 +
      #contentContainer table {
 +
    border: 1px solid #565656;
 +
    border-collapse: collapse;
 +
    width: 90%
 +
    margin: auto;
 +
    margin-bottom: 0px;
 +
    margin-top: 0px;
 +
    margin-right: 0px;
 +
    margin-left: 0px;
 +
    }
 +
 
 +
/*Change the styling of table cells*/
 +
    #contentContainer  td {
 +
    padding: 0px;
 +
    border: 1px solid #565656;
 +
    border-collapse: collapse;
 +
    vertical-align: text-top;
 
                                
 
                                
−
    }
+
    }
 +
 
 +
/*Change the styling of table headers */
 +
    #contentContainer th {
 +
    background-color: #FFFFFF;
 +
    padding: 0px;
 +
    border: 1px solid #565656;
 +
    border-collapse: collapse;
 +
    vertical-align: text-top;
 +
    }
 +
 
 +
 
 +
 
 +
/*MENU STYLING */
 +
 
 +
#menuContainer {
 +
text-align: center;
 +
                                        padding-top: 10px;
 +
                                        padding-bottom: 20px;
 +
    }
 +
 
 +
#menuContainer > ul a {
 +
color: #FFF;
 +
}
 +
#menuContainer > ul {
 +
list-style: none;
 +
margin-left: 0;
 +
padding-top: 10px;
 +
text-align: center;
 +
                                        width: 100%
 +
}
 +
#menuContainer > ul ul {
 +
list-style: none;
 +
margin-left: 0%;
 +
padding-top: 0;
 +
text-align: center;
 +
                                        width: 100%
 +
}
 +
#menuContainer > ul li {
 +
position: relative;
 +
text-align: center;
 +
}
 +
#menuContainer > ul a {
 +
padding: 10px 8px;
 +
display: block;
 +
text-decoration: none;
 +
font-family: "Helvetica Neue", Helvetica, sans-serif;
 +
font-size: 155%;
 +
}
 +
#menuContainer > ul a:hover {
 +
background: #000;
 +
background-color: #3b3d63;
 +
}
 +
 
 +
 
 +
/* Level 1 Drop Down Menu */
 +
#menuContainer > ul > li {
 +
display: inline-block;
 +
vertical-align: top;
 +
margin-left: -4px; /* solve the 4 pixels spacing between list-items */
 +
}
 +
#menuContainer > ul > li:first-child {
 +
margin-left: 0;
 +
}
 +
#menuContainer > ul > li > a {}
 +
#menuContainer > ul > li > a:hover {}
 +
 +
 +
/* Level 2 */
 +
#menuContainer > ul > li > ul {
 +
text-align: left;
 +
width: auto; /* change auto value with 200px if you want a bigger menu */
 +
display: none;
 +
background-color: #1b1c3a;
 +
position: absolute;
 +
top: 100%;
 +
left: 0;
 +
                                        margin-top: 0px;
 +
z-index: 9999999; /* if you have YouTube iframes, is good to have a bigger z-index so the video can appear above the video */
 +
}
 +
#menuContainer > ul > li:hover > ul{
 +
display: block;
 +
 +
}
 +
#menuContainer > ul ul li a {}
 +
#menuContainer > ul ul li a:hover {}
 +
/* Level 3 */
 +
#menuContainer > ul > li > ul > li > ul {
 +
text-align: left;
 +
display: none;
 +
background: #1b1c3a;
 +
position: absolute;
 +
left: 100%;
 +
top: -5px;
 +
z-index: 9999999;
 +
}
 +
#menuContainer > ul > li > ul > li:hover > ul {
 +
display: block;
 +
}
 +
#menuContainer > ul ul ul li {}
 +
#menuContainer > ul ul ul li a {}
 +
#menuContainer > ul ul ul li a:hover {}
 +
#menuContainer.navItem {
 +
                          pointer-events: auto;
 +
}
 +
                        #Directory { 
 +
width: 100%;
 +
overflow:hidden;
 +
float:left;
 +
margin-left:20px;
 +
                                margin-right: 20px;
 +
margin-bottom: 0px;
 +
background-color: #000000;
 +
border-bottom: 0px solid #565656;
 +
border-right: 0px solid #565656;
 +
border-left: 0px solid #565656;
 +
border-top: 0px solid #565656;
 +
font-family: "Trebuchet MS", Helvetica, sans-serif;
 +
}               
 +
                          /*Style the Directory*/     
 +
                          #Directory table {
 +
                                Background-color: #000000;
 +
                                color: #FFFFFF;
 +
                                margin-left: 0px;
 +
                                padding: 20px;
 +
                                line-height: 10px;
 +
                                height: 100px;
 +
                                width:100%;
 +
                                /*float:left;*/
 +
                          }
 +
               
 +
 
 +
                /*Style the Directory button*/     
 +
                        #Directory li a{
 +
                                color: #000000;
 +
                                padding: 0px;
 +
                        }     
  
−
/*Change the styling of table headers */
+
img.button {
−
    #contentContainer th {
+
    opacity: 1.0;
−
    background-color: #FFFFFF;
+
    filter: alpha(opacity=100); /* For IE8 and earlier */
−
    padding: 0px;
+
}
−
    border: 1px solid #565656;
+
−
    border-collapse: collapse;
+
−
    vertical-align: text-top;
+
−
    }
+
  
 +
img.button:hover {
 +
    opacity: 0.7;
 +
    filter: alpha(opacity=80); /* For IE8 and earlier */
 +
}
  
  
−
/*CLASSES */
+
/*CLASSES */
  
−
/*Clear class for all the pages, adds spacing too*/
+
/*Clear class for all the pages, adds spacing too*/
−
.clear{
+
.clear{
−
clear:both;
+
clear:both;
−
height: 10px;
+
height: 10px;
−
}
+
}
  
  
−
/* highlight box for special messages */
+
/* highlight box for special messages */
−
    .highlightBox {
+
    .highlightBox {
−
        width:500px;  
+
      width:500px;  
 
                                 margin:auto;
 
                                 margin:auto;
−
        background-color: #E8E8E9;  
+
      background-color: #E8E8E9;  
−
margin-bottom: 15px;
+
margin-bottom: 15px;
−
margin-top: 15px;
+
margin-top: 15px;
−
padding: 15px;
+
padding: 15px;
−
padding-top: 10px;
+
padding-top: 10px;
−
    }
+
    }
  
 
         h1 {
 
         h1 {
Line 182: Line 341:
  
 
<head>  
 
<head>  
−
 
 
</head>
 
</head>
  

Revision as of 00:42, 26 July 2016