html, body{line-height: 1.25;
	letter-spacing: 0.33px;
	background-color: rgb(255,255,255);	
	margin: 0px;
	padding: 0px;
	border: 0px;
	font-size: 16px;
	color: black;
	font-family: Arial, Helvetica, sans-serif;
	height:100%;
	}

	
ul 	{list-style-type: none;
	}	
.wrapper{min-height:100%;
	position:relative;
	}

p,legend , form{margin-bottom: 1em;
	}

p{word-wrap: break-word;
	overflow-wrap: break-word;
	}
.center{margin:auto;
	}

.cntr{text-align: center;
	}


h1 {color: rgb(2,73,131);
	}

h2 {color: rgb(2,73,131);
	-webkit-font-smoothing: antialiased;
	}

h3{color: rgb(2,73,131);
	}

.main {
	/*padding-top:1em;
	padding-bottom: 1em;
	border-bottom: solid 1px rgb(128,175,207);*/
}

.clickable {cursor:pointer;
	margin-bottom: 5px;
	}

.clickable:hover {background-color:#FFC;
	}

.pointer {
	cursor:pointer;
	}

.msg:hover{
	color:rgb(198,18,47);
	}
.highlighted {position: absolute;
	background-color: transparent;
	opacity: 0.5;
	filter: alpha(opacity=50);
	border:1px solid white;
	}

.clearLeft {clear: left;
	}


.tpg i {font-size: 16px;}

div, span{
	/*border-style:solid;
	border-width:1px;
	border-color:rgb(0,0,0);*/
	}

* {box-sizing: border-box;
	}

.row::after {content: "";
  clear: both;
  display: table;
	}
/* For mobile phones: */
[class*="col-"] {
  width: 100%; 
  float: left;
  /*border:1px solid green;*/
	}
	
.topln{position:fixed;
	top:0px;
	width:100%;
	height:5px;
	z-index:99;
	}

.tpgBgRed{background:rgb(198,18,47);
	}
/* The structure holding the banner and logos*/
.hdrtab{position:relative;
	top:5px;
	left:0;
	width:100%;
	/*min-width:720px;*/
	margin:auto;
	background:rgb(128,175,207);
	z-index:99;
	}
.hdrtab p{margin-bottom: 0px;
	}
/*end hdrtab*/

.hdr {margin-top:0px;
	font-size: 1.0em;
	color:white;
	text-align: center;
	z-index:100;
	margin-left:10%;
	}
 
.logocell{text-align:right;
	position:relative;	
	}

.tpg {margin-left:5px;
	margin-top:5px;
	letter-spacing: -1px;
	color: rgb(2,73,131);
	}

.logo {margin-left:5px;
	margin-top:5px;
	letter-spacing: -1px;
	color: rgb(2,73,131);
	font-size: 1.10em ;
	}

.tpg i {top:10px;
	display: inline-block;
	border-radius: 10px 0 10px 0;
	font-size: 1.25em;
	color: white;
	text-shadow: 1px 1px 1px rgb(0,0,0);
	line-height: 90%;
	text-align: right;
	background-color: rgb(198,18,47);
	padding: .25em .25em .25em .25em;
	-webkit-box-shadow: 1px 1px 2px rgba(0,0,0,.75);
	-moz-box-shadow: 1px 1px 2px rgba(0,0,0,.75);
	box-shadow: 1px 1px 2px rgba(0,0,0,.75);	
	}
	
.logo_tpg{position: absolute;
	top:2px;
	right:10px;
	z-index:99999;
	}

/*Dealing with images */
a img {border:none;
	}
.imgRight {float: right;
	margin-bottom: 5px;
	margin-left: 5px;
	}
	
.imgLeft {float: left;
	margin-bottom: 5px;
	margin-right: 5px;
	width:104px;
	height:100px;
	}
	
.imgStd {float: left;
	margin-bottom: 5px;
	margin-left: 20px;
	width:204px;
	height:200px;
	border: solid 3px rgba(255,255,255,1);
	padding:3px;
	border-radius: 7px;
	-moz-border-radius: 7px;
	}
	
.imgLeftTn {float: left;
	margin-bottom: 5px;
	margin-right: 10px;
	width:104px;
	height:100px;
	border: solid 3px rgba(255,255,255,1);
	padding:3px;
	border-radius: 7px;
	-moz-border-radius: 7px;
	}

.imgLeftLogo {float: left;
	margin: 5px;
	width:50px;
	height:50px;
	border: solid 1px rgb(255,255,255);
	padding:3px;
	border-radius: 3px;
	-moz-border-radius: 3px;
	}	
	
.imgStdTn {float: none;
	margin-bottom: 0.25px;
	width:100px;
	height:100px;
	border-radius: 3px;
	-moz-border-radius: 3px;
	box-shadow: -3px 3px 3px rgb(136,136,136);
	}

.imgStdTn:hover {box-shadow: none;
	}

.imgRightTn {float: right;
	margin-bottom: 5px;
	margin-left: 10px;
	width:104px;
	height:100px;
	border: solid 3px rgba(255,255,255,1);
	padding:3px;
	border-radius: 7px;
	-moz-border-radius: 7px;
	}

.imgLeft{float: left;
	margin-bottom: 5px;
	margin-top: 5px;
	margin-right: 5px;
	width:350px;
	height:205px;
	border: solid 3px rgba(255,255,255,1);
	padding:3px;
	border-radius: 7px;
	-moz-border-radius: 7px;
	}

.imgshad{box-shadow: -5px 5px 3px #222222;
	}

img.profileLeftTn {position: relative;
	float: left;
	margin-top: 5px;	
	margin-bottom: 5px;
	margin-right: 10px;
	width:60px;
	height:60px;
	border-radius: 7px;
	-moz-border-radius: 7px;
	}

.imgBrdr{border: solid 2px rgba(0,0,0,.8);
	padding: 5px ;
	background:rgb(255,255,255);
	border-radius: 5px;
	-moz-border-radius: 5px;
	}

 #groupspan{margin:auto;
	padding-bottom:10px;
	}

#groupspan span{

	}

#groupspan img{display:inline-block; 
}

.imgGen {margin-bottom: 5px;
	width:250px;
	height:354px;
	border: solid 1px rgb(2,73,131);
	padding:3px;
	}
	
.imgLeftMisc {
	float: left;
	margin:5px 15px 5px 5px;
	border-radius: 7px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
}

.imgMisc {
	margin:5px 15px 5px 5px;
	border-radius: 7px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
}

.imgRightMisc {
	float: right;
	margin:5px 5px 5px 15px;
	border-radius: 7px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	
	}

.imgSq{
	width:20%;
	min-width:200px;
	}

/* end images */
.youtube-player {
	position:relative;
	width:90%; 
	height:90%;
	min-width: 225px;
	min-height:153px ;
	margin:auto;
	filter: progid:DXImageTransform.Microsoft.Shadow(color='#888888', Direction=145, Strength=3);
	box-shadow: -5px 5px 5px rgb(136,136,136);
}

.youtube-holder
{	width:auto;
	height:auto;
	max-width:390px; 
	min-width: 250px;
	min-height:150px ;
	margin-left:auto;
	margin-right:auto;
	margin-top:5%;
	border-radius:7px;
	-moz-border-radius:7px;
	-webkit-border-radius:7px;
	padding:10px 10px;
	border-style:outset;
	border-color:rgb(225,255,255);
	}

.background{
	background: -webkit-linear-gradient(rgba(45,18,174,0.2),rgba(225,230,240,0.3),rgba(45,18,174,0.2) ); /* For Safari */
	background: -o-linear-gradient(rgba(45,18,174,0.2),rgba(225,230,240,0.3),rgba(45,18,174,0.2) ); /* For Opera 11.1 to 12.0 */
	background: -moz-linear-gradient(rgba(45,18,174,0.2),rgba(225,230,240,0.3),rgba(45,18,174,0.2) ); /* For Firefox 3.6 to 15 */
	background: linear-gradient(rgba(45,18,174,0.2),rgba(225,230,240,0.3),rgba(45,18,174,0.2) ); /* Standard syntax */	
}


.iframe{height:400px;
	width:760px;
	overflow:auto;
	}

div.scroll{height:400px;
	overflow:auto;
	right: 10px;
	}

div.scrollstd{height:800px;
	overflow:auto;
	right: 10px;
	}

/*============================================
	Styling the pic flips
	NA 31/07/2022 credit Martin Angelov for initial concept
=============================================*/
#picContainerLogo img, #picContainerLogo2 img{
	/* Enabling 3d space for the transforms */
	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;
	
	/* When the forms are flipped, they will be hidden */
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	
	/* Enabling a smooth animated transition */
	-moz-transition:1.5s;
	-webkit-transition:1.5s;
	transition:1.5s;
	}

#front, #front2{
	z-index:100;
	}

#back, #back2{z-index:1;
	opacity:0;
	filter: alpha(opacity=0);
	-moz-opacity: 0;
	/* Rotating the back pic */
	-moz-transform:rotateY(180deg);
	-ms-transform:rotateY(180deg);
	-o-transform:rotateY(180deg);
	-webkit-transform:rotateY(180deg);
	transform:rotateY(180deg);
	}

#picContainerLogo.flipped #front,
#picContainerLogo2.flipped #front2{opacity:0;
	filter: alpha(opacity=0);
	-moz-opacity: 0;
	/**
	 * Rotating the front pic when the
	 * flipped class is added to the container
	 */
	-moz-transform:rotateY(-180deg);
	-ms-transform:rotateY(-180deg);
	-o-transform:rotateY(-180deg);
	-webkit-transform:rotateY(-180deg);
	transform:rotateY(-180deg);
	}

#picContainerLogo.flipped #back, 
#picContainerLogo2.flipped #back2{opacity:1;
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	/* Rotating the back div into view */
	-moz-transform:rotateY(0deg);
	-ms-transform:rotateY(0deg);
	-o-transform:rotateY(0deg);
	-webkit-transform:rotateY(0deg);
	transform:rotateY(0deg);
	}

/* end styling the pic flips */

/*============================================
	Hovering text messages
	NA 31/07/2022 
=============================================*/	
.texttip{display:none;
	}

#groupspan td:hover{position:relative;
	cursor:pointer;
	}

/*#groupspan:hover .texttip{
	  border: #fff 2px solid;
	  background-color:rgb(255,255,255);
	  background-color:rgba(255,255,255,0.6);
        padding: 5px 20px 5px 5px;
        display: block;
        z-index: 100;
        left: 0px;
        width: 300px;
        margin-left:50%;
	  position: absolute;
        top: -35px;
        text-decoration: none;
} */
	
[data-title]:hover:before {opacity: 1;
            transition: all 0.2s ease 0.6s;
            visibility: visible;
		z-index:99999;
        }
[data-title]:before {content: attr(data-title);
            position: fixed;
            padding: 4px 8px 4px 8px;
		background-color:rgb(255,255,255);
		border: #fff 2px solid;
            color: #000;
            border-radius: 5px;  
            box-shadow: 0px 0px 15px #222;  
		top:80px;
            visibility: hidden;
        }

#logoTpg  [data-title]:before {position: fixed; 
	top:15px;
	right:30px;
	visibility: hidden;
	}
/* end hovering text */
/* The pages that hold content*/
.page{display:none;
	opacity:0;
	}

.page.current{	display:block;
	opacity:1;
	margin-bottom:20px
	}

.content {padding-bottom:100px; /* Height of the footer element */
	margin-left:5%;
	margin-right:5%;
	}

.tabtrans{border-width:1px;	
	}

.rowtrans{
	}

.tdtrans{filter: progid:DXImageTransform.Microsoft.Shadow(color='#222222', Direction=145, Strength=3);
	box-shadow: -5px 5px 3px rgb(204, 204, 204);
	-moz-box-shadow: -5px 5px 3px rgb(204, 204, 204);
	-webkit-box-shadow: -5px 5px 3px rgb(204, 204, 204);
	height:90px;
	line-height:1em; 
	font-size:1em;
	background:rgb(243,257,251);
	background:rgba(128,175,207,0.1);
	}

.tdtrans div{padding:10px;
	}

.tpgBgRed{background:rgb(198,18,47);
	}

.tpgBgLiteBlue{background:rgb(243,257,251);
	background:rgba(128,175,207,0.1);
	}

.bgwhite{background:white;
	}

.tdtrans a {width: 100%;
  height:100%;
  /*padding-top:7.5%;*/
  display: inline-block;
	}

.clients {width:60%;
	}

.tdtrans a, .tdtrans p, .tdtrans i {text-decoration: none;
	color:rgb(53,75,118);
	}

.tdtrans:hover{background:rgb(128,175,207);
	filter: progid:DXImageTransform.Microsoft.Shadow(color='#222222', Direction=145, Strength=3);
	box-shadow: -1px 1px 1px #222222;
	-moz-box-shadow: -1px 1px 1px #222222;
	-webkit-box-shadow: -1px 1px 1px #222222;
  }
  
.msg .tdtrans:hover{background:rgb(128,255,207);
	}
  
.tdtrans:hover a{color:white;
	}
	
#mems a:link { text-decoration:none;
	}	

/* End the pages that hold content*/

/* The foot of the page*/
.footer {position: relative;
	width:100%;
	left:0;
	margin-left:0%;
	bottom:0px;
	height:110px;
	background-color: rgb(128,175,207);
	padding-top: 0px;
	margin-top: 60px;
	border-top: solid 1px rgb(128,175,207);
	border-bottom: solid 5px rgb(198,18,47);
	}

.footer p {font-size: 100%;
	padding: .25em .25em .5em 1em;
	color:white;
	background-color: rgb(128,175,207);
	-moz-border-radius: 2px 0 0 0;
	border-radius: 2px 0 0 0;
	margin: 0;
	}
.botln{min-width:100%;
	max-width:100%;
	height:5px;
	padding:0px;
	z-index:99;
	}
#rumour a{
	text-decoration: none;
	border:none;
	background-color:transparent;
	font-size: 1em;
	}
	
.footer a{color:white;
	font-size: 1em;
	text-decoration: none;
	padding-left:1.5em;
	}
.footer a:hover{text-decoration: none;
	}

.footer .design p{font-size: 1em;
	background-color:rgb(128,175,207);
	}
	
.footer .design a{padding-left:0em;
	}	
/* End foot of the page */


.iframe {height:97.5%;
	width:97.5%;
	padding:5px;
	overflow:auto;
	background-color:rgb(243,257,251);
	background-color:rgba(128,175,207,0.1);
	border:1px solid rgb(128,175,207);
	}

.tinyFtr a, .norm a {text-decoration:none;
	background-color:transparent;
	border:none;
	}


/* Media queries: */
@media only screen and (max-width: 767px) {
/* For mobile phones: Design mobile first*/
  .col-m-1 {width: 8.33%;}
  .col-m-2 {width: 16.66%;}
  .col-m-3 {width: 25%;}
  .col-m-4 {width: 33.33%;}
  .col-m-5 {width: 41.66%;}
  .col-m-6 {width: 50%;}
  .col-m-7 {width: 58.33%;}
  .col-m-8 {width: 66.66%;}
  .col-m-9 {width: 75%;}
  .col-m-10 {width: 83.33%;}
  .col-m-11 {width: 91.66%;}
  .col-m-12 {width: 100%;}
/* hand held menu */
	/*The navigation buttons*/
.navbrdr{position:relative;
		top:0px;
		float:right;
		right:0px;
		width:auto;
		z-index:99;
		border-radius:7px;
		-moz-border-radius:7px;
		-webkit-border-radius:7px;
		padding:20px;
		border-style:outset;
		border-color:rgb(225,255,255);
		background:rgba(128,175,207,0.1);
	}
	
.inbrdr{padding:10px;
		height:220px;
		min-width:110px;
		max-width:135px;
		border-style:outset;
		border-color:rgb(225,255,255);
		background-color:white;
	}	

#mediaMenu{position:fixed;
		float:right;
		right:0px;
		width:32px;
		height:32px;
		display:block;
		z-index:99999;
	}
.mediaMenu:hover{cursor:pointer;
	}
.mediaMenu{background-image: url('../images/icon_menu_tpg1.png');
	background-repeat: no-repeat;
	background-size: 24px 24px;
	}
.mediaClose{background-image: url('../images/icon_close_tpg1.png');
	background-repeat: no-repeat;
	background-size: 24px 24px;
	}
	
#navig ul, #navig li {position:relative;
	margin: 0;
	padding: 0;
	list-style-type: none;
	padding-bottom: 5px;
	float: left;
  }
  
#navig a {position:relative;
	background-color: rgb(204,204,204);
	text-decoration: none;
	text-indent: 2px;
	border-top: 1px solid #ccc;
	border-left:1px solid #ccc;
	border-right:1px solid #999;
	border-bottom:1px solid #999;
	margin: 0px;
	padding: 4px 0px;
	display: block;
	margin-right:1px;
	margin-bottom:0px;
	color: rgb(53,75,118);
	width:110px;
	height:25px;
	font-size: 0.90em;
}

#navig a:hover {border-top:1px solid #999;
	border-left:1px solid #999;
	border-right:1px solid #ccc;
	border-bottom:1px solid #ccc;
	background-color: rgb(128,175,207);
	color: white;
}
/*End navigation buttons */
	
		
#tpgClose{display:block;
		z-index:100;
	}
	
 /* Dropdown Content (Hidden by Default) */
.dropdown-content {display:none;
    }
    
.showMenu {display:block;
      float:right;  
	top:-2px;
	right:-22px;
	z-index:9999;
	}

.smartMenu {position:fixed;
	right:0px;
	top:20px;
	width:auto;
	z-index:9999;
	}
	
#groupspan{position:relative;
	margin-top:5px;
	}
	
/* end hand held menu */
}

@media only screen and (max-width: 250px) {
/* An adjustment to allow for tiny screens smaller than 250px width*/
  .col-t-1 {width: 8.33%;}
  .col-t-2 {width: 16.66%;}
  .col-t-3 {width: 25%;}
  .col-t-4 {width: 33.33%;}
  .col-t-5 {width: 41.66%;}
  .col-t-6 {width: 50%;}
  .col-t-7 {width: 58.33%;}
  .col-t-8 {width: 66.66%;}
  .col-t-9 {width: 75%;}
  .col-t-10 {width: 83.33%;}
  .col-t-11 {width: 91.66%;}
  .col-t-12 {width: 100%;}
  
 body{line-height:1em;
  }
  
h1 {font-size: 1.25em;
	 }
	 
h2 {font-size: 1.2em;
	 }
	 
h3 {font-size: 1.1em;
	 }
	 
 .tpg {margin:0px;
	}
	
 .tpg i {font-size: 1.0em;
	}
	
  .logo {font-size: 1.125em ;
	margin-top:0px;
	margin-left:25px;
	} 

.imgLeftLogo {margin: 0px 5px;
	width:30px;
	height:30px;
	padding:2px;
	border-radius: 3px;
	-moz-border-radius: 3px;
	}		
	
  .hdr {font-size: 1.0em ;
	}
	
[class*="col-"] {
	padding-top: 5px ;
	}
	
.logo_tpg{position: absolute;
	top:0px;
	width:80px;
	height:80px;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	}
#logoTpg [data-title]:hover:before {width:70%;
	top:15px;
	right:15px;
	font-size:0.9em;
      visibility: visible;
        }
	
#groupspan {display:none;
	}
.imgGen {margin:0;
	width:170px;
	height:240px;
	}


.mediaMenu{background-size: 20px 20px;
	}

.tdtrans{max-height:80px;
	padding-top:0px;
	font-size:0.9em;
	}
	
.uLinks img{width:80%;
	min-width:60px;
	height:80%;
	}
	
	p, a, li {font-size: 0.9em;
	}
	
.main p, .main li{
	font-size: 1.05em;
	}	
.smartMenu {
	top:50px;
	}	
}

@media only screen and (max-width: 180px) {
/* tiny screens */
.imgLeftLogo {float: left;
	margin: 0px;
	width:30px;
	height:30px;
	padding:1px;
	border: solid 1px rgb(255,255,255);
	border-radius: 3px;
	-moz-border-radius: 3px;
	}	

.footer {height:150px;
	bottom:0px;
	padding-bottom:80px;
	padding-right:2px;
	padding-left:2px;
	}
	
.footer a, .footer p   {font-size: 0.8em;
	padding-left:0.5em;
	}
	
.tinyFtr{
	}
	
.content{max-height:500px;
	overflow-y:auto;
	padding-bottom:170px; /* Height of the footer element */
	}
.imgGen {margin:0;
	width:130px;
	height:184px;
	}

#logoTpg [data-title]:hover:before {width:70%;
	top:15px;
	right:5px;
	font-size:0.8em;
      visibility: visible;
        }
.iframe #inpage a, .iframe #inpage p,
	.iframe #inpage li{
	font-size: 1.05em;
	}

.main p, .main li{
	font-size: 0.9em;
	}		
	
h1 {font-size: 1.15em;
	 }
	 
h2 {font-size: 1.0em;
	 }
	 
h3 {font-size: 0.95em;
	 }
	
#navig a {	width:95px;
	}		  
}
 
 @media only screen and (min-width: 251px) {
/* An adjustment to allow for screens bigger than 251px width*/
  .col-m-1 {width: 8.33%;}
  .col-m-2 {width: 16.66%;}
  .col-m-3 {width: 25%;}
  .col-m-4 {width: 33.33%;}
  .col-m-5 {width: 41.66%;}
  .col-m-6 {width: 50%;}
  .col-m-7 {width: 58.33%;}
  .col-m-8 {width: 66.66%;}
  .col-m-9 {width: 75%;}
  .col-m-10 {width: 83.33%;}
  .col-m-11 {width: 91.66%;}
  .col-m-12 {width: 100%;}
  

	
 .tpg i {position:relative;
	float:right;
	top:-3px;
	}
 .logo {margin-left:8px;
	} 
	
  .hdr {font-size: 1.20em ;
	}
  
.logo_tpg{right:5px;
	width:50px;
	height:50px;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	}
	
#groupspan {
	/*width:40%;*/
	}
	
#tpg_3 img, #tpg_4 img,
#tpg_5 img{display:none;
	}
	
 .imgStdTn {height:70px;
	width: 70px;
  }
  
.imgGen {margin:5px;
	width:250px;
	height:354px;
	}

.tdtrans{max-height:90px;
	font-size:1em;
	line-height:1em;
	padding-top:10px;
	}
	
.iframe #inpage a, .iframe #inpage p,
	.iframe #inpage li{
	font-size: 1.1em;
	}	
	
.main p, .main li{
	font-size: 1.1em;
	}		
	
 }
 
 @media only screen and (min-width: 400px) {
/* For smart phones*/
  .col-sp-1 {width: 8.33%;}
  .col-sp-2 {width: 16.66%;}
  .col-sp-3 {width: 25%;}
  .col-sp-4 {width: 33.33%;}
  .col-sp-5 {width: 41.66%;}
  .col-sp-6 {width: 50%;}
  .col-sp-7 {width: 58.33%;}
  .col-sp-8 {width: 66.66%;}
  .col-sp-9 {width: 75%;}
  .col-sp-10 {width: 83.33%;}
  .col-sp-11 {width: 91.66%;}
  .col-sp-12 {width: 100%;}
  
.tpg i {font-size: 1.33em;
	}
	
.logo {font-size: 1.3em ;
	xxfont-weight:bold;
	} 
	
.hdr {font-size: 1.30em ;
	}
	
.logo_tpg{right:5px;
	width:70px;
	height:70px;
	border-radius: 7px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	}
.imgLeftLogo {margin: 5px;
	width:60px;
	height:60px;
	border: solid 2px rgb(255,255,255);
	padding:3px;
	border-radius: 3px;
	-moz-border-radius: 3px;
	}		
 #groupspan span{
	/*width:20%;
	margin-left:2.0%;*/
	}

#groupspan {
	/*min-width:200px;
	height:90px;*/
	}
	
#groupspan img{display:inline-block; 
	}
	
.imgStdTn {height:75px;
	width: 75px;
	border-radius: 5px;
	-moz-border-radius: 5px;
	box-shadow: -5px 5px 5px rgb(136,136,136);
	}
	
.imgGen {margin:5px;
	width:350px;
	height:495px;
	}
	
#tpg_4 img,
#tpg_5 img{display:none;
	}
 
.mediaMenu{background-size: 32px 32px;
	}
	
#mediaMenu{right:10px;
		width:48px;
		height:48px;
	}
	
.tdtrans{height:80px;
	font-size:1em;}

.tdtrans a{	
	padding-top:10px;	
	}	
	
.main p, .main li{
	font-size:1.2em;
		}
	
#navig a {font-size: 0.90em;	
	width:110px;
	height:30px;
	}	
	
.inbrdr{height:250px;
	}	
 }

@media only screen and (min-width: 600px) {
  /* For tablets: */
  .col-s-1 {width: 8.33%;}
  .col-s-2 {width: 16.66%;}
  .col-s-3 {width: 25%;}
  .col-s-4 {width: 33.33%;}
  .col-s-5 {width: 41.66%;}
  .col-s-6 {width: 50%;}
  .col-s-7 {width: 58.33%;}
  .col-s-8 {width: 66.66%;}
  .col-s-9 {width: 75%;}
  .col-s-10 {width: 83.33%;}
  .col-s-11 {width: 91.66%;}
  .col-s-12 {width: 100%;}
  
.tpg i {font-size: 1.75em;
	}
.logo {font-size: 1.60em ;
	} 

.hdr {font-size: 1.30em ;
	}	
	
#groupspan span{
	/*margin-left:2.0%;*/
	}	

#groupspan{
	/*height:100px;*/
	}
	
#groupspan img{display:inline-block; 
	}
	
.imgStdTn {height:85px;
	width: 85px;
  }
  
 .imgGen {margin:5px;
	width:500px;
	height:706px;
	}
	
#tpg_5 img{display:none;
	}
	
.main p, .main li{
	font-size:1.2em;
		}	
	
#navig a {font-size: 0.90em;	
	width:110px;
	height:30px;
	}
	
.tdtrans a{	
	padding-top:20px;	
	}
.tdtrans{font-size:1.1em;
	}
}

@media only screen and (min-width: 768px) {
  /* For desktop: */
  .col-1 {width: 8.33%;}
  .col-2 {width: 16.66%;}
  .col-3 {width: 25%;}
  .col-4 {width: 33.33%;}
  .col-5 {width: 41.66%;}
  .col-6 {width: 50%;}
  .col-7 {width: 58.33%;}
  .col-8 {width: 66.66%;}
  .col-9 {width: 75%;}
  .col-10 {width: 83.33%;}
  .col-11 {width: 91.66%;}
  .col-12 {width: 100%;}
  
.content{margin-left: 2.5%;
	margin-right:2.5%;
	}
  
  .tpg i {font-size: 1.75em;
	}
	
.logo {font-size: 1.70em ;
	margin-left:10px;
	} 
.imgLeftLogo {margin: 5px 20px;
	}
.hdr {float:left;
	margin-top:15px;
	 }
	 
	
#groupspan{
	/*width:100%; */
	}
	
#groupspan img{
	/*display:inline-block; */
	}
	
#groupspan span{
	/*margin-left:2.0%;*/
	}

.imgStdTn {height:100px;
	width: 100px;
	border-radius: 7px;
	-moz-border-radius: 7px;
	box-shadow: -5px 5px 5px rgb(136,136,136);
	}
	
.imgGen {width:600px;
	height:846 px;
	}
	
.logo_tpg{right:5px;
	width:70px;
	height:70px;
	border-radius: 7px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	}
	
	/*The navigation buttons*/
#mediaMenu, #tpgClose{
	display:none;
}

.inbrdr {
	height:0px;
	}
	
.navbrdr {position:relative;
	margin:auto;
	top:0px;
	padding-top:0px ;
	z-index:99;
	left:-40px;
	padding-bottom:5px;
	display:inline-block;
}

#navig ul, #navig li {
	position:relative;
	margin: 0;
	padding: 0;
	list-style-type: none;
	padding-bottom: 5px;
	float: left;
  }
  
#navig a {
	position:relative;
	background-color: rgb(204,204,204);
	text-decoration: none;
	border-top: 1px solid #ccc;
	border-left:1px solid #fff;
	border-right:1px solid #999;
	border-bottom:1px solid #999;
	margin: 0px;
	padding: 4px 2px;
	display: block;
	margin-right:1px;
	margin-bottom:0px;
	color: rgb(53,75,118);
	width:auto;
	height:35px;
	font-size: 0.90em;
	}

#navig a:hover {
	border-top:1px solid #999;
	border-left:1px solid #999;
	border-right:1px solid #ccc;
	border-bottom:1px solid #ccc;
	background-color: rgb(128,175,207);
	color: white;
	}
/*End navigation buttons */

#groupspan img{
	display:inline-block; 
/*padding:1.0%;*/
	}
	
.tdtrans{font-size:1.2em;
	}	
}

@media only screen and (min-width: 1080px) {
  /* For televisions: */
  .col-t8-1 {width: 8.33%;}
  .col-t8-2 {width: 16.66%;}
  .col-t8-3 {width: 25%;}
  .col-t8-4 {width: 33.33%;}
  .col-t8-5 {width: 41.66%;}
  .col-t8-6 {width: 50%;}
  .col-t8-7 {width: 58.33%;}
  .col-t8-8 {width: 66.66%;}
  .col-t8-9 {width: 75%;}
  .col-t8-10 {width: 83.33%;}
  .col-t8-11 {width: 91.66%;}
  .col-t8-12 {width: 100%;}
  
.tpg i {font-size:1.75em;
  position:relative;
  top:0px;
  float:right;
  }
  
.logo_tpg{right:20px;
	width:100px;
	height:100px;
	border-radius: 7px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	}
.imgLeftLogo {margin:5px 20px;
	width:80px;
	height:80px;
	border: solid 3px rgb(255,255,255);
	padding:5px;
	border-radius: 5px;
	-moz-border-radius: 5px;
	}
	
.logo {font-size:2.2em;
	margin-left:10px;
	}
	
.hdr {font-size: 1.50em ;
	 }
	 
.content {
	 }
	 
#navig a{font-size: 1em;
	height:40px;
	padding:5px;
	}
	
p, li {font-size: 1.1em;
	}	
	
.imgStdTn {height:130px;
	width: 130px;
	border-radius: 7px;
	-moz-border-radius: 7px;
	box-shadow: -7px 7px 7px rgb(136,136,136);
	}
	
.tdtrans{height:70px;
	font-size:1.1em;
	}
	
.tdtrans a{	
	padding-top:3%;	
	}
}



@media only screen and (min-width: 1920px) {
  /* For higher def televisions: */
  .col-tv-1 {width: 8.33%;}
  .col-tv-2 {width: 16.66%;}
  .col-tv-3 {width: 25%;}
  .col-tv-4 {width: 33.33%;}
  .col-tv-5 {width: 41.66%;}
  .col-tv-6 {width: 50%;}
  .col-tv-7 {width: 58.33%;}
  .col-tv-8 {width: 66.66%;}
  .col-tv-9 {width: 75%;}
  .col-tv-10 {width: 83.33%;}
  .col-tv-11 {width: 91.66%;}
  .col-tv-12 {width: 100%;}
  
.imgGen {width:800px;
	height:1130px;
	}
	
h1{font-size: 2.5em;
	 }
	 
h2 {font-size: 2.2em;
	 }
	  
h3 {font-size: 1.8em;
	 }
	 
	p,a,li {
	font-size:1.5em;
	}
	 
.tpg i {font-size:2.0em;
  }
  
.logo_tpg{right:30px;
	width:150px;
	height:150px;
	border-radius: 7px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	}
.imgLeftLogo {float:left;
	margin: 5px 20px;
	width:100px;
	height:100px;
	border: solid 3px rgb(255,255,255);
	padding:5px;
	border-radius: 7px;
	-moz-border-radius: 7px;
	}	
.logo {font-size:2.75em;
	xxfont-weight:bold;
	xxmargin-left:70px;
	}
	
.hdr {float:left;
	font-size: 2.30em;
	margin-left:10%;
	margin-top:15px;
	 }
	 
#navig a{width:180px;
	height:50px;
	padding: 5px;
	font-size:1.2em;
	}
	
.imgStdTn {
	height:150px;
	width: 150px;
	border-radius: 7px;
	-moz-border-radius: 7px;
	box-shadow: -7px 7px 7px rgb(136,136,136);
	}
	
.tdtrans{
	max-height:200px;
	font-size:1.1em;
	}
	
.tdtrans a {
	padding:2%;
	}
 }

 
 @media only screen and (min-width: 3840px) {
  /* For ultra higher def televisions: */
  .col-uh-1 {width: 8.33%;}
  .col-uh-2 {width: 16.66%;}
  .col-uh-3 {width: 25%;}
  .col-uh-4 {width: 33.33%;}
  .col-uh-5 {width: 41.66%;}
  .col-uh-6 {width: 50%;}
  .col-uh-7 {width: 58.33%;}
  .col-uh-8 {width: 66.66%;}
  .col-uh-9 {width: 75%;}
  .col-uh-10 {width: 83.33%;}
  .col-uh-11 {width: 91.66%;}
  .col-uh-12 {width: 100%;}

.content{
	margin-left: 10%;
	margin-right:10%;
	}
  
  }
/* Print: */
@media print {
#mediaMenu {displayxx:none
	}

.logo{font-size:150%;
	}
	
.hdr{width:85%;
	}
	
.logo_tpg{position: absolute;
		width:80px;
		height:80px;
		border-radius: 5px;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
	}
	
.footer {position: relative;
	}

.navbrdr {position:relative;
	margin:auto;
	top:0px;
	min-width:800px;
	padding-top:0px ;
	z-index:99;
	left:-40px;
	padding-bottom:5px;
	display:inline-block;
	}

#navig ul, #navig li {position:relative;
	margin: 0;
	padding: 0;
	list-style-type: none;
	padding-bottom: 5px;
	float: left;
	}
	
#navig a {position:relative;
	background-color: rgb(204,204,204);
	text-decoration: none;
	text-indent: 2px;
	border-top: 1px solid #ccc;
	border-left:1px solid #ccc;
	border-right:1px solid #999;
	border-bottom:1px solid #999;
	margin: 0px;
	padding: 4px 0px;
	display: block;
	margin-right:1px;
	margin-bottom:0px;
	color: rgb(53,75,118);
	width:94px;
	height:30px;
	font-size: 0.95em;
	}
}