* {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; 
    }
    body{
        width:75%;
        font-size:16px;
        font-family:arial, "san serif";
        margin:auto;
        background-color:#952600;
    }
    .page{
        margin-top:2%;
        background-color:#fff;
    }
    h1{
        font-size:225%;
        font-family:"Times New Roman", serif;
    }
/*header module: holds logo and main navigation*/    
    #logo{
        text-align:left;
        padding:2% 0%;
    }
    #main-navigation{
        padding:2%;
        text-align:center;    
        background-color:#006836;
        margin:0%;
    }
    #main-navigation li{        
        font-family:"Times New Roman", serif;
        font-size:100%;
        display:inline;
        padding-right:6%;
        text-align:left;
        margin:0%;
    }
    #main-navigation li a{
        color:rgb(255,255,255);
        text-decoration:none;
    }
    #main-navigation li a:hover{
        background-color:#952600;
    }
    
   
/*Home page*/
    #blocks{
        overflow:auto;
        width:100%;
    }
    #block2, #block3{
        float:left;
        width:48%;
        padding:1%;
    }
     #block1{
        border-style:outset;
        margin:2%;
    }
    #block2{
        border-right:outset;
        margin-left:1%;
        padding-right:3%;
    }
     #block3{
        margin-left:2%
    }
    #block3 h2{
        padding:.4%
    }
    #block1{
         line-height:1.4em;
         padding:0% 1%;
    }
     #block1 h2, #block2 h2, #block3 h2{
        color:#006836;
        text-align:center;
        border:outset;
    }
    #block2 ul{
        list-style:none;
        line-height:2em;
    }
     #block2 li{
        padding:2%;
    }
    #block2 a:hover{
        background-color:#952600;
    }
    #block3 p, #block3 a{
        width:50%;
        float:left;
        overflow:auto;
    }
     #block3{
        line-height:1.4em;
    }
     #block3 a{
        text-align:center;
        margin-top:8%;
    }
    #block3 a{
        text-align:center;
    }
    #block3 a:hover{
        background-color:#006836;
    }
/*Terminology and Deliberate Practice pages - secondary navigation*/
    #container{
        overflow:auto;
        width:100%
    }
    #main, #secondary{
        float:left; 
    }
    #main{
        width:35.5%;
        background-color:#006836;
        margin:2% 0% 2% 0%;
        color:#fff;
    }
    #main ul{
        padding:2% 0% 4% 8%;
        margin:0%;
    }
    #main li{
        list-style:none;
        padding-bottom:3%;
    }
    #main li a{
        color:rgb(255,255,255);
        text-decoration:none;
    }
    #main li a:hover{
        background-color:#952600;
        text-decoration:underline;
    }
     #main h1{
        padding:0% 0% 0% 4%;
        margin:3%; 
        border-bottom:outset;         
    }
/*box with defined term*/
    #secondary{
        width:60%;
    }
     #secondary p{
        border-style:outset;
        line-height:1.4em;
        margin:1% 0% 0% 10%;
        padding:4%;
    }
    #secondary h1{
        margin:5% 0% 0% 10%;
    }
     #secondary p a:hover{
        color:#006836;
    }
    #secondary p a{
        color:#952600;
    }
    /*Rules and Regulations page combined with Resources page*/

    .explanation{
        margin:2%;
        padding:0% 2%;
        line-height:1.4em;
        border-style:outset;
    }
    #rules-regs, #resources{
        margin:1%;
        padding:1%;
        background-color:#006836;
        color:#fff;
        
    }
    #rules-regs ul, #resources ul{
        color:#fff;
        list-style:none;
        padding-bottom:1%;
    }
    #resources li{
        padding-bottom:2%;
    }
    #rules-regs .topic{
        text-decoration:underline;
    }
    .link li{
        list-style:disc;
    }
    .link a, #resources a{
        text-decoration:none;
        color:#fff;
    }
    #rules-regs a:hover, #resources a:hover{
        background-color:#952600;
    }
    #rules-regs h1, #resources h1{
        text-align:center;
        border-bottom:outset;
        margin:2%;
    }
/*Webinars*/
#upcoming{
    padding:0 0 2% 5%;
    border-style:outset;
    margin:2%;
}
#upcoming h1{
    text-decoration:underline;
    color:#006836;
}
#upcoming button{
	border:2px outset;
	padding:1.5%;
	background-color:#25955f;	
}
#upcoming a{
    text-decoration:none;
    color:#fff;
    text-transform:uppercase;
}
#webcast{
    padding:4% 4% 4% 4%
}  
#archives h1, #archives p{
    margin:0%;
}
#archives{
    border-bottom:outset;
}
#webinar1{
    padding-bottom:2%;
    border-bottom:outset;
}
#webcast h2{
    padding:0;
    margin:2% 0% 0% 0%;
    color:#006836;
}
#webinar1 p, #webinar2 p{
    padding:0;
    margin:.5%;
}
/*Form*/
    fieldset{
        margin:4% 100% 2% 2%;
        border:4px solid #006836;
    }
    legend{
        margin:5% 0 5% 5%;
        font-size:200%;
        border:outset;
        color:#006836;
        padding:1%;
    }
    #name, #email, #subject, #message{
        margin-bottom:2%;
    }
    #action{
        margin-top:2%;
        background-color:#006836;
        color:#fff; 
        text-transform:uppercase;
    }
/*footer*/
    #contact{
        color:#fff;
        overflow:auto;
        width:100%;
        background-color:#006836;   
    }
    #contact h1{
        font-size:100%;
        text-align:center;
    }
    #contact #phone h2{
        font-size:120%;
    }
    #contact #email-contact h2{
        font-size:120%;
    }
    #contact #website h2{
        font-size:120%;
    }
    #contact #address h2{
        font-size:120%;
    }
    #contact a{
        text-decoration:none;
        color:#fff;
    }
    #contact a:hover{
        background-color:#952600;
    }
    #phone, #email-contact, #website, #address{
        font-size:65%;
        width:25%;
        float:left;
        text-align:center;
        padding-bottom:2%;
    }
/*Site Plan*/
    #cover-page{
        text-align:center;
        border-bottom:outset;
        margin:0% 2%;
    }
    #cover-page h1{
        color:#006836;
    }
    #contents-table, #purpose, #personas, #scenarios, #asset-list, #map, #categories, #pallette, #colors, #typography, #navigation, #branding, #wireframes{
        border-bottom:outset;
    }
    #plan{
        padding:5%;
        line-height:1.4em;
    }
    #plan h1, #plan h2{
        color:#006836;
        text-decoration:underline;
    }
    #plan h3{
        color:#952600;
    }
    #map img{
        border:8px solid #952600;
    }
     #type{
        width:75%;
        margin:0 0 4% 0;
    }
    #type th, #type td{
        padding:2%;
    }
    #type th{
        font-size:200%;
        border:outset;
    }
    #type td{
        border-bottom:outset;
    }
     #colors{
        width:75%;
        border:outset;
    }
    #colors td{
        border:outset;
    }
     #navigation table{
        margin-bottom:2%;
        width:100%;
        background-color:#006836
        
    }
    #navigation table td{
        padding:2%;
        text-align:center;
    }
     /*teaching presentation*/
 #teaching{
        overflow:auto;
        width:100%
    }
    #main-slide, #slide{
        float:left; 
    }
    #main-slide{
        width:35.5%;
        background-color:#006836;
        margin:2% 0% 2% 0%;
        color:#fff;
    }
    #main-slide ul{
        padding:2% 0% 4% 8%;
        margin:0%;
    }
    #main-slide li{
        list-style:none;
        padding-bottom:3%;
    }
    #main-slide li a{
        color:rgb(255,255,255);
        text-decoration:none;
    }
    #main-slide li a:hover{
        background-color:#952600;
        text-decoration:underline;
    }
     #main-slide h1{
        padding:2% 0% 0% 4%;
        margin:0%;
        font-size:199%;          
    }
    #main-slide h2{
        padding:0% 0% 0% 4%;
        margin:3%;
        border-bottom:outset;
    }
    #slide{
        width:55%;
        margin:0 0 0 4.5%;       
    }
      #slide h2{
        margin:5% 0% 2% 0%;
    }
 /*footer navigation*/
     #footer-nav{
        background-color:#952600;
        text-align:right;
    }
    #footer-nav a{
        color:#fff;
        font-size:75%;
        padding-left:2%;
    }
    #footer-nav a:hover{
        background-color:#006836;
    } 
/*For smaller screens*/ 
@media only screen and (min-width:769px) and (max-width: 1024px){
        body{background-color:#fff;
             width:100%}
        #main-navigation li{display:block;
                            padding:1%;}
}
@media only screen and (min-width:661px) and (max-width: 768px){
        body{background-color:#fff;
             width:100%;}
        #main-navigation li{display:block;
                            padding:1%;}
    /*Terminology*/
        #main li{list-style:disc;
        margin-left:2%;}
    /*Rules and Regs*/ 
        #rules-regs{background-color:#fff;}
        #rules-regs h1{color:#006836;}
        #rules-regs ul{color:#006836;
                        padding:0%;}
        #rules-regs li a{color:#000;}
    /*teaching presentation*/
        #main-slide, #slide{float:none;
                            width:100%;}
        #slide{margin:0;
        }
}
@media only screen and (max-width:600px){
        body{background-color:#fff;
             width:100%;}
        #main-navigation li{display:block;
                            padding:1%;}
    /*Home Page*/
        #block1, #block2, #block3{float:none;
                                  width:100%;}
        #block1{margin:0;}
        #block2{border:none;
                border-bottom:outset;}
    /*footer*/ 
        #phone, #email-contact, #website, #address{float:none;
                                                   width:100%;}
    /*Terminology*/
        #main, #secondary{float:none;
                          width:100%;}
        #secondary h1, #secondary p{margin:0% 0% 2% 0%;}
        #main li{list-style:disc;}
    /*Rules and Regs*/        
        #rules-regs{background-color:#fff;}
        #rules-regs h1{color:#006836;}
        #rules-regs ul{color:#006836;
                        padding:0%;}
        #rules-regs li a{color:#000;}
        #resources li{list-style:disc;}

/*teaching presentation*/
        #main-slide, #slide{float:none;
                            width:100%;}
        #slide{margin:0;
        }
}