body{
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	margin: 0;
	padding: 0;
	background-color: #484646;
}

div#outer {
	margin: 0 0 0 5em;
	padding: 0 0 1em 0;
	height: 100%;
	width: 72em;
	color: #484646;
	background-color: #ffffff;
	border: thin solid #AAA8A8;
}

div#title {
	width: 100%;
	margin: 0;
	background-color: #a75a80;
}

div#lefttitle {
	float: left;
	margin:  12px 20px 0 20px;
}

div#righttitle {
	float: left;
	font-size: 4em;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-weight: bold;
	letter-spacing: 2px;
	color: #dfdbdb;
	margin: 0;
	padding: 5px 0 0 10px;
}

h1 {
	font-size: 4em;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #dfdbdb;
	margin: 0;
	padding: 16px 0 0 10px;
}

h2 {
	font-size: 1.75em;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	color: #484646;
	font-weight: bold;
	margin: 0;
	padding: 0 0 1em 0;
}

h3 {
	font-size: 1.25em;
	margin: 0 0 .5em 0;
}

div#pennawd {
	font-size: 1.75em;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	color: #dfdbdb;
	font-weight: bold;
	margin: 15px 0 0 0;
	padding: 0;
}

div#nav {
	font-size: 1em;
	font-weight: bold;
	margin: 0;
	padding: 1px 0 0 0;
	text-align: center;
}

div#nav ul{
	margin: 0;
	padding: 0;
}

div#nav li{
	background-color: #747272;
	list-style-type: none;
	float: left;
	width: 96px;
}

div#nav li a{
  margin: 0;
	padding: 2px;
	color: #dfdbdb;
	text-decoration: none;
  	display: block;
}

div#nav li a:hover {
	background-color: #a75a80;
}

div#activenav {
	background-color: #a75a80;
}

div#navOriel {
	display: block;
	background-color: #ffffff;
	font-weight: bold;
	font-size: 1.25em;
	color: #484646;
	text-align: center;
	margin: 0 0 0 27em;
	padding: 1px;
	border: medium solid #bbb;	
}

div#navOriel  a{
  display: inline;
  margin: 0;
	padding: 0;
	text-decoration: none;
	display: block;
}

div#navOriel a:hover {
	text-decoration: underline;
}

div#content {
	margin: 3em 0 0 0;
	padding: 0 1em 0 2.3em;
	line-height: 20px;
}

div#croesoleft {
	float: left;
	height: 100%;
	width: 55%;
	text-align: justify;
}

div#croesoright {
	float: left;
	height: auto;
	padding: 3em 1em 1em 1em;
}

div#columnleft {
	float: left;
	height: 100%;
	width: 40%;
}

div#columnright {
	float: left;
	height: auto;
	padding: 3em 0 1em 0;
}

div.hanes{
	float: left;
	width: 100%;
	margin: 0 0 1em 0;
}

div.hanesleftllun{
	float: left;
}

div.hanesrightllun{
	float: left;
	padding: 0 0 0 2em;
}

div.haneslefttestun{
	float: left;
	width: 55%;
	text-align: justify;

}

div.hanesrighttestun{
	float: left;
	width: 40%;
	padding: 0 0 0 2em;
	text-align: justify;
}

div.arweinyddion {
	width: 100%;
}

div.arweinyddionleft {
	float: left;
	width: 27%;
}

div.arwynleft {
	float: left;
	width: 27%;
}

div.arweinyddionright {
	float: left;
	width: 68%;
	font-weight: normal;
	margin: 1.5em 0 0 0;
	padding: 0 0 1.25em 0;
	text-align: justify;
}

div.unigolionleft {
	float: left;
	width: 38%;
}

div.unigolionright {
	float: left;
	width: 60%;
	font-weight: normal;
	margin: 1.5em 0 1em 0;
	text-align: justify;
}

div#dyddiadur {
	float: left;
	margin: 0 2em 0 0;
}

div#rhaglenleft {
	float: left;
	width: 65%;
	font-weight: normal;
	padding: 0 0 1em 0;

}

div#rhaglen {
	float: left;
	width: 100%;
	background-image: url(../Images/aveverum.jpg);
	background-repeat: no-repeat;
	background-position: 95% top;
	
}

div#rhaglenright {
	float: left;
	font-weight: normal;
	padding: 0 0 1em 0;

}

div.disksleft {
	float: left;
	width: 30%;
}

div.disksright {
	float: left;
	width: 65%;
	font-weight: normal;
	padding: 0 0 20px 0;
	text-align: justify;
}

div.cysylltuleft {
	padding: .5em 0 0 0;
	float: left;
	width: 35%;
	text-align: justify;
}

div.cysylltucanol{
	float: left;
	margin: 1em 0 0 0;
	padding: 0 2em 0 2em;
}

div.cysyllturight {
	float: left;
	font-weight: normal;
	margin: 1em 0 0 0;
	text-align: justify;
}

div#linc{
	color: #eb714d;
}

div#linc a{
	color: #eb714d;
	text-decoration: none;
}

div#linc a:hover {
	color: #eb714d;
	text-decoration: underline;
}

div#contact {
	border: thin double #5a7a79;
	padding: 0 0 0 4em;
}

div#oriel {
	width: 83em;
	margin: 0 0 0 1em;
}
div#left {
	float: left;
	margin: 2.35em 0 .5em .5em;
}

div#right{
	float: left;
	margin: 0 0 .5em 0;
}

.out {
  display:block; 
  background:#bbb; 
  border:1px solid #ddd; 
  position:relative;
  margin: 0;
  padding: 0;
  }
.in {
  text-align:center; 
  background:#fff; 
  border:1px solid #555; 
  position:relative; 
  margin: 0;
  padding: 0;
  font-weight:normal;
  }
.ltin {
  left:-5px;
  }
.tpin {
  top:-5px;
  }
  
.rtin {
  left:5px;
  }
.btin {
  bottom:5px;
  }
  
.narrow {width:40em;} /* change to suit */
h4 {font-weight:bold; color:#000;}

div#teyrnged {
	border: 1px solid #000000;
	text-align: center;
	margin: 0 0 7px 0;
}

div#Mei {
	padding: .75em;
	border: thin solid black;
	text-align: justify;
}

div#llunMei {
	float: left;
	padding: 0 1em 0 1em;
}

div#textMei {
	float: left;
	text-align: justify;
}

div#ebost {
	float: right;
	margin: 0 6em 0 0;
	color: #dfdbdb;
	font-size: 1em;
	font-weight: bold;
	text-align: center;
}

div#ebost a{
	text-decoration: underline;
	color: #dfdbdb;
}

div#ebost a:hover{
	color: #a75a80;
}

div#footerleft{
	float: left;
	margin: 0 0 0 5em;
	color: #dfdbdb;
	font-size: 1em;
	font-weight: bold;
	text-align: center;
}