/**********************************************/
/* 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{}

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;}
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;}



/* ****************************************
* No results found message
**************************************** */
.no_results_found_box{color:rgb(220,220,220); margin-top:1em;}
.no_results_found_box i{float:left; color:rgb(220,220,220); font-size: 8em;}
.no_results_found_box span{float:left; font-size:3em; margin:0.6em 0 0 0.5em;}


/* ****************************************
* Projects results box & Heading
**************************************** */
#projects_results_box{ }
#projects_results_box header#top_heading{width:1200px; margin:0 auto;}
#projects_results_box header#top_heading h1{}
#projects_results_box header#top_heading h1 .result_numbers_display{font-size: 0.6em;}






/***********************************************************/
/* Projects Listing
/***********************************************************/
.projects_row {margin:0 0 80px 0;}
.projects_row .projects_item_container {position:relative; float:left; width:32.7777%; background-color:white; }
.projects_row .projects_item_container:nth-child(3n+1) {margin-right:0.8333%;}
.projects_row .projects_item_container:nth-child(3n+2) {margin-right:0.8333%;}
.projects_row .projects_item_container:nth-child(3n+3) {margin-right:0;}

.projects_row .projects_item_container .overlay {position:absolute; top:0; right:0; bottom:0; left:0;}
.projects_row .projects_item_container .overlay:hover {background-color:rgb(127,183,192);}

.projects_item_container .projects_item{display:block; border-radius:2px; border:1px solid rgb(220,220,220);}
.projects_item_container .projects_item:hover{background-color:rgb(127,183,192); border:1px solid rgb(179,179,179); text-decoration:none;}
.projects_item_container .projects_item .highlighted{background-color:rgb(255,243,180);}

.projects_item_container .projects_item .banner_container {padding:10px; /*border-bottom:1px solid rgb(220,220,220);*/}
.projects_item_container .projects_item .banner_container .banner_box{position:relative; pointer-events:none; z-index:1;  padding-top:55%; background-size:contain; background-position:center center; background-repeat:no-repeat; background-color:white;}
.projects_item_container .projects_item .banner_container .banner_box.default_banner .banner_overlay{position:absolute; top:0; left:0; width:100%; height:100%; background-color:white; opacity:0;}

.projects_item_container .projects_item .type {float:left; color:rgb(50,50,50); font-size:0.8em; margin:5px 20px 20px 5px; padding:2px 4px; border:1px solid rgb(220,220,220); border-radius:3px;background-color:white;}

.projects_item_container .projects_item .topics {position:relative; text-align:right; padding:0 5px;}
.projects_item_container .projects_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;}

.projects_item_container .projects_item .title_box{position:relative; pointer-events:none; z-index:1; margin:0 10px;}
.projects_item_container .projects_item .title_box h1.short_title{ color:black; font-size:1.5em;}
/*.projects_item_container .projects_item:hover .title_box h1.short_title{ color:white; }*/
.projects_item_container .projects_item .title_box h2.title{ color:black; font-size:1.3em; }
/*.projects_item_container .projects_item:hover .title_box h2.title{ color:white; }*/


.projects_item_container .projects_item .description_box {position:relative; pointer-events:none; z-index:1; height:130px; overflow:hidden; }
.projects_item_container .projects_item .description_box article.description{color:rgb(50,50,50); margin:10px;}
/*.projects_item_container .projects_item:hover .description_box article.description{color:white;}*/


/*********************************************/
/* Row / Spacer
/**********************************************/
.projects_row{display:block; margin-bottom:30px;}
/*.row_spacer{display:block; clear:both; height:10px; background-color:red;}*/









/***********************************************************/
/* Activity/Projects View
/***********************************************************/
.projects_view_item{display:block; border-radius:2px; border:1px solid rgb(220,220,220); padding-bottom:10px; background-color:white;}

.projects_view_item #col_right{width:33%; float:right;}
.projects_view_item #col_left{width:66%; float:left;}

/*.projects_view_item #col_left .direct_link_box{display:none; float:right; margin:3px;}
.projects_view_item #col_left .direct_link_box a{}
.projects_view_item #col_left .direct_link_box a:hover{color:rgb(127,183,192); background-color:transparent;}
*/
.projects_view_item #col_left .topics {text-align:left; padding:15px;}
.projects_view_item #col_left .topics .topic{display:inline-block; padding:2px 6px 2px 6px; margin:0 0 3px 0; height:22px; font-size: 0.9em; border-radius:3px; background-color:rgb(0,136,135); color:white;}

.projects_view_item #col_left h1.short_title {margin:0 15px 10px 15px;}
.projects_view_item #col_left h2.title {margin:0 15px 10px 15px;}

.projects_view_item #col_left .duration_box {margin:0 15px 10px 15px;}

.projects_view_item #col_left .short_description {display:none; margin:0 15px 10px 15px;}
.projects_view_item #col_left article.description {margin:0 15px 10px 15px;}

.projects_view_item #col_left .members_cities_involved_container {margin:0 15px 10px 15px;}
.projects_view_item #col_left .members_cities_involved_container > label{clear:both; float:left; margin-top:25px;}
.projects_view_item #col_left .members_cities_involved_container .members{float:left; margin-top:25px;}
.projects_view_item #col_left .members_cities_involved_container .members ul{margin:0;}

.projects_view_item #col_left .members_cities_involved_container .cities{float:left; margin-top:25px;}
.projects_view_item #col_left .members_cities_involved_container .cities ul{margin:0;}

/*.projects_view_item #col_left .members_cities_involved_container .members_cities_involved .members{}
.projects_view_item #col_left .members_cities_involved_container .members_cities_involved .cities{}
.projects_view_item #col_left .members_cities_involved_container .members_cities_involved .cities span{display:inline-block; padding: 15px 0 0 20px; font-weight: bold;}
.projects_view_item #col_left .members_cities_involved_container .members_cities_involved .cities ul{margin:0;}
*/

.projects_view_item #col_right .project_summary {margin:30px 15px 10px 0;}
.projects_view_item #col_right .project_summary label {display:inline; margin:0 15px 0 0;}

.projects_view_item #col_right .banner_container{padding:10px; border:0px solid rgb(245,245,245); margin:10px 10px 30px 10px;}
.projects_view_item #col_right .banner_container .banner_box{position:relative; width:100%; padding-top:55%;  background-size:contain; background-position:center center; background-color:_white;  background-repeat:no-repeat;}
.projects_view_item #col_right .banner_container .banner_box .copyright_info_box{position:absolute; bottom:-10px; right:0; background-color:white; overflow:hidden;}
.projects_view_item #col_right .banner_container .banner_box .copyright_info_box .copyright_info{display:inline-block; font-size: 0.6em; padding:0 5px; color:rgb(120,120,120); border:1px solid rgb(179,179,179); border-radius:2px;}
.projects_view_item #col_right .banner_container .banner_box .copyright_info_box .copyright_info span{display:inline-block; width:0; white-space: nowrap; opacity:0;}
.projects_view_item #col_right .banner_container .banner_box .copyright_info_box .copyright_info i{display:inline-block; margin:2px -1px 0 -1px;}
.projects_view_item #col_right .banner_container .banner_box .copyright_info_box .copyright_info:hover span{width:auto; opacity:1;}


.projects_view_item #col_right .url_box {clear:both; margin:0 10px 30px 0; text-align:center;}
.projects_view_item #col_right .url_box a{display:block; font-size: 1.4em;  background-color:rgb(127,183,192); color:white; border:1px solid rgb(127,183,192); border-radius:4px; padding:4px 8px; white-space:nowrap; overflow:hidden;}
.projects_view_item #col_right .url_box a:hover{color:rgb(127,183,192); background-color:white;}
.projects_view_item #col_right .url_box a span{ text-overflow: ellipsis; }
.projects_view_item #col_right .url_box a span i{font-size:0.8em; margin-left:10px; color:rgba(255,255,2255,0.6);}
.projects_view_item #col_right .url_box a:hover span i{color:rgba(127,183,192,0.5);}


.projects_view_item #col_right .social_media_links{margin:0 0 30px 0;}
.projects_view_item #col_right .social_media_links label{display:block;}
.projects_view_item #col_right .social_media_links .links_list{display:block; margin:0 0 20px 0;}
.projects_view_item #col_right .social_media_links .links_list a{display:inline-block; margin-right:8px; padding:3px;}
.projects_view_item #col_right .social_media_links .links_list a i{font-size:2.3em;}
.projects_view_item #col_right .social_media_links .links_list a i img{ height:36px; width:auto; margin:-8px 0 0 0; padding: 0;}

.projects_view_item #col_right .web_links{clear:both; overflow: hidden;}
.projects_view_item #col_right .web_links label{display:block;}
.projects_view_item #col_right .web_links .links_list{display:block;}
.projects_view_item #col_right .web_links .links_list a{display:block;}

.projects_view_item #col_right .contact_box{clear:both; margin:0 15px 30px 0;}
.projects_view_item #col_right .contact_box label{float:left; width:20%;}
.projects_view_item #col_right .contact_box .contact{float:left; width:80%; margin-bottom:10px;}
.projects_view_item #col_right .contact_box .contact a{display:block;}

.projects_view_item #col_right .related_resources_box{clear:both; margin:50px 15px 0 0;}
.projects_view_item #col_right .related_resources_box .related_resources_box_heading{font-weight: bold; margin:0 0 10px 0;}
.projects_view_item #col_right .related_resources_box a.related_resource{display:block; width:80%; border:1px solid rgb(127,183,192); background-color:white; border-radius:3px; margin:0 auto 20px auto; text-align:center; box-shadow:2px 2px 3px 0px rgba(0,0,0,0.2);}
.projects_view_item #col_right .related_resources_box a.related_resource:hover{text-decoration:none; background-color:rgb(127,183,192);}

.projects_view_item #col_right .related_resources_box a.related_resource .banner_container{padding:5px; border-bottom:1px solid rgb(220,220,220); background-color:white; margin:0 0 5px 0; }
.projects_view_item #col_right .related_resources_box a.related_resource .banner_container .banner_box{position:relative; width:100%; padding-top:55%; background-size:contain; background-position:center center;  background-repeat:no-repeat;}

.projects_view_item #col_right .related_resources_box a.related_resource .type{clear:both; display:inline-block; float:right; font-size: 0.7em; color:rgb(179,179,179); border:1px solid rgb(220,220,220); background-color:white; border-radius:5px; padding:2px 4px; margin:0 5px 0 0;}
.projects_view_item #col_right .related_resources_box a.related_resource .title{clear:both; color:black; font-weight: bold; margin:0 5px 5px 5px;}
.projects_view_item #col_right .related_resources_box a.related_resource:hover .title{color:white;}





.projects_view_item .file_box{clear:both; margin:50px 15px 0 15px;}

/*.projects_view_item .file_box .file_box_heading{font-weight: bold; margin:0 0 0 -10px;}*/
.projects_view_item .file_box .file_purpose{margin:30px 0 0 0; font-weight: bold;}
.projects_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); }
.projects_view_item .file_box a.file i{font-size:2.5em; float:left; margin-right:10px; }
.projects_view_item .file_box a.file .file_info{float:left; white-space:_nowrap; padding:0; margin:0;}
.projects_view_item .file_box a.file .file_info .file_name{}
.projects_view_item .file_box a.file .file_info .file_type_size{}
.projects_view_item .file_box a.file .file_description{display:block; padding:0 10px 0 0;}

.projects_view_item .title_box{margin:10px;}
.projects_view_item .title_box h1.title{ color:black; }
.projects_view_item .title_box h2.subtitle{ color:black; }

/*.projects_view_item .article_box {}
.projects_view_item .article_box article.article{color:rgb(50,50,50); margin:10px;}
*/
.projects_view_item .download_box{ border:1px solid rgb(240,240,240); border-radius:2px; margin:10px; padding:10px; }
.projects_view_item .download_box .download_title{ background-color:rgb(240,240,240); font-size: 0.9em; color:rgb(179,179,179); margin:-10px -10px 10px -10px; padding-left:10px;}
.projects_view_item .download_box .download_item{}
.projects_view_item .download_box .download_item a{padding:2px 8px;}
.projects_view_item .download_box .download_item a .file_meta_info{font-size: 0.8em; margin-left:10px;}






















/*********************************************/
/* Back Button
/**********************************************/
.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){

    .projects_row .projects_item_container {
        width: 100%; 
        margin: 0px;
        padding: 10px;
    }
    
}




/* < 768 */
@media only screen and (max-width: 767px){

  .projects_view_item #col_right{width:100%;}
  .projects_view_item #col_left{width:100%;}

}






