@media (max-width: 767px) {
.home-mob-banner {
display: block;
}
.home-dsktop-banner {
display: none;
}
.container {
max-width: 100%;
}
h3,
h4,
h6 {
font-size: 25px;
}
.page-heading {
font-size: 23px;
margin-bottom: 15px !important;
}
.sticky-top {
position: inherit;
}
.mpadding0 {
padding: 0;
}
.sidenav {
height: 100%;
width: 90%;
position: fixed;
z-index: 1000 !important;
top: 0;
right: -100%;
background-color: #ffffff;
overflow-x: hidden;
transition: 0.5s;
padding-top: 60px;
max-width: 400px;
}
.sidenav a {
padding: 10px 5px;
text-decoration: none;
font-size: 25px;
color: #818181;
display: block;
transition: 0.3s;
}
li#menu-item-6538 {
border: 1px solid #fff !important;
}
li#menu-item-5540 {
border: 1px solid #fff !important;
}
.ddsmoothmenu ul li {
border-bottom: 1px solid #cccccc;
}
.ddsmoothmenu ul li a {
display: inline-block !important;
}
.sidenav .closebtn {
position: absolute;
top: 0;
right: 25px;
font-size: 36px;
margin-left: 50px;
display: block !important;
}
.search-container {
position: absolute;
right: 90px;
}
#search input[type="search"] {
font-size: 22px;
}
.open-menu {
overflow: hidden;
}
.donation-section {
background-position: center;
background-repeat: no-repeat;
background-size: cover; }
.donation-content {
right: 5%;
top: 30%;
} .donation-content h2 {
font-size: 24px;
}
.image-wrapper {
background-color: #cccccc;
height: 100px;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
width: 100%;
margin: 0px 0 0px 0;
float: left;
position: relative;
transition: height 0.5s;
-webkit-transition: height 0.5s;
border-bottom: 1px solid #ffffff;
overflow: hidden;
}
.image-wrapper:hover {
height: 300px;
background-position: left;
}
.mwidth50 {
flex: 0 0 50%;
max-width: 50%;
}
.display-2-column {
display: inline-block !important
}
.achieved {
position: relative;
padding-top: 0px;
}
.achieved .mobile {
top: 15px;
margin: 0 auto;
left: 0px;
right: 0px;
width: 100%;
}
.navbar-toggler {
order: 3;
margin-right: 5px;
}
.menu-donate-btn {
position: absolute;
width: 100%;
bottom: -26px;
text-align: center;
}
button.button22.menu-donate-btn {z-index: 99;}
main {
padding-top: 45px;
}
.navbar-brand {
padding-left: 5px;
}
.spacbtw-sections {
margin-bottom: 30px;
}
.desktop-banner {
display: none;
}
.mobile-banner {
display: block;
}
.home-donation-slide .btn {
background-color: transparent !important;
color: #ffffff !important;
display: none;
padding-left: 0px;
text-align: left;
}
.get-involved .d-flex {
height: 300px;
}
.text-bottom.hover-content h3,
.hover-content h3 {
bottom: 50px;
}
.bg-image {
height: 250px;
}
.card-columns .card {
display: inline-block;
width: 100%;
}
#cd-timeline::before {
left: 9px;
height: calc(100% - 14%);
}
.cd-inner-content {
width: 96%;
margin-left: 12px;
}
.cd-timeline-content {
margin-left: 40px;
}
.image-wrapper.hover {
height: 300px;
}
.home-donation-slide .image-wrapper.hover .btn {
display: block;
}
.home-donation-slide .donation-content h3 {
color: #ffffff;
}
.home-donation-slide .hover .donation-content h3.color-yellow {
color: #F4D034;
}
.home-donation-slide .hover .donation-content h3.color-pink {
color: #EF008C;
}
.home-donation-slide .hover .donation-content h3.color-blue {
color: #0072ce;
}
.get-involved .item {
margin: 0 auto;
}
.owl-carousel {
margin: 0 auto
}
.get-involved .owl-carousel .black-overlay {
background-color: transparent
}
.inner-content .nav-tabs .nav-link {
font-size: 22px;
}
.inner-content table {
font-size: 14px;
}
.inner-content .nav-link {
padding: 5px;
}
.col-6 {
-ms-flex: 0 0 50%;
flex: 100%;
max-width: 100%;
}
.spacbtw-sections .row div>img { margin-right: 10px;
margin-bottom: 10px;
margin-top: 10px;
margin-left: 0px;
}
}
@media (min-width: 600px) and (max-width: 767px) {
.card-columns .card {
width: 47%;
}
}
@media (min-width: 600px) and (max-width: 760px) {
.goal li {
width: 40%;
}
.gallery-wrapper li {
width: 46%;
}
}
@media (max-width: 600px) {
.goal li {
width: 90%;
}
.related-projects li {
display: inline-block;
width: 30%;
margin-right: 1%;
}
.related-view-more-button {
margin-top: 0%;
text-align: left
}
.gallery-wrapper li {
width: 90%;
}
.photos {
line-height: 0;
-webkit-column-count: 2;
-webkit-column-gap: 20px;
-moz-column-count: 2;
-moz-column-gap: 20px;
column-count: 2;
}
}
@media only screen and (max-width: 450px) {
.cd-inner-content {
width: 90%;
}
}