


/*  #Mobile (Portrait)
================================================== */

    /* Note: Design for a width of 320px */

    @media only screen and (max-width: 767px) {
        .container { width: 300px; }
        .container .columns,
        .container .column { margin: 0; }

        .container .one.column,
        .container .one.columns,
        .container .two.columns,
        .container .three.columns,
        .container .four.columns,
        .container .five.columns,
        .container .six.columns,
        .container .seven.columns,
        .container .eight.columns,
        .container .nine.columns,
        .container .ten.columns,
        .container .eleven.columns,
        .container .twelve.columns,
        .container .thirteen.columns,
        .container .fourteen.columns,
        .container .fifteen.columns,
        .container .sixteen.columns,
        .container .one-third.column,
        .container .two-thirds.column  { width: 300px; }

        /* Offsets */
        .container .offset-by-one,
        .container .offset-by-two,
        .container .offset-by-three,
        .container .offset-by-four,
        .container .offset-by-five,
        .container .offset-by-six,
        .container .offset-by-seven,
        .container .offset-by-eight,
        .container .offset-by-nine,
        .container .offset-by-ten,
        .container .offset-by-eleven,
        .container .offset-by-twelve,
        .container .offset-by-thirteen,
        .container .offset-by-fourteen,
        .container .offset-by-fifteen { padding-left: 0; }

    }


/* #Mobile (Landscape)
================================================== */

    /* Note: Design for a width of 480px */

    @media only screen and (min-width: 480px) and (max-width: 767px) {
        .container { width: 420px; padding:0 0.5em; }
        .container .columns,
        .container .column { margin: 0; }

        .container .one.column,
        .container .one.columns,
        .container .two.columns,
        .container .three.columns,
        .container .four.columns,
        .container .five.columns,
        .container .six.columns,
        .container .seven.columns,
        .container .eight.columns,
        .container .nine.columns,
        .container .ten.columns,
        .container .eleven.columns,
        .container .twelve.columns,
        .container .thirteen.columns,
        .container .fourteen.columns,
        .container .fifteen.columns,
        .container .sixteen.columns,
        .container .one-third.column,
        .container .two-thirds.column { width: 420px; }
		
		
		
		.link{
	
	
	 width:85%;
	 
}
		
    }
	
@media only screen and (max-width: 767px) {
	
	   
header h1,
.slogan {
	font-size: 0.85em;
}

#access ul#contrast-option {
	display: block;
	clear: both;
}

#access ul#contrast-option.right{
	float: none !important;
	
}

.searchbox,
.slogan {
	width: 100%;
}

.slogan.right{
	text-align: left;
}

.slogan{
	margin-top:6px;
}

#search{
	padding-top:5px;
}

.searchInput {
	
}	

.alignright{
	width:100%;
}

.social-sidebar {
	border-left: none;
	padding-left:0;
	box-sizing: border-box;
}

.white .link {
width: 87%;
}


a.widget, a.widget:visited {

height: 9.000em;

}

#cymraeg, a.widget.white, a.widget.white:visited {

height: 7em;
}

#breadcrumbs ul {

padding-left: 0.75em;
}


#breadcrumbs {
background: #2DA096
}

#breadcrumbs ul li {
	margin-right: 0em;
	
	background: url(../img/parts/breadcrumb-divider-mobile.png) right no-repeat;
	line-height: 30px;
	padding: 1.5em 1.5em 1.5em 0;
}

article.widget {
height: auto;
}
article.widget {

position: initial;

}
article.widget span.header,
article.widget span.link,
article.widget span.center {
position: initial;
}
article.widget .link {

width: 90%;

}

.option-select a{
	display: none;
}


@media only screen and (max-width: 635px) {

header h1 {
	padding: 1.28em 0;
}   

#contact-info p:first-child{
	margin-top:1em;
}

footer ul li{
	width:100%;
}


#breadcrumbs {
background: #2DA096
}

#breadcrumbs ul li {
	margin-right: 0em;
	
	background: url(../img/parts/breadcrumb-divider-mobile.png) right no-repeat;
	line-height: 30px;
	padding: 1.5em 1.5em 1.5em 0;
}
header h1 a, header h1 a:visited {
padding-left: 45%;
width: 43%;
}
	   }
	  


@media only screen and (max-width: 480px) {
	
	
.link{
	width:79%;
}		
		
.story-slider article h3 {
	
}

.story-slider article p {
	margin-top:0.6em;
	font-weight:100;
}

.story-slider .caption {

	top: 0px;
	left: 0px;
	width: 90%;
	height: 60px;
	padding: 5%;
}

#stories .link {
	position: absolute;
	bottom: 50px;
	left: 0px;
	width: 95%;
	padding-left: 5%;
	padding-top: 2px;
	padding-bottom: 5px;
}


.bx-wrapper {
	margin-bottom: 20px;
}

.bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto {
	bottom: 0px;

}


.white .link {
	width: 80%;
}

#options .columns {
height: auto;
width: 274px;
text-align:left;
}

#options .columns:hover,
#options .columns.active{
	background:#fff;
	
	
}


}
	
	
	 @media only screen and (max-width: 480px) {

#options .columns:hover, #options .columns.active, 
#options .columns.selected{
	background:#fff url(../img/parts/tick.png) 97% center no-repeat;
	
}


#options .columns.next,
#options .columns.next:hover {
background: #fff url(../img/parts/orange-arrow.png) 97% center no-repeat;
padding: 12px;
}



#search-block {
width: 280px;
}


#search-block .searchInput,#search-block input[type="text"] {
	width: 87.8%;
}
#search-block label {
font-size: 1.75em;
line-height:2em;
}


a.doc{
	background:#EBEFF0 url(../img/parts/doc-small.png) top right no-repeat;
}

a.pdf{
	background:#EBEFF0 url(../img/parts/pdf-small.png) top right no-repeat;
}


 }
 
 
 
 @media only screen and (min-width: 768px) and (max-width: 959px) {
	#header-right{
		 padding-left:10px;
		 padding-bottom:10px;
		 padding-right:10px;
	 
 }
 }