/*@charset "utf-8"; /*..............embedded fonts..............*/ /* font-family: "Poppins", serif; */ /* @import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto+Slab:wght@100..900&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap'); */ /* font-family: "Lexend", serif; */ /*..............embedded fonts..............*/ /*..............custom fonts..............*/ :root { --primary-font: "Roboto Slab", serif; --secondary-font: "Poppins", sans-serif; --primary-color: #F04D23; --secondary-color: #0D0F1C; --tartiary: #4B131F; --accent: #675B5E; --accent-red: #AC8E97; --black: #000000; --white: #FFFFFF; --gray: #F5F5F1; --transition-common: all .4s ease; } /*..............common styles..............*/ html { overflow-x: hidden; } body { margin: 0; padding: 0; font-family: var(--secondary-font); font-size: clamp(0.938rem, 0.851rem + 0.231vw, 1.125rem); color:var(--accent);overflow-x: hidden; } body.swal2-shown {padding-right: 0 !important;} .body-scroll { overflow-y: hidden; } h1, h2, h3, h4, h5, h6 { margin: 0 0 16px; padding: 0; color: var(--secondary-color); font-family: var(--primary-font); line-height: 1.2; font-weight: 400;} h1 , .h1{ font-size: clamp(1.75rem, 0.596rem + 3.077vw, 4.25rem); /* 68px */ } h2{ font-size: clamp(1.875rem, 1.071rem + 2.143vw, 3rem); font-weight: 700; /* 48px */ } h3{ font-size: clamp(1.25rem, 0.904rem + 0.923vw, 2rem); /* 32px */ } h4{font-size: clamp(1.25rem, 1.135rem + 0.308vw, 1.5rem);/* 18px */} h5{font-size: clamp(1rem, 0.942rem + 0.154vw, 1.125rem);/* 18px */} p{ margin:0 0 24px; line-height: 1.5;} p:last-child { margin-bottom: 0; } p strong { font-weight: 600; color: #4E2934; } img{ max-width: 100%; user-select: none; -webkit-user-drag: none; } a, img{ border:0; text-decoration: none; outline: none;} a, a:link, a:visited, a:focus, a:hover { color: var(--tartiary) ; outline: none; text-decoration: none; transition:all 0.3s ease 0s;} a:hover{ text-decoration:none;} /* NEW */ input, textarea, select, .form-control, .form-control:focus { font-family: var(--secondary-font); font-weight: 300; outline: none; border: 1px solid #F04D2333; background: transparent; border-radius: 0; height: 56px !important; padding: 16px 20px 16px!important; outline: none !important; box-shadow: none !important; color: var(--tartiary); font-weight: 400; font-size: clamp(1rem, 0.851rem + 0.231vw, 1.125rem) !important; } select { appearance: none !important; -webkit-appearance: none !important; height: 56px !important; padding-right: 40px !important; background-image: url(../images/select-arw.svg) !important; background-repeat: no-repeat !important; background-position: right 10px center !important; background-size: 24px !important; padding: 10px 36px 10px 16px !important;} input[type="submit"]{ font-family: var(--secondary-font); font-weight: 300; transition:all 0.3s ease 0s; outline: none; } .form-floating:has(.form-icon)>label { color: #675B5E; padding: 0 12px; display: inline-block; height: auto; width: auto; top: 15px; left: 38px; transition: all .4s ease; border-radius: 20px; } .form-floating:has(.form-icon)>label span { color: var(--primary-color); } .form-floating:has(.form-icon)>.form-control-plaintext~label, .form-floating:has(.form-icon)>.form-control:focus~label, .form-floating:has(.form-icon)>.form-control:not(:placeholder-shown)~label, .form-floating:has(.form-icon)>.form-select~label { opacity: 1; transform: scale(1) translateY(-27px) translateX(-26px); background: #FFF1ED; padding: 0 8px; } .search-input-wrap .form-floating>.form-control-plaintext~label, .search-input-wrap .form-floating>.form-control:focus~label, .search-input-wrap .form-floating>.form-control:not(:placeholder-shown)~label, .search-input-wrap .form-floating>.form-select~label { background-color: var(--white);} .form-floating>.form-control-plaintext~label::after, .form-floating>.form-control:focus~label::after, .form-floating>.form-control:not(:placeholder-shown)~label::after, .form-floating>.form-select~label::after { display: none; } .form-floating:has(.form-icon) input.form-control{ padding-left: 50px !important; } .form-icon { position: absolute; left: 20px; top: 21px; display: block; line-height: 1; width: 20px; aspect-ratio: 1; z-index: 1; } .form-icon i { display: flex; color: var(--primary-color); font-size: 18px; } .radio-box { display: block; cursor: pointer; } .radio-box input { display: none; } .radio-content { border: 1px solid #F04D2333; padding: 12px 20px; display: flex; align-items: center; gap: 10px; transition: 0.3s; color: var(--tartiary); } .radio-custom { width: 20px; height: 20px; border: 2px solid #A19194; border-radius: 50%; display: inline-block; position: relative; transition: 0.3s; } .radio-custom::after { content: ""; width: 12px; height: 12px; background: var(--primary-color); border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(0); transition: 0.3s; } .radio-box input:checked + .radio-content .radio-custom { border-color: #ff7043; border: 2px solid var(--primary-color); } .radio-box input:checked + .radio-content .radio-custom::after { transform: translate(-50%, -50%) scale(1); } .btn.submit-btn { width: 100%; max-width: 100%; justify-content: center; } input::placeholder, textarea::placeholder, select::placeholder, .form-control::placeholder { color: #A19194; } input[type="checkbox"] { width: 26px !important; height: 26px !important; border: 1px solid var(--primary-color); border-radius: 4px !important; background-color: transparent !important; background-repeat: no-repeat; background-position: center; background-size: contain; -webkit-appearance: none; -moz-appearance: none; appearance: none; -webkit-print-color-adjust: exact; color-adjust: exact; padding: 0 !important; margin: 0 12px 0 0 !important; flex: 0 0 auto; } label.form-check-label { font-size: clamp(0.875rem, 0.76rem + 0.308vw, 1.125rem); margin-bottom: 0 !important; } .form-check-input:checked[type=checkbox] { border: 1px solid var(--primary-color) !important;} input[type="checkbox"]:checked { border: 1px solid var(--primary-color) !important; } input[type="checkbox"]:checked { background-image: url(../images/check.svg); background-size: 16px; } :is(input, textarea):-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px #fff1ed inset !important; box-shadow: 0 0 0 1000px #fff1ed inset !important; -webkit-text-fill-color: var(--tartiary) !important; } /* NEW */ /* --- only use for wordpress (Image alignment) --- */ .alignleft , .alignnone{float:left; margin:0 15px 10px 0;} .alignright{float:right; margin:0 0 10px 15px;} .aligncenter{margin:10px auto; display:block;} /* --- only use for wordpress (Image alignment) --- */ /* --- Button Styles --- */ .header-btn { transition: all .3s; } .header-btn .fancy { margin-left: 20px; } .header-btn .fancy:hover { background: var(--white); border: 2px solid var(--primary-color); color: var(--primary-color); } .header-btn .fancy.btn-white:hover { background: var(--primary-color); } .fancy { background-color: var(--primary-color); border: 2px solid var(--white); border-radius: 0; box-sizing: border-box; color: #fff; cursor: pointer; display: inline-block; font-weight: 700; /* letter-spacing: 0.05em; */ margin: 0; outline: none; overflow: visible; padding: 16px 24px; position: relative; text-align: center; text-decoration: none; text-transform: none; transition: all 0.3s ease-in-out; user-select: none; font-size: 13px; } .fancy .text::before { content: " "; width: 30px; height: 2px; background: var(--white); top: 50%; left: 1.1em; position: absolute; transform: translateY(-50%); transform-origin: center; transition: all 0.3s linear; } .fancy .text { font-size: 18px; line-height: 1.2; padding-left: 2em; display: block; text-align: left; transition: all 0.3s ease-in-out; text-transform: capitalize; text-decoration: none; color: var(--white); font-weight: 500; } .fancy .top-key { height: 2px; width: 1.5625rem; top: -2px; left: 0.625rem; position: absolute; background: #fb4b2e; transition: width 0.5s ease-out, left 0.3s ease-out; } .fancy .bottom-key-1 { height: 2px; width: 1.5625rem; right: 1.875rem; bottom: -2px; position: absolute; background: #fb4b2e; transition: width 0.5s ease-out, right 0.3s ease-out; } .fancy .bottom-key-2 { height: 2px; width: 0.625rem; right: 0.625rem; bottom: -2px; position: absolute; background: #fb4b2e; transition: width 0.5s ease-out, right 0.3s ease-out; } .fancy:hover { color: var(--primary-color); background: var(--tartiary); border: 2px solid var(--tartiary); } .fancy:hover .text::before { width: 0.9375rem; background: white; left: 2em; } .fancy:hover .text { color: white; } .fancy:hover .top-key { left: -2px; width: 0px; } .fancy:hover .bottom-key-1, .fancy:hover .bottom-key-2 { right: 0; width: 0; } .btn-white { background-color: var(--white); border: 2px solid var(--primary-color); } .fancy.btn-white .text::before{background: var(--primary-color);} .fancy.btn-white .top-key , .fancy.btn-white .bottom-key-1 , .fancy.btn-white .bottom-key-2 {background:var(--white);} .fancy.btn-white .text{color: var(--primary-color);} .line-btn { background: transparent; border: 2px solid var(--primary-color); } .fancy.line-btn .text:before { background: var(--primary-color); } .fancy.line-btn .text { color: var(--primary-color); } .fancy.line-btn .bottom-key-1, .fancy.line-btn .bottom-key-2 , .fancy.line-btn .top-key { background: var(--white); } .fancy.line-btn.org-bg .bottom-key-1, .fancy.line-btn.org-bg .bottom-key-2, .fancy.line-btn.org-bg .top-key { background: #FFF1ED; } .btn, a.btn {display: block;background: var(--primary-color); border-radius: 0px;padding: 18px 24px 18px 24px;font-size: clamp(0.938rem, 0.851rem + 0.231vw, 1.125rem);font-weight: 500;font-family: var(--secondary-font);color: var(--white);line-height: 1;cursor: pointer;overflow: hidden;position: relative;z-index: 1;transition: var(--transition-common);-webkit-transition: var(--transition-common);-moz-transition: var(--transition-common);-ms-transition: var(--transition-common);-o-transition: var(--transition-common);isolation: isolate;} .sold-btn{background: var(--accent) !important;} .btn:hover { background: var(--accent-red) !important; color: var(--white); } .btn-blue { border: 1px solid var(--primary-color); } .btn-blue , a.btn-blue { border: 1px solid var(--primary-color); color: var(--primary-color); } .btn-blue::before, a.btn-blue::before { background: var(--primary-color); } .btn-blue::after, .btn-blue::after { filter: brightness(0) invert(1); } .btn-blue:hover, a.btn-blue:hover { color: var(--white); } .link-btn { border: 0 !important; padding: 12px 44px 12px 0px !important; } .link-btn::after { filter: none !important; transform: rotate(45deg) translateY(1px); } .link-btn:before { background: transparent !important; } .link-btn:hover::after { transform: rotate(0deg) !important; } .link-btn:hover { color: var(--primary-color) !important; } .btn-white:hover { border: 2px solid #fff; background: var(--primary-color);} .fancy:hover .text{ color: var(--primary-color) } .fancy:hover .text::before { background: var(--primary-color); } .fancy.btn-white:hover .text{ color: var(--white) } .fancy.btn-white:hover .text::before { background: var(--white); } .my-popup .btn { justify-content: space-between; overflow: hidden; position: relative; z-index: 0; transition: all .4s ease; -webkit-transition: all .4s ease; -moz-transition: all .4s ease; -ms-transition: all .4s ease; -o-transition: all .4s ease; display: inline-flex; align-items: center; vertical-align: top; color: var(--white) !important; padding: 16px 24px; font-size: clamp(0.938rem, 0.915rem + 0.071vw, 1rem); line-height: 1; text-transform: capitalize; height: 56px; border-radius: 0; font-weight: 500; border: none; width: max-content; max-width: fit-content; text-align: center; border: 2px solid var(--primary-color); text-shadow: none; } .my-popup .btn::before { width: 100%; height: 100%; content: ""; position: absolute; right: 0; top: 0; background-color: var(--primary-color); z-index: -1; transition: all .4s ease; -webkit-transition: all .4s ease; -moz-transition: all .4s ease; -ms-transition: all .4s ease; -o-transition: all .4s ease; } .my-popup .btn:hover {background-color:white !important; transform: translate(0px, 0px); transition: all .8s ease; -webkit-transition: all .8s ease; -moz-transition: all .8s ease; -ms-transition: all .8s ease; -o-transition: all .8s ease; color: var(--primary-color) !important; border: 2px solid var(--primary-color); text-shadow: none; } .my-popup .btn:hover::before { width: 0%; transition: all .8s ease; -webkit-transition: all .8s ease; -moz-transition: all .8s ease; -ms-transition: all .8s ease; -o-transition: all .8s ease; } /* --- Button Styles --- */ /* --- checkbox and radio button Styles --- */ .builder_radiobox ul li label{ font-weight: normal;} .builder_radiobox ul li input[type="radio"]{ opacity: 0;} .builder_radiobox ul li input[type="radio"]:empty ~ label{ position:relative; float:left; cursor:pointer; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; padding: 0 0 0 22px;} .builder_radiobox ul li input[type="radio"]:empty ~ label:before{ position:absolute; display:block; top:2px; bottom:0; left:0; content:""; width:16px; height:16px; background:url(../images/radiobutton.png) left top no-repeat;} .builder_radiobox ul li input[type="radio"]:checked ~ label:before{ background:url(../images/radiobutton.png) left bottom no-repeat;} /* --- checkbox and radio button Styles --- */ /*..............common styles..............*/ .common-padd { padding-top: 100px; padding-bottom: 100px; } .common-padd-small{ padding-top: 100px; padding-bottom: 100px; } .common-padd-bottom { padding-bottom: 80px; } .common-padd-top { padding-top: 80px; } .p-relative { position: relative; z-index: 1; } .grecaptcha-badge { visibility: hidden; } .gap-20 { gap: 16px 0; } /*..............common styles..............*/ /*-----scroll-bar-design----------*/ /* width */ ::-webkit-scrollbar { width: 8px; height: 3px; } /* Track */ ::-webkit-scrollbar-track { } /* Handle */ ::-webkit-scrollbar-thumb { background: var(--primary-color); border-radius: 0; } /*-----scroll-bar-design----------*/ /*-----Header design----------*/ .main-header { z-index: 999; width: 100%; position: fixed; top: 20px; background: #FFFFFF0F; backdrop-filter: blur(30px); -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; } /* .main-header.fixed { background: #F9F8F4; padding: 14px 0px; position: fixed; top: 0; width: 100%; box-shadow: 0 0 12px rgb(0 0 0 / 12%); transition: all 0.4s; -ms-transition: all 0.4s; -webkit-transition: all 0.4s; backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(10px); } */ .main-header .manu-part { display: flex; align-items: center; margin-left: auto;} /* .main-header .main-menu { padding-left: 70px; } */ /* Lava Lamp Menu Effect */ .main-menu { position: relative; } .lava-lamp { position: absolute; bottom: 0; height: 3px; background: var(--primary-color); border-radius: 2px; opacity: 0; transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1); pointer-events: none; box-shadow: 0 2px 8px rgba(49, 82, 150, 0.4); } .lava-lamp.active { opacity: 1; } .header-row { display: flex; align-items: center; justify-content: space-between; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; } .main-menu ul { margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; align-items: center;} .main-menu ul li:not(:last-child){ margin-right: 50px;} .main-menu ul li a { display: block; color: #DEC1CA; position: relative; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; font-size: 18px; font-weight: 400;} .main-menu ul li a img { margin-right: 4px; } .main-header.fixed .bottom-header .main-menu ul li.menu-item-has-children:hover a:after{ border-color: var(--white);} .main-menu ul li a:hover img { opacity: .80; } .main-menu ul li ul.sub-menu li a::before{ opacity: 0; content: ""; width: 0%; height: 1px; position: absolute; bottom: 7px; border-radius: 10px;-webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease;} .main-menu ul li.menu-item-has-children a { opacity: 1; content: ""; width: 100%; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; } /* .main-menu ul li a::before { content: ''; position: absolute; width: 0%; height: 2px; background-color: #315296; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; bottom: 0; } .main-menu ul li a:hover::before { content: ''; position: absolute; width: 100%; height: 2px; background-color: #315296;} */ .main-menu ul li.menu-item.current-menu-item a::before { width: 100% } .main-menu ul li ul.sub-menu li a::before { background-color: #FFFFFF !important; top: 50%; width: 0 !important; left: 0; border: 1px solid #315296; } .main-menu ul li ul.sub-menu li a:hover::before { width: 20px !important; opacity: 1; } .main-menu ul li ul.sub-menu li a:hover{ padding-left: 30px; } .main-menu ul li a:hover , .main-menu ul li.current-menu-item a { color: var(--white); } .main-menu ul li.current-menu-item a {font-weight: 600;} .main-menu ul li span {margin-left: 10px; display: inline-block; } .main-menu ul li span img { margin-top: -4px; } .main-header.relative_header {background-color: #000000; } /*------css for new dropdown sub-menu start--------*/ .main-header .manu-part .main-menu { margin-right: 60px; } .main-menu ul li.menu-item-has-children a:after { -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; content: ""; position: absolute; top: 35%; box-sizing: border-box; height: 9px; width: 9px; border-style: solid; border-color: #DEC1CA; border-width: 0px 2px 2px 0px; transform: rotate(45deg) translate(0, -50%); transition: border-width 150ms ease-in-out; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; right: 6px; margin: 0 auto; } .main-menu ul li.menu-item-has-children:hover a:after { -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; border-color: var(--white); transform: rotate(-135deg) translate(0, -26%);} .main-menu ul li.menu-item-has-children a {padding-right: 24px; } .main-menu ul.sub-menu li a:after{display: none!important;} .main-menu ul{margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;} .main-menu ul li { display: flex; justify-content: center; align-items: center; position: relative; perspective: 1000px; z-index: 100; color: #FFFFFF; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; } .main-menu ul.sub-menu { position: absolute; width: 250px; display: block; margin-top: 0; padding: 6px 20px; border-radius: 10px; box-shadow: 0 15px 12px #0000005e; overflow: hidden; -webkit-transition: all .4s ease; -moz-transition: all .4s ease; -ms-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease } .main-menu ul.sub-menu li { margin: 0!important; padding: 0 } .main-menu ul li .sub-menu li a {color: var(--accent); padding: 8px 0; text-transform: uppercase;} .main-menu ul li.out .sub-menu { opacity: 0; transform: scaleY(0) translateZ(0); visibility: hidden; } header .main-menu ul>li { position: relative; cursor: pointer } header .main-menu ul .sub-menu { position: absolute; left: 0; top: 30px; transform-origin: 50% 0; transform: scaleY(0) translateZ(0); opacity: 0; transition: transform 0.3s, opacity 0.3s; width: 230px; overflow: hidden; padding: 0; box-shadow: none; opacity: 1; visibility: hidden; display: unset; } header .main-menu ul li ul::before {content: ""; width: 100%; height: 100%; position: absolute; top: -12px; left: 0; background-color: var(--accent); } header .main-menu ul li:hover ul {padding-top: 5px;box-shadow: 0px 4px 10px 0px #00000014;opacity: 1; transform: scaleY(1) translateZ(0); visibility: visible; display: unset; transition: transform 0.4s, opacity 0.4s ease-out; } header .main-menu ul .sub-menu li { display: block; position: relative; padding: 0px 20px; cursor: pointer; background-color: #FFFFFF; -webkit-transition: all .4s ease; -moz-transition: all .4s ease; -ms-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } header .main-menu ul .sub-menu li:first-child{padding-top: 10px;border-radius: 10px 10px 0 0;} header .main-menu ul .sub-menu li:last-child{padding-bottom: 10px;} .src-icon { width: 20px; height: 20px;} .src-icon img{ width: 100%; height: 100%; object-fit: contain; } /*------css for new dropdown sub-menu end--------*/ .main-header.fixed .logo {transform: scale(0.9); -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; margin-top: -6px; } .main-header .logo {transform: scale(1.0); max-width: 132px; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; position: relative;} .logo-main { --gap: 24px; position: absolute; max-width: calc(100% - calc(var(--gap)*2)); left: var(--gap); top: calc(var(--gap) / 2); z-index: 99; } .logo-main img { width: 100%; } .logo-shape { filter: drop-shadow(0px 2px 6px rgba(0,0,0,0.08)); } /* .main-header .logo:after { position: absolute; content: ''; clip-path: polygon(49% 52%, 0 0, 100% 0); width: 128px; height: 60px; background: #fff; bottom: -60px; left: -8px; right: 0px; } */ .nav_btn { color: #FFFFFF; font-size: 22px; text-align: right; display: none; } .nav_close { display: none; color: #FFFFFF; } .main-header.fixed{ position: fixed; top: 0; width: 100%; transition: all 0.4s; -ms-transition: all 0.4s; -webkit-transition: all 0.4s; box-shadow: 0 0 12px rgb(0 0 0 / 12%); background: var(--tartiary);} .main-header.fixed .main-menu > ul > li.menu-item-has-children > a { padding-right: 24px; } body:has(.main-header.fixed) { margin-top: 90px; } /*==========mobile menu=========*/ .main-header .hdr-rt {display: flex ; align-items: center; position: absolute; top: 0px; transform: translateY(-20px);transition: transform 0.3s ease;} .bottom-header{padding: 12px 0px; width: 100%;} .main-header.fixed .bottom-header .hdr-rt { transform: translateY(0px); } .main-header .hdr-rt.hdr-lt { gap: 50px; justify-content: flex-end; } .main-header .user-sec { display: flex; align-items: center; margin-left: 20px; margin-top: -4px;} .main-header .user-sec a:hover img { opacity: .80; } .menu-has-children.menu-has-children-open span img {transform: rotate(180deg);-webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease;} .menu-has-children span img {transform: rotate(0deg); -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease;} .mobile-menu-container ul.sub-menu {position: relative; max-height: 0; overflow: hidden; transition: max-height 0.6s ease-out;} .mobile-menu-container ul.sub-menu.sub-menu-open {transform: scaleY(1); max-height: 100%;} /* ~~~~~~~~~~ mobile menu styling ~~~~~~~~~~ */ .mobile-menu-container { position: fixed; z-index: 1; top: -20px; left: 0; right: 0; transform: translateX(-100%); background: #FFF1ED; height: 100dvh; opacity: 1; -webkit-transition: all .35s ease-in-out; -moz-transition: all .35s ease-in-out; -o-transition: all .35s ease-in-out; transition: all .35s ease-in-out; display: none; z-index: -1; } .mobile-menu-open .mobile-menu-container{ top: 0px; transform: translateY(0); opacity: 1;} .mobile-menu-container .inner-container { padding-top: 0; height: 100dvh; overflow-y: auto; position: relative; } /* .main-header.fixed .mobile-menu-container .inner-container{padding-top: 0;} */ .mobile-menu { max-width: 744px; padding-left: 24px; padding-right: 24px; padding-top: 167px; padding-bottom: 0; margin: 0 auto; text-align: center;} .mobile-menu ul{ margin: 0; padding: 0; list-style: none;} .mobile-menu ul li{ display: block; margin: 0; position: relative; } .mobile-menu ul li a{ display: block; font-size: 30px; color: #315296; padding: 4px 0;} .mobile-menu ul li.menu-item-has-children > a{padding-right: 15px;} html:has(body.body-scroll) { overflow: hidden; } header.main-header.mobile-menu-open .header-btn { opacity: 0; visibility: hidden; } header.main-header.mobile-menu-open .hamburger-nav::before { opacity: 1; transform: scale(1.3); } /* ===== mobile menu animation ===== */ /* .mobile-menu ul li{opacity: 0;-webkit-transform: translateX(-150px);transform: translateX(-150px);-webkit-transition: -webkit-transform 0.4s, opacity 0.4s;transition: transform 0.4s, opacity 0.4s;} .mobile-menu-open .mobile-menu ul li {opacity: 1;-webkit-transform: translateX(0);transform: translateX(0);} .mobile-menu-open .mobile-menu ul li:nth-child(1) {-webkit-transition-delay: 0.16s;transition-delay: 0.16s;} .mobile-menu-open .mobile-menu ul li:nth-child(2) {-webkit-transition-delay: 0.24s;transition-delay: 0.24s;} .mobile-menu-open .mobile-menu ul li:nth-child(3) {-webkit-transition-delay: 0.32s;transition-delay: 0.32s;} .mobile-menu-open .mobile-menu ul li:nth-child(4) {-webkit-transition-delay: 0.40s;transition-delay: 0.40s;} .mobile-menu-open .mobile-menu ul li:nth-child(5) {-webkit-transition-delay: 0.48s;transition-delay: 0.48s;} .mobile-menu-open .mobile-menu ul li:nth-child(6) {-webkit-transition-delay: 0.54s;transition-delay: 0.54s;} */ /* ===== mobile menu animation ===== */ .mobile-menu-open .mobile-menu ul li.btn { margin: 0 auto; padding: 5px 5px; max-width: 150px;} .mobile-menu-open .mobile-menu ul li.btn a{color: #FFFFFF;} /*=========mobile menu===========*/ /*=========mega menu===========*/ .header-mega-menu { display: none; background: var(--primary-color); padding: 4px 0 9px; } .menu-box a{ background: #F2F2EA; border: 1px solid #363C41; border-radius: 8px; padding: 30px; display: flex; } .menu-box a:hover { background: var(--secondary-color); } .menu-box a:hover .menu-img img { filter: brightness(0) invert(1); } .menu-box a:hover .menu-content * { color: var(--white); } .header-mega-menu .row { padding: 0 28px; } .header-mega-menu .row .col-lg-3 { padding-left: 1px; padding-right: 1px; } .menu-img { width: 67px; flex-shrink: 0; margin-right: 20px; margin-top: 10px;} .menu-content h5 { font-size: 18px; font-weight: 700; margin-bottom: 4px; } .menu-content p { font-size: 14px; color: var(--secondary-color); } /*=========mega menu===========*/ /*for header css*/ /* ~~~~~~~~~~ hamburger menu styling ~~~~~~~~~~ */ .hamburger-nav{ display: none; vertical-align: top; width: 32px; height: 32px; position: relative; margin: 0; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .3s ease-in-out; -moz-transition: .3s ease-in-out; -o-transition: .3s ease-in-out; transition: .3s ease-in-out; cursor: pointer; margin: 0px 0px 0px 10px;} .hamburger-nav::before { content: ''; position: absolute; top: 0; left: 0; background: #FF663F; width: 100%; height: 100%; z-index: -1; border-radius: 30px; opacity: 0; transform: scale(0); transition: all .5s; } .hamburger-nav span{ display: block; position: absolute; height: 2px; width: 100%; background: #fff; border-radius: 9px; opacity: 1; left: 0; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;} .hamburger-nav span:nth-child(1){ top: 0px; -webkit-transform-origin: left center; -moz-transform-origin: left center; -o-transform-origin: left center; transform-origin: left center;} .hamburger-nav span:nth-child(2){ top: 7px; -webkit-transform-origin: left center; -moz-transform-origin: left center; -o-transform-origin: left center; transform-origin: left center; width: 60%;left: 0;right: 0;margin: 0 auto;} .hamburger-nav span:nth-child(3){ top: 14px; -webkit-transform-origin: left center; -moz-transform-origin: left center; -o-transform-origin: left center; transform-origin: left center;} /*when turns close icon*/ .mobile-menu-open .hamburger-nav span:nth-child(1){ -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); top: -1px; left: 3px;} .mobile-menu-open .hamburger-nav span:nth-child(2){ width: 0%; opacity: 0;} .mobile-menu-open .hamburger-nav span:nth-child(3){ -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); top: 15px; left: 3px;} /*when turns close icon*/ /* ~~~~~~~~~~ hamburger menu styling ~~~~~~~~~~ */ .light-bg{background: #FFF1ED;} /*===== Home page start ====*/ body:has(.banner) , body:has(.inner-banner) , body:has(.login-section){ margin-top: 0 !important;} .banner video {width: 100%;height: 100%;object-fit: cover;position: absolute;z-index: -2;top: 0;} .banner {min-height: 100svh; overflow: hidden; position: relative; padding-top: 100px; display: flex ; align-items: flex-end; background-repeat: no-repeat; background-position: bottom center; background-size: cover; z-index: 1; padding-bottom: 92px;} .banner:after { position: absolute; content: ''; width: 100%; height: 100%; background: linear-gradient(180deg, #4B131F 0%, #0D0F1C 93.49%); opacity: .7; top: 0; bottom: 0; left: 0; right: 0; z-index: -1; } .bg-red{background: #FFF1ED;} .community-tab { margin-top: 40px; } .community-tab ul { border: 0 !important; } .community-tab ul li { width: 33.3%; } .community-tab ul li button { width: 100%; border-bottom: 1px solid #F04D231C !important; padding: 16px 0; transition: all .4s ease; border-top: 0 !important; border-left: 0 !important; border-right: 0 !important; color: #AC8E97 !important; font-weight: 500; display: flex;justify-content: center;} .community-tab ul li button.active , .community-tab ul li button:hover {background: transparent !important; border-bottom: 1px solid #F04D23 !important; border-left: 0; border-right: 0; border-top: 0; color: var(--primary-color) !important;} .community-tab ul li button span { margin-right: 10px; } .community-tab ul li button span svg { height: 20px; } .community-tab ul li button.active span svg path, .community-tab ul li button:hover span svg path { fill: var(--primary-color); } .community-tab ul li button strong{display:inline-flex;padding:6px 10px;background:#f04d2314;border:1px solid #F04D2333!important;color:var(--tartiary);font-size:12px; margin-left: 6px;} .community-tab ul li button .tab-div{text-align:left;} .community-tab .tab-content { margin-top: 54px; } .community-tab .community-item { background: #ffffff; border: 1px solid #D9D9D9; padding: 36px 30px 30px; position: relative; margin-bottom: 54px; height: calc(100% - 54px);} .community-tab .comm-name { display: flex; gap: 14px; align-items: center; margin-bottom: 16px; } .community-tab .comm-name span { background: #F4F4F4; border: 1px solid #D9D9D9; width: 40px; height: 40px; border-radius: 4px; display: flex; align-items: center; justify-content: center; } .community-tab .comm-name h4 { margin-bottom: 0; font-weight: 600; } .community-item h5 { color: var(--accent); font-family: var(--secondary-font); margin-bottom: 8px; } .community-item p { color: var(--accent-red); font-size: 16px; margin-bottom: 8px; } .community-item p a { background-image: linear-gradient(#cf303000 95%, var(--tartiary) 0, var(--tartiary)); background-position-y: bottom; background-repeat: no-repeat; background-size: 0 100%; text-decoration: none; transition: background-size .3s cubic-bezier(.79, .01, .22, .99) 0s, background-position 0s step-end .3s, color .3s; } .community-item p a:hover { background-position-x: right; background-position-y: bottom; background-size: 100% 100%; } .community-p { max-height: 192px; overflow: auto; } .community-wrap .player-list {background: white;} .donor-price { display: inline-block; border-radius: 8px; border: 2px solid var(--primary-color); padding: 8px 24px; position: absolute; right: 30px; top: -20px; background: var(--white); } .donor-price h4 { margin: 0; font-weight: 600; color: var(--primary-color); } .community-wrap .line-btn{float: none;} .registration-wrap:before {position: absolute; content: ''; width: 100%; height: 89%; bottom: 0; background: #FFF1ED; left: 0; right: 0; z-index: -1;} .registration-wrap .common-heading{padding: 64px 0;} .registration-wrap .common-heading .line-btn { float: none; } .common-heading .heading-icon { margin-bottom: 16px; display: block; } .registration-img { width: 50vw; } .marquee { display: flex; overflow: hidden; user-select: none; gap: 16px; } .marquee__group { flex-shrink: 0; display: flex; align-items: center; justify-content: space-between; gap: 16px; min-width: auto; animation: scroll 100s linear infinite reverse; } .marquee__group span, .marquee__group a { border-radius: 10px; padding: 15px 36px; transition: all 0.3s ease; background: #FFFFFF; height: inherit; min-width: 160px; display: flex; align-items: center; justify-content: center; } .marquee__group span img, .marquee__group a img { mix-blend-mode: darken; height: 60px; max-width: 120px;object-fit: contain;} .marquee__group.rev { animation: scroll 100s linear infinite; } @keyframes scroll { from { transform: translateX(0); } to { transform: translateX(calc(-100% - 2rem)); } } .sponsor-wrap { background: #FFF1ED; } .sponsor-logos { width: 61.87vw; position: relative; } .sponsor-logos:before { position: absolute; content: ''; width: 100%; height: 100%; background: linear-gradient(90deg, #FFF1ED 0%, rgba(255, 255, 255, 0) 10.46%, rgba(255, 255, 255, 0) 86.3%, #FFF1ED 100%); top: 0; left: 0; right: 0; z-index: 3; } .team-flex { display: flex; } .team-time { background: #4B131F; padding: 30px; width: 184px; display: flex; align-items: center; justify-content: center;} .time-info { text-align: center; background: var(--primary-color); padding: 15px; width: 124px; height: 124px; } .time-info * { color: var(--white); margin: 0; } .time-info h3 { font-weight: 700; } .time-info p { max-width: 105px; margin: 0 auto; } .team-text {background: #FFF; box-shadow: 0px 10px 30px 0px #0000000F; padding: 35px 40px; flex: 1; display: flex; align-items: center; justify-content: space-between; } .home-sponsor .sponsor-wrap { background: #FFF; } .home-sponsor .sponsor-logos:before { background: linear-gradient(90deg, #ffffff 0%, rgba(255, 255, 255, 0) 10.46%, rgba(255, 255, 255, 0) 86.3%, #ffffff 100%); } .home-sponsor .sponsor-wrap .marquee__group span, .home-sponsor .sponsor-wrap .marquee__group a { background: #F5F5F5; } .team-heading h4 { color: var(--primary-color); font-family: var(--secondary-font); font-weight: 600; margin-bottom: 8px; } .team-heading h3 { color: #4B131F; font-weight: 700; margin-bottom: 0; } .team-heading { width: 352px; flex: 0 0 auto; } .team-content { width: calc(100% - 352px); max-width: 620px; } .team-content p strong { font-weight: 600; color: #4E2934; } .banner-content h1 { color: var(--white); font-weight: 700; margin-bottom: 32px; } /*========all circle animated button=====*/ :root { --radius: 78px;/*button size in general*/ --frame-size: calc(var(--radius) / 3); --d-outer: calc(var(--radius) * 2); --d-inner: calc(var(--d-outer) - var(--frame-size)); --font-size: calc(var(--radius) / 5.5);/*font size */ } .video-btn { margin-bottom: 95px; margin-right: auto;} .button-circle {text-align: center; position: relative; width: fit-content; margin-left: auto;} .button-circle a {display: inline-block;} .corcle-reletive-btn {min-height: 155px; top: -50px; } .all-crcl-animi-btn .full__add-hover { width: 100%; height: 100%; position: absolute; background-color: #ffffff1a; border-radius: 50%; pointer-events: none; transform: scale(0.52); transition: all ease .3s; backdrop-filter: blur(6px); } .circle.all-crcl-animi-btn {position: relative; width: var(--d-outer); height: var(--d-outer); border-radius: 50%; display: flex; justify-content: center; align-items: center; } .all-crcl-animi-btn .container-hover { overflow: hidden; position: absolute; width: 117%; height: 117%; border-radius: 50%; z-index: 1; border: 1px solid #FFF; } .all-crcl-animi-btn .text {position: absolute; width: 100%; height: 100%; display: flex; justify-content: center; border-radius:50%; color:#FFF; z-index:3; font-family: "Inter", sans-serif; font-weight: 400;} .all-crcl-animi-btn .text-div{ position: absolute; width: 100%; height: 100%; border-radius:50%; z-index:3; } .all-crcl-animi-btn .padding-text { width: 100%; height: 100%; transform: scale(0.6); border-radius: 50%; position: absolute; border: 2px solid #fff; z-index: 2; background: transparent; } .all-crcl-animi-btn .text span {position: absolute; font-size: 12px; text-align: center; transform-origin: 0 var(--radius); font-family: "Inter", sans-serif;} .button-circle a:hover .all-crcl-animi-btn .full__add-hover { transform: scale(1); background-color: var(--primary-color); } .all-crcl-animi-btn .border-img { width: 100%; height: 100%; border-radius: 50%; transform: scale(1.19); transform-origin: center; } .all-crcl-animi-btn .arrow-button { position: absolute; width: 50px; height: 50px; z-index: 3; display: block; } .button-circle a .circle-white-btn svg.arrow-button {filter: brightness(0) invert(1); } .button-circle.btn-hover .circle-white-btn svg.arrow-button { filter: unset; } .button-circle.btn-hover .all-crcl-animi-btn .text::after { top: 14px; right: 114px; } .button-circle.btn-hover .all-crcl-animi-btn .text::before { bottom: 14px; left: 114px; } .video-modal .modal-dialog { max-width: 1304px; width: 95%; } .btn-close { border: 1px solid var(--primary-color); position: absolute; right: 20px; top: 20px; width: 40px; height: 40px; border-radius: 50px; color: var(--primary-color); background: var(--tartiary); padding: 0; display: flex; align-items: center; justify-content: center; opacity: 1 !important; outline: none !important; box-shadow: none!important; z-index: 1; } .btn-close:hover{background: var(--primary-color);} .modal-open{padding-right: 0 !important;} .tx1, .tx2 { animation: rotateText 20s linear infinite; transform-origin: center center; display: inline-block; } @keyframes rotateText { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } /*========all circle animated button=====*/ .ezrah-logo img { margin-bottom: 12px; text-align: center; width: 400px; height: auto;} .ezrah-logo p { color: var(--white); font-style: italic; } .ezrah-logo { text-align: center; margin-bottom: 13px; } .progress-card { width: 100%; max-width: 600px; backdrop-filter: blur(10px); border-radius: 20px; padding: 16px 24px; border: 1px solid rgba(255, 255, 255, 0.1); background: linear-gradient(180deg, rgba(240, 77, 35, 0) 0%, rgba(240, 77, 35, 0.16) 100%); border: 1px solid #F04D2380; backdrop-filter: blur(50px) } .slider-container { position: relative; margin-bottom: 10px; z-index: 2;} .slider-container input#progressSlider { height: 24px !important; background: transparent; border: 0 !important; padding: 0 !important;} .range-slider { -webkit-appearance: none; width: 100%; height: 12px; border-radius: 10px; background: rgba(255, 255, 255, 0.2); outline: none; cursor: pointer; position: relative; pointer-events: none;} .range-slider::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 21px; height: 21px; cursor: pointer; position: relative; z-index: 10; top: -9px; background: url(../images/ball.svg) no-repeat; background-color: transparent; border: 0; box-shadow: none;} .range-slider::-moz-range-thumb { -webkit-appearance: none; appearance: none; width: 21px; height: 21px; cursor: pointer; position: relative; z-index: 10; top: -9px; background: url(../images/ball.svg) no-repeat; border: 0; box-shadow: none;} .range-slider::-webkit-slider-runnable-track { width: 100%; height: 6px; border-radius: 10px; background: linear-gradient(to right, #ffffff 0%, #ffffff var(--progress), rgba(255, 255, 255, 0.2) var(--progress), rgba(255, 255, 255, 0.2) 100%); } .range-slider::-moz-range-track { width: 100%; height: 6px; border-radius: 10px; background: rgba(255, 255, 255, 0.2); } .range-slider::-moz-range-progress { height: 6px; border-radius: 10px; background: linear-gradient(to right, #ffffff 0%, #ffffff var(--progress), rgba(255, 255, 255, 0.2) var(--progress), rgba(255, 255, 255, 0.2) 100%); } .home-range-wrap input[type="range"]::-webkit-slider-runnable-track{ width: 100%; height: 6px; border-radius: 10px; background: linear-gradient(to right, #ffffff 0%, #ffffff var(--progress), rgba(255, 255, 255, 0.2) var(--progress), rgba(255, 255, 255, 0.2) 100%); } /* Home page slider (div-based) */ .home-slider { min-height: 24px; } .home-slider .slider-track { position: absolute; top: 50%; left: 0; width: 100%; height: 6px; background: rgba(255, 255, 255, 0.2); border-radius: 10px; transform: translateY(-50%); } .home-slider .slider-fill { position: absolute; top: 50%; left: 0; height: 6px; background: #ffffff; border-radius: 10px; transform: translateY(-50%); } .home-slider .slider-ball { position: absolute; top: 50%; left: 0; width: 21px; height: 21px; background: url(../images/ball.svg) no-repeat center; background-size: contain; transform: translate(-50%, -50%); pointer-events: none; z-index: 1; } .football { position: absolute; width: 28px; height: 28px; background: linear-gradient(135deg, #ff6b6b 0%, #ff4444 100%); border-radius: 50%; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3); pointer-events: none; top: 50%; transform: translate(-50%, -50%); left: var(--thumb-position); transition: left 0.1s ease; } .football::before, .football::after { content: ''; position: absolute; background: white; border-radius: 2px; } .football::before { width: 14px; height: 2px; top: 50%; left: 50%; transform: translate(-50%, -50%); } .football::after { width: 2px; height: 14px; top: 50%; left: 50%; transform: translate(-50%, -50%); } .stats { display: flex; justify-content: space-between; align-items: flex-end; } .stat { display: flex; flex-direction: column; gap: 8px; } .progress-card .label {font-size: 18px; color: var(--white); font-weight: 500;} .amount { font-size: clamp(1.875rem, 1.071rem + 2.143vw, 3rem); font-weight: 600; color: var(--primary-color); line-height: 1; font-family: var(--primary-font); } .custom-checkbox .gchoice { width: 100% !important; } .consent-checkbox .ginput_container { display: flex; margin-bottom: 15px; } .consent-checkbox .ginput_container *{cursor: pointer;} /*===== Home page start ====*/ /* Footer Section */ footer { background: linear-gradient(180deg, #0D0F1C 0%, #2C111D 47.06%, #4B131F 93.49%); position: relative; } .top-footer { border-bottom: 1px solid rgb(255 255 255 / 10%); padding-bottom: 40px;} .bottom-footer { border-bottom: 1px solid #FFFFFF33; padding: 50px 0; } .bottom-footer h2 { color: rgb(255 255 255 / 20%); text-transform: uppercase; font-size: 7vw; margin-bottom: 0; } .bottom-footer h2 sub { font-size: 48%; bottom: 0; left: -34px; } footer .footer-logo { margin-bottom: 25px; position: relative; max-width: 130px; } footer .footer-logo-wraper lottie-player { max-width: 456px; margin: 0 auto; } footer .footer-logo-wraper img { max-width: 456px; margin: 0 auto; } .footer-contact ul { list-style: none; margin: 0; padding: 0; } .footer-contact ul li { display: flex; color: #FFFFFF; align-items: center; font-weight: 400; margin-bottom: 16px;} .footer-contact ul li span { display: flex; align-items: center; justify-content: center; border-radius: 50%; margin-right: 10px; flex: 0 0 auto; width: 24px; } /* .footer-contact ul li p { max-width: 260px; } */ .footer-contact ul li a { color: #AC8E97; font-weight: 400; font-size: 18px; background-image: linear-gradient(#cf303000 95%, #AC8E97 0, #AC8E97); background-position-y: bottom; background-repeat: no-repeat; background-size: 0 100%; text-decoration: none; transition: background-size .3s cubic-bezier(.79, .01, .22, .99) 0s, background-position 0s step-end .3s, color .3s; display: inline;} .footer-contact ul li a:hover{ background-position-x: right; background-position-y: bottom; background-size: 100% 100%; } .foot-email a { display: block; color: #9CBCFF; margin-top: 12px; background-image: linear-gradient(#cf303000 95%, #9CBCFF 0, #9CBCFF); background-position-y: bottom; background-repeat: no-repeat; background-size: 0 100%; text-decoration: none; transition: background-size .3s cubic-bezier(.79, .01, .22, .99) 0s, background-position 0s step-end .3s, color .3s; width: fit-content; } .foot-email a:hover { background-position-x: right; background-position-y: bottom; background-size: 100% 100%; } .foot-email label { color: #FFF; } footer .row .col-xl-4:nth-child(2) .footer-menu { margin-left: 30px; } .footer-menu h5 { font-weight: 700; color: var(--white); font-family: var(--secondary-font); margin-bottom: 21px; } .footer-menu p { max-width: 340px; } footer .row .col-xl-5:last-child p { max-width: 220px; } .footer-menu p span { color: #E4F9B6; font-weight: 400; } .footer-menu p span a { background-image: linear-gradient(#cf303000 95%, var(--primary-color) 0, var(--primary-color)); background-position-y: bottom; background-repeat: no-repeat; background-size: 0 100%; transition: background-size .3s cubic-bezier(.79, .01, .22, .99) 0s, background-position 0s step-end .3s, color .3s; color: var(--primary-color); } .footer-menu p span a:hover {background-position-y: bottom; background-size: 100% 100%; background-position-x: right;} .footer-menu p { color: var(--white); font-size: 12px; line-height: 1.9; } .footer-menu p a { margin-right: 8px; } .footer-menu p a img { filter: brightness(0) invert(1); } .support-menu p { font-size: 18px; line-height: 1.5;} .footer-menu h4 , .header-social h4 { font-weight: 600; color: var(--white); } .header-social { display: flex; align-items: center; } .header-social h4 { margin: 0 14px 0 0; } .header-social a { display: flex; height: 35px; width: 35px; align-items: center; justify-content: center; flex: 0 0 auto; padding: 5px; margin: 0 10px 0 0; position: relative; } .header-social a::after { content: ''; position: absolute; width: 100%; height: 100%; background: var(--primary-color); z-index: -1; border-radius: 46px; transform: scale(0); transition: all ease .3s;} .header-social a span { font-weight: 600; color: var(--white); background-image: linear-gradient(#cf303000 95%, #ffffff 0, #ffffff); background-position-y: bottom; background-repeat: no-repeat; background-size: 0% 100%; text-decoration: none; transition: background-size .3s cubic-bezier(.79, .01, .22, .99) 0s, background-position 0s step-end .3s, color .3s; } .header-social a:hover span {background-position-y: bottom; background-size: 100% 100%; background-position-x: right;} .header-social a:hover::after { transform: scale(1.1); } .header-social a svg { margin-left: 0; } .footer-menu p span strong { font-weight: 900; } footer .footer-menu ul { display: flex; list-style: none; justify-content: flex-start; padding: 0; flex-wrap: wrap; flex-direction: column; } footer .footer-menu.link-grid ul { flex-direction: row; } footer .footer-menu.link-grid ul li { width: 50%; } footer .footer-menu ul li:not(:last-child) {margin-bottom: 8px; } footer .footer-menu ul li:last-child{ border: none; padding-right: 0;} footer .footer-menu ul li:first-child{ padding-left: 0;} footer .footer-menu ul li a {position: relative; color: #AC8E97; font-weight: 400; font-size: 18px; letter-spacing: 1px; background-image: linear-gradient(#cf303000 95%, #AC8E97 0, #AC8E97); background-position-y: bottom; background-repeat: no-repeat; background-size: 0 100%; text-decoration: none; transition: background-size .3s cubic-bezier(.79, .01, .22, .99) 0s, background-position 0s step-end .3s, color .3s;} footer .footer-menu ul li a:hover { background-position-x: right; background-position-y: bottom; background-size: 100% 100%; } /* footer .footer-menu ul li a::before {content: ""; width: 0%; height: 2px; background-color: #7F8CA3; position: absolute; bottom: 0px; border-radius: 10px; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; } footer .footer-menu ul li a:hover::before{content: ""; width: 100%; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; } */ .end-footer { padding: 24px 0;} .end-footer p { color: #AC8E97; margin-bottom: 4px;} .end-footer p a { background-image: linear-gradient(#cf303000 95%, #AC8E97 0, #AC8E97); background-position-y: bottom; background-repeat: no-repeat; background-position-x: right; background-size: 0% 100%; transition: background-size .3s cubic-bezier(.79, .01, .22, .99) 0s, background-position 0s step-end .3s, color .3s; color: #AC8E97; } .end-footer p a:hover {background-position-y: bottom; background-size: 100% 100%; background-position-x: left;} .end-footer p:not(:first-child) a{background-size: 0% 100%; background-position-x: left; } .end-footer p:not(:first-child) a:hover{background-size: 100% 100%; background-position-x: right;} .end-footer .lft-box h6 { margin: 0; color: #AC8E97; font-weight: 300; margin-bottom: 5px; font-family: var(--secondary-font); } .lft-box p{font-size: 12px; } .right-box p { font-size: 16px; font-weight: 300; text-align: right; } .right-box p a { font-weight: 600; } .desk-hide{display: none;} /* Footer Section */ /*===== About page start ====*/ .inner-banner-content {padding: 155px 0 95px; position: relative; z-index: 1; } ol.breadcrumb { justify-content: center; } .inner-banner:before { position: absolute; content: ''; width: 100%; height: 100%; background: linear-gradient(180deg, #4B131F 0%, #1A0509 100%); top: 0; left: 0; right: 0; bottom: 0; /* opacity: .5; */ background: linear-gradient(180deg, rgba(75, 19, 31, 0.85) 0%, rgba(26, 5, 9, 0.85) 100%); } .inner-banner { background-size: cover; background-position: center; background-repeat: no-repeat; position: relative; z-index: 1; } .inner-banner-content h1 { color: var(--white); font-weight: 700; } .inner-banner-content .breadcrumb-item a { color: #DEC1CA; } .breadcrumb-item+.breadcrumb-item::before {color: #DEC1CA; content: ''; background: url(../images/breadcumb-arrow.svg) no-repeat; width: 10px; height: 24px; margin-top: 6px; position: absolute; left: 9px; top: 1px;} .breadcrumb-item.active { color: var(--primary-color); font-weight: 600; font-family: var(--primary-font); position: relative; padding-left: 44px;} .breadcrumb-item.active span { margin-left: 5px; } .breadcrumb-item { position: relative; } .breadcrumb-item+.breadcrumb-item { padding-left: 25px; } .about-img { position: relative; padding-bottom: 71.5%; overflow: hidden; border-radius: 30px; } .about-img img {position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; object-fit: cover; } .about-content{padding-left: 64px;} .about-content p strong { font-weight: 600; color: #4E2934; } .work-section { background: #FFF1ED; } .work-section:before { position: absolute; content: ''; width: 708px; height: 100%; background: #4B131F; right: 0; top: 0; z-index: -1; } .work-section:after{position: absolute; content: ''; background: url(../images/work-layer.png) no-repeat; background-size: cover; width: 708px; height: 100%; right: 0; top: 0; z-index: -1;} .work-img { position: relative; padding-bottom: 50%; overflow: hidden; border-top-left-radius: 30px; border-bottom-left-radius: 30px; } .work-img img { position: absolute; width: 100%; height: 100%; top: 0; bottom: 0; left: 0; right: 0; object-fit: cover; } .work-img { position: relative; padding-bottom: 71.5%; overflow: hidden; border-top-left-radius: 30px; border-bottom-left-radius: 30px; } .work-img img { position: absolute; width: 100%; height: 100%; top: 0; bottom: 0; left: 0; right: 0; object-fit: cover; } .work-content ul { padding: 0; list-style: none; } .work-content ul li span { color: #4E2934; font-weight: 600; } .work-content ul li { margin-bottom: 16px; padding-left: 32px; position: relative; max-width: 645px;} .work-content ul li:before {position: absolute; content: ''; background: url(../images/li-right-arrow.svg) no-repeat; width: 20px; height: 20px; left: 0; top: 5px;} .community-section .container {background: #FF663F url(../images/comm-layer.png) no-repeat; background-size: cover; background-position: center; border-radius: 30px;} .comm-img { position: relative; padding-bottom: 73.5%; border-top-right-radius: 30px; border-bottom-left-radius: 30px; overflow: hidden; margin-top: 100px;} .comm-img img { position: absolute; width: 100%; height: 100%; top: 0; bottom: 0; left: 0; right: 0; object-fit: cover; } .community-section .container .row .col-lg-6:first-child { padding-left: 0; } .comm-content * { color: var(--white); } .comm-content p strong { font-weight: 600; } .comm-content { max-width: 634px; padding-left: 70px; } .matter-section{background: #FFF1ED url(../images/matter-layer.svg) no-repeat; background-position: left bottom; position: relative; z-index: 1;} .matter-section:before { position: absolute; content: ''; width: 100%; height: 45px; background: var(--white); z-index: -1; } /*===== About page start ====*/ /*===== PLayer page start ====*/ .compassion-item { background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(240, 77, 35, 0.08) 100%); border: 1px solid #F04D2333; border-radius: 20px; padding: 30px; position: relative; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease;} .compassion-item:hover{box-shadow: 0px 8px 16px 0px #0000000D;} .compassion-item:before { position: absolute; content: ''; width: 6px; height: 60px; background: #4B131F; left: 0; border-top-right-radius: 10px; border-bottom-right-radius: 10px; } .compassion-wrap { margin-top: 0; margin-bottom: 40px; } .compassion-flex { display: flex; align-items: center; margin-bottom: 16px; } .compassion-flex span { width: 60px; height: 60px; border: 1px solid #D9D9D9; border-radius: 8px; display: flex; align-items: center; justify-content: center; margin-right: 16px; } .compassion-flex h4 { margin-bottom: 0; color: #4B131F; font-weight: 500; } .compassion-item h2 { font-weight: 600; color: var(--primary-color); margin-bottom: 0; } .player-search{max-width: 435px;} .player-search input { width: 100%; padding: 12px 20px; border: 1px solid #E0E0E0; border-radius: 10px; height: 50px !important; } .player-search input::placeholder { color: var(--accent) !important; opacity: 1; display: none; font-family: var(--secondary-font);} .player-search input::-ms-input-placeholder { color: var(--accent)!important; display: none; } .sorted-sec { margin-bottom: 30px; } .sort-sec ul { list-style: none; padding: 0; margin: 0; display: flex; align-items: center; } .sort-sec ul li h5 { color: #4B131F; font-weight: 500; margin-bottom: 0; } .sort-sec ul li:first-child { margin-right: 24px; } .sort-sec ul li:not(:last-child){margin-right: 12px;} .sort-sec ul li button { border: 1px solid #AC8E97; padding: 11px 24px; background: transparent; border-radius: 10px; color: #675B5E; position: relative; overflow: hidden;} .sort-sec ul li button:hover , .sort-sec ul li button.active { color: var(--white); } .sort-sec ul li button:before { position: absolute; content: ''; width: 100%; height: 0; bottom: 0; left: 0; right: 0; background: var(--tartiary); transition: all 0.3s ease 0s; z-index: -1; } .sort-sec ul li button:hover:before, .sort-sec ul li button.active:before { height: 100%; } .player-list { border: 2px solid #E8E8E8; border-radius: 20px; padding: 20px; margin-bottom: 24px; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; position: relative; z-index: 1;} .player-list:hover { box-shadow: 0px 8px 16px 0px #0000000D; border: 2px solid #F04D23; } .raiser-img { position: relative; padding-bottom: 100%; border-radius: 11px; overflow: hidden; } .raiser-img img { position: absolute; width: 100%; height: 100%; top: 0; bottom: 0; left: 0; right: 0; object-fit: cover; } .player-list h4 {color: #4B131F; font-weight: 500; text-align: center; margin-top: 16px; margin-bottom: 8px;} .player-list h4 a{color: #4B131F; font-weight: 500;} .player-list .logo-price { color: var(--primary-color); font-weight: 600; margin: 0; } .flag-badge { display: block; position: absolute; bottom: 10px; left: 10px; background: #FFE7E0; padding: 9px 12px; border-radius: 6px; display: flex; align-items: center; color: var(--primary-color); font-weight: 600; line-height: 1.06; font-size: 14px; } .flag-badge img { position: relative; width: 18px; margin: 0 6px 0 0; } .top-raiser-badge { position: absolute; top: 10px; right: 10px; background: var(--primary-color); padding: 7px 9px 6px; border-radius: 6px; display: flex; align-items: center; color: var(--white); font-weight: 600; line-height: 1.3; font-size: 16px; } .amount-raised { text-align: right; font-size: 18px; font-weight: 700; color: #ff5722; margin-bottom: 4px; font-family: var(--primary-font); } .slider-container { margin-bottom: 8px; position: relative; overflow: visible; min-height: 32px; } .nu-range-card .slider-container::after { position: absolute; content: ''; width: 100%; height: 8px; background-color: #b9b9b9 !important; border-radius: 100px; left: 0; top: 12px; z-index: -1; } .playerslider { width: 100%; height: 8px !important; border-radius: 100px !important; outline: none; -webkit-appearance: none; appearance: none; /*background-color: #b9b9b9 !important;*/ cursor: pointer; padding: 0 !important; border: none !important; pointer-events: none; z-index: 99; position: relative;} input[type="range"]::-webkit-slider-thumb, input[type="range"]::-webkit-slider-thumb:active {box-shadow: none !important; } .playerslider::-moz-range-thumb { -webkit-appearance: none; appearance: none; width: 23px; height: 23px; cursor: pointer; position: relative; z-index: 10; top: -9px; background: #FFF0 url(../images/ball1.svg) no-repeat; box-shadow: none; border: 0; background-size: 18px; background-position: right 1px center; transform: translateY(-1px);} .playerslider::-webkit-slider-runnable-track { width: 100%; height: 6px; border-radius: 30px; background: linear-gradient(to right, #ffffff 0%, #ffffff var(--progress), rgba(255, 255, 255, 0.2) var(--progress), rgba(255, 255, 255, 0.2) 100%); } .playerslider::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 21px; height: 21px; cursor: pointer; position: relative; z-index: 10; top: -9px; background: url(../images/ball1.svg) no-repeat; background-color: transparent; border: 0; box-shadow: none; background-size: contain; background-position: center;} .slider-fill { position: absolute; top: 12px; left: 0; height: 8px; background: #ff5722; border-radius: 6px; pointer-events: none; transition: width 0.1s ease; } .slider-ball { position: absolute; top: 16px; left: 0; width: 21px; height: 21px; background: url(../images/ball1.svg) no-repeat center; background-size: contain; transform: translate(-50%, -50%); pointer-events: none; z-index: 1; transition: left 0.1s ease; } /* Thumb positioning at edges */ .playerslider.thumb-end::-webkit-slider-thumb {transform: translateX(12px);} .playerslider.thumb-start::-webkit-slider-thumb {transform: translateX(-12px);} .playerslider.thumb-end::-moz-range-thumb {transform: translateX(12px) translateY(1px);} .playerslider.thumb-start::-moz-range-thumb {transform: translateX(-12px) translateY(1px);} .player-list .stat { align-items: center; flex-direction: row; gap: 5px; } .stat-number {font-size: 24px; font-weight: 600; color: #ff5722; font-family: var(--primary-font); } .stat-label {font-size: 18px; color: #675B5E; font-weight: 400; } /*===== PLayer page start ====*/ /*===== Team page start ====*/ .partner-logo { background: #FFF1ED; position: relative; padding-bottom: 100%; border-radius: 11px; overflow: hidden; } .partner-logo img { position: absolute; width: 100%; height: 100%; top: 0; bottom: 0; left: 0; right: 0; object-fit: contain; padding: 40px; } /*===== Team page start ====*/ /*===== Player Details page start ====*/ body:has(.single-details-section) header .bottom-header { background: var(--tartiary); top: 0; } body.error404 header .bottom-header { background: var(--tartiary); top: 0; } .fundraising-table { width: 100%; border-collapse: separate; border-spacing: 0; } .fundraising-table tr{box-shadow: 0px 0px 10px 0px #0000000F;} .fundraising-table tr td { padding: 17px 30px; } .fundraising-table tbody tr td:first-child { background: #4B131F; font-weight: 500; color: var(--white); text-align: center; } .fundraising-table tfoot tr td { background: var(--primary-color); text-align: center; color: var(--white); font-weight: 500; font-family: var(--primary-font); } .fundraising-table tr {box-shadow: 0px 0px 4px 0px #0000000F;} .fundraising-table tr td p { font-weight: 600; color: var(--primary-color); } .fundraising-table tr td:last-child p { font-weight: 400; } .fundraising-table tr td p span { margin-right: 10px; margin-top: 0; display: inline-block; max-width: 22px; } .fundraising-table tr td:last-child p span img { width: 18px; object-fit: contain; } .fundraising-table tr td p span img { width: 11px; } .player-details-img { position: relative; padding-bottom: 82%; margin: 20px;} .player-details-img img { position: absolute; width: 100%; height: 100%; top: 0; bottom: 0; left: 0; right: 0; object-fit: cover; overflow: hidden; border-radius: 10px; } .player-details-img:before { position: absolute; content: ''; width: calc(100% + 40px); height: calc(100% + 40px); border: 1px solid #E8E8E8; border-radius: 20px; top: -20px; left: -20px; /* bottom: -30px; */ right: 0; } .player-raised { border: 1px solid #F04D2333; background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(240, 77, 35, 0.08) 100%); border-radius: 20px; padding: 30px; display: flex; justify-content: space-between; align-items: center; position: relative;} .player-raised:before { position: absolute; content: ''; width: 6px; height: 60px; background: #4B131F; left: 0; border-top-right-radius: 10px; border-bottom-right-radius: 10px; } .player-raised h3 { margin-bottom: 0; color: var(--primary-color); font-weight: 600; } .player-raised h3 a{background-image: linear-gradient(#cf303000 95%, var(--tartiary) 0, var(--tartiary)); background-position-y: bottom; background-repeat: no-repeat; background-size: 0 100%; text-decoration: none; transition: background-size .3s cubic-bezier(.79, .01, .22, .99) 0s, background-position 0s step-end .3s, color .3s;} .player-raised h3 a:hover{ background-position-x: right; background-position-y: bottom; background-size: 100% 100%;} .fund-icon span { border: 1px solid #D9D9D9; width: 60px; height: 60px; display: flex; align-items: center; justify-content: center; border-radius: 8px; margin-right: 16px; } .fund-icon { display: flex; align-items: center; } .fund-icon:hover span img{animation: bouncing 0.5s 0.3s;} @keyframes bouncing { from, to { transform: scale(1, 1); } 25% { transform: scale(0.9, 1.1); } 50% { transform: scale(1.1, 0.9); } 75% { transform: scale(0.95, 1.05); } } .fund-icon h4 { color: #4B131F; font-weight: 500; margin-bottom: 0; } .player-fund { margin-top: 41px; } .player-raised:not(:last-child) { margin-bottom: 16px; } .player-details-content { margin-left: 66px; } .player-details-content p { margin-bottom: 16px; } .player-details-content h1 { color: #4B131F; font-weight: 700; margin-bottom: 15px; } .player-details-content h2 { margin-bottom: 24px; } .player-team { display: flex; align-items: flex-end; justify-content: space-between; border-radius: 20px; position: relative; padding: 0 15px 15px 30px; margin-bottom: 32px;} .player-team:before { position: absolute; content: ''; background: #FFF1ED; width: 100%; border-radius: 20px; height: 84px; z-index: -1; bottom: 0; left: 0; right: 0; bottom: 0; } .team-logo { box-shadow: 0px -4px 16px 0px #3D0D000F; background: var(--white); border-radius: 11px; padding: 20px; min-height: 118px; width: 100%; max-width: 201px; display: flex; align-items: center; justify-content: center; } .team-logo img { max-width: 100%; max-height: 80px; } .player-team h5 { color: var(--tartiary); font-weight: 500; margin-bottom: 0; } .player-team span { color: var(--primary-color); font-weight: 600; } .player-team-wrap { display: flex; align-items: flex-end; margin-bottom: 14px; gap: 4px; line-height: 1; } .flag-badge-player { background: #FFE7E0; padding: 9px 12px; border-radius: 6px; display: inline-flex; align-items: center; color: var(--primary-color); font-weight: 600; line-height: 1.06; font-size: 14px; margin-bottom: 16px; } .flag-badge-player img { position: relative; width: 18px; margin: 0 6px 0 0; } .donation-modal .modal-dialog{flex-direction: column; justify-content: center; max-width: 1416px;} .donation-modal .h1 { color: var(--white); } .donation-modal .modal-content { background: #FFF1ED; padding: 45px 50px; border-radius: 30px; } .donation-modal .modal-content .modal-body { padding: 0; } button.modal-close { position: absolute; background: #0101011A; width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; border-radius: 20px; right: 30px; top: 30px; z-index: 1; transition: all 0.4s; border: none; } button.modal-close i { display: flex; font-size: 12px; color: #010101; transition: all 0.4s; } button.modal-close:before { content: ''; width: 100%; height: 100%; position: absolute; border-radius: 50px; border: 1px solid #010101; transition: all 0.4s; z-index: -1; } button.modal-close:hover i { color: #FFF; } button.modal-close:hover:before { border: 15px solid var(--primary-color); } .amount-flex { display: flex; align-items: flex-start; border: 1px solid #E8E8E8; background: var(--white); padding: 20px; border-radius: 20px; } .amount-price {display: flex; align-items: center; margin-right: 40px;} .custom-control-input:checked + .custom-control-label .amount-flex { border: 1px solid var(--primary-color); box-shadow: 0px 8px 16px 0px #0000000D; } .custom-radio { width: 100%; } label.custom-control-label { width: 100%; } .custom-radio { width: 100%; margin-bottom: 16px;} label.custom-control-label { width: 100%; } .amount-price h3 { color: var(--primary-color); font-weight: 700; margin-bottom: 0; } .amount-price img { max-width: 20px; margin-right: 14px; } .amount-desc h5 { font-weight: 500; color: var(--tartiary); margin-bottom: 8px; } .amount-price img { opacity: .4; } .custom-control-input:checked + .custom-control-label .amount-flex .amount-price img { opacity: 1; } .dontation-form .donation-heading { color: var(--tartiary); font-weight: 700; margin-bottom: 24px; } label.form-label { color: #0D0F1C; font-family: var(--primary-font); font-weight: 600; font-size: clamp(1.125rem, 0.952rem + 0.462vw, 1.5rem); } .dontation-form .input-group-text { width: 52px; height: 52px; display: flex; align-items: center; justify-content: center; background: var(--primary-color); color: var(--white); font-size: 20px; border-radius: 0; } .dontation-form .input-group-suffix { border: 1px solid #F04D2333; backdrop-filter: blur(15px); padding: 4px; } .dontation-form .input-group .form-control {background: transparent !important; border: 1px solid #F04D2333 !important; border-radius: 0; padding: 17px 24px !important; height: 60px;} .select2-container {z-index: 99999999;} /*===== Player Details page start ====*/ /*===== Gallery page start ====*/ .champiom-item { box-shadow: 0px 8px 16px 0px #0000000D; border: 1px solid #E8E8E8; background: var(--white); padding: 20px; border-radius: 20px; height: calc(100% - 24px); margin-bottom: 24px; } .champiom-item figure { position: relative; border-radius: 10px; overflow: hidden; padding-bottom: 64.5%; } .champiom-item figure img { position: absolute; width: 100%; height: 100%; object-fit: cover; top: 0; bottom: 0; left: 0; right: 0; transition: transform .4s ease-in-out;} .champiom-item:hover figure img{ transform: scale(1.1) rotate(-3deg); } .champiom-item h4 { color: #4B131F; font-weight: 500; margin-bottom: 0; text-align: center;} .common-heading { margin-bottom: 32px; } .highlight-tab > ul > li { width: 25%; } .highlight-tab .nav { margin-bottom: 24px; } .highlight-tab ul li button { color: #AC8E97; text-align: center; width: 100%; padding: 16px; border-bottom: 1px solid #F04D231C; border-radius: 0 !important; transition: all .3s ease; font-weight: 500; } .highlight-tab ul li button span { margin-right: 5px; opacity: 0.4;} .highlight-tab > ul > li { text-align: center; } .highlight-tab ul li button.active , .highlight-tab ul li button:hover { background-color: transparent !important; border-bottom: 1px solid #F04D23; color: var(--primary-color) !important; } .highlight-tab ul li button.active { font-weight: 500; } .highlight-tab ul li button.active span{opacity: 1;} /* .picture-gallery { display: grid; grid-template-columns: repeat(5, 1fr); grid-template-rows: auto; gap:10px } */ .picture-item { position: relative; padding-bottom: 100%; overflow: hidden;} .picture-item img { position: absolute; width: 100%; height: 100%; top: 0; bottom: 0; left: 0; right: 0; object-fit: cover; transition: transform .4s ease-in-out} .picture-item:hover img { transform: scale(1.1) rotate(-3deg); } .video-container { position: relative; overflow: hidden; padding: 0 0 56.2%; border-radius: 10px; } .video-container > img { position: absolute; left: 0; right: 0; top: 0; bottom: 0; object-fit: cover; width: 100%; height: 100%; } .video-container .play-button { z-index: 1; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 0; border: none; background: transparent; width: 100px; height: 100px; backdrop-filter: blur(15px); border: 1px solid #FFFFFF; border-radius: 50%; } .video-container:before { position: absolute; content: ''; width: 100%; height: 100%; background: linear-gradient(180deg, rgba(75, 19, 31, 0.4) 0%, rgba(26, 5, 9, 0.4) 100%); z-index: 1; top: 0; bottom: 0; left: 0; right: 0; } /*===== Gallery page start ====*/ /*===== Join page start ====*/ /* .highlight-tab ul li { width: 20.7%; } */ div#gfield_consent_description_2_59 {background: #f04d2314;border: 1px solid #F04D2333 !important;padding: 16px !important;color: var(--tartiary);} /*===== Join page start ====*/ /*===== Sponsors page start ====*/ .opportunities-list { border: 1px solid #E8E8E8; border-radius: 20px; position: relative; height: calc(100% - 24px); margin-bottom: 24px; display: flex; flex-direction: column; overflow: hidden; } .opportunity-image { position: relative; padding-bottom: 72.7%; margin-bottom: 24px; } .opportunity-image img { position: absolute; width: 100%; height: 100%; inset: 0; border-radius: 20px; object-fit: cover; } .opportunities-list h4 { font-weight: 500; color: var(--tartiary); padding-bottom: 16px; position: relative; } .opportunities-list h4:after { position: absolute; content: ''; width: 100%; height: 1px; background: #CECECD; bottom: 0; left: 0; } .opportunities-list ul { list-style: none; padding: 0; margin: 0; } .opportunities-list ul li { padding-left: 32px; position: relative; } .opportunities-list ul li:not(:last-child) { margin-bottom: 12px; } .opportunities-list ul li:before {position: absolute; content: ''; background: url(../images/circle-right.svg) no-repeat; width: 18px; height: 18px; left: 0; top: 7px; } .opportunity-label {position: absolute; top: 20px; left: 20px; background: var(--primary-color); border-radius: 16px 0; padding: 6px 20px 10px; color: var(--white); font-weight: 700; font-family: var(--primary-font); font-size: clamp(1.25rem, 0.904rem + 0.923vw, 2rem); line-height: 1.3; margin-bottom: 16px; width: fit-content; z-index: 2;} .opportunity-label span { font-size: 15px; display: block; font-weight: 400; font-family: var(--secondary-font); margin-top: 6px; } .opportunity-label sub { bottom: 0; } .opportunities-list .btn { margin-top: auto; } .sponsor-button-wrapper { margin-top: auto; border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; display: flex; align-items: center; justify-content: space-between;} .sponsor-opportunity-content { padding: 20px; } .sponsor-select-btn { border-bottom-right-radius: 20px; border-bottom-left-radius: 20px; padding: 22px 22px; } .sponsor-button-text { font-size: 18px; line-height: 1.2; padding-left: 64px; display: block; text-align: left; transition: all 0.3s ease-in-out; text-transform: capitalize; text-decoration: none; color: var(--primary-color); font-weight: 500; position: relative; } .sponsor-button-text:before { content: " "; width: 30px; height: 2px; background: var(--primary-color); top: 50%; left: 1.1em; position: absolute; transform: translateY(-50%); transform-origin: center; transition: all 0.3s linear; } .sponsor-select-btn:hover .sponsor-button-text { color: var(--white); } .sponsor-select-btn:hover .sponsor-button-text::before {background: var(--white); left: 2em; width: 0.9375rem; } .sponsor-button-wrapper .sponsor-select-btn:before { position: absolute; content: ''; width: 64px; height: 100%; background: var(--primary-color); right: 0; top: 0; z-index: -1; transition: all.3s ease; } .sponsor-button-wrapper .sponsor-select-btn:hover:before { width: 100%; } .sponsor-button-wrapper { margin-top: auto; border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; } .sponsor-button-wrapper .sponsor-select-btn:hover{background: transparent !important;} .sponsor-button-wrapper .sponsor-select-btn { padding: 0px; background: #FFF1ED; display: flex; align-items: center; justify-content: space-between; width: 100%;} .sponsor-select-btn .sponsor-button-icon{ border-bottom-right-radius: 20px; padding: 25px 23px; display: flex; align-items: center; justify-content: space-between; } .sponsor-select-btn:hover img{ animation: shakeicon .5s linear ; } @keyframes shakeicon { 0% { transform: translateX(0px); } 50% { transform: translateX(6px); } 100% { transform: translateX(0px); } } /*===== Sponsors page start ====*/ /*===== Donate page start ====*/ .join-tab { padding: 45px 50px; border-radius: 30px; } .gsection { margin-top: 16px; } .gform-body .gsection:first-child { margin-top: 0; } .gform_title{ display: none;} .gchoice { width: calc(33.3% - 11px); } .radio-amounts .gfield_radio { display: flex; flex-wrap: wrap; gap: 16px; justify-content: space-between; } .gchoice label { max-width: 100% !important; display: flex !important;} .radio-amounts .gchoice > label { color: var(--primary-color); font-weight: 600; font-size: clamp(1.25rem, 1.135rem + 0.308vw, 1.5rem) !important; font-family: var(--primary-font); line-height: 1; height: 100%; height: 100%;} .field_description_below { border-bottom: 0 !important;} .gsection_title { font-weight: 700; color: var(--tartiary); margin-bottom: 0; } .donate-field label { font-weight: 600 !important; color: var(--black); margin-bottom: 0 !important; } .gform-footer{margin-top: 30px !important; justify-content: space-between; overflow: hidden; position: relative; z-index: 0; transition: all .4s ease; -webkit-transition: all .4s ease; -moz-transition: all .4s ease; -ms-transition: all .4s ease; -o-transition: all .4s ease; display: inline-flex; align-items: center; vertical-align: top; color: var(--white) !important; padding: 0; font-size: clamp(0.938rem, 0.915rem + 0.071vw, 1rem); line-height: 1; text-transform: capitalize; height: 56px; border-radius: 0; font-weight: 500; border: none; width: max-content; max-width: fit-content; text-align: center; border: 2px solid var(--primary-color); text-shadow: none; } .gform-footer::before{ width: 100%; height: 100%; content: ""; position: absolute; right: 0; top: 0; background-color: var(--primary-color); z-index: -1; transition: all .4s ease; -webkit-transition: all .4s ease; -moz-transition: all .4s ease; -ms-transition: all .4s ease; -o-transition: all .4s ease;} .gform-footer:hover{transform: translate(0px, 0px); transition: all .8s ease; -webkit-transition: all .8s ease; -moz-transition: all .8s ease; -ms-transition: all .8s ease; -o-transition: all .8s ease; color: var(--primary-color) !important; border: 2px solid var(--primary-color); text-shadow: none; } .gform-footer:hover::before{width: 0%; transition: all .8s ease; -webkit-transition: all .8s ease; -moz-transition: all .8s ease; -ms-transition: all .8s ease; -o-transition: all .8s ease; } .gform-footer input[type="submit"] {padding: 16px 24px; margin: 0 !important; width: 100%; border: none; font-size: clamp(1.125rem, 1.096rem + 0.128vw, 1.25rem) !important; font-weight: 500; color: #FFF !important; z-index: 1;align-self: inherit !important; } .gform-footer:hover input[type="submit"]{color: var(--primary-color) !important;} .gform_wrapper.gravity-theme .gfield_validation_message, .gform_wrapper.gravity-theme .validation_message { background: transparent !important; border: 0 !important;} .gform_wrapper.gravity-theme .gfield_validation_message, .gform_wrapper.gravity-theme .validation_message{margin-top: -20px; padding: 0 !important; margin-block-start: 0px !important;} .gform_wrapper.gravity-theme .gfield_description{font-size: 12px;} .gform_wrapper.gravity-theme .gform-loader{flex-shrink: 0;} .amount-field.field_description_below { display: flex; align-items: stretch; justify-content: center; overflow: hidden !important; border: 1px solid #F04D2333 !important; } .gform_wrapper.gravity-theme .amount-field label.gfield_label { margin: 0 !important; width: 287px; text-align: center; background: var(--primary-color); color: #FFF !important; display: flex !important; align-items: center; justify-content: center; border-radius: 0; font-weight: 400 !important; border: 4px solid #fff1ed; font-size: 16px !important; font-family: var(--secondary-font); } .amount-field .ginput_container_total { background: transparent; color: #A3233B !important; border-radius: 0; width: 100%; border-left: 1px solid #F04D2333; } .payment-field .gfield-image-choice-wrapper-outer { display: flex !important; justify-content: center; align-items: center; } .payment-field .gfield-image-choice-wrapper-outer * {cursor: pointer;} .payment-field .gfield-image-choice-wrapper-outer .gfield-choice-image-wrapper { flex: 0 0 auto; width: 18px; } .payment-field .gfield-image-choice-wrapper-inner input { display: none !important; } .payment-field .gfield-image-choice-wrapper-outer .gfield-choice-image-wrapper img { width: 16px; } .payment-field .gfield-image-choice-wrapper-inner label { color: #AC8E97; font-size: 18px !important; line-height: 1.2; font-weight: 500; transition: all .5s; } .payment-field span.gfield-image-choice-wrapper-inner { margin-left: 8px; } .payment-field .gchoice { border-bottom: 1px solid #F04D231C; padding: 8px 0 16px; transition: all .4s ease; cursor: pointer;} .payment-field .gfield_radio { gap: 0 !important; } .payment-field .gfield-image-choice-image-wrapper input[type="radio"]:checked + label { color: red !important; } .payment-field .gchoice .gfield-image-choice-wrapper-inner input[type="radio"]:checked + label {color: var(--primary-color); font-weight: 500;} .payment-field .ginput_container_image_choice .gchoice:where(:has(input:checked)) { border-bottom: 1px solid var(--primary-color); } .payment-field .gchoice:hover .gfield-image-choice-wrapper-inner input[type="radio"] + label { color: var(--primary-color); font-weight: 500;} .payment-field .gchoice:hover { border-bottom: 1px solid var(--primary-color); } .payment-field .ginput_container_image_choice .gchoice:where(:has(input:checked))::after{display: none !important} .gform_wrapper.gravity-theme .gfield_label { font-size: clamp(1.25rem, 1.135rem + 0.308vw, 1.5rem) !important; font-weight: 600 !important; margin-bottom: 16px !important; padding: 0 !important; font-family: var(--primary-font); color: var(--secondary-color); } .gform_wrapper.gravity-theme .gfield_required { font-size: 0 !important; } .gform_wrapper.gravity-theme .ginput_total { color: #A19194 !important; } .gform_wrapper.gravity-theme .ginput_container_image_choice .gfield-choice-image-wrapper { margin-bottom: 0 !important; } .gform_wrapper.gravity-theme .ginput_container_address span, .gform_wrapper.gravity-theme .ginput_full:not(:last-of-type) { margin-bottom: 24px !important; } .gform_wrapper.gravity-theme .ginput_container_address span select { height: 56px !important; } label.p-FieldLabel.Label { display: none !important; } .gform_confirmation_message{color: var(--tartiary) !important;} .gform_wrapper.gravity-theme .gform-loader { left: -5px; } .custom-checkbox { padding-bottom: 8px !important; } .custom-checkbox label { font-size: clamp(0.875rem, 0.76rem + 0.308vw, 1.125rem) !important; margin-bottom: 0 !important; } .custom-checkbox .gchoice.gchoice_1_12_1 { margin-bottom: 8px; } .custom-checkbox .gfield_checkbox > div { display: flex; cursor: pointer;} .custom-checkbox .gchoice * { cursor: pointer; } .custom-donation { margin-top: 24px; } .custom-donation .ginput_container_product_price { position: relative; } .custom-donation .ginput_container_product_price::before { content: ''; position: absolute; width: 52px; background: var(--primary-color) url(../images/hugeicons_dollar-01.svg); border: 2px solid #fff1ed; left: 2px; top: 2px; bottom: 2px; background-size: 26px; background-position: center; background-repeat: no-repeat; } .custom-donation .ginput_container_product_price input { padding-left: 66px !important; } .custom-donation .ginput_container_product_price::after { content: ''; position: absolute; top: 0; bottom: 0; left: 56px; width: 1px; background-color: #F04D2333; } /* .custom-checkbox .gfield_checkbox > div input { margin-right: 8px; margin-top: 4px !important; } */ /*===== Donate page start ====*/ /*================ New ================*/ .login-section { min-height: 100dvh; background-repeat: no-repeat; background-size: cover; background-position: center; position: relative; z-index: 1; } .login-section:after { position: absolute; content: ''; width: 100%; height: 100%; background: linear-gradient(180deg, #4B131F 0%, #0D0F1C 93.49%); opacity: .85; top: 0; bottom: 0; left: 0; right: 0; z-index: -1; } .login-section .login-content { min-height: 100vh; padding: 170px 0px 100px; display: flex; flex-direction: column; align-items: center; justify-content: center; } .login-section .login-content h1 { font-weight: 600; color: var(--white); margin: 0 0 30px; } .form-box { padding: 45px 40px; background: #FFF1ED; border-radius: 20px; width: 100%; max-width: 696px; } .form-box h3 { color: var(--tartiary); font-weight: 700; font-size: clamp(1.25rem, 0.904rem + 0.923vw, 2rem)} .form-box .form-floating:has(.form-icon) input.form-control { padding-right: 50px !important; } /* .btn.submit-btn { background: var(--primary-color); padding: 16px 24px; line-height: 1.4; } .btn.submit-btn:hover { background: #FFF1ED; border: 1px solid var(--primary-color); padding: 16px 24px; line-height: 1.4; } .btn.submit-btn::after { display: none; } .btn.submit-btn::before { display: none; } */ .btn.submit-btn { justify-content: space-between; overflow: hidden; position: relative; z-index: 0; transition: all .4s ease; -webkit-transition: all .4s ease; -moz-transition: all .4s ease; -ms-transition: all .4s ease; -o-transition: all .4s ease; display: inline-flex; align-items: center; vertical-align: top; color: var(--white) !important; padding: 16px 24px; font-size: clamp(0.938rem, 0.915rem + 0.071vw, 1rem); line-height: 1; text-transform: capitalize; height: 56px; border-radius: 0; font-weight: 500; border: none; max-width: 100%; text-align: center; border: 2px solid var(--primary-color); text-shadow: none; width: 100%; justify-content: center; background: transparent !important; } .btn.submit-btn::before { width: 100%; height: 100%; content: ""; position: absolute; right: 0; top: 0; background-color: var(--primary-color); z-index: -1; transition: all .4s ease; -webkit-transition: all .4s ease; -moz-transition: all .4s ease; -ms-transition: all .4s ease; -o-transition: all .4s ease; } .btn.submit-btn:hover { transform: translate(0px, 0px); transition: all .8s ease; -webkit-transition: all .8s ease; -moz-transition: all .8s ease; -ms-transition: all .8s ease; -o-transition: all .8s ease; color: var(--primary-color) !important; border: 2px solid var(--primary-color); text-shadow: none; } .btn.submit-btn:hover::before { width: 0%; transition: all .8s ease; -webkit-transition: all .8s ease; -moz-transition: all .8s ease; -ms-transition: all .8s ease; -o-transition: all .8s ease; } .login-logo { max-width: 106px; margin-bottom: 24px; } .login-logo img { width: 100%; } .show-pass { font-size: 24px; color: #AC8E97; position: absolute; right: 20px; top: 16px; max-width: 24px; height: 24px; cursor: pointer; } .show-pass img { width: 100%; height: 100%; object-fit: contain; } a.a-link { color: var(--primary-color); background-image: linear-gradient(#cf303000 95%, var(--primary-color) 0, var(--primary-color)); background-position-y: bottom; background-repeat: no-repeat; background-position-x: right; background-size: 100% 100%; transition: background-size .3s cubic-bezier(.79, .01, .22, .99) 0s, background-position 0s step-end .3s, color .3s; } a.a-link:hover { color: var(--primary-color); background-size: 0% 100%; background-position: left; } /*================ New ================*/ .error-page { height: 80vh; display: flex; align-items: center; justify-content: center; } .gform_confirmation_message { text-align: center; color: #095a00; font-family: var(--primary-font); font-size: clamp(1.25rem, 1.135rem + 0.308vw, 1.5rem); } .gform_wrapper .radio-amounts .gfield_radio input[type="radio"]{ position:absolute; opacity:0; pointer-events:none; } .gform_wrapper .radio-amounts .gfield_radio label{ position:relative; padding-left:48px; display:block; } .gform_wrapper .radio-amounts .gfield_radio label:before { content: ""; position: absolute; top: 24px; left: 20px; width: 20px; height: 20px; background-image: url(/wp-content/uploads/2025/11/ball1.svg); background-size: contain; background-repeat: no-repeat; transition: opacity .25s ease; opacity: .4; } .gform_wrapper .radio-amounts .gfield_radio input[type="radio"]:checked + label:before{background-image:url(/wp-content/uploads/2025/11/ball1.svg);opacity:1} .gform_wrapper .radio-amounts .gfield_radio li{margin:0 0 16px} .gform_wrapper .radio-amounts .gfield_radio input[type="radio"]{position:absolute;opacity:0} .gform_wrapper .radio-amounts .gfield_radio label{display:block;border-radius:20px;border: 1px solid #E8E8E8; padding:20px 20px 20px 50px;background:#fff;cursor:pointer;transition:all .25s ease} .gform_wrapper.gravity-theme .gform_validation_errors { margin-bottom: 20px !important; } .tier-extra { font-weight: 400; min-width: 240px; margin: 0 0 0 auto; } .tier-title{font-size:18px;font-weight:500;color:#4d1d1d; font-family: var(--primary-font); margin-bottom: 8px;} .tier-desc { font-size: clamp(0.938rem, 0.851rem + 0.231vw, 1.125rem); color: var(--accent); line-height: 1.35; font-family: var(--secondary-font); } .gform_wrapper .radio-amounts .gfield_radio input[type="radio"]:checked + label {border-color:#f04d23; -webkit-box-shadow: 0px 8px 16px 0px #0000000D; box-shadow: 0px 8px 16px 0px #0000000D;} @media (hover: hover) { .gform_wrapper .radio-amounts label:hover {border-color:#f04d23; -webkit-box-shadow: 0px 8px 16px 0px #0000000D; box-shadow: 0px 8px 16px 0px #0000000D;} .gform_wrapper .radio-amounts .gfield_radio label:hover{cursor:pointer;opacity:.95} } .gform_wrapper .radio-amounts .gfield_radio input[type="radio"]{scroll-margin:0!important} .gform_wrapper.gravity-theme .gfield-choice-input{top:auto !important} .gform_wrapper.gravity-theme .ginput_container_date { position: relative; } .gform_wrapper.gravity-theme .ginput_container_date input { width: 100% !important; } .gform_wrapper.gravity-theme .ginput_container_date img.ui-datepicker-trigger { position: absolute; right: 18px; margin: 0 !important; } .gform_wrapper.gravity-theme .gform_validation_errors>h2 .gform-icon{font-size: 0 !important;} .gform_wrapper.gravity-theme .gform_validation_errors{ margin-bottom: 20px !important; margin-top: 50px !important; padding-inline-start: 8px !important;} .fund-player-picker { margin-top: 0; } .fund-player-search{ width:100%; padding:8px 10px; border-radius:0; border:1px solid #F04D2333; font-size:14px; } .fund-player-results{margin-top:0} .fund-player-results-list{list-style:none;margin:0;padding:0;border:1px solid #eee;border-radius:4px;max-height:220px;overflow-y:auto} .fund-player-results-list li + li{border-top:1px solid #f3f3f3} .fund-player-result{width:100%;text-align:left;padding:6px 10px;background:#fff;border:0;cursor:pointer;font-size:14px;color: black;} .fund-player-result:hover{background:#f5f5f5} .fund-player-no-results{margin-top:4px;font-size:13px;color:#777} .fund-player-selected{margin-top:8px;font-size:14px} .fund-player-selected:empty{margin-top: 0;} .fund-player-selected-label{font-weight:600;margin-bottom:4px} .fund-player-selected-list{display:flex;flex-wrap:wrap;gap:6px} .fund-player-chip { display: inline-flex; align-items: center; gap: 4px; padding: 4px 8px; border-radius: 5px; background: #f04d23; border: 1px solid #f04d23; color: #FFF; } .fund-chip-name{white-space:nowrap} .fund-chip-remove { border: none; background: transparent; padding: 0; font-size: 15px; line-height: 1; cursor: pointer; color: #FFF; } .fund-player-chip-remove { border: none; background: transparent; padding: 0; font-size: 15px; line-height: 1; cursor: pointer; color: #FFF; } .text-info-ss { background: #f04d2314; border: 1px solid #F04D2333 !important; padding: 16px; font-size: 16px; color: var(--tartiary); } .tier-redio .gfield_radio { display: flex; width: calc(50% + 24px); justify-content: space-between; } .tier-redio .gfield_radio .gchoice { width: calc(50% - 12px); display: flex; align-items: center; } .tier-redio .gfield_radio .gchoice label { color: var(--tartiary); font-size: 16px; line-height: 1; border: 1px solid #F04D2333; padding: 12px 20px 12px 35px; height: 56px; position: relative; line-height: 56px; align-items: center; cursor: pointer; flex-direction: row; width: 100%;} .tier-redio .gfield_radio .gchoice input { display: none; } .tier-redio .gfield_radio .gchoice input:checked + label:before, .tier-redio .gfield_radio .gchoice input:not(:checked) + label:before { content: ''; position: absolute; left: 8px; top: 15px; width: 22px; height: 22px; border: 2px solid #A19194; border-radius: 100%; } .tier-redio .gfield_radio .gchoice [type="radio"]:checked + label:after, .tier-redio .gfield_radio .gchoice [type="radio"]:not(:checked) + label:after { content: ''; width: 12px; height: 12px; background: var(--primary-color); position: absolute; top: 20px; left: 13px; border-radius: 100%; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; } .tier-redio .gfield_radio .gchoice [type="radio"]:not(:checked) + label:after { opacity: 0; -webkit-transform: scale(0); transform: scale(0); } input[type="radio"] { width: 22px !important; height: 22px !important; flex: 0 0 auto; margin: 0 10px 0 0; padding: 0 !important; background: transparent !important; background-repeat: no-repeat; background-position: center; background-size: contain; border: 2px solid #A19194; -webkit-appearance: none; -moz-appearance: none; appearance: none; -webkit-print-color-adjust: exact; color-adjust: exact; border-radius: 50px; } input:checked[type=radio] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Ccircle cx='6' cy='6' r='6' fill='%23F04D23'/%3E%3C/svg%3E") !important; background-size: 12px !important; background-repeat: no-repeat !important; background-position: center !important; } input:checked { border-color: var(--primary-color); } .field_sublabel_above .gfield_description { margin: 0 !important; padding: 0 !important; font-size: 14px !important; color: var(--tartiary); } /* Hide until JS decides otherwise */ .community-load-more{display:none !important;} .community-load-more.is-visible{display:inline-flex !important;} /* -------------------------- Shared shimmer animation -------------------------- */ @keyframes skeleton-shimmer{0%{background-position:-200% 0;}100%{background-position:200% 0;}} /* Base shimmer block used everywhere */ .skeleton-block{display:block;border-radius:4px;background:linear-gradient(90deg,#ececec 0%,#f5f5f5 50%,#ececec 100%);background-size:200% 100%;animation:skeleton-shimmer 1.2s ease-in-out infinite;color:transparent;} /* Size helpers for blocks inside skeleton cards */ .skeleton-logo{height:60px;width:100%;margin-bottom:10px;} .skeleton-img{height:180px;width:100%;margin-bottom:10px;} .skeleton-line{height:14px;width:70%;margin:5px 0;} .skeleton-slider{height:8px;width:100%;margin:10px 0;} .skeleton-stat{height:12px;width:50%;margin:4px 0;} /* -------------------------- Donor skeleton card (.community-item.skeleton) -------------------------- */ .community-item.skeleton{position:relative;min-height:180px;border-radius:12px;} .community-item.skeleton .donor-price h4{height:20px;width:40%;} .community-item.skeleton .comm-name span{height:40px;width:40px;border-radius:50%;} .community-item.skeleton .comm-name h4{height:18px;width:70%;margin-top:10px;} .community-item.skeleton p{height:40px;margin-top:12px;} /* -------------------------- Team skeleton card (.player-list.skeleton) -------------------------- */ .player-list.skeleton .partner-logo .skeleton-logo{height:60px;width:60%;margin:0 auto 12px;} .player-list.skeleton h4 .skeleton-line{height:18px;width:70%;margin:6px auto;} .player-list.skeleton .logo-price .skeleton-line{height:18px;width:50%;margin:6px auto 0;} /* ================================ PLAYER CARD SKELETON (archive + team tax) ================================ */ .player-list.nu-range-card.skeleton{border-radius:12px;overflow:hidden;background:linear-gradient(90deg,#ececec 0%,#f5f5f5 50%,#ececec 100%);background-size:200% 100%;animation:skeleton-shimmer 1.2s ease-in-out infinite;} .player-list.nu-range-card.skeleton .raiser-img{height:180px;margin-bottom:15px;border-radius:12px 12px 0 0;background:linear-gradient(90deg,#ececec 0%,#f5f5f5 50%,#ececec 100%);background-size:200% 100%;animation:skeleton-shimmer 1.2s ease-in-out infinite;} .player-list.nu-range-card.skeleton h4{height:20px;margin-bottom:10px;border-radius:4px;color:transparent;background:linear-gradient(90deg,#ececec 0%,#f5f5f5 50%,#ececec 100%);background-size:200% 100%;animation:skeleton-shimmer 1.2s ease-in-out infinite;} .player-list.nu-range-card.skeleton .amount-raised{height:20px;width:60%;margin-bottom:15px;border-radius:4px;color:transparent;background:linear-gradient(90deg,#ececec 0%,#f5f5f5 50%,#ececec 100%);background-size:200% 100%;animation:skeleton-shimmer 1.2s ease-in-out infinite;} .player-list.nu-range-card.skeleton .slider-container{height:8px;margin-bottom:15px;border-radius:999px;background:linear-gradient(90deg,#ececec 0%,#f5f5f5 50%,#ececec 100%);background-size:200% 100%;animation:skeleton-shimmer 1.2s ease-in-out infinite;} .player-list.nu-range-card.skeleton .stats .stat-number{display:inline-block;height:14px;margin-bottom:6px;border-radius:4px;color:transparent;background:linear-gradient(90deg,#ececec 0%,#f5f5f5 50%,#ececec 100%);background-size:200% 100%;animation:skeleton-shimmer 1.2s ease-in-out infinite;} .player-list.nu-range-card.skeleton .stats .stat-label{display:inline-block;height:14px;margin-bottom:6px;border-radius:4px;color:transparent;background:linear-gradient(90deg,#ececec 0%,#f5f5f5 50%,#ececec 100%);background-size:200% 100%;animation:skeleton-shimmer 1.2s ease-in-out infinite;} /* Optional: tweak layout of skeleton columns */ .player-skeleton-col{margin-bottom:30px;} /* Join form */ .join-tab-btns .gfield_radio { display: flex; align-items: center; } .join-tab-btns .gfield_radio .gchoice { width: 100%; max-width: max-content; display: flex; align-items: center; } .join-tab-btns .gfield_radio .gchoice input { height: auto !important; display: none; } .join-tab-btns .gfield_radio .gchoice label { justify-content: center; border-bottom: 1px solid #F04D231C; padding: 0px 20px 16px; line-height: 1; color: #AC8E97; font-size: clamp(1rem, 0.942rem + 0.154vw, 1.125rem) !important; position: relative; flex-direction: row; cursor: pointer;} .join-tab-btns .gfield_radio .gchoice label::before { content: ""; position: relative; top: 0; left: 0; width: 18px; height: 18px; background-image: url(/wp-content/uploads/2025/11/ball1.svg); background-size: contain; background-repeat: no-repeat; transition: opacity .25s ease; opacity: .3; margin: 0 8px 0 0; } .join-tab-btns .gfield_radio .gchoice:has(input:checked) label { border-bottom: 1px solid var(--primary-color); color: var(--primary-color); } .join-tab-btns .gfield_radio .gchoice:has(input:checked) label::before { opacity: 1; } .gform_wrapper.gravity-theme .gfield input, .gform_wrapper.gravity-theme .gfield select { max-width: 100%; width: 100%; } /* Join form */ .swal2-actions { gap: 16px;} .donation-modal .gform_wrapper { display: block !important;} /*.donation-modal .gform_wrapper div#field_1_4 {display: none ;} */ .donation-modal div#gform_confirmation_wrapper_1 { padding: 40px;} .dashicons-visibility::before { content: "\e725" !important; font-family: uicons-regular-rounded !important; color: #AC8E97; } .dashicons-hidden::before {content: "\e728" !important; font-family: uicons-regular-rounded !important; color: #AC8E97;} span.password_input_container input { padding: 16px 36px 16px 20px!important; } /*================Contact page ================*/ .contact-wrapper{position: relative; overflow: hidden;} .contact-wrapper::before{position: absolute; content: ''; background: #FFF1ED url(../images/touch-abstract.svg) no-repeat; background-size: cover; height: 100%; right: 0; top:0; width:37%; z-index: -1;} .contact-form { box-shadow: 0px 10px 30px 0px #0000000F; background: var(--white); padding: 40px; border-radius: 30px; margin-left: 66px; } .contact-form h3 { color: var(--tartiary); font-weight: 700; } .contact-form form .form-group { margin-bottom: 24px; } .contact-form form textarea { min-height: 92px; } .gform_fields { grid-row-gap: 24px !important; } /*================ Contact page ================*/ /*Media Query css*/ @media only screen and ( min-width:1601px ) { .container { max-width: 1440px !important;} } /* @media only screen and ( min-width:1700px ) { .container { max-width: 1524px !important;} } */ @media only screen and ( max-width:1799px ) { .main-menu ul li.menu-item-has-children a:after{top: 39%;} /*===== Home page start ====*/ .attorney-slider-wrapper .slider-arrow .swiper-button-prev{ left: -38px; transform: rotate(180deg); } .attorney-slider-wrapper .slider-arrow .swiper-button-next { right: -38px; } .comm-content{padding-left: 40px;} /* .slider-fill{top: 10px;} */ .stat-number { font-size: 18px;} /*===== Home page start ====*/ .gchoice label{flex-direction: column;} .tier-extra{margin: 13px 0 0;} } @media only screen and ( max-width:1599px ) { .work-section:after , .work-section:before{width: 608px;} .player-details-content { margin-left: 16px; } .team-logo { min-height: 108px; max-width: 180px; } .team-logo img { max-width: 100%; max-height: 70px; } .video-btn{margin-top: 40px; margin-bottom: 56px;} .amount { font-size: 34px;} .opportunities-list ul li:before{top: 6px;} } @media only screen and ( max-width:1399px ) { .fancy{padding: 14px 20px;} .fancy .text { font-size: 16px; } .main-menu ul li:not(:last-child) { margin-right: 26px; } .main-header .manu-part .main-menu { margin-right: 30px; } .main-menu ul li a{font-size: 16px;} .fancy .text::before{width: 24px;} .community-tab .community-item{padding: 30px 24px;} footer .footer-menu ul li a{font-size: 16px;} .sort-sec ul li button{font-size: 14px; padding: 11px 17px;} .stat-number { font-size: 17px; } .stat-label { font-size: 13px;} .highlight-tab ul li button{font-size: 16px;} .amount { font-size: 30px; } :root { --radius: 70px; } .ezrah-logo img{width: 260px;} } @media only screen and ( max-width:1299px ) { h2 { font-size: 40px;} .time-info{padding: 15px; width: 116px; height: 116px;} .team-text{padding: 35px 30px;} .work-section:after, .work-section:before { width: 530px; } /* .slider-fill { top: 9px; } */ .radio-amounts .gfield_radio .gchoice { width: calc(50% - 8px); } .gform_wrapper .radio-amounts .gfield_radio label:before { top: 21px; } .tier-extra { font-weight: 400; min-width: 300px; } .contact-form {margin-left: 30px;} .opportunities-list ul li:before { top: 3px; } } @media only screen and ( max-width: 1199px ) { .common-padd { padding-top: 80px; padding-bottom: 80px; } .common-padd-small { padding-top: 80px; padding-bottom: 80px; } h2 { font-size: 30px; } /* ===========mobile nav========== */ .main-header .hdr-rt {width: auto; justify-content: flex-end; } .hamburger-nav{ display: inline-block; } .mobile-menu ul li a.btn { display: inline-block; padding: 15px 20px;} .mobile-menu-container{display: block;} .hamburger-nav span{background: #A88F2C;} .header-section .right-panel{ -ms-flex-pack: end!important; justify-content: flex-end!important; } .mobile-menu-logo{max-width: 50px; margin: 0 auto; text-align: center; display: none;} .mobile-menu ul li { padding: 0; } .mobile-menu ul li a, .mobile-menu ul li {font-size: 18px; color: #966152; text-align: left; font-weight: 400; } .mobile-menu ul li a:hover{color: #FF663F;} .mobile-menu ul li a:hover::before { background: #FF663F; } .mobile-menu ul li:not(:last-child) { margin-bottom: 24px; } .mobile-menu ul li ul.sub-menu li { margin: 11px 0; padding: 0; } .mobile_menu_btn{margin-top: 30px;} .mobile_menu_btn a.btn.plbig{padding-left: 50px;} .contact_icon { width: 41px; height: 41px; top: 5px; left: 4px; font-size: 20px; } .mobile_menu_btn a.plbig{margin-right: 15px;} .common-padd-xl-top { padding-top: 140px; padding-bottom: 60px; } .mobile-menu ul li span {margin-left: 10px; } .main-menu, .main-header .hdr-rt.mob-hide { display: none; } .mobile-menu ul li.menu-item-has-children.menu-open:after {transform: rotate(225deg); transition: border-width 150ms ease-in-out; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; top: 15px; } .mobile-menu ul li a::after { content: ''; position: absolute; right: 0; top: 1px; width: 24px; height: 24px; background: url(../images/arrow-up-right.svg) no-repeat; } .mobile-menu ul > li > a { padding: 0 0 0 30px; } .mobile-menu ul li a::before { content: ''; position: absolute; width: 14px; height: 14px; background: #EFCABF; top: 7px; left: 0; } .mobile-menu ul li.current-menu-item a { color: #FF663F; } .mobile-menu ul li.current-menu-item a::before { background: #FF663F; } .mobile-menu ul li:has(.dropdown-icon-menu) a::after { display: none; } .mobile-menu ul li ul.sub-menu li a::before { width: 6px; top: -11px; bottom: -11px; height: auto; } header .mobile-menu ul {max-width: 100%; margin: 0 auto;} header span.dropdown-icon-menu.active::before { transform: rotate(227deg); top: 13px } header span.dropdown-icon-menu::before { content: ""; position: absolute; top: 6px; right: calc(50% - 6px); box-sizing: border-box; height: 12px; width: 12px; border-style: solid; border-color: #4B131F; border-width: 0 2px 2px 0; transform: rotate(45deg); transition: border-width 150ms ease-in-out; -webkit-transition: all .4s ease; -moz-transition: all .4s ease; -ms-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; margin: 0 auto; } header span.dropdown-icon-menu { margin-left: 10px; content: ""; position: absolute; top: -2px; box-sizing: border-box; height: 27px; width: 27px; transform: rotate(0deg); transition: border-width 150ms ease-in-out; -webkit-transition: all .4s ease; -moz-transition: all .4s ease; -ms-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; left: unset; right: 0px; margin: 0 auto; z-index: 9999; display: flex; justify-content: center; align-items: center; } .mobile-menu-container ul.sub-menu { position: relative; max-height: 0; overflow: hidden; transition: max-height .6s ease-out; border-radius: 5px; margin-top: 10px; padding-bottom: 0; border: 1px solid #ff663f; } .mobile-menu-container ul.sub-menu.sub-menu-open { transform: scaleY(1); max-height: 300px;} .main-header { max-width: 100%; } .main-header .hdr-rt.hdr-lt { gap: 0px; } .main-header .hdr-rt.hdr-lt .btn { margin-right: 10px; } .mobile-menu { height: calc(100vh - 180px); overflow: auto; } .mobile-menu ul li.menu-item-has-children > a{padding-right: 0;} .mobile-top-section { height: 100px; position: absolute; top: 0; width: 100%; background: #fff1ed; z-index: 1; } .mobile-menu-bottom { position: absolute; display: flex; flex-direction: column; width: 100%; max-width: 744px; padding: 0 24px; bottom: 30px; left: 50%; transform: translate(-50%, 0); gap: 24px; } .mobile-menu-bottom .fancy { padding: 16.5px 20px; } .mobile-menu-bottom .fancy .text { text-align: center; width: max-content; margin: 0 auto; position: relative; } .mobile-menu-bottom .fancy .text::before { left: 0; } .mobile-menu-bottom .fancy:hover .text::before { left: .6rem; } .mobile-menu-open { top: 0; } .mobile-menu-open.main-header .hdr-rt{top: 0px; transform: translateY(0px);} /* hamburger style */ .hamburger-nav .line {fill: none; transition: stroke-dasharray 400ms, stroke-dashoffset 400ms; stroke: var(--white); stroke-width: 4.5px; stroke-linecap: round; } .hamburger-nav .ham.ham6 { width: 50px; height: 50px; margin-top: -9px; margin-left: -9px; } .hamburger-nav .ham6 .top { stroke-dasharray: 41 172; transform: translateX(-1px);} .hamburger-nav .ham6 .middle { stroke-dasharray: 30 111; transform: translateX(-5px); } .hamburger-nav .ham6 .bottom { stroke-dasharray: 41 172; transform: translateX(1px);} .hamburger-nav.ham-motion .ham6 .top { stroke-dashoffset: -132px; transform: translateX(0px);} .hamburger-nav.ham-motion .ham6 .middle { stroke-dashoffset: -71px; transform: translateX(0px); stroke-dasharray: 40 111; } .hamburger-nav.ham-motion .ham6 .bottom { stroke-dashoffset: -132px; transform: translateX(0px); } /* .body-scroll .mobile-menu-open .hamburger-nav .line { stroke: var(--tartiary); } */ .player-team { padding: 0 15px 20px 15px; margin-bottom: 24px; flex-direction: column-reverse; align-items: flex-start; } .player-team-wrap { display: flex; align-items: flex-end; margin-bottom: 0; margin-top: 16px; gap: 4px; line-height: 1; } .player-team:before { border-radius: 10px; height: 95px; } .team-logo { min-height: 90px; max-width: 160px; padding: 15px; } .team-logo img { max-width: 80%; max-height: 70px; } /* hamburger style */ /* ===========mobile nav========== */ footer .footer-logo{margin-bottom: 35px;text-align: center;} .footer-menu.footer-contact { margin-bottom: 20px; } .main-header.fixed.mobile-menu-open .mobile-menu-container{top: 0;} .desk-hide { display: flex; } .team-text{flex-direction: column;} .team-heading { width: 100%;} .team-content { width: 100%; max-width: 100%; } .common-padd { padding-top: 60px; padding-bottom: 60px; } .registration-wrap:before{height: 100%;} .sponsor-logos { width: 100%;} .mob-hide{display: none !important;} .work-section:after, .work-section:before { width: 380px; } .work-content ul li{max-width: 395px;} .comm-content { padding-left: 0; } .footer-logo{margin-bottom: 20px;} .about-content { padding-left: 0; } .player-search { margin-top: 20px; margin-left: auto;} .picture-gallery{grid-template-columns: repeat(4, 1fr);} .highlight-tab > ul > li { width: 50%; } .footer-contact ul li { margin-bottom: 0; } .tier-redio .gfield_radio { display: flex; width: calc(70% + 24px); justify-content: space-between; } .tier-extra { font-weight: 400; min-width: 230px;} .sponsor-opportunity-content { padding: 15px; } .opportunity-label{top: 15px; left: 15px;} .contact-wrapper .player-raised h3 {font-size: 20px;} } @media only screen and ( max-width: 991px ) { /*..............mobile nav ..............*/ .main-header .logo{max-width: 243px;} .powered-text { padding-left: 20px; } .src-icon img{max-width: 24px;} /*..............mobile nav ..............*/ /*..............common styles..............*/ .common-padd-small { padding-top: 60px; padding-bottom: 60px; } .common-padd-bottom { padding-bottom: 60px; } .common-padd-top { padding-top: 60px; } /*..............common styles..............*/ /* .video-btn { margin-top: 5px; margin-bottom: 11px; } */ .video-btn { position: absolute; top: -420px; right: -85px; transform: translate(-50%, 0) scale(.7); transform-origin: center center; margin-top: 0;} .button-circle{ margin-right: auto; transform: scale(.8);} .banner-content { text-align: center; margin-bottom: 30px; } .ezrah-logo img { max-width: 240px; } .progress-card{margin: 0 auto;} .bottom-footer h2 sub { left: -15px; } .regist-content { text-align: center; } .registration-img { width: 100%; } .sponsor-heading { text-align: center; } .lft-box { text-align: center; } .right-box { text-align: center; margin-top: 10px; } .about-content { margin-top: 30px; } .work-img{border-radius: 20px;} .work-section:after, .work-section:before { width: 100%; height: 290px; bottom: 0; top: unset; } .work-content { margin-bottom: 30px; } .work-content ul li { max-width: 100%; } .community-section .container{border-radius: 22px; padding: 20px;} .community-section .container .row .col-lg-6:first-child { padding-left: 12px; } .comm-img{margin-bottom: 20px; margin-top: 0; border-radius: 12px;} .matter-section{padding-top: 60px;} .matter-section:before{height: 0;} .matter-content{margin-bottom: 20px;} .footer-menu { margin-bottom: 25px; } .compassion-item { margin-bottom: 25px; } .player-details-content { margin-left: 0; margin-top: 50px; } .video-container .play-button{width: 80px; height: 80px;} .video-container .play-button img { max-width: 22px; } .picture-gallery { grid-template-columns: repeat(3, 1fr); } .join-tab { padding: 35px 30px; border-radius: 20px; } .join-tab-btns .gfield_radio .gchoice { width: 100%; } .tier-redio .gfield_radio .gchoice { width: calc(50% - 4px); } .tier-redio .gfield_radio { display: flex; width: calc(100%); justify-content: space-between; } .join-tab-btns .gfield_radio .gchoice label { padding: 0px 17px 9px 6px; } .gform_wrapper .radio-amounts .gfield_radio label { flex-direction: column; } .tier-extra { min-width: 100%; margin: 12px 0 0 0; } .right-box p { font-size: 16px; font-weight: 300; text-align: center; } .contact-form { margin-left: 0px; margin-top: 50px;} .contact-wrapper::before { display: none; } .team-heading h3{margin-bottom: 16px;} .main-header.fixed .mobile-menu-open .mobile-menu-container { top: 0;} .playerslider::-webkit-slider-thumb{top: -4px;} .banner{min-height: 880px;} .playerslider::-moz-range-thumb {width: 23px; height: 23px; background-size: 18px; background-position: right 0px center; transform: translateY(2px);} .inner-banner-content { padding: 130px 0 95px;} /* Disable hover effect on radio-amounts to prevent stuck hover on touch */ .gform_wrapper .radio-amounts .gfield_radio label:hover { opacity: 1; border-color: #E8E8E8; box-shadow: none; } } @media only screen and ( max-width: 767px ) { /*..............common styles..............*/ h1, h2, h3, h4, h5, h6 { line-height: 1.1; } p { margin: 0 0 24px; line-height: 1.3; } h2 { font-size: 26px; } .container { max-width: 95%; } .common-padd { padding-top: 40px; padding-bottom: 40px; } /*..............common styles..............*/ /*..............mobile nav..............*/ .main-header .logo { max-width: 92px; } .mobile-menu { padding-top: 125px; } .logo-main { --gap: 17px; } .mobile-menu-open .mobile-menu-container { top: 0; transform: translateY(0); opacity: 1; } header.main-header.mobile-menu-open .hamburger-nav::before { opacity: 1; transform: scale(1.1); } .powered-text { padding-left: 33px; } .main-header .hdr-rt{flex-wrap: wrap;} /*..............mobile nav..............*/ .fancy { padding: 10px 16px; } .fancy .text { font-size: 14px; } .fancy .text::before { width: 20px; } .logo-main { --gap: 17px;} footer .footer-menu.link-grid ul li { width: 100%; } .team-flex {flex-wrap: wrap; flex-direction: column; } .team-time{position: relative; z-index: 5; margin: 0 auto;} .time-info{width: 100%; height: 100%;} .team-text {padding: 96px 20px 26px 20px; margin-top: -60px; position: relative; z-index: 4; } .bottom-header { padding: 8px 0px; transition: all 0.3s ease; } .inner-banner-content { padding: 120px 0 95px;} .work-section:after, .work-section:before{height: 172px;} .sort-sec ul{flex-wrap: wrap; flex-direction: column;} .sort-sec ul li{width: 100%; margin-bottom: 20px;} .sort-sec ul li button{width: 100%;} .sort-sec ul li:not(:last-child) { margin-right: 0; } /* .slider-fill { top: 8px; } */ .fundraising-table tr td { padding: 17px 14px; } .player-search { max-width: 435px; } .highlight-tab > ul { flex-wrap: wrap; } .highlight-tab > ul > li { width: 100%; } .picture-gallery { grid-template-columns: repeat(2, 1fr); } .video-container .play-button { width: 70px; height: 70px; } .video-container .play-button img { max-width: 20px; } .login-section .login-content { padding: 120px 0px 80px; } .login-logo { max-width: 70px; margin-bottom: 12px; } .login-section .login-content h1 { margin: 0 0 20px; } .form-box { padding: 25px 20px; border-radius: 15px; } .champiom-item { padding: 15px; border-radius: 15px; height: calc(100% - 16px); margin-bottom: 16px; } .main-header { top: 0; } .main-header .hdr-rt { transform: translateY(0); } .body-scroll .mobile-menu-open{top:0} .body-scroll .mobile-menu-open .hdr-rt{transform: translateY(0px);} .body-scroll .mobile-menu-open .bottom-header { padding: 20px 5px 20px 0; } .top-footer.common-padd-small { padding: 40px 0; } .footer-menu h4, .header-social h4 { font-weight: 600; color: var(--white); text-align: center; } footer .footer-logo { text-align: center; margin: 0 auto 30px; } footer .footer-menu.link-grid ul li { width: 100%; text-align: center; } footer .footer-menu ul li { text-align: center; } .footer-contact ul li { flex-direction: column; margin-bottom: 15px !important; gap: 8px; } .gform_fields { grid-row-gap: 12px !important; } .gform_wrapper.gravity-theme .ginput_container_address span, .gform_wrapper.gravity-theme .ginput_full:not(:last-of-type) { margin-bottom: 12px !important; } .join-tab { padding: 20px 15px; border-radius: 10px; } .join-tab-btns .gfield_radio { display: flex; align-items: center; } .join-tab-btns .gfield_radio .gchoice { width: 100%; } .join-tab-btns .gfield_radio .gchoice label { padding: 14px 10px; flex-direction: column;} .join-tab-btns .gfield_radio .gchoice label { padding: 14px 21px 14px 21px; } .join-tab-btns .gfield_radio .gchoice label::before{position: absolute; top: 13px; width: 15px; height: 15px;} .amount-field.field_description_below { flex-direction: column; } .gform_wrapper.gravity-theme .amount-field label.gfield_label { padding: 15px 10px !important; width: 100%; } .amount-field input { text-align: center; padding: 10px !important; height: 50px !important; } .gform_wrapper.gravity-theme input:not([type=radio]):not([type=checkbox]):not([type=image]):not([type=file]) { line-height: inherit !important; } .radio-amounts .gfield_radio .gchoice { width: 100%; } .gsection_title { font-weight: 700; color: var(--tartiary); margin-bottom: 0; font-size: 22px; } .gform_wrapper .radio-amounts .gfield_radio label { display: block; border-radius: 12px; } .custom-checkbox label { line-height: 1.9; } .payment-field .gchoice { min-width: 100% !important; } .header-social { display: flex; align-items: center; justify-content: center; } .modal.show .modal-dialog { transform: none; margin: 20px auto; } .donation-modal .modal-content { background: #FFF1ED; padding: 25px 20px; border-radius: 20px; width: 94%; } .banner { padding-bottom: 50px; padding-top: 200px; min-height: 100svh; } .video-btn{top: -300px;} .amount { font-size: 26px; } .form-icon{top: 19px; } .form-icon i {font-size: 20px;} .btn.submit-btn{height: 50px;} .show-pass { font-size: 20px;} .breadcrumb-item+.breadcrumb-item::before{height: 20px; margin-top: 3px;} .form-floating:has(.form-icon)>label{top: 18px;} .playerslider::-webkit-slider-thumb , .playerslider::-moz-range-thumb{top: -5px;} .opportunities-list ul li:before { top: 3px; } .contact-form{padding: 25px;} .player-raised{padding: 20px;} .fund-icon span{width: 46px; height: 46px;} .fund-icon span img { max-width: 25px; } .player-raised h3 { font-size: 17px; } .gform-footer { margin-top: 16px !important;} .payment-field .gfield_radio{flex-wrap: nowrap !important;} .payment-field .gchoice { min-width: calc(50% - 11px) !important; } .contact-wrapper .player-raised h3 {font-size: 17px;} .community-tab ul li button .tab-div{display:flex;flex-direction:column;align-items:flex-start;} .community-tab ul li button strong{margin-left: 0px;} .community-tab ul li button {justify-content: flex-start;} } @media only screen and ( max-width: 576px ) { /*..............common styles..............*/ .container { max-width: 96%; } /*..............common styles..............*/ } @media only screen and ( max-width: 358px ) { } /*Media Query css*/