@import url('http://fonts.googleapis.com/css?family=Open+Sans:300,400,700');
@import url('http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,400,700');
@import url('http://fonts.googleapis.com/css?family=Oswald:300,400,700');
@import url('http://fonts.googleapis.com/css?family=PT+Sans+Narrow:300,400,700');
@import url('http://fonts.googleapis.com/css?family=Noto+Serif:300,400,700');
@import url('http://fonts.googleapis.com/css?family=Coustard:900');
@import url('http://fonts.googleapis.com/css?family=Abel:400,700,900');
@import url('http://fonts.googleapis.com/css?family=Titillium+Web:900');
@charset "utf-8";

body { background-image: url('../images/Background-3-Color.png'); background-position: top; background-repeat: repeat-x; background-color: #eeeeee; }
	
/* TABLE OF CONTENTS
    --------------------------------------
    
        1. FONTS
        2. LINKS
        3. HEADER
        4. CONTENT
        5. GAMELIST
        6. GAME OF THE MONTH
    
    */	
	
/* 1. FONTS
    ------------------------------------  */

    .title-copy { font: 300 36px/120% 'Open Sans', sans-serif; color: #ff6a00; text-align: center; }

    .condensed-blue-subtitle { font: 700 16px/120% 'Oswald', sans-serif; text-align:  center; color: #609eca; width: 100%; margin: 0 0 5px 0; }

    .fine-copy { font: 400 12px/120% 'Open Sans', sans-serif; color: #666; text-align: center; }
    .fine-print { font: 400 12px/120% 'Arial', sans-serif; color: #666; }

    .reading-copy { font: 400 14px/150% 'Open Sans', sans-serif; color: #666; text-align: justify; }

    .subtitle-copy { font: italic 700 14px/120% 'Open Sans', sans-serif; color: #666; text-align: center; }

    .bold-copy { font: 700 14px/120% 'Open Sans', sans-serif; }

    .condensed-title { font: 700 22px/120% 'Oswald', sans-serif;  }
    .condensed-title-small { font: 700 18px/120% 'Oswald', sans-serif; color: #6699CC; }

    .bighead { font: 400 24px/120% 'Times New Roman', serif; color: #6699CC; }
	
    .bodycopy { font: 400 12px/120% 'Verdana', sans-serif; }
	
    .arial-14pt { font: 400 14px/120% 'Arial', sans-serif; color: #000; }
    .arial-14-gray { font: 400 14px/120% 'Arial', sans-serif; color: #666; }
    .arial-14-white { font: 400 14px/120% 'Arial', sans-serif; color: #FFF; }
    .arial-14-dark-grey { font: 400 14px/120% 'Arial', sans-serif; color: #333; }
    .arial-14-dark-grey-extra-line-height { font: 400 14px/150% 'Arial', sans-serif; color: #333; }

    .arial-16pt { font: 400 16px/120% 'Arial', sans-serif; color: #000; }
    .arial-16-green { font: 400 16px/120% 'Arial', sans-serif; color: #3C0; }

    .open-sans-16 { font: 400 16px/120% 'Open Sans', sans-serif; text-align: center; color: #666; width: 500px; margin: 0 auto; }
	
    .article-div { font: 400 16px/150% 'PT Sans Narrow', sans-serif; text-align: justify; color: #666; width: 650px; padding: 20px 0 70px 0; margin: 0 auto; clear: both; }

    .photo-caption { margin: -3px auto 10px auto; font: 400 14px/120% 'PT Sans Narrow', sans-serif; text-align: center; color: #666; }



/* 2. LINKS
    ------------------------------------  */

    a.link1:link { font: 400 14px/120% 'Arial', sans-serif; color: #06F; text-decoration: none; }
    a.link1:visited { font: 400 14px/120% 'Arial', sans-serif; color: #006; text-decoration: none; }
    a.link1:hover { font: 400 14px/120% 'Arial', sans-serif; color: #039; text-decoration: none; }
    a.link1:active { font: 400 14px/120% 'Arial', sans-serif; color: #06F; text-decoration: none; }
	
    a.link2:link { font: 400 16px/150% 'Arial', sans-serif; color: #06F; text-decoration: none; }
    a.link2:visited { font: 400 16px/150% 'Arial', sans-serif; color: #006; text-decoration: none; }
    a.link2:hover { font: 400 16px/150% 'Arial', sans-serif; color: #039; text-decoration: none; }
    a.link2:active { font: 400 16px/150% 'Arial', sans-serif; color: #696; text-decoration: none; }
	
    /*List Highlight Links*/
	
    #links ul { list-style-type: none; width: 150px; } 
    #links li { border: 1px dotted #91B9F7; border-width: 1px 0; margin: 5px 0; }
    #links li a { color: #0066FF; display: block; padding: 12px 5px; text-decoration: none; }
    * html #links li a { width: 150px; } /* make hover effect work in IE */ 
    #links li a:hover { background: #D9EBFF; }
    #links a em { color: #91B9F7; display: block; line-height: 125%; }
    #links a span { font: 400 14px/150% 'Verdana', sans-serif; ;color: #125F15; }

    /*Lodgings Highlight Links*/
	
    #links-lo ul { list-style-type: none; } 
    #links-lo li { border: 1px dotted #91B9F7; border-width: 1px 0; margin: 5px 0; }
    #links-lo li a { color: #0066FF; display: block; padding: 5px 5px 5px 0px; text-decoration: none; }
    * html #links-lo li a { } /* make hover effect work in IE */
    #links-lo li a:hover { background: #D9EBFF; }
    #links-lo a em { color: #91B9F7; display: block; line-height: 125%; }
    #links-lo a span { font: 400 14px/150% 'Verdana', sans-serif; ;color: #125F15; }



/* 3. HEADER
    ------------------------------------  */

    .header { width: 930px; height: 90px; padding: 7px 0 0 0; margin: 0 auto; }
    .header-left { text-align: left; width: 325px; float: left; }
    .header-middle { text-align: center; width: 345px; padding: 6px 0 0 160px; margin-top: 3px; float: left; }
    .header-right { text-align: right; width: 100px; margin-top: 10px; float: right; }
	
	

/* 4. CONTENT
    ------------------------------------  */

    .slider { width: 930px; margin: 20px auto 0 auto; clear: both; }

    .content { width: 930px; background-color: #FFFFFF; margin: 0 auto; border: #99CCFF 1px dotted;	border-radius: 10px; -webkit-border-radius: 10px; overflow: auto;	clear: both; }
	
    .primary { width: 726px;	min-height: 1000px; padding: 30px 10px 80px 10px;	margin: 0 auto; border-right: 1px dotted #9CF; float: left; }
	
    .sidebar { text-align: center; width: 160px;	padding: 35px 10px 0 10px; float: left; }
	
    .box-3 { text-align: left; width: 30%; padding: 0 0 0 20px; float: left; }
    .box-4 { text-align: center; width: 49%; float: left; 	}
	.box-5 { text-align :left; width: 380px; margin: 10px 0 0 20px; float: left; }

    .donation-box { border: 1px solid #999999; -webkit-border-radius:10px; border-radius: 10px; padding: 10px; margin: 0 0 10px 0;	}
	.donation-head { font: 400 16px/120% 'Arial', sans-serif; color: #3366FF; text-align: center;  width: 211px; height: 25px; border-bottom: 1px dotted #6699FF; padding: 0 0 5px 0; margin: 0 0 5px 0; float: right; }
	
    .picture-bar { width: 512px; height: 75px; border: 1px solid #CCCCCC; -webkit-border-radius: 10px; border-radius: 10px; background-color: #efefef; padding: 20px 20px 24px 20px; margin: 30px auto 0px auto; }
	
    .logding-box-1 { border: 1px dotted #91B9F7; border-width: 1px 0px 1px 0px; background-color: #D7EAFF; padding: 10px; margin: 0px auto 5px auto; }
    .logding-box-2 { width: 400px; border: 1px dotted #91B9F7; border-width: 1px 0px 0px 0px; background-color: #D2EFFF; padding: 20px; }
	
    .spacer { clear:both; }
	
    .footer { text-align: center;	width: 930px; margin: 20px auto 100px auto; }
	


/* 5. GAMELIST
    ------------------------------------  */

    #gamelist-header { width: 550px; margin: 20px auto; border-bottom: 1px solid #666; display: flex; justify-content: flex-start; }
    #gamelist-header .image { width: 233px; height: auto; margin: 0 0 0 58px; }
    #gamelist-header .right-content { width: 242px; text-align: left; }
    #gamelist-header .light-text { font: 300 32px/120% 'Open Sans', sans-serif; margin: 10px 0 0 7px; color: #ff8b39; }
    #gamelist-header .heavy-text { font: 900 55px/100% 'Titillium Web', sans-serif; color: #ff8b39; padding: 0; margin:-10px 0 -5px 5px; }

    #container { width: 600px; margin: 0 0 0 100px; }

    #column { font: 400 16px/100% 'PT Sans Narrow', sans-serif; width: 160px; padding: 20px; float: left; }



/* 6. GAME OF THE MONTH
    ------------------------------------  */

    .gameline { font: 400 16px/100% 'Oswald', sans-serif; display: flex; justify-content: flex-start; }
    .gameline .date { color: #6699CC; text-align: right; width: 120px; padding-right: 10px; border-right: 1px solid #CC6600; margin: 10px 10px 0 0; }

    .gameline .title { text-align: left; width: 409px; margin: 10px 0 0 0; }
    .gameline .title a { text-decoration: none; color: #36638f; }
    .gameline .title a:hover { color: #91B9F7; }
    .gameline .title a:visited { color: #669966; }
    .gameline .title a:visited:hover { color: #91B9F7; }

    #article { font: 400 16px/150% 'PT Sans Narrow', sans-serif; text-align: justify; color: #666; width: 90%; padding: 0 0 70px 0; margin: 0 auto; clear: both; }
    #article img { margin: 0 0 5px 0; width: 100%; height: auto; }
    #article .title { width: 90%; margin: 0 auto; font: 400 32px/120% 'Open Sans Condensed', sans-serif; text-align: center; color: #06F; }
    #article .subtitle { width: 90%; margin:0 auto 30px auto; font: 400 18px/150% 'PT Sans Narrow', sans-serif; text-align:center; color:#666; }

    #sidebar { font: 400 14px/140% 'PT Sans Narrow', sans-serif; text-align: left; color: #666; width: 186px; border: 2px solid #CCC; border-radius: 10px; background-color: #EFEFEF; 
        padding: 17px; margin: -40px 0 20px 20px; float: right; }
    #sidebar img { margin: 0 auto 10px auto; width: 100%; height: auto; }
    #sidebar .subtitle { font: 700 16px/100% 'Oswald', sans-serif; text-align: center; color: #6699CC; margin: 20px auto 10px auto; }

    .quote-box-left { font: italic 400 18px/150% 'Noto Serif', serif; text-align: left; color:#333; width: 270px; border-right: 2px solid #ff6a00; padding: 10px 30px 10px 30px; margin: 0px 30px 20px 0; 
        background:  url('../game-of-the-month/images/Quotes.png') no-repeat left top; float: left; }
    .quote-box-right { font: italic 400 18px/150% 'Noto Serif', serif; text-align: left; color:#333; width: 270px; border-left: 2px solid #ff6a00; padding: 10px 20px 10px 50px; margin: 0px 0 20px 30px;  
        background:  url('../game-of-the-month/images/Quotes.png') no-repeat 7% 0%; float: right; }

    #trivia-box { font: 400 14px/150% 'Open Sans', sans-serif; width: 90%; text-align: justify; color: #FFF; border-radius:10px; padding: 30px; margin: 20px auto; background-color: #669966; }
    #trivia-box .fun-fact-number { font: 700 36px/100% 'Open Sans', sans-serif; color: #FFF; margin: 0 10px 0 0; float: left; }
    #trivia-box .title { font: 700 36px/100% 'Coustard', serif; text-align: center; width: 100%; margin: 0 0 30px 0; }


/* 7. CHAMPLAIN COLLAGE
    ------------------------------------  */

#champlain { }
#champlain ul li { margin: 7px 0 }
	

