/* CSS Document for the paygate.co.za website */
body {
/*  font-family: arial;*/ 
  font-size: 10px; 
  margin: 0;
  padding: 0;
  border: 0;
  overflow: hidden;
  height: 100%; 
  max-height: 100%; 
  font-family: Arial, Helvetica, sans-serif;
}

#framecontentLeft, #framecontentTop {
  position: absolute; 
  top: 75px; 
  left: 0; 
  width: 148px; /*Width of left frame div*/
  height: 100%;
  overflow: hidden; /*Disable scrollbars. Set to "scroll" to enable*/
}

#framecontentTop { 
  top: 0;
  left: 0; /*Set left value to WidthOfLeftFrameDiv*/
  right: 0;
  width: 100%;
  height: 75px; /*Height of top frame div*/
  overflow: hidden; /*Disable scrollbars. Set to "scroll" to enable*/
  background-image: url(./img/top_rep.gif);
}

#framecontentLeft { 
  background: white url(./img/side.gif) no-repeat left top;
}

#maincontent {
  position: fixed; 
  left: 148px; /*Set left value to WidthOfLeftFrameDiv*/
  top: 75px; /*Set top value to HeightOfTopFrameDiv*/
  right: 0;
  bottom: 0;
  overflow: auto; 
  background: #fff;
}

.innertube {
  margin: 15px; /*Margins for inner DIV inside each DIV (to provide padding)*/
  font-size: 13px;
}

.navigation {
  margin-top: 15px; /*Margins for inner DIV inside each DIV (to provide padding)*/
  font-size: 11px;
  font-weight: bold;
	letter-spacing: 1px; 
}

* html body { /*IE6 hack*/
  padding: 75px 0 0 0; /*Set value to (HeightOfTopFrameDiv 0 0 WidthOfLeftFrameDiv)*/
}

* html #maincontent { /*IE6 hack*/
  padding: 0 0 0 148px; /*Set value to (HeightOfTopFrameDiv 0 0 WidthOfLeftFrameDiv)*/
  height: 100%; 
  width: 100%; 
}

* html #framecontentTop { /*IE6 hack*/
  width: 100%;
}

#homecontent {
  width: 100%;
  white-space: nowrap;
  }

span.homeinner {
  display: inline-block;
  }

/* SecureCode, VbyV, T&C and Policy box on homepage*/
#SVTP {
  position: absolute;
  left: 420px;
  top: 230px;
  white-space: nowrap;
  }

/* Hack for IE - SecureCode, VbyV, T&C and Policy box on homepage*/
* html #SVTP {
  padding: 0 0 0 148px; /*Set value to (HeightOfTopFrameDiv 0 0 WidthOfLeftFrameDiv)*/
  }

div.productlinks {
  font-size: smaller;
  text-align: center;
  padding-bottom: 10px;
  }

a.navigation:link { 
  color: #DEDEDE; 
  text-decoration: none; 
}
 
a.navigation:visited { 
  color: #DEDEDE; 
  text-decoration: none; 
}
 
a.navigation:hover { 
  color: orange; 
  text-decoration: none; 
}

.pagetitle {
  font-size: 16px;
  font-weight: bold;
  text-align: right;
  color: #8689b2;
}

h1.pagetitle {
  font-size: 16px;
  font-weight: bold;
  text-align: right;
  color: #8689b2;
}

h6.pagetitle {
  font-size: 16px;
  font-weight: bold;
  text-align: right;
  color: #8689b2;
  margin: 0;
}

h2.sectiontitles {
	font-weight : bold;
	color : #33387B;
	font-size : 16px;
  margin-bottom: 2px;
 }

h2.sectiontitles1 {
	font-weight : bold;
	color : #33387B;
	font-size : 16px;
  margin: 0 0 2px;
 }

h2.sectiontitle {
	font-weight : bold;
	color : #33387B;
	font-size : 16px;
  margin-bottom: -12px;
 }

h2.sectiontitle a:link { 
  color: #33387B; 
  text-decoration: none; 
}
 
h2.sectiontitle a:visited { 
  color: #33387B; 
  text-decoration: none; 
}
 
h2.sectiontitle a:hover { 
  color: #33387B;
  text-decoration: none;
}

h2.sectiontitlegcp {
	font-weight : bold;
	color : #33387B;
	font-size : 16px;
  margin-bottom: 0px;
 }

h2.questionhead {
  font-weight: bold;
  font-size: 10pt;
  margin-bottom: -12px;
}

h2.sectiontitledemo {
	font-weight : bold;
	color : #FFFFFF;
	font-size : 16px;
  margin-bottom: -12px;
  padding: 2px 0 2px 10px;
 }

h1.newstitle {
	font-weight : bold;
	color : #33387B;
	font-size : 16px;
  margin-bottom: 3px;
 }

h1.newstitle a:link { 
  color: #33387B; 
  text-decoration: none; 
  }
 
h1.newstitle a:visited { 
  color: #33387B; 
  text-decoration: none; 
  }
 
h1.newstitle a:hover { 
  color: #33387B;
  text-decoration: none;
  }

a.linksgc {
  text-decoration: none;
  color: #008000;
  }

a.linksfaq {
  text-decoration: none;
  color: #0000FF;
  }

a.linkspsp {
  text-decoration: none;
  color: #000099;
  }

a.linkspr {
  text-decoration: none;
  color: #0000FF;
  
  }

ul.navigationfaq {
  padding: 0;
  margin: 0;
}

li.naviLinkfaq {
  margin-bottom: 4px;
  list-style-position: outside;
  list-style-type: none;
}

ul.navigation {
  padding-left: 0px;
  margin-left: 10px;
}

li.naviLink {
  margin-bottom: 4px;
  list-style-position: outside;
  list-style-type: none;
}

div.section {
  margin-top: 20px;
  }

div.sectionnews {
  margin-top: 12px;
  padding-bottom: 10px;
  border-bottom: dotted 1px #E1E1E1;
  }

div.sectionheader {
  margin-top: 20px;
  background-color: #8689b2;
/*  background-color: #04533F;*/
  -webkit-border-top-left-radius: 10px;
  -moz-border-radius-topleft: 10px;
  }

div.lastsection {
  margin: 10px 0 20px 0;
  padding-bottom: 20px;
  }

div.sectionsub {
  margin-top: 15px;
  }

.SectionTitle1 {
	font-weight : bold;
	color : #33387B;
	font-size : 16px;
 }

div.sectiontitlextra {
  font-size: xx-small;
  font-style: italic;
	font-weight : bold;
	color : #33387B;
	margin-left: 175px;
  }

div.floatright {
  margin-bottom: -15px;
  text-align: right;
  float: right;
  font-weight: bold;
  }

* html div.floatright {
  margin-bottom: -20px;
  }

div.acrobatlogo {
  float: left;
  padding-left: 5px;
  margin-top: 25px;
  }

* html div.acrobatlogo {
  margin-top: 8px;
  }

div.thankyou {
  text-align: center;
  margin-top: 40px;
  }

.Button {
	border : thin solid #8689B2;
	color : #33387B;
	font-weight : bold;
}

/* Layout rules for Demo Table*/
.tablestyle {
	display: table;
	border-collapse: separate;
}
.tablerow {
	display: table-row;
}
.tablerow div {
	display: table-cell;
}
	
/* Styling rules for Demo Table to make the example look nicer */
.tablestyle {
	text-align: left;
  margin: 0px auto;
	width: 520px;
}
.tablerow div {
	background: #fff;
}
.tablerow div.rowstyle1 {
	width: 150px;
	vertical-align: middle;
}
.tablerow div.rowstyle2 {
	width: 110px;
}
* html .tablestyle {
	display: block;
	width: 520px;
}
* html .tablerow {
	display: block;
	padding: 0px;
}
* html .tablerow div {
	display: block;
	float: left;
	margin: 0;
}
* html .tablerow div.rowstyle1 {
	width: 300px;
	margin-top: 15px;
}
* html .tablerow div.rowstyle2 {
	width: 120px;
	margin-left: 0px;
}

div.pricestyle {
  width: 100%;
  background-color: #d9dbf2;
  border: 1px solid #000000;
  padding: 5px;
  margin: 0px auto;
  overflow: hidden;
  }

div.pricerow {
  clear: both;
  padding-top: 2px;
  }

div.pricerow span.label {
  float: left;
  padding-right: 10px;
  width: 35%;
  text-align: right;
  }

div.pricerow span.forminput {
  text-align: left;
  }

div.contactstyle {
  width: 100%;
  padding: 5px;
  margin: 0px auto;
  overflow: hidden;
  }

div.contactrow {
  clear: both;
  padding-top: 15px;
  }

div.contactrow span.label {
  float: left;
  width: 45%;
  text-align: left;
  }

div.contactrow span.text {
  float: right;
  width: 55%;
  text-align: left;
  }

span.important {
  font-weight: bold;
  color: #FF0000;
  }

.DownloadTitle {
	color: #33387B;
  }

.DownloadTitleDate {
  font-size: smaller;
  color: #000000;
  }

ul.careerlist {
  margin-top: -12px;
  margin-left: -17px;
  }

* html ul.careerlist {
  margin-top: -15px;
  margin-left: 25px;
  }

div.productstyle {
  padding: 1px;
  width: 200px;
  border-top: 3px ridge silver;
  border-left: 3px ridge silver;
  border-right: 3px ridge black;
  border-bottom: 3px ridge black;
  overflow: hidden;
  }

div.productcell1 {
  padding: 2px;
  border-top: 1px black solid;
  border-left: 1px black solid;
  border-right: 1px silver solid;
  border-bottom: 1px silver solid;
  }

div.productcell2 {
	color: #33387B;
  margin: 0;
  float: left;
  width: 100px;
  padding: 1px;
  border-top: 1px black solid;
  border-left: 1px black solid;
  border-right: 1px silver solid;
  border-bottom: 1px silver solid;
  min-height: 19px;
  }

div.productcell3 {
	color: #33387B;
  margin-left: 105px;
  padding: 1px;
  border-top: 1px black solid;
  border-left: 1px black solid;
  border-right: 1px silver solid;
  border-bottom: 1px silver solid;
  min-height: 19px;
  }

* html div.productcell2 {
  height: 23px;
  }

* html div.productcell3 {
  margin-left: 0;
  height: 23px;
  }

div.gcstyle {
  width: 100%;
  background-color: #d9dbf2;
  border: 1px solid #000000;
  padding: 5px;
  margin: 0px auto;
  overflow: hidden;
  }

div.gcrow {
  clear: both;
  padding-top: 2px;
  vertical-align: middle;
  }

div.gcrow span.label {
  float: left;
  padding-right: 10px;
  width: 25%;
  text-align: right;
  }

div.gcrow span.forminput {
  text-align: left;
  }

span.product {
  font-weight:bold;
  color:green;
  white-space: nowrap;
  }

div.submit {
  text-align: center;
  padding-top: 20px;
  padding-bottom: 20px;
  }

ul.slide {
  float: left;
  margin: 0;
  padding: 0;
  list-style: none;
  }

li.slide {
  float: left;
  width: 185px;
  margin: 0 0 5px 5px;
  padding: 20px 0 0;
  text-align: center;
  border: thin black solid;
  height: 185px;
  -webkit-border-radius: 10px; 
	-moz-border-radius: 10px;
  }

li.slidewithtext {
  float: left;
  width: 185px;
  margin: 0 0 5px 5px;
  padding: 20px 0 0;
  text-align: center;
  border: thin black solid;
  height: 185px;
  -webkit-border-radius: 10px; 
	-moz-border-radius: 10px;
  }

* html li.slidewithtext {
  padding: 10px 0 0;
  }

/* News Main content */
#newsMainContent {
	position: relative;
	margin-right: 17em;
	}

* html #newsMainContent {
	width: 660px;
	margin-right: 0;
/*	border: thin black solid;*/
	}

#newsMainInner {
	position: relative;
	float: left;
	width: 100%;
	margin-right: -17em;
	padding-right: 1em;
	}

/* News Side Content */
#newsSideContent {
	float: right;
	}

* html #newsSideContent {
  position: absolute;
  left: 830px;
  top: 53px;
/*	border: thin black solid;*/
	}

#newsSideInner {
	width: 13.0em;
	float: left;
	padding: 0em 0em 0.5em 2em;
	border-left: dotted 1px #E1E1E1;
	}

h3.newsSideHeader {
  font-weight: normal;
  font-size: 15px;
  letter-spacing: -1px;
  border-bottom: dotted 1px #E1E1E1;
  color: #33387B;
  text-transform: lowercase;   
  }

h3.newsSideHeader span {
  font-weight: bold;
  }

ul.links {
  list-style: square;
  margin: 0;
  padding: 0 0 10px;
  font-size: 12px;
	border-bottom: dotted 1px #E1E1E1;
  }

ul.links li {
  line-height: 1.7em;
  }

/*ul.links li.first {
  }*/

ul.links li a:link {
  text-decoration: none;
  padding: 0 1px;
  color: #33387B;
  }

ul.links li a:visited {
  text-decoration: none;
  padding: 0 1px;
  color: #33387B;
  }

ul.links li a:hover {
  background-color: #EEEEFF;
  text-decoration: none;
  padding: 0 1px;
  color: #33387B;
  }

div.theNewsContent {
  margin: 10px 0 5px;
  text-align: justify;
  }

div.theNewsContent a:link {
  text-decoration: none;
  color: #33387B;
  padding: 0 2px;
  }

div.theNewsContent a:visited {
  text-decoration: none;
  color: #33387B;
  padding: 0 2px;
  }

div.theNewsContent a:hover {
  text-decoration: none;
  color: #33387B;
  padding: 0 2px;
  background-color: #FFFF99;
/*  background-color: #EEEEFF;*/
  }

div.newserror {
  margin: 10px 0;
  font-weight: bold;
  text-align: center;
  color : #33387B;
  }

div.newserrorarticle {
  margin: 10px 0;
  }

div.bookmarkcontainer {
  padding: 10px 0 0;
  border-top: dotted 1px #E1E1E1;
  }

div.bookmarktext {
  font-size: smaller;
  padding-bottom: 4px;
  }

a.pagelinks {
  text-decoration: none;
  color: #33387B;
  border: thin dotted #33387B;
  padding: 2px;
  }

*html a.pagelinks {
  border: 0;
  text-decoration: underline;
  }

span.pageselected {
  font-weight: bold;
  color: #fff;
  background-color: #33387B;
  border: thin solid #33387B;
  padding: 2px;
  }

div.theNewsTags {
  font-size: smaller;
  padding-bottom: 10px;
  }

#theTags {
  color: #000;
  }

a.taglink:link {
  text-decoration: none;
  padding: 0 1px;
  color: #33387B;
  }

a.taglink:visited {
  text-decoration: none;
  padding: 0 1px;
  color: #33387B;
  }

a.taglink:hover {
  text-decoration: none;
  background-color: #E1E1E1;
  border: thin solid gray;
  padding: 0;
  color: #33387B;
  }

span.imgholdright {
  float: right;
  width: 130px;
  text-align: center;
  margin-left: 10px;
  }

span.width170 {
  width: 170px;
  }

div.splitter {
  padding-bottom: 20px;
  border-bottom: dotted 1px #E1E1E1;
  }

div.lastsplitter {
  margin-top: 20px;
  }