body{margin:0;padding:0;background:#f8f8f8;color:#777;font-family:'Crimson Text',serif;font-size:16px;line-height:1.375;
transition:background-color .4s linear;
text-size-adjust:none;
-webkit-text-size-adjust:none}
body.agored{background-color:#e8e8e8}

.pennyn{margin:0 12%}
.cynnwys{margin-bottom:4em}

.eicon{font-size:1.25rem;line-height:1;width:1em;padding:.375rem;box-sizing:content-box;border-radius:2em;border:none;outline:none;display:inline-block;margin:0 0 0 .375rem;;color:#f8f8f8;background:rgba(0,0,0,.3);cursor:pointer}
.eicon:first-of-type{margin:0}
.eicon svg{display:block;fill:currentColor}
.eicon.analluogwyd,.eicon.slick-disabled{opacity:.3}
.celfi{transition:opacity .4s linear}
/* .cysgu .chwyddwyd:not(.agored) .celfi{opacity:0} */
.cysgu .chwyddwyd .celfi{opacity:0}

.agored .togl{transform:rotate(-90deg);background:rgba(0,0,0,0)}
.chwyddwyd .togl{color:#f8f8f8;background:rgba(0,0,0,.3)}

.dewislen{position:relative;top:0;left:0;width:100%;height:6em;z-index:20;zbackground:#f8f8f8}
.enw-safle{padding:3rem 12% 1.5em 12%;margin:0;white-space:nowrap;font-family:'Roboto',sans-serif;font-weight:300;line-height:1}
.togl{position:absolute;top:2.51rem;right:12vw;transition:color .4s linear,background .4s linear,transform:all .4s linear;color:inherit;background:rgba(0,0,0,0)}

.rhestr{opacity:0;transition:opacity .4s linear;box-sizing:border-box;width:100%;min-height:100vh;
overflow-x:hidden;z-index:10;padding:6em 0;display:none}

.agored .rhestr{opacity:1;display:block}
article{opacity:1;transition:opacity .4s linear}
.agored article{opacity:0;visibility:hidden;height:0;overflow:hidden;position:fixed}

.clawr{position:fixed;bottom:0;left:0;right:0;box-sizing:border-box;z-index:10;padding:4em 0}

.eitem{display:block;color:#999;padding-left:12%;padding-right:12%;padding-top:3rem;box-sizing:border-box;display:inline-block;vertical-align:top}
.eitem:hover{zzcolor:#777}
.eitem h1{margin:0}
.awdur{font-family:'Roboto',sans-serif;margin:1em 0 2em}
cite{white-space:nowrap;font-style:normal}
#hafan .awdur{margin-bottom:0}
.eitem-gwybodaeth .awdur{margin:0}
.eitem-gwybodaeth{display:block}
.erthygl.gwybodaeth{padding-top:6em}

.haenen{opacity:0;visibility:hidden;background:#e8e8e8;position:fixed;top:0;left:0;right:0;bottom:0;box-sizing:border-box;min-height:100vh;overflow-y:auto;z-index:9;transition:opacity .4s linear,visibility .4s linear}
.chwyddwyd #chwyddo{opacity:1;visibility:visible;z-index:9;transition:opacity .4s linear,visibility 0s linear}
.chwyddwyd .eicon{}
#hafan{opacity:1;visibility:visible}
.agored #hafan{opacity:0;visibility:hidden;height:0;overflow:hidden;position:fixed}

.haenen .ffram{background:no-repeat center;width:100%;height:100%;position:absolute}
.haenen img{width:100%;height:100%;object-fit:cover}
.chwyddo-eicons{position:absolute;top:3.5rem;right:3.5rem;z-index:2}

.llywio{list-style:none;margin:0 0 1em;padding:0}
.label,.llywio-taith{font-family:'Roboto',sans-serif;font-weight:300}
.llywio-taith ul,.llywio-taith p{font-family:'Crimson Text',serif;font-style:italic}

h1{font-family:'Cormorant Garamond',serif;font-size:2.75em;line-height:1;font-weight:normal;margin:0 0 1rem}
h1 span{display:block}
h2{margin:0 0 1rem;font-size:1.125em;line-height:1.222;font-weight:bold}
h3{font-size:.875em;line-height:1.571;margin:25vh 0 3rem 0;font-family:'Roboto',sans-serif;font-weight:300}
.rhestr h3{margin-top:0;margin-bottom:1rem}
h4{font-size:1.125em;line-height:1.222;font-weight:normal;margin:0 0 3rem;width:60%}
p{margin:0 0 1em}
section{padding:0 12%;margin:4rem 0 0}
section.lluniau{padding-left:0;padding-right:0}
hr{visibility:hidden}

.mewnoli{}

a{text-decoration:none;color:inherit}
.dolenni a:link,.dolenni a:visited{border-bottom:1px dotted;border-color:#c8c8c8}
.dolenni a:hover,.dolenni a:active{border-bottom:1px dotted;border-color:inherit}
.logo{display:block;margin-bottom:1em}
.logo img{max-width:150px;width:100%;height:auto}
h1 a{ztext-shadow:.05em .05em .1em rgba(0,0,0,0);ztransition:text-shadow .2s linear}
h1 a:hover,h1 a:active{border-bottom:none;ztext-shadow:.05em .05em .1em rgba(0,0,0,0.3)}

.zzllun img{width:100%;height:auto;display:block}
.llun img{width:auto;height:60vw;display:block}

.sain,.lluniau{zzmargin-top:4rem}

#chwaraeydd{font-family:'Roboto',sans-serif;font-style:normal;font-size:.875rem;margin:0 0 0 -0.25rem}
#chwaraeydd>*{display:inline-block;vertical-align:middle}
#chwaraeydd .eicon{padding:0;width:1.5rem;height:1.5rem;color:#777;background:none;display:inline-block;vertical-align:middle}
#chwarae,#aros{transition:opacity .2s linear}
#chwarae{opacity:.4}
#aros{opacity:0}
.yn-barod #chwarae{opacity:1}
.yn-chwarae #chwarae{opacity:0}
.yn-chwarae #aros{opacity:1}
.yn-aros #chwarae{opacity:1}
.yn-aros #aros{opacity:0}
.yn-llwytho #cynnydd{stroke:#ddd}
.yn-chwarae #cynnydd{stroke:#bbb}
#sain-cynnydd{width:100px;height:2px;display:inline-block;vertical-align:middle;background:#eee}

.zzslick-list{padding: 0px 7%}
.slick-slider p{margin:0}
.slick-slider a{display:block;padding:0 .5em}
.slick-slider .celfi
{
	opacity:0;
    position: absolute;
    top: 50%;
    display: block;
    z-index:1;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
}
.slick-slider:hover .celfi{opacity:1}
.slick-prev{left:7%}
.slick-next{right:7%}
.slick-slider:hover .slick-disabled{opacity:.3}

@media only screen and (min-width:1024px) {

	.pennyn{box-sizing:border-box;position:fixed;top:0;left:12%;width:35%;height:100%;margin:0;padding:4em 0 4em;overflow-y:auto;display:flex;flex-direction:column}
	.llywio-taith{width:60%}
	#chwaraeydd{margin-top:auto}
	.cynnwys{box-sizing:border-box;width:50%;margin-left:50%}
	.eitem{width:28%;padding-left:7%;padding-right:0;padding-top:0;display:inline-block}
	.eitem:nth-child(3n+1){padding-left:14%;width:35%}

	.eitem-gwybodaeth{position:absolute!important;bottom:4em;
	display:block;
	padding-left: 14%;width:100%;
	}

	.dewislen{position:fixed;top:0;left:0;bottom:0;width:5%;height:100%;min-width:2em;zbackground:#eee}
	.enw-safle{position:absolute;transform:rotate(-90deg);transform-origin:bottom left;ztop:86%;bottom:4em;left:100%;padding:0}
	.togl{top:3.5rem;right:-.5rem}

	h1{font-size:3.4375em;margin-right:1rem}
	section{padding:0 20%;margin:11rem 0 0}
	section.lluniau{padding-left:0}

	.logo{display:inline-block;max-width:30%;margin-right:1%;vertical-align:middle}
	.logo img{width:100%;max-width:none;height:auto}
	.erthygl.gwybodaeth{padding-top:0}
	h3{margin-top:0;margin-bottom:4em}
	.rhestr h3{margin-bottom:3rem}

	.llun img{height:23vw} /* tua 35% lled i lun 3:2 */
	.slick-prev{left:5%}
	.slick-next{right:5%}

/* 
	.lluniau{overflow:scroll;white-space:nowrap;font-size:1px}
	.lluniau p{display:inline-block;font-size:1rem;margin-right:1rem;width:86%;box-sizing:content-box}
 */

}

@media only screen and (min-width:2048px) {
	.pennyn{left:11%;width:22%}
	body{font-size:18px}
	.cynnwys{margin-left:33%;width:67%}
	section{padding:0 16.4%}
}


@keyframes fadeIn { from {opacity:0;left:200px} to {opacity:1;left:0} }
@keyframes fadeOut { from {top:0} to {top:200px} }
.ffed {opacity:1;position:relative;animation:fadeOut ease-out 1;animation-fill-mode:forwards;animation-duration:400ms}
.agored .ffed {opacity:0;position:relative;animation:fadeIn ease-out 1;animation-fill-mode:forwards;animation-duration:400ms}
.agored .ffed:nth-child(2){animation-delay:100ms}
.agored .ffed:nth-child(3){animation-delay:200ms}
.agored .ffed:nth-child(4){animation-delay:300ms}
.agored .ffed:nth-child(5){animation-delay:400ms}
.agored .ffed:nth-child(6){animation-delay:500ms}