@charset "utf-8";

.cynhwysydd { width: 960px; margin: 0 auto; }
.container {width: 960px; margin: 0 auto; }

.nav {
}

.legibility {
  text-rendering: optimizeLegibility;
  text-rendering: geometricPrecision;
  font-smooth: always;
  font-smoothing: antialiased;
  -moz-font-smoothing: antialiased;
  -webkit-font-smoothing: antialiased;
  -webkit-font-smoothing: subpixel-antialiased;
}

div.llinell hr {
  border-top-width: 2px;
  border-top-color: #b30000;
}

div.llinell {
  margin-right: auto;
  margin-left: auto;
}

div.llinell.h3-tanlinelli {
  padding-top: 5px;
  padding-bottom: 20px;
  max-width: 80px;
  width: 100%;
}

body{
	margin: 0;
	min-width: 980px;
	padding: 0;
}

p{
	margin: 0 0 20px 0;	
}

p, ul{
	font-family:'Dosis', Arial, Helvetica, sans-serif;
	font-size-adjust:0.488;
	font-weight:200;
	font-style:normal;
    text-align:justify;
}

#pennyn h1, #picseli{
	color: #b30000;
}

a:link {
text-decoration: none;
 }

#rhagym{
	background: url(./images/firstBG.png) no-repeat fixed 60% 0%; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;
	color: #b30000;
	height: 100vh;
    width:100%;
	margin: 0 auto;
    text-align:center;
}

#dwyn {
	background: url(images/thirdBG.jpg) 50% 0 no-repeat fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;
	color: rgba(0, 0, 0, .65);
	height: 2000px;
    width:100%;
    font-size: 18px;
    font-family: 'Dosis', sans-serif;
	margin: 0 auto;
	overflow: hidden;
	padding: 0;
    text-align:justify;  }
	

@-webkit-keyframes moveleft {
  from { left: -100%;  }
  to { left: 100%;  }
}
.adran-dwyn { 
	background: url(images/thirdBG.jpg) no-repeat; 
	background-size: cover; 
	padding: 50px 0 100px; 
	overflow: hidden; }
	
.adran-dwyn .cynhwysydd { 
	position: relative;
	width: 100%; 
	overflow: hidden; 
	padding: 2% 3%; 
	box-sizing: border-box;	}
	
.adran-dwyn .cwmwl { 
	position: absolute; 
	background-attachment:fixed;
	left: -100%; 
	background: url(images/cwmwl.png); 
	display: block; 
	width: 3000px; 
	height: 400px; 
	top:0;
		-webkit-animation-name:             moveleft;
		-webkit-animation-duration:         100s;
		-webkit-animation-iteration-count:  infinite;
		-webkit-animation-timing-function: 	linear;
	z-index: 100;
}
.adran-dwyn h1 { font: 40px/40px 'Julius Sans One'; 
	color: #fff; 
	text-shadow:2px 2px 4px #000000; 
	text-align: left; 
	letter-spacing: 2px; }
	
.adran-dwyn h2 { font: 90px/90px 'Cinzel Decorative'; 
	color: #fff; 
	text-shadow:2px 2px 4px #000000; 
	text-align: left; 
	letter-spacing: 2px; 
	margin-top: 8%; }


#DNU .bg{
	background: url(images/trainers.png) 50% 0 no-repeat fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;
	height: 1300px;
	margin: 0 auto;
	padding: 0;
	position: absolute;
	width: 900px;
	z-index: 200;
}

#llyn{
	background: url(images/secondBG2.jpg) 50% 0 no-repeat fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;
	height: 100%;
    font-size:larger;
	padding: 25px 25px 0 0;
    color: rgba(0, 0, 0, .65);
    margin: 0 auto;
	overflow: hidden;
	padding: 0;	
    width:100%;
    
}

#gelert{
	background: url(images/gelert.jpg) 50% 0 no-repeat fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;
    background-size:cover;
	height: auto;
    width:100%;
    padding: 25px 25px 0 0;
}

#rhys{
	background: url(images/rhys.jpg) 50% 0 no-repeat fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;
	color: rgba(0, 0, 0, .65);
	height: 100%;
    width:100%;
    font-size: 18px;
    font-family: 'Dosis', sans-serif;
	margin: 0 auto;
	overflow: hidden;
	padding: 0;
    text-align:justify;
}

#troedyn{
  padding-top: 70px;
  padding-bottom: 20px;
  background-color: #093145;
	height: 100px;
    text-align:center;
    text-color:white;
    width:100%;
}

#naf {
	position:fixed; }

	width: 960px; 
	margin: 0 auto; }

.adran-llyn.cynhwysydd { 
width: 100%; 
overflow: hidden; 
padding: 2% 3%; 
box-sizing: border-box; 
}
.adran-llyn h2 { 
font: 90px/90px 'Cinzel Decorative'; 
color: #fff; 
text-shadow:2px 2px 4px #000000; 
text-align: center; 
letter-spacing: 2px; 
margin-top: 8%; 
}
.adran-llyn h1 { 
font: 40px/40px 'Julius Sans One'; 
color: #fff; 
text-shadow:2px 2px 4px #000000; 
text-align: center; 
letter-spacing: 2px; 
}
.adran-llyn p { 
font: 17px/30px 'Dosis', serif; 
color: #fff; 
text-align: center; 
letter-spacing: .05em; 
margin: 60px auto 60px auto; 
max-width: 600px; 
}


.adran-gelert.cynhwysydd { 
width: 100%; 
overflow: hidden; 
padding: 2% 3%; 
box-sizing: border-box; 
}
.adran-gelert h2 { 
font: 90px/90px 'Cinzel Decorative'; 
color: #fff; 
text-shadow:2px 2px 4px #000000; 
text-align: center; 
letter-spacing: 2px; 
margin-top: 8%; 
}
.adran-gelert h1 { 
font: 40px/40px 'Julius Sans One'; 
color: #fff; 
text-shadow:2px 2px 4px #000000; 
text-align: center; 
letter-spacing: 2px; 
}
.adran-gelert p { 
font: 17px/30px 'Dosis', serif; 
color: #fff; 
text-align: center; 
letter-spacing: .05em; 
margin: 60px auto 60px auto; 
max-width: 600px; 
}


.adran-rhys.cynhwysydd { 
width: 100%; 
overflow: hidden; 
padding: 2% 3%; 
box-sizing: border-box; 
}
.adran-rhys h2 { 
font: 90px/90px 'Cinzel Decorative'; 
color: #fff; 
text-shadow:2px 2px 4px #000000; 
text-align: center; 
letter-spacing: 2px; 
margin-top: 8%; 
}
.adran-rhys h1 { 
font: 40px/40px 'Julius Sans One'; 
color: #fff; 
text-shadow:2px 2px 4px #000000; 
text-align: center; 
letter-spacing: 2px; 
}
.adran-rhys p { 
font: 17px/30px 'Dosis', serif; 
color: #fff; 
text-align: center; 
letter-spacing: .05em; 
margin: 60px auto 60px auto; 
max-width: 600px; 
} 
	width: 960px; 
	margin: 0 auto; }

.adran-rhagym .cynhwysydd { width: 100%; overflow: hidden; }
.adran-rhagym h2 { font: 90px/90px 'Cinzel Decorative'; color: #b30000; text-align: center; margin-top: 1%; }
.adran-rhagym h1 { font: 40px/40px 'Raleway'; color: #fff; text-align: center; letter-spacing: 2px; }
.adran-rhagym p { font: 17px/30px 'Raleway', serif; color: #b30000 text-align: center; letter-spacing: .05em; max-width: 600px; }
.adran-rhagym a:link { font: 17px/30px 'Raleway', serif; color: #b30000 text-align: center; letter-spacing: .05em; max-width: 600px; }

.adran-teitl .cynhwysydd { width: 100%; overflow: hidden; box-sizing: border-box; }
.adran-teitl h2 { font: 90px/90px 'Cinzel Decorative'; color: #b30000; text-shadow:2px 2px 4px #000000; text-align: center; letter-spacing: 2px; margin-top: 2%; }
.adran-teitl h1 { font: 40px/40px 'Raleway'; color: #fff; text-align: center; letter-spacing: 2px; }
.adran-teitl p { font: 17px/30px 'Raleway', serif; color: #fff; text-align: center; letter-spacing: .05em; max-width: 600px; }

/*------------------------------------*\
	$IPHONE
\*------------------------------------*/
@media screen and (max-device-width: 480px){
    body{
        -webkit-text-size-adjust:none;
        padding:5px;}
		img{
        max-width:100%;
        height:auto;
    }
}

/* Navlist*/

.dropdown {
    position: relative;
    display: inline-block;
}
wl {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #333;
}

lli {
    float: left;
}

lli a, .dropbtn {
    display: inline-block;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}

lli a:hover, .dropdown:hover .dropbtn {
    background-color: red;
}

lli.dropdown {
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    
}

.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    text-align: left;
}

.dropdown-content a:hover {background-color: #f1f1f1}

.dropdown:hover .dropdown-content {
    display: block;
}