/*******INTRO********/
/*
	THIS IS SEPERATED INTO MULTIPLE SECTIONS

	SECTION 1 - GLOBAL STYLING STOCK
	SECTION 2 - GLOBAL STYLING CUSTOM
	SECTION 3 - SPECIFIC STYLING FOR SPECIFIC PAGE TYPES & SPECIFIC PAGES
	SECTION 4 - RESOLUTION SPECIFIC MEDIA QUERY OVERRIDES
/*
/****END INTRO*******/




/*SECTION 1*/



/*START STOCK GLOABL STYLING - MOSTLY STOCK FROM PHPSQLITECMS WITH A FEW MINOR MODIFICATTIONS HERE AND THERE*/
body {
     margin-bottom:30px;
}
 body.admin {
     padding-top:50px;
     padding-bottom:20px;
     margin-bottom: 20px;
}
 #logo {
    min-height:117px;
     min-width:128px;
     margin-top:0.6em;
     margin-left:0.4em;
     background-image:url('../media/facts4eu.png');
     background-repeat:no-repeat;
}
 #logo a {
    font-size: 0;
}
 .header .nav {
     margin-top:82px;
     padding:0;
}
 .col-lg-4 h2 {
     font-size:30px;
}
 header {
     padding:10px 0 5px 0;
     background-image:url('../media/background.jpg');
     background-repeat:no-repeat;
     background-position: right;
}
 header ul {
     padding:20px 0 0 0;
}
 .heading {
     margin:0 0 30px 0;
     padding: 20px;
     background:#eee;
     border-radius:6px 6px 6px 6px;
     text-align: center;
}
 .heading h1 {
     margin:10px 0;
}
 .heading p {
     margin:20px 0 10px 0;
     font-size:18px;
     text-align:left;
}
 .heading ul, .heading ol {
     text-align:left;
}
 .topsep {
     margin:10px 0 15px 0;
}
 .main-content p, .main-content ul {
     line-height:175%;
}
 .sidebar {
     margin-top:30px;
}
 .sidebar p, .sidebar ul {
     line-height:175%;
}
 .teaser p {
     margin-top:0;
}
 .teaser .thumbnail {
     margin-bottom:5px;
}
 .caption {
     margin:3px 0 3px 0;
     color:#808080;
     font-style:italic;
}
 .thumbnail {
     max-width:100% !important;
     height:auto;
}
 .thumbnail-left {
     float:left;
     margin:0 10px 10px 0;
}
 .thumbnail-right {
     float:right;
     margin:0 0 10px 10px;
}
 .thumbnail img {
     width:100%;
}
 a.thumbnail:hover {
     opacity:0.9;
}
 .caption + p {
     margin-top:20px;
}
 .topspace {
     margin-top:10px;
}
 .closure {
     margin-top:50px;
     display:none;
}
 .footer p {
     margin:0;
     font-size:13px;
}
 .footer {
     color:#808080;
     text-align:center;
}
 .footer a {
     color:#808080;
     text-align:center;
}
 .footer a:hover {
     color:#2a6496;
}
 .header .nav > li > a {
     padding: 5px 10px;
}

 .jumbotron {
     background-color:#fdfbfc;
     border:5px solid #a00807;
}
 .jumbotron h1 {
     color:#1b2540;
}
 .jumbotron p {
    color:#a40b06;
}
 .btn-primary, .btn-primary.active, .btn-primary.focus, .btn-primary:active, .btn-primary:focus, .btn-primary:hover, .open > .dropdown-toggle.btn-primary {
     color: #fff;
     background-color: #1f356f;
     border-color: #152650;
}
 .btn-primary:active, .btn-primary:focus, .btn-primary:hover {
     color: #fff;
     background-color: #2a4382;
     border-color: #2e4683;
}
 .gallery {
     margin:20px 0 30px 0;
     padding:30px 30px 0 30px;
     border:1px solid #ddd;
     border-radius: 4px 4px 4px 4px;
     background:#eee;
}
 .gallery h3 {
     margin:-15px 0 20px 0;
     padding:0;
     font-size:14px;
     color:#808080;
     font-style:italic;
     text-align:center;
}
 .thumbnail-wrapper {
     text-align:center;
     margin-bottom:30px;
}
 .thumbnail-wrapper a {
     display:inline-block;
     margin:auto;
}
 #menu-toggle-handle {
     display:block;
     margin:12px 0 1px 0;
     background:#428bca;
     padding:2px 3px;
     color:#fff;
     text-align:center;
     text-decoration:none;
}
 #menu-toggle-handle .icon-bar {
     display: block;
     margin:auto;
     width:22px;
     height:2px;
     background-color:#fff;
     border-radius:1px;
}
 #menu-toggle-handle .icon-bar + .icon-bar {
     margin-top:4px;
}
 .dropdown-menu .glyphicon {
     padding-right:5px;
}
 a.rss {
     padding-left:23px;
     background:url(../img/rss.png) no-repeat left;
}
 a.pdf {
     padding-left:23px;
     background-image:url(../img/pdf.png);
     background-repeat:no-repeat;
     background-position: top left;
}
 .simple-news h2 {
     margin:10px 0;
}
 .simple-news h2 a {
     color:#333;
     text-decoration:none;
}
 .simple-news-delete {
     background:#f2dede;
}

/*start image gallery lightbox section*/

 #mylightbox-background {
     display:none;
     position:fixed;
     height:100%;
     width:100%;
     top:0;
     left:0;
     background:#000;
     border:1px solid #cecece;
     z-index:2000;
}
 #mylightbox {
     width:400px;
     display:none;
     position:absolute;
     background:#fff;
     z-index:2000;
     padding:3px 10px 0 10px;
     font-size:13px;
     border:1px solid #cecece;
     border-radius:5px;
     max-width:90%;
     height:auto;
     box-shadow:0 0 20px #000;
}
 #mylightbox img {
     max-width:100%;
     height:auto;
}
 #mylightbox-header {
     height:25px;
     font-size:13px;
     line-height:20px;
     padding:0 0 10px 0;
}
 #mylightbox-title {
     position:absolute;
     top:3px;
     left:10px;
     width:90%;
     margin:0;
     padding:0;
     font-weight:bold;
}
 #mylightbox-controls {
     position:absolute;
     top:5px;
     right:10px;
     width:14px;
     margin:0;
     padding:0;
}
 #mylightbox #photo {
     margin:0;
     padding:0;
}
 #mylightbox-subtitle {
     font-size:13px;
     line-height:150%;
     margin:5px 0 0 0;
     font-style:italic;
     color:#808080;
}
 #mylightbox-description {
     font-size:14px;
     line-height:150%;
     margin:5px 0 10px 0;
}
 #mylightbox-author {
     color:#808080;
     font-size:13px;
     margin:-8px 0 0 0;
     padding:0 0 8px 0;
}
 #mylightbox-throbber {
     width:32px;
     height:32px;
     margin:0 auto 0 auto;
     padding:100px 0;
     background:url(../img/throbber.gif) no-repeat center;
}
 #mylightbox-photo {
     position:relative;
}
 #mylightbox-prev {
     width:50%;
     position:absolute;
     top:0;
     left:0;
     bottom:0;
     background:url(../img/prev.png) no-repeat -1000px 0;
     z-index:10000;
     text-indent:-999em;
     outline:none;
}
 #mylightbox-prev:hover {
     background:url(../img/prev.png) no-repeat 7% center;
}
 #mylightbox-next {
     width:50%;
     position:absolute;
     top:0;
     right:0;
     bottom:0;
     background:url(../img/next.png) no-repeat 1000px 0;
     z-index:10000;
     text-indent:-999em;
     outline:none;
}
 #mylightbox-next:hover {
     background:url(../img/next.png) no-repeat 93% center;
}
 #mylightbox-close {
     width:16px;
     height:16px;
     display:inline-block;
     text-indent:-999em;
     background:url(../img/close_button.png) no-repeat 0 0;
     outline:none;
     opacity:0.7;
}
 #mylightbox-close:hover {
     opacity:1;
}
/*end image gallery lightbox section*/

/* END STOCK GLOABL STYLING */






/************** EVERYTHING BELOW THIS IS CUSTOM ***************/


/*SECTION 2*/




/* START CUSTOM GLOBAL STYLING*/
/*BODY CONTENT H1,2 & 3 */
 .body-content h1, .body-content h2, .body-content h3 {
     color:#1f356f;
}

/* START NAVIGATION ARE OVERRIDES*/
.facts4eu-nav-container {
     padding-left:1em;
     padding-right:1em;
     margin-bottom:0.5em;
}
 .facts4eu-nav {
     padding:0.6em;
     background:#404040;
}
 .facts4eu-nav .nav-pills > li > a {
     color:#fff;
     background:#404040;
}
 .facts4eu-nav .nav-pills > li > a:hover{
     background:#5f5c5c;
}
 .facts4eu-nav .nav-pills > li.active > a, .facts4eu-nav .nav-pills > li.active > a:hover {
     color:#fff;
     background:#404040;
     font-weight:bold;
}
 .nav-pills > li.active > a, .nav-pills > li.active > a:focus, .nav-pills > li.active > a:hover {
     color: #fff;
     background-color: #1f356f;
}
 .nav-pills > li > a {
     color:#1f356f;
}
 .breadcrumb {
     background-color:#fff;
}

/*END  NAVIGATION ARE OVERRIDES*/

/*Basic text styling classes, upper class, higlight red & navy etc*/
 .uppercase {
     text-transform: uppercase;
}
 .bold-text {
     font-weight:bold;
}
 .highlight-red {
     color:red;
}
 .highlight-navy, .heading p.highlight-navy {
     color:navy;
}
 .smaller, .heading p.smaller {
     font-size:11pt;
}

 .light-blue, h1.light-blue, h2.light-blue , h3.light-blue, h4.light-blue {
     color: #4e74c0;
}
 .light-blue-bg {
     background-color: #deebf7;
}
 .light-blue-bg h3, .light-blue-bg h4 {
     color:#042169;
}
 .text-center, .summary-navy.text-center {
     text-align:center;
}



/* Class to hide something at desktop size that we want displaye on lower resolution devices*/
 .mobile_only {
    display:none;
}
/* Not sure if this is used, keeping it just in case*/
 .col-md-4.teaser h2 {
     color:#1f356f;
     font-weight:bold;
     font-size:18pt;
}

 /*Start Summary boxes (Red & Navy)*/
 div.facts4eu-summary-red, div.facts4eu-summary-navy {
     display:block;
     border:1px solid #C0C0C0;
     padding:0.6em 2em;
     text-align: center;
     border-radius: 10px;
     margin-top:1em;
     margin-bottom:1em;
}
 div.facts4eu-summary-red {
     border-color:#da291c;
}
 div.facts4eu-summary-navy {
     border-color:#002266;
}
 .facts4eu-summary-red p, .facts4eu-summary-navy p {
     text-align:left;
}
 .facts4eu-summary-red h3, .facts4eu-summary-navy h3 {
     font-size: 1.2em;
     font-weight:bold;
     color:#0000FF!important;
     text-transform:uppercase;
}
 .facts4eu-summary-red h4, .facts4eu-summary-navy h4 {
     color:#002266;
     font-size: 1.3em;
     font-weight:bold;
     margin-bottom:1em;
     line-height:1.35;
}
 .facts4eu-summary-red ol, .facts4eu-summary-red ul, .facts4eu-summary-navy ol, .facts4eu-summary-navy ul {
     margin-top:0.6em;
     text-align:left;
}

/*End summary boxes (red & navy)*/

 .alert h3 {
     margin:0 0 10px 0;
}
 .overview h2 a {
     color:#333;
     text-decoration:none;
}



/*START COMMENTS RELATED STYLING*/
 #comments {
     margin-top:50px;
}
 #commentformwrapper {
     padding-top:20px;
}
.comment {
     position:relative;
     margin-bottom:25px;
}
 .comment-admin {
     position:absolute;
     top:0;
     right:0;
}
 .comment-delete {
     background:#f2dede;
}
 .comment-preview {
     color:#333;
}
 .comment-info {
     font-size:13px;
     color:#808080;
     margin:0 0 -10px 0;
}
 h3#preview {
     color:#ca9853;
     margin-bottom:10px;
}
 h4.author {
     font-size:14px;
     margin-bottom:5px;
     font-style:italic;
}

/*END COMMENTS RELATED STYLING*/

/*START NEW FOOTER STUFF*/
 .row .striped {
     background:repeating-linear-gradient(45deg,#f4f4f4,#f4f4f4 12px,#EEEEEE 12px,#EEEEEE 24px);
     min-height:40px;
     margin-top:0.2em;
     margin-bottom:0.2em;
}
 footer {
     background:#fff;
     color:#404040;
     padding:2em;
}
 footer .row .col-md-4 a, footer .row .col-md-4 a:hover, footer .row .col-md-3 a, footer .row .col-md-3 a:hover, footer .row .col-md-5 a, footer .row .col-md-5 a:hover, footer p, footer ul li {
     color:#404040;
}
 footer .row .col-md-4 a.underline, footer .row .col-md-4 a.underline:hover, footer .row .col-md-3 a.underline, footer .row .col-md-3 a.underline:hover, footer .row .col-md-5 a.underline, footer .row .col-md-5 a.underline:hover {
     border-bottom: solid 1px #404040;
     display: inline;
     padding-bottom: 2px;
     text-decoration:none;
}
 footer .row .col-md-4, footer .row .col-md-3, footer .row .col-md-5 {
     text-align:left;
     padding:0.5em;
     line-height:1.8em;
}
 footer .row .col-md-4.ar {
     text-align:right
}
 footer .row .col-md-4.ar ul {
     list-style: none;
}
 footer ul.social li, footer ul.f4eu_sm_share li {
     display:inline;
     float:right;
     padding:0.2em;
}
 footer ul.social li img, footer ul.f4eu_sm_share li img {
     vertical-align: initial;
}
 footer .row .col-md-4 p.footer-larger, footer .row .col-md-5 p.footer-larger {
     font-size:13pt;
     margin-bottom:0.2em;
}
/*END NEW FOOTER STUFF*/


/*FACTS4EUORG Specific*/
/*Heading blocks - generally used for OBSERVATIONS*/
 .parent-section-news div.heading, .parent-section-draft-news div.heading {

}
/*Title of OBSERVATION block*/
 .parent-section-news div.heading h3, .parent-section-draft-news div.heading h3 {

}
 .feedback-quote {
    margin:1em;
     border:1px solid #0B7DBD;
     padding:0.5em;
}
 .feedback-message {
     color:#0B7DBD;
     font-weight:bold;
}
 .feedback-author {
    color:#AE0605;
     font-style:italic;
     font-weight:bold;
}



/*START SOCIAL SHARE AREA*/
 .page-share {
     margin-top:2em;
     margin-bottom:0;
     padding-bottom:0;
     text-align:left;
}
 .page-share p {
     margin:0.1em;
     padding: 0;
}
 .page-share p a:hover {
     text-decoration:none;
}
 .share-link {
     padding: 2px 8px 4px 8px !important;
     color: white;
     font-size: 12px;
     border-radius: 2px;
     margin-right: 2px;
     cursor: pointer;
     -moz-background-clip: padding;
     -webkit-background-clip: padding-box;
     box-shadow: inset 0 -3px 0 rgba(0,0,0,.2);
     -moz-box-shadow: inset 0 -3px 0 rgba(0,0,0,.2);
     -webkit-box-shadow: inset 0 -3px 0 rgba(0,0,0,.2);
     margin-top: 2px;
     display: inline-block;
     text-decoration: none;
}
 .share-link:hover,.share-link:active {
     color: white;
}
 .share-twitter {
     background: #00aced;
}
 .share-twitter:hover,.share-twitter:active {
     background: #0084b4;
}
 .share-facebook {
     background: #3B5997;
}
 .share-facebook:hover,.share-facebook:active {
     background: #2d4372;
}
/*END SOCIAL SHARE AREA*/

/* START COMMENT SCROLL*/

/*comment scroll - adjust styling to suit*/
 .comment-scroll {
     padding-top:1.6em;
	  color:red;
     font-weight:bold;
}
/*comment scroll adjust this to control styling of the text that appears when there are no comments present*/
 .comment-scroll.no-comments {

}

/* END COMMENT SCROLL*/

/* START DONATION AREA / CAMPAIGN MESSAGE*/
/*class to indent the donation block slightly*/
 .funding-request {
     background:#FFF7DE;
     padding:0 2em 0.4em 1.5em;
	 margin:1em 0 1em 0;
}
/*Styling on the one-off & regular-donation blocks*/
 .one-off-donation, .regular-donation {
     border-width:1px;
     border-style:solid;
     background-color:#FFF7DE;
     border-color:#000000;
     border-radius:5px;
}
/*Styling on the H4's within the one-off & regular-donation blocks*/
 .one-off-donation h4, .regular-donation h4 {
     color:#800000;
     text-align:center;
}
/* END DONATION AREA / CAMPAIGN MESSAGE*/



/*SECTION 3 - PAGE TYPES STYLES*/


/*A) NEWS & DRAFT NEWS - THIS WILL AFFECT ALL INDIVIDUAL NEWS ARTICLES*/

	/*Keeping these news & dtraft-news synced so that draft news looks the same as real news*/

	/*HEADINGS*/
	.parent-section-news h1, .parent-section-draft-news h1 {
		/*STYLING FOR INDIVIDUAL NEWS ARTICLE H1 HERE*/
	}
	.parent-section-news h2, .parent-section-draft-news h2 {
		/*STYLING FOR INDIVIDUAL NEWS ARTICLE H2 HERE*/
	}
	.parent-section-news h3, .parent-section-draft-news h3 {
		/*STYLING FOR INDIVIDUAL NEWS ARTICLE H3 HERE*/
	}
	.parent-section-news h4, .parent-section-draft-news h4 {
		/*STYLING FOR INDIVIDUAL NEWS ARTICLE H4 HERE*/
	}
	.parent-section-news h5, .parent-section-draft-news h5 {
		/*STYLING FOR INDIVIDUAL NEWS ARTICLE H5 HERE*/
	}

	/*Paragraphs*/
	.parent-section-news p, .parent-section-draft-news p {
		/*STYLING FOR INDIVIDUAL NEWS ARTICLE PARAGRAPHS HERE*/
	}

	/*Links within paragraphs*/
	.parent-section-news p a, .parent-section-draft-news p a {
		/*STYLING FOR INDIVIDUAL NEWS ARTICLE ANCHORS WITHIN PARAGRAPHS HERE*/
	}

	/*Hover styling on Links within paragraphs*/
	.parent-section-news p a:hover, .parent-section-draft-news p a:hover {
		/*STYLING ON INDIVIDUAL NEWS ARTICLE FOR HOVER EFFECT ON ANCHORS WITHIN PARAGRAPHS HERE*/
	}

	/*Paragraphs Emphesis ems*/
	.parent-section-news p em, .parent-section-draft-news p em {
		/*STYLING FOR INDIVIDUAL NEWS ARTICLE PARAGRAPHS EMs HERE*/
		font-style:italic;
	}

	/*Paragraphs strongs*/
	.parent-section-news p strong, .parent-section-draft-news p strong {
		/*STYLING FOR INDIVIDUAL NEWS ARTICLE PARAGRAPHS STRONGs HERE*/
		font-weight:bold;
	}

	/*ULs*/
	.parent-section-news ul, .parent-section-draft-news ul {
		/*STYLING FOR INDIVIDUAL NEWS ARTICLE UL HERE*/

	}
	/*ULs lis*/
	.parent-section-news ul li, .parent-section-draft-news ul li {
		/*STYLING FOR INDIVIDUAL NEWS ARTICLE UL LI HERE*/

	}
	/*OLs*/
	.parent-section-news ol, .parent-section-draft-news ol {
		/*STYLING FOR INDIVIDUAL NEWS ARTICLE OL HERE*/

	}
	/*OLs lis*/
	.parent-section-news ol li, .parent-section-draft-news ol li {
		/*STYLING FOR INDIVIDUAL NEWS ARTICLE OL LI HERE*/

	}


/*B) NEWS LISTING & DRAFT NEWS LISTING PAGE TYPES*/

	/*EACH NEWS TEASER ON A LISTING PAGE SITS WITHIN IT'S OWN DIV WITH CLASS .news */

	.current-page-news .news, .current-page-draft-news .news {/
		margin:30px 0 30px 0;
	}
	.current-page-news .news:first-child, .current-page-draft-news .news:first-child {
		margin-top:20px;
	}
	.current-page-news .news h1, .current-page-draft-news .news h1 {
		font-size:1.75em;
	}

	.current-page-news .news h2, .current-page-draft-news .news h2 {
		margin:0;
		padding:0;
		font-size:1.6em;
		padding-top:5px;
	}
	.current-page-news .news h2:first-of-type, .current-page-draft-news .news h2:first-of-type {
		font-size:1.6em;
	}
	.current-page-news .news h2 a, .current-page-draft-news .news h2 a {
		color:#333;
		text-decoration:none;
	}
	.current-page-news .news h3, .current-page-draft-news .news h3 {
		font-size:1.5em;
		padding-top:5px;
	}

	.current-page-news .news, .current-page-news .time, .current-page-draft-news .news, .current-page-draft-news .time {
		color:#808080;
		font-size:13px;
		margin:0 0 7px 0;
		padding:0;
	}

	/* News item treaser Paragraphs*/
	.current-page-news .news p, .current-page-draft-news .news p {
	}

	/*News item treaser Emphesis ems*/
	/*These days <em> tags are prefered over <i>. <em> is for emphesis. They are generally italic but you could decide to do something different*/
	.current-page-news .news p em, .current-page-draft-news .news p em {
		font-style:italic;
	}

	/*News item treaser strongs*/
	/*These days <strong> tags are prefered over <b>. They are generally bold but you could decide to do something different*/
	.current-page-news .news p strong, .current-page-draft-news .news p stong {
		font-weight:bold;
	}

	/*News item treaser. ULs*/
	.current-page-news .news ul, .current-page-draft-news .news ul {

	}
	/*News item treaser lis*/
	.current-page-news .news ul li, .current-page-draft-news .news ul li {

	}
	/*News item treaser OLs*/
	.current-page-news .news ol, .current-page-draft-news .news ol {

	}
	/*News item treaser OLs lis*/
	.current-page-news .news ol li, .current-page-draft-news .news ol li {

	}
	/*START STUFF MOVED FROM INLINE STYLE IN NEWS.INC.TPL*/
	.news .media-heading
	{ color:blue; 
      padding-top:5px; 
      padding-bottom:0px;
        
    }
    .news h2.media-heading  a
    {
        color:blue;
    }
    /*END STUFF MOVED FROM INLINE STYLE IN NEWS.INC.TPL*/

/*C) AN EXAMPLE OF TARGETING A PARTICULAR NEWS ARTICLE*/
/* A class reflecting the URL is now included in on the body content container
   So, for excample if the URL is "news/2019-jan-pm-resolution" then there will be a class "current-page-news-2019-jan-pm-resolution"
   So if you want the H1 of that specific article to be green you can do

   .current-page-news-2019-jan-pm-resolution h1
   { color:green;
   }

   If you want the paragraphs on that article & that article alone to be yellow you'd do

   .current-page-news-2019-jan-pm-resolution p
   { color:yellow;
   }

	Expanding on the above, if you wanted all the paragrpahs to be yellow,
	except for the first paragraph whichyou want to be pink
	Then you'd include the rule above PLUS the following

   .current-page-news-2019-jan-pm-resolution p:first-of-type
   { color:pink;
   }

   so you'd have:

   .current-page-news-2019-jan-pm-resolution p
   { color:yellow;
   }

   .current-page-news-2019-jan-pm-resolution p:first-of-type
   { color:pink;
   }

   And so on..

*/


/*D) AN EXAMPLE OF TARGETING A PARTICULAR NEWS TEASER*/
/* A class reflecting the URL of the article the teaser belongs to is now included in on the div containing the teaser

   So, for example if the URL for the full article with the URL:
	"news/2019-jan-pm-resolution"

   then the teaser for that article will have a class
	"teaser-news-2019-jan-pm-resolution"

   So if you want the H2 of that specific teaser to be green you can do
   .teaser-news-2019-jan-pm-resolution h2
   { color:green;
   }

   If there are multiple H2s in the teaser and you want them all to be green except the first one which you want to be yellow, you'd append the following to the above

   .current-page-news-2019-jan-pm-resolution h2:first-of-type
   { color:yelllow;
   }

	etc
	You can hook onto anything in that particular teaser by prepending the class based on the uri as detailed above
*/

/*E) Brexit Index Promo News Story*/
/*Appears as the last item in the news listing*/
	.news.teaser-brexit-index-intro
	{	text-align:center;
		border:5px solid #C0C0C0;
		border-radius:10px;
		margin:1em 0;
	}

	/*Style the item headline*/
	.news.teaser-brexit-index-intro .media-heading a
	{	color:red;
		font-weight:bold;
	}

	/*Style the item headline*/
	.news.teaser-brexit-index-intro .media p
	{	color:#000;
		font-size:12pt;
	}

	.news.teaser-brexit-index-intro .btn-primary
	{	
		font-weight:bold;
	}
	.news.teaser-brexit-index-intro .btn-primary:hover
	{	
		border-color:#98c1e2;
	}
    .news.teaser-brexit-index-intro hr
    {   display:none;
    }

/*SECTION 4*/

/*SCREEN SIZE MEDIA QUERIES FOR SPECIFIC CONFIGURATIONS DEPENDANT ON WINDOW WIDTH*/


 @media screen and (max-width:768px) {
    .mobile_only {
        display:block;
    }
     header {
         background-image:none;
    }
     #logo-container-link{
        padding:0.5em;
    }
     #logo {
         margin:0;
         font-size:36px;
         text-align:center;
         margin-left: calc(50% - 60px);
         transform:rotate(0);
         -moz-transform:rotate(0);
         -webkit-transform:rotate(0);
    }
     #nav {
         display:none;
         margin:0;
         padding:0;
    }
     #nav ul {
         margin:0;
         padding:0;
    }
     #nav .nav-pills > li {
         text-align:center;
         float:none;
         background:#eee;
    }
     #nav .nav-pills > li > a {
         padding: 10px 15px;
         border-radius:0;
    }
     #nav .nav-pills > li + li > a {
         margin-top: 2px;
         margin-left: 0;
    }
     img {
        max-width: calc(100% - 50px);
         height:auto;
    }
	footer .row .col-md-4.ar {
         text-align:left
    }
     footer ul {
         margin-left:-3em;
    }
     footer ul.social li, footer ul.f4eu_sm_share li {
         display:inline;
         float:none;
         padding:0.2em;
    }
}


@media screen and (min-width:768px) {
     .nav-pills > li {
         border-right: 1px solid #fff;
    }
     .nav-pills > li:last-of-type {
         border-right: none;
    }
     .nav-pills > li:first-of-type {
         padding-left:2em;
    }
     .nav-pills > li:nth-of-type(2) a, .nav-pills > li:nth-of-type(2) a:hover, .nav-pills > li:nth-of-type(2) a:active{
         color:#ff5965;
    }
}

 @media (min-width: 992px) {
     .header .nav {
         margin-top:37px;
         float:right;
         text-align:right;
    }
     .sidebar {
         margin-top:0;
    }
}