/*
Template Name: Charity HTML Template
Author: yaminncco
Colors:
Body : #5f646b
Headers : #23262a
Primary : #83ba09
Grey : #f4f4f8, #e6e6ea
Fonts: Roboto, Source Sans Pro
Table OF Contents
------------------------------------
GENERAL
LOGO
NAVGATION
HEADER
ABOUT
NUMBERS
CALL TO ACTION
TESTIMONIAL
CAUSES
EVENTS
BLOG
ASIDE
FOOTER
RESPONSIVE
OWL THEME
------------------------------------*/
/*=========================================================
GENERAL
===========================================================*/
/*----------------------------*\
typography
\*----------------------------*/
body {
font-family: 'Roboto', sans-serif;
font-size: 17px;
font-weight: 300;
letter-spacing: 0.3px;
color: #5f646b;
}
h1, h2, h3, h4, h5, h6 {
font-family: 'Source Sans Pro', sans-serif;
margin-top: 0px;
color: #23262a;
font-weight: 700;
letter-spacing: 0px;
}
h1 {
font-size: 43px;
}
h2 {
font-size: 33px;
}
h3 {
font-size: 26px;
}
h4 {
font-size: 21px;
}
a {
color: #000;
/* color: #23262a; */
font-weight: 400;
-webkit-transition: 0.3s color;
transition: 0.3s color;
}
a:hover, a:focus {
text-decoration: none;
outline: none;
color: #83ba09;
}
ul, ol {
margin: 0;
padding: 0;
list-style: none
}
blockquote {
position: relative;
padding: 30px 30px;
margin: 0px;
font-size: 15px;
border-radius: 10px;
background: #f4f4f8;
border-left: 0px;
margin: 30px 0px;
}
blockquote:after {
content: "\f10e";
font-family: fontAwesome;
position: absolute;
right: -10px;
bottom: -10px;
text-align: center;
font-size: 43px;
color: #83ba09;
width: 45px;
height: 45px;
line-height: 45px;
z-index: 22;
}
/*----------------------------*\
button
\*----------------------------*/
.primary-button {
position: relative;
display: inline-block;
padding: 0px 30px;
background: #83ba09;
color: #FFF;
font-weight: 400;
height: 45px;
line-height: 45px;
border: none;
border-radius: 25px;
overflow: hidden;
opacity: 0.9;
-webkit-transition: 0.6s all;
transition: 0.6s all;
}
.primary-button:after {
content: "";
position: absolute;
top: 0;
left: -50%;
width: 120%;
height: 100%;
background: rgba(255, 255, 255, 0.5);
-webkit-transform: scale3d(6, 2, 1) rotate(135deg) translate(0, -150%);
transform: scale3d(6, 2, 1) rotate(135deg) translate(0, -150%);
-webkit-transition: 0.6s all;
transition: 0.6s all;
}
.primary-button:hover:after, .primary-button:focus:after {
-webkit-transform: scale3d(6, 2, 1) rotate(135deg) translate(0, 100%);
transform: scale3d(6, 2, 1) rotate(135deg) translate(0, 100%);
}
.primary-button:hover, .primary-button:focus {
color: #FFF;
opacity: 1;
}
/*----------------------------*\
input
\*----------------------------*/
.input {
width: 100%;
background-color: #FFF;
border: 1px solid #e6e6ea;
height: 45px;
padding: 0px 15px;
border-radius: 10px;
-webkit-transition: 0.3s border-color;
transition: 0.3s border-color;
}
textarea.input {
height: 90px;
padding: 15px;
}
.input:focus {
border-color: #83ba09;
}
/*----------------------------*\
section
\*----------------------------*/
.section {
position: relative;
padding: 60px 0px;
}
.section-bg {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
background-size: cover;
background-position: center;
z-index: -1;
}
.section-title {
margin-bottom: 60px;
}
.section-title .title {
font-size: 43px;
text-transform: capitalize;
margin-bottom: 30px;
}
.section-title .sub-title {
color: #23262a;
font-size: 21px;
line-height: 26px;
}
/*=========================================================
LOGO
===========================================================*/
.navbar-brand {
height: 5px;
padding: 0;
}
.navbar-brand .logo {
display: inline-block;
}
.navbar-brand .logo>img {
max-height: 60px;
}
/*=========================================================
NAVGATION
===========================================================*/
#main-navbar1 {
position: absolute;
left: 0;
right: 0;
top: 0;
background-color: #FFFFFF;
z-index: 910;
}
#main-navbar {
position: absolute;
left: 0;
right: 0;
top: 20;
background-color: #8FC122;
z-index: 910;
}
/*----------------------------*\
menu
\*----------------------------*/
.navbar-menu li a {
padding: 20px;
border-right: 0px solid #e6e6ea;
height:60px;
}
.navbar-menu>li:first-child a {
border-left: 0px solid #e6e6ea;
}
.navbar-menu li a:hover, .navbar-menu li a:focus {
background-color: transparent;
color: #204A96;
}
/*----------------------------*\
Dropdown
\*----------------------------*/
.navbar-menu li.has-dropdown {
position: relative;
}
/*.navbar-menu li.has-dropdown>a {*/
/* padding: 20px 30px 20px 20px;*/
/*}*/
.navbar-menu li.has-dropdown:after {
font-family: 'FontAwesome';
content: "\f107";
position: absolute;
right: 10px;
top: 20px;
width: 10px;
font-size: 14px;
/*color: #23262a;*/
color: #fff;
}
.navbar-menu .dropdown {
font-size: 14px;
position: absolute;
width: 300px;
background: #973fa5;
/*background: #6e4570;*/
/*background: #9ec942;*/
/* background: #f4f4f8; */
z-index: 91;
opacity: 0;
visibility: hidden;
-webkit-transform: translateY(15px);
-ms-transform: translateY(15px);
transform: translateY(15px);
-webkit-transition: 0.3s all;
transition: 0.3s all;
}
.navbar-menu .dropdown li a {
display: block;
padding: 10px 10px;
}
.navbar-menu .dropdown li a {
border-top: 1px solid #e6e6ea;
}
.navbar-menu li.has-dropdown:hover>.dropdown {
opacity: 1;
visibility: visible;
-webkit-transform: translateY(0px);
-ms-transform: translateY(0px);
transform: translateY(0px);
}
/*----------------------------*\
search
\*----------------------------*/
* {
box-sizing: border-box;
}
/* Style the search field */
form.example input[type=text] {
padding: 10px;
font-size: 17px;
border: 1px solid grey;
float: left;
width: 80%;
background: #f1f1f1;
}
/* Style the submit button */
form.example button {
float: left;
width: 20%;
padding: 10px;
background: #2196F3;
color: white;
font-size: 17px;
border: 1px solid grey;
border-left: none; /* Prevent double borders */
cursor: pointer;
}
form.example button:hover {
background: #0b7dda;
}
/* Clear floats */
form.example::after {
content: "";
clear: both;
display: table;
}
.navbar-search {
position: relative;
float: right;
margin-left: 15px;
border-right: 0px solid #e6e6ea;
}
.navbar-search .search-btn {
border: none;
background: transparent;
line-height: 20px;
padding: 20px;
color: #23262a;
}
.navbar-search .search-form {
position: absolute;
width: 250px;
right: 0px;
padding: 20px;
z-index: 91;
background: #8fc122;
/* background: #f4f4f8; */
border-top: 1px solid #e6e6ea;
opacity: 0;
visibility: hidden;
-webkit-transform: translateY(15px);
-ms-transform: translateY(15px);
transform: translateY(15px);
-webkit-transition: 0.3s all;
transition: 0.3s all;
}
.navbar-search:hover .search-form {
opacity: 1;
visibility: visible;
-webkit-transform: translateY(0px);
-ms-transform: translateY(0px);
transform: translateY(0px);
}
.search-toggle-btn, .navbar-toggle-btn {
float: right;
width: 60px;
line-height: 60px;
color: #23262a;
background: transparent;
border-left: 1px solid #e6e6ea;
border-right: 0px;
border-top: 0px;
border-bottom: 0px;
}
.search-toggle-btn, .navbar-toggle-btn {
display: none;
}-->
/*----------------------------*\
Responsive Nav
\*----------------------------*/
@media only screen and (max-width: 767px) {
.navbar-brand {
padding-left: 0px;
}
.navbar-menu {
margin: 0px -15px;
border-top: 1px solid #e6e6ea;
max-height: 20px;
overflow-y: scroll;
-webkit-transition: 0.3s max-height;
transition: 0.3s max-height;
}
.navbar-menu li {
border-top: 1px solid #e6e6ea;
}
.navbar-menu.navbar-menu-active {
max-height: 500px;
}
.search-toggle-btn, .navbar-toggle-btn {
display: block;
}
/* Dropdown */
.navbar-menu .dropdown {
display: none;
margin-left: 10px;
border-left: 1px solid #e6e6ea;
position: static;
width: auto;
opacity: 1;
visibility: visible;
-webkit-transform: translateY(0px);
-ms-transform: translateY(0px);
transform: translateY(0px);
}
.navbar-menu li.has-dropdown.dropdown-active>.dropdown {
display: block;
}
.navbar-menu li.has-dropdown:after {
right: 15px;
z-index: -1;
}
.navbar-menu .dropdown li a {
display: block;
padding: 10px 10px;
}
}
/*=========================================================
HEADER
===========================================================*/
#home {
position: relative;
height: 100vh;
}
#home #home-owl {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
#home-owl .home-item {
height: 100vh;
}
#home-owl .home {
position: absolute;
left: 0px;
right: 0px;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
#home-owl.owl-theme .owl-dots {
position: absolute;
bottom: 15px;
left: 0;
right: 0;
}
#home-owl.owl-theme .owl-nav [class*='owl-'] {
position: absolute;
top: 170%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
#home-owl.owl-theme .owl-prev {
left: 15px;
}
#home-owl.owl-theme .owl-next {
right: 15px;
}
.home-content h1 {
font-size: 55px;
color: #FFF;
margin-bottom: 30px;
}
.home-content p.lead {
color: #FFF;
margin-bottom: 30px;
}
#page-header {
position: relative;
margin-top: 60px;
padding: 60px 0px;
}
.header-content h1 {
color: #FFF;
text-transform: capitalize;
margin-bottom: 30px;
}
.header-content .breadcrumb {
background-color: transparent;
padding: 0;
margin: 0px;
}
.header-content .breadcrumb>li a {
color: #FFF;
}
.header-content .breadcrumb>li a:hover, .header-content .breadcrumb>li a:hover {
color: #83ba09;
}
.header-content .breadcrumb>li+li::before {
color: #FFF;
}
.header-content .breadcrumb>.active {
color: #83ba09;
}
/*=========================================================
ABOUT
===========================================================*/
#about.section {
padding-bottom: 0px;
}
#about:after {
content: "";
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0px;
background-color: #204A96;
z-index: -1;
}
#about .section-title {
margin-bottom: 50px;
margin-top: 0px;
}
.about-content .primary-button {
margin-top: 15px;
}
.about-video {
position: relative;
display: block;
border-radius: 10px;
overflow: hidden;
}
.about-video>img {
width: 100%;
}
.about-video .play-icon {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: 90px;
height: 90px;
line-height: 90px;
text-align: center;
background: #fff;
border-radius: 50%;
font-size: 26px;
}
/*=========================================================
NUMBERS
===========================================================*/
.number {
text-align: center;
padding: 30px;
margin-bottom: 30px;
border-radius: 30px;
border: 1px solid #e6e6ea;
background-color: #8FC122;
-webkit-transition: 0.3s border-color;
transition: 0.3s border-color;
}
.number i {
font-size: 43px;
color: #83ba09;
margin-bottom: 15px;
}
.number h3 {
font-size: 33px;
}
.number span {
color: #0E4C98;
font-weight: 700;
}
.number:hover {
border-color: #0E4C98;
}
/*=========================================================
CALL TO ACTION
===========================================================*/
#cta.section {
padding: 90px 0px;
}
.cta-content h1 {
color: #FFF;
font-size: 55px;
}
.cta-content p.lead {
color: #FFF;
}
/*=========================================================
TESTIMONIAL
===========================================================*/
#testimonial.section {
padding: 90px 0px;
}
.testimonial {
padding: 15px;
}
.testimonial .testimonial-meta {
position: relative;
padding-left: 90px;
height: 70px;
margin-bottom: 15px;
padding-top: 10px;
}
.testimonial .testimonial-img {
position: absolute;
left: 0;
top: 0;
width: 70px;
border-radius: 50%;
overflow: hidden;
}
.testimonial .testimonial-img img {
width: 100%;
}
.testimonial .testimonial-meta h3 {
margin-bottom: 5px;
color: #fff;
}
.testimonial .testimonial-meta span {
font-size: 12px;
color: #83ba09;
text-transform: uppercase;
font-weight: 700;
}
.testimonial .testimonial-quote blockquote {
background: #FFF;
margin: 0px 0px;
}
#testimonial-owl.owl-theme .owl-dots {
margin-top: 30px;
}
/*=========================================================
CAUSES
===========================================================*/
.causes {
margin-bottom: 60px;
}
.causes .causes-img {
position: relative;
border-radius: 10px;
overflow: hidden;
}
.causes .causes-img a:after {
content: "";
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
background-color: #83ba09;
opacity: 0;
-webkit-transition: 0.3s opacity;
transition: 0.3s opacity;
}
.causes .causes-img a:hover:after {
opacity: 0.6;
}
.causes .causes-img img {
width: 100%;
}
.causes .causes-progress {
margin-top: 45px;
}
.causes-progress .causes-progress-bar {
position: relative;
height: 6px;
background-color: #e6e6ea;
border-radius: 10px;
margin-bottom: 10px;
}
.causes-progress .causes-progress-bar>div {
position: absolute;
left: 0;
top: 0;
background-color: #83ba09;
bottom: 0;
border-radius: 10px;
}
.causes-progress .causes-progress-bar>div span {
position: absolute;
right: 5px;
top: -3px;
-webkit-transform: translate(50%, -100%);
-ms-transform: translate(50%, -100%);
transform: translate(50%, -100%);
padding: 2px 10px;
background: #83ba09;
color: #FFF;
font-weight: 400;
border-radius: 10px;
font-size: 12px;
}
.causes-progress .causes-progress-bar>div span:after {
content: "";
position: absolute;
background-color: #83ba09;
height: 3px;
bottom: 0;
-webkit-transform: translate(-50%, 100%);
-ms-transform: translate(-50%, 100%);
transform: translate(-50%, 100%);
width: 3px;
left: 50%;
}
.causes-progress .causes-goal {
float: right;
}
.causes .causes-content {
margin-top: 15px;
}
.causes .causes-content h3 {
text-transform: capitalize;
}
.causes .causes-content h3>a {
font-weight: 700;
}
.causes .causes-content .causes-donate {
margin-top: 15px;
}
.causes-details .causes-progress {
width: 75%;
float: left;
margin-top: 45px;
}
.causes-details .causes-donate {
float: right;
margin-top: 30px;
}
/*=========================================================
EVENTS
===========================================================*/
.event {
margin-bottom: 60px;
}
.event:after {
content: "";
display: block;
clear: both;
}
.event .event-img {
position: relative;
float: left;
width: 40%;
border-radius: 10px;
overflow: hidden;
}
.event .event-img a:after {
content: "";
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
background-color: #83ba09;
opacity: 0;
-webkit-transition: 0.3s opacity;
transition: 0.3s opacity;
}
.event .event-img a:hover:after {
opacity: 0.6;
}
.event .event-img img {
width: 100%;
}
.event .event-content {
padding-left: calc(40% + 30px);
}
.event .event-content h3>a {
font-weight: 700;
}
.event .event-meta li {
margin-bottom: 10px;
}
.event .event-meta li>i {
margin-right: 5px;
width: 25px;
height: 25px;
line-height: 25px;
border-radius: 50%;
color: #83ba09;
border: 1px solid #e6e6ea;
text-align: center;
font-size: 15px;
}
.event-details .event-meta {
margin-top: 30px;
}
.event-details .event-meta li {
margin-bottom: 15px;
}
.event-details .event-meta li>i {
margin-right: 10px;
width: 45px;
height: 45px;
line-height: 45px;
border-radius: 50%;
color: #83ba09;
border: 1px solid #e6e6ea;
text-align: center;
font-size: 21px;
}
/*=========================================================
BLOG
===========================================================*/
.article {
margin-bottom: 60px;
}
.article .article-img {
overflow: hidden;
border-radius: 10px;
}
.article .article-img a {
position: relative;
display: block;
}
.article .article-img a:after {
content: "";
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
background-color: #83ba09;
opacity: 0;
-webkit-transition: 0.3s opacity;
transition: 0.3s opacity;
}
.article .article-img a:hover:after {
opacity: 0.6;
}
.article .article-img img {
width: 100%;
}
.article .article-content {
margin-top: 30px;
}
.article .article-content .article-title {
text-transform: capitalize;
}
.article .article-content .article-title>a {
font-weight: 700;
}
.article .article-content .article-meta {
margin: 15px 0px 10px;
font-size: 14px;
font-weight: 400;
}
.article .article-content .article-meta li {
display: inline-block;
margin-right: 10px;
}
/*----------------------------*\
tags & share
\*----------------------------*/
.article-tags-share {
margin-top: 30px;
}
.article-tags-share:after {
content: "";
display: block;
clear: both;
}
.article-tags-share .tags {
width: 60%;
float: left;
font-size: 14px;
font-weight: 400;
display: inline-block;
}
.article-tags-share .tags li {
display: inline-block;
margin-right: 15px;
margin-bottom: 3px;
}
.article-tags-share .tags li a:before {
content: "\f02b";
display: inline-block;
font-family: FontAwesome;
margin-right: 5px;
}
.article-tags-share .share {
float: right;
display: inline-block;
font-size: 14px;
font-weight: 400;
}
.article-tags-share .share li {
display: inline-block;
margin-right: 15px;
}
/*----------------------------*\
comments
\*----------------------------*/
.article-comments {
margin-top: 60px;
}
.article-comments .media {
padding: 30px;
border: 1px solid #e6e6ea;
margin-top: 30px;
border-radius: 10px;
}
.article-comments .media .media-left {
padding-right: 30px;
}
.article-comments .media .media-left .media-object {
border-radius: 50%;
}
.article-comments .media .media-body .media-heading {
margin-bottom: 15px;
}
.article-comments .media .media-body .media-heading h4 {
display: inline-block;
text-transform: capitalize;
}
.article-comments .media .media-body .media-heading .time {
font-size: 12px;
margin-left: 15px;
font-weight: 400;
}
.article-comments .media .media-body .media-heading .reply {
float: right;
font-size: 14px;
text-transform: uppercase;
font-weight: 400;
}
.article-comments .media .media-body .media-heading .reply:after {
content: "\f112";
font-family: FontAwesome;
margin-left: 5px;
}
/*----------------------------*\
reply form
\*----------------------------*/
.article-reply {
margin-top: 60px;
}
.article-reply form {
margin-top: 30px;
}
.article-reply form .form-group {
margin-bottom: 30px;
}
/*----------------------------*\
pagination
\*----------------------------*/
.article-pagination {
margin-bottom: 60px;
}
.article-pagination li {
display: inline-block;
margin-right: 10px;
}
.article-pagination li a {
display: block;
width: 45px;
height: 45px;
line-height: 45px;
border-radius: 50%;
color: #5f646b;
text-align: center;
background-color: #FFF;
border: 1px solid #e6e6ea;
-webkit-transition: 0.3s border-color;
transition: 0.3s border-color;
}
.article-pagination li a:hover {
border-color: #83ba09;
}
.article-pagination li.active {
display: inline-block;
width: 45px;
height: 45px;
line-height: 45px;
border-radius: 50%;
color: #5f646b;
text-align: center;
background-color: #FFF;
border: 1px solid #83ba09;
}
.article-pagination li.active:hover {
cursor: default;
}
/*=========================================================
ASIDE
===========================================================*/
.widget+.widget {
margin-top: 60px;
}
.widget .widget-title {
margin-bottom: 30px;
text-transform: capitalize;
}
/*----------------------------*\
category
\*----------------------------*/
.widget-category ul li+li {
margin-top: 15px;
}
.widget-category ul li a span {
color: #83ba09;
margin-left: 10px;
}
/*----------------------------*\
posts
\*----------------------------*/
.widget-post+.widget-post {
margin-top: 30px;
}
.widget-post>a {
display: block;
font-family: 'Source Sans Pro', sans-serif;
margin-bottom: 10px;
font-weight: 700;
text-transform: capitalize;
letter-spacing: 0px;
}
.widget-post>a .widget-img {
position: relative;
float: left;
width: 85px;
border-radius: 10px;
overflow: hidden;
}
.widget-post>a .widget-img>img {
width: 100%;
}
.widget-post>a .widget-img:after {
content: "";
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
background-color: #83ba09;
opacity: 0;
-webkit-transition: 0.3s opacity;
transition: 0.3s opacity;
}
.widget-post>a:hover .widget-img:after {
opacity: 0.6;
}
.widget-post>a .widget-content {
padding-left: 100px;
min-height: 60px;
}
.widget-post .article-meta li {
display: inline-block;
font-size: 12px;
margin-right: 10px;
font-weight: 400;
}
/*----------------------------*\
causes
\*----------------------------*/
.widget-causes+.widget-causes {
margin-top: 30px;
}
.widget-causes>a {
display: block;
font-family: 'Source Sans Pro', sans-serif;
margin-bottom: 10px;
font-weight: 700;
text-transform: capitalize;
}
.widget-causes>a .widget-img {
position: relative;
float: left;
width: 85px;
border-radius: 10px;
overflow: hidden;
}
.widget-causes>a .widget-img>img {
width: 100%;
}
.widget-causes>a .widget-img:after {
content: "";
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
background-color: #83ba09;
opacity: 0;
-webkit-transition: 0.3s opacity;
transition: 0.3s opacity;
}
.widget-causes>a:hover .widget-img:after {
opacity: 0.6;
}
.widget-causes>a .widget-content {
padding-left: 100px;
min-height: 60px;
}
.widget-causes .causes-progress {
margin-top: 15px;
}
.widget-causes .causes-raised, .widget-causes .causes-goal {
font-size: 12px;
}
/*=========================================================
FOOTER
===========================================================*/
#footer {
background-color: #8fc122;
}
.footer {
margin-bottom: 30px;
}
.footer .footer-title {
margin-bottom: 30px;
text-transform: capitalize;
}
/*----------------------------*\
logo
\*----------------------------*/
.footer-logo {
margin-bottom: 30px;
}
.footer-logo .logo {
display: inline-block;
}
.footer-logo .logo img {
max-height: 80px;
}
/*----------------------------*\
contact
\*----------------------------*/
.footer-contact {
margin-top: 30px;
}
.footer-contact li {
margin-bottom: 10px;
}
.footer-contact li i {
margin-right: 5px;
}
/*----------------------------*\
galery
\*----------------------------*/
.footer-galery {
margin: 0px -5px;
}
.footer-galery li {
display: inline-block;
width: 33.33%;
margin-right: -4px;
padding: 5px;
}
.footer-galery li a {
position: relative;
display: block;
border-radius: 10px;
overflow: hidden;
}
.footer-galery li a:after {
content: "";
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
background-color: #83ba09;
opacity: 0;
-webkit-transition: 0.3s opacity;
transition: 0.3s opacity;
}
.footer-galery li a:hover:after {
opacity: 0.6;
}
.footer-galery li a>img {
width: 100%;
}
/*----------------------------*\
newsletter
\*----------------------------*/
.footer-newsletter {
margin: 30px 0px;
}
.footer-newsletter .primary-button {
margin-top: 15px;
display: block;
width: 100%;
}
/*----------------------------*\
social
\*----------------------------*/
.footer-social li {
display: inline-block;
margin-right: 10px;
}
.footer-social li a {
display: block;
width: 45px;
height: 45px;
line-height: 45px;
border-radius: 50%;
color: #5f646b;
text-align: center;
background-color: #FFF;
border: 1px solid #e6e6ea;
-webkit-transition: 0.3s border-color;
transition: 0.3s border-color;
}
.footer-social li a:hover, .footer-social li a:focus {
border-color: #83ba09;
}
.footer-social2 li {
display: inline-block;
margin-right: 10px;
}
.footer-social2 li a {
display: block;
width: 45px;
height: 45px;
line-height: 45px;
border-radius: 50%;
color: #5f646b;
text-align: center;
background-color: #FFF;
border: 1px solid #e6e6ea;
-webkit-transition: 0.3s border-color;
transition: 0.3s border-color;
}
.footer-social2 li a:hover, .footer-social li a:focus {
border-color: #83ba09;
}
/*----------------------------*\
copyright & footer nav
\*----------------------------*/
#footer-bottom {
border-top: 0px solid #e6e6ea;
padding-top: 30px;
}
#footer-bottom .footer-nav {
text-align: right;
}
#footer-bottom .footer-nav li {
display: inline-block;
margin-right: 15px;
}
#footer-bottom .footer-nav li a {
color: #5f646b;
}
#footer-bottom .footer-nav li a:hover, #footer-bottom .footer-nav li a:focus {
color: #83ba09;
}
/*=========================================================
RESPONSIVE
===========================================================*/
@media only screen and (max-width: 1201px) {}
@media only screen and (max-width: 991px) {
.section-title .title {
font-size: 33px;
}
.home-content h1 {
font-size: 43px;
}
.about-video {
margin-top: 30px;
}
.cta-content h1 {
font-size: 43px;
}
#footer-bottom .footer-nav {
text-align: left;
}
.footer-copyright {
margin-top: 30px;
}
}
@media only screen and (max-width: 767px) {
.causes-details .causes-progress {
width: 100%;
float: none;
}
.causes-details .causes-donate {
float: none;
}
.article-tags-share .tags, .article-tags-share .share {
display: block;
float: none;
width: 100%;
}
.article-tags-share .share {
margin-top: 15px;
}
}
@media only screen and (max-width: 480px) {
.event .event-img {
float: none;
margin-bottom: 15px;
}
.event .event-content {
padding-left: 0px;
}
.article-comments .media {
padding: 10px;
}
}
/*=========================================================
OWL THEME
===========================================================*/
/*----------------------------*\
owl nav
\*----------------------------*/
/*.owl-theme .owl-nav [class*='owl-'] {*/
/* color: #204A96;*/
/* background: 204A96;*/
/* padding: 0px;*/
/* width: 90px;*/
/* height: 90px;*/
/* line-height: 90px;*/
/* font-size: 26px;*/
/* margin: 0;*/
/* border-radius: 50%;*/
/* -webkit-transition: 0.3s all;*/
/* transition: 0.3s all;*/
/*}*/
.owl-theme .owl-nav [class*='owl-']:hover {
background: #6e4570;
}
/*----------------------------*\
owl dots
\*----------------------------*/
.owl-theme .owl-dots .owl-dot span {
border: 1px solid #FFF;
background: transparent;
-webkit-transition: 0.2s all;
transition: 0.2s all;
}
.owl-theme .owl-dots .owl-dot:hover span {
border-color: #6e4570;
background: #6e4570;
}
.owl-theme .owl-dots .owl-dot.active span {
width: 20px;
border-color: #6e4570;
background: #6e4570;
}