body
{
    /**font-size: 16px;**/ /** 11/15/2016 reverted back **/
    /**font-size: 14px;**/ /** 08/31/2016 **/
    line-height: 19px;
    font-family: "Open Sans",sans-serif;
    /**font-family: OpenSans,sans-serif;**/
}

#topLinks-mobile { display:none; }

h1, h2, h3, h4, .h3 
{
    font-weight: 600;
    color: #101F28;
}
h1
{
    line-height:40px;
}
h3, .h3
{
    line-height:20px;
    font-size:20px;    
}

h4
{
    line-height:22px;
    font-size:16px;    
}

a
{
    /** HNP 
    color: #1cabe2; **/
    color: #22A6F5;
    text-decoration:none!important
}

a:hover, a:focus
{
    color: #12bdfb;
}

hr
{
    border-top: 1px solid #e7ebee;
    margin-top: 20px;
    margin-bottom: 20px;
}

p
{
    color: #81878C;
    /**margin: 0 0 20px;**/
}

/** ************************************************************* **/
/**
.mT5
{
    margin-top: 5px;
}

.mT15
{
    margin-top: 15px;
}
**/
.mT10 {
    margin-top: 10px!important;
}
.mT20 {
    margin-top: 20px!important;
}
.mT30 {
    margin-top: 30px!important;
}
.mB0
{
    margin-bottom: 0!important;
}
.mB10
{
    margin-bottom: 10px!important;
}
.mB20
{
    margin-bottom: 20px!important;
}
.mB30
{
    margin-bottom: 30px!important;
}
.mB50
{
    margin-bottom: 50px!important;
}
/**
.mB5
{
    margin-bottom: 5px;
}
**/

.pT10
{
    padding-top: 10px!important;
}

.pT20
{
    padding-top: 20px!important;
}

.pT30
{
    padding-top: 30px!important;
}
.fs12
{
    font-size: 12px;
    line-height: 17px;
    /**font-family: Open Sans Semibold;**/
}

/**
.border-bottom
{
    border-bottom: 1px solid #dedede;
}
**/
.w100
{
    width: 100%;    
}
/** ************************************************************* **/

.col-md-12, .col-md-9, .col-md-8, .col-md-7, .col-md-6, .col-md-5, .col-md-4, .col-md-3
{ 
    padding-left:10px; 
    padding-right:10px; 
}

.display-table
{
    display: table;
    width: 100%;
    table-layout: fixed;
}

.table-row
{
    display: table-row;
}

.table-cell
{
    display: table-cell;
    vertical-align: middle;
}

/** HNP **/
#portal-header { margin-top: 1px; }

#logo h2, #more-resources h2
{
    font-size: 26px;
    margin-top: 10px;
    margin-bottom: 10px;
}


#topLinks
{
    /** padding:15px 0; **/
    padding: 18px 0 0 0;
    
}

#topLinks .nav > li > a
{
    /**padding: 0 6px;**/
    padding: 0 4px;
}

.nav > li > a:focus, .nav > li> a:hover
{
    background-color:#fff;
}

.navbar-nav > li > a
{
    font-size: 14px;
    line-height: 22px;
    font-weight: 600;
}

.navbar-nav li:last-child a 
{ 
    padding-right:0!important; 
}

.nav .open > a, .nav .open > a:focus, .nav .open > a:hover {
    background-color: transparent;
    border-color: transparent;
}


#all-content
{
    /** HNP
    background: #efefef;**/
    background: #F2F3F6;
}

.page-header
{
    /**margin: 30px 0 0px;**/
    margin: 20px 0 0px;
    /**HNP**/
    border:0;
    /** text-align: center; **/
    padding-left: 5px;
    padding-bottom: 5px;
}

.page-header h2
{
    /**font-size: 24px;**/
    font-size: 23px;
}

.page-sections
{ 
    margin:10px 0 30px 0;
}

.page-section
{
    
    display: inline-block;
    /**margin-bottom: 20px;**/  
}

.dropdown .btn
{
    width: 100%;
    text-align: left;
}

.dropdown .btn span
{
    width:94%;
    overflow: hidden;
}

.page-sections .dropdown-menu 
{
    border-radius:0;
    overflow-y: auto; 
    max-height: 300px;
    width: 100%;
}

.dropdown-menu > li > a
{ 
    white-space: normal;
}

.dropdown-btn, .dropdown-btn:hover, .dropdown-btn:focus, .dropdown-btn:active
{ 
    /**background:#fff!important;**/
    background: #f6f6f6!important;
    border-radius: 0 !important;
    box-shadow: none; 
    outline:none;
    color:#4A4A4A; 
    /**font-size:0.813em;**/
    height:50px; 
    border-color:#dedede;
}

    
.dropdown-btn .fa
{ 
    /**color: #22A6F5; **/
    color: #101F28;
    margin-top: 3px; 
}

.breadcrumb
{
    font-size: 12px; 
    font-weight: normal; 
    /** HNP
    background: #fff;**/
    background: transparent;
    border-radius: 0;
    border: 0; 
    /** 6/22/2017: Moved breadcrumb to header **/
    /** padding: 15px 0; **/
    padding: 5px 0;
    margin-bottom: 10px;
}

.row 
{
    margin-left: -10px!important;
    margin-right: -10px!important;
}

.box
{
    background: #fff;
    /**border: 1px solid #dedede;**/
    border: 1px solid #e7ebee;
    padding: 20px;
    border-radius: 2px;
}

.box h3, .box .h3
{
    margin-top: 0;
}

.input-group .form-control, .form-group .form-control
{
    font-size: 12px;
    height: 31px;
    background: #f6f6f6;
}

.txt-box
{
    border-color:#dedede;
    box-shadow: none;
}


.input-group .form-control:focus, .form-group .form-control:focus
{
    background: #fff;
}

.input-group .form-control, .input-group-btn > .btn 
{
    border-radius: 0;
}

.input-group-btn > .btn
{
    font-size: 12px;
    /**color: #81878C;**/
}

.input-group .dropdown-menu, .form-group .dropdown-menu
{
    font-size: 12px;
}



.custom-btn:hover
{
    /**
    background: #38b1ef;
    border: 1px solid #38b1ef;
**/
}

.image-box
{
    background: #fff;
    border: 1px solid #e7ebee;
    border-radius: 2px;  
}

.img-link
{
    width: 100%;
    border-bottom: 1px solid #ddd;
}

.img-link img 
{
    /**
    display: block;
    margin-left: auto;
    margin-right: auto;
**/
    border-radius: 2px 2px 0 0; 
}
/**
.img-link img 
{ 
    height: auto; 
}
**/ 
.img-title
{
    padding: 0 20px;
}

.img-title a, .about-title a
{
    color: #101F28;
}

.img-title a:hover, .about-title a:hover
{
    color: #81878C;
}

.img-text
{
    color: #4B555A;
    padding: 0 20px;
    display: block;
    margin-bottom: 20px;
    
}

/** accordion **/
.page-description
{
    padding: 0 10px 20px;
}

.panel-default
{
    border-color: #e7ebee;
}

.panel-default > .panel-heading
{
    background-color:transparent;
    padding: 15px 20px;
}

.panel-title 
{
    font-size: 16px;
}

.panel-default>.panel-heading+.panel-collapse>.panel-body
{
    border-top-color: #e7ebee;
}

.panel-group .panel-heading+.panel-collapse > .panel-body
{ 
    /** border-top: 0;**/
    padding: 20px;
}

.panel-body p
{
    color: #4A4A4A;
}

.panel-group .panel
{ 
    /**border-radius: 0;**/
    border-radius: 2px;
}

.panel a > span
{
     display: inline-block;
     width: 100%;
}

.panel .panel-title .fa  
{
    font-size: 16px; 
    margin-top: 5px;
}

.panel .panel-title hr
{
    margin-bottom: 10px;
    border-top: 1px solid #e7ebee;
}

.panel .panel-title .fa-chevron-down
{
    display: inline-block;
    /**color: #22A6F5;**/
    color: #101F28;
}

.panel .panel-title .fa-chevron-up
{
    display: none;
    color: #9B9B9B;
}

.panel.panel-open .panel-title .fa-chevron-down, .panel.panel-open .panel-title hr
{
    display: none!important;
}

.panel.panel-open .panel-title .fa-chevron-up
{
    display: inline-block!important;
}

.panel-heading a:focus, .panel-heading a:visited, .panel-heading a:hover
{
    outline: none;
    color: #101F28; /**#333**/
    text-decoration: none;
}


/**
.odd-col
{
    padding-right: 20px;
}

.even-col
{
    padding-left: 20px;
}
**/
/**

ul.bulleted
{
    margin-left: 0;
    padding-left: 0;
}
ul.bulleted li
{
    font-size: 0.813em;
    list-style: none;
    padding-bottom: 4px;
}
ul.bulleted li a
{
}
ul.bulleted li:before
{
    content: ' ';
    display: inline-block;
    height: 4px;
    width: 4px;
    margin-right: 8px;
    background-color: #808281;
    position: relative;
    top: -3px;
}
**/

/** http://fontawesome.io/icons/ **/

/** ######################################################################################################################################################### **/
/** Home **/

.databank-list ul.list-unstyled li
{
    border-bottom: 1px solid #ddd;
}

.databank-list ul.list-unstyled li a .list-title
{
    color: #101F28;
    padding-left: 10px;
}

.databank-list ul.list-unstyled li a .list-title:hover
{
    color: #81878C;
}

.databank-list ul.list-unstyled li a .fa
{
    /**margin-right: 7px;**/
    font-size: 24px;
    width: 26px;
    text-align: center;
}



/**
.databank-list .list-title
{
    color: #101F28;
}
.databank-list .fa:before
{
font-size: 24px;
}
.databank-list .fa
{
    top:-3px;
}
**/

/**

.databank-list2 .list-group-item
{
    border:0;
    border-bottom: 1px solid #ddd;
    padding: 10px 0;
    margin-bottom: 0;
    background-color:transparent;    
}
.databank-list2 .list-group-item .list-title
{
    color: #101F28;
    font-size: 16px;
    font-weight:600;
    padding-left: 10px;
}
.databank-list .list-group-item .fa
{
    color: #22A6F5;
    font-size: 24px;
}
.databank-list2 .list-group-item .fa:before
{
    
}

**/


/**
.dashboard-menu
{ 
    display: inline-block;
    width: 100%;
}
**/

.view-dashboard
{
   /**margin-top: 5px;**/
    font-size: 14px;
    font-weight: 400;   
}

.read-more
{
    /**margin-bottom: 10px;**/
}

.read-more .fa
{
    /**color: #393F42;**/
    color: #101F28;
    font-size: 12px;
}

.read-more a:hover .fa, .read-more a:focus .fa
{
    color: #81878C;
    /**color: #CCC;**/
}


.highlight-story-section h3
{
    line-height: 27px;
}

.highlight-story-section .fs12
{
    color: #81878C;
    margin-bottom: 10px;
    font-weight: 600;
    /**font-family: OpenSans-Semibold;**/
}

.home-top-box
{
    height: 550px; /** 888888888888888888888888888888888888888888888888888888888888888888888888888 **/    
}
.home-top-box h3
{
    margin-bottom: 15px;
}
.home-bottom-box
{
    height: 380px;
}
    
.home-bottom-box .img-title, .publicatioh-box .img-title
{
    height:70px;
}

#indicator-search input {
	font-family: FontAwesome, "Open Sans",sans-serif;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
}
#indicator-search .dropdown-menu 
{
    position: inherit; /** make the dropdown same width **/
}

.search-btn, .search-btn:active, .search-btn:focus
{
    color: #fff;
    background-color: #22A6F5;
}
.search-btn:hover 
{
    color: #fff;
    /**background-color: #38b1ef;**/
    background-color: #12bdfb;
    /**border: 1px solid #38b1ef!important; **/
}

/** About **/

.about-box
{
    height: 120px;
    /**margin: 15px 0;**/
    margin: 15px 10px;
}
.about-icon
{
    font-size: 35px;
    width: 90px;
    color: #22A6F5;
}
.about-text .fa
{
    vertical-align: text-bottom;
    padding-left: 7px;
}
/** Dashboard **/
.dropdown-box
{
    /**margin-bottom: 40px;**/
    margin-bottom: 30px;
}

.visualization-wrapper
{
    overflow:auto; 
}

/** Publication **/
.publication-wrapper
{
    margin: 20px 100px;
    display: inline-block;
}

/** Indicators **/

.sdg-box
{
    /**height: 180px;**/
    height: 190px;
    margin: 10px 0;
}

.sdg-box .fa-ul > li
{
    padding-left: 15px;
}

.sdg-header
{
    color: #22A6F5;
    padding-bottom: 10px;
}

.sdg-header .fa:before
{
    font-size: 30px;
}

.sdg-list
{
    color: #22A6F5;
}

.indicator-box
{
    padding-left: 30px;
}

.indicator-box ul, .link-box ul, .link-box-inner ul
{
    padding-left: 20px;
}

.link-list
{
    color: #101F28;
    padding-left: 10px;
}

.sdg-list, .indicator-list, .link-list
{
    line-height: 24px;
}

.sdg-list .fa-circle:before
{
    font-size: 7px;
}

.indicator-list a
{
    cursor: pointer;
}

/** SDG/Thematic **/
iframe.databank-report
{
    width: 1098px;
    border:none;
}


/** Monitoring **/
/**.monitoring-wrapper  { margin: 0 40px; }**/
.monitoring-box
{
    height: 562px;
    /**margin: 15px 0;**/
    margin: 15px 10px;
}

.go-to-website
{  
    font-weight: 600;
}

/**.odd-col .go-to-website**/
.go-to-website
{  
    position: absolute;
    bottom:30px;
    right:40px;
}
/**
.even-col .go-to-website
{  
    position: absolute;
    bottom:30px;
    right:30px;
}
**/


#monitoring span.read-more
{
    color: #22A6F5;
    cursor: pointer;
}

#monitoring span.read-more:hover
{
    color: #12bdfb;
}

#monitoring span.read-more:hover .fa
{
    color: #81878C;
}

/** ++++++++++++++++++++++ **/
.modal-body ol 
{
    padding-left: 20px;
}

.modal-body ol li 
{
    padding-bottom: 15px;
}
/** ++++++++++++++++++++++ **/


/** Lending **/
#lending h4
{
    font-size: 18px;
    line-height: 24px;
    margin-top: 0;
    margin-bottom: 5px;
}

.related-link-list li
{
    padding-top: 5px;
    padding-bottom: 5px;
}

.lending-box
{
    margin-bottom: 30px;
    margin-right: 10px;
}

.lending-text-box
{
    padding: 30px 30px 30px 10px;
}

.lending-title
{
    font-size: 18px;
    font-weight: 600;
    line-height: 24px;
}

.lending-description
{
    font-weight: 600;
    line-height: 24px;
    margin-bottom: 10px;
}
/**
.lending-text-box .btn
{
    margin-bottom: 20px;
}

.lending-text-box .btn .fa
{
    font-size: 14px;
}
**/
.download-btn
{
    display: inline-block;
    color: #fff;
    background-color: #22A6F5;
    /**border: 1px solid #337ab7;**/
    border: 1px solid transparent;
    border-radius: 3px;  
    
    padding: 6px 12px;
    margin-bottom: 0;
    font-weight: 400;    
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    
}

.download-btn:hover, .download-btn:focus
{
    background-color: #12bdfb;
}

.download-btn a
{
    color: #fff;
}

.download-btn .fa
{
    font-size: 14px;
}


/** Links **/
.link-box
{
    /**height: 200px;**/
    margin: 15px 5px;
}

.link-middle-row
{
    height: 600px;
}
.link-bottom-row
{
    height: 285px;
}
.link-box-outer
{ 
    margin: 15px 5px;
    background: #fff;
    border: 1px solid #e7ebee;
    padding-bottom: 20px; 
    border-radius: 2px;
}
.link-box-outer h3
{
    padding-left: 20px; 
}
.link-box-inner
{ 
    /**padding: 0 20px 20px 20px;**/
    padding: 0 20px;
}

/** ####################################################################################################################################### **/

@media (min-width: 1200px)
{
    .container { /**width: 1190px; => use bootstrap defoult **/ }  
}
@media (min-width:1120px) and (max-width: 1199px)
{   
    .home-top-box { height: 600px; } /** 888888888888888888888888888888888888888888888888888888888888888888888888888 **/    
}
@media (min-width:1024px)
{   
    /**.container{ width:960px; padding:0!important}
    .container{ width:1160px; padding:0!important; max-width:90%; }**/  
   /** .home-top-box { height: 580px; } **/
}

@media (min-width:992px)
{   
    
}
@media (min-width: 992px) and (max-width: 1119px)
{
       .home-top-box { height: 560px; } /** 888888888888888888888888888888888888888888888888888888888888888888888888888 **/    
}
@media (max-width: 1119px)
{
    .box { padding: 15px 10px; }
    .navbar-nav > li > a { /**font-size: 13px;**/ }
    .navbar-nav .dropdown-menu { /**font-size: 12px;**/ }
    .breadcrumb { /**font-size: 11px;**/ }
    #topLinks { /**padding: 10px 0 0 0;**/ }
    
    .lending-text-box { padding: 20px; }
    .link-box-inner { padding: 0 10px; }
    .link-box-outer { padding-bottom: 15px }
    .link-box-outer h3 { padding-left: 10px; }
    
    
}

@media (max-width:991px)
{
    .box, .image-box, dropdown-box { margin-bottom: 30px; }

    .page-description { margin-bottom: 30px; }
    /**
    .odd-col { padding-right: 10px; }
    .even-col { padding-left: 10px; }
    **/
    .about-box { margin-top: 0; }
    
    .dropdown-box .row .col-md-3, .dropdown-box .row .col-md-4 { padding-bottom: 10px; }
    .dropdown-box .row .col-md-3:last-child, .dropdown-box .row .col-md-4:last-child { padding-bottom: 0; }
    
    
    .publication-wrapper { margin: 20px 60px; }
    
    /**.odd-col .go-to-website, .even-col .go-to-website { bottom: 40px; right: 30px; } **/  
    .go-to-website { bottom: 40px; right: 30px; } 

    .lending-box { margin-right: 0; } 
    
    .about-box, .monitoring-box { margin-top: 0; margin-right: 0; margin-left: 0; }
    
    .link-bottom-box { margin-top: 0; }
    
    .link-box-inner ul { margin-bottom: 0;}
        
}

@media  (max-width : 767px) 
{
    #topLinks { display: none; } /** HNP **/
    #topLinks-mobile { display: block; margin: 15px 0; }
    #topLinks-mobile .dropdown-menu { width: 100%; border-radius: 0; }
    #topLinks-mobile .dropdown-btn { color: #22A6F5; }
    
    h1 { font-size: 26px; line-height: 30px; }
    
    .publication-wrapper { margin: 20px 20px; }
    /**.monitoring-wrapper  { margin: 0 20px; }**/    
}


@media (max-width : 567px)
{
    .about-box { height: 140px; }
    .about-icon { font-size: 25px; width: 60px; }
}

@media (min-width : 568px) and (max-width:991px)
{
    #monitoring .col-md-6  { width: 50%; float: left; }
    .monitoring-box { height: 560px;}
}
    
@media  (min-width : 480px) and (max-width:991px)
{
    .col-md-3 { width:50%; float:left }
    /**.home-top-box { height: 580px; }**/ /** 888888888888888888888888888888888888888888888888888888888888888888888888888 **/    
    .home-bottom-box { height: 400px; }
    
    #publications .col-md-4, #sdg-indicators .col-md-4 { width: 50%; float: left; }
    .pB0-xm { padding-bottom: 0!important; }
    /**
    #monitoring .col-md-6  { width: 50%; float: left; }
    .monitoring-box { height: 600px;}
**/
}

@media  (min-width : 768px) and (max-width:991px)
{
    .home-top-box { height: 560px; } /** 888888888888888888888888888888888888888888888888888888888888888888888888888 **/    
}

@media  (min-width : 568px) and (max-width:767px)
{
    .home-top-box { height: 580px; } /** 888888888888888888888888888888888888888888888888888888888888888888888888888 **/    
}
@media  (min-width : 480px) and (max-width:567px)
{
    .home-top-box { height: 590px; } /** 888888888888888888888888888888888888888888888888888888888888888888888888888 **/    
}


/** @media  (max-width : 480px) **/
@media  (max-width : 479px) 
{
    .home-top-box { height: 630px; }
    .home-bottom-box { height: 440px; }
    /**.odd-col .go-to-website, .even-col .go-to-website { position:relative; bottom: inherit; right: inherit; float:right; margin-bottom: 10px; }**/ 
    .go-to-website { position:relative; bottom: inherit; right: inherit; float:right; margin-bottom: 10px; }
    .monitoring-box { height: auto; }
    
    .breadcrumb { font-size: 11px; }
}




/** <!-- phase2 --> **/
/** phone:portrait **/
@media (min-width : 320px) and (max-width : 567px)
{

}
/** phone:landscape **/
@media (min-width : 568px) and (max-width : 767px)
{
        
}
/** iPad:portrait/desktop **/
@media (min-width : 768px) and (max-width : 991px)
{/** HNP **/
 /**
    .breadcrumb
    {
        padding: 5px 0 0 0;
    }
**/
}
/** iPad:landscape/desktop **/
@media (min-width : 992px)
{    
   /** .indicatorLinks-mobile, .dropdown-mobile  { display:none } **/
    /**.goal-box, .text-box { border:0; } **/
}

/** HNP **/
/** ******************************************************************************************************** **/
/**@media (min-width: 1024px) and (min-width: 1281px)**/
@media (min-width: 992px) and (max-width: 1199px)
{
       
}