/*-----------------------------------------------------------------------------------
Template Name: Softy - Charity Html Template
Template URI:
Description: Softy - Charity Html Template
Author: Rashadul Islam
Author URI: http://rashadulislam.com/
Version: 1.0
-----------------------------------------------------------------------------------
CSS INDEX
===================
1. Imported Css
2. Home One
2.1 Header Top
2.2 Header Bottom
2.3 Slider Area
2.4 About Area
2.5 Causes Area
2.6 Testimonial Area
2.7 Team Area
2.8 Volunteer Area
2.9 Memories Area
2.10 Donate Area
2.11 Subscribe Area
2.12 Event Area
2.13 Footer Top
2.14 Footer Bottom
3. Home Two
4. Home Three
5. About Us
6. Cause Standard
7. Cause With Sidebar
8. Cause Single
9. Cause Details
10. Event Page
10.1 Event Grid
10.2 Event List
10.3 Event Details
11. Gallery Page
11.1 Gallery Masonary
11.2 Gallery Fullwide
12. Blog Page
12.1 Blog Standard
12.2 Blog Details
13. Contact Area
14. Donate Page
15. All Team Member
-----------------------------------------------------------------------------------*/
@import url('bootstrap.min.css');
/*@import url('New_bootstrap.min.css');*/
@import url('jquery-ui.css');
@import url('icofont.css');
@import url('owl.carousel.min.css');
@import url('animate.css');
@import url('magnific-popup.css');
@import url('slick.css');
@import url('slicknav.css');
@import url('typography.css');
@import url('default-css.css');
/*=============================================
* 1. Imported Css
*=============================================*/
/*@import url('../fonts/css/Roboto.css');*/
/*@import url('https://fonts.googleapis.com/css?family=Amiri|El+Messiri|Tajawal');
@import url(https://fonts.googleapis.com/earlyaccess/notonaskharabic.css);*/
@import url('../fonts/css/Cairo.css');
@font-face {
font-family: 'decotype-thuluth-ii';
src: url('../fonts/decotype-thuluth-ii.ttf') format('truetype');
}
@font-face {
font-family: 'VIP Hakm VIP Hakm';
src: url('../fonts/VIP Hakm VIP Hakm.ttf') format('truetype');
}
/*=============================================
* 2. Home One / 2.1 Header Top
*=============================================*/
.header-top {
/*background: #2a3448;*/
/*background: #d9a862; saeed*/
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding: 10px 10px 10px 10px;
/*background-color: #f6efdd;*/
background-color: #cacaca;
/*height: 200px; saeed increase header height*/
}
.ht-contact {
}
.ht-contact ul {
text-align: left;
margin-top: 5px;
}
.ht-contact ul li {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin-right: 5px;
}
.ht-contact ul li span {
font-size: 13px;
letter-spacing: 0;
color: #fff;
font-weight: 300;
display: block;
overflow: hidden;
line-height: 19px;
}
.ht-contact ul li b {
font-weight: 400;
}
.ht-contact ul li i {
height: 32px;
width: 32px;
border: 2px solid #acacac;
text-align: center;
line-height: 27px;
font-size: 15px;
color: #ffb607;
border-radius: 2px;
margin-right: 12px;
float: left;
}
.ht-donate {
}
.ht-donate a {
}
.btn-area a {
display: inline-block;
height: 40px;
width: 140px;
max-width: 100%;
text-align: center;
border-radius: 4px;
line-height: 40px;
font-size: 14px;
letter-spacing: 0;
}
.btn-style-one a {
/*color: #d9a862;*/
border: 1px solid #d9a862;
color: rgba(2, 35, 76, 0.9);
}
.btn-style-one a:hover {
background-color: #fff;
color: #ffb607;
border: 1px solid #fff;
}
.btn-style-two a {
color: #fff;
border: 1px solid #fff;
}
.btn-style-two a:hover {
background-color: #ffb607;
color: #fff;
border: 1px solid #ffb607;
}
/*=============================================
* END Header Top
*=============================================*/
/*=============================================
* 2.2 Header Bottom
*=============================================*/
.header-bottom {
/*position: absolute;*/
position: sticky; /*saeed*/
/*background: #d9a862;*/ /*saeed*/
/*background-image: url('../../../images/home/Head2.png');*/
/*background: url(../images/home/Head2.png) center center/cover no-repeat;*/
/*background: url(../img/home/Head2.png) center center/cover no-repeat;*/
/*background: rgba(2, 35, 76, 0.9);*/
background: rgba(2, 35, 76, 0.21);
/*background: url(../img/home/Head2.jpeg) center center/cover no-repeat;*/
left: 0;
top: 95px;
width: 100%;
z-index: 9;
-webkit-transition: background 0.3s ease 0s;
transition: background 0.3s ease 0s;
}
.header-bottom.header-fixed {
top: 0 !important;
position: fixed;
/*background: rgba(2, 35, 76, 0.9);*/
/*background: rgb(217, 168, 98);*/
/*background: url(../img/home/Head2.png) center center/cover no-repeat;*/
/*background: rgba(2, 35, 76, 0.9);*/
}
.logo a {
display: inline-block;
}
.logo a img {
max-width: 87%;
}
.logo-text {
float: right;
padding-right: 3px;
padding-top: 45px;
}
.logo-text > h3 > span {
/*border-top: 1px solid #ffac1f;
padding-top: 1px;*/
}
.logo-text > h3 {
margin: 0px 0px 0px 0px;
display: block;
/*font-size: 21px;*/
font-size: 61px;
color: #ffffff;
font-weight: 700;
letter-spacing: 0;
/* text-shadow: 2px 2px 5px #ffac1f; */
text-align: center;
text-transform: uppercase;
}
.logo-text > h4 > span {
/*font-family: Cairo;
line-height: 36px;*/
border-top: 1px solid #ffac1f;
padding-top: 1px;
}
.logo-text > h4 {
/*margin: 10px 0px 0px 0px;
font-size: 18px;
color: #fff6e6;font-weight: 600;
*/
margin: 24px 0px 0px 0px;
/*font-size: 24px;*/
font-size: 24px;
display: block;
color: #fff;
letter-spacing: 0;
text-transform: uppercase;
text-align: center;
font-weight: inherit;
}
.main-menu nav ul li {
display: inline-block;
position: relative;
/* background: rgba(50, 50, 50, 0.2); */
}
.main-menu nav ul li a {
display: block;
font-size: 18px;
font-weight: 700;
/*color: #fff;*/
color: #0b0b15;
padding: 35px 17px;
letter-spacing: 0;
position: relative;
text-transform: uppercase;
}
.main-menu nav > ul > li:first-child > a {
padding-left: 0;
padding-right: 0;
margin-right: 8px;
}
.main-menu nav > ul > li:last-child > a {
padding-right: 0;
padding-left: 0;
margin-left: 8px;
}
.main-menu nav ul li.active > a,
.main-menu nav ul li:hover > a {
color: #e3d6bd;
}
.main-menu nav > ul > li > a:before {
content: '';
position: absolute;
left: 50%;
bottom: 28px;
height: 2px;
width: 60%;
opacity: 0;
background-color: #fff6e6;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.main-menu nav ul li:hover > a:before,
.main-menu nav ul li.active > a:before {
opacity: 1;
}
/*dropdown menu*/
.main-menu .submenu {
position: absolute;
right: 0;
top: 80px;
width: 280px;
background: #fff;
padding: 10px 0px;
border-radius: 2px;
border-bottom: 4px solid #d9a862;
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.1);
-webkit-transform: scaleY(0);
transform: scaleY(0);
-webkit-transform-origin: top;
transform-origin: top;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.main-menu nav ul li:hover .submenu {
-webkit-transform: scaleY(1);
transform: scaleY(1);
}
.main-menu .submenu li {
display: block;
text-align: right;
}
.main-menu .submenu li a {
color: #444;
/*color:#c98e63;*/
padding: 14px 20px;
text-transform: capitalize;
}
.search-btn {
text-align: left;
/*margin-top: 6px;*/
}
.search-btn > i {
cursor: pointer;
color: #fff;
position: relative;
}
.search-btn.active > i:before {
content: "\efb5";
color: #ffb607;
}
.search-form {
position: absolute;
right: -14px;
top: 57px;
width: 300px;
padding: 30px 30px;
background: #fff;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
border-radius: 2px;
opacity: 0;
visibility: hidden;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.search-form.show-hide-search {
opacity: 1;
visibility: visible;
}
.search-form:before {
content: '';
position: absolute;
right: 24px;
top: -28px;
background: transparent;
border: 15px solid transparent;
border-bottom-color: #fff;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
}
.search-form form {
position: relative;
}
.search-form form input {
width: 100%;
background: #fff;
border: 1px solid #f3f0f0;
height: 50px;
padding-left: 15px;
letter-spacing: 0;
color: #444;
border-radius: 2px;
}
.search-form form button {
position: absolute;
right: 0;
top: 0;
height: 50px;
width: 38px;
background: transparent;
border: none;
color: #6d6969;
font-size: 16px;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.search-form form button:hover {
color: #ffb607;
}
/*mobile menu*/
.slicknav_menu .slicknav_menutxt {
display: none;
}
.slicknav_menu {
background: transparent;
margin-top: 21px;
}
.slicknav_menu .slicknav_icon-bar {
height: 2px;
width: 19px;
margin: 3px 0px;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.slicknav_btn {
background-color: transparent;
position: relative;
margin-top: -46px;
}
.slicknav_menu .slicknav_open .slicknav_icon-bar:nth-child(2) {
opacity: 0;
}
.slicknav_menu .slicknav_open .slicknav_icon-bar:nth-child(1) {
-webkit-transform: rotate(45deg) translate(1px, 7px);
transform: rotate(45deg) translate(1px, 7px);
}
.slicknav_menu .slicknav_open .slicknav_icon-bar:nth-child(3) {
-webkit-transform: rotate(-45deg) translateY(-6px);
transform: rotate(-45deg) translateY(-6px);
}
.slicknav_nav {
background: #ca9e5c;
margin: 10px 0px;
padding: 16px 0px 18px;
}
.slicknav_nav a:hover {
/*background: #fefefe none repeat scroll 0 0;
border-radius: 0;*/
color: #fff;
}
.slicknav_nav > a {
font-size: 14px;
letter-spacing: 0.01em;
}
.slicknav_menu > a {
position: relative;
top: -13px;
cursor: pointer;
}
.slicknav_nav .slicknav_row:hover {
border-radius: 0;
background: #444;
}
.slicknav_nav li.active > a > a {
color: #ffb607;
}
/*=============================================
* END Header Bottom
*=============================================*/
/*=============================================
* 2.3 Slider Area
*=============================================*/
.slider-area ,.slider-area2 {
position: relative;
}
.slider-item {
height: 643px;
width: 100%;
position: relative;
}
.slider-item:before {
content: '';
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
/*background: rgba(50, 50, 50, 0.2);*/
}
.slider-content {
}
.slider-content h2 {
font-size: 40px;
font-weight: 900;
text-transform: uppercase;
color: #fff;
line-height: 63px;
letter-spacing: 0;
}
.owl-item.active .b_fadup1 {
-webkit-animation: fadeInDown 2000ms ease-in-out;
animation: fadeInDown 2000ms ease-in-out;
}
.slider-area .slider-content h2, .slider-area2 .slider-content h2 {
}
.slider-content p {
font-size: 16px;
font-weight: 400;
color: #fff;
margin-top: 22px;
}
.owl-item.active .b_fadup2 {
-webkit-animation: fadeInDown 1000ms ease-in-out;
animation: fadeInDown 1000ms ease-in-out;
}
.slider-content .btn-area {
margin-top: 60px;
}
.slider-content .btn-style-two a {
margin: 0px 8px;
}
.owl-item.active .b_fadup3 {
-webkit-animation: fadeInUp 800ms ease-in-out;
animation: fadeInUp 800ms ease-in-out;
}
.slider-area .owl-dots, .slider-area2 .owl-dots {
text-align: center;
position: absolute;
/*bottom: 30px;*/
bottom: 2%;
left: 0;
width: 100%;
}
.slider-area .owl-dots .owl-dot, .slider-area2 .owl-dots .owl-dot {
height: 4px;
width: 25px;
background-color: #fff;
display: inline-block;
margin: 0px 6px;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.slider-area .owl-dots .active, .slider-area2 .owl-dots .active {
background-color: #ffb607;
}
/*Slider Area 2*/
/*=============================================
* END Slider Area
*=============================================*/
/*=============================================
* 2.4 About Area
*=============================================*/
.section-title {
text-align: center;
margin-bottom: 16px;
}
.section-title h2 {
font-size: 32px;
font-weight: 700;
color: #333;
letter-spacing: 0;
line-height: 43px;
margin-bottom: 7px;
position: relative;
padding-bottom: 36px;
text-transform: uppercase;
}
.section-title h2:before {
content: '';
position: absolute;
left: 50%;
bottom: 20px;
height: 7px;
width: 100%;
/*background: rgb(217, 168, 98);*/
background: rgba(2, 35, 76, 0.9);
/*background: url(../img/icon/st-bottom.png) center center/contain no-repeat;*/
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.causes-title h2:before {
content: '';
position: absolute;
left: 0;
bottom: -5px;
height: 7px;
width: 100%;
background: rgb(217, 168, 98);
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.section-title.text-theme h2 {
color: #ffb607;
}
.about-area {
}
.about-content {
}
.about-left-img img {
max-width: 100%
}
.about-right-text {
margin-top: -7px;
}
.about-right-text > h2 {
font-size: 30px;
font-weight: 700;
color: #333333;
letter-spacing: 0;
line-height: 32px;
margin-bottom: 33px;
padding-bottom: 14px;
position: relative;
}
.about-right-text > h2:before {
content: '';
position: absolute;
left: 0;
bottom: 0;
height: 4px;
width: 80px;
background: #ffb607;
}
.about-right-text p {
color: #333333;
}
.about-right-text .btn-area {
margin-top: 24px;
}
.about-right-text .btn-area a {
background: #ffb607;
color: #fff;
}
.about-right-text .btn-area a:hover {
background: transparent;
border-color: #ffb607;
color: #ffb607;
}
.donate-count {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
margin-top: 37px;
}
.donate-count .d-single {
-ms-flex-preferred-size: calc(100% * (1/4) - 20px);
flex-basis: calc(100% * (1/4) - 20px);
border: 2px solid #222222;
text-align: center;
}
.donate-count .d-single .icon {
background: #222222;
display: block;
font-size: 31px;
color: #fff;
padding: 8px 0px;
}
.donate-count .d-single h2 {
font-size: 30px;
font-weight: 700;
color: #ffb607;
letter-spacing: 0;
margin-top: 13px;
}
.donate-count .d-single p {
font-size: 14px;
font-weight: 700;
color: #222222;
letter-spacing: 0;
margin-bottom: 7px;
}
/*=============================================
* END About Area
*=============================================*/
/*=============================================
* 2.5 Causes Area
*=============================================*/
.causes-area {
}
.cause-list {
}
.cause-item {
border: 1px solid #e0e0e0;
padding-bottom: 35px;
margin: 5px 5px;
box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.3);
transition: box-shadow 500ms;
}
/*saeed*/
.cause-item:hover {
box-shadow: 0 0px 15px 0 rgba(0, 0, 0, 0.5);
}
.cause-item .cause-thumbnail {
}
.cause-item .cause-thumbnail a {
/*saeed*/
display: block; /*display: inline-block;*/ /*or width:100%;with display: inline-block;*/
max-width: 100%;
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.05);
/*saeed*/
}
.cause-item .cause-thumbnail a img {
max-width: 100%;
/*saeed*/
max-height: 175px;
}
.cause-info {
padding: 0px 20px;
}
.cause-info h2 {
display: block;
font-size: 16px;
font-weight: 700;
color: #000000;
letter-spacing: 0;
margin: 18px 0px 8px;
text-align: right;
height: 70px;
overflow: hidden;
}
.cause-info .progress-h {
height: 7px;
width: 97%;
background: #e0e0e0;
margin: 28px 0px 18px 7px;
}
.cause-info .progress-bar {
/*background: #d9a862;*/
background: rgba(2, 35, 76, 0.9);
height: 7px;
width: 0%;
position: relative;
opacity: 0;
-webkit-transition: all 0.3s ease 0.2s;
transition: all 0.3s ease 0.2s;
}
.cause-info .progress-bar span {
height: 46px;
width: 46px;
border: 4px solid #d9a862;
display: block;
border-radius: 50%;
position: absolute;
left: -20px;
top: -23px;
z-index: 3;
background: #fff;
color: #000000;
text-align: center;
line-height: 38px;
font-size: 11px;
letter-spacing: 0;
}
.left-anim {
-webkit-animation: animate-positive 2s;
animation: animate-positive 2s;
opacity: 1 !important;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
@-webkit-keyframes animate-positive {
0% {
width: 0%;
}
}
@keyframes animate-positive {
0% {
width: 0%;
}
}
.cause-info .cause-meta {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.cause-info .cause-meta span {
font-size: 16px;
text-transform: uppercase;
color: #000000;
display: block;
font-weight: 600;
letter-spacing: 0;
min-height: 90px;
}
.cause-info p {
margin-top: 11px;
text-align: right;
font-size: 16px;
direction: rtl;
/*saeed*/
overflow: hidden;
}
.cause-info .btn-area {
margin-top: 15px;
text-align: center;
}
.cause-info .btn-area a {
font-weight: 600;
}
.cause-share-meta .btn-area a:hover,
.cause-info .btn-area a:hover {
/*background: #d9a862;*/
background: rgba(2, 35, 76, 0.9);
color: #fff;
border-color: #d9a862;
}
.see-all {
text-align: center;
margin-top: 50px;
}
.see-all a {
font-weight: 600;
color: #222222;
border-color: #222222;
}
.see-all a:hover {
background: #222222;
color: #fff;
border-color: #222222;
}
/*=============================================
* END Causes Area
*=============================================*/
/*=============================================
* 2.6 Testimonial Area
*=============================================*/
.testimonial-area {
position: relative;
}
.testimonial-area:before {
content: '';
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
background: rgba(72, 71, 71, 0.9);
}
.testimonial-slider {
border: 2px solid #fff;
padding: 50px 50px 80px;
}
.testimonial-slider:before {
content: '\f0b2 ';
color: #ffb607;
font-family: icofont;
font-size: 44px;
left: calc(50% - 21px);
position: absolute;
top: -74px;
}
.slick-initialized .slick-slide {
padding: 0;
}
.tst-items {
text-align: center;
padding: 50px 10% 70px;
}
.tst-items p {
color: #fff;
}
.tst-items h4.t-meta {
font-size: 14px;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0;
color: #ffb607;
margin-top: 18px;
}
.tst-items h4.t-meta span {
color: #fff;
margin-left: 6px;
}
.timg-slider-wrap {
text-align: center;
position: relative;
margin-top: -33px;
z-index: 1;
width: 100%;
}
.timg-slider-area {
width: 337px;
max-width: 100%;
display: inline-block;
}
.slick-list .timg-slider img {
height: 60px;
width: 60px;
display: inline-block;
border-radius: 50%;
overflow: hidden;
border: 2px solid #fff;
margin: 0px 6px;
opacity: 0;
-webkit-transform: scale(0.75);
transform: scale(0.75);
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.slick-list .timg-slider.slick-active img {
opacity: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
.slick-list .timg-slider.slick-current img {
-webkit-transform: scale(1);
transform: scale(1);
}
.testimonial-slider .slick-dots {
position: absolute;
left: 0;
bottom: -118px;
width: 100%;
text-align: center;
}
.testimonial-slider .slick-dots li {
display: inline-block;
}
.testimonial-slider .slick-dots li button {
font-size: 0;
width: 10px;
height: 6px;
border: none;
border-radius: 3px;
background: #ffb607;
margin: 0px 3px;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.testimonial-slider .slick-dots li.slick-active button {
width: 25px;
}
/*=============================================
* END Testimonial Area
*=============================================*/
/*=============================================
* 2.7 Team Area
*=============================================*/
.team-area {
}
.team-member {
position: relative;
overflow: hidden;
}
.team-thumbnail {
}
.team-thumbnail img {
max-width: 100%;
}
.member-info {
background: #ffb607;
position: absolute;
left: 0;
bottom: -88px;
width: 100%;
text-align: center;
padding: 11px 0px;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.team-member:hover .member-info {
bottom: 0;
}
.member-info h4 {
font-size: 17px;
font-weight: 600;
color: #fff;
letter-spacing: 0;
text-transform: uppercase;
}
.member-info p {
font-size: 13px;
font-weight: 400;
color: #333333;
text-transform: uppercase;
line-height: 18px;
}
.member-social {
margin: 34px 0px 13px;
opacity: 0;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.team-member:hover .member-social {
opacity: 1;
}
.member-social ul {
}
.member-social ul li {
display: inline-block;
}
.member-social ul li a {
display: block;
height: 45px;
width: 45px;
border: 2px solid #fff;
color: #fff;
text-align: center;
line-height: 45px;
font-size: 18px;
border-radius: 50%;
margin: 0px 2px;
}
.member-social ul li a:hover {
color: #444;
border-color: #444;
}
/*=============================================
* END Team Area
*=============================================*/
/*=============================================
* 2.8 Volunteer Area
*=============================================*/
.volunteer-area {
position: relative;
z-index: 1;
}
.volunteer-area:before {
content: '';
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
z-index: -1;
background: rgba(72, 71, 71, 0.9);
}
.volunteer-inner {
}
.volunteer-inner h2 {
font-size: 36px;
font-weight: 700;
color: #ffb607;
letter-spacing: 0;
line-height: 31px;
margin-bottom: 21px;
}
.volunteer-inner p {
font-weight: 400;
font-size: 21px;
color: #ffffff;
line-height: 32px;
}
.volunteer-inner .btn-area {
margin-top: 37px;
}
.volunteer-inner .btn-area a {
font-weight: 600;
}
/*=============================================
* END Volunteer Area
*=============================================*/
/*=============================================
* 2.9 Memories Area
*=============================================*/
.memories-area {
}
.all-memories {
}
.memories-thumb {
position: relative;
margin-bottom: 30px;
overflow: hidden;
}
.memories-thumb img {
max-width: 100%;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.memories-thumb:hover img {
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
.memories-thumb:before {
content: '';
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
background: rgba(255, 255, 255, 0.8);
border: 10px solid #fff7f7;
opacity: 0;
z-index: 2;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.memories-thumb:hover:before {
opacity: 1;
}
/*.memories-thumb a {
margin: auto;
height: 70px;
width: 70px;
background: #ffb607;
text-align: center;
line-height: 80px;
border-radius: 50%;
color: #fff;
position: absolute;
left: calc(50% - 20px);
top: calc(50% - 20px);
opacity: 0;
z-index: 3;
-webkit-transform: translateY(-200%);
transform: translateY(-200%);
}*/
.memories-thumb a {
margin: auto;
/*height: 70px;*/
width: 100%;
background: #dab26a;
text-align: center;
line-height: 80px;
/*border-radius: 50%;*/
color: #fff;
position: absolute;
left: calc(50% - 50%);
bottom: 0px;
opacity: 0;
z-index: 3;
-webkit-transform: translateY(-200%);
transform: translateY(-200%);
}
.memories-thumb:hover a {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
/*=============================================
* END Memories Area
*=============================================*/
/*=============================================
* 2.10 Donate Area
*=============================================*/
.donate-form {
width: 450px;
max-width: 100%;
background: #fff;
text-align: center;
display: inline-block;
padding: 40px 30px;
}
.donate-form h2 {
font-size: 30px;
font-weight: 700;
color: #000000;
letter-spacing: 0;
line-height: 33px;
position: relative;
padding-bottom: 13px;
margin-bottom: 36px;
}
.donate-form h2:before {
content: '';
position: absolute;
left: calc(50% - 32px);
bottom: 0;
height: 8px;
width: 65px;
background: #ffb607;
}
.donate-form form {
}
.donate-form form input[type='text'] {
width: 100%;
height: 50px;
border: 1px solid #8c8c8c;
border-radius: 3px;
margin-bottom: 20px;
padding-left: 20px;
letter-spacing: 0;
color: #000000;
outline: none;
}
.donate-form form input[type='submit'] {
width: 100%;
height: 50px;
border: none;
border-radius: 3px;
margin-bottom: 20px;
padding-left: 20px;
letter-spacing: 0;
color: #ffffff;
outline: none;
font-weight: 600;
margin-top: 27px;
text-align: center;
background-color: #ffb607;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
padding-left: 0;
}
.donate-form form input[type='submit']:hover {
background-color: #222;
}
/*=============================================
* END Donate Area
*=============================================*/
/*=============================================
* 2.11 Subscribe Area
*=============================================*/
.subscribe-content h2 {
font-size: 30px;
font-weight: 700;
color: #333333;
letter-spacing: 0;
line-height: 30px;
margin-bottom: 10px;
}
.subscribe-content p {
font-size: 16px;
color: #ffffff;
}
.subscribe-form .input-area {
position: relative;
}
.form_msg {
color: green;
text-align: center;
border-radius: 3px;
width: 100%;
}
.form_msg .error {
color: #ffffff;
}
.form_msg .mt10 {
display: none;
}
.form_msg .mt10.error,
.form_msg .mt10.valid {
display: block;
min-height: 30px;
width: 100%;
display: block;
}
.subscribe-form input {
width: 100%;
height: 55px;
border: none;
background: #fff;
padding-left: 20px;
letter-spacing: 0;
color: #000;
font-weight: 500;
}
.subscribe-form input::-webkit-input-placeholder {
color: #333333;
opacity: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
.subscribe-form input::-moz-placeholder {
color: #333333;
opacity: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
.subscribe-form input:-ms-input-placeholder {
color: #333333;
opacity: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
.subscribe-form input::placeholder {
color: #333333;
opacity: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
.subscribe-form button {
background: #333333;
border: none;
position: absolute;
right: 0;
top: 0;
height: 100%;
width: 60px;
color: #ffb607;
font-size: 29px;
}
/*=============================================
* END Subscribe Area
*=============================================*/
/*=============================================
* 2.12 Event Area
*=============================================*/
.event-single {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background-color: #ece3d4;
border: 2px solid #ece3d4;
padding: 10px;
}
.event-thumb {
width: 260px;
}
.event-thumb img {
max-width: 100%
}
.event-content {
-ms-flex-preferred-size: calc(100% - 260px);
flex-basis: calc(100% - 260px);
/*padding-left: 30px;
padding-right:30px;*/
}
.event-meta {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin-bottom: 14px;
}
.event-meta .meta-left {
width: 90px;
height: 90px;
border: 2px solid #ffb607;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
text-align: center;
border-radius: 4px;
margin-right: 15px;
}
.event-meta .meta-left h2 {
font-size: 36px;
color: #ffb607;
letter-spacing: 0;
}
.event-meta .meta-left span {
font-size: 14px;
font-weight: 400;
color: #333333;
line-height: 18px;
margin-top: 9px;
}
.event-meta .fix h2 {
font-size: 14px;
text-transform: uppercase;
color: #333333;
letter-spacing: 0;
font-weight: 400;
}
.event-meta .fix h2 i,
.event-meta .fix p i {
margin-right: 8px;
}
.event-meta .fix p {
font-size: 14px;
font-weight: 700;
color: #333333;
line-height: 19px;
margin-top: 6px;
}
.event-content > h2 {
margin: 16px 0px 14px;
}
.event-content > h4 {
margin: 16px 0px 14px;
display: block;
font-size: 19px;
font-weight: 700;
color: #333333;
letter-spacing: 0;
text-align: center;
font-family: 'Cairo';
}
.event-content h2 a {
display: block;
font-size: 15px;
font-weight: 600;
color: #333333;
letter-spacing: 0;
}
.event-content h2 a:hover {
color: #ffb607;
}
.event-content > p {
color: #333333;
text-align: justify;
}
.event-content .btn-area {
margin-top: 30px;
text-align: center;
}
.event-content .btn-area a {
font-weight: 600;
/*background: #d9a862;*/
background: rgba(2, 35, 76, 0.9);
border: 1px solid #d9a862;
color: #fff;
}
.event-content .btn-area a:hover {
border: 1px solid #d9a862;
color: #d9a862;
background: transparent;
}
/*=============================================
* END Event Area
*=============================================*/
/*=============================================
* 2.13 Footer Top
*=============================================*/
footer .widget {
margin-bottom: 0;
}
.footer-top {
/*background-color: #d9a862;*/
padding-bottom: 30px;
/*background: url(../img/home/Head2.png) center center/cover no-repeat;*/
/*background: rgba(2, 35, 76, 0.9);*/
/*background: url(../img/home/Head2.jpeg) center center/cover no-repeat;*/
}
.footer-top .title {
font-size: 18px;
font-weight: 600;
letter-spacing: 0;
color: #ffffff;
margin-bottom: 24px;
}
.widget-brand .flogo {
margin-bottom: 15px;
}
.widget-brand .flogo a {
display: inline-block;
padding-right: 45px;
}
.widget-brand .flogo a img {
max-width: 100%;
padding-left: 45px;
}
.widget-brand span {
display: block;
font-size: 16px;
color: #fff;
letter-spacing: 0;
margin-bottom: 10px;
}
.widget-brand p {
color: #dddddd;
}
.widget-brand ul.fsocial {
margin-top: 28px;
}
.widget-brand ul.fsocial li {
display: inline-block;
margin-right: 8px;
}
.widget-brand ul.fsocial li a {
display: block;
height: 45px;
width: 45px;
border: 2px solid #fff;
color: #fff;
text-align: center;
line-height: 41px;
border-radius: 50%;
font-size: 17px;
text-decoration: none;
}
.widget-brand ul.fsocial li a:hover {
color: #fff;
border-color: #d9a862;
background: #d9a862;
}
.widget-quick ul {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.widget-quick ul li {
-ms-flex-preferred-size: 50%;
flex-basis: 50%;
margin-bottom: 17px;
position: relative;
right: 10px;
}
.widget-quick ul li:before {
content: '\f104 ';
font-family: fontawesome;
position: absolute;
right: -10px;
top: -1px;
color: #f7f2ed;
font-size: 17px;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.widget-quick ul li:hover:before {
right: -5px;
opacity: 0;
/*display: none;*/
}
.widget-quick ul li a {
display: block;
color: #fff;
font-weight: 600;
font-size: 14px;
letter-spacing: 0;
}
.widget-quick ul li:hover a {
/*color: #e3d6bd;*/
cursor: pointer;
}
.w-gallery-img {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.w-gallery-img li {
-ms-flex-preferred-size: calc(100% * (1/3));
flex-basis: calc(100% * (1/3));
text-align: center;
margin-bottom: 2px;
}
.w-gallery-img li a {
display: inline-block;
width: 100%; /*saeed*/
}
.w-gallery-img li a img {
width: 100%;
padding: 2px;
/*height:68.5px;*/ /*saeed*/
height: 100px; /*saeed*/
}
.widget-contact ul li,
.widget-contact ul li a {
font-size: 14px;
letter-spacing: 0;
color: #fff;
margin-bottom: 16px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: baseline;
-ms-flex-align: baseline;
align-items: baseline;
line-height: 22px;
}
.widget-contact ul li a {
margin-bottom: 0;
}
.widget-contact ul li:hover a,
.widget-contact ul li:hover i {
color: #e3d6bd;
}
.widget-contact ul li i {
font-size: 16px;
margin-left: 16px;
color: #fff;
-webkit-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
/*=============================================
* END Footer Top
*=============================================*/
/*=============================================
* 2.14 Footer Bottom
*=============================================*/
.footer-bottom {
/*background: #c09b5e;*/
/*background: rgba(2, 35, 76, 0.9);*/
}
.fb-inner {
padding: 25px 0px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
border-top: 1px solid #e5dfd3;
}
.fb-inner p,
.fb-inner ul li a {
color: #e5dfd3;
display: block;
font-weight: 300;
letter-spacing: 0;
}
.fb-inner p span {
color: #ffb607;
}
.fb-inner ul li {
display: inline-block;
position: relative;
margin-left: 18px;
}
.fb-inner ul li:hover a {
color: #ffb607;
}
.fb-inner ul li:before {
content: '|';
position: absolute;
right: -14px;
top: 0;
font-size: 10px;
color: #dddddd;
}
.fb-inner ul li:last-child:before {
display: none;
}
/*=============================================
* END Footer Bottom
*=============================================*/
/*=============================================
* 3. Home Two
*=============================================*/
.header_style_two .ht-contact ul li {
text-align: right;
}
.header_style_two .header-bottom {
background: rgba(0, 0, 0, 0.1);
}
.header_style_two .header-bottom.header-fixed {
background: rgba(0, 0, 0, 0.9);
}
.header_style_two .search-btn > i {
display: none;
}
.header_style_two .search-form {
visibility: visible;
opacity: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
position: relative;
padding: 0;
right: 0;
top: 0;
max-width: 100%;
}
.header_style_two .search-form:before {
display: none;
}
/*slider area*/
.slider_style_two {
}
.slider_style_two .slider-item {
height: 700px;
}
.slider_style_two .slider-content h2 {
text-transform: capitalize;
}
/*feature-area*/
.feature-item {
text-align: center;
padding: 32px 10px;
border-radius: 3px;
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.02);
background: url(../img/bg/bg-canvss-img2.jpg) center center/cover no-repeat;
}
.feature-item .icon {
display: inline-block;
margin-bottom: 25px;
}
.feature-item .icon img {
max-width: 60px;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.feature-item:hover .icon img {
filter: url('data:image/svg+xml;charset=utf-8,#filter');
-webkit-filter: invert(100%)grayscale(100%);
filter: invert(100%)grayscale(100%);
}
.feature-item h2 a {
display: inline-block;
font-size: 19px;
letter-spacing: 0;
color: #444;
margin-bottom: 14px;
}
.feature-item p {
color: #555;
line-height: 30px;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
/*benefit-area*/
.benefit-area {
}
.benefit-content {
background: rgba(255, 255, 255, 0.9);
padding: 100px 50px;
}
.benefit-content h3 {
font-size: 45px;
text-transform: uppercase;
color: #333;
font-weight: 400;
line-height: 42px;
margin-bottom: 14px;
letter-spacing: 0;
}
.benefit-content h5 {
font-size: 24px;
letter-spacing: 0;
color: #444;
font-weight: 400;
line-height: 32px;
margin-bottom: 39px;
}
.benefit-content p {
color: #555;
}
.benefit-single {
text-align: center;
padding: 40px 0px;
background: #ece6df;
margin-top: 40px;
border-radius: 2px;
}
.benefit-single .icon {
font-size: 42px;
color: #ffb607;
margin-bottom: 21px;
}
.benefit-single h4 {
font-size: 18px;
letter-spacing: 0;
text-transform: capitalize;
color: #333;
font-weight: 600;
}
/*achivements-area*/
.achivements-area {
}
.achivement-single {
text-align: center;
}
.achivement-single > span {
font-size: 42px;
font-weight: 700;
color: #fff;
letter-spacing: 0;
margin-bottom: 21px;
display: inline-block;
}
.achivement-single p {
font-size: 17px;
color: #fff;
}
/*volunteer_style_two*/
.volunteer_style_two .volunteer-inner {
background: rgba(27, 19, 16, 0.7);
padding: 90px 7px;
}
/*causes-area*/
.causes-title {
margin-bottom: 40px;
/*text-align: right;*/
margin-left: 35%;
direction: rtl;
}
.causes-title h2 {
text-transform: uppercase;
letter-spacing: 0;
color: #333;
font-size: 23px;
line-height: 40px;
display: inline-block;
position: relative;
font-weight: 600;
}
.causes-title h2:before {
content: '';
position: absolute;
left: 0;
bottom: -5px;
height: 7px;
width: 100%;
/*background: rgb(217, 168, 98);*/
background: rgba(2, 35, 76, 0.9);
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.causes-area:hover .causes-title h2:before {
width: 90%;
}
.causes-slider {
}
.causes-slider .owl-nav {
position: absolute;
left: 0;
/*top: -83px;*/
top: unset;
}
.causes-slider .owl-nav div {
height: 40px;
width: 40px;
/*background: #d9a862;*/
background: rgba(2, 35, 76, 0.9);
display: inline-block;
margin: 5px 2px 0 2px;
text-align: center;
line-height: 50px;
font-size: 26px;
color: #fff;
border-radius: 3px;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.causes-slider .owl-nav div:hover {
background-color: #444;
}
/*upcooming-events*/
.upcooming-events {
position: relative;
z-index: 1;
}
.upcooming-events:before {
content: '';
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
z-index: -1;
background: rgba(72, 71, 71, 0.9);
}
.ev2-event-list {
}
.ev2-list-item {
overflow: hidden;
margin-bottom: 40px;
background: #fff;
border-radius: 0px 3px 3px 0px;
}
.ev2-list-item .meta-left {
margin-right: 15px;
position: relative;
}
.ev2-list-item .meta-left img {
max-width: 90px;
}
.ev2-list-item .meta-left .event-date {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
background-color: rgba(83, 81, 79, 0.92);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.ev2-list-item .meta-left .event-date span {
color: #fff;
font-weight: 700;
font-size: 28px;
letter-spacing: 0;
margin: auto;
}
.ev2-list-item .meta-content {
overflow: hidden;
padding-top: 14px;
}
.ev2-list-item .meta-content h2 a {
font-size: 16px;
letter-spacing: 0;
color: #444;
line-height: 29px;
display: block;
}
.ev2-list-item .meta-content h2 a:hover {
color: #ffb607;
}
.ev2-list-item .ev2-meta span {
display: inline-block;
letter-spacing: 0;
color: #666;
font-size: 13px;
margin-right: 3px;
}
.ev2-list-item .ev2-meta span i {
margin-right: 5px;
}
/*testimonial-carousel*/
.testimonial-carousel .tst-items {
padding: 60px 10px;
background: rgba(25, 25, 25, 0.72);
}
.testimonial-carousel .timg-thumb {
margin-bottom: 50px;
}
.testimonial-carousel .timg-thumb img {
height: 90px;
width: 90px;
border-radius: 50%;
margin: auto;
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
}
.testimonial-carousel .owl-dots {
text-align: center;
margin-top: 60px;
}
.testimonial-carousel .owl-dots .owl-dot {
font-size: 0;
width: 10px;
height: 6px;
border: none;
border-radius: 3px;
background: #ffb607;
margin: 0px 3px;
display: inline-block;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.testimonial-carousel .owl-dots .active {
width: 25px;
}
/*blog-area*/
.blog-thumb {
position: relative;
}
.blog-thumb a {
position: relative;
display: inline-block;
max-width: 100%;
}
.blog-thumb a img {
max-width: 100%;
}
.blog-thumb a:before {
content: '';
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
visibility: hidden;
opacity: 0;
background: rgba(72, 71, 71, 0.9);
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.blog-single:hover .blog-thumb a:before {
opacity: 1;
visibility: visible;
}
.blog-thumb .meta-date {
width: 81px;
position: absolute;
left: 8px;
top: 8px;
}
.blog-thumb .meta-date b {
display: block;
background: #444;
padding: 17px;
text-align: center;
line-height: 23px;
color: #fff;
text-transform: uppercase;
letter-spacing: 0;
font-size: 18px;
}
.blog-thumb .meta-date span {
display: block;
background: #fff;
text-align: center;
font-size: 22px;
font-weight: 700;
color: #444;
padding: 13px 0px;
}
.blog-thumb .meta-date span i {
margin-right: 8px;
}
.blog-info {
background: #f3f2f1;
padding: 30px 20px;
}
.blog-info h2 a {
font-size: 18px;
letter-spacing: 0;
color: #444;
margin-bottom: 10px;
display: block;
}
.blog-info h2 a:hover {
color: #ffb607;
}
.blog-info p {
color: #555;
}
.blog-info a.read-more {
width: 150px;
height: 40px;
display: inline-block;
background: #ffb607;
color: #fff;
text-align: center;
line-height: 40px;
margin-top: 20px;
letter-spacing: 0;
font-size: 14px;
border-radius: 3px;
border: 1px solid transparent;
}
.blog-info a.read-more:hover {
background-color: transparent;
color: #ffb607;
border-color: #ffb607;
}
/*=============================================
* END Home Two
*=============================================*/
/*=============================================
* 4. Home Three
*=============================================*/
.header_style_three .header-bottom {
top: 0;
border-bottom: 1px solid rgba(115, 115, 110, 0.8);
}
.header_style_three .header-bottom.header-fixed {
border-bottom-color: transparent;
}
.slingle-slider {
height: 100vh;
width: 100%;
}
.owl-item.active .b_faddown1 {
-webkit-animation: fadeInDown 2000ms ease-in-out;
animation: fadeInDown 2000ms ease-in-out;
}
.owl-item.active .b_faddown2 {
-webkit-animation: fadeInDown 1000ms ease-in-out;
animation: fadeInDown 1000ms ease-in-out;
}
.owl-item.active .b_faddown3 {
-webkit-animation: fadeInDown 800ms ease-in-out;
animation: fadeInDown 800ms ease-in-out;
}
.donate-charity {
opacity: 0;
-webkit-transition: opacity 0.3s ease 800ms;
transition: opacity 0.3s ease 800ms;
}
.owl-item.active .donate-charity {
opacity: 1;
-webkit-animation: pulse 500ms ease-in-out 800ms;
animation: pulse 500ms ease-in-out 800ms;
}
.full-screen-slider .owl-dots {
position: absolute;
right: 40px;
top: 0;
height: 100%;
z-index: 10;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.full-screen-slider .owl-dots .owl-dot {
height: 12px;
width: 6px;
display: inline-block;
margin: 4px 0px;
background: #ffb607;
border-radius: 8px;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.full-screen-slider .owl-dots .active {
height: 26px;
}
/*know-more-area*/
.knw-single {
padding: 50px 40px;
border-radius: 5px;
overflow: hidden;
box-shadow: 0px 0px 11px rgba(0, 0, 0, 0.02);
background: url(../img/bg/bg-canvss-img.jpg) right top/cover no-repeat;
}
.knw-single h2 {
text-transform: uppercase;
font-size: 35px;
letter-spacing: 0;
line-height: 24px;
color: #333;
}
.knw-single h2 small {
display: block;
}
.knw-single h2 strong {
display: block;
}
.knw-single a {
display: inline-block;
font-size: 13px;
letter-spacing: 0.02em;
text-transform: uppercase;
color: #ffb913;
margin-top: 15px;
font-weight: 700;
}
/*about-style-two*/
.about-title h2 {
font-size: 33px;
letter-spacing: 0;
line-height: 32px;
margin-bottom: 14px;
color: #222;
}
.about-title p {
color: #444;
font-size: 15px;
max-width: 900px;
margin: auto;
margin-bottom: 40px;
}
.about-title .btn-area a:hover {
background-color: #ffb913;
border-color: #ffb913;
color: #fff;
}
.about-title img {
max-width: 100%;
margin-top: 80px;
}
/*vision-area*/
.vision-item {
text-align: center;
padding: 32px 10px;
border-radius: 3px;
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.02);
background: url(../img/bg/bg-canvss-img2.jpg) center center/cover no-repeat;
}
.vision-item .icon {
display: inline-block;
margin-bottom: 25px;
}
.vision-item .icon img {
max-width: 60px;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.vision-item:hover .icon img {
filter: url('data:image/svg+xml;charset=utf-8,#filter');
-webkit-filter: invert(100%)grayscale(100%);
filter: invert(100%)grayscale(100%);
}
.vision-item h2 a {
display: inline-block;
font-size: 26px;
letter-spacing: 0;
color: #444;
margin-bottom: 20px;
position: relative;
padding-bottom: 10px;
}
.vision-item h2 a:before {
content: '';
position: absolute;
left: calc(50% - 25px);
bottom: 0;
height: 2px;
width: 50px;
background: #ffdb42;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.vision-item:hover h2 a:before {
width: 80px;
left: calc(50% - 40px);
}
.vision-item p {
color: #555;
line-height: 30px;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
/*upcooming-event-two*/
.ev3-item {
position: relative;
display: inline-block;
}
.ev3-item img {
max-width: 100%;
}
.ev3-caption {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
display: -moz-inline-flex;
display: -ms-inline-flex;
display: -o-inline-flex;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
text-align: center;
background-color: rgba(27, 27, 27, 0.5);
}
.ev3-caption span.title {
color: #ffb607;
font-weight: 600;
letter-spacing: 0;
text-transform: uppercase;
}
.ev3-caption h3 a {
display: inline-block;
color: #fff;
font-weight: 700;
letter-spacing: 0.01em;
margin-top: 4px;
font-size: 21px;
}
.ev3-caption h3 a:hover {
color: #ffb607;
}
.ev3-countdown {
position: absolute;
left: 0;
bottom: 0;
width: 100%;
background-color: rgba(255, 180, 0, 0.83);
text-align: center;
padding: 20px 0px 10px;
}
.ev3-countdown .cdown {
display: inline-block;
margin: 0px 5px;
}
.ev3-countdown .cdown .time-count {
height: 70px;
width: 80px;
border: 1px solid #fff;
text-align: center;
line-height: 70px;
font-size: 20px;
font-weight: 700;
color: #fff;
letter-spacing: 0;
display: block;
}
.ev3-countdown .cdown p {
color: #fff;
text-transform: uppercase;
color: #fff;
display: block;
letter-spacing: 0;
font-weight: 600;
margin-top: 10px;
}
/*testimonial-area*/
.volunteer-list {
position: relative;
min-height: 163px;
padding-left: 230px;
}
.vt3-thumbnail-slider {
width: 240px;
border: 10px solid #fdf4f4;
border-radius: 5px;
position: absolute;
left: 0;
bottom: 0;
z-index: 2;
}
.vt3-thumbnail-slider .vt3-thumb img {
max-width: 100%;
border-radius: 3px;
}
.vt3-quotes-slider {
padding-left: 20px;
position: relative;
margin-top: 160px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background: #fdf4f4;
padding-right: 20px;
padding-top: 30px;
padding-bottom: 30px;
}
.vt3-quotes-meta h4.t-meta {
font-size: 14px;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0;
color: #ffb607;
margin-top: 18px;
}
.vt3-quotes-meta h4.t-meta span {
color: #444;
margin-left: 6px;
}
.vt3-quotes-meta p {
color: #444;
}
.vt3-quotes-slider .slick-arrow {
position: absolute;
right: 0;
top: -75px;
padding: 4px 15px;
background: #fdf4f4;
border: none;
color: #333;
font-weight: 500;
letter-spacing: 0.02em;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.vt3-quotes-slider .slick-arrow.slick-next {
}
.vt3-quotes-slider .slick-arrow.slick-prev {
right: 82px;
}
.vt3-quotes-slider .slick-arrow:hover {
background-color: #ffb607;
color: #fff;
}
/*team-style-two*/
.single-volunteer {
display: inline-block;
position: relative;
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.05);
}
.single-volunteer img {
max-width: 100%;
}
.single-volunteer .t-social {
position: absolute;
left: 0;
bottom: 20%;
width: 100%;
text-align: center;
}
.single-volunteer .t-social ul {
}
.single-volunteer .t-social ul li {
display: inline-block;
opacity: 0;
-webkit-transform: translateY(-5px);
transform: translateY(-5px);
}
.single-volunteer .t-social ul li a {
display: block;
height: 40px;
width: 40px;
background: #fff;
text-align: center;
line-height: 40px;
border-radius: 2px;
font-size: 15px;
color: #000;
margin: 0px 2px;
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.03);
}
.single-volunteer .t-social ul li:nth-child(1) {
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.single-volunteer .t-social ul li:nth-child(2) {
-webkit-transition: all 0.3s ease 0.1s;
transition: all 0.3s ease 0.1s;
}
.single-volunteer .t-social ul li:nth-child(3) {
-webkit-transition: all 0.3s ease 0.2s;
transition: all 0.3s ease 0.2s;
}
.single-volunteer .t-social ul li:nth-child(4) {
-webkit-transition: all 0.3s ease 0.3s;
transition: all 0.3s ease 0.3s;
}
.single-volunteer:hover .t-social ul li {
opacity: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
-webkit-transform: translateY(0);
transform: translateY(0);
}
.single-volunteer .t-social ul li a:hover {
background-color: #ffb607;
color: #fff;
}
.single-volunteer .text {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
padding: 20px;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.single-volunteer .text h4 {
font-size: 17px;
letter-spacing: 0;
color: #333;
font-weight: 600;
}
.single-volunteer .text span {
display: block;
color: #a29f9f;
letter-spacing: 0;
font-weight: 600;
}
/*client-area*/
.client-carousel .single-client {
border: 1px solid #ccc;
text-align: center;
}
.client-carousel .single-client img {
max-width: 100%;
}
/*=============================================
* END Home Three
*=============================================*/
/*=============================================
* 5. About Us
*=============================================*/
.crumbs-area {
padding: 160px 0px 100px;
height: 400px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
position: relative;
}
.crumbs-area:before {
content: '';
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
background-color: rgba(34, 34, 34, 0.2);
}
.crumbs-content {
text-align: center;
}
.crumbs-content h2 {
font-size: 29px;
font-weight: 700;
color: #fff;
letter-spacing: 0;
line-height: 26px;
margin-bottom: 15px;
}
.crumbs-content ul li {
display: inline-block;
}
.crumbs-content ul li a,
.crumbs-content ul li span {
color: #dcd0d0;
font-weight: 600;
left: 0;
display: block;
font-size: 14px;
letter-spacing: 0.02em;
text-transform: capitalize;
}
.crumbs-content ul li a {
margin-right: 19px;
position: relative;
}
.crumbs-content ul li a:before {
content: '|';
position: absolute;
right: -15px;
top: 0;
}
.crumbs-content ul li a:hover,
.crumbs-content ul li span {
color: #ffb607;
}
/*welcome-area*/
.welcome-content {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.welcome-inner {
-ms-flex-preferred-size: calc(100% * (8/12));
flex-basis: calc(100% * (8/12));
padding-right: 15px;
}
.welcome-inner h2 {
font-size: 33px;
letter-spacing: 0;
line-height: 37px;
margin-bottom: 29px;
position: relative;
display: inline-block;
color: #333;
}
.welcome-inner h2:before {
content: '';
position: absolute;
left: 0;
bottom: 1px;
height: 5px;
width: 70%;
background: #ffb607;
opacity: 0.5;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.welcome-area:hover .welcome-inner h2:before {
width: 90%;
}
.welcome-inner p {
color: #444;
margin-bottom: 14px;
}
.welcome-inner p strong {
}
.welcome-inner .w-list {
margin-top: 15px;
}
.welcome-inner .w-list li {
color: #444;
letter-spacing: 0;
font-weight: 500;
font-size: 14px;
margin-bottom: 16px;
position: relative;
padding-left: 21px;
line-height: 23px;
}
.welcome-inner .w-list li:before {
content: '\eb37';
position: absolute;
left: -4px;
top: 0;
font-family: icofont;
font-size: 24px;
color: #ffb607;
}
.about-video {
-ms-flex-preferred-size: calc(100% * (4/12));
flex-basis: calc(100% * (4/12));
background: url(../img/blog/blog-thumb2.jpg) center center/cover no-repeat;
border-radius: 5px;
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.4);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
position: relative;
z-index: 1;
}
.about-video:before {
content: '';
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
z-index: -1;
background: rgba(27, 27, 27, 0.5);
}
.about-video a {
margin: auto;
display: block;
border-radius: 50%;
position: relative;
}
.about-video a img {
height: 60px;
}
.about-video a:before {
content: '';
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
border-radius: 50%;
border: 1px solid #ffb607;
-webkit-animation: scaling 2000ms linear 0s infinite;
animation: scaling 2000ms linear 0s infinite;
}
.about-video a:after {
content: '';
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
border-radius: 50%;
border: 1px solid #ffb607;
-webkit-animation: scaling 2000ms linear 1s infinite;
animation: scaling 2000ms linear 1s infinite;
}
@-webkit-keyframes scaling {
0% {
-webkit-transform: scale(1);
transform: scale(1);
opacity: 0.5;
}
100% {
-webkit-transform: scale(2);
transform: scale(2);
opacity: 0;
}
}
@keyframes scaling {
0% {
-webkit-transform: scale(1);
transform: scale(1);
opacity: 0.5;
}
100% {
-webkit-transform: scale(2);
transform: scale(2);
opacity: 0;
}
}
/*=============================================
* END About Us
*=============================================*/
/*=============================================
* 6. Cause Standard
*=============================================*/
.all-causes {
padding: 100px 0px 80px;
}
.all-causes .cause-item {
margin-bottom: 30px;
}
.pagination-area {
text-align: center;
}
.pagination-area ul {
display: inline-block;
margin-top: 13px;
}
.pagination-area ul li {
display: inline-block;
}
.pagination-area ul li a {
display: block;
font-size: 14px;
font-weight: 600;
padding: 5px;
}
.pagination-area ul li a:hover,
.pagination-area ul li.active a {
color: #ffb607;
}
.pagination-area ul li i {
font-size: 17px;
font-weight: 700;
padding: 8px;
background: #f9f6f0;
}
/*=============================================
* END Cause Standard
*=============================================*/
/*=============================================
* 7. Cause With Sidebar
*=============================================*/
/*sidebar-area*/
.sidebar-area {
padding-right: 10px;
}
.widget {
margin-bottom: 25px;
}
.sidebar-area .widget:last-child {
margin-bottom: 0px;
}
.widget-search form {
position: relative;
}
.widget-search form input {
width: 100%;
height: 45px;
padding: 0px 45px 0px 15px;
background: transparent;
border: 1px solid #edf4f9;
font-size: 15px;
color: #444;
letter-spacing: 0.02em;
border-radius: 2px;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.widget-search form input::-webkit-input-placeholder {
color: #777;
font-weight: 500;
letter-spacing: 0;
}
.widget-search form input::-moz-placeholder {
color: #777;
font-weight: 500;
letter-spacing: 0;
}
.widget-search form input:-ms-input-placeholder {
color: #777;
font-weight: 500;
letter-spacing: 0;
}
.widget-search form input::placeholder {
color: #777;
font-weight: 500;
letter-spacing: 0;
}
.widget-search form input:focus {
border-color: #ffb607;
}
.widget-search form input:focus ~ button {
color: #ffffff;
background-color: #ffb607;
}
.widget-search form button {
position: absolute;
left: 0;
top: 0;
height: 45px;
width: 45px;
background: #edf4f9;
border: 1px solid transparent;
color: #444;
border-radius: 2px;
font-size: 16px;
text-align: center;
line-height: 42px;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.widget-title {
margin-bottom: 10px;
/*background: #d9a862;*/
background: rgba(2, 35, 76, 0.9);
padding: 8px 10px;
border-radius: 2px;
}
.widget-title h2 {
text-transform: uppercase;
font-size: 18px;
font-weight: 400;
color: #444;
letter-spacing: 0;
position: relative;
display: inline-block;
line-height: 21px;
font-weight: 600;
}
.widget-title h2:before {
bottom: 2px;
width: 69%;
}
.widget-title h2:after {
bottom: 0;
width: 35%;
}
.widget-title h2 a, a:visited {
font-size: 16px;
font-weight: 700;
}
.news-single {
overflow: hidden;
margin-bottom: 20px;
}
.news-single:last-child {
margin-bottom: 0px;
}
.meta-thumb {
float: right;
margin-left: 5px;
}
.meta-thumb a {
display: inline-block;
}
.meta-thumb a img {
max-width: 100%;
max-width: 90px;
}
.meta-content {
overflow: hidden;
margin-left: 5px;
}
.meta-content a {
display: block;
font-size: 16px;
text-align: justify;
letter-spacing: 0.01em;
/*color: #535151;*/
color: #000000;
line-height: 22px;
}
.meta-content a:hover {
color: #d9a862;
}
.meta-content span.up-time {
display: block;
font-size: 14px;
letter-spacing: 0;
color: #888;
font-weight: 600;
}
.widget-category-list ul,
.widget-archive-list ul {
list-style-type: none;
}
.widget-category-list ul li:last-child,
.widget-archive-list ul li:last-child {
margin-bottom: -10px;
}
.widget-category-list ul li a,
.widget-archive-list ul li a {
font-size: 14px;
letter-spacing: 0.01em;
line-height: 20px;
color: #555;
display: block;
margin-bottom: 22px;
}
.widget-category-list ul li a:hover,
.widget-archive-list ul li a:hover,
.widget-category-list ul li a:hover:before,
.widget-archive-list ul li a:hover:before,
.widget-category-list ul li a:hover span,
.widget-archive-list ul li a:hover span {
color: #ffb607;
}
.widget-category-list ul li a span,
.widget-archive-list ul li a span {
color: #c2b8b8;
float: right;
}
.widget-tag-list a {
display: inline-block;
font-size: 10px;
text-transform: uppercase;
background: #ffb607;
color: #fff;
padding: 7px 13px;
margin-bottom: 5px;
letter-spacing: 0;
line-height: 15px;
border-radius: 1px;
margin-right: 8px;
}
.widget-tag-list a:hover {
background-color: #252524;
}
.widget-newsletter {
background: #fdfdfd;
}
.newsletter-inner {
padding: 0px 15px 20px;
}
.widget-newsletter p.text {
color: #444;
}
.newsletter-form {
margin-top: 26px;
}
.newsletter-form form {
position: relative;
}
.newsletter-form form input[type='email'] {
width: 100%;
height: 45px;
background: #fff;
border: none;
padding-left: 20px;
letter-spacing: 0;
color: #333;
font-weight: 500;
padding-right: 50px;
}
.newsletter-form form input::-webkit-input-placeholder {
color: #777;
font-weight: 500;
letter-spacing: 0;
}
.newsletter-form form input::-moz-placeholder {
color: #777;
font-weight: 500;
letter-spacing: 0;
}
.newsletter-form form input:-ms-input-placeholder {
color: #777;
font-weight: 500;
letter-spacing: 0;
}
.newsletter-form form input::placeholder {
color: #777;
font-weight: 500;
letter-spacing: 0;
}
.newsletter-form form button {
position: absolute;
right: 0;
top: 0;
height: 45px;
width: 50px;
border: none;
background: #edf4f9;
color: #333;
font-size: 23px;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.newsletter-form form input:focus ~ button {
color: #ffffff;
background-color: #ffb607;
}
/*=============================================
* END Cause With Sidebar
*=============================================*/
/*=============================================
* 8. Cause Single
*=============================================*/
.cause-single .cause-item {
padding: 0;
border: none;
margin-bottom: 40px;
overflow: hidden;
}
.cause-single .cause-info .btn-area {
text-align: left;
}
.cause-single .cause-info h2 a {
margin-top: 0;
}
/*=============================================
* END Cause Single
*=============================================*/
/*=============================================
* 9. Cause Details
*=============================================*/
.cause-details .cause-item,
.cause-details .cause-info {
padding: 0;
border: none;
margin-bottom: 25px;
}
.cause-details .cause-info p {
margin-bottom: 25px;
}
.cause-share-meta {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.cause-share-meta .btn-area {
margin: 0;
}
.social-share {
}
.social-share p {
color: #444;
font-weight: 600;
line-height: 20px;
margin-bottom: 13px;
margin-top: 0;
}
.social-share ul {
}
.social-share ul li {
display: inline-block;
}
.social-share ul li a {
display: block;
font-size: 15px;
color: #fff;
border: 1px solid #ffb607;
height: 40px;
width: 40px;
text-align: center;
line-height: 40px;
border-radius: 2px;
background: #ffb607;
margin-right: 3px;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.social-share ul li a:hover {
background-color: #444;
color: #ffb607;
border: 1px solid #444;
}
/*=============================================
* END. Cause Details
*=============================================*/
/*=============================================
* 10.1 Event Grid
*=============================================*/
.event-grid .ev3-list .ev3-item {
margin-bottom: 30px;
}
.event-grid .ev3-countdown .cdown {
display: inline-block;
margin: 0px 5px;
}
.event-grid .ev3-countdown .cdown .time-count {
height: 50px;
width: 50px;
border: 1px solid #fff;
text-align: center;
line-height: 50px;
font-size: 14px;
font-weight: 600;
color: #fff;
letter-spacing: 0;
display: block;
}
/*=============================================
* END Event Grid
*=============================================*/
/*=============================================
* 10.2 Event List
*=============================================*/
.ev3-single {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
margin-bottom: 30px;
position: relative;
background: #ffae00;
width: 100%;
}
.ev3-thumb {
-ms-flex-preferred-size: 50%;
flex-basis: 50%;
}
.ev3-list-caption {
position: relative;
-ms-flex-preferred-size: 50%;
flex-basis: 50%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
text-align: center;
padding: 40px 15px;
}
.ev3-list-caption span.title {
color: #fff;
font-weight: 600;
letter-spacing: 0;
text-transform: uppercase;
margin-bottom: 10px;
}
.ev3-list-caption h3 a {
display: inline-block;
color: #fff;
font-weight: 700;
letter-spacing: 0.01em;
font-size: 21px;
margin-bottom: 16px;
}
.ev3-list-caption h3 a:hover {
color: #444;
}
.ev3-list-caption p {
color: #fff;
}
.ev3-list-caption .btn-area {
margin-top: 30px;
}
.ev3-list-caption .btn-area a {
background-color: #fff;
color: #ffae00;
}
.ev3-list-caption .ev3-countdown {
position: relative;
}
/*=============================================
* 10.3 Event Details
*=============================================*/
.event-details-area .ev3-thumb {
display: inline-block;
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.05);
}
.event-details-area .ev3-thumb img {
max-width: 100%;
border-radius: 25px;
}
.ev3-details-caption {
text-align: justify;
}
.ev3-details-caption h3 {
font-size: 22px;
letter-spacing: 0;
display: inline-block;
margin-bottom: 6px;
margin-top: 24px;
margin-bottom: 12px;
}
.ev3-details-caption span.title {
letter-spacing: 0;
color: #ffb607;
margin-bottom: 17px;
display: block;
}
.ev3-details-caption p {
color: #444;
line-height: 31px;
margin-bottom: 15px;
}
.ev3-details-caption .cause-share-meta {
margin-top: 29px;
}
.event-details-area .w-list {
margin-top: 15px;
}
.event-details-area .w-list li {
color: #444;
letter-spacing: 0;
font-weight: 500;
font-size: 14px;
margin-bottom: 16px;
position: relative;
padding-left: 21px;
line-height: 23px;
}
.event-details-area .w-list li:before {
content: '\eb37';
position: absolute;
left: -4px;
top: 0;
font-family: icofont;
font-size: 24px;
color: #ffb607;
}
/*=============================================
* END Event Details
*=============================================*/
/*=============================================
* 11. Gallery Page / 11.1 Gallery Masonary
*=============================================*/
.gallery-filter {
text-align: center;
margin-bottom: 35px;
}
.gallery-filter ul li {
display: inline-block;
font-size: 18px;
letter-spacing: 0;
color: #222;
font-weight: 500;
margin: 0px 13px;
position: relative;
cursor: pointer;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.gallery-filter ul li + li:before {
content: '/';
position: absolute;
left: -19px;
top: 0;
color: #eab024;
}
.gallery-filter ul li.active,
.gallery-filter ul li:hover {
color: #ffb607;
}
/*=============================================
* END Gallery Masonary
*=============================================*/
/*=============================================
* 11.2 Gallery Fullwide
*=============================================*/
.gallery-fullwide .grid-item {
padding: 0;
}
.gallery-fullwide .grid-item .memories-thumb {
margin-bottom: 0;
}
/*=============================================
* END Gallery Fullwide
*=============================================*/
/*=============================================
* 12. Blog Page / 12.1 Blog Standard
*=============================================*/
.blog-standard .blog-single {
margin-bottom: 30px;
}
/*=============================================
* END Blog Standard
*=============================================*/
/*=============================================
* 12.2 Blog Details
*=============================================*/
.blog-details .blog-thumb a {
overflow: hidden;
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.05)
}
.blog-details .blog-thumb a:before {
visibility: hidden;
opacity: 0;
width: 0%;
height: 100%;
left: -10%;
-webkit-transition: all 0s ease 0s;
transition: all 0s ease 0s;
}
.blog-details .blog-thumb a:hover:before {
visibility: visible;
opacity: 1;
left: 110%;
width: 100%;
background-color: #ffb607;
-webkit-transition: all 1s ease 0s;
transition: all 1s ease 0s;
}
.blog-details h2 a {
font-size: 24px;
letter-spacing: 0;
color: #333;
font-weight: 500;
display: inline-block;
margin: 14px 0px 19px;
}
.blog-details h2 a:hover {
color: #ffb607;
}
.blog-details p {
color: #444;
line-height: 30px;
margin-bottom: 27px;
}
.blog-details blockquote {
background: #edf4f9;
padding: 40px 15px 40px 80px;
border-bottom: 4px solid #ffb607;
}
.blog-details blockquote:before {
content: '\f0b1';
font-family: icofont;
color: #ffb607;
top: 39px;
}
.blog-details blockquote p {
color: #222;
font-size: 15px;
}
.next-prev {
overflow: hidden;
margin-top: 60px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.next-prev .np-single {
-ms-flex-preferred-size: calc(50% - 7px);
flex-basis: calc(50% - 7px);
background: #edf4f9;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.np-single > div {
position: relative;
}
.np-single .np-thumb {
}
.np-single img {
max-width: 91px;
}
.np-single .icon {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
text-align: center;
color: #ffb607;
font-size: 40px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
background: rgba(27, 27, 27, 0.5);
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.np-single:hover .icon.left {
padding-left: 8px;
}
.np-single:hover .icon.right {
padding-right: 8px;
}
.np-single h2 {
overflow: hidden;
padding: 0px 10px;
display: block;
width: calc(100% - 91px);
}
.np-single h2 a {
display: block;
letter-spacing: 0;
font-size: 16px;
color: #333;
font-weight: 500;
}
.np-single h2 a:hover {
color: #ffb607;
}
/*comment-area*/
.comment-area {
margin-top: 70px;
}
.comment-title {
margin-bottom: 42px;
}
.comment-title h4 {
letter-spacing: 0;
font-size: 22px;
color: #333;
border-bottom: 4px solid rgb(217, 168, 98);
padding-bottom: 9px;
font-weight: 600;
}
.comment-title h4 span {
color: #888;
}
.comment-list {
}
.comment-info-inner {
}
.comment-info-inner article {
margin-bottom: 50px;
border-bottom: 1px solid #edf4f9;
padding-bottom: 40px;
}
.comment-info-inner .meta-left {
border-radius: 5px;
border: 1px solid #ccc;
padding: 5px;
margin-right: 15px;
}
.comment-info-inner .meta-left img {
max-width: 80px;
}
.comment-info-inner .meta-content {
position: relative;
}
.comment-info-inner .meta-content h2 {
font-size: 16px;
letter-spacing: 0;
color: #444;
font-weight: 600;
margin-bottom: 4px;
}
.comment-info-inner .meta-data {
}
.comment-info-inner p.category {
color: #ffb607;
font-size: 13px;
letter-spacing: 0;
margin-bottom: 14px;
}
.comment-info-inner p.category span:first-child {
margin-right: 5px;
border-right: 1px solid #ccc;
padding-right: 5px;
}
.comment-info-inner p {
color: #444;
}
.comment-info-inner a.reply-btn {
position: absolute;
right: 0;
top: 6px;
display: block;
height: 32px;
width: 84px;
background: #ffb607;
color: #fff;
text-align: center;
line-height: 33px;
text-transform: uppercase;
font-size: 11px;
border-radius: 3px;
letter-spacing: 0.05em;
}
.comment-info-inner a.reply-btn:hover {
background-color: #444;
color: #fff;
}
.children {
padding-left: 105px;
}
/*leave comment area*/
.leave-comment form input[type="text"],
.leave-comment form textarea {
width: 100%;
height: 45px;
margin-bottom: 20px;
background: #edf4f9;
border: none;
color: #666666;
padding-left: 15px;
font-size: 14px;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.leave-comment form textarea {
width: 100%;
max-width: 100%;
height: 176px;
min-height: 176px;
padding-top: 7px;
}
.leave-comment form textarea::-webkit-input-placeholder,
.leave-comment form input[type="text"]::-webkit-input-placeholder {
color: #888;
opacity: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
font-weight: 400 !important;
}
.leave-comment form textarea::-moz-placeholder,
.leave-comment form input[type="text"]::-moz-placeholder {
color: #888;
opacity: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
font-weight: 400 !important;
}
.leave-comment form textarea:-ms-input-placeholder,
.leave-comment form input[type="text"]:-ms-input-placeholder {
color: #888;
opacity: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
font-weight: 400 !important;
}
.leave-comment form textarea:-moz-placeholder,
.leave-comment form input[type="text"]:-moz-placeholder {
color: #888;
opacity: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
font-weight: 400 !important;
}
.leave-comment form textarea:focus,
.leave-comment form input[type="text"]:focus {
background: #fafcfd;
}
.leave-comment form input#comment-submit {
background: #ffb607;
border: 1px solid transparent;
text-transform: uppercase;
font-size: 12px;
letter-spacing: 0.01em;
color: #fff;
padding: 14px 15px;
line-height: 14px;
border-radius: 2px;
outline: none;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.leave-comment form input#comment-submit:hover {
background: #444;
}
/*=============================================
* END Blog Details
*=============================================*/
/*=============================================
* 13. Contact Area
*=============================================*/
.get-tuch h5 {
text-transform: uppercase;
font-size: 17px;
letter-spacing: 0;
color: #444;
margin-bottom: 11px;
}
.get-tuch > p {
color: #555;
}
.widget-addres {
margin-top: 36px;
}
.single-address-box {
overflow: hidden;
margin-bottom: 20px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
/* align-items: center;*/
}
.single-address-box .meta-left {
font-size: 19px;
color: #d9a862;
margin-left: 15px;
height: 40px;
width: 40px;
border: 1px solid #d9a862;
text-align: center;
line-height: 40px;
border-radius: 2px;
}
.single-address-box .meta-content hr {
margin: 10px 0px 10px 0px;
}
.single-address-box .meta-content p {
color: #000000;
font-weight: 500;
}
.single-address-box .meta-content a {
}
.contact-us-form {
}
.contact-us-form .comment-title {
margin-bottom: 17px;
}
.contact-us-form .comment-title h4 {
font-size: 33px;
}
.widget-contact p {
color: #555;
}
.wpcf7 {
margin-top: 40px;
font-family: 'Noto Naskh Arabic';
}
.wpcf7 btnsubmit {
border: 1px solid #ffb607;
background: #ffb607;
color: #fff;
font-weight: 600;
/* height: 38px; */
width: 140px;
max-width: 100%;
text-align: center;
border-radius: 4px;
line-height: 40px;
font-size: 14px;
letter-spacing: 0;
display: inline-block;
}
.wpcf7 input,
.wpcf7 textarea {
width: 100%;
height: 45px;
margin-bottom: 20px;
border-radius: 2px;
border: 1px solid #e8e5e5;
background: #fff;
padding-right: 20px;
color: #444;
font-family: Cairo;
}
.wpcf7 form input::-webkit-input-placeholder,
.wpcf7 form textarea::-webkit-input-placeholder {
color: #999;
letter-spacing: 0;
}
.wpcf7 form input::-moz-placeholder,
.wpcf7 form textarea::-moz-placeholder {
color: #999;
letter-spacing: 0;
}
.wpcf7 form input:-ms-input-placeholder,
.wpcf7 form textarea:-ms-input-placeholder {
color: #999;
letter-spacing: 0;
}
.wpcf7 form input::placeholder,
.wpcf7 form textarea::placeholder {
color: #999;
letter-spacing: 0;
}
.wpcf7 textarea {
height: 135px;
padding-top: 10px;
}
.wpcf7 button {
background: #fff;
padding: 6px 12px;
border: 1px solid #ccc;
border-radius: 3px;
text-transform: uppercase;
letter-spacing: 0.02em;
font-size: 13px;
color: #333;
font-weight: 600;
}
.wpcf7 button i {
font-size: 23px;
line-height: 18px;
display: inline-block;
vertical-align: middle;
padding-bottom: 4px;
color: #333;
position: relative;
z-index: 1;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.wpcf7 button:hover i {
-webkit-transform: translateX(4px);
transform: translateX(4px);
}
#map {
height: 600px;
}
/*=============================================
* 14. Donate Page
*=============================================*/
.donate-title {
text-align: center;
position: relative;
padding-bottom: 19px;
margin-bottom: 53px;
}
.donate-title:before {
content: '';
position: absolute;
left: 0;
bottom: 0;
height: 4px;
width: 100%;
background-color: #ffb607;
border-radius: 6px;
}
.donate-title h2 {
font-size: 26px;
letter-spacing: 0;
line-height: 26px;
margin-bottom: 13px;
}
.donate-title p {
color: #555;
}
.d-form-box h4 {
font-size: 21px;
letter-spacing: 0;
color: #444;
margin-bottom: 20px;
font-weight: 600;
}
.donation-count {
margin-bottom: 25px;
}
.donation-count .select-box {
position: relative;
float: left;
width: 60px;
text-align: center;
margin: 0px 20px 10px 0px;
}
.donation-count .input-box {
position: relative;
float: left;
width: 200px;
}
.donation-count .select-box input[type="radio"] {
left: 0px;
top: 0px;
visibility: hidden;
position: absolute;
opacity: 0;
}
.donation-count .select-box label {
display: block;
line-height: 40px;
height: 40px;
text-align: center;
font-size: 14px;
font-weight: 500;
color: #555555;
border: 1px solid #e0e0e0;
cursor: pointer;
border-radius: 2px;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.donation-count .select-box input[type="radio"]:checked + label {
background: #ffb607;
border-color: #ffb607;
color: #ffffff;
}
.select-custome-box input {
font-size: 14px;
font-weight: 500;
color: #555555;
border: 1px solid #e0e0e0;
border-radius: 2px;
padding-left: 17px;
height: 41px;
margin-left: 15px;
}
.donate-input-box input,
.donate-input-box textarea {
height: 45px;
width: 100%;
margin-bottom: 20px;
padding-left: 15px;
letter-spacing: 0;
color: #444;
border-radius: 3px;
background: #fff;
border: 1px solid #ccc;
}
.donate-input-box textarea {
padding-top: 8px;
height: 150px;
}
.submit input[type='submit'] {
height: 45px;
width: 140px;
background: #ffb607;
color: #fff;
border: none;
border-radius: 2px;
letter-spacing: 0;
-webkit-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.submit input[type='submit']:hover {
background-color: #444;
}
/*=============================================
* END Donate Page
*=============================================*/
/*=============================================
* 15. All Team Member
*=============================================*/
.all-team-member {
padding: 100px 0px 70px;
}
.all-team-member .single-volunteer {
margin-bottom: 30px;
}
/*=============================================
* 15. All Team Member
*=============================================*/
/*=============================================
* 10.3 New Content Area
*=============================================*/
.content-area {
text-align: justify;
color: #000000;
}
.content-area .title {
margin-bottom: 20px;
}
.content-area .title h4 {
letter-spacing: 0;
font-size: 22px;
color: #333;
border-bottom: 3px solid #ffb607;
padding-bottom: 9px;
font-weight: 600;
text-transform: uppercase;
}
.content-area .title h4 span {
color: #888;
}
.content-area h2 {
font-size: 22px;
letter-spacing: 0;
display: inline-block;
margin-bottom: 6px;
margin-top: 24px;
margin-bottom: 12px;
text-transform: uppercase;
}
.content-area a {
font-size: 18px;
font-weight: normal !important;
line-height: 26px;
}
.content-area p {
color: #000000 !important;
margin-top: 11px;
}
.content-area .ev3-thumb {
display: inline-block;
/* box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.05); */
padding-bottom: 20px;
}
.content-area .ev3-thumb img {
max-width: 100%;
width: 100%;
border-radius: 10px;
}
.content-area .w-list {
margin-top: 15px;
}
.content-area .w-list li {
/*color: #000000;*/
color: #444;
letter-spacing: 0;
font-weight: 500;
font-size: 18px;
margin-bottom: 18px;
position: relative;
padding-right: 21px;
line-height: 28px;
}
.content-area .w-list li:before {
/*content: '\eb36';*/
content: '\f104';
position: absolute;
right: -4px;
top: 0;
/*font-family: icofont;*/
font-family: fontawesome;
font-size: 24px;
color: #d9a862;
}
.content-area .jumbotron h2 {
font-size: 28px;
line-height: 38px;
display: inline-block;
margin-bottom: 6px;
margin-top: 24px;
margin-bottom: 12px;
text-transform: uppercase;
color: #ffac1f;
}
.content-area .jumbotron p {
font-size: 18px;
line-height: 38px;
display: inline-block;
margin-bottom: 6px;
margin-top: 24px;
margin-bottom: 12px;
text-transform: uppercase;
color: #ffffff !important;
}
/*Kuwait Rulers*/
.rulers-kuwait {
position: relative;
z-index: 1;
}
.rulers-kuwait:before {
content: '';
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
z-index: -1;
background: rgba(72, 71, 71, 0);
}
.rk2-event-list {
}
.rk2-list-item {
overflow: hidden;
margin-bottom: 40px;
background: rgba(72, 71, 71, 0.2);
border-radius: 0px 3px 3px 0px;
}
.rk2-list-item .meta-left {
margin-left: 15px;
position: relative;
float: right;
}
.rk2-list-item .meta-left img {
max-width: 164px;
}
.rk2-list-item .meta-left .event-date {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
background-color: rgba(83, 81, 79, 0.92);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.rk2-list-item .meta-left .event-date span {
color: #fff;
font-weight: 700;
font-size: 28px;
letter-spacing: 0;
margin: auto;
}
.rk2-list-item .meta-content {
overflow: hidden;
padding-top: 14px;
}
.rk2-list-item .meta-content h2 {
font-size: 18px;
font-weight: 600;
letter-spacing: 0;
color: #000000;
line-height: 29px;
display: block;
padding-left: 10px;
}
.rk2-list-item .meta-content h2 a {
font-size: 18px;
letter-spacing: 0;
color: #000000;
line-height: 29px;
display: block;
padding-left: 10px;
}
.rk2-list-item .meta-content h2 a:hover {
color: #ffb607;
}
.rk2-list-item .rk2-meta span {
display: inline-block;
letter-spacing: 0;
color: #000000;
font-size: 16px;
margin-right: 3px;
}
.rk2-list-item .rk2-meta span i {
margin-right: 5px;
}
/* GENERAL SETTINGS */