DIV#bannerphoto {
	width:980px; 
	height:200px; 
/*	background-image:url(../TI-graphics/BannerPhoto-1.jpg);  */
	background-position:center;
/*	background-repeat:no-repeat;         */
/*	filter:blendTrans(duration=.5);      */
}


DIV#wholepage {
	position:relative;
	margin-left:auto;
	width: 1280px;
	margin-right:auto;
	text-align:left;
	font-size: 100%;
	top:0px;  
	visibility: visible;	
}

DIV#logo {
	background-color:#FFF;
	text-align:center;	
}


	/* column container   https://matthewjamestaylor.com/blog/ultimate-2-column-left-menu-pixels.htm   */
	.colmask {
		position:relative;		/* This fixes the IE7 overflow hidden bug and stops the layout jumping out of place */
	    clear:both;
	    float:left;
        width:100%;			/* width of whole page */
		overflow:hidden;	/* This chops off any overhanging divs */
	}
	
	.leftmenu {
	    background:#2D3194;
	}
	
	/* 2 column left menu settings */
    .leftmenu .colright {
        float:left;
        width:200%;
		position:relative;
		left:300px;
        background:#fff;
    }
    .leftmenu .rightcolumnwrap {
	    float:right;
	    width:50%;
	    position:relative;
	    right:300px;
	    padding-bottom:1em;
	}
	.leftmenu .rightcolumn {
        margin:0px 0px 0px 300px;
	    position:relative;
	    right:100%;
	    overflow:hidden;
	}
    .leftmenu .leftcolumn {
        float:left;
        width:300px;
        position:relative;
        right:300px;
    }
	 .leftcolumn {
		background:#2D3194;	/* added to do with responsive collapse of divs */
    }
	

#ContactUs {font-size:30px;}




DIV#flyouts {
	position:absolute; 
	margin-left:auto;
	width: 1280px;
	margin-right:auto;
	text-align:left; 
	top:0px; 
	z-index:200; 
	visibility: visible;
}
.panel {
	margin: 5px 14px 5px 14px;
	padding: 3px 0px 7px 0px;
	font-size: 85%;
	width:328px;
	overflow:hidden;
}
.panelstyles p {
	margin-top: 6px;
	margin-bottom: 0px;
}
.panelstyles			{color:white; text-decoration:none; }
.panelstyles	A		{color:white; text-decoration:none; }
.panelstyles A:link		{color:white; text-decoration:none}
.panelstyles A:visited	{color:white; text-decoration:none}
.panelstyles A:hover	{color:yellow; text-decoration:none}
.panelstyles A:active	{color:white; text-decoration:underline}

.panelstyles H1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 140%;
	color: #FFFFFF;
	font-weight: bold;
	margin: 12px 0px 0px 0px;
	padding: 0px;
}
.panelstyles H2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 130%;
	color: #FFFFFF;
	font-weight: bold;
	margin: 10px 0px 0px 0px;
	padding: 0px;
}
.panelstyles H3 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 120%;
	color: #FFFFFF;
	font-weight: bold;
	margin: 10px 0px 0px 0px;
	padding: 0px;
}
.panelstyles H4 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 110%;
	color: #FFFFFF;
	font-weight: bold;
	margin: 5px 0px 0px 0px;
	padding: 0px;
}
.panelstyles H5 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 100%;
	color: #FFFFFF;
	font-weight: bold;
	margin: 5px 0px 0px 0px;
	padding: 0px;
}
.paneledit {
	margin: 15px 0px 15px 0px;
	padding: 0px 0px 0px 0px;
}


DIV#content {
	padding: 0px 30px 0px 30px;
	margin: 0px 0px 20px 0px;
	font-size:120%;
	font-family: Calibri, Arial, Helvetica, sans-serif;	
}

.editorcontent {
	font-size:90% !important;
}

.pagetext  {
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
}

DIV#footer {
	width: 1280px;
	margin-bottom: 0px;
	cursor:pointer;
}





.wideeditor {padding: 0px 25px 0px 25px;}
#idContentoEdit1 {border:none;}

.forminput input[type="text"] {height:18px; border:#A9A9A9 1px solid; border-radius: 2px; padding: 0px 0px 0px 2px;}
.forminput input[type="password"] {height:18px; border:#A9A9A9 1px solid; border-radius: 2px; padding: 0px 0px 0px 2px;}
.forminput select {height:20px; border:#A9A9A9 1px solid; border-radius: 2px;}
.forminput textarea {border:#A9A9A9 1px solid; border-radius: 2px;}
#searchcontrolbox {border:#8FC9C8 solid 1px; border-radius:8px;	padding:3px 3px 3px 3px;}
.searchbox {width:276px;}
.searchselect {width:280px;}
.searchsubmit {width:110px; margin-right:104px;}
#formbox {background-color:#F0FBFB; padding: 10px 0px 10px 0px;}
#editformpanel {font-size:84%; background-color:#F0FBFB; border:#8FC9C8 1px solid; border-radius: 2px; padding: 3px 3px 3px 3px; margin: 0px 0px 0px 0px; width:550px;}
.fullbox {width:400px;}
.halfbox {width:198px;}
.fullselect {width:404px;}
.halfselect {width:202px;}
.fulltextarea {width:398px; font-family:Arial, Helvetica, sans-serif;}
.fullwidthtextarea {width:508px;}
.fullwidthtextarea textarea {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
.wideeditortextarea {width:558px;}
.wideeditortextarea textarea {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
.combobox {width:198px;}
.comboselect {width:199px;}
.browsebox {width:330px;}
.browsebutton {width:67px;}
.tagsbox ul {width:396px !important; border: #A9A9A9 1px solid !important;}
.formsubmit {font-size:120%; font-weight:bold; padding: 1px 4px 1px 4px;}








.elh {
float:left; text-align:right; width:100px; line-height:22px; overflow:hidden;
}
.erh {
float:right; width:470px; text-align:left;
}
.elr {
padding: 3px 0px 0px 0px; clear:both; width: 600px;
}


.lh {
float:left; text-align:right; width:120px; line-height:22px; overflow:hidden;
}
.rh {
float:right; width:415px; text-align:left;
}
.lr {
padding: 8px 0px 0px 0px; clear:both;
}



@media (max-width: 1280px) {
#wholepage {width: 100% !important;}
#bannerphoto {width: 100% !important;}
}


@media (max-width: 900px) {
.imageright {float: none !important; margin-left: 0px !important;  margin-bottom: 10px !important; margin-top: 5px !important; margin-right: 100% !important;}
.imageleft {float: none !important; margin-bottom: 10px !important; margin-top: 5px !important; margin-right: 100% !important;}
.TIright  {float:none !important; margin-left: 0px !important;}
#ProjectBox {margin: 0px 0px 0px 0px !important; padding:0px 0px 0px 0px !important; border:none !important;}

}



@media (min-width: 660px) {
#menuopenclose  {display:none !important;}	
#menuallexpanding {display:block  !important;}
#tandcs {display: block !important;}
}


@media (max-width: 660px) {
#content {padding: 0px 20px 0px 20px !important; margin: 0px 0px 20px 0px; font-size:110% !important;}

#bannerphoto {display: none;}
#contactdetails {display: none;}
#contact {float:right !important; margin: 0px 20px 0px 0px !important; padding: 13px 0px 13px 20px !important;}
#ContactUs {font-size:24px;}
#logo {width: 100%;}

.colmask {width: 100% !important; right: 0px !important; left: 0px !important;}
.leftmenu {width: 100% !important; right: 0px !important; left: 0px !important;; margin:0px 0px 0px 0px !important; paddng:0px 0px 0px 0px !important;}
.colright {width: 100% !important; right: 0px !important; left: 0px !important;}
.leftcolumn {width: 100% !important; right: 0px !important; left: 0px !important;}
.rightcolumnwrap {clear: both !important; width: 100% !important; right: 0px !important; left: 0px !important; paddng:0px 0px 0px 0px !important;}
.rightcolumn {width: 100% !important; right: 0px !important; left: 0px !important; margin:0px 0px 0px 0px !important;}

#menuopenclose  {display:block !important;}	
#menuallexpanding {display: none;}
#menucomplete {float: left;}
#tandcs {display: none;}
.menucell  {margin: 10px 0px 10px 34px;}

#twitterfeed {display: none;}
}

@media (max-width: 600px) {
#content {padding: 0px 10px 0px 10px !important; font-size: 100% !important;}
#navigation {margin: 10px 5px 0px 20px !important; clear:both;}

#contactform {width: auto !important;}
.formname {width: 100% !important; text-align: center !important;}
.formfield {width: 100% !important; text-align: center !important;}
}

@media (max-width: 400px) {
}