@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap');
@font-face {
font-family: 'american-typewriter';
src: url('../american/american-typewriter.eot') format('embedded-opentype'); /* IE9 + later */
src: url('../american/american-typewriter.eot?#iefix') format('embedded-opentype'), /* IE6 to IE8 */
url('../american/american-typewriter.woff') format('woff'), /* Newer browsers */
url('../american/american-typewriter.ttf') format('truetype'), /* Safari og iOS, Chrome, Android, Firefox and Opera except Opera Mini */
url('../american/american-typewriter.svg#american-typewriter') format('svg'); /*IE og iOS earlier than version 5*/
}
:root {
--black-color: #000;
--red-color: #E02020;
--white-color: #FFF;
--lightblue-color: #00A8E7;
}
html
{
font-size:16px;
}
body
{
font-size: 1rem;
}
html , body
{
overflow-x:hidden;
-webkit-overflow-scrolling: touch;
font-family: 'Roboto', sans-serif;
color:var(--black-color);
font-family: 'Roboto', sans-serif;
}
a {
color:var(--black-color);
text-decoration:none;
transition:0.8s;
-webkit-transition:0.8s;
-moz-transition:0.8s;
-o-transition:0.8s;
}
a:hover
{
color:var(--red-color);
}
.transition
{
transition:all 0.5s ease-in-out;
}
.displaynone
{
display:none !important
}
.d-inline-block
{
display:inline-block
}
.vError
{
border:red 1px solid !important
}
.form-error
{
color: red;
font-size: 10px !important;
}
.h100{
height:100%
}
.FormResult , .FormResult1 , .FormResult2 , .FormResult *, .FormResult1 *
{
color:green;
display:block;
min-height:25px;
}
.bg_red
{
background:var(--red-color)
}
.FormResult-newsletter
{
color:green;
}
.dnone
{
display:none
}
.d-block{
display:block
}
.d-flex
{
display:flex;
flex-wrap: wrap;
}
.italic
{
font-style:italic
}
.white
{
color:#FFF
}
.font-american , .font-american *
{
font-family: 'Roboto', sans-serif;
}
.font-light , .font-light *
{
font-weight:300;
}
.font-medium , .font-medium *
{
font-weight:500;
}
.font-semi , .font-semi *
{
font-weight:600;
}
.font-bold , .font-bold *
{
font-weight:700;
}
.font-10, .font-10 *
{
font-size:0.625rem
}
.font-12, .font-12 *
{
font-size:0.75rem
}
.font-13, .font-13 *
{
font-size:0.8125rem
}
.font-14, .font-14 *
{
font-size:0.875rem
}
.font-15, .font-15 *
{
font-size:0.9375rem
}
.font-16, .font-16 *
{
font-size:1rem
}
.font-17, .font-17 *
{
font-size:1.0625rem
}
.font-18 , .font-18 *
{
font-size:1.125rem
}
.font-20, .font-20 *
{
font-size:1.25rem
}
.font-22, .font-22 *
{
font-size:1.375rem;
}
.font-24, .font-24 *
{
font-size:1.5rem
}
.font-25, .font-25 *
{
font-size:1.5625rem
}
.font-26, .font-26 *
{
font-size:1.625rem
}
.font-28, .font-28 *
{
font-size:1.75rem
}
.font-30, .font-30 *
{
font-size:1.875rem
}
.font-32, .font-32 *
{
font-size:2rem;
}
.font-35, .font-35 *
{
font-size:2.1875rem;
}
.font-36, .font-36 *
{
font-size:2.25rem
}
.font-40, .font-40 *
{
font-size:2.5rem
}
.font-42, .font-42 *
{
font-size:2.625rem
}
.font-45, .font-45 *
{
font-size:2.8125rem
}
.font-50, .font-50 *
{
font-size:3.125rem;
}
.font-52, .font-52 *
{
font-size:3.25rem
}
.font-55, .font-55 *
{
font-size:3.437rem
}
.font-60, .font-60 *
{
font-size:3.75rem;
}
.font-62, .font-62 *
{
font-size:3.875rem
}
.font-70, .font-70 *
{
font-size:4.375rem;
}
.font-80, .font-80 *
{
font-size:5rem
}
.font-90, .font-90 *
{
font-size:4.375rem;
}
.font-120, .font-120 *
{
font-size:7.5rem
}
.text-center
{
text-align:center
}
.line-height13
{
line-height:1.3rem
}
.line-height14
{
line-height:1.4rem
}
.line-height15
{
line-height:1.5rem
}
.line-height2
{
line-height:2rem
}
.line-height3
{
line-height:3rem
}
.line-height4
{
line-height:4rem
}
.inline-block
{
display:inline-block
}
.flex-row {
display: flex !important;
justify-content: center;
flex-direction: row;
align-content: center;
align-items: center;
}
.flex-column {
display: flex !important;
justify-content: center;
flex-direction: column;
align-content: center;
align-items: center;
}
.jc-fs
{
justify-content: flex-start !important;
}
.jc-sb
{
justify-content: space-between !important
}
.jc-se
{
justify-content: space-evenly
}
.trigger{
width: 36px;
height: 25px;
z-index: 999999999;
cursor:pointer;
}
.trigger > div{
position: relative;
}
.trigger > div > span{
position: absolute;
height: 4px;
width:100%;
margin:0;
background: #FFF;
top:0;
border-radius:5px;
transition:.7s;
-moz-transition:.7s;
-webkit-transition:.7s;
left:0
}
.trigger > div > span:nth-child(1){
width:18px;
left:0
}
.trigger > div > span:nth-child(2){
top: 9px;
}
.trigger > div > span:nth-child(3){
top:18px;
width:18px;
right:0;
left: auto;
}
.trigger > div.close > span:nth-child(1){
-ms-transform: rotate(45deg); /* IE 9 */
-webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
transform: rotate(45deg);
top: 11px;
background:#FFF
}
.trigger > div.close > span:nth-child(2){
display: none;
}
.trigger > div.close > span:nth-child(3){
-ms-transform: rotate(-45deg); /* IE 9 */
-webkit-transform: rotate(-45deg); /* Chrome, Safari, Opera */
transform: rotate(-45deg);
top: 11px;background:#FFF
}
.trigger, .sitewrapper{
transition:.7s;
-moz-transition:.7s;
-webkit-transition:.7s;
}
.slideddddd{
-ms-transform: translate(-380px,0); /* IE 9 */
-webkit-transform: translate(-380px,0); /* Safari */
transform: translate(-380px,0); /* Standard syntax */
}
.white , .white *
{
color:#FFF
}
.blur {
background: transparent !important;
}
.z-100
{
z-index:100
}
.relative
{
position:relative;
}
b
{
font-weight:700
}
.txt-justify
{
text-align:justify
}
.py-75
{
padding-top:4.6875rem;
padding-bottom:4.6875rem
}
.py-100
{
padding-top:6.25rem;
padding-bottom:6.25rem
}
.pb-100
{
padding-bottom:6.25rem
}
.pt-100
{
padding-top:6.25rem;
}
.px-100
{
padding-right: 6.25rem;
padding-left: 6.25rem
}
.ai-fs
{
align-items:flex-start
}
.line-20 , .line-20 *
{
line-height:1.25rem;
}
.line-22 , .line-22 *
{
line-height:1.375rem
}
.line-25 , .line-25 *
{
line-height:1.5625rem
}
.line-30 , .line-30 *
{
line-height:1.875rem;
}
.line-35 , .line-35 *
{
line-height:2.1875rem;
}
.line-40 , .line-40 *
{
line-height:2.5rem;
}
.line-45 , .line-45 *
{
line-height:2.8125rem;
}
.line-50 , .line-50 *
{
line-height:3.125rem
}
.line-60 , .line-60 *
{
line-height:3.75rem
}
.line-70 , .line-70 *
{
line-height:4.375rem
}
.line-76 , .line-76 *
{
line-height:4.75rem
}
.line-80 , .line-80 *
{
line-height:5rem
}
.ai-initial
{
align-items:initial
}
.jc-c
{
justify-content: center;
}.jc-fe
{
justify-content: flex-end;
}
.ai-fe
{
align-items:flex-end
}
.d-inline-block{
display:inline-block
}
.open_left , .open_right , .area_layer_back
{
opacity:0
}
.open_right.aos-animate
{
animation: 1s ease-in-out 0.75s window-fromleft both;
/* -webkit-animation: 1.25s ease-in-out 0.75s window-fromright both; */
opacity: 1;
}
.open_left.aos-animate
{
animation: 1s ease-in-out 0.75s window-fromright both;
/* -webkit-animation: 1.25s ease-in-out 0.75s window-fromright both; */
opacity: 1;
}
.area_layer_back.aos-animate
{
opacity: 1;
animation: 1s ease-in-out 0.5s circle-fromcenter-over both;
-webkit-animation: 1s ease-in-out 0.5s circle-fromcenter-over both;
}
.bg_white
{
background:#FFF
}
.cur
{
cursor:pointer
}
.filter_white
{
filter: brightness(0) invert(1);
}
.container
{
width:1250px
}
.ai-c
{
align-items:center
}
.z-50
{
z-index:50
}
.bt-1
{
border-top:1px solid #343434;
}
.bg1
{
background:url('../img/contact-page-shape-1.jpg') no-repeat top right / cover
}
.bg2
{
background:#F6F6F6
}
.bg3
{
background:var(--red-color)
}
.color1
{
color:#6D7278
}
.color2
{
color:#8A8A8A
}
/*//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
footer
{
background:var(--black-color);
}
.footer_social a {
width: 40px;
height: 40px;
margin-right: 10px;
border-radius: 50%;
background:#454644;
}
.footer_social a span {
color:#FFF
}
.footer_social a:hover {
background:var(--red-color);
}
.footer_menu li {
display: block;
}
footer .logo img
{
max-width:160px;
}
header .img-bg
{
position:absolute;
top:0;
left:0;
z-index:40;
width:100%;
height:100%;
-webkit-animation: kenburns-bottom 3s ease-out both;
animation: kenburns-bottom 3s ease-out both;
}
header .logo img
{
max-width:140px;
}
header .shadow:before {
background: linear-gradient(90deg, #FFFFFF 0%, rgba(255,255,255,0) 100%);
position: absolute;
top: 0;
left: 0;
z-index: 45;
width: 100%;
height: 100%;
content: '';
}
.over_header {
overflow: hidden;
}
.hamburger__line-in::after, .hamburger__line-in::before
{
background:var(--red-color);
}
.h_donate a
{
background:var(--red-color);
border-radius: 26.5px;
height:50px;
}
.h_donate a span
{
height: 37px;
width: 37px;
background:var(--white-color);
border-radius:50%;
}
.h_donate a:hover
{
background:var(--lightblue-color);
color:var(--white-color);
}
.h_act a
{
background:var(--lightblue-color);
border-radius: 26.5px;
height:50px;
}
.h_act a span
{
height: 37px;
width: 37px;
background:var(--white-color);
border-radius:50%;
}
.h_act a:hover
{
background:var(--red-color);
color:var(--white-color);
}
header h1
{
color:var(--black-color);
}
.menu_header
{
background-color: rgba(0,72,34,0.47);
position:fixed;
top:-100%;
width:100%;
height:100vh;
z-index:70;
right: 0;
opacity: 0;
visibility: hidden;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
transition: all 0.3s ease;
transition-duration: 500ms;
-webkit-transition-duration: 500ms;
transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
-webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
}
.menu_header.active {
opacity: 0.95;
visibility: visible;
top: 0;
}
.menu_header .img-bg
{
position:absolute;
top:0;
left:0;
z-index:40;
width:100%;
height:100%;
}
.z-70
{
position:relative;
z-index:70;
}
.menu_link li
{
display:block;
position:relative
}
.menu_link li a
{
color:var(--white-color);
-webkit-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;
}
.menu_link li a:hover
{
color:var(--red-color);
padding-left:25px;
}
.header_social
{
position:absolute;
right:0;
top:50%;
transform:translateY(-50%);
z-index:60;
display:flex;
flex-direction:column
}
.header_social a {
width: 40px;
height: 40px;
margin: 7.5px 0;
border-radius: 50%;
background:var(--black-color);
}
.header_social a span {
color:#FFF
}
.header_social a:hover {
background:var(--red-color);
}
.opac
{
position:absolute;
right:0;
width:974px;
height:100%;
background:url(../img/11.png) no-repeat top right / contain;
z-index:40;
}
.c_map iframe
{
width:100%;
height:475px;
}
.c_info_box
{
position:absolute;
top:50%;
left:0;
width:65%;
z-index:50;
transform:translateY(-50%)
}
.c_social li
{
margin:0 5px;
}
.contact-form label
{
color:var(--white-color);
font-size:1rem;
line-height:2.5rem
}
.contact-form input , .contact-form textarea
{
border: 1px solid var(--white-color);
border-radius: 25px;
}
.contact-form textarea
{
height:100px;
}
.contact-form button[type=submit]
{
width:270px;
height:50px;
border-radius: 25px;
background-color: var(--red-color)
}
.contact-form button[type=submit]:hover
{
background-color: var(--black-color)
}
.contact-form .form-error {
color: var(--white-color);
padding-left: 10px;
padding-top: 5px;
font-style: italic;
}
.contact-form .FormResult
{
min-height: 50px;
color:var(--white-color);
}
.contact-form .FormResult .green
{
color:var(--white-color);
}
.about_menu
{
border-bottom:1px solid #979797;
}
.about_menu a
{
margin:0 25px;
}
.about_menu a:hover
{
color:var(--red-color)
}
.mission_box
{
background:var(--lightblue-color)
}
.global_box
{
background:var(--red-color)
}
.we_are_box .img-bg
{
position:absolute;
top:0;
left:0;
z-index:40;
width:100%;
height:100%;
}
.global_link a
{
background:var(--white-color);
border-radius:25px;
color:var(--red-color);
display: block;
}
.report_box .img-bg
{
position:absolute;
top:0;
left:0;
z-index:40;
width:100%;
height:100%;
background-attachment:fixed;
background-size:cover
}
.report_box a
{
background:var(--red-color);
border-radius:25px;
color:var(--white-color)
}
.report_box a:hover
{
background:var(--lightblue-color);
color:var(--white-color)
}
.partners_box
{
border: 1px solid #979797;
background:#FFF;
height:170px;
}
#image-gallery .colw-25
{
display:none
}
#hidden-content
{
display:none;
overflow: initial !important;
margin: 60px 30px !important;
}
.close-p
{
position:absolute;
top:-40px;
right:0;
cursor:pointer;
z-index:50
}
#hidden-content .fancybox-close-small
{
display:none
}
.users_box
{
background:#F6F6F6
}
.impact_box:before
{
content:'';
width:100%;
height:100%;
z-index:50;
position:absolute;
top:0;
left:0;
background-color: rgba(0,0,0,0.27);
}
.impact_info_box
{
position:absolute;
bottom:15px;
left:20px;
z-index:60;
width:195px;
height:145px;
}
.impact_info_box img
{
width:70px;
height:auto !important
}
.contribution_box
{
border: 1px solid #E1E1E1;
background-color: #FFFFFF;
min-height:350px;
}
.red-color
{
color:var(--red-color)
}
.news_box_info
{
border: 1px solid #DEDEDE;
background-color: #FFFFFF;
}
.hover_box
{
position:absolute;
top: 50%;
left: 50%;
z-index:50;
width:100%;
height:100%;
background:rgb(224 32 32 / 80%);
transform: translate(-50%, -50%) rotateY(90deg);
transform-origin: 50%;
opacity: 0;
transition: all 0.4s ease-in;
}
.hover_h_box
{
width:100%;
height:100%;
position:relative
}
.hover_m_box{
background:#FFF;
display: flex !important;
justify-content: center;
flex-direction: row;
align-content: center;
align-items: center;
}
.news_box:hover .hover_box {
transform: translate(-50%, -50%) rotateY(0deg);
opacity: 1;
}
.d-unset
{
display:unset
}
.new-details img
{
margin-left:50px;
margin-bottom:50px;
}
.gallery_slick_for .slick-slide {
margin: 0 5px;
}
/* the parent */
.gallery_slick_for .slick-list {
margin: 0 -5px;
}
.gallery_slick , .gallery_slick_for
{
margin-bottom:0 !important
}
.gallery_slick_for .slick-slide div:first-child
{
margin-bottom:3.5px;
}
.gallery_slick_for .slick-dots
{
bottom:-12px;
}
.video-section .play-icon-container {
width: 120px;
height: 120px;
cursor: pointer;
position: absolute;
top: 50%;
left: 50%;
margin-top: -60px;
margin-left: -60px;
border-radius: 50%;
background:var(--red-color);
box-shadow: inset 0 0 0 1px var(--red-color);
text-align: center;
-webkit-transform: translateZ(0);
-moz-transform: translateZ(0);
-ms-transform: translateZ(0);
-o-transform: translateZ(0);
transform: translateZ(0);
-webkit-transition: box-shadow .4s ease;
-moz-transition: box-shadow .4s ease;
-ms-transition: box-shadow .4s ease;
-o-transition: box-shadow .4s ease;
transition: box-shadow .4s ease;
}
.video-section .play-icon {
position: relative;
left: 5px;
color: #fff;
display: inline-block;
vertical-align: top;
zoom: 1;
display: inline;
line-height: 122px;
font-size: 50px;
-webkit-transition: color .4s ease-in-out;
-moz-transition: color .4s ease-in-out;
-ms-transition: color .4s ease-in-out;
-o-transition: color .4s ease-in-out;
transition: color .4s ease-in-out;
}
.video-section .play-icon-container:after {
-webkit-transition: box-shadow .2s linear;
-moz-transition: box-shadow .2s linear;
-ms-transition: box-shadow .2s linear;
-o-transition: box-shadow .2s linear;
transition: box-shadow .2s linear;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
display: block;
content: '';
width: 100%;
height: 100%;
position: absolute;
padding: 8px;
border-radius: 50%;
top: 50%;
left: 50%;
-webkit-transform: translateX(-50%) translateY(-50%);
-moz-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
-o-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
box-shadow: inset 0 0 0 2px var(--red-color);
}
.video-section:hover .play-icon-container {
box-shadow: inset 0 0 0 60px #fff;
}
.video-section:hover .play-icon {
color: var(--red-color);
}
.video-section:hover .play-icon-container:after {
box-shadow: inset 0 0 0 9px #fff;
}
.back{
display:flex;
margin-bottom:-1.5625rem;
}
.back img
{
transform:rotate(180deg);
filter: brightness(0) invert(1);
}
.back a
{
background:var(--red-color)
}
.back a:hover
{
background:var(--lightblue-color);
color:var(--white-color)
}
.vacancies_box
{
border:1px solid #979797;
}
.vacancies_box h2
{
position:relative;
}
.vacancies_box h2:before
{
position:absolute;
bottom:-15px;
left:0;
z-index:50;
width:75px;
height:2px;
content:'';
background:var(--red-color)
}
.vacancies_box a , .vacancies_box_work a
{
border: 1px solid #E02020;
border-radius: 25px;
background:var(--white-color)
}
.vacancies_box a:hover , .vacancies_box_work a:hover
{
color:#FFF;
background:var(--red-color)
}
.vacancies_box a:hover img , .vacancies_box_work a:hover img
{
filter: brightness(0) invert(1);
}
.view_all a
{
border: 1px solid #E02020;
border-radius: 25px;
background:var(--red-color);
color:#FFF
}
.view_all a:hover
{
color:var(--red-color);
background:var(--white-color)
}
.view_all_1 a
{
border: 1px solid #E02020;
border-radius: 25px;
font-weight: bold;
color:var(--white-color);
background:var(--red-color)
}
.view_all_1 a:hover
{
background:var(--white-color);
color:var(--red-color);
}
.bb-2
{
border-bottom:1px solid var(--red-color)
}
.vacancies_apply_link a
{
border: 1px solid #E02020;
background:var(--red-color);
border-radius: 25px;
color:#FFF
}
.vacancies_apply_link a img
{
filter: brightness(0) invert(1);
}
.vacancies_apply_link a:hover img
{
filter: inherit;
}
.vacancies_apply_link a:hover
{
color:var(--red-color);
background:var(--white-color)
}
.careers-form label , .act-form label
{
line-height:2.5rem;font-size:1rem
}
.careers-form input, .contact-form textarea {
border: 1px solid #D6D3D3;
border-radius: 25px;
}
.file-custom {
position: absolute;
width: 65px;
height: 25px;
right: 0;
top: 12px;
}
.file-custom img
{
width:20px;
}
.file_none {
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
z-index: 50;
opacity: 0;
}
#file
{
background-color: #F3F3F3;
border:0;
font-weight:600;
text-align:center;
color:#F3F3F3;
cursor:pointer
}
.careers-form button[type=submit]
{
width:100%;
height:50px;
border-radius: 25px;
background-color: var(--red-color)
}
.careers-form button[type=submit]:hover
{
background-color: var(--black-color)
}
.act_box
{
border:1px solid #DDDCDC
}
.act-form textarea , .act-form input{
border: 1px solid #979797;
border-radius: 25px;
}
.act-form textarea
{
height:100px;
}
.act-form button[type=submit]
{
width:100%;
height:50px;
border-radius: 25px;
background-color: var(--red-color)
}
.act-form button[type=submit]:hover
{
background-color: var(--black-color)
}
.act-min-h
{
min-height:110px;
}
.act-down
{
border-radius:50%;
position:absolute;
left:50%;
bottom:-42px;
z-index:50;
transform:translateX(-50%);
cursor:pointer;
height: 65px;
width: 65px;
background-color: #FFFFFF;
}
.act-none
{
display:none
}
.act-down.up img
{
transform:rotate(180deg)
}
.work_box:before
{
content:'';
width:100%;
height:100%;
z-index:50;
position:absolute;
top:0;
left:0;
background-color: rgba(0,0,0,0.27);
}
.work_info_box
{
position:absolute;
bottom:15px;
left:0;
z-index:60;
width:100%;
}
.work_big_image_info
{
position:relative;
z-index:60;
width:100%;
background-color: rgba(0,0,0,0.27);
}
.our_work_red:before
{
content:'';
width:100%;
height:250px;
z-index:50;
position:absolute;
bottom:0;
left:0;
background-color: var(--red-color);
}
.our_work_video .img-bg
{
height:470px;
}
.donate-form label , .act-form label
{
line-height:2rem;font-size:1rem
}
.donate-form textarea , .donate-form input{
border: 1px solid #979797;
border-radius: 25px;
}
.donate-form textarea
{
border: 1px solid #979797;
border-radius: 6px;
height:70px;
}
.donate-form button[type=submit]
{
width:100%;
height:50px;
border-radius: 25px;
background-color: var(--red-color)
}
.donate-form button[type=submit]:hover
{
background-color: var(--black-color)
}
.donate-form input[type=checkbox] , .donate-form input[type=radio]
{
border-radius:0;
width: 21px;
height: 21px;
}
.donate-form label.font-14, .donate-form label.font-14 *
{
font-size:0.875rem;
line-height:1.2rem
}
#customamount
{
width: 155px;
height: 30px;
border-radius: 4px;
font-weight: bold;
font-size: 14px;
}
.currency_amount
{
border: 1px solid #979797;
border-radius: 4px;
width:90px;
height:30px;
text-align:center;
}
.currency_amount input
{
opacity:0;
position:absolute;
top:-999px;
left:-999px;
visibility:hidden
}
.currency_amount input[type=checkbox] ~ label, .currency_amount input[type=radio] ~ label
{
display:block;
width:100%
}
.currency_amount input:checked + label {
background-color: var(--red-color);
color:#FFF
}
#support
{
max-width: 325px;height: 40px;
border: 1px solid #CECECE;
border-radius: 25px;
background-color: #F4F4F4;
}
.impact-slick .img-bg
{
height:414px;
}
.impact-slick , .news-slick
{
margin-bottom:0 !important
}
.impact-slick .impact_box:hover .img-bg
{
transform:scale(1.1)
}
.impact-slick .impact_box .img-bg
{
transition:all 0.5s ease-in-out;
}
.vancancies-slick .slick-slide , .news-slick .slick-slide {
margin: 0 15px;
}
/* the parent */
.vancancies-slick .slick-list , .news-slick .slick-list {
margin: 0 -15px;
}
.vancancies-slick .bg_hover , .news-slick .bg_hover , .news-slick .bg_hover a {
display:flex
}
.conversation_box .footer_social a
{
background:#000;
}
.conversation_box .footer_social a:hover
{
background:#454644;
}
.bg_parallax .img-bg
{
height:100%;
width:100%;
position:absolute;
top:0;
left:0;
z-index:30;
}
.newsletter-signup-form input
{
height: 50px;
width: 380px;
border: 1px solid #FFFFFF;
border-radius: 33px;
color:#FFF;
background-color: rgba(255,255,255,0.19);
}
.newsletter-signup-form input::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
color: #FFF;
opacity: 1; /* Firefox */
}
.newsletter-signup-form input:-ms-input-placeholder { /* Internet Explorer 10-11 */
color: #FFF;
}
.newsletter-signup-form input::-ms-input-placeholder { /* Microsoft Edge */
color: #FFF;
}
.newsletter-signup-form button
{
height: 50px;
width: 246px;
border-radius: 25px;
background-color: #E02020;
}
.banners
{
margin-bottom:-10px !important;
position:absolute;
}
.main_bg {
width: 100%;
height: 95vh;
padding-top:15vh;
overflow: hidden;
position: relative;
}
.banners_bg {
position: absolute;
transition: all 1s ease-in;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-position: center center;background-repeat:no-repeat;background-size:cover
}
.banners_bg:before {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 25%;
background: linear-gradient(180deg, rgba(0,0,0,0) 0%, #000000 100%);
z-index: 50;
content: '';
}.banners_text {
position: absolute;
top: 50vh;
left: 0;
width: 100%;
z-index: 50;
padding-top: 0;
}
.banners .slick-dots li button
{
background:var(--red-color)
}
.preloader {
position: fixed;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
z-index: 999999999999999999;
background-color: #ffffff;
background-position: center center;
background-repeat: no-repeat;
background-size: 300px;
background-image: url(../img/loader.gif);
}
.banners .slick-dots
{
width:auto;
height:100%;
display: flex !important;
justify-content: center;
flex-direction: column;
align-content: center;
align-items: center;
right:5%;
bottom:0;
}
.banners .slick-dots li
{
margin:2.5px 0;
border:1px solid #FFF;
width:15px;
height:15px;
display: flex !important;
justify-content: center;
flex-direction: column;
align-content: center;
align-items: center;
}
.banners .slick-dots li.slick-active
{
width:15px;
}
.banners .slick-dots li button:hover,.banners .slick-dots li.slick-active button {
background: var(--lightblue-color);
}
.banners .slick-dots li.slick-active {
border-color: var(--lightblue-color);
}
.banners .slick-current .banners_bg {
animation: zoomFadeIn 1s ease-out both;
}
@keyframes zoomFadeIn {
0% {
opacity: 0;
transform: scale(0.8);
transform-origin: 50% 50%; /* Center point */
}
100% {
opacity: 1;
transform: scale(1);
transform-origin: 50% 50%; /* Center point */
}
}
.home_page header
{
position:absolute;
top:0;
left:0;
width:100%;
}
.home_page header .shadow:before
{
display:none
}
.figures
{
position: absolute;
bottom: 3vh;
left: 0;
width: 100%;
z-index: 50;
}
.figures-slick .slick-track
{
margin:auto;
}
.figures-slick .slick-slide {
margin: 0 15px;
}
/* the parent */
.figures-slick .slick-list {
margin: 0 -15px;
}
.bg_parallax_donate
{
height:500px;
}
.bg_parallax_donate .img-bg
{
height:100%;
width:100%;
position:absolute;
top:0;
left:0;
z-index:30;
}
.bg_parallax_donate:before
{
/*height:100%;
width:40%;
position:absolute;
top:0;
left:0;
z-index:40;content:'';
background: linear-gradient(270deg, rgba(0,0,0,0) 0%, rgba(38,26,26,0.97) 45.43%, #271B1B 100%);
*/
}
.impact_abso
{
position:absolute;
top: 50%;
left: 50%;
width:100%;
height:100%;
z-index:70;
transform: translate(-50%, -50%) rotateY(90deg);
transform-origin: 50%;
opacity: 0;
transition: all 0.4s ease-in;
}
.impact_box:hover .impact_abso
{
transform: translate(-50%, -50%) rotateY(0deg);
opacity: 1;
}
.opa-7
{
opacity:0.7
}
.bb-3
{
border-bottom:1px solid #FFF
}
.more_info a
{
border: 1px solid #FFF;
border-radius: 5px;
color: var(--white-color);
width: 100%;
text-align: center;
}
.more_info1a:hover
{
color:var(--white-color);
background:var(--red-color)
}
.scroll_up {
width: 44px;
position: fixed;
bottom: 30px;
right: 10px;
z-index: 60;
height: 44px;
color: #FFF;
border-radius:50%;
background: var(--red-color);
padding: 20px;
text-align: center;
margin: 0 0 0 0;
font-size: 22px;
cursor: pointer;
transition: 0.5s;
-moz-transition: 0.5s;
-webkit-transition: 0.5s;
-o-transition: 0.5s;
}
.scroll_box
{
display:none
}
.impact_h3_min
{
min-height:80px
}
.report_box:before , .bg_parallax:before {
height: 100%;
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 44;
content: '';
background:rgba(0,0,0,0.4);
}
.team_box img
{
border-radius:50%
}
.work_big_image .img-bg
{
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 50;
}
.figures-slick
{
margin-bottom:0 !important
}
.work-menu .ddm
{
margin-top:-50px
}
.work-menu .ddm a
{
line-height:2.5rem;font-size:1.375rem;
}
.min-50
{
min-height:50px;
}
.about-section-box .content-box {
/* Adjust the maximum height as needed */
overflow: hidden;
transition: max-height 0.3s ease-in;
}
.about-section-box .read-more {
display: block;
margin-top: 10px;
cursor: pointer;
}
.about-section-box .content.expanded {
max-height: none;
}
.about-section-box .content.expanded + .read-more {
display: none;
}
.read-more
{
background:none;
color:#FFF;
margin-top: 15px;
}
.min-60
{
min-height:60px;
}
@media all and (max-width: 1255px){
.container{width:1150px}
.mission_box.py-75 , .global_box.py-75 {padding-top:1.5625rem;padding-bottom:1.5625rem;}
}
/*m*/@media all and (max-width: 1055px){
/*//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
.container{width:1050px}
.about_us_page .font-50 , .about_us_page .font-50 * {font-size: 2rem;line-height:2rem}
}
/*xm*/@media all and (max-width: 868px){
.d-block-s{display:block}
.flex-row-xm{flex-direction:column}
.mt-25-xm{margin-top:1.5625rem;}
.mt-50-xm{margin-top:3.125rem;}
.mt-50-xm{margin-top:3.125rem;}
.ml-0-xm{margin-left:0}
.ai-fs-xm{align-items:flex-start}
.txt-cntr-xm{text-align:center}
.d-inline-block-xm{display:inline-block}
.w-100-xm{width:100%}
/*//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
.c_info_box{width:60%}
.opac{background-size:cover}
header li .ddm{left:50%}
.users_box{padding-top:3.125rem;padding-bottom:3.125rem;}
.vacancies_box.px-45{padding-right:1.5625rem;padding-left:1.5625rem;}
.main_bg{height:60vh}
}
/*s*/@media all and (max-width: 576px){
html{font-size:12px;}
.flex-row-s{flex-direction:column}
.ai-fs-s{align-items:flex-start}
.mt-25-s{margin-top:1.5625rem;}
.mt-15-s{margin-top:15px;}
.mt-50-s{margin-top:3.125rem;}.pt-50-s{padding-top:3.125rem;}
.d-none-s{display:none !important}
.pl-0-s{padding-left:0}
.ml-0-s{margin-left:0}
.ml-25-s{margin-left:1.5625rem}
.txt-cntr-s{text-align:center}
.txt-cntr-s img{display:inline-block}
.px-25-s{padding-right:1.5625rem;padding-left:1.5625rem;}
.mt-0-s{margin-top:0}
.pb-50-s{padding-bottom:3.125rem;}
.py-50-s{padding-top:3.125rem !important;padding-bottom:3.125rem !important;}
.py-0-s{padding:0}
.pr-5-s{padding-right:5px;}
.my-25-s{padding-top:1.5625rem;padding-bottom:1.5625rem;}
.m-0-s{margin-right:0 !important;margin-left:0 !important}
.w-50-s{width:50%}
.w-100-s{width:100%}
.fr-s-none{float:none}
.px-0-s{padding-right:0;padding-left:0;}
.py-25-s{padding-top:3.125rem;padding-bottom:3.125rem;}
/*//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
.footer_social a{width:30px;height:30px;}
footer .ml-50{margin-left:25px;}
.c_info_box{top:auto;left:auto;position:inherit;transform:inherit;width:100%;}
.c_info_box .px-50{padding:25px}
header li .ddm , header li .ddm-sub{top:auto;left:auto;box-shadow:inherit;padding-top:0;position:inherit}
.h_donate a , .h_act a{min-width:130px;height:40px;}
.h_act a{margin-top:5px;}
.currency_amount{width:22%}
.impact_info_box{height:135px;width:155px;}
.work_big_image_info{top:auto;left:auto;position:inherit;transform:inherit;width:100%;background:none;padding-top:3.125rem}
.app_now_box .app_now{padding-left:0.625rem;padding-right:0.625rem}
.about_menu a{margin:0 5px;text-align:center}
.work-menu .ddm{margin-top:0}
div.row[data-spacing="15"] > *[class^=col] {
padding: 10px;
}
div.row[data-spacing="15"] {
margin-left: -10px;
margin-right: -10px;
}
.main_bg{height:50vh}
#hidden-content{margin:60px 0 !important}
header .logo img {
max-width: 115px;
}
.ai-fe-s{align-items:flex-end}
.font-50, .font-50 * {font-size: 2.5rem;}
.vancancies-slick .slick-slide , .news-slick .slick-slide {
margin: 0 10px;
}
/* the parent */
.vancancies-slick .slick-list , .news-slick .slick-list {
margin: 0 -10px;
}
.mob-menu a {
line-height: 2.5rem;
font-size: 1.375rem;
}
.impact-slick .slick-dots{bottom:-20px;}.vancancies-slick .slick-dots{bottom:-20px;}
}