* { box-sizing: border-box; }

#BANNER {
	position: fixed; 
	top: 0px; // left: 0px;
	width: 100%; max-width: 1010px; height: 135px;
	background-image: linear-gradient(to top, rgba(255,255,255,0.8), rgba(255,255,255,1));
	z-index: 3000;
	
	transition: top 1s, height 1s;
}

.full #BANNER	{  top: 0px; height: 135px; }
.small #BANNER	{  top: 0px; height: 95px; }

#BANNER > IMG {
	position: absolute;
}

#BLOGO {
	position: absolute; top: 10px; left: 20px;
}

#BLOGO {
	font-family: 'Saira Extra Condensed',serif;
	font-size: 38px;
	line-height: 140%;
	font-weight: medium;
	color: black;
}

#BLOGO A {
	color:black;
	text-decoration:none;
}

#BLOGO > IMG {
	padding: 0px 1px;
//	position: absolute;
}

#BSQUARES {
	position: absolute;
	opacity: 1;

	transition: top 1s, left 1s, opacity 1s;
}

.full #BSQUARES {
	top: 60px; left: 10px;
	width: 750px; height: 74px;g
	opacity: 1;
}

.small #BSQUARES {
//	top: 12px; left: 350px;
	top: 22px; left: 320px;
	width: 800px; height: 74px;
	opacity: 0.5;
}


#BSQUARES IMG {
	display: block; float: left;
	width: 68px; height: 68px;
	margin-right: 5px;
	border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;

	transition: width 1s, height 1s, margin-right 1s;
}

.full #BSQUARES IMG {
	display: block; float: left;
	width: 70px; height: 70px;
	margin-right: 5px;
	border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;
}

.small #BSQUARES IMG {
//	width: 37.5px; height: 37px;
	width: 27.5px; height: 27px;
	margin-right: 2.5px;
	border-radius: 2.5px; -moz-border-radius: 2.5px; -webkit-border-radius: 2.5px;
}

#BANNER .fb-like {
	top: 60px; left: 959px;

	transition: top 1s, left 1s, right 1s;
}
.full #BANNER .fb-like { top: 58px; left: 883px; }
.small #BANNER .fb-like { top: 21px; left: 883px; }


@media only screen and (max-width: 740px) {
	.full #BANNER	{  height: 55px; }
	.small #BANNER	{  height: 55px; }

	body { padding-bottom: 40px; }

	#BANNER .fb-like { position: fixed; left: auto; }
	.full #BANNER .fb-like { top: 10px; right: 10px; left: auto; }
	.small #BANNER .fb-like { top: -50px; right: 5px; left: auto; }
	.small #BANNER .fb-like { top: 10px; right: 10px; left: auto; }

	#BLOGO {
		top: 10px; left: 10px;
	}

    #BSQUARES {
		display: none;
	}
}

@media only screen and (min-width: 741px) and (max-width: 1023px) {
	.full #BANNER	{  height: 100px; }
	.small #BANNER	{  height: 90px; }

	#BANNER .fb-like { position: fixed; left: auto; }
	.full #BANNER .fb-like { top: 23px; right: 0px; left: auto; }
	.small #BANNER .fb-like { top: 23px; right: 0px; left: auto; }

	#BLOGO {
		top: 10px; left: 20px;
	}

	.full #BSQUARES {
		top: 60px; left: 50px;
		opacity: 1;
	}

	.small #BSQUARES {
		top: 20px; left: 350px;
		opacity: 0;
	}

	.full #BSQUARES IMG {
		width: 40px; height: 40px;
		margin-right: 4px;
		border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px;
	}

	.small #BSQUARES IMG {
		width: 30px; height: 30px;
		margin-right: 2px;
		border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px;
	}


}


#SEARCH {
	position: absolute; top: 92px; right: 2px;
	padding: 0px;
	text-align: right;
	width: 254px; height: 38px;
	z-index: 4021;
	text-transform: uppercase;

	transition: top 1s, right 1s;
}

.full #SEARCH	{ top: 92px; }
// .small #SEARCH	{ top: 14px; }
.small #SEARCH	{ top: 53px; }

#SEARCH input {
	font: 14px Roboto,arial,sans-serif;
	color: #811788;
	border: 2px solid #811788;
}

#SEARCH input[type="text"] {
	padding: 9px 10px 9px 20px;
	border-radius: 0px 0px 0px 8px;
	border-right: none;
	margin-right: 0px;
	width: 90px;

	transition: width 0.5s;
}

#SEARCH input[type="text"]:focus {
	width:190px;
}

#SEARCH input[type="submit"] {
	font-weight: bold;
	color: white; background: #811788;
	padding: 9px 10px;
	border-radius: 0px 8px 0px 0px;
	margin-left: 0px;
}

#SEARCH input[type="submit"]:hover {
	color: #811788; background: white;
	border-radius: 0px 8px 0px 0px;
	margin-left: 0px;
}

@media only screen and (max-width: 740px) {
	#SEARCH {
		position: fixed; right: 0px; left: auto;
		width: auto;
	}

	#SEARCH input {
		font: 18px Roboto,arial,sans-serif;
	}

	#SEARCH input[type="text"] {
		padding: 6px 10px 7px;
		width: 80px;

		transition: width 1s;
	}

	#SEARCH input[type="text"]:focus { width: 210px; }
	#SEARCH input[type="submit"] {
		padding: 6px 10px 7px;
	}

	.full #SEARCH	{ top: 55px; }
	.small #SEARCH	{ top: 55px; }
}

@media only screen and (min-width: 741px) and (max-width: 1023px) {
	#SEARCH {
		position: fixed; right: 20px; left: auto;
	}

	#SEARCH input[type="text"] {
		width: 90px;
	}

//	.full #SEARCH	{ right: 20px; top: 16px; }
	.full #SEARCH	{ right: 0px; top: 62px; }
//	.small #SEARCH	{ right: 200px; top: 16px; }
	.small #SEARCH	{ right: 0px; top: 54px; }
}



#MAINBODY {
	position: relative;
	width: 1008px; min-height: 500px;
	margin: 178px 0px 0px;
	padding: 0px 0px 14px 0px;
//	background: rgba(201, 100, 0, 0.3);
}

@media only screen and (max-width: 740px) {
	#MAINBODY {
		margin-top: 126px;
		padding-bottom: 20px;
		width: 100%;
//		background: rgba(100, 200, 0, 0.3);
	}
}

@media only screen and (min-width: 741px) and (max-width: 1023px) {
	#MAINBODY {
		margin-top: 150px;
		width: 100%;
//		background: rgba(150, 200, 0, 0.3);
	}
}

.tablet #MAINBODY {
	padding-bottom: 70px;
}

#SIDE_BAR_RIGHT {
	display: inline-block;
	width: 230px;
	height: 400px;
	float: right;
	clear: both;
}


@media only screen and (max-width: 1023px) {
	#SIDE_BAR_RIGHT { display: none; }
}

#greyout {
	height: 80px;
}




@media only screen and (max-width: 740px) {
}

@media only screen and (min-width: 741px) and (max-width: 1023px) {
}