body	{ 
background-color: #fff; 
font-family: Helvetica; 
font-size: 16px;
/*text-align:center;*/

margin: 0;/* 0 negative space around the outside of the body */
padding: 0;  /* 0 negative space around the inside of the body */
}

a:link
    { color:#00c; }
a:visited
    { color:#c09; }
a:hover
    { color:#090; text-decoration:underline; }
a:active
    { color:#0c0; }




#bwrdd{
display:block;
/*width:70%;**/
/*width: 95%;*/
min-width: 0;/* NOT IN DT */
font-family: Helvetica;
font-size: 24px;
font-weight:400;
padding: 0;
margin:10px 0px 0px 10px;
}



td#arChwith{
text-align:left;
width:20%;
}

td#ynCanol{
text-align:left;
width:20%;
color:red;
}

td#arDde{
text-align:left;
width:60%;
padding-left:1.2rem;
}

	



#dal{
}


li{
font-size:1.4rem;
list-style: none;
line-height:40px;
}


.level {
    font-size: 90%;
	font-weight:600;
    border: 1px solid #ccc;
    border-radius: 0.25em;
    -o-border-radius: 0.25em;
    -ms-border-radius: 0.25em;
    -moz-border-radius: 0.25em;
    -webkit-border-radius: 0.25em;
    padding: 1px 3px;
}


.melyn{
color:yellow;
}

.gwyrddGolau{
color:#eee;
}



.hl{
font-weight:600;
color:#gray;
}

.gwyrdd{
color:gray;
}

.faded{
font-size:14px;
color:silver;
}

.leinODan{
text-decoration:underline;
font-weight:500;
}

.itlc{
font-size:20px;
font-style:italic;
}


#ndech {
position:relative;
top:50px;
left:30px;
font-size:21px;
font-weight:600;
color:blue;
display:block;
text-align:left;
cursor:pointer;
}




#adref{
visibility:hidden;
}

#rdech {
position: absolute;
left: 10px;
top:0px;
display:block;
background-color: #fff;
color: #000;
font-family: Helvetica; 
font-size: 16px;
margin:5px 10px 10px 5px; 

}

#r1 {
position: relative;
left: 10px;
top:0px;
display: none;
color: #222;       /* Foreground color used for text */
font-family: Helvetica; 
font-size: 16px;
padding: 0;  /* 0 negative space around the inside of the  body */
margin:10px 0px 0px 10px; 
height:90%;
width:90%;
//border: 1px solid #999999;

}

#r11 {
position: relative;
display:none;
font-size: 16px; 
left: 20px;
top:50px;
height:90%;
width:90%;
font-weight:600;
}

#eto {
position:relative;
top:40px;
width:100%;
font-size:19px;
font-weight:600;
color:blue;
visibility:visible;
text-align:center;
padding-bottom:20px;
cursor:pointer;
}

#n1 {
position:absolute;
top:130px;
left:130px;
font-size:25px;
font-weight:600;
color:blue;
visibility:hidden;
text-align:right;
cursor:pointer;
}

#bwrdd {
display:inherit;
}

#sut{
position:relative;
width:90%;
top:40px;
left:0px;
display:inherit;
font-size:1rem;
color:gray;
}

#modal {
    display: none;
    position: absolute;
    left: 0px;
    top: 0px;
    width:100%;
    height:100%;
}

#modalMask {
    position: absolute;
    left: 0px;
    top: 0px;
    width:100%;
    height:100%;
    background-color: #eee;
    z-index: 1000;
    opacity: 0.9;
    filter:alpha(opacity=90);
    -moz-opacity: 0.9;
}

#modalContent {
    position: relative;
    width:280px;
    margin: 15px auto;
    padding:15px;
    background-color: #fff;
    border:1px solid #000;
    text-align:justify;
    z-index: 9999;
	color:#003;
}
	




/****************** MEDIA QUERY SECTION **************************/



@media all and (min-width: 720px){


body  {
font-size:90%;/*ADDED*/
width:50%;
/*max-width:1000px;  CADW O YN GUL AR SGRIN MAWR*/
margin:0 auto;
line-height:1.75em;
/*font-size:.90em;*/
font-weight:400;
}

#ndech{
top:100px;
left:150px;
font-size:24px;
/*text-align:center;*/
}



#dal{

position:relative;
/*top:20px;
left:300px;
padding: 20px 100px 20px 100px;
*/
}


#r1 {
font-size: 24px;
}







}/*CAU MQ*/