.container{
    display:grid;
    grid-gap: 5em;
    grid-template-columns: auto auto auto;
    grid-template-areas: 'banner main sidebar';
}

.banner {
    grid-area: banner;
    margin-top: 2em;
	margin-left: 5em;
}

.main {
    grid-area: main;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-areas:
        'heading'
        'colossal' 
        'colossallist'
        'inform'
        'informlist'		
        'infocom'
        'infocomlist'
        'notes'
        'shares';
}

.heading{
    grid-area: heading;
}

.colossal{
    grid-area: colossal;
}

.colossallist{
    grid-area: colossallist;
}

.colossallist li{
	list-style-type: none;
	list-style-position: default;
	padding: .4em;
	line-height: 75%;
	font-weight: bold;
	font-size: 95%; color: #606060; 
}

.inform{
    grid-area: inform;
}

.informlist{
    grid-area: informlist;
}

.informlist li{
	list-style-type: none;
	list-style-position: default;
	padding: .4em;
	line-height: 75%;
	font-weight: bold;
	font-size: 95%; color: #606060; 
}

.infocom{
    grid-area: infocom;
}

.infocomlist{
    grid-area: infocomlist;
}

.notes{ 
    grid-area: notes;
	/*margin-left: 13em;
	width: 47em;*/
	font-size: 79%; color: #606060; 
}

.shares{ 
    grid-area: shares;
	margin-top: 1em;
	/*margin-left: 20em;*/
	text-align: center;
}

.sidebar{
    grid-area: sidebar;
	text-align: center; 
	margin-top: 5em;
	font-family: 'Arial';
	font-weight: bold;
}
.sidebar li{
	text-align: left;
	list-style-type: none;
	padding: .4em;
	line-height: 75%;
	font-weight: bold;
	font-size: 95%; color: #606060; 
}


/*________________________________________________________________________________________ 
    paragraphs, headers etc 
*/
p{
	font-size: 1em;
	line-height: 1.4;
}

.title{ 
	padding-top: 2.4em;
	margin-left: 18em;
	line-height: 1;
	text-align: left;
	font-family: 'Arial', serif;
}

h1 { font-size: 2em;  }
h2 { font-size: 1em; line-height: .25;}


/*________________________________________________________________________________________ 
    links
*/
a{
	text-decoration: none;
	color: #000000;
	font-size: 85%;
	font-family: 'Arial';
}
a2{
	text-decoration: none;
	color: #369;
}

a:visited{
	text-decoration: none;
	color: #000000;
}

a:hover{
	text-decoration: none;
	color: #000000;
	text-decoration: underline;
}


.statcounter{
	height: 28px;
	width: 100px;
	position: absolute;
	top: 64px;
	right: 0em;
}

.tweet_container {
	height: 28px;
	width: 100px;
	position: absolute;
	top: 34px;
	right: 0em;
} 
.like_container {
	height: 28px;
	width: 100px;
	position: absolute;
	top: 64px;
	right: 0em;
} 
.gplus1_container {
	height: 28px;
	width: 100px;
	position: absolute;
	top: 94px;
	right: 0px;
} 

/*
     Mobile.
*/
@media screen and (max-width: 1100px){
    .container{
        display:grid;
        grid-gap: 0em;
        grid-template-columns: 1fr;
        grid-template-areas: 
        'banner' 
        'main'
        'sidebar';
}