/**People**/

.personDiv {
    text-align: center;
    height: 16em;
}
.personDiv:hover .cglink {
    text-decoration: underline;
}

.cgpersonlink {
    text-decoration: none;
}

.cglink {
    color: #2484c6;
    margin-bottom: 0;
}

.cgTitle {
    margin-top: 0.25em;
    text-decoration: none;
    color: #7c858e;
	font-size: 0.9em;}


/*startAConvo*/
.personName{
font-size:2em;
}

/*Navigation Boxes*/
.navBox{
	background-color:#f2f2f2;
	margin-top:1em;
}
.navBox:hover.onHoverthemeBlue {
    background-color:#2484c6;
    color:white;
}

.navBox:hover.onHoverthemeGreen {
    background-color:#00b259;
        color:white;
}

.navBox:hover.onHoverthemeYellow {
    background-color:#ffcb05;
        color:#333333
}

.navBox:hover.onHoverthemePurple {
    background-color:#8f53a1;
        color:white;
}
.navBox p{
color:inherit;
	padding:0 0.5em;
}

.navBox .navTitle{
	font-weight:500;
}

.navBoxLink{
	color:inherit;
	text-decoration:none;
}
.navBoxLink:link{
	color:inherit;
	text-decoration:none;
}
.navBoxLink:hover{
	color:inherit;
	text-decoration:none;
}
.navBoxLink:active{
	color:inherit;
	text-decoration:none;
}
.navTitle{	
	font-weight: 500;
    margin-top: 0.5em;
    margin-bottom: 0.5em;

}

/*Events*/


.filterTitle {
    color: #2484c6;
    font-weight: 600;
    margin-bottom: 0.5em;
}

.eventsFilter {
    list-style: none;
    margin: 0;
    padding: 0;
}
.eventsFilter li {
    margin-bottom: 2px;
    padding: 0.25em;
}

.newsUnchecked {
    color: #000;
    background-color: #f4f4f4;
}
.newsChecked {
    color: #fff;
    background-color: #2484c6;
}
.themeBlueNewsFilter {
    border-left: #2484c6 solid 1em;
}
.themeYellowNewsFilter {
    border-left: #ffcb05 solid 1em;
}
.themeGreenNewsFilter {
    border-left: #00b259 solid 1em;
}
.themePurpleNewsFilter {
    border-left: #8f53a1 solid 1em;
}
.eventsFilter input[type=checkbox] {
    display: none;
}

#eventsList {
    /* margin-left: 0.5em; */
    /* margin-top: 0em; */
    margin-bottom: 1em;
    padding: 2em;
}

.eventsListDate {
    border-bottom-width: 0.5em solid green;
    min-height: 4em;
    vertical-align: middle;
    text-align: center;
}
.eventsListBox {
    /* background-color: yellow; */
    min-height: 1.5em;
}
.monthInfo {
    padding-top: 0.5em;
    font-weight: 600;
    font-size: 1.25em;
    /* color: #2484c6; */
}

.eventMonthBox {
    /* background-color: red; */
    border-top: solid #f4f4f4 0.25em;
}

.eventMonthBox a {
    text-decoration: inherit;
    color: inherit;
}
.textBlue {
    color: #2484c6;
}

.eventsRow:hover {
    background-color: lightgray;
}




/*********Clean up Scotland Map*******/


/*If reused the style will ned to be updated*/

#EventFeedPanelList {
    height: 567px;
    padding-right: 1em;
    overflow-y: auto;
    /*remove overflow and hieght limit on mobile*/
    overflow-x: hidden;
    border: solid 1px #8f53a1;
}

#EventFeedPanelCount {
    background-color: #8f53a1;
    color: white;
    padding: 0.25em;
}

#EventFeedPanelCount .filterTitle{
	color:#fff;
    display: inline-block;
    width: 95%;
}

div.filterCancel {
    display: inline-block;
    width: 5%;
    text-align: center;
    cursor: pointer;
}

    div.filterCancel:hover {
        color: #8f53a1;
        background-color: white;
    }

.ui-dialog {
    z-index: 10000 !important;
	width:60%;
    min-width: 30em;
}

.ui-dialog-titlebar {
    display: none;
}

.ui-dialog div {
	background-color:#fff;
	padding:0.25em;
}

.eventBox {
    /*background-color:lightgrey;  */
    width: 100%;
    margin: 0.5em;
    cursor: pointer;
    border-radius: 4px;
    border: solid 1px #8f53a1;
    padding: 0.25em;
}

.modalDiv {
    display: inline-block;
    vertical-align: text-top;
    margin-bottom: 0.5em;
}

    /*.modalDiv a {
        color: blue !important;
    }*/

    .modalDiv img {
        width: 100%;
    }

#selectedLA {
    width: 100%;
}

#map {
    width: 100%;
    height: 600px;
}


/*********Clean up Scotland End*******/


/**New inner page styling**/

.mainBox{
	padding-bottom:2em;
	color:#333;
}


/** Grid Styling **/

.gridRow p {
 /*   margin-top: 0; issue with upstream*/
}

/*KB: bgBlue replace with gridBlue?? */
.gridRow.bgBlue{
	color:#fff;
	
}

.gridRow.bgBlue p{
	color:#fff;

}

.gridRow.bgBlue a{
color:#fff;
}


/**Slick Styling**/

.videoEmbed {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    max-width: 100%;
}


.videoEmbed iframe, .videoEmbed object, .videoEmbed embed { 
	position: absolute; top: 0; left: 0; width: 100%; height: 100%; 
}

/** NEWS**/

/* Hide default HTML checkbox */
/*.viewToggle input {display:none;}*/
.viewSwitch {
  position: relative;
  display: inline-block;
     width: 5.5em;
  /*height: 2em;*/
}


.viewSwitch input {display:none;}

.viewSlider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0; 
}
.clearfix:after { 
   content: "."; 
   visibility: hidden; 
   display: block; 
   height: 0; 
   clear: both;
}


.viewGrid:hover {
  background-color: white;
}
.grid{
/*height:5px;*/
width:5px;
background-color:blue;

}
.viewList:hover {
  background-color: white;
}

.newsView{
    /*background-color:blue;*/
    /*height: 2em;*/
    width:7em;
    display:inline-block;
        top:0;

}

.viewGrid {
  /*background-color: green;*/
    height: 2em;
    width: 2em;
    display:inline-block;
    padding:0.25em;
	position:absolute;
		top:0;
	left:0;
    /*background-color:pink;*/
           /*border:inset;*/
}

.viewList {
  /*background-color: blue;*/
   height: 2em;
    width: 2em;
    display:inline-block;  padding:0.25em;
	position:absolute;
	top:0;
	right:0;
        /*background-color:green;*/
  
    /*border:outset;*/
}

.viewGrid:hover {
  background-color: white;
}

.newsFilter{
    list-style: none;
    margin-top: 1.25em;
   /* margin-left: 0.25em;*/
    padding: 0.7em;
    background-color: #f4f4f4;
	display:inline-flex;
	width:calc(100% - 1.65em);
}


.greySvg{    
    fill:#7A7A7A;
}

.viewList .themeBlueSvg{
  fill:#7A7A7A;
}
.viewList .themeYellowSvg{
  fill:#7A7A7A;
}

 .viewList .themePurpleSvg{
   fill:#7A7A7A;
}

.viewList .themeGreenSvg{
    fill:#7A7A7A;
}


.viewGrid .themeBlueSvg{
  fill:#2484c6;
}
.viewGrid .themeYellowSvg{
  fill:#2484c6;
}

 .viewGrid .themePurpleSvg{
   fill:#8f53a1;
}

.viewGrid .themeGreenSvg{
    fill:#00b259;
}


input:checked ~ .viewGrid .themeBlueSvg{
  fill:#7A7A7A;
}
input:checked ~ .viewGrid .themeYellowSvg{
  fill:#7A7A7A;
}

input:checked ~ .viewGrid .themePurpleSvg{
   fill:#7A7A7A;
}

input:checked ~ .viewGrid .themeGreenSvg{
    fill:#7A7A7A;
}

/*.themeBlueSvg{
    fill:#2484c6;
}
 .themeYellowSvg{
    fill:#2484c6;
}

 .themePurpleSvg{
    fill:#8f53a1;
}

 .themeGreenSvg{
    fill:#00b259;
}*/


input:checked ~ .viewList .themeBlueSvg{
    fill:#2484c6;
}
input:checked ~ .viewList .themeYellowSvg{
    fill:#2484c6;
}

input:checked ~ .viewList .themePurpleSvg{
    fill:#8f53a1;
}

input:checked ~ .viewList .themeGreenSvg{
    fill:#00b259;
}

.newsFilter button {
     width: 3em; 
    background-color: #00b259;
    color: #fff;
    border: 0;
	padding:0;
    height:2.5em;
}

.newsFilter input {
    width: calc(100% - 4em);;
	height:2.5em;
	border: none;
	display:inline-block;
	padding:0;
	margin-left:1em
}

.newsFilter input[type=checkbox]{
	visibility:hidden;
}

.newsFilterContainer{
	margin-bottom:1em;
}

.textFilterContainer{
width:100%;
}

/**NEW NEWS STYLING KB**/



.newsBoxTitle{padding:0.5em;}
.newsBoxDate{padding:0.5em;}



#newsList{
display:flex;
	flex-direction:row;
	width: 100%;
	flex-wrap:wrap;
}

.newsBox{
color:#666;
}

.newsBox a{
color:inherit;
	text-decoration:none;
	display: block;
    width: 100%;
}

.newsBox a:hover,.newsBox  a:focus{
color:inherit;
	text-decoration:underline;
}
.newsBox:hover, .newsBox:focus {
background-color:#ddd;

}

#loadMore{
	font-weight: 300;
    font-size: 1.5em;
}

#loadMore:hover{
	cursor:pointer;
	text-decoration:underline;
}

/*NewsList*/
.newsListRow{
	width:100%;
	    border-top: solid #f4f4f4 0.25em;
	display:flex;
	/*flex-wrap:wrap;*/
}


.monthBox{
	width:20%;
}

.topNewsContainer .monthList{
	width:80%;
}
.monthNewsList{
width:80%;
}
.newsItemRow{
	width:calc(100% - 0.25em);
	display:flex;
	/*border-left:0.25em solid green;*/
	margin:0.25em 0em;
	text-decoration:none;
}

.newsItemRow:hover{
cursor:pointer;
	background-color:#f1f1f1;
}
.newsItemRow:hover .newsItemText{
text-decoration:underline;
}


.newsItemDateContainer{
	width:calc(10% - 1em);
	padding:0.5em;}

.newsItemDate{
	min-height: 4em;
    vertical-align: middle;
    text-align: center;
    font-weight: 600;
    font-size: 1.25em;

}

.topNewsContainer .newsItemImg {
width:30%;
	margin-left:0.5em;

}

.newsItemContainer .newsItemImg {
width:10%;

}




.newsItemImg img{
max-width:100%;
	display:block;
}

.newsItemText{
	
	min-height: 2em;
    font-weight: 400;
	font-size:1.25em;
	color:#666;
}

.newsItemTextContainer{
	padding: 0.5em;
}

.monthInfo{
    padding-top: 0.5em;
    font-weight: 500;
}


.themeYellowNewsBorder{
        border-left:0.25em #ffcb05 solid;
}
.themeGreenNewsBorder{
        border-left:0.25em #00b259 solid;
}
.themePurpleNewsBorder{
        border-left:0.25em #8f53a1 solid;
}
.themeBlueNewsBorder{
        border-left:0.25em #2484c6 solid;
}

/**** Template Changes***/

/***Grid classes**/

.textWhite {
    color: #fff;
}
.textWhite p{
    color: #fff;
}
.textWhite a{
	color:#fff;
}

/*
KB: removing-issues with upstream. could potentially add back in or use row style in grid settings 
.gridRow {
    margin-left: 0;
    padding-top: 2em;
    padding-bottom: 2em;
    padding-right: 2em;
}*/



/**Hangover Styles**/

/**TwitterFeed**/

/*Twitter Feed*/
.twitterFeedContainer{
    background-color:white;
    padding:0.5em;
    height:25.2em;
}


/*NewsFeed*/
.smallNewsBox{

}

.newsBoxOld {
    display: block;
    padding: 0;
    position: relative;
    overflow:hidden;
}
.newsContainer {
     position: relative;
   overflow:hidden;
}
.newsBoxImg {
    width: 100%;	
	background-color: white;
	
    
}
.newsBoxImg img{
    display: block;   
    width: 100%;  
}

.NewsBox {
    padding:0.5em;
    
    
}
.topNewsBox {
    
}

.topNewsBox a {

   color:inherit;
   text-decoration:inherit;
  
   
}

/**NewsFeed Roadside*/
.topNewsFeedBox{
}
.latestNewsItem:hover{
background-color:#F1F1F1;
}
.topNewsFeedItem {
    padding: 0.5em;
    cursor: pointer;
	color:#333;
}
.topNewsFeedItem:hover {
background-color:#F1F1F1;
   
}
.latestNewsItem {
    padding: 0.5em;
    width: calc(100% - 1em);
    margin-bottom: 0.5em;
}

.topNewsImage{width:100%;}
.latestNewsImage {
    vertical-align: top;
    /* margin-right: 15px; */
    display: inline-block;
}
.latestNewsImage {
    height: 4em;
    width: 4em;
}
.latestNewsText {
    vertical-align: top;
    display: inline-block;
    position: relative;
    height: 100%;
    width: calc(100% - 4.5em);
}

.latestNewsButtonRow {
    color: #2484c6;
    border: none;
    display: block;
    text-align: right;
}
.latestNewsButtonRow a:hover{
    color: #fff;      
   background-color:#2484c6;

}

.topNewsTitle {
    font-weight: bold;
    /* font-size: 0.9em; */
    margin-top: 1em;
	
}

/* unvisited link */
.topNewsFeedBox a:link {
   text-decoration:none;
}

/* visited link */
.topNewsFeedBox a:visited {
   text-decoration:none;
}

/* mouse over link */
.topNewsFeedBox a:hover {
   text-decoration:none;
   
}

/* selected link */
.topNewsFeedBox a:active {
   text-decoration:none;
}

.latestNewsBox a {
    color:inherit;
   text-decoration:inherit;
}

/* unvisited link */
.latestNewsBox a:link {
   text-decoration:none;
}

/* visited link */
.latestNewsBox a:visited {
   text-decoration:none;
}

/* mouse over link */
.latestNewsBox a:hover {
   text-decoration:none;
   
}

/* selected link */
.latestNewsBox a:active {
   text-decoration:none;
}


/*Roadside litter promo*/
.bullBox {
    margin-top: 2em;
    position: relative;
    background-color: #F1F1F1;
    height: 0;
    padding-bottom: 110%;
}

.imgCont {
    position: absolute;
    width: 100%;
    height: 0;
    /* padding-bottom: 100%; */
    /* background-color: pink; */
}

.textCont {
    position: absolute;
    bottom: 0;
    height: 40%;
    min-height: 8em;
    /* background-color: green; */
    width: calc(100% - 4em);
    padding-left: 2em;
    padding-right: 2em;
    background-color: #F1F1F1;
}
.bullTitle {
    font-weight: bold;
    margin-bottom: 1em;
    text-align: center;
}
.bullDescription {
    text-align: center;
}
.bullButton {
    position: absolute;
    bottom: 0;
    display: block;
    padding: 0.5em;
    color: #fff;
    margin-bottom: 0.5em;
    /* background-color: lightslategrey; */
    width: calc(100% - 5em);
    text-align: center;
}

.themeBlue {
    color: white;
    background-color: #2484c6;
}

/*Roadside promobutton*/
.centreText {
    text-align: center;
}
.largeNavTitle {
    font-size: 1.2em;
    padding: 0.5em 0em;
}
.largeNavContainer {
    padding: 1em;
	    color: #fff;
    background-color: blue;
}
.imgCont img{width:100%;}

.largeNavContainer a {
    color: inherit;
}
.largeNavContainer .imageContainer {
    margin: 1em;
}

/**Statistics partial**/
.belt.pad2 .row p.partialIntro {
    margin: 0 auto 2em auto;
    padding: 0;
}

.partialIntro {
    text-align: center;
    color: #2483C6;
    font-weight: bold;
    font-size: 1.2em;
}

.statisticsItem .statisticsValue {
    font-size: 1.25em;
    color: #2483C6;
    margin-bottom: 0.25em;
}

.statisticsItem p {
    padding: 0 1em 0 1em;
    text-align: center;
    font-weight: 500;
    margin: 0;
}
.statisticsItem div {
    margin: 0.25em 0 0.25em 0;
    vertical-align: middle;
}
.statisticsItem div {
    min-height: 5.5em;
}

.statisticsItem a, .statisticsItem a:link, .statisticsItem a:visited, .statisticsItem a:hover, .statisticsItem a:active, .statisticsItem a:focus {
    text-decoration: none;
}

.themeBlue h1,.themeBlue h2,.themeBlue h3,.themeBlue h4,.themeBlue p, .themeBlue a {
color:inherit;
}




/***Video***/
.video-responsive {
    overflow: hidden;
    padding-bottom: 56.25%;
    position: relative;
    height: 0;
}

.video-responsive iframe {
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    position: absolute;
}

/*SHAREBLOCK*/

.shareblock{
/*border-color:#888;
	border-width:0.25em;
	border-style:solid;
	border-radius:0.5em;
	padding:0.5em;*/M
}
.shareblock .sharetitle{
    font-size: 1.5em;
    margin-top: 1em;
}
.shareblock ul {
list-style:none;
	padding-left:0;
	margin-left:0;
	
}


.shareblock ul li{
	width:1em;
	height:1em;	
	display:inline-block;
	border-radius:50%;
	font-size:1.5em;
	padding:0.5em;
}

.shareblock ul li svg{
    margin: auto;
    display: block;
}
.shareblock .twitter{ 
color:#fff;
background:#1DA1F2;
}

.shareblock .facebook{ 
color:#fff;
background:#4267B2;
}

.shareblock a, .shareblock a:visited{color:#fff;}
/*Annual review box on home**/

.annualReviewLink{
	display:block;
	width:100%;
}


.arHomeFlex{
display:flex;
	position:relative;
	align-items:center;
}

.arHomeFlex:hover .frontCover {
	   background-color: rgba(255, 255, 255, 1);
}
.arBackImage{	
	align-self:center;
	flex-grow:1; 
	flex-shrink:1;
}

.arBackImage img {
	width:100%;
	max-width:100%;
}


.fullWidthImage{
position:relative;
	display:flex;
	align-items:center; /*Removed to fix ie */
	justify-content:center;
	width: 100%;
}
.fullWidthImage:hover .frontCover {
	   background-color: rgba(255, 255, 255, 1);
}
.fullWidthImage img{
	width:100%;
	max-width:100%;
	display:block;
}

.arFrontCover {
    position: absolute;
    /*top: 10%;*/ /*Added back to fix ie */
    width: 35%;
    left: 15%;
    right: 15%;

}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
	.arFrontCover {
		left: 0;
		right: 0;
		margin: 0 auto;
		transform: translateY(-50%);
		top: 50%
	}
	.fullWidthImage{
		margin:0 auto;
	}
	

	
}

.frontCover {
    font-size: 5em;
    font-family: 'Montserrat', Arial, sans-serif;
    text-align: center;
    font-weight: 300;
    color: #2484c6;
    background-color: rgba(255, 255, 255, 0.9);
    padding: 0.25em;
}
.frontCoverCall{
	font-size: 0.5em;
    padding-bottom: 0.5em;
    color: #999;
}

.arSDGLine {
    font-size: 0;
    padding: 20px 0;
}
.yearText {
    color: #999;
    right: 0;
    font-size: 0.75em;
}
.arSDGLine div {
    display: inline-block;
    width: calc(100% / 18);
    height: 5px;
}
@media (min-width: 1200px) {
	
	.arBackImage .mobImg{
		display:none;
	}
	.arBackImage .tabImg{
		display:none;
	}
	
	.fullWidthImage .mobImg{
		display:none;
	}
	.fullWidthImage .tabImg{
		display:none;
	}
	
}
@media (min-width: 900px)  and (max-width: 1199px){
	
	.arBackImage .deskImg{
		display:none;
	}
	.arBackImage .mobImg{
		display:none;
	}
	
	.fullWidthImage .deskImg{
		display:none;
	}
	.fullWidthImage .mobImg{
		display:none;
	}
	.arFrontCover { 
  
		width: 40%;

		margin: auto;
	}

		.sdgIcons{
		display: flex;
	}
}

@media (min-width: 600px) and (max-width: 899px) {
	.arBackImage .deskImg{
		display:none;
	}
		.arBackImage .tabImg{
		display:none;
	}
	
	
	.fullWidthImage .deskImg{
		display:none;
	}
		.fullWidthImage .tabImg{
		display:none;
	}
		.arFrontCover { 
  
    width: 70%;
    
    margin: auto;
}
.frontCover {
    font-size: 6em;
}
}

@media (max-width: 599px) { 
	
	.arBackImage .deskImg{
		display:none;
	}
		.arBackImage .tabImg{
		display:none;
	}
	
	.fullWidthImage .deskImg{
		display:none;
	}
		.fullWidthImage .tabImg{
		display:none;
	}
	.arFrontCover { 
  
    width: 70%;
    
    margin: auto;
}
.frontCover {
    font-size: 3.5em;
}
}
