/*####################
##### HTML, BODY #####
#####################*/ 

*
{
    margin                  : 0px 0px 0px 0px;
    padding                 : 0px 0px 0px 0px;
    text-align              : left;
}
html
{
	font-family				: Arial, Helvetica, sans-serif;
	font-size				: 14px;
}

body 
{
	color					: #333333;
	background-color        : #CCC
	
}

/*###############
##### FONTS #####
###############*/

p
{
    margin                  : 0px 0px 0px 0px;
    padding                 : 5px 0px 5px 0px;
    line-height             : 1.4em;
}
h1
{
    margin                  : 0px 0px 0px 0px;
    padding                 : 5px 0px 5px 0px;
    font-size               : 20px;
    line-height             : 1.4em;
    color                   : #333333;
    font-weight             : bold;
}	
h1 a
{
    color                   : #666 !important;
    text-decoration         : none !important;
}
h1 a:hover
{
    color                   : #333 !important;
    text-decoration         : underline !important;
}

h2
{
    margin                  : 0px 0px 0px 0px;
    padding                 : 10px 0px 5px 0px;
    font-size               : 16px;
    line-height             : 1.4em;
    color                   : #333333;
    font-weight             : bold;
}	
h3
{
    margin                  : 0px 0px 0px 0px;
    padding                 : 5px 0px 5px 0px;
    font-size               : 16px;
    line-height             : 1.4em;
    color                   : #333333;
    font-weight             : bold;
}
.pageHeader
{
    padding                 : 10px 0px 10px 0px;
}

#content ul
{
    margin                  : 0px 0px 0px 0px;
	padding					: 5px 0px 5px 5px;
	list-style              : none;
	
}
#content ul li
{
    margin                  : 0px 0px 0px 0px;
	padding					: 0px 0px 15px 15px;
	line-height             : 1.2em;
	background				: url('../images/menu-bullet1.gif') top left no-repeat;
}
#content ul ul
{
    margin                  : 5px 0px 5px 5px;
	padding					: 5px 0px 0px 0px;
}
#content ul ul li
{
    margin                  : 0px 0px 0px 0px;
	padding					: 0px 0px 10px 15px;
	line-height             : 1.4em;
    background				: url('../images/menu-bullet2.gif') top left no-repeat;
}
#content ul li a:hover, #content ul ul li a:hover
{
    text-decoration         : underline;
}
#content a
{
    color                   : #998899;
    text-decoration         : underline;
    font-weight             : bold;
    
}
#content a:hover
{
    color                   : #664466;
    text-decoration         : underline;
}






/*###################
##### CONTAINER #####
###################*/
 
#container 
{
	margin                  : 0px auto 0px auto;
	width                   : 960px;
	display                 : block;
	background				: #FFF url('../images/bkgrnd-container.gif') top left no-repeat;	
}


/*################
##### HEADER #####
################*/ 

#header 
{
	height                  : 173px;
	display                 : block;
	width                   : 940px;
	margin                  : 0px auto 0px auto;
	padding					: 22px 0px 0px 0px;
	background				: url('../images/bkgrnd-header.gif') bottom left no-repeat;	
}

.headerLinksEnglish, .headerLinksCymraeg
{
	float					: left;
	margin					: 0px 0px 0px 10px;
}
.headerLinksEnglish a, .headerLinksCymraeg a
{
	margin					: 0px 5px 0px 0px;
	padding		 			: 0px 8px 0px 0px;
	border-right            : 1px solid #999;
	text-decoration         : none;
	font-size               : 11px;
	color                   : #999
}
.headerLinksEnglish a:hover, .headerLinksCymraeg a:hover
{
	text-decoration         : underline;
	color                   : #000
}


.headerLanguage
{
	float					: right;
	margin					: 0px 10px 0px 0px;
}
.headerLanguage a
{
	margin					: 0px 0px 0px 0px;
	padding		 			: 5px 0px 5px 0px;
	text-decoration         : none;
	font-size               : 11px;
	height                  : 30px;
	color                   : #999;
}
.headerLanguage a:hover
{
	text-decoration         : underline;
	color                   : #000
}

.logo
{
	margin                  : 20px 0px 9px 10px;
	padding                 : 0px 0px 0px 0px;
	clear                   : both;
	float					: left;
	display                 : block;
	width                   : 750px;
	height                  : 90px;
}




/*##################
#### NAVIGATION ####
##################*/ 

/* MAIN NAV */
ul#menuEnglish, ul#menuCymraeg
{
	position                : relative;	
    margin                  : 0; 
	padding                 : 0;
	float                   : left;
	width                   : 100%;
	list-style              : none;
	height                  : 32px;
	border-top				: 2px solid #FFF;
	border-bottom			: 2px solid #664466;	
    z-index					: 3000;
    background-color        : #FFF;
}
ul#menuEnglish li, ul#menuCymraeg li  
{
	float					: left;
	margin					: 0;
	padding					: 0;
	position				: relative;
}
ul#menuEnglish li a, ul#menuCymraeg li a  
{
	display					: inline-block;
	margin					: 0px 2px 0px 0px;
	padding					: 8px 5px 0px 5px;
	color					: #EEEEEE;
	float                   : left;
	text-decoration 		: none;
	font-size 				: 12px;
	height                  : 24px;
	text-align              : center;
	background-color        : #998899;
	outline					: none;
}
ul#menuCymraeg li a  
{
	padding					: 8px 8px 0px 8px;
}


ul#menuEnglish li:hover a, 
ul#menuEnglish li a:hover, 
ul#menuCymraeg li:hover a, 
ul#menuCymraeg li a:hover 
{ 
	text-decoration 		: none;
	color					: #333;
	background-color    	: #D9D0D9;
	float                   : left;
	height                  : 26px;
	margin					: 0px 2px 0px 0px;
	padding					: 6px 3px 0px 3px;
	border					: 2px solid #664466;
	border-bottom			: 2px solid #EBDDF0;
}
ul#menuCymraeg li:hover a, 
ul#menuCymraeg li a:hover 
{ 
	padding					: 6px 6px 0px 6px;
}


ul#menuEnglish a.normal:hover, 
ul#menuCymraeg a.normal:hover
{
	text-decoration 		: none;
	color					: #333;
	background-color    	: #D9D0D9;
	float                   : left;
	height                  : 24px;
	margin					: 0px 2px 0px 0px;
	padding					: 6px 3px 0px 3px;
	border					: 2px solid #664466;
	border-bottom           : none;
}
ul#menuCymraeg a.normal:hover
{
	padding					: 6px 6px 0px 6px;
}


ul#menuEnglish li a.home 
{
	padding					: 8px 7px 0px 7px;
}

ul#menuEnglish li:hover a.home
{
	padding					: 8px 5px 0px 5px;
}
ul#menuCymraeg li:hover a.home
{
	padding					: 8px 6px 0px 6px;
}



ul#menuEnglish a.end
{
	margin					: 0px 0px 0px 0px;
	padding					: 8px 6px 0px 6px;
}
ul#menuCymraeg a.end
{
	margin					: 0px 0px 0px 0px;
	padding					: 8px 8px 0px 8px;
}
ul#menuEnglish a.end:hover, 
ul#menuCymraeg a.end:hover
{
	text-decoration 		: none;
	color					: #333;
	background-color    	: #D9D0D9;
	float                   : left;
	height                  : 24px;
	margin					: 0px 0px 0px 0px;
	padding					: 6px 4px 0px 4px;
	border					: 2px solid #664466;
	border-bottom           : none;
}
ul#menuCymraeg a.end:hover
{
	padding					: 6px 6px 0px 6px;
}









/* ---- MAIN SUB NAV CONTENT ---- */
ul#menuEnglish li .sub, 
ul#menuCymraeg li .sub 
{
	position                : absolute;	
	top                     : 34px; 
	left                    : 0px;
	background-color        : #D9D0D9;
	padding                 : 10px 5px 10px 5px;
	float                   : left;
	width                   : 926px !important;
	display                 : none;
	border                  : 2px solid #664466;
	border-top              : none;
    z-index					: 1000;
    /*--Bottom right rounded corner--*/
	-moz-border-radius-bottomright: 5px;
	-khtml-border-radius-bottomright: 5px;
	-webkit-border-bottom-right-radius: 5px;
	/*--Bottom left rounded corner--*/
	-moz-border-radius-bottomleft: 5px;
	-khtml-border-radius-bottomleft: 5px;
	-webkit-border-bottom-left-radius: 5px;
}



.column
{
    width                   : 279px;
    float                   : left;
    margin                  : 0px 5px 0px 5px;
    padding                 : 8px 8px 8px 8px;
    background-color        : #CEC8CE;   
    line-height             : 1.2em;
    text-decoration         : none;
    color                   : #333;
    z-index					: 1001;
    
}
.column span
{
    padding                 : 0px 0px 0px 5px !important;
}
.column ul, .column ul ul
{
    margin                  : 0px 0px 0px 0px;
    padding                 : 0px 0px 0px 0px;
    list-style-type         : none;
}
.column ul ul
{
    margin                  : 0px 0px 0px 5px !important;
}
.column ul li, .column ul ul li
{
    background				: none; 
    display                 : block;
    margin                  : 0px 0px 0px 0px !important;
    padding                 : 0px 0px 0px 5px !important;
    float                   : none !important;
    font-weight             : bold;
    border                  : none;
    font-size               : 11px !important;
    background				: url('../images/top-menu-bullet1.gif') top left no-repeat transparent;
}
.column ul ul li
{ 
    font-weight             : normal !important;

    background				: url('../images/top-menu-bullet2.gif') top left no-repeat transparent;
}

.column ul li a
{
    margin                  : 0px 0px 0px 0px !important;
    padding                 : 0px 0px 6px 5px !important;
    border                  : none !important;
    float                   : none !important;
    height                  : auto !important;
    font-size               : 11px !important;
    background-color     	: transparent !important;
    color                   : #333 !important;
    text-align              : left !important;
}
.column ul ul li a
{
    font-size               : 11px !important;
    color                   : #333 !important;
    text-align              : left !important;
}
.column ul li a:hover, .column ul ul li a:hover
{
    text-decoration         : underline !important;
}





/*#################
##### CONTENT #####
#################*/

#content 
{
	margin                  : 0px auto 0px auto;
	padding                 : 10px 0px 20px 0px;
	display                 : block;
	width                   : 940px;
	min-height              : 350px;
}

.imgHome{
	margin                  : 0px 0px 10px 0px;
	padding                 : 0px 0px 0px 0px;
	float                   : left;
}



/*################
##### FOOTER #####
################*/ 

#footer 
{
	margin		 			: 0px 0px 0px 0px;
	padding                 : 142px 30px 0px 30px;
	width                   : 900px;
	height                  : 110px;
	font-size               : 11px;
	position                : relative;
	background				: url('../images/bkgrnd-footer.jpg') bottom left no-repeat;
}

#footerContact
{
	margin		 			: 144px 0px 0px 30px;
	padding                 : 0px 0px 0px 0px;
	position                : absolute;
	top                     : 0;
	left                    : 0;
	color					: #FFFFFF;
}
#footerLinksEnglish, #footerLinksCymraeg
{
	margin		 			: 144px 30px 0px 0px;
	padding                 : 0px 0px 0px 0px;
	position                : absolute;
	top                     : 0;
	right                   : 0;
	color					: #FFFFFF;
}
#footerContact a, #footerLinksEnglish a, #footerLinksCymraeg a
{
	text-decoration			: none;
	color					: #FFFFFF;
}
#footerContact a:hover, #footerLinksEnglish a:hover, #footerLinksCymraeg a:hover
{
	color					: #FFFFFF;
	text-decoration			: underline !important;
}


.stcInfoEnglish, .stcInfoCymraeg
{
    margin					: 20px 0px 0px 0px;
    width                   : 360px;
	padding		 			: 10px 0px 10px 180px;
	color                   : #666;
	float                   : left;
	background				: url('../images/stcLogo.gif') center left no-repeat;
}
.stcInfoCymraeg
{
	background				: url('../images/stcLogo.gif') center left no-repeat;
}

.dvInfo
{
	color                   : #666;
	text-align              : right;
	
	margin		 			: 188px 30px 0px 0px;
	padding                 : 0px 0px 0px 0px;
	position                : absolute;
	top                     : 0;
	right                   : 0;
}
.dvInfo a
{
	text-decoration         : none;
	color                   : #333 !important;
}
.dvInfo a:hover
{
    text-decoration         : underline;
	color                   : #000 !important;
}











/*#################
##### TEASERS #####
#################*/ 

#teaserHolder
{
	margin					: 0px 0px 0px 0px;
	padding		 			: 0px 0px 0px 0px;
	display                 : block;
	float                   : right;
	width                   : 240px;
	height                  : auto;
}

.teaser1English, .teaser2English, .teaser1Cymraeg, .teaser2Cymraeg
{
	margin					: 0px 0px 0px 0px;
	padding		 			: 40px 70px 0px 15px;
	width                   : 155px;
	height                  : 110px;
	display                 : block;
	background				: url('../images/teaser1.gif') no-repeat center top;
	text-decoration         : none;
	color                   : #FFF;
	font-size               : 12px;
}
.teaser2English
{
	background				: url('../images/teaser2.gif') no-repeat center top;
}
.teaser1Cymraeg
{
	background				: url('../images/teaser1-w.gif') no-repeat center top;
}
.teaser2Cymraeg
{
	background				: url('../images/teaser2-w.gif') no-repeat center top;
}

.teaser1English a, .teaser2English a, .teaser1Cymraeg a, .teaser2Cymraeg a
{
	margin					: 0px 0px 0px 0px;
	padding		 			: 0px 0px 0px 20px;
	background				: url('../images/arrowBtn1.gif') no-repeat top left;
	text-decoration         : none !important;
	display                 : block;
	color                   : #FFF !important;
	font-size               : 12px;
}
.teaser2English a
{
	background				: url('../images/arrowBtn2.gif') no-repeat top left;
}
.teaser2Cymraeg a
{
	background				: url('../images/arrowBtn2.gif') no-repeat top left;
}


.teaser1English a:hover, .teaser2English a:hover, .teaser1Cymraeg a:hover, .teaser2Cymraeg a:hover
{
	background				: url('../images/arrowBtn1.gif') no-repeat bottom left;
	text-decoration         : underline !important;
	color                   : #FFF !important;
}
.teaser2English a:hover
{
	background				: url('../images/arrowBtn2.gif') no-repeat bottom left;
}
.teaser2Cymraeg a:hover
{
	background				: url('../images/arrowBtn2.gif') no-repeat bottom left;
}


/*################
##### TABLES #####
################*/ 

.tbl, .tblNoBorder, .tblLibrary
{
	margin					: 20px 0px 20px 0px;
	padding		 			: 0px 0px 0px 0px;
	width                   : 100%;
	font-size               : 14px;
	border                  : 1px solid #CCC;
	border-right            : none;
	border-bottom           : none;
}
.tblNoBorder
{
	margin					: 20px 0px 20px 0px;
	padding		 			: 0px 0px 0px 0px;
	width                   : 100%;
	font-size               : 14px;
	border                  : none;
}
.tblLibrary
{
	border                  : 1px solid #CCC;
    border-right            : none;
	border-bottom           : none;
    background-color        : #EEE
}
.tbl td, .tblNoBorder td, .tblLibrary td
{
	padding		 			: 5px 5px 5px 5px;
	height                  : 25px;
	vertical-align          : top;
	border-right            : 1px solid #CCC;
	border-bottom           : 1px solid #CCC
}
.tblNoBorder td
{
	padding		 			: 5px 5px 5px 5px;
	height                  : 25px;
	vertical-align          : top;
	border                  : none;
}
.tbl th, .tblLibrary th
{
	padding		 			: 10px 5px 10px 5px;
	background-color        : #EEE;
	vertical-align          : middle;
	border-right            : 1px solid #CCC;
	border-bottom           : 1px solid #CCC
}
.tblLibrary th
{
	background-color        : #DEDEDE;
    padding		 			: 5px 5px 5px 5px;
}


.tbl td.header, .tbl td.headerCenter
{
	padding		 			: 10px 5px 10px 5px;
	background-color        : #EEE;
	vertical-align          : middle;
}
.tbl td.headerCenter
{
	text-align              : center;
}
.tbl td.center
{
	text-align              : center;
}

.tbl a
{
    color                   : #998899;
    text-decoration         : underline;
    font-weight             : bold;
    
}
.tbl a:hover
{
    color                   : #664466;
    text-decoration         : underline;
}





.searchContainer
{
	margin					: 20px 0px 20px 0px;
	padding		 			: 0px 0px 0px 0px;
	width                   : 630px;
	height                  : auto;
	border                  : 1px solid #AAA;
	background-color        : #CCC;
	-moz-border-radius      : 10px;
    -webkit-border-radius   : 10px;
}


.tblSearch
{
	margin					: 20px 20px 20px 20px;
	padding		 			: 0px 0px 0px 0px;
	width                   : 100%;
	font-size               : 14px;
	border-right            : none;
	border-bottom           : none;
	
}
.tblSearch td
{
	padding		 			: 5px 0px 5px 0px;
	height                  : 25px;
	vertical-align          : top;
	
}
.tblSearch td
{
	padding		 			: 5px 5px 5px 5px;
	height                  : 25px;
}
.tblSearch td.validation
{
	font-size               : 12px;
	line-height             : 1.6em;
	
}
.tblSearch td.validation img
{
	float                   : left;
	
}



/*###############################
##### FORM FIELDS & BUTTONS #####
###############################*/ 


/* FORM FIELDS */
.textField, .textFieldLong
{
    margin                  : 0px 0px 5px 0px;
    padding                 : 3px 5px 3px 5px;
    width                   : 200px;
    height                  : 17px;
    font-size               : 12px;
    border                  : 1px solid #AAA;
}
.textFieldLong
{
    width                   : 590px;
}
.textArea, .textAreaLong
{
    margin                  : 0px 0px 5px 0px;
    padding                 : 5px 5px 5px 5px;
    width                   : 200px;
    height                  : 80px;
    font-size               : 12px;
    font-family             : Arial, Helvetica, sans-serif;
    border                  : 1px solid #AAA;
}
.textAreaLong
{
    width                   : 590px;
}
.ddField
{
    margin                  : 5px 0px 5px 0px;
    padding                 : 2px 2px 2px 2px;
    width                   : 212px;
    height                  : 25px;
    font-size               : 12px;
    border                  : 1px solid #AAA;
}


/* BACK BUTTON */
.btnBack a
{
    margin                  : 0px 0px 0px 0px;
    padding                 : 5px 10px 5px 10px;
    font-size               : 11px;
    color                   : #777 !important;
    float                   : right;
    border                  : 1px solid #CCC;
    background-color        : #DDD;
    display                 : block;
    text-decoration         : none !important;
}
.btnBack a:hover
{
    text-decoration         : none;
    background-color        : #777;
    color                   : #FFF !important;
    border                  : 1px solid #333;
}


/* INPUT BUTTONS */
button, input[type="reset"], input[type="button"], input[type="submit"]
{
    margin                  : 20px 0px 20px 0px;
    padding                 : 5px 10px 5px 10px;
    font-size               : 14px;
    color                   : #777 !important;
    border                  : 1px solid #BBB;
    background-color        : #CCC;
    text-decoration         : none !important;
    cursor                  : pointer;
    text-transform          : uppercase;
}
button:hover, input[type="reset"]:hover, input[type="button"]:hover, input[type="submit"]:hover 
{
    text-decoration         : none;
    background-color        : #777;
    color                   : #FFF !important;
    border                  : 1px solid #333;
}


button.btnSearch, input[type="reset"].btnSearch, input[type="button"].btnSearch, input[type="submit"].btnSearch,
button.btnSearchCym, input[type="reset"].btnSearchCym, input[type="button"].btnSearchCym, input[type="submit"].btnSearchCym
{
    margin                  : 5px 5px 0px 0px;
    padding                 : 0px 0px 0px 0px;
    width                   : 88px;
    height                  : 30px;
    display                 : block;
    float                   : right;
    border                  : none;
    background				: url('../images/btnSearch.jpg') no-repeat left top;
    cursor                  : pointer;
    text-decoration         : none;
    
}
button.btnSearchCym, input[type="reset"].btnSearchCym, input[type="button"].btnSearchCym, input[type="submit"].btnSearchCym
{
    background				: url('../images/btnSearch-w.jpg') no-repeat left top;    
}

button.btnSearch:hover, input[type="reset"].btnSearch:hover, input[type="button"].btnSearch:hover, input[type="submit"].btnSearch:hover 
{
    background				: url('../images/btnSearch.jpg') no-repeat left bottom;
    border                  : none !important;
}
button.btnSearchCym:hover, input[type="reset"].btnSearchCym:hover, input[type="button"].btnSearchCym:hover, input[type="submit"].btnSearchCym:hover 
{
    background				: url('../images/btnSearch-w.jpg') no-repeat left bottom;
    border                  : none !important;
}



/*###############
##### MISC. #####
###############*/ 


.imgRight
{
    margin                  : 0px 0px 20px 20px;
    padding                 : 0px 0px 0px 0px;
    float                   : right;
    border                  : none;
}

.contactWrapper
{
    margin                  : 0px 0px 0px 0px;
    padding                 : 0px 5px 5px 5px;
    float                   : right;
    border                  : 1px solid #CCC;
    background-color        : #EFEFEF
}

/* Brochure Download Link */
.brochureDownload a
{
    margin                  : 0px 0px 10px 0px;
    padding                 : 5px 5px 5px 58px;
    border                  : 1px solid #777;
    width                   : 200px;
    font-size               : 13px;
    color                   : #333 !important;
    text-decoration         : none !important;
    background              : #FFF url('../images/pdf.gif') no-repeat left center;
}
.brochureDownload a:hover
{
    border                  : 1px solid #333;
    background              : #999 url('../images/pdf.gif') no-repeat left center;
    color                   : #FFF !important;
}
.newsDate
{
    margin                  : 0px 0px 5px 0px;
    padding                 : 0px 0px 0px 0px;
    color                   : #888;
    font-style              : italic;
    
}
.newsBreak
{
    margin                  : 20px 0px 20px 0px;
    padding                 : 0px 0px 0px 0px;
    border-bottom           : 1px solid #BBB
}


/* VIEW PRACTICES PAGE */
.practicesLight, .practicesDark
{
    margin                  : 0px 0px 5px 0px;
    padding                 : 5px 10px 5px 10px;
    border                  : 1px solid #CCC;
    background-color        : #EEE;
}
.practicesDark
{
    background-color        : #DEDEDE;
}
.practicesLight h2, .practicesDark h2
{
    margin                  : 0px 0px 0px 0px;
    padding                 : 0px 0px 5px 0px;
    line-height             : 1.2em !important;
}
.practicesLight em, .practicesDark em
{
    margin                  : 0px 0px 0px 0px;
    padding                 : 0px 0px 0px 0px;
    font-size               : 12px;
    color                   : #333;
    font-weight             : normal;
}
.practicesLight p, .practicesDark p
{
    margin                  : 0px 0px 0px 0px;
    padding                 : 0px 0px 5px 0px;
}