@charset "UTF-8";
/* CSS Document */

	.viewpoint1{
    height:auto;
    padding:20px;
    margin-top:0px;
	width:940px;
	margin-left:auto;
	margin-right:auto;
	overflow:visible;
}
 
.show_hide1 {
    display:none;
}
		@font-face {
    font-family: 'mainFont';
    src: url('ysg1__-webfont.eot');
    src: url('ysg1__-webfont.eot?#iefix') format('embedded-opentype'),
url('ysg1__-webfont.woff') format('woff'),
url('ysg1__-webfont.ttf') format('truetype'),
url('ysg1__-webfont.svg#Ysgol1Regular') format('svg');
}
		body{background:url(../images/cantre-gwaelodbg.jpg);font-family:mainFont; background-position:top center; background-repeat: no-repeat; background-color: #000000 !important;  margin: 50px; margin-top:0px;}


			/*demo page css*/
			
			
			#dialog_link {padding: .4em 1em .4em 20px;text-decoration: none;position: relative;}
			#dialog_link span.ui-icon {margin: 0 5px 0 0;position: absolute;left: .2em;top: 50%;margin-top: -8px; z-index:4}
			
			#dialog2 {padding: .4em 1em .4em 20px;text-decoration: none;position: relative;}
			#dialog2 span.ui-icon {margin: 0 5px 0 0;position: absolute;left: .2em;top: 50%;margin-top: -8px;}
			
			#options3 {padding: .4em 1em .4em 20px;text-decoration: none;position: relative;}
			#options3 span.ui-icon {margin: 0 5px 0 0;position: absolute;left: .2em;top: 50%;margin-top: -8px;}
			
			#options4 {padding: .4em 1em .4em 20px;text-decoration: none;position: relative;}
			#options4 span.ui-icon {margin: 0 5px 0 0;position: absolute;left: .2em;top: 50%;margin-top: -8px;}
			
			#options5 {padding: .4em 1em .4em 20px;text-decoration: none;position: relative;}
			#options5 span.ui-icon {margin: 0 5px 0 0;position: absolute;left: .2em;top: 50%;margin-top: -8px;}
			
			#options6 {padding: .4em 1em .4em 20px;text-decoration: none;position: relative;}
			#options6 span.ui-icon {margin: 0 5px 0 0;position: absolute;left: .2em;top: 50%;margin-top: -8px;}
			
			/* This is the moving lens square underneath the mouse pointer. */
.cloud-zoom-lens {
	border: 4px solid #888;
	margin:-4px;	/* Set this to minus the border thickness. */
	background-color:#fff;	
	cursor:move;		
}


/* This is the zoom window. */
.cloud-zoom-big {
	border:4px solid #ccc;
	overflow:hidden;
}
h1{font-family: mainFont;color:#900; font-size:30px;}

h2{font-family: mainFont;color:#FFF; font-size:20px;}

p{font-family: mainFont;color:#FFF; font-size:23px;}

#dialog, #option2, #option2, #option3, #option4, #option5, #option6, p {font-size:16px; color:#000; font-family:mainFont;}

textarea {font-family:Arial, Helvetica, sans-serif; font-size:25px !important; color:#006600; resize:none; width:380px !important}

#dockContainer { position:absolute; top: 150px; left: -80px; font-family:mainFont; }
#jqDock { position: relative; bottom: 48px;font-family:mainFont; }
.jqDockLabel { background: #333; color: #fff; padding: 3px 10px !important; -webkit-border-radius: 10px; -moz-border-radius: 10px; font-family:mainFont;}
ul,ol,li { list-style:none !important; }


.advantagedisadvantage h2 {text-align:center; width:800px; font-size:22px; margin-left:auto; margin-right:auto;}
.advantagedisadvantage p {text-align:left; width:880px; font-size:19px; margin-left:auto; margin-right:auto;}


.advantagedisadvantage {width:930px; height:440px; margin-left:auto; margin-right:auto; padding:10px; margin-top:-20px; background-image:url(../activity/images/advantagesDisadvantagesBg.jpg); background-repeat:no-repeat; border-radius:10px; border:solid 3px #000}

.openButton{width:185px; height:auto; display:block; margin-top:15px; padding:10px; border-radius:10px; margin-left:auto; margin-right:auto;}
.closeButton{width:170px; height:auto; display:block; margin-top:10px; padding:10px; border-radius:10px; text-align:center; margin-left:auto; margin-right:auto; cursor:pointer !important}


.innerBoxes h2 {text-align:left; color:#990000; font-size:20px !important; }
.innerBoxes {width:400px; margin-left:auto; margin-right:auto; display:inline-block; border:solid 3px #DDD; margin-left:20px; background-color:#FFF; padding:10px;}


.paragraph {width:99%; opacity:1; padding:5px; margin-bottom:-10px; background-color:#FFF;margin-left:auto; margin-right:auto; padding-bottom:0px; margin-top:10px; background-image:url(../activity/images/activityFourOneParagraph.jpg); border-top-left-radius:150px; border-top-right-radius:150px;}
.paragraph h1 {text-align:center; text-shadow:2px 2px #000; color:#900;}
.paragraph h2 {text-align:center; text-shadow:2px 1px #FFF; color:#900;}
.paragraph p {text-align:center; text-shadow:1px 1px #FFF; font-weight:bold;}

.zoomStyle{position:relative; width:1090px; margin-left:auto; margin-right:auto; margin-bottom:15px; border:solid 5px #000;}

#NextSection h1{font-size:16px !important; line-height:51px !important; margin-left:-8px; margin-top:4px;}
#NextSection a {color:#000; text-decoration:none;}
#NextSection:hover {opacity:0.8; color:#900 !important;}
#NextSection{margin-top:-35px; padding:14px;  position:absolute; top:15px; right:-80px;  background-image:; background-repeat:no-repeat; width:113px; height:80px}


#BackSection h1 {font-size:20px !important; line-height:21px !important; margin-left:10px; margin-top:10px}
#BackSection a {color:#000; text-decoration:none;}
#BackSection:hover {opacity:0.8; color:#900 !important;}
#BackSection{margin-top:-35px; padding:15px;  position:absolute; top:15px; left:-100px; background-image:; background-repeat:no-repeat; width:145px; height:61px}