/**********************************************/
/* ICLEI EUROPE - NEWS search page
/**********************************************/
/**********************************************/
/* Color definitions
  Yellow 1: rgb(255,243,180) #FFF3B4
  Yellow 2: rgb(255,231,105) #FFE769
  Yellow 3: rgb(255,221,81) #FFDD51
  Yellow 4: rgb(246,201,76) #F6C94C

  Blue/Green 1: rgb(0,136,135) #008887
  Blue/Green 2: rgb(51,160,159) #33A09F
  Blue/Green 3: rgb(102,184,183) rgb(102,184,183)

  Green 1: rgb(102,160,135) #66A087
  Green 2: rgb(168,188,125) #A8BC7D
  Green 3: rgb(203,215,177) #CBD7B1
  Green 4: rgb(202,201,119) #CAC977

  Blue 1: rgb(127,183,192) #7FB7C0
  Blue 2: rgb(128,189,209) #80BDD1
  Blue 3: rgb(198,226,227) #C6E2E3

  Grey 1: rgb(50,50,50) #323232
  Grey 2: rgb(179,179,179) #B3B3B3
  Grey 3: rgb(242,242,242) #F2F2F2
*/


/**************************************************/
/* General */
/**************************************************/
p.error, p.exception{font-weight: bold; font-size:0.8em; padding:5px; border-radius:4px; border:1px solid rgb(128,0,0);}



/**************************************************/
/* Search form */
/**************************************************/
#search_form_box{margin-bottom:20px;}
#search_form_box form{}
#search_form_box form .form_row{}

#search_form_box form .keyword_search_form input#keyword{float:left; margin:0 5px 0 0; border:1px solid rgb(127,183,192); height:42px; font-size:1.7em; color:rgb(127,183,192); width:650px; border-radius:2px;}
#search_form_box form .keyword_search_form input#keyword::placeholder{color:rgba(127,183,192,0.4);}

form .keyword_search_form #topic_box {float:left; width:450px; margin:0 5px 0 0;}
form .keyword_search_form #topic_box select#topic{border:1px solid rgb(127,183,192); height:42px; font-size:24px; color:rgb(127,183,192); border-radius:2px;}
form .keyword_search_form #topic_box select#topic option{height:42px; font-size:20px; color:rgb(127,183,192); margin:5px 0 5px 40px;}
form .keyword_search_form #topic_box ul.selectboxit-options{max-height:500px; overflow-x:auto; width:450px;}
form .keyword_search_form #topic_box a.selectboxit-option-anchor{color:rgb(127,183,192)}
form .keyword_search_form #topic_box a.selectboxit-option-anchor:hover{background-color:rgb(127,183,192); color:white;}
form .keyword_search_form #topic_box .selectboxit-text{max-width:380px !important; text-overflow: ellipsis;}
form .keyword_search_form #topic_box .selectboxit-arrow-container{width:40px; padding:0 10px; background-color:white;}

#search_form_box form .keyword_search_form button#button_search{background-color:rgb(127,183,192); color:white; border:1px solid rgb(127,183,192); padding:0; height:42px; width:42px; border-radius:2px;}
#search_form_box form .keyword_search_form button#button_search:hover{color:rgb(127,183,192); background-color:white;}
#search_form_box form .keyword_search_form button#button_search span{font-size:2em;  padding-top:5px;}

#search_form_box form .keyword_search_form a#button_reset{float:right; background-color:rgb(127,183,192); color:white; border:1px solid rgb(127,183,192); height:42px; width:42px; border-radius:2px;}
#search_form_box form .keyword_search_form a#button_reset:hover{color:rgb(127,183,192); background-color:white; border:1px solid rgb(127,183,192);}
#search_form_box form .keyword_search_form a#button_reset span{font-size:2.2em; margin:-1px 0 0 -6px;}



/*********************************************/
/* Year / Month search links
/**********************************************/
#search_form_box form .date_search_form{display:none; margin-top:10px;}
/*#search_form_box form .date_search_form #year_search_box{float:left; width:10%; background-color:10%;}
#search_form_box form .date_search_form #year_search_box button{ width:100%; font-size: 1.3em; padding:1px 0 4px 0;  border:1px solid rgb(127,183,192); border-radius:2px; background-color:rgb(127,183,192); color:white;}
#search_form_box form .date_search_form #year_search_box button .fa{font-size:1.4em; padding:2px 0 0 10px; }
#search_form_box form .date_search_form #year_search_box button.active{color:rgb(127,183,192); background-color:white;}
#search_form_box form .date_search_form #year_search_box button.active fa{color:rgb(127,183,192);}

#search_form_box form .date_search_form #year_search_box ul.year_search_options{border-radius:2px; padding:8px 0 8px 0; margin: 0;}
#search_form_box form .date_search_form #year_search_box ul.year_search_options li{ }
#search_form_box form .date_search_form #year_search_box ul.year_search_options li:before{content:"";}
#search_form_box form .date_search_form #year_search_box ul.year_search_options li a{}

#search_form_box form .date_search_form #month_search_box{float:left; width:90%; text-align:right;}
#search_form_box form .date_search_form #month_search_box a{width:6.5%; font-size: 1.3em; margin:0  0 0 1%; padding:6px 0 5px 0; border:1px solid rgb(127,183,192); border-radius:2px; background-color:rgb(127,183,192); color:white; text-align:center;}
#search_form_box form .date_search_form #month_search_box a.active{color:rgb(127,183,192); background-color:white;}
*/


/* ****************************************
* No results found message
**************************************** */
.no_news_found_box{color:rgb(220,220,220); margin-top:1em;}
.no_news_found_box i{float:left; color:rgb(220,220,220); font-size: 8em;}
.no_news_found_box span{float:left; font-size:3em; margin:0.6em 0 0 0.5em;}



/* ****************************************
* News results box
**************************************** */
#news_results_box{ }
#news_results_box header#top_heading{width:1200px; margin:0 auto;}
#news_results_box header#top_heading h1{}
#news_results_box header#top_heading h1 .result_numbers_display{font-size: 0.6em;}

#news_results_box #view_all_news {text-align:center;}
#news_results_box #view_all_news a{color:white; background-color:rgb(127,183,192); text-decoration:none;}
#news_results_box #view_all_news a:hover {color:rgb(127,183,192); background-color:white; border:1px solid rgb(127,183,192);}



/***********************************************************/
/* News Listing
/***********************************************************/
#content_box .news_row {margin:0 0 80px 0;}
#content_box .news_row .news_item_container {position:relative; float:left; width:32.7777%; background-color:white; }
#content_box .news_row .news_item_container:nth-child(3n+1) {margin-right:0.8333%;}
#content_box .news_row .news_item_container:nth-child(3n+2) {margin-right:0.8333%;}
#content_box .news_row .news_item_container:nth-child(3n+3) {margin-right:0;}

#content_box .news_row .news_item_container .overlay {position:absolute; top:0; right:0; bottom:0; left:0;}
.events_row .events_item_container .overlay:hover {background-color:rgb(127,183,192);}

#content_box  .news_item_container .news_item{display:block; border-radius:2px; border:1px solid rgb(220,220,220);}
#content_box  .news_item_container .news_item:hover{background-color:rgb(127,183,192); border:1px solid rgb(179,179,179);}
#content_box  .news_item_container .news_item .highlighted{background-color:rgb(255,243,180);}

#content_box  .news_item_container .news_item .banner_box{position:relative; pointer-events:none; z-index:1; padding-top:55%; background-size:cover; background-position:center center; background-repeat:no-repeat;}

#content_box  .news_item_container .news_item .topics {position:relative; pointer-events:none; z-index:1; text-align:right; padding:0 5px;}
#content_box  .news_item_container .news_item .topics .topic{pointer-events:all; display:inline-block; padding:2px 4px; font-size: 0.7em; border-radius:3px; background-color:rgb(0,136,135); color:white;}


#content_box  .news_item_container .news_item .date{position:relative; pointer-events:none; z-index:1; color:rgb(50,50,50); font-size:0.85em; font-weight:normal; margin:10px 10px;}
/*#content_box  .news_item_container .news_item:hover .date{color:white;}*/

#content_box  .news_item_container .news_item .title_box{position:relative; pointer-events:none; z-index:1; margin:0 10px;}
#content_box  .news_item_container .news_item .title_box h1.title{ color:black; font-size:1.5em;}
/*#content_box  .news_item_container .news_item:hover .title_box h1.title{ color:white; }*/
#content_box  .news_item_container .news_item .title_box h2.subtitle{ color:black; font-size:1.3em; }
/*#content_box  .news_item_container .news_item:hover .title_box h2.subtitle{ color:white; }*/

#content_box  .news_item_container .news_item .article_box {position:relative; pointer-events:none; z-index:1; height:130px; overflow:hidden; }
#content_box  .news_item_container .news_item .article_box article.article{color:rgb(50,50,50); margin:10px;}
/*#content_box  .news_item_container .news_item:hover .article_box article.article{color:white;}*/

/*********************************************/
/* Row / Spacer
/**********************************************/
.news_row{display:block; margin-bottom:30px;}
.row_spacer{display:block; clear:both; height:10px; background-color:red;}




/***********************************************************/
/* News View
/***********************************************************/
#content_box .news_view_item{display:block; border-radius:2px; border:1px solid rgb(220,220,220); background-color:rgba(255,255,255,0.6);}

#content_box  .news_view_item .topics {text-align:left; padding:15px;}
#content_box  .news_view_item .topics .topic{display:inline-block; height:22px; font-size: 0.9em; border-radius:3px; background-color:rgb(0,136,135); color:white;}
#content_box  .news_view_item .topics .topic {padding:2px 6px 2px 6px;}

#content_box .news_view_item .date{color:rgb(50,50,50); font-size:1em; font-weight:normal; margin:10px 15px;}

#content_box .news_view_item .title_box{margin:0 15px;}
#content_box .news_view_item .title_box h1.title{ color:black; }
#content_box .news_view_item .title_box h2.subtitle{ color:black; }


#content_box .news_view_item .banner_box{float:right; position:relative; width:50%; padding-top:27.5%; margin:5px 15px 0 15px ; border:1px solid rgb(220,220,220); border-width:0 0 1px 1px; background-size:cover; background-color:white; background-position:center center; background-repeat:no-repeat; box-shadow:0 0 4px 0 rgba(0,0,0,0.5);}
#content_box .news_view_item .banner_box{width:33%; padding-top:18.2%;}
#content_box .news_view_item .banner_box .copyright_info_box{position:absolute; bottom:-10px; right:0; background-color:transparent; overflow:hidden; margin:0;}
#content_box .news_view_item .banner_box .copyright_info_box .copyright_info{display:inline-block; font-size: 0.6em; padding:0 5px; color:rgb(120,120,120);  background-color:white; border:1px solid rgb(179,179,179); border-radius:2px;}
#content_box .news_view_item .banner_box .copyright_info_box .copyright_info span{display:inline-block; width:0; white-space: nowrap; opacity:0;}
#content_box .news_view_item .banner_box .copyright_info_box .copyright_info i{display:inline-block; margin:2px -1px 0 -1px;}
#content_box .news_view_item .banner_box .copyright_info_box .copyright_info:hover span{width:auto; opacity:1;}


#content_box  .news_view_item .file_box{clear:both; margin:20px 15px 10px 15px; padding:10px 10px 10px 20px; border_:1px solid rgb(220,220,220); background-color_:rgb(245,245,245); border-radius:4px;}
#content_box  .news_view_item .file_box .file_box_heading{font-weight: bold; margin:0 0 0 -10px;}
#content_box  .news_view_item .file_box .file_purpose{margin:30px 0 0 0;}
#content_box  .news_view_item .file_box a.file{display:inline-block; border:1px solid rgb(127,183,192); border-radius:4px; padding:10px; margin:10px 20px 0 0;  box-shadow:2px 2px 3px 0px rgba(0,0,0,0.2); }
#content_box  .news_view_item .file_box a.file i{font-size:2.5em; float:left; margin-right:10px; }
#content_box  .news_view_item .file_box a.file .file_info{float:left; white-space: nowrap; padding:0; margin:0;}
#content_box  .news_view_item .file_box a.file .file_info .file_name{}
#content_box  .news_view_item .file_box a.file .file_info .file_type_size{}
#content_box  .news_view_item .file_box a.file .file_description{display:block; padding:0 10px 0 0;}

#content_box .news_view_item .article_box {}
#content_box .news_view_item .article_box article.article{color:rgb(50,50,50); margin:10px 15px;}






/*#content_box .news_view_item .direct_link_box{display:none; float:right; margin:3px;}
#content_box .news_view_item .direct_link_box a{}
#content_box .news_view_item .direct_link_box a:hover{color:rgb(127,183,192); background-color:transparent;}
*/

/*#content_box .news_view_item .copyright_info_box{clear:both; margin:10px; text-align:right;}
#content_box .news_view_item .copyright_info_box .copyright_info{display:inline-block; font-size: 0.7em; padding:0 5px;  color:rgb(120,120,120); border:1px solid rgb(179,179,179); border-radius:2px;}
*/


/*********************************************/
/* Button box
/**********************************************/
.button_box{margin-bottom:20px;}
.button_box .back_button{border:1px solid rgb(127,183,192); padding:3px 8px; font-size:1.8em; }
.button_box .back_button:hover{text-decoration:none;}
.button_box .back_button .fa{font-size: 0.75em;}




/*********************************************/
/* Pagination
/**********************************************/
#pagination_container{display:table; margin:0 auto 10px auto;}
#pagination_container .page_link{display:block; float:left; width:40px; padding:0; margin:0; font-size:1.1em; text-align:center; border:1px solid rgb(242,242,242); border-width:1px 1px 1px 0;}
#pagination_container .page_link:first-child{border-left-width:1px;}

#pagination_container .current_page{ color:rgb(220,220,220);  }

#pagination_container span{display:block; width:100%; padding:5px; text-align:center;}
#pagination_container a{display:block; width:100%; padding:5px; text-decoration:none; color:rgb(150,150,150);  text-align:center;}
#pagination_container a:hover{background-color:rgb(240,240,240); color:rgb(160,160,160);}








/**********************************************/
/* Media Queries 
/**********************************************/

/* < 1200 */
@media only screen and (max-width: 1199px){
    #search_form_box form .keyword_search_form input#keyword {
        width: calc(100% - 60px);
        margin: 0 5px;
    }

    #search_form_box form .keyword_search_form #topic_box {
        width: calc(100% - 60px);
        margin: 0 5px;
        padding: 20px 0 0 0;
    }

    #search_form_box form .keyword_search_form a#button_reset{
        margin: 20px 7px 0 0;
    }
}



/* < 980 */
@media only screen and (max-width: 979px){

    #content_box .news_row .news_item_container {
        width: 100%; 
        margin: 0px;
        padding: 10px;
    }
}