/* CharityClub Nonprofit HTML5 Template */


/************ TABLE OF CONTENTS ***************
1. Fonts
2. Reset
3. Global
4. Main Header / Header Style Two
5. Main Slider
6. Main Features
7. Featured Fluid Section
8. Welcome Section
8. Default Section
9. Default Featured Columns / Recent Projects / Events Section
10. Two Column Fluid
11. Vertical Links
12. Testimonials Style One
13. Blog News Section
14. Sponsors Carousel
15. Parallax Section
16. Intro Section
17. Main Footer
18. Default Icon Column
19. Testimonials Style Two
20. Our Team
21. FAQs Page
22. Error Page
23. Blog Pages / Classic / Three Column
24. Blog Details
25. Comments Area
26. Comment Form
27. Sidebar Styles / Widgets
28. Gallery Masonry
29. Gallery Three Column
30. Contact Page

**********************************************/

@import url(https://fonts.googleapis.com/css?family=Roboto:400,300,300italic,400italic,500,500italic,700,700italic);
@import url(https://fonts.googleapis.com/css?family=Raleway:800,700,600,500,400,400italic);

@import url('font-awesome.css');
@import url('flaticon.css');
@import url('animate.css');
@import url('jquery.bxslider.css');
@import url('owl.css');
@import url('jquery.fancybox.css');
@import url('hover.css');

/*** 

====================================================================
	Reset
====================================================================

 ***/
* {
	margin:0px;
	padding:0px;
	border:none;
	outline:none;
}

/*** 

====================================================================
	Global Settings
====================================================================

 ***/

#body{
	background-color: black;
}


#header.header-scrolled {
    top: 0;
    background: rgba(51, 11, 83, 0.85);
    border-bottom: 1px solid #37332a;
}
#header {
    background: rgba(52, 11, 83, 0.6);;
    border-bottom: 1px solid rgba(12, 11, 9, 0.6);
    transition: all 0.5s;
    z-index: 997;
    padding: 15px 0;
    top: 40px;}
    .d-flex {
        display: flex!important;}

        .fixed-top {
            position: fixed;
            top: 0;
            right: 0;
            left: 0;
            z-index: 1030;
        }






#navbar {
    height: 70px;
    transition: all 2s;
    z-index: 997;
    transition: all 2s;
    background:#360c41;
}
.container-fluid .logo{
	
	background-color: transparent;
	
}
.logo{
    color: aliceblue;
	
}
.s_card{
	height: auto;
	margin: -2px;
	background-color: black;
	color: aliceblue;
}
.side_1 h2{
	text-transform: uppercase;
    font-family: roboto;
    font-style: italic;
	font-weight: 800;
}
.side_1 ul{
	margin-top: 50px;
    margin-bottom: 1rem;
    font-size: 21px;
}
.s1_card{
	height: auto;
	margin: -2px;
	background-color:#292929;
	color: aliceblue;	
}
span{
	color: #35b7ff;
}
.side_1.center_1.col-md-12.m-auto {
    text-align: center;
}
.style_demo_selector img{
	border-radius: 30px;
	margin:10px;
}

.faq-container{
    max-width: 100%;
    margin: 0 auto;
}

.faq{
    background-color: transparent;
    border: 1px solid #9fa4a8;
    border-radius: 10px;
    margin: 20px 0;
    padding: 30px;
    position: relative;
    overflow: hidden;
    transition: 0.3s ease;
}
input#floatingInputGrid {
    color: aliceblue;
    background-color: #282828;
    font-size: larger;
    padding-bottom: 2rem;
    border: none;
    text-align: center;
    
}
.form-floating img {
    z-index: auto;
    position: absolute;
    padding: 1rem;
    padding-left: 4rem;
}

.faq.active {
    background-color: rgb(9, 9, 9);
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1), 0 3px 
    6px rgba(0, 0, 0, 0.1);
}

.faq.active::before,
.faq.active::after {
    content: '\f075';
    font-family: 'Font awesome 5 free';
    color: #000000;
    font-size: 7rem;
    position: absolute;
    opacity: 0.2;
    top: 20px;
    left: 20px;
    z-index: 0;
}

.faq.active::before{
    color: #000000;
    top: -10px;
    left: -30px;
    transform: rotateY(180deg);
}

.faq-title{
    margin: 0 35px 0 0;
}

.faq-text{
    display: none;
    margin: 30px 0 0;
}

.faq.active .faq-text{
    display: block;
}

.faq-toggle{
    background-color:aliceblue;
    border-radius: 50%;
    border: 0;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    padding: 0;
    position: absolute;
    top: 30px;
    right: 30px;
    width: 30px;
    height: 30px;
}

.faq-toggle:focus{
    outline: none;
}

.faq-toggle .fa-times {
    display: none;
}

.faq.active .faq-toggle .fa-times {
    display: block;
    color: white;
}

.faq.active .faq-toggle .fa-chevron-down{
    display: none;
}

.faq.active .faq-toggle {
    background-color: #9fa4a8;
}
p.terams {
    text-align: end;
}
.col-md-4.img_4 {
    margin-top: -75px;
}
.col-md-4.img_5 {
    margin-top: 90px;
}
.img{
    background-image:url("image/image_1.png");
    border-radius: 20px;
}
#header{
    background-image:url("image/header_img.png");
    width: 100%;
}
.side1 h2 {
    text-transform: initial !important;
    font-style: inherit !important;
}
input#flexCheckDefault {
    background-color: #35b7ff;
    size: auto;
}
input#exampleInputEmail1 {
    background: #282828;
    border: none;
}
button.btn.btn-primary.btn-lg {
    background-color: #35b7ff ;
}
.side_1 img :hover .ddd {
    border-radius: initial;
}