/* 
    Created on : Dec 19, 2016, 12:13:55 PM
    Author     : rory
colours:
#7B6D6A
#AD8264
#BEA295
#BEAA75
#A68164
#C99B68
#ECE2C7 
#D4C8B0*/
/*=========================
=====> Common Screen <===== 
=========================*/

	.QuickContact
	{
		display:				block;
		z-index:				100;
		background-color:		#D4C8B0;
		width:					100%;
		position:				fixed;
		border-bottom:			1px #bbbbbb solid;
	}
	
	.QuickContact p,
	.QuickContact p img
	{
		color:					#555555;
		vertical-align:			middle;
		margin:					0px;
		text-align:				center;
	}
	
	.Info
	{
		padding:				0em 0.5em;
		overflow:				auto;
	}

	.Header
	{
		background-color:		#AD8264;
		color:					#FFFFFF;
	}

	.Header h3
	{
		text-align:				left;
		margin-top:				0;
		padding-left: 			50px;
		padding-top:			13px;
	}

	.Footer
	{
		visibility:			hidden;
		background-color:	#333333;
		color:				#333333;
		height:				50px;
	}
	
	.Social
	{
		background-color:	#FFFFFF;
		color:				#FFFFFF;
		height:				50px;
	}
	
	.comments
	{
		width:				90%;
		margin:				0 auto;
		font-size:			smaller;
		overflow:			hidden;
	}
	
	.commentsL, .commentsR
	{
		width:				45%;
		display:			inline-block;
		vertical-align:		top;
		padding:			0.5em;
	}

	.comments p
	{
		margin:				0 0 0.5em 0;
	}
	
	.comments .italic
	{
		font-style:			italic;
	}
	
	a.homePage
	{
		text-decoration:	none;
		color:				#008200;
	}
	
	a.homePage:hover
	{
		color:				#ECE2C7;
		background-color:	#999999;
	}

	.bragBoard, 
	.Social {
		display: 			flex;
		flex-direction: 	row;
		align-items: 		center;
		justify-content: 	space-around;
		padding: 			2vh;
		height: 			20vh;
	}

	.bbImage {
		padding: 1vw;
	}

	img.bb {
		max-height: 		190px;
		width: 				auto;
		border-radius: 		7px;
	}

	.bragBoard  .bbImage img:hover {
		box-shadow: 0 0 5px 1px #555555;
	}

	.Social {
		justify-content:	center;
	}

	#SO_target {
		justify-content: 	center;
	}

/*=========================
=====> Mobile Screen <=====
=========================*/
@media (max-width: 767px) {
		
	.cbp-spmenu h3
	{
		background-color: 	#AD8264 !important;
		color: 				#555555 !important;
	}

	.bragBoard {
		padding: 			0px;
		height: 			auto;
		flex-direction:		column;
		justify-content: 	space-between;
	}

	.bragBoard div {
		margin: 			0.5em 0;
		width: 				50vw important!;
		height: 			auto;
	}

	.Social {
		height:				auto;
	}

	img.bb {
		max-width: 			40vw !important;
		height: 			auto;
	}

	.QuickContact
	{
		bottom:				0px;
	}

	.QuickContact p,
	.QuickContact p img
	{
		font-size:			small;
	}
	
	img.SquareMenu
	{
		visibility:			visible;
		position:			absolute;
		top:				0.5em;
		left:				0.5em;
		z-index:			10;
		height:				3em;
	}

	span
	{
		white-space:		nowrap;
		padding:			0px 10px;
	}
	
	.comments
	{
		width:				90%;
		overflow:			hidden;
		padding:			5px 5px 0px 5px;
	}
	
	.commentsL, .commentsR
	{
		margin-top:			-1px;
		width:				100%;
		border-bottom:		1px #AAAAAA solid;
		border-top:			1px #AAAAAA solid;
	}

}

/*=======================
=====> Full Screen <=====
=======================*/
@media (min-width: 768px) { 

	.QuickContact
	{
		top:					0px;
	}

	.cbp-spmenu
	{
		margin-top:				50px;
		margin-left:			300px;
		padding-left:			2em;
		height:					55px;
		text-align:				left;
		vertical-align:			middle;
	}

	img.logo
	{
		position:				absolute;
		top:					0.5em;
		left:					0.5em;
		z-index:				101;
	}

	.cbp-spmenu a 
	{
		display:				inline-block;
		height:					25px;
		padding:				15px 15px;
		vertical-align:			central;
		color:					#444444;
		font-size:				1.1em;
		font-weight:			400;
	}

	.cbp-spmenu a:hover, .covid:hover 
	{
		background:				#999999;
	}

	.cbp-spmenu a:active, 
	.cbp-spmenu .active 
	{
		background:				#AD8264;
		color:					#DDDDDD;
	}
	
	.cbp-spmenu h3
	{
		display:			none;
	}

	.flexslider
	{
		overflow:			hidden;
	}

	.Info
	{
		vertical-align:		middle;
	}

	img.SquareMenu
	{
		display:			none;
	}

	.Social
	{
		height:				50px;
		vertical-align:		middle;
	}
}

.covid {
    background-color:		#555555 !important;
    color:                  #ECE2C7 !important;
}
.covid:hover {
    background-color:       #999999 !important;
    color:                  #000000 !important;
}