* {
     padding: 0;
     margin: 0;
     /* color: #2B2D2C; */
     box-sizing: border-box;

}

/* importing font to project */

.stick_main {
     /* top: 80px; */
     position: relative;

}

.logos_hold {
     height: 50px;
}

@font-face {
     font-family: 'BarlowCondensedMedium';
     src: url("../font/BarlowCondensed-Medium.ttf");
     font-weight: bold;
     font-size: 64px;
     letter-spacing: -2%;
}

@font-face {
     font-family: 'Montserratmedium';
     src: url("../font/BarlowCondensed-Medium.ttf");
     font-weight: medium;
}

@font-face {
     font-family: 'BarlowCondensedlight';
     src: url("../font/BarlowCondensed-Light.ttf");
}

@font-face {
     font-family: 'BarlowCondensedRegular';
     src: url("../font/BarlowCondensed-Regular.ttf");
}

@font-face {
     font-family: 'BarlowCondensedBold';
     src: url("../font/BarlowCondensed-Bold.ttf");
}

/* header */
.elevationh1 {
     font-family: BarlowCondensedMedium;
     font-size: 64px;
     letter-spacing: -2%;
     font-weight: bold;
}

.elevationdefault {
     font-family: BarlowCondensedMedium;
     font-size: 97px;
     letter-spacing: -2%;
     font-weight: bold;
}

.elevationh2 {
     font-family: BarlowCondensedMedium;
     font-size: 40px;
     letter-spacing: -2%;
     font-weight: bold;
}

.elevationh3 {
     font-family: BarlowCondensedMedium;
     font-size: 24px;
     letter-spacing: -2%;
     font-weight: bold;
}

.elevationh4 {
     font-family: BarlowCondensedMedium;
     font-size: 20px;
     letter-spacing: -2%;
     font-weight: bold;
}

.elevationh5 {
     font-family: BarlowCondensedMedium;
     font-size: 15px;
     /* letter-spacing: -2%;
                  */
     font-weight: bold;
}

.subtile {
     font-family: Montserratmedium;
     font-size: 24px;
     font-weight: medium;
}

.body_text {
     font-family: Montserratmedium;
     font-size: 16px;
     font-weight: medium;
     line-height: 140%;
}

.content__box {
     width: 58%;
}

.mobile-nav {
     float: right;
     position: relative;
     display: none;
}

.mobile-nav__trigger {
     cursor: pointer;
     display: inline-block;
     margin-top: 2rem;
     float: right;
}

.mobile-nav__trigger .icon {
     display: inline-block;
     float: left;
     width: 14px;
     margin: 0 5px 0 0;
     padding-top: 3px;
}

.icon {
     height: 1em;
     width: 1em;
     display: inline-block;
     margin-top: -0.4rem;
     vertical-align: middle;
     color: inherit;
}

.mobile-nav__trigger .icon .line {
     display: block;
     width: 100%;
     height: 2px;
     background: #023545;
     transform-origin: 0;
     transition: ease .2s;
}

.mobile-nav__trigger .icon .line--2 {
     margin-top: 6px;
}

.mobile-nav__trigger.active .line--1 {
     transform: rotate(35deg);
}

/* line 333, ../sass/site/components/_nav.scss */
.mobile-nav__trigger.active .line--2 {
     transform: rotate(-35deg);
}

.mobile-nav__trigger .icon .line--2 {
     margin-top: 6px;
}

.mobile-nav .mobile-nav-menu__list li a {
     display: block !important;
     text-align: center;
}

.mobile-nav .mobile-nav-menu__list__item a {
     color: #2B2D2C;
     font-weight: 500;
}

.mobile-nav .mobile-nav-menu__list li {
     width: 100% !important;
     display: block !important;
     margin-top: 14px;
}

.button--default,
.button--default {
     background-color: white;
     color: #023546;
     border: 1px solid #000;
}

.button--primary,
.button--primary {
     background-color: #f7c32e;
     color: #fff;

}

.mobile-nav .mobile-nav-menu {
     background: #fff;
     /* background: rgba(255, 255, 255, .99); */
     width: calc(100vw - 40px) !important;
     box-shadow: 0 0px 1px #fff;
     border-radius: 2px;

     padding: 10px 30px 25px;
     position: absolute;
     top: 5rem;
     right: 0;
     display: none;
     animation: fade-in .5s;
     -webkit-animation: fade-in .5s;
}

.elevationsmall {
     font-family: Montserratmedium;
     font-size: 14px;
     font-weight: medium;
}

.elevationp {
     font-family: BarlowCondensedlight;
     font-size: 16px;
     line-height: 2;
}

.elevation_light {
     font-family: BarlowCondensedlight;
     font-size: 16px;
}

.pretitle {
     font-family: BarlowCondensedMedium;
     font-size: 10px;
     letter-spacing: 4%;
}

.button_text {
     font-family: BarlowCondensedMedium;
     font-size: 16px;
     font-weight: bold;
}

.linkelevation {
     font-family: BarlowCondensedMedium;
     font-size: 16px;
     font-weight: bold;
     text-decoration: underline;
}

.body_text_v1 {
     font-family: Montserratmedium;
     font-size: 18px;
     font-weight: medium;
     line-height: 140%;
     /* color:#fff !important; */
}

.header_color {
     color: #0E0E2C;
}

.blue_text_color {
     color: #195296;
}

.d_space_top {
     margin-top: 30px;
}

.d_space_top_10 {
     margin-top: 10px;
}

.wc_content {
     margin-left: auto;
     margin-right: auto;
     padding-top: 80px;
     padding-bottom: 80px;
     overflow: hidden;
}

.wc_content__other {
     margin-left: auto;
     margin-right: auto;
     overflow: hidden;
}

.content_body_text {
     font-family: BarlowCondensedRegular;
     font-weight: 500;
     font-size: 16px;
     text-align: center;

}

.hero-image {
     background-image: url("../images/watch.jpg");
     /* The image used *

     /* Used if the image is unavailable */
     height: 360px;
     /* You must set a specified height */
     background-position: center;
     /* Center the image */
     background-repeat: no-repeat;
     /* Do not repeat the image */
     background-size: cover;
     /* Resize the background image to cover the entire container */
}

.sect_color {
     background: #F1F5F9;
}

.color__red {
     color: #E6103D;
}

.border__color {
     border: 1px solid #195296;
}

.content_body_textP {
     font-family: BarlowCondensedRegular;
     font-weight: 600;
     font-size: 16px;
     text-align: left;
     line-height: 2;


}

.content_body_textBolder {
     font-family: BarlowCondensedRegular;
     font-weight: 800;
     font-size: 16px;
     text-align: left;
     line-height: 2;


}

.speacial_font {
     font-family: BarlowCondensedRegular;
}

.text_coloring_captial {
     color: #4F4F4F;
     text-transform: uppercase;
     font-weight: 500;
}

.content_body_header {
     font-family: BarlowCondensedBold;
     font-weight: 600;
     font-size: 16px;
     text-align: left;
     line-height: 2;


}

.content_body_text_listg {
     font-family: BarlowCondensedRegular;
     font-weight: 400;
     font-size: 16px;
     text-align: left;
     /* line-height: 2; */


}

.content_body_text_list_just {
     font-family: BarlowCondensedRegular;
     font-weight: 400;
     font-size: 16px;
     text-align: justify;
     /* line-height: 2; */


}

.content__ {
     font-family: BarlowCondensedRegular;
     font-size: 22px;
     text-align: justify;
     /* line-height: 2; */


}

.font_typePoppins {
     font-family: BarlowCondensedRegular;
}

.text_coloring {
     color: #ffffff;
}

.text_coloring_captal {
     color: #ffffff;
     text-transform: uppercase;
     font-weight: 500;
}

/*font closing */
.main_header_wrap {
     display: inline-block;
     position: relative;
     top: 0;
     width: 100%;
     height: 80px;
     background: #000000;
     /* opacity: 0.8; */
     /* background: rgba(15, 48, 87, 0.98); */
     box-shadow: 0 0 5px #ddd;

     z-index: 1000;
     vertical-align: middle;
}

.main_header_wrap_stick {
     display: inline-block;
     position: relative;
     top: 0;
     width: 100%;
     height: 80px;
     /* height: 200px;
                  */
     /* background-color:#005891;
                  */
     background: #000000;
     /* opacity: 0.8; */
     /* background: rgba(15, 48, 87, 0.98); */
     /* box-shadow: 0 0 5px #ddd;
                  */
     z-index: 1000;
     vertical-align: middle;
}

.list-styled {

     list-style-image: url("../images/frame.svg");
     /* display: inline-block; */
     /* vertical-align: middle;
     margin: 1em 0; */
}

.mid_raduis {
     border-radius: 20px 0px 0px 20px;
}

.mid_raduis__ {
     border-radius: 0px 20px 20px 0px;
}

.left_padding {
     padding-left: 30px;
}

.__increasing {
     padding-top: 30px;
     padding-bottom: 30px;
     width: 80%;
}

.spaces {
     /* / padding-top: 10px; */
     padding-bottom: 10px;

}

.main__wrap {
     display: inline-block;
     position: relative;
     width: 100%;
     height: 100vh;
     margin-top: -5%;
     background-color: #0000000a;

     /* background: rgba(0, 0, 0, .6); */
     /* background: rgba(15, 48, 87, 0.98); */
     /* height: 200px;
                  */
     /* background-color:#005891;
                  */
     box-shadow: 0 0 5px #ddd;
     z-index: 1000;
     vertical-align: middle;
     transition: all 0.3s ease-in-out;

}

.pull-left {
     float: left !important;
}

.main-header__logo {
     display: inline-block;
     /* width: 140px;
                  */
     line-height: 80px;
     vertical-align: middle;
}

.wrap {
     padding-left: 10px;
     padding-right: 10px;
}

.main_logo_left {
     float: left;
}

.main-header__right {
     float: right;
}

.nav {
     display: inline-block;
     vertical-align: middle;
     height: 80px;
}

.nav__menu {
     display: inline-block;
     margin: 0;

}

.list-unstyled {
     padding-left: 0;
     list-style: none;
}

.nav__item {
     position: relative;
     display: inline-block;
     color: #195296;
     /* color: #ffffff; */
     text-align: center;
     line-height: 80px;
     margin-left: 15px;
     margin-right: 15px;
     font-weight: 500;
}

.nav__button {
     position: relative;
     display: inline-block;
     line-height: 80px;
     text-align: center;
     margin-left: 10px;
}

.acc__button {
     position: relative;
     display: inline-block;
     line-height: 80px;
     text-align: center;
     margin-left: 10px;
}

.acc__button,
.heff {
     font-weight: 600;
     padding: 15px 30px;
     font-size: 18px;
     /* padding: 8px 16px; */
     color: #fff;
     background: #F5A533;
     text-decoration: none;
     cursor: pointer;
     /* border-radius: 30px; */
}

.nav__button a {
     font-weight: 500;
     padding: 10px 30px;
     /* padding: 8px 16px; */
     color: inherit;
     background: white;
     cursor: pointer;
     /* border-radius: 30px; */
     border: solid 1px inherit;
     /*box-shadow: 0 2px 3px rgba(50,50,93,.11), 0 1px 2px rgba(0,0,0,.08);*/
     /*font-family: $simple-font-family;*/
}

.conten_ing {
     display: inline-block;
     /* margin: 0 9%;
                  */
     vertical-align: middle;
     /* margin: 0 5%; */

     margin: 0 20%;
}

.box {
     display: inline-block;
     text-align: center;
     background-color: brown;
}

.search_contrnt {
     position: relative;
     display: inline-block;
     color: #ffffff;
     text-align: center;
     line-height: 80px;
     margin-left: 62px;
     margin-right: 62px;
}

.close_button {
     display: inline-block;
     background-color: red;
}

.main-header__right_search {
     float: right;
     width: 40%;
}

.hide_mobile_icon {
     display: none;
}

.main-icon_mobile {
     float: right;
     /* width: 40%; */
}

.box_color_one {

     width: 567px;
     height: 200px;
}

.box_color_two {

     width: 567px;
     height: 200px;
}

.box_color_three {

     width: 567px;
     height: 200px;
}

.search_holder {
     display: inline-block;
     vertical-align: middle;
     position: relative;
     width: 300px;
     height: 40px;
}

.in_holding {
     position: absolute;
     top: 0;
     left: 0;
     width: 120%;
     height: 100%;
     color: #ffffff;
     /* background-color: #005891;
                  */
     background: rgba(15, 48, 87, 0.98);
     outline: none;
     border: 1px solid #ffffff;
     padding: 0 10px 0 45px;
     border-radius: 5px;
}

.in_holding,
input::placeholder {
     color: #ffffff;
}

.icon_place {
     position: absolute;
     top: 50%;
     transform: translateY(-50%);
     left: 10px;
     padding-right: 10px;
}

.first_holder {
     display: inline-block;
     margin-bottom: 16px;
     margin-top: 12px;
     background-color: #f8f8f8;
}

.small_text {
     line-height: 10px;
}

.mobile_display {
     display: block;
     position: relative;
     align-items: center;
}

.list_menu {
     text-align: center;
}

.nav__item_nnav {
     top: 10px;
     margin-left: 15px;
     position: relative;
     display: block;
     color: #ffffff;
     height: 50px;
}

.content_hidden {
     display: none;
}

.submenu_holder {
     display: none;
}

.more_menu:hover>.submenu_holder {
     display: block;
     margin-left: 400px;
     margin-top: -35px;
}

/* menu show and hide power button */
.button__close {
     color: #ffff;
     font-weight: 500;
     font-size: 25px;
     margin-top: 10px;
     margin-bottom: 10px;
     cursor: pointer;
}

/* 
.close_moblie_menu {
     display: none;
} */

/* slider stage 2 */
.cover {
     height: 100vh;
     overflow: hidden;
     /* background-color: red;
                  */
}

.swiper {
     width: 100%;
     height: 100%;
}


.swiper-slide {
     text-align: center;
     font-size: 18px;
     background: #fff;
     /* Center slide text vertically */
     display: -webkit-box;
     display: -ms-flexbox;
     display: -webkit-flex;
     display: flex;
     -webkit-box-pack: center;
     -ms-flex-pack: center;
     -webkit-justify-content: center;
     justify-content: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
     -webkit-align-items: center;
     align-items: center;
}

.swiper-slide img {
     display: block;
     width: 100%;
     height: 100%;
     object-fit: cover;
}

/* stage-3 */
.onine_church {
     overflow: hidden;
     padding-top: 80px;
     padding-bottom: 80px;
     background: #F1F5F9;
}

.placeholder {
     width: 708px;
     height: 85px;
     left: 0;
     top: 375px;
     color: red;
}

.online {
     margin: 40px 0 0;
}

.online_2 {
     margin: 133px 180px 15px;
}

.online_3 {
     margin: 0 37% 16px 65px;
}

.content_placement_vi {
     justify-content: left !important;
}

.eclipse {
     float: right;
     position: relative;
     margin-top: -14%;
}

.sec_2 {
     z-index: 1;
     position: relative;
}

.setting {
     margin-left: 177px;
     margin-right: 50px;
}

/* button */
.elevation_donate {
     font-size: 14px;
     background-color: #005891;
     position: relative;
     border: 1px solid #005891;
     border-radius: 8px;
     color: #F1F5F9;
}

.nav__button--primary a {
     color: #fff;
     background-color: #005891;
}

.nav__button--danger a {
     color: #fff;
     text-decoration: none;
     background-color: #f7c32e;
}

.nav__button--tranparent a {
     color: #2B2D2C;
     text-decoration: none;
     border: 1px solid #000000;
}

.elevation_donate:hover {
     background-color: #005891;
     color: #fff;
}


.arrow_padding {
     padding-left: 10px;
}

.arrow_padding:hover {
     color: #fff;
}

.adjust_botton {
     margin-left: -67%;
     width: 34%;
}

/* stage 4 */
.eclipse_st_4 {
     float: right;
     position: relative;
     margin-top: -44%;
     margin-right: -17px;
}

.text_placement_st_4 {
     margin: 14% 55px 15px 27px;
}

.text_placemen_s_4 {
     margin: 17px 156px 22px 31px;
}


/* card sliders */
.header_title {
     margin: 37px 30px 40px;
}

.size_card {
     width: 397px;
     height: 408px;
     box-shadow: 0 4px 24px rgba(0, 0, 0, 0.04);
     border: none;
}

.small_frame {
     width: 300px;
     height: 250px;
}

.small_cad {
     position: relative;
     background-color: #005891;
     margin: -86px 80px;
     border-radius: 5px;
}

.remover_underline_slider {
     text-decoration: none;
     color: #0E0E2C;
}

/* news */
.new_wrapper {
     height: 199px;
     background: linear-gradient(0deg, rgba(0, 88, 145, 0.1), rgba(0, 88, 145, 0.1));
}

.addition {
     position: relative;
     text-align: left;
     left: 40px;
     top: 40px;
}

.addition_text_p {
     position: relative;
     text-align: left;
     left: 40px;
     top: 40%;
     width: 580px;
}

.input_post {
     width: 69%;
     position: relative;
     float: left;
     top: 36px;
}

.button_post_news {
     position: relative;
     display: inline-block;
     top: 64px;
     width: 31%;
}

.join_community {
     background-color: #195296;
     border: 1px solid #195296;
     width: 250px;
     height: 40px;
     border-radius: 50px;
}

.white_tn {
     background-color: #ffff;
     border: 1px solid #ffff;
     color: #195296;
     width: 250px;
     height: 40px;
     border-radius: 50px;
}

.width_40 {
     width: 43% !important;
}

.submit__button {
     background-color: #195296 !important;
     border: 1px solid #195296 !important;
     height: 40px;
     border-radius: 5px;
}

.subscribe_button {
     font-size: 16px;
     background-color: #005891;
     height: 49px;
     width: 84%;
     border: 1px solid #005891;
     border-radius: 8px;
     color: #fff;
}

.subscribe_ {
     height: 48px;
     border: 1px solid #005891;
     background: #DBE5EF;
}

/* discipleship */
.flowing__text {
     margin: 32px 137px 41px 130px;
}

.ellipse_p {
     float: right;
     position: relative;
     margin-top: -71%;
     left: -87%;
}

.ellipse {
     position: relative;
     top: -15%;
}

/* footer listing */
.footer__wrapper {
     width: 100%;
     padding-top: 6%;
     /* padding-bottom: 20px;
                  */
     background: rgba(241, 245, 249, 1);
     /* background: rgba(15, 48, 87, 0.98); */
}

.footer_listing {
     display: block;
     line-height: 54px;
     text-align: left;
}

.heading_text {
     text-align: left;
     color: #A3D15C;
}

.remover_underline {
     text-decoration: none;
     /* color: #fff; */
     color: #195296;
}


.remover___ {
     text-decoration: none;
     color: #fff;
}

.copyright {
     color: #4F4F4F;
     line-height: 80px;
     text-align: left;
}

.footer__item {
     position: relative;
     display: inline-block;
     color: #ffffff;
     text-align: center;
     line-height: 80px;
     margin-left: 15px;
     margin-right: 15px;
}

.social_icons_listing {
     margin-left: 15px;
     margin-right: 15px;
     text-decoration: none;
     line-height: 80px;
}

/* i'm new page */
.onine_new {
     overflow: hidden;
     padding-top: 80px;
     padding-bottom: 80px;
     /* background: #F1F5F9;
                  */
}

.heading_colors {
     color: #1B0B32;
}

.text_im_color {
     color: #4F4F4F;
}

.im_new_wrapper {
     background: #F6FAFE
}

.im_new_page {
     margin: 97px 35px 122px 82px;
}

.image_balancing {
     top: 61px;
     position: relative;
     width: 87%;
}

.addition_text_new {
     position: relative;
     top: 50px;
}

.addition_nw {
     position: relative;
     top: 40px
}

.new_wrapper_im_new {
     height: 245px;
     background: linear-gradient(0deg, rgba(0, 88, 145, 0.1), rgba(0, 88, 145, 0.1));
}

.sendback {
     z-index: 1;
}

.eclipse_st_im {
     position: relative;
     margin-top: -8%;
     margin-left: 17%;
}

.contact_button {
     font-size: 16px;
     /* background-color: #005891;
                  */
     background-color: #dfe8f2;
     height: 49px;
     width: 84%;
     border: 1px solid #005891;
     border-radius: 8px;
     color: #005891;
}

.box_card {
     color: #ffff;
     position: relative;
     top: 41%;
}

.box_card_p {
     top: 40%;
     position: relative;
     color: #fff;
}

.elevation_button_vv1 {
     font-size: 16px;
     background-color: #F1F5F9;
     height: 49px;
     width: 50%;
     padding-top: 10px;
     border: 1px solid #005891;
     border-radius: 8px;
     color: #0E0E2C;
}

.elevation_button_vv1:hover {
     background-color: #005891;
     color: #F1F5F9;

}

.elevation_button_lef_2:hover {
     background-color: #005891;
     color: #F1F5F9;
}

.elevation_button_h_vv1 {
     font-size: 16px;
     background-color: #F1F5F9;
     height: 49px;
     width: 50%;
     padding-top: 3px;
     border: 1px solid #005891;
     border-radius: 8px;
     color: #0E0E2C;
}

.name_label {
     padding-right: 71%;
}

.cont_space {
     margin-left: 28%;
     margin-right: 28%;
}

.wrapper__ {
     width: auto;
     background-color: #ffff;
     padding-top: 40px;
     padding-bottom: 30px;
     padding-left: 40px;
     padding-right: 40px;
     border-radius: 10px;
}


/*  */
.lis {
     color: #fff !important;
}

.center {
     margin: auto;
     width: 30%;

     padding: 10px;
}

#first-step {
     list-style: none inside;
     margin: 0;
     padding: 0;
     text-align: center;

}

#first-step ul {

     position: absolute;
     padding: 0;

     display: none;

}

.input_new_style {
     background: #E0E0E0 !important;
     border-radius: 0px !important;
     height: 48px !important;
}

.hr_tag {
     width: 140px;
     margin: auto;
     height: 5px;
     border: 2px solid #FCE5C5;
     background-color: #FCE5C5;
}


.hr_tag_left {
     width: 140px;
     height: 5px;
     border: 2px solid #FCE5C5;
     background-color: #FCE5C5;
}

.activing_style {
     text-decoration: none;
}

/* #first-step ul {
               position:absolute;
               padding:0;
               left:0;
               display:none; /* hides sublists */

#first-step li {
     display: block;
     line-height: 3;


     /* / background: #24af15; menu background color */
}

#first-step li:hover ul {
     display: block;
     position: absolute;
     margin-left: 25.3%;
     /* left: 17px; */
     margin-top: -50px;
     /* background-color: #F5F5F5; */
     color: rgba(190, 208, 0, 0.8) !important;

     width: 27%;

}

#first-step li:hover {
     /* background: rgba(246, 251, 239, 1); */
     /* border-left: 7px solid #A3D15C; */
     color: rgba(190, 208, 0, 0.8) !important;
     text-decoration: underline;

     /* color: #0E0E2C !important; */

}

/* #first-step li a:hover { */
/* color:#0E0E2C !important; */
/* } */

.icons_styling {
     float: left;
     margin-left: -38px;
}

/* confessions */
.top__elevation {

     margin-top: 26px;

}

.crs_color {
     color: #15345b;
}

.tags {
     background-color: rgba(239, 249, 251, 1);
}

.text_color_black {
     color: #2B2D2C;
     ;
}

/* online_church */


.pg_image {
     background-image: url('../images/online_wrap.jpg');
     height: 500px;
     background-position: center;
     background-repeat: no-repeat;
     background-size: cover;
}

.social_icon {

     position: relative;
     display: inline-block;
     color: #ffffff;
     text-align: center;
     margin-left: 7px;
}

.wrapper__consell {

     width: 400px;
     background-color: rgba(247, 252, 253, 1);
     padding-top: 40px;
     padding-bottom: 32px;
     padding-left: 64px;
     padding-right: 17px;
     border-radius: 10px;

}


/* about us */

.eclipse_left {
     float: left;
     position: relative;
     margin-top: -72%;
     margin-left: -22px;
}

.eclipse_lef__v1 {
     float: right;
     position: relative;
     margin-top: -13%;
     margin-right: 45%;

}

.list-unstyled {
     padding-left: 0;
     list-style: none;
}

.algin_i {
     margin: -33px 0 0;
}

/* about us button */
.online_3_algn {
     margin: 0px 37% 8px 27px;
}

.eclipse_lef_middle {
     float: left;
     position: relative;
     margin-top: -78%;
     margin-left: 85px;
}

/*leadership  */
.pastor {
     height: 600px;
}

.our_leadership {
     position: absolute;
     color: #fff;
     left: 39%;
     top: 37%;
}

.placeholder_border {
     background-color: black;
     width: 75%;
     border-radius: 55%;
}

.leader_twit {
     width: 41px;
     display: inline-block;
}

.acc_padding {
     margin: auto;
     width: 82%;
     padding: 10px;
}

.spe_width {
     margin: 4px 104px 15px 104px;
}

.space_acc {
     margin-bottom: 13px !important;
}

.center_div {
     margin: 0 auto;
     width: 48%;
}

.wrp_mob {
     float: right;
     background-color: rgba(15, 48, 87, 0.98);
     margin: auto;
     width: 400px;
     height: 100vh;
}


.close_moblie_menu__others {
     display: none;
}

.close_moblie_menu___ {
     display: none;
}

.menu_center_di {
     margin: auto;
     width: 64%;
     padding: 10px;
}

.spacing_alignment {
     margin-top: 52px;
     margin-bottom: 30px;

}

.bg_holde {
     background-image: url('../images/carrer_banner.png');
     background-position: center;
     background-repeat: no-repeat;
     background-size: cover;
     height: 438px;
     background-color: rgba(0, 88, 145, 1);
}

.head_texting {
     margin: 16% 1% 1% 5%;
}

.text_placement_st_6 {
     margin: 30px;
}

.floating__right {
     float: right;
}

.floating__left {
     float: left;
}

.im_new_pagejewel {
     margin: 34px 27px 26px 82px;
}

.bg__ {
     background-image: url('../images/join_us_img.jpeg');
     background-position: center;
     background-repeat: no-repeat;
     background-size: cover;
     height: 438px;
     /* background-color:rgba(0, 88, 145, 1); */


}

.join_us {
     margin: 64px 62px 56px 81px;
}

.layer {
     background: rgba(197, 226, 255, 0.66);
     opacity: 6.1;
     height: 440px;
     margin: -65px -12px -1px -13px;
}

.text___ {
     position: relative;
     top: 59px;
     margin: 40px 138px;
}

.ForN___ {
     position: relative;
     top: 50px;
     margin: 17px 146px 51px 139px;
}


.men___ {
     background-image: url('../images/menour_page.jpeg');
     background-position: center;
     background-repeat: no-repeat;
     background-size: cover;
     height: 438px;
}













/* test moni carrer */
.testim {
     width: 100%;
     /* position: absolute; */
     position: relative;
     /* margin-top: 50%; */
     /* -webkit-transform: translatey(-50%);
     -moz-transform: translatey(-50%);
     -ms-transform: translatey(-50%);
     -o-transform: translatey(-50%);
     transform: translatey(-50%); */
}

.testim .wrap {
     position: relative;
     width: 100%;
     max-width: 1020px;
     padding: 40px 20px;
     margin: auto;
}

.testim .arrow {
     display: block;
     position: absolute;
     color: #333;
     cursor: pointer;
     font-size: 2em;
     top: 50%;
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     -moz-transform: translateY(-50%);
     -o-transform: translateY(-50%);
     transform: translateY(-50%);
     -webkit-transition: all .3s ease-in-out;
     -ms-transition: all .3s ease-in-out;
     -moz-transition: all .3s ease-in-out;
     -o-transition: all .3s ease-in-out;
     transition: all .3s ease-in-out;
     padding: 5px;
     z-index: 22222222;
}

.testim .arrow:before {
     cursor: pointer;
}

.testim .arrow:hover {
     /* color: green */
     color: #005891;
}


.testim .arrow.left {
     left: 70px;
}

.testim .arrow.right {
     right: 70px;
}

.testim .dots {
     text-align: center;
     position: absolute;
     width: 100%;
     bottom: 60px;
     left: 0;
     display: block;
     z-index: 3333;
     height: 12px;
}

.testim .dots .dot {
     list-style-type: none;
     display: inline-block;
     width: 12px;
     height: 12px;
     border-radius: 50%;
     border: 1px solid rgba(15, 48, 87, 0.98);
     margin: 0 10px;
     cursor: pointer;
     -webkit-transition: all .5s ease-in-out;
     -ms-transition: all .5s ease-in-out;
     -moz-transition: all .5s ease-in-out;
     -o-transition: all .5s ease-in-out;
     transition: all .5s ease-in-out;
     position: relative;
}

.testim .dots .dot.active,
.testim .dots .dot:hover {
     background: rgba(15, 48, 87, 0.98);
     border-color: rgba(15, 48, 87, 0.98);
}

.testim .dots .dot.active {
     -webkit-animation: testim-scale .5s ease-in-out forwards;
     -moz-animation: testim-scale .5s ease-in-out forwards;
     -ms-animation: testim-scale .5s ease-in-out forwards;
     -o-animation: testim-scale .5s ease-in-out forwards;
     animation: testim-scale .5s ease-in-out forwards;
}

.testim .cont {
     position: relative;
     overflow: hidden;
}

.testim .cont>div {
     text-align: center;
     position: absolute;
     top: 0;
     left: 0;
     padding: 0 0 70px 0;
     opacity: 0;
}

.testim .cont>div.inactive {
     opacity: 1;
}


.testim .cont>div.active {
     position: relative;
     opacity: 1;
}


.testim .cont div .img img {
     display: block;
     width: 100px;
     height: 100px;
     margin: auto;
     border-radius: 50%;
}

.testim .cont div h2 {
     color: green;
     font-size: 1em;
     margin: 15px 0;
}

.testim .cont div p {
     font-size: 1.15em;
     color: #333;
     width: 70%;
     margin: auto;
}

.testim .cont div.active .img img {
     -webkit-animation: testim-show .5s ease-in-out forwards;
     -moz-animation: testim-show .5s ease-in-out forwards;
     -ms-animation: testim-show .5s ease-in-out forwards;
     -o-animation: testim-show .5s ease-in-out forwards;
     animation: testim-show .5s ease-in-out forwards;
}

.testim .cont div.active h2 {
     -webkit-animation: testim-content-in .4s ease-in-out forwards;
     -moz-animation: testim-content-in .4s ease-in-out forwards;
     -ms-animation: testim-content-in .4s ease-in-out forwards;
     -o-animation: testim-content-in .4s ease-in-out forwards;
     animation: testim-content-in .4s ease-in-out forwards;
}

.testim .cont div.active p {
     -webkit-animation: testim-content-in .5s ease-in-out forwards;
     -moz-animation: testim-content-in .5s ease-in-out forwards;
     -ms-animation: testim-content-in .5s ease-in-out forwards;
     -o-animation: testim-content-in .5s ease-in-out forwards;
     animation: testim-content-in .5s ease-in-out forwards;
}

.testim .cont div.inactive .img img {
     -webkit-animation: testim-hide .5s ease-in-out forwards;
     -moz-animation: testim-hide .5s ease-in-out forwards;
     -ms-animation: testim-hide .5s ease-in-out forwards;
     -o-animation: testim-hide .5s ease-in-out forwards;
     animation: testim-hide .5s ease-in-out forwards;
}

.testim .cont div.inactive h2 {
     -webkit-animation: testim-content-out .4s ease-in-out forwards;
     -moz-animation: testim-content-out .4s ease-in-out forwards;
     -ms-animation: testim-content-out .4s ease-in-out forwards;
     -o-animation: testim-content-out .4s ease-in-out forwards;
     animation: testim-content-out .4s ease-in-out forwards;
}

.testim .cont div.inactive p {
     -webkit-animation: testim-content-out .5s ease-in-out forwards;
     -moz-animation: testim-content-out .5s ease-in-out forwards;
     -ms-animation: testim-content-out .5s ease-in-out forwards;
     -o-animation: testim-content-out .5s ease-in-out forwards;
     animation: testim-content-out .5s ease-in-out forwards;
}

@-webkit-keyframes testim-scale {
     0% {
          -webkit-box-shadow: 0px 0px 0px 0px #eee;
          box-shadow: 0px 0px 0px 0px #eee;
     }

     35% {
          -webkit-box-shadow: 0px 0px 10px 5px #eee;
          box-shadow: 0px 0px 10px 5px #eee;
     }

     70% {
          -webkit-box-shadow: 0px 0px 10px 5px #ea830e;
          box-shadow: 0px 0px 10px 5px #ea830e;
     }

     100% {
          -webkit-box-shadow: 0px 0px 0px 0px #ea830e;
          box-shadow: 0px 0px 0px 0px #ea830e;
     }
}

@-moz-keyframes testim-scale {
     0% {
          -moz-box-shadow: 0px 0px 0px 0px #eee;
          box-shadow: 0px 0px 0px 0px #eee;
     }

     35% {
          -moz-box-shadow: 0px 0px 10px 5px #eee;
          box-shadow: 0px 0px 10px 5px #eee;
     }

     70% {
          -moz-box-shadow: 0px 0px 10px 5px #ea830e;
          box-shadow: 0px 0px 10px 5px #ea830e;
     }

     100% {
          -moz-box-shadow: 0px 0px 0px 0px #ea830e;
          box-shadow: 0px 0px 0px 0px #ea830e;
     }
}

@-ms-keyframes testim-scale {
     0% {
          -ms-box-shadow: 0px 0px 0px 0px #eee;
          box-shadow: 0px 0px 0px 0px #eee;
     }

     35% {
          -ms-box-shadow: 0px 0px 10px 5px #eee;
          box-shadow: 0px 0px 10px 5px #eee;
     }

     70% {
          -ms-box-shadow: 0px 0px 10px 5px #ea830e;
          box-shadow: 0px 0px 10px 5px #ea830e;
     }

     100% {
          -ms-box-shadow: 0px 0px 0px 0px #ea830e;
          box-shadow: 0px 0px 0px 0px #ea830e;
     }
}

@-o-keyframes testim-scale {
     0% {
          -o-box-shadow: 0px 0px 0px 0px #eee;
          box-shadow: 0px 0px 0px 0px #eee;
     }

     35% {
          -o-box-shadow: 0px 0px 10px 5px #eee;
          box-shadow: 0px 0px 10px 5px #eee;
     }

     70% {
          -o-box-shadow: 0px 0px 10px 5px #ea830e;
          box-shadow: 0px 0px 10px 5px #ea830e;
     }

     100% {
          -o-box-shadow: 0px 0px 0px 0px #ea830e;
          box-shadow: 0px 0px 0px 0px #ea830e;
     }
}

@keyframes testim-scale {
     0% {
          box-shadow: 0px 0px 0px 0px #eee;
     }

     35% {
          box-shadow: 0px 0px 10px 5px #eee;
     }

     70% {
          box-shadow: 0px 0px 10px 5px #ea830e;
     }

     100% {
          box-shadow: 0px 0px 0px 0px #ea830e;
     }
}

@-webkit-keyframes testim-content-in {
     from {
          opacity: 0;
          -webkit-transform: translateY(100%);
          transform: translateY(100%);
     }

     to {
          opacity: 1;
          -webkit-transform: translateY(0);
          transform: translateY(0);
     }
}

@-moz-keyframes testim-content-in {
     from {
          opacity: 0;
          -moz-transform: translateY(100%);
          transform: translateY(100%);
     }

     to {
          opacity: 1;
          -moz-transform: translateY(0);
          transform: translateY(0);
     }
}

@-ms-keyframes testim-content-in {
     from {
          opacity: 0;
          -ms-transform: translateY(100%);
          transform: translateY(100%);
     }

     to {
          opacity: 1;
          -ms-transform: translateY(0);
          transform: translateY(0);
     }
}

@-o-keyframes testim-content-in {
     from {
          opacity: 0;
          -o-transform: translateY(100%);
          transform: translateY(100%);
     }

     to {
          opacity: 1;
          -o-transform: translateY(0);
          transform: translateY(0);
     }
}

@keyframes testim-content-in {
     from {
          opacity: 0;
          transform: translateY(100%);
     }

     to {
          opacity: 1;
          transform: translateY(0);
     }
}

@-webkit-keyframes testim-content-out {
     from {
          opacity: 1;
          -webkit-transform: translateY(0);
          transform: translateY(0);
     }

     to {
          opacity: 0;
          -webkit-transform: translateY(-100%);
          transform: translateY(-100%);
     }
}

@-moz-keyframes testim-content-out {
     from {
          opacity: 1;
          -moz-transform: translateY(0);
          transform: translateY(0);
     }

     to {
          opacity: 0;
          -moz-transform: translateY(-100%);
          transform: translateY(-100%);
     }
}

@-ms-keyframes testim-content-out {
     from {
          opacity: 1;
          -ms-transform: translateY(0);
          transform: translateY(0);
     }

     to {
          opacity: 0;
          -ms-transform: translateY(-100%);
          transform: translateY(-100%);
     }
}

@-o-keyframes testim-content-out {
     from {
          opacity: 1;
          -o-transform: translateY(0);
          transform: translateY(0);
     }

     to {
          opacity: 0;
          transform: translateY(-100%);
          transform: translateY(-100%);
     }
}

@keyframes testim-content-out {
     from {
          opacity: 1;
          transform: translateY(0);
     }

     to {
          opacity: 0;
          transform: translateY(-100%);
     }
}

@-webkit-keyframes testim-show {
     from {
          opacity: 0;
          -webkit-transform: scale(0);
          transform: scale(0);
     }

     to {
          opacity: 1;
          -webkit-transform: scale(1);
          transform: scale(1);
     }
}

@-moz-keyframes testim-show {
     from {
          opacity: 0;
          -moz-transform: scale(0);
          transform: scale(0);
     }

     to {
          opacity: 1;
          -moz-transform: scale(1);
          transform: scale(1);
     }
}

@-ms-keyframes testim-show {
     from {
          opacity: 0;
          -ms-transform: scale(0);
          transform: scale(0);
     }

     to {
          opacity: 1;
          -ms-transform: scale(1);
          transform: scale(1);
     }
}

@-o-keyframes testim-show {
     from {
          opacity: 0;
          -o-transform: scale(0);
          transform: scale(0);
     }

     to {
          opacity: 1;
          -o-transform: scale(1);
          transform: scale(1);
     }
}

@keyframes testim-show {
     from {
          opacity: 0;
          transform: scale(0);
     }

     to {
          opacity: 1;
          transform: scale(1);
     }
}

@-webkit-keyframes testim-hide {
     from {
          opacity: 1;
          -webkit-transform: scale(1);
          transform: scale(1);
     }

     to {
          opacity: 0;
          -webkit-transform: scale(0);
          transform: scale(0);
     }
}

@-moz-keyframes testim-hide {
     from {
          opacity: 1;
          -moz-transform: scale(1);
          transform: scale(1);
     }

     to {
          opacity: 0;
          -moz-transform: scale(0);
          transform: scale(0);
     }
}

@-ms-keyframes testim-hide {
     from {
          opacity: 1;
          -ms-transform: scale(1);
          transform: scale(1);
     }

     to {
          opacity: 0;
          -ms-transform: scale(0);
          transform: scale(0);
     }
}

@-o-keyframes testim-hide {
     from {
          opacity: 1;
          -o-transform: scale(1);
          transform: scale(1);
     }

     to {
          opacity: 0;
          -o-transform: scale(0);
          transform: scale(0);
     }
}

@keyframes testim-hide {
     from {
          opacity: 1;
          transform: scale(1);
     }

     to {
          opacity: 0;
          transform: scale(0);
     }
}

@-webkit-keyframes zoom {
     from {
          -webkit-transform: scale(1, 1);
     }

     to {
          -webkit-transform: scale(1.5, 1.5);
     }
}

@keyframes zoom {
     from {
          transform: scale(1, 1);
     }

     to {
          transform: scale(1.5, 1.5);
     }
}

@media all and (max-width: 300px) {
     body {
          font-size: 14px;
     }
}

@media all and (max-width: 500px) {
     .testim .arrow {
          font-size: 1.5em;
     }

     .testim .cont div p {
          line-height: 25px;
     }

}

/* change transition duration to control the speed of fade effect */
.carousel-item {
     transition: transform 2.6s ease-in-out;
}

.carousel-fade .active.carousel-item-start,
.carousel-fade .active.carousel-item-end {
     transition: opacity 0s 2.6s;
}

html,
body {
     margin: 0;
     padding: 0;
}

* {
     box-sizing: border-box;
}

.slider {
     width: 50%;
     margin: 100px auto;
}

.slick-slide {
     margin: 0px 20px;
}

.slick-slide img {
     width: 100%;
}

.slick-prev:before,
.slick-next:before {
     color: black;
}


.slick-slide {
     transition: all ease-in-out .3s;
     opacity: .2;
}

.slick-active {
     opacity: .5;
}

.slick-current {
     opacity: 1;
}

.wrapper__batizim {
     width: 499px;
     /* background-color: rgba(247, 252, 253, 1); */
     padding-top: 40px;
     padding-bottom: 32px;
     padding-left: 64px;
     padding-right: 17px;
     border-radius: 10px;
}

.hero_holder {
     background-color: #fff;
     opacity: 0.6;
     height: 360px;
}

.faqs>li {
     border-top: solid 2px #33345f21;
     padding-top: 25px;
     padding-bottom: 25px;
     cursor: pointer;
     -webkit-user-select: none;
     /* Chrome all / Safari all */
     -moz-user-select: none;
     /* Firefox all */
     -ms-user-select: none;
     /* IE 10+ */
     user-select: none;
}

.faqs .question {
     font-weight: 400;
     font-size: 16px;
     margin: 0 !important;
     position: relative;
     line-height: 1.2;
     padding-right: 20px;
}

.faqs .question::after {
     content: '+';
     position: absolute;
     right: 0;
     top: 0px;
}

.faqs .answer {
     margin-top: 10px;
     margin-bottom: 0;
     font-weight: 500;
     padding: 0;
     display: block;
     width: 100%;
     overflow: hidden;
     display: none;
     /* color: #656484; */
     text-shadow: 0 1px 0 #fff;
     /*height: auto;*/
}

.faqs .faqs__item.opened .answer {
     display: block;
}

.faqs .faqs__item.opened .question::after {
     content: '-';
}

.about {
     margin-top: 20px;
}

.list_order {
     list-style-type: "\003E";
     font-size: 19px;
     padding-bottom: 10px;
     padding-left: 10px;
}

.order_ul {
     padding-left: 20px;
}

/*  */

/* Social Icons */
/* #social_side_links {
     position: fixed;
     top: 300px;
     left: 0;
     padding: 0;
     list-style: none;
     z-index: 99;
}

#social_side_links li a {
     display: block;
}

#social_side_links li a img {
     display: block;
     max-width: 40px;
     padding: 10px;
     -webkit-transition: background .2s ease-in-out;
     -moz-transition: background .2s ease-in-out;
     -o-transition: background .2s ease-in-out;
     transition: background .2s ease-in-out;
}

#social_side_links li a:hover img {
     background: rgba(0, 0, 0, .2);

     &:hover {
          padding-left: 20px;
          width: 65px;
     }
} */

.left_doings {
     margin-left: 29%;
}

.iframe_container {
     position: relative;
     width: 100%;
     padding-bottom: 56.25%;
     height: 0;
}

.youtube_holder {
     position: relative;
     top: 146px;
     padding-left: 25px;
}

.prayer_card {

     width: 90%;

     margin-top: 100px;
}

.youtube_mobile {
     width: 560px;
     height: 315px;
}

.mp4_ress {
     height: 100%;
}

.nav_holder {
     vertical-align: middle;
     height: 42px;
}

.acc__button_card,
.heffP {
     font-weight: 600;
     padding: 15px 30px;
     font-size: 14px;
     /* padding: 8px 16px; */
     color: #fff;
     background: #E6103D;
     text-decoration: none;
     cursor: pointer;
     border-radius: 30px;
}

.navbar-cart-product .navbar-cart-product-close {
     float: right;
     margin-right: 0.5rem;
     opacity: 0.5;
     color: #343a40;
     font-size: 0.7875rem;
}

.column {
     display: inline-block;
     text-align: center;
}

figure {
     overflow: hidden;
}

a p {
     color: black;
     margin-top: 8px;
     font-family: 'Open Sans', sans-serif;
}

a:hover {
     text-decoration: none;
}

.column img {
     display: block;
     width: 100%;
     height: 300px;
}

/* CSS Image Hover. Created refering to Naoya's Pen: https://codepen.io/nxworld/pen/ZYNOBZ */
/*Sepia*/
.column#sepia img {
     -webkit-filter: sepia(100%);
     filter: sepia(100%);
     -webkit-transition: .3s ease-in-out;
     transition: .3s ease-in-out;
}

.column#sepia:hover img {
     -webkit-filter: sepia(0);
     filter: sepia(0);
}

/*GrayScale*/
.column#grayscale img {
     -webkit-filter: grayscale(100%);
     filter: grayscale(100%);
     -webkit-transition: .3s ease-in-out;
     transition: .3s ease-in-out;
}

.column#grayscale:hover img {
     -webkit-filter: grayscale(0);
     filter: grayscale(0);
}

/*Zoom In*/
.column#zoomIn img {
     -webkit-transform: scale(1);
     transform: scale(1);
     -webkit-transition: .3s ease-in-out;
     transition: .3s ease-in-out;
}

.column#zoomIn:hover img {
     -webkit-transform: scale(1.3);
     transform: scale(1.3);
}

/*Zoom Out*/
.column#zoomOut img {
     -webkit-transform: scale(1.5);
     transform: scale(1.5);
     -webkit-transition: .3s ease-in-out;
     transition: .3s ease-in-out;
}

.column#zoomOut:hover img {
     -webkit-transform: scale(1);
     transform: scale(1);
}

/* 3D Transform. Craeted refering to Dudley Storey's Pen: https://codepen.io/dudleystorey/pen/KFLJp */
.tdimension {
     width: 300px;
     height: 300px;
     margin: 20px auto 40px auto;
     perspective: 1000px;
}

.tdimension a {
     display: block;
     width: 100%;
     height: 100%;
     background: url("https://mir-s3-cdn-cf.behance.net/project_modules/disp/e8346826957515.56361c2106f3f.png");
     background-size: cover;
     transform-style: preserve-3d;
     transform: rotateX(70deg);
     transition: all 0.8s;
}

.tdimension:hover a {
     transform: rotateX(20deg);
}

.tdimension a:after {
     content: '';
     position: absolute;
     left: 0;
     bottom: 0;
     width: 100%;
     height: 40px;
     background: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.1));
     transform: rotateX(90deg);
     transform-origin: bottom;
}

/*With Simple Caption*/
.column#caption {
     position: relative;
}

.column#caption .text {
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     z-index: 10;
     opacity: 0;
     transition: all 0.8s ease;
}

.column#caption .text h1 {
     margin: 0;
     color: white;
}

.column#caption:hover .text {
     opacity: 1;

}

.column#caption:hover img {
     -webkit-filter: sepia(90%);
}

/* Craeted refering to LittleSnippets.net Pen: https://codepen.io/littlesnippets/pen/adLELd */
.frame {
     text-align: center;
     position: relative;
     cursor: pointer;
     perspective: 500px;
}

.frame img {
     /* width: 300px;
     height: 300px; */
     border-radius: 10%;
     height: 355px;
     width: 326px;
}

/* .frame .details {
     width: 70%;
     height: 80%;
     padding: 5% 8%;
     position: absolute;
     content: "";
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%) rotateY(90deg);
     transform-origin: 50%;
     background: rgba(255, 255, 255, 0.9);
     opacity: 0;
     transition: all 0.4s ease-in;

} */

.frame_shop {
     text-align: center;
     position: relative;
     cursor: pointer;
     perspective: 500px;
}

.frame_shop img {
     /* width: 300px;
     height: 300px; */
     border-radius: 10%;
     /* height: 355px;
     width: 326px; */
}

.frame .details {
     width: 77%;
     height: 26%;
     padding: 1% 8%;
     position: absolute;
     content: "";
     top: 87%;
     left: 50%;
     transform: translate(-50%, -50%) rotateY(90deg);
     transform-origin: 50%;
     background: #00000078;
     /* background: rgba(255, 255, 255, 0.9); */
     opacity: 3;
     transition: all 0.4s ease-in;
     border-radius: 0px 0px 40px 40px;
}

.frame_shop .details_shopping {
     width: 77%;
     height: 26%;
     padding: 1% 8%;
     position: absolute;
     content: "";
     top: 48%;
     left: 50%;
     transform: translate(-50%, -50%) rotateY(90deg);
     transform-origin: 50%;
     /* background: #00000078; */
     /* background: rgba(255, 255, 255, 0.9); */
     opacity: 3;
     transition: all 0.4s ease-in;
     border-radius: 0px 0px 40px 40px;
}


.frame_shop:hover .details_shopping {
     transform: translate(-50%, -50%) rotateY(0deg);
     opacity: 1;
}

.frame:hover .details {
     transform: translate(-50%, -50%) rotateY(0deg);
     opacity: 1;
}

.center_loader {
     margin: auto;
     width: 50%;
     /* border: 3px solid green; */
     padding: 10px;
}

.item .item-image {
     /* width: 50px;
     height: 50px; */
     width: 286px;
     height: 175px;
     animation: loader 3s infinite ease-in-out;
     -webkit-animation: loader 3s infinite ease-in-out;
}

.item .content .title {
     height: 12px;
     margin: 10px;
     width: 200px;
     animation: loader 3s infinite ease-in-out;
     -webkit-animation: loader 3s infinite ease-in-out;
}

.item .content .short-title {
     height: 20px;
     margin: 10px;
     width: 272px;
     /* width: 450px; */
     /* width: 350px; */
     animation: loader 3s infinite ease-in-out;
     -webkit-animation: loader 3s infinite ease-in-out;
}

.item_large .content .short-title {
     height: 20px;
     margin: 10px;
     width: 800px;
     /* width: 350px; */
     animation: loader 3s infinite ease-in-out;
     -webkit-animation: loader 3s infinite ease-in-out;
}

@keyframes loader {
     0% {
          background-color: rgba(165, 165, 165, 0.1);
     }

     50% {
          background-color: rgba(165, 165, 165, 0.3);
     }

     100% {
          background-color: rgba(165, 165, 165, 0.1);
     }
}

@-webkit-keyframes loader {
     0% {
          background-color: rgba(165, 165, 165, 0.1);
     }

     50% {
          background-color: rgba(165, 165, 165, 0.3);
     }

     100% {
          background-color: rgba(165, 165, 165, 0.1);
     }
}

.dropbtn {
     background-color: #fff;
     color: #2B2D2C;
     padding: 16px;
     font-size: 16px;
     font-weight: 500;

     border: none;
}

.dropdown {
     position: relative;
     display: inline-block;
}

.dropdown-content {
     display: none;
     position: absolute;
     background-color: #f1f1f1;
     /* min-width: 160px; */
     min-width: 199px;
     box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
     z-index: 1;
}

.dropdown-content a {
     color: black;
     padding: 12px 16px;
     text-decoration: none;
     display: block;
}

.dropdown-content a:hover {
     background-color: #ddd;
}

.dropdown:hover .dropdown-content {
     display: block;
}

.dropdown:hover .dropbtn {
     /* background-color: #3e8e41; */
}

.join_div {
     /* margin-top: -6px; */
     /* margin-bottom: -15%; */
     overflow: hidden;
     background-color: #1c1c1c;
}

.panels {
     overflow: scroll;
     height: 100vh;
     width: 100%;
     scroll-snap-type: y mandatory;
}

.panel {
     box-shadow: 40px red;
     scroll-snap-align: start;
     width: 100%;
     height: 100vh;
     background: rgba(0, 0, 0, 0.25);
     display: flex;
     justify-content: center;
     background: #1d1e22;


}

.clip {
     position: sticky;
     height: 0;

     width: 100%;
     top: 0;
     margin-bottom: 0;
}

.__h2 {
     position: absolute;
     top: 0;
     margin: 0;
     padding: calc(100vh - 64px) 50px 0;
     z-index: 3;
     left: 0;
}

.tint {

     display: block;
     position: absolute;
     top: 0;
     left: 0;
     background: rgba(0, 0, 0, 0.1);
     width: 100vw;
     height: 100vh;
     z-index: 2;
     pointer-events: none;
}

.__img {

     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100vh;
     object-fit: cover;
     object-position: center center;
     z-index: 1;
}

.video_clip {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100vh;
     z-index: 1;
     pointer-events: none;
     overflow: hidden;
}

/* iframe {
     z-index: 1;
     border: 0;
     width: 100vw;
     height: 56.25vw;
     min-height: 100%;
     min-width: 177.77vh;
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
} */

a {
     color: white;
     text-decoration: none;
     cursor: pointer;
     transition: all ease .25s;
}

.controls {
     position: fixed;
     bottom: 40px;
     right: 40px;
     z-index: 2;
     font-size: 30px;
     font-family: courier, mono;

     display: flex;
     flex-wrap: wrap;

     a.disabled {
          opacity: 0.5;
          pointer-events: none;
     }


     a {
          display: block;
          width: 36px;
          height: 36px;
          line-height: 36px;
          border-radius: 36px;
          text-align: center;
          background: rgba(0, 0, 0, 0.0);

          &:first-child {
               margin-right: -8px;
          }
     }
}

span.note {
     position: fixed;
     bottom: 40px;
     right: calc(20px + 120px);
     z-index: 2;
}

.feature {
     position: relative;
     width: 100vw;
     margin-left: calc((50vw - 50%)*-1);
     overflow: hidden;
     color: #fff;
     background-color: #1c1c1c;
     background-size: cover;
     background-repeat: no-repeat;

}

.feature_ba {
     position: relative;
     width: 100vw;
     margin-left: calc((50vw - 50%)*-1);
     overflow: hidden;
     color: #fff;
     background-size: cover;
     background-repeat: no-repeat;
     margin-bottom: -6px;
}

.Im__ {
     width: 828px;
}

.video_class {
     width: 1800px !important;

}