html {
	height: 100%;
	width: 100%;
}

body {
	position: relative;
}

#title {
	color: red;
	text-align: center;
}

#title h1 {
	margin: 0;
	padding: 15px 0 0 0;
}

#title h2 {
	color: red;
	text-align: justified;
	margin-left: 50px;
	margin-right: 50px;
	font-size: 8px;
	font-style: normal;
	font-family: Times New Roman, Times, serif;
}

#title h3 {
	color: red;
	text-align: center;
	margin-left: 20px;
	margin-right: 20px;
	font-size: 18px;
	font-style: normal;
	font-family: Times New Roman, Times, serif;
}

#title p {
	margin: 0;
	padding: 0;
}

#main {
	background-repeat: repeat-y;
}

#mainlist {
	opacity: .85;
	width: 85%;
	margin: 25px auto 25px auto;
}


@media only screen and (max-device-height: 480px) { /* iPhone retina and older */

    #main {
        background: url('img/retinacolor.jpg');
        background-size: 100%;
    }
    
    
    #blogpage,
    #eventspage,
    #newspage,
    #tvpage,
    #historypage,
	#emailpage,
	#vodpage,
    #websitepage,
    #bookspage,
    #wikipediapage,
    #gamespage,
    #nonfictionpage,
    #fictionpage {
        background: url('img/retinabw.jpg');
        background-size: 100%;
        background-repeat: repeat-y;
        padding-bottom: 50px;
    }
    
    #blogpage ul,
    #eventspage ul,
    #newspage ul,
    #tvpage ul,
	#historypage ul,
	#emailpage ul,
    #vodpage ul,
    #websitepage ul,
    #wikipediapage ul,
    #bookspage ul,
    #gamespage ul,
    #nonfictionpage ul,
    #fictionpage ul {
        opacity: .85;
    }

}


@media only screen and (min-device-height: 481px) and (max-device-height: 1023px) { /* iPhone 5 */
    
    #main {
        background: url('img/iphone5color.jpg');
        background-size: 100%;
    }
    
    #blogpage,
    #eventspage,
    #newspage,
    #tvpage,
    #historypage,
	#emailpage,
	#vodpage,
    #websitepage,
    #bookspage,
    #wikipediapage,
    #gamespage,
    #nonfictionpage,
    #fictionpage {
        background: url('img/iphone5bw.jpg');
        background-size: 100%;
        background-repeat: repeat-y;
        padding-bottom: 50px;
    }
    
    #blogpage ul,
    #eventspage ul,
    #newspage ul,
    #tvpage ul,
	#historypage ul,
	#emailpage ul,
    #vodpage ul,
    #websitepage ul,
    #wikipediapage ul,
    #bookspage ul,
    #gamespage ul,
    #nonfictionpage ul,
    #fictionpage ul {
        opacity: .85;
    }
    
}

@media screen and (min-device-height: 1024px) { /* iPad */
    
    #main {
        background: url('img/ipadcolor.jpg');
        background-size: 100%;
    }
    
    #title h1 {
        font-size: 50px;
    }
    
    
    #blogpage,
    #eventspage,
    #newspage,
    #tvpage,
	#historypage,
	#emailpage,
    #vodpage,
    #websitepage,
    #bookspage,
    #wikipediapage,
    #gamespage
    #nonfictionpage,
    #fictionpage {
        background: url('img/bwpatch640.jpg');
        background-size: 100%;
        background-repeat: repeat-y;
        padding-bottom: 50px;
    }
    
    #blogpage ul,
    #eventspage ul,
    #newspage ul,
    #tvpage ul,
	#historypage ul,
	#emailpage ul,
    #vodpage ul,
    #websitepage ul,
    #wikipediapage ul,
    #bookspage ul,
    #gamespage ul,
    #nonfictionpage ul,
    #fictionpage ul {
        opacity: .85;
    }
    
}