
/******* Mobile******/
@media only screen and (min-device-width:320px) and (max-device-width:480px) and (orientation:portrait){}



@media only screen and (min-device-width:320px) and (max-device-width:767px){

.wrapper { overflow: hidden;}

.text-hide{ margin-bottom: 0px;;}

.navbar-toggler-icon{ width: 35px; height: 35px;}
    
.logo1 {width: 180px; height: 60px;}

.navbar-light .navbar-toggler{ border-color:transparent;}
/* #mainHeader .bg-light{margin-left:-15px; margin-right:-15px;} */

#navbarSupportedContent{  width: 100%; margin-top: 15px; position: relative !important;}
#navbarSupportedContent ul li { margin-right:0px; padding: 12px 15px;}
/* #navbarSupportedContent ul li ul li a:hover { background-color: none; color: #333; font-weight: 600;} */
#navbarSupportedContent ul li ul li{ padding: 4px 15px !important;}
#navbarSupportedContent ul li ul li a { color: #333;}

/* #mainHeader .dropdown-menu{background:rgba(226, 226, 226, 0.8);} */

#navbarSupportedContent .dropdown-menu {background:#ccefd8; border: none;}

.sidebar-nav .navbar-nav .dropdown-menu { position: relative !important;  float: none; top: 0px !important; height:auto;}
.sidebar-nav .navbar-nav .dropdown-toggle::after{ float:right; margin-top: 10px; }
/* .sidebar-nav .dropdown-item{ padding:8px 2px 8px 15px;} */
.sidebar-nav .navbar {padding-left: 0px; padding-right: 0;}


#navbarSupportedContent .current_page_ancestor a.dropdown-toggle { border-bottom: none;}

#navbarSupportedContent ul li.current-menu-item a { border-bottom: none;}

#homeBanner { margin-top: 70px; height: 50vh;}

#hmBanner1, #hmBanner2, #hmBanner3, #hmBanner4, #hmBanner5, #hmBanner6{ height: 50vh;}

#homeBanner .carousel-caption{right:5%; left:5%; bottom:0; margin-bottom: 0px;}
#homeBanner .carousel-caption h2{ font-size:20px; margin-bottom:10px;}
#homeBanner .carousel-caption p { font-size:18px; font-weight:bold;}

#bannerCaption {padding-top: 50px; padding-bottom: 50px;}
#bannerCaption .hd1 { font-size: 22px;}
#bannerCaption .hd2 { font-size:36px;}

h2.hdng1{ font-size:28px;}
.hmSectionHeading{ font-size:28px !important; margin-bottom: 30px !important;}

#loomingProblem{ background-position: right;  padding: 0px 30px 30px 30px;}

#meetPinbox .leadPara{ font-size: 22px;}

#ourpensionTech .card { margin-bottom: 15px; min-height: auto;}
#ourpensionTech {min-height: auto; margin-top: -60px; padding-top: 40px;}

#ourguidance { margin-top: 80px;  background-size: 90%;  min-height: 980px; }

#ourwork{ padding-top: 50px; padding-bottom: 50px;}
#ourwork .card{ min-height: auto; margin-bottom: 15px;}

#hmGlobalDev{padding: 50px 0;}

#ourpartners .card { min-height: auto;}
#ourpartners .card-img {  margin-top: 0px; }

#page_navigation{ position: relative; top: 40px;}

#bgRequest{ padding: 0px;}

#ftCol2{ margin-top: 30px;}
#ftCol3{ margin-top: 30px;}


.disblock { display: none;}
.disnone { display: block; }

#whatweDoRw, #advocacyRw { margin-top: 50px;}
#updatesRw { margin-top:50px;}
#updatesRw h2{ margin-bottom:0px;}

/* #cardCarousel{ margin-top:30px;} */

#mainFooter h2 { margin-bottom: 10px; margin-top: 15px;}

.whatwecol, .pensiontechcol{ text-align:center;}
.colBrdr{ border-right:0px !important;}

#pensiontechHr{ display:none;}

#advocacyRw h2{ text-align:center;}

#mainFooter {   background-image: none; padding-bottom: 30px; margin-top: 30px;}
.articleBoxPaper .text-muted{ position:relative;}

#innerBanner{ height:150px;  margin-top: 70px !important }

#innerPage{ margin-top: 96px;}
#innerPage h2{ margin-top: 30px; margin-bottom: 15px;}

#resourcesBanner { min-height: 170px; height:auto; padding-bottom:20px; background-position:top center; }

.articleBoxPaper img{ margin-right:10px;}

.rwBenefit h3{font-size:20px; margin-top:8px;}

.colGift { margin-top: 20px;}
.changingRw { margin-top: 20px;}
.changingRw .card-title{margin-top: 10px;}

.rwKeyFeatures ul{ margin-bottom: -12px;}
#requestForm {padding: 20px 20px;}


.advantageRw { margin-bottom: 10px;}
.advantage h3{ margin-top:20px;}

.changingRw .card{ margin-bottom:15px;}

#aboutRightImg{ margin-top:20px;}

#screenshotPinbox{ /*margin-top:96px;*/ margin-top:50px;}

#rw-partnerCarousel .customNavigation{ margin-top:0;}

#logosdg{ margin-top:10px; margin-bottom:30px;}


.slider-thumbs.owl-carousel.owl-loaded.owl-drag button.owl-next { position: absolute; top: 35%; right: 12%;}
.slider-thumbs.owl-carousel.owl-loaded.owl-drag button.owl-prev { display: block; position: absolute; left: 12%; top: 35%;}

.slider-thumbs.owl-carousel.owl-loaded.owl-drag button.owl-next span { font-size: 70px; color: #1b9ea8;}
.slider-thumbs.owl-carousel.owl-loaded.owl-drag button.owl-prev span {font-size: 70px; color: #1b9ea8;}
.everywheresec { margin-top: 0px !important;  padding-bottom: 0;}
.everywheresec h2 { width: 80%; margin-top: 0px; top: 0px;}

.africainnersec { display: block; margin-bottom: 0;}
.africainnersec a.overviewbuttoncls { margin-top: 20px;}

.africainnersec p { min-height: auto; height: auto;}
.side-bar img, .side-bar .navigation { display: none!important;}
div.africapagesec .side-bar { width: 100%!important; position: initial!important; float: left!important; margin-bottom: 50px!important;}
div.africapagesec { margin-top: 50px !important;}
div.africapagesec .main-content { margin-left: 0; top: 40px;}
select#wherewework { width: 100%;}
div.africapagesec section {padding-left: 0; padding-top: 88px;}
.africatopsecsty h2 { font-size: 30px; font-weight: 600; color: black; width: 86%; float: left;}
.africatopsecsty img { max-width: 80px; width: 13%; height: auto;}
.africamainsec { margin-top: 0px;}
div.africapagesec section:last-of-type { height: auto;}


.videoImgWrapper .videoImg{ /*height: 190px;*/ height: auto;}
#mediaLibrary .card{ min-height: auto;}

.pinModelWrapper{ margin-top: 70px !important;}
.supplySideSolutions__bgSec{ padding: 20px 0 40px 0;}
.comprehensive__bgSec{ padding: 40px 0 40px 0;}
.demandSideSolutionsec{ padding: 20px 0 40px 0;}
.howItWorkSec{ padding: 20px 0;}


.advantageWrapper{margin-top: 30px !important;}

.giftpensionhowitworks{ padding: 30px 0; text-align: center;}

.giftpensionhowitworks figure img {  position: relative; }
.giftconsec { width: 100%; margin: auto;}
.howitworksgiftpentionrightsec h4{ font-size: 20px; margin-bottom: 8px;}

#myScrollspy { margin-bottom: 0px !important;}

#countryContent section{ padding-bottom: 20px;}

div.africapagesec section:last-of-type{    padding-bottom: 80px !important;}

.toolkitRw p{ margin-bottom: 16px;}

.bookCard{ padding: 10px 5px;}
.bookCard .card-body img { border-radius: 10px;}

.wrap-publications-box .f41-tab { display: block; float: left; width: 100%; margin-right: 30px; margin-top: 0px;}
.downloadSec { float: none; margin: 0 auto; width: 57%;}
.paginationNew { margin: 0;}

#videoLibrary .africapagesec{ margin-top: -80px !important;}
#countryContent h2{ font-size: 24px;}

#latinVideos .videoImg { height: auto !important;}

#videoBanner{ background-position: center;}


}





@media only screen and (min-device-width:320px) and (max-device-width:767px) and (orientation:landscape){
.proImg img{ width:100%;}
/* .navbar-collapse {
    position: absolute;
    top: 54px;
    left: 0;
    padding-left: 15px;
    padding-right: 15px;
    padding-bottom: 15px;
    width: 100%;
}
.navbar-collapse.collapsing {
    height: auto;
    -webkit-transition: left 0.3s ease;
    -o-transition: left 0.3s ease;
    -moz-transition: left 0.3s ease;
    transition: left 0.3s ease;
    left: -100%;
}
.navbar-collapse.show {
    left: 0;
    -webkit-transition: left 0.3s ease-in;
    -o-transition: left 0.3s ease-in;
    -moz-transition: left 0.3s ease-in;
    transition: left 0.3s ease-in;
}
.navbar-collapse {
    position: absolute;
    top: 54px;
    left: 0;
    padding-left: 15px;
    padding-right: 15px;
    padding-bottom: 15px;
    width: 100%;
}
.navbar-collapse.collapsing {
    height: auto;
    -webkit-transition: left 0.3s ease;
    -o-transition: left 0.3s ease;
    -moz-transition: left 0.3s ease;
    transition: left 0.3s ease;
    left: -100%;
}
.navbar-collapse.show {
    left: 0;
    -webkit-transition: left 0.3s ease-in;
    -o-transition: left 0.3s ease-in;
    -moz-transition: left 0.3s ease-in;
    transition: left 0.3s ease-in;
} */
}







/****** IPADs *********/
@media only screen and (min-device-width:768px) and (max-device-width:1024px){

.navbar-light .navbar-toggler{ border: none !important; position: absolute;right: 0;}

button.gitintouch.dis-b { display: block;}
#homeBanner .carousel-caption{right:5%; left:5%; bottom:0;}
#homeBanner .carousel-caption h2{ font-size:30px;}
#homeBanner .carousel-caption p { font-size:40px; font-weight:bold;}
#bannerCaption {padding-top: 100px; padding-bottom: 100px;}
#bannerCaption .hd1 { font-size: 38px;}
#bannerCaption .hd2 { font-size:69px;}
h2.hdng1{ font-size:38px;}
#whatweDoRw, #advocacyRw { margin-top: 50px;}
#updatesRw { margin-top:0px;}
#updatesRw h2{ margin-bottom:0px;}
#mainFooter h2 { margin-bottom: 10px; margin-top: 15px;}
.whatwecol, .pensiontechcol{ text-align:center;}
.colBrdr{ border-right:0px !important;}
#pensiontechHr{ display:none;}
#mainFooter{ background-image:none; margin-top: 20px; padding-bottom: 30px;}
#innerPage h2{ font-size:28px; margin-top: 30px; margin-bottom: 20px;}
#resourcesBanner { min-height: 350px; height:auto; padding-bottom:20px; background-position:top center; }
.advantageRw { margin-bottom: 10px;}
.advantage h3{ margin-top:20px;}
.navbar-collapse.collapsing { height: auto; -webkit-transition: left 0.3s ease; -o-transition: left 0.3s ease; -moz-transition: left 0.3s ease; transition: left 0.3s ease; left: -100%;}
.navbar-collapse.show { left: 0; -webkit-transition: left 0.3s ease-in; -o-transition: left 0.3s ease-in; -moz-transition: left 0.3s ease-in; transition: left 0.3s ease-in;}
.slider-thumbs button.owl-next { display: block; position: absolute; top: 100px; right: -40px; font-size: 65px; color: #726e6e;}
.slider-thumbs button.owl-next span { font-size: 65px; color: #726e6e;}
.africainnersec p { font-size: 16px; font-weight: normal; color: #5d5d5d; line-height: 24px; min-height: auto; height: auto;}

}




@media only screen and (min-device-width:768px) and (max-device-width:1024px) and (orientation:portrait){

.wrapper { overflow: hidden;}

.logo1 {width: 180px; height: 60px;}

#navbarSupportedContent{  width: 100%; margin-top: 15px; position: relative !important;}
#navbarSupportedContent ul li { margin-right:0px; padding: 12px 15px;}
#navbarSupportedContent ul li ul li{ padding: 4px 15px !important;}
#navbarSupportedContent ul li ul li a { color: #333;}

#navbarSupportedContent .dropdown-menu {background:#ccefd8; border: none;}

.sidebar-nav .navbar-nav .dropdown-menu { position: relative !important;  float: none; top: 0px !important; height:auto;}
.sidebar-nav .navbar-nav .dropdown-toggle::after{ float:right; margin-top: 10px; }
.sidebar-nav .navbar {padding-left: 0px; padding-right: 0;}

#navbarSupportedContent .current_page_ancestor a.dropdown-toggle { border-bottom: none;}

#navbarSupportedContent ul li.current-menu-item a { border-bottom: none;}

#homeBanner{ height: 50vh; margin-top: 70px;}

#hmBanner1, #hmBanner2, #hmBanner3, #hmBanner4, #hmBanner5, #hmBanner6{ height: 50vh;}

#homeBanner .carousel-caption{margin-bottom: 30px;}

.hmSectionHeading{ font-size:28px !important; margin-bottom: 30px !important;}

#loomingProblem{ background-position: left;}

#ourguidance{ margin-top: 80px; background-size: 50%;}

#ourwork{ padding-top: 50px; padding-bottom: 50px;}
#ourwork .card{ min-height: auto; margin-bottom: 15px;}

#hmGlobalDev{ padding: 50px 0;}


#ourpartners .card { min-height: auto;}
#ourpartners .card-img {  margin-top: 0px; }

#page_navigation{ position: relative; top: 40px;}

#bgRequest{ padding: 0px;}

#ftCol2{ margin-top: 30px;}
#ftCol3{ margin-top: 30px;}

#innerBanner { height: 160px; margin-top: 70px !important;  /*background: #fff; -webkit-box-shadow: 1px 1px 2px 1px #d9dcdd; box-shadow: 1px 1px 2px 1px #d9dcdd;*/}
	
.proImg img{ width:60%;}
.projectWrapper:hover .projectDetail{ width:60%; left:138px;}
#advocacyRw h2{ text-align:center;}
#cardCarousel { margin-top:30px;}
.changingRw { margin-top: 30px;}
.colGift {margin-top: 20px;}
#rw-partnerCarousel .customNavigation{top:126px;}
#screenshotPinbox{ margin-top:50px;}
#logosdg{ margin-top:36px;}
/* .navbar-collapse {position: absolute;top: 54px;left: 0;padding-left: 15px;padding-right: 15px;padding-bottom: 15px;width: 100%;} */
.navbar-collapse.collapsing {height: auto;-webkit-transition: left 0.3s ease;-o-transition: left 0.3s ease;-moz-transition: left 0.3s ease;transition: left 0.3s ease;left: -100%;}
.navbar-collapse.show {left: 0;-webkit-transition: left 0.3s ease-in;-o-transition: left 0.3s ease-in;-moz-transition: left 0.3s ease-in;transition: left 0.3s ease-in;}


#innerPage{margin-top: 84px;}
.videoImgWrapper .videoImg{height: 116px;}

#mediaLibrary .card{ min-height: 240px;}

.supplySideSolutions__bgSec {  min-height: auto;  padding: 20px 0 50px 0px;}
.howItWorkSec{ padding: 20px 0 50px 0px;}

div.africapagesec nav.navigation li a{ width: 210px;}

#countryContent section{ padding-bottom: 30px;}
/* div.africapagesec section:last-of-type{ padding-bottom: 30px;} */

.giftpensionhowitworks{ padding: 30px 0;}

.pinModelWrapper{ margin-top: 70px !important;}

.comprehensive__bgSec{ background-position: 80%;}
.demandSideSolutionsec{background-position: left;}

#videoLibrary .africapagesec{ margin-top: -30px !important;}

/* 21.02.2023 Start */
.downloadSec {
    padding: 0;
    margin: 0;
    font-size: 14px;
    text-align: center;
    display: block;
    float: left;
    margin-top: 0px; 
}

.downloadSec img {
    max-width: 14px;
}

.blankSpaceSec { margin-bottom: 80px;}


.wrap-publications-box .f41-tab {
    display: block;
    float: left;
    width: 46%!important;
    margin-right: 30px; 
}

.downloadSec .col-12.p-2 {
    margin: 0;
    padding: 3px!important;
}
.card-img-left {
    max-width: 65px;
}
.downloadSec ul {
    list-style: none;
    display: flex;
}
.downloadSec ul li {
    height: auto;
    line-height: 16px;
}
.downloadSec ul li figure {
    margin: 0;
    float: none;
    margin-bottom: 10px;
    min-height: 23px;
}
.downloadSec ul li figure img {
    max-width: 16px;
    padding-right: 0;
}

.card-img-top {
    /* width: 77%; */
    border-top-left-radius: 10px!important;
    border-top-right-radius: 10px!important;
}
/* 21.02.2023 End */


}




@media only screen and (min-device-width:768px) and (max-device-width:1024px) and (orientation:landscape){

.logo1 {width: 180px; height: 60px;}

#homeBanner{margin-top: 70px;}

#navbarSupportedContent ul li {margin-right: 28px;}

.navbar-expand-lg .navbar-nav .nav-link{padding-right: 10px; padding-left: 10px;}
.navbar-light .navbar-nav .nav-link{font-size: 14px;}
#mainHeader.menu-fixed #navbarSupportedContent ul li.current-menu-item a {border-bottom: none;}
#mainHeader.menu-fixed .logo{background-image: url(../images/logo-pinbox-color.png) !important; width:200px !important;height:75px !important;}
.colGift {margin-top: 20px;}
.footerContact .list-inline-item:not(:last-child){ margin-right:2px !important;}
#rw-partnerCarousel .customNavigation{top:82px;}
#screenshotPinbox{margin-top:50px;}
#logosdg{ margin-top:30px;}
/* .navbar-collapse {position: absolute;top: 54px;left: 0;padding-left: 15px;padding-right: 15px;padding-bottom: 15px;width: 100%;} */
.navbar-collapse.collapsing {height: auto;-webkit-transition: left 0.3s ease;-o-transition: left 0.3s ease;-moz-transition: left 0.3s ease;transition: left 0.3s ease;left: -100%;}
.navbar-collapse.show {left: 0;-webkit-transition: left 0.3s ease-in;-o-transition: left 0.3s ease-in;-moz-transition: left 0.3s ease-in;transition: left 0.3s ease-in;}


#homeBanner{ height: 50vh; margin-top: 70px;}

#hmBanner1, #hmBanner2, #hmBanner3, #hmBanner4, #hmBanner5, #hmBanner6{ height: 50vh;}

#homeBanner .carousel-caption{margin-bottom: 30px;}


#ourpartners .card{min-height: 400px;}

#innerPage{margin-top: 84px;}
.videoImgWrapper .videoImg{height: 116px;}

#mediaLibrary .card{ min-height: 240px;}

}





/* (1920x1080) Full HD Display */ /*@media  screen and (max-width: 1920px)*/
@media  screen and (min-width: 1920px) {
    /* insert styles here */
}


/* iPhone X in portrait & landscape */
@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 812px)
and (-webkit-device-pixel-ratio : 3) {
	 /* STYLES GO HERE */
}


/* iPhone X in portrait */
@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 812px) 
and (-webkit-device-pixel-ratio : 3)
and (orientation : portrait) { 

#cardCarousel{ margin-top: 30px;}

}


/* iPhone X in landscape */
@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 812px) 
and (-webkit-device-pixel-ratio : 3)
and (orientation : landscape) { 

#cardCarousel{ margin-top: 30px;}

#logosdg{ margin-top:36px;}

}





/*iPhone 6, 7, & 8 portrait & landscape*/
@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 667px) { /* STYLES GO HERE */}


/*iPhone 6, 7, & 8 landscape*/
@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 667px) 
and (orientation : landscape) { /* STYLES GO HERE */}


/*iPhone 6, 7, & 8 portrait & landscape*/
@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 667px) 
and (orientation : portrait) { /* STYLES GO HERE */ }



/*iPhone 6, 7, & 8 Plus in portrait & landscape*/
@media only screen 
and (min-device-width : 414px) 
and (max-device-width : 736px) { /* STYLES GO HERE */}


/*iPhone 6, 7, & 8 Plus in  landscape*/
@media only screen 
and (min-device-width : 414px) 
and (max-device-width : 736px) 
and (orientation : landscape) { /* STYLES GO HERE */}


/*iPhone 6, 7, & 8 Plus in portrait*/
@media only screen 
and (min-device-width : 414px) 
and (max-device-width : 736px) 
and (orientation : portrait) { /* STYLES GO HERE */ }



/*iPhone 5 & 5S in portrait & landscape*/
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px) { /* STYLES GO HERE */}


/*iPhone 5 & 5S in landscape*/
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px) 
and (orientation : landscape) { /* STYLES GO HERE */}


/*iPhone 5 & 5S in portrait*/
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px) 
and (orientation : portrait) { /* STYLES GO HERE */ }




@media only screen and (min-device-width:768px) and (max-device-width:1024px) and (orientation:landscape) and (-webkit-min-device-pixel-ratio:2){}
@media only screen and (min-device-width:768px) and (max-device-width:1024px) and (orientation:portrait) and (-webkit-min-device-pixel-ratio:2){}
@media only screen and (min-width:1224px){}
@media only screen and (min-width:1824px){}
@media only screen and (min-device-width:320px) and (max-device-width:480px) and (orientation:landscape) and (-webkit-min-device-pixel-ratio:2){}
@media only screen and (min-device-width:320px) and (max-device-width:480px) and (orientation:portrait) and (-webkit-min-device-pixel-ratio:2){}
@media only screen and (min-device-width:320px) and (max-device-height:568px) and (orientation:landscape) and (-webkit-device-pixel-ratio:2){}
@media only screen and (min-device-width:320px) and (max-device-height:568px) and (orientation:portrait) and (-webkit-device-pixel-ratio:2){}
@media only screen and (min-device-width:375px) and (max-device-height:667px) and (orientation:landscape) and (-webkit-device-pixel-ratio:2){}
@media only screen and (min-device-width:375px) and (max-device-height:667px) and (orientation:portrait) and (-webkit-device-pixel-ratio:2){}
@media only screen and (min-device-width:414px) and (max-device-height:736px) and (orientation:landscape) and (-webkit-device-pixel-ratio:2){}
@media only screen and (min-device-width:414px) and (max-device-height:736px) and (orientation:portrait) and (-webkit-device-pixel-ratio:2){}
@media only screen and (min-device-width:320px) and (max-device-height:640px) and (orientation:landscape) and (-webkit-device-pixel-ratio:2){}
@media only screen and (min-device-width:320px) and (max-device-height:640px) and (orientation:portrait) and (-webkit-device-pixel-ratio:2){}
@media only screen and (min-device-width:320px) and (max-device-height:640px) and (orientation:landscape) and (-webkit-device-pixel-ratio:3){}
@media only screen and (min-device-width:320px) and (max-device-height:640px) and (orientation:portrait) and (-webkit-device-pixel-ratio:3){}
@media only screen and (min-device-width:360px) and (max-device-height:640px) and (orientation:landscape) and (-webkit-device-pixel-ratio:3){}
@media only screen and (min-device-width:360px) and (max-device-height:640px) and (orientation:portrait) and (-webkit-device-pixel-ratio:3){}

@media screen and (-webkit-min-device-pixel-ratio:0){}








