@import url('https://fonts.googleapis.com/css?family=Lato:400,400i,900');
/**
 * 
 * light blue #1d6ec5  deep blue #174678
 * lighht beige # #ffeccb   deep beige #c5af89
 * brown #786748
 *
 */

#first-time, h1.page-header {
    display: none;
}

body{
    font-family: 'Lato',Helvetica,Arial, sans-serif;
    line-height: 1.55;
    color: #555;
    font-size: 15px;
}
a { color: #1d6ec5}
a:hover { font-weight: 900; }
p{margin: 0 0 20px;}

.bgbeige {
    background: #ffeccb ;
    color: #174678;
    padding: 20px 20px;
    margin-bottom: 30px;
    position: relative;
    
}
.bgbeige::before {
    position: absolute;
    top: 0;
    left: 0;
    content:'';
    height: 3px;
    width: 50px;
    background: #174678;
}
/* TOP BAR */
.topbar{
/*    background: #dfd03a;*/
/*    padding: 15px 0 5px 0;*/
    text-align: right;
}
.language-switcher-locale-url {
    padding: 10px 0;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;

}
.topbar .language-switcher-locale-url ul, 
.topbar .language-switcher-locale-url li{
    margin: 0;
    padding: 0;  
}
.topbar .language-switcher-locale-url li{
    display: inline-block;
}
.topbar .language-switcher-locale-url li a{
    color: #111;
    padding: 0 6px;
}
.topbar .language-switcher-locale-url li.active a{
    font-weight: 900;
}

#block-block-4 ul{
    padding: 10px 0;
}
#block-block-4 ul, #block-block-4 li{
    padding: 0;
    margin: 0;
    list-style: none;
}
 #block-block-4 li{
    display: inline-block;
     padding: 0 6px;
     font-size: 1.3em;
}

/* navigation */
.navbar-header .logo img{
    height: 100px;
    width: auto;
}

.navbar-default {
    background: none;
    border-bottom: none;
}
.navbar-default .navbar-nav > li > a {
    color: #174678;
}

.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
    color: #c5af89;
    font-weight: 900;
    background: none;
    box-shadow: none;
/*
        background: -webkit-linear-gradient(to right, #c94b4b, #4b134f);  
        background: linear-gradient(to right,  #c94b4b, #4b134f); 
        -webkit-background-clip: text;  
        -o-background-clip: text;  
        background-clip: text;
*/
}
    
   
}
.navbar-default .navbar-nav>li>a {
    color: #174678;
}
 .active-trail.dropdown{
    position: relative;
}
.active-trail.dropdown::after {
    content: '';
    width: 0; 
    height: 0; 
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid #c5af89;
    position: absolute;
    bottom: -10px;
    left: 50%;
    z-index: 20px
}

.navbar {
    margin-bottom: 0;
    box-shadow: none;
    border: none;
    position: relative;
}
.front .navbar::after {
    display: none; 
    
}
.navbar::after {
    content: '';
    width: 100%;
    height: 15px;
    position: absolute;
    right: 0;
    bottom: -30;
    display: block;
    background: #c5af89;
/*    background: #1d6ec5;*/
}
.front .navbar {
    margin-bottom: 0;
}
.main-container {
    padding-top: 100px;
}
.not-front .main-container {
    padding-bottom: 100px;
}


/* side navigation */
#block-menu-menu-blognewsmenu,
#block-menu-menu-about-sub-menu{
    border-left: solid 2px #174678;
}

/* slider */
.featuredslider img {
    width: 100%;
    height: auto;
    position: relative;
}

.featuredslider .view-content .slide__content::before {
    content: '';
    top:0;
    left:0;
    width: 60%;
    height: 100%;
    position: absolute;
    z-index: 20;
    background: 
  radial-gradient(ellipse 70% 100% at top left, rgba(29,110,197,0.6), transparent),   
               radial-gradient(ellipse 70% 100% at bottom left, rgba(23,70,120,0.6), transparent),
               linear-gradient(to right, #111 20%, transparent);
  background-size: 100% 80%, 100% 80%, 100% 100%;
  background-position: top left, left 100%, top left;
  background-repeat: no-repeat;
}

.featuredslider #block-views-slider-block{
    position: relative;
}
.featuredslider #block-views-slider-block .views-field-body{
    position: absolute;
    bottom: 30%;
    left: 10%;
    width: 25%;
    color: #fff;
    z-index: 90;
}
.featuredslider #block-views-slider-block a {
    color: #fff;
}
.featuredslider #block-views-slider-block .slick-arrow::before{
    color:#1d6ec5;
}
.slick-slider {
    margin-bottom: 0;
}





/*tagline */
.tagline {
    padding: 80px 0 50px 0;
    background: #ffeccb;
    text-align: center;
    font-weight: 400;
    font-style: italic;
    font-size: 1.6em;
    color: #174678;
}

/* social */
.social {
    padding: 50px 0;
    background: #79151d;
    background: -webkit-linear-gradient(to right, #174678, #1d6ec5 );  
    background: linear-gradient(to right, #174678, #1d6ec5 ); 
    text-align: center;
    color: #fff;
}
.social .socialdescription, .social #slick-views-tweets-2-slider{
    font-weight: 400;
    font-style: italic;
    font-size: 1.3em;
}
.social .socialdescription p{
    font-size: 1.5em;
    padding-top: 20%;
/*    text-transform: uppercase;*/
    font-weight: 900;
    color: rgba(255,255,255,0.4)
}
.region-social-left h2.block-title {
    font-size: 1.3em;
    text-transform: uppercase;
    font-weight: 400;
    margin-top:0;
}
#block-block-8 {
    font-size: 1.9em;
}
#block-block-7 a .fa {
    color: #fff;
    font-size: 1.5em;
}
#block-block-7 ul, #block-block-7 li {
    padding: 0;
    margin:0;
    list-style: none;
}

.social #slick-views-tweets-2-slider a {
    color:#ffeccb;  
}
.social #slick-views-tweets-2-slider a:hover {
    color: #c5af89;
    text-decoration: none;
}
#block-views-tweets-block .slick__arrow {
     top: -15%; 
}
#block-views-tweets-block .slick-arrow::before{
    color:#ffeccb;
}
#block-views-tweets-block .slick-next {
    right: 30%;
}
#block-views-tweets-block .slick-prev {
    left: 30%;
}

#block-block-14 p a {
    margin-top: 20px;
    border: 0;
    background: #ffeccb;
    padding: 8px 10px;
    border-radius: 0;
}


/* internship */
.field-name-title-field h1{
    color: #174678;
}
.node-type-job #block-system-main .col-sm-4 {
    color: #174678;
    background: #ffeccb;
    padding-top: 40px;
    padding-bottom: 50px;
}
.node-type-job  .field-name-field-status,
.node-type-job .field-name-field-close-date{
    padding-bottom: 20px; 
    margin-bottom: 30px;
    position: relative;
    display: block;
}
.node-type-job  .field-name-field-status::after,
.node-type-job .field-name-field-close-date::after{
    width: 50px;
    content: '';
    height: 1px;
    background: #174678;
    border-bottom: solid 2px #174678;
    bottom: 0;
    left: 0;
    position: absolute;
}
#block-views-jobs-block{
    margin-top: 50px;
    border-top: solid 1px #ffeccb;
    padding-top: 50px;
}
#block-views-jobs-block h2.block-title{
    color: #174678;
}
/* contact */
#block-block-1 {
    background: #ffeccb;
    padding: 50px 40px 80px 40px;;
}
#block-block-1 h2{
    color: #174678;
    text-transform: uppercase;
    font-size: 1.4em;
}
.contact-form input {
    border-radius: 0;
    box-shadow: none;
    border: none;
    border-bottom: solid 1px #174678;
}
.contact-form textarea {
    border-radius: 0;
    box-shadow: none;
    border: none;
    border-bottom: solid 1px #174678;
}
.contact-form .grippie {
    display: none;
}
.contact-form button{
    background: #174678;
    color: #ffeccb;
    border-radius: 0;
    border: 0;
    text-shadow: none;
}

/* webform */
.node-type-webform input{
    border-radius: 0;
    box-shadow: none;
    border: none;
    border-bottom: solid 1px #174678;
}
.node-type-webform select{
    border-radius: 0;
    box-shadow: none;
    border: none;
    border-bottom: solid 1px #174678;
}
.node-type-webform textarea {
    max-width: 550px;
    border-radius: 0;
    box-shadow: none;
    border: none;
    border-bottom: solid 1px #174678;
}
.node-type-webform .grippie  {
    display: none;
}
.node-type-webform .field-name-body {
    padding-bottom: 60px;
}
.webform-component-checkboxes .form-item {
    display: inline-block;
    padding: 5px 40px 5px 0;
}
.node-type-webform button{
    background: #174678;
    color: #ffeccb;
    border-radius: 0;
    border: 0;
    text-shadow: none;
}

#block-block-10, #block-block-12 {
    padding: 20px 10px;
    background: #ffeccb;
}
#block-block-11,#block-block-13 {
    background: #174678;
    padding: 50px 10px;
    color: #fff;
}

/* blogs */
.page-news-blogs .main-container , .node-type-article .main-container  {
    padding-top: 100px;
}

.articles_recent {
    padding: 10px 0 100px 0;
}
.view-mode-compact_teaser .field-name-title-field, 
.view-mode-compact_teaser .field-name-body.field-type-text-with-summary{
    padding-right: 30px;
}
.node-article.node-teaser .field-name-field-category {
    font-size: 0.9em;
    color: #c5af89;
    text-transform: uppercase;
}

#block-views-news-blogs-block-1 h2.block-title{
    text-transform: uppercase;
    text-align: center;
    padding: 50px 0;
    font-weight: 900;
    line-height: 2em;
    color: #174678;
}

#block-views-news-blogs-block-1 .views-row{
    padding: 10px 0;
    margin: 10px 0;
}
#block-views-news-blogs-block-1 .field-name-node-link a{
    width: 100px;
    display: block;
    padding: 5px 0;
    margin: 10px 0 0 0;
    border-radius: 20px;
    text-align: center;
    height: 35px;
    line-height: 25px;
}
#block-views-news-blogs-block-1 .field-name-node-link a:hover{
    text-decoration: none;
    color: #174678;
    background: #ffeccb;
    
}
#block-views-news-blogs-block-1 h5{
    padding: 0 0 5px 0;
    font-size: 1.1em;
    font-weight: 900;
    margin-top: 0;
}
.node-type-article .field-name-field-image {
    padding-bottom: 30px;
}
.node-type-article .field-name-title-field{
    color: #174678;
}
.node-type-article .field-name-post-date {
    padding: 5px 0 5px 5px;
    margin: 30px 0;
    color: #c5af89;
    text-transform: uppercase;
    font-weight: 400;
}
.node-type-article .field-name-post-date .field-label{
    font-weight: 400; 
    padding-right: 10px;
}
.view-id-news_blogs .views-row{
    padding: 20px 0;
    margin: 20px 0;
    border-bottom: dotted 1px #c5af89;
}

/* mail chimp*/
.front .mailchimp-signup-subscribe-form {
    width: 60%;
    margin:0 18%;
}

#block-mailchimp-signup-adif-on-newsletter {
    background: #1d6ec5;
    color: #fff;
    margin-top: 50px;
    padding: 35px 30px;
}
#block-mailchimp-signup-adif-on-newsletter button , 
#block-mailchimp-signup-african-democracy-in-focus- button {
    margin-top: 20px;
    border: 0;
    background: #ffeccb;
    border-radius: 0;
}
#block-mailchimp-signup-adif-on-newsletter input ,
#block-mailchimp-signup-african-democracy-in-focus- input {
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    border-bottom: solid 1px #1d6ec5;
    color: #fff;
}
#block-mailchimp-signup-adif-on-newsletter input {
    border-bottom: solid 1px #ffeccb;
}
#block-mailchimp-signup-adif-on-newsletter input:focus ,
#block-mailchimp-signup-african-democracy-in-focus- input:focus {
    box-shadow: 0 0 5px rgba(81, 203, 238, 1);
    border: 1px solid rgba(81, 203, 238, 1);
}
#block-mailchimp-signup-adif-on-newsletter .form-item-mergevars-email 
#block-mailchimp-signup-african-democracy-in-focus- .form-item-mergevars-email{
    margin-top: 20px;
}
/* team */
.page-team .view-id-team .views-row .view-mode-teaser{
    padding: 20px 0 20px 0;
    margin: 30px 0;
    position: relative;
}
.page-team .view-id-team .views-row .view-mode-teaser::after{
    bottom: 0;
    left: 0;
    width: 80px;
    content: '';
    height: 4px;
    
    position: absolute;
    background: #174678;  
}

/* about page*/
.node-type-page hr {
    margin-top: 20px;
    margin-bottom: 20px;
    border: 0;
    border-top: 1px solid #c5af89;
}

.node-type-page .field-name-title-field h1 {
    color: #174678;
    padding-bottom: 20px;
}
.page-node-2 .field-name-title-field{
    font-size: 1.8em;
    font-weight: 900;

}
.page-node-41 h3 {
    color: #174678;
    font-size: 1.4em;
    position: relative;
    margin-bottom: 20px;
}
.page-node-41 h3::after {
    content: '';
    position: absolute;
    width: 40px;
    bottom: -10px;
    left: 0;
    border-bottom: solid 3px #c5af89;
    
    
}
/* footer */
.footer{
    background: #174678;
    color: #fff;
    padding: 50px 0 10px 0;

}
.footer h2.block-title {
/*    color: rgba(255,255,255,0.7);*/
    color: #ffeccb;
    font-size: 1.2em;
    text-transform: uppercase;
    font-weight: 400px;
}
#block-block-5 {
    color: #fff;
    text-align: center;
}

/* focus page */
.page-focus .view-id-focus_areas .fa{
    font-size: 1.6em;
    color: #c5af89;
    margin-bottom: 10px;
}
.view-id-focus_areas.view-display-id-page .views-row{
    padding: 20px 0 30px 0;
    margin-bottom: 30px;
    border-bottom: solid 1px #c5af89;
}
.view-id-focus_areas.view-display-id-page .views-row.views-row-3{
    border-bottom: none;
}
/* focus areas */
#block-views-focus-areas-block{
    padding-bottom: 30px;
    text-align: center;
}
#block-views-focus-areas-block .fa{
    font-size: 2em;
    color: #c5af89;
    margin-bottom: 20px;
}

#block-views-focus-areas-block h2.block-title{
    text-transform: uppercase;
    text-align: center;
    padding: 10px 0;
    font-weight: 900;
    line-height: 1.5em;
    color: #174678;
}
#block-views-focus-areas-block .views-row{
/*    box-shadow: -4px 0 10px 0 rgba(60, 60, 60, 0.5);*/
    min-height: 320px;
    
}
#block-views-focus-areas-block .views-field-view-node a,
.node-focus-area.node-teaser .field-name-node-link a{
    width: 100px;
    display: block;
    padding: 5px 0;
    margin: 10px auto;
    border-radius: 20px;
    text-align: center;
    height: 35px;
    line-height: 25px;
}
#block-views-focus-areas-block .views-field-view-node a:hover,
.node-focus-area.node-teaser .field-name-node-link a:hover{
    text-decoration: none;
    color: #174678;
    background: #ffeccb;
    
}
.node-focus-area.node-teaser .field-name-node-link a {
    margin: 10px 0 0 0;
}
.node-type-focus-area .field-name-title-field {
    color: #174678;
}
.node-type-focus-area .field-name-field-focus-icon .fa{
    font-size: 3em;
    padding: 60px 0;
    display: block;
    color: #174678;
    text-align: center;
    background: #ffeccb;
    
}
#block-views-partners-block .views-field-field-partner-logo{
    padding-top: 10px;
}
#block-views-partners-block .views-field-field-partner-logo img{
    width: 80%;
    max-height: 100px;
}

/* gallery */
.node-albums .field-name-field-album-photos .field-item{
    float: left;
    padding: 5px 5px 5px 5px;
    margin: 5px 5px 25px 5px;
    box-shadow: -2px 0 5px 0 rgba(60, 60, 60, 0.5);
    background: #ffeccb;
    
}
.node-albums .field-name-field-album-photos img{
    -webkit-transition: opacity .5s ease-in-out;
    -moz-transition: opacity .5s ease-in-out;
    -ms-transition: opacity .5s ease-in-out;
    -o-transition: opacity .5s ease-in-out;
    transition: opacity .5s ease-in-out;
}
.node-albums .field-name-field-album-photos img:hover{
    opacity: 0.7;
    background: #174678;
}
.node-video.node-teaser{
    margin-bottom: 30px;
}
.node-video.node-teaser .field-name-field-video .field-item{
/*    float: left;*/
    padding: 5px 5px 5px 5px;
    margin: 5px 5px 25px 5px;
    box-shadow: -2px 0 5px 0 rgba(60, 60, 60, 0.5);
    background: #ffeccb;
    
}

/* newsletter page */
.view-id-newsletter.view-display-id-page .views-row .node-teaser{
    padding: 20px 5px;
    margin: 20px; 0;
    position: relative;
    background: #efefef;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}
.view-id-newsletter.view-display-id-page .views-row .node-teaser::before{
    position: absolute;
    top:0;
    left:0;
    content: '';
    width: 50px;
    height: 4px;
    background: #c94b4b;
    background: -webkit-linear-gradient(to right, #4b134f, #c94b4b);  
    background: linear-gradient(to right, #4b134f, #c94b4b); 
}
#block-block-2 h2.block-title {
    text-transform: uppercase;
    font-size: 1.2em;
    color: #174678;
}


@media screen and (min-width: 768px) {
    
   #block-views-focus-areas-block .views-row-2 {
    -webkit-border-image: -webkit-linear-gradient(top,#ffeccb 0%,#ffeccb 50%,#ffeccb 100%) 1 stretch;
    border-image: linear-gradient(to bottom,#fff 0%,#ffeccb 50%,#fff 100%) 1 stretch;
    border-style: solid;
    border-width: 0 3px 0 3px;
    }
    
    ul.nav li.dropdown{
        color: #174678;
        font-size: 16px;
        box-shadow: none;
        font-weight: 900;
        padding: 15px 10px 15px 5px;
        line-height: 20px;
    }
    ul.nav li.dropdown>a{
        padding: 0 15px 0 15px;
    }
    ul.navbar-nav li>a {
        font-weight: 900;
        color: #174678;
        font-size: 16px;
        box-shadow: none;
        line-height: 20px;
        
    }
    ul.navbar-nav {
        margin-top: -60px;
        float: right;
        padding: 10px 0;
    }0
    .dropdown-menu > .active > a, .dropdown-menu > .active > a:hover, .dropdown-menu > .active > a:focus {
        color: #174678;
        text-decoration: none;
        background-color: #fff;
     }

    ul.nav li.dropdown>ul.dropdown-menu {
        display:block;
        visibility:hidden;
        opacity:0;
        transition:visibility 0s linear 0.5s,opacity 0.5s linear;
        }
    ul.nav li.dropdown:hover>ul.dropdown-menu {
        visibility:visible;
        opacity:1;
        transition-delay:0s;
  }  
}