/* General Style */
* {
    margin: 0;
    padding: 0;
    font-family: "Poppins-Regular";

}

@font-face {
    font-family: "Inter";
    src: url(../fonts/inter/Inter.ttf);
}

@font-face {
    font-family: "Poppins-Regular";
    src: url(../fonts/poppins/Poppins-Regular.ttf);
}

@font-face {
    font-family: "Poppins-Light";
    src: url(../fonts/poppins/Poppins-Light.ttf);
}

:root {
    --main_color: #dd4142;
    --second_color: #2B2A4C;
}

a {
    text-decoration: none !important;
    color: inherit;
}

html::-webkit-scrollbar {
    width: 8px;
}

html::-webkit-scrollbar-thumb {
    background-color: var(--second_color);
    border-radius: 12px;
}

html::-webkit-scrollbar-track {
    background-color: #2b2a4c41;
}

html {
    overflow-x: hidden;
}

header
{
    border-bottom:1px solid #dadada;
}

.mh10p10
{
    min-height:10px;
    padding:10px;
    float:left;
}

.header .menuIcon {
    padding: 15px;
    color: var(--second_color);
}

.slick-slider {
    overflow: hidden;
}

.header {
    display: flex;
    padding: 15px 0;
}

.mobileRightMenu {
    background-color: var(--second_color) !important;
}

.rightButton button {
    color: #fff !important;
}

.rightMenuBar {
    padding: 10px;
    color: #fff;
}

.rightLoginButton .loginBtn {
    width: 100%;
}

.rightRegButton .loginBtn {
    width: 100%;
    background-color: #d9d9d9;
    color: var(--second_color);
    font-weight: 600;
}

.iban {
    font-weight: 600;
    color: var(--main_color);
}

.rightMenuBar .navbarItem {
    padding: 15px;
    font-size: 20px;
    text-align: center;
}

.lineOuter {
    width: 100%;
}

.lineOuter .lineInner {
    width: 95%;
    height: 1px;
    background-color: #2b2a4c41;
}

.navbar {
    gap: 35px;
}

.loginButtons {
    gap: 15px;
}

.customBtn {
    padding: 8px 16px;
    border-radius: 7px;
    color: white;
    border: 1px solid transparent;
}

.inputWrapper input[type='text'],
.inputWrapper input[type='password'],
.inputWrapper input[type='email'],
.inputWrapper input[type='tel'],
.inputWrapper input[type='date'],
.inputWrapper input[type='number'],
.inputWrapper textarea,
.inputWrapper input[type='time'] {
    padding: 10px;
    border-radius: 7px;
    border: none;
    background-color: #f5f5f5;
    width: 100%;
    border-left: 3px solid #f5f5f5;
    outline: none;
    margin-top: 25px;
}

.inputWrapper input:focus {
    border-left: 3px solid;
    outline: none;
    border-left-color: var(--main_color);
}

.loginBtn {
    background-color: var(--main_color);
}

.loginBtn:hover {
    transition: 0.5s ease;
    background-color: white;
    color: var(--main_color);
    border-color: var(--main_color);
}

.registerBtn {
    background-color: var(--second_color);
}

.registerBtn:hover {
    transition: 0.5s ease;
    background-color: white;
    color: var(--second_color);
    border-color: var(--second_color);
}

.offcanvas-header .logo {
    height: 45px;
}

.offcanvas-header .logo img {
    height: 100%;
    object-fit: contain;
}

.header .logo {
    height: 45px;
}

.header .logo img {
    height: 35px;
    object-fit: contain;
    object-position: left;
    margin: 5px 0px;
}

.footer .logo {
    height: 45px;
    align-items: flex-start;
}

.footer .logo img {
    height: 35px;
    object-fit: contain;
    object-position: left;
    margin: 5px 0px;
}

.navbar .navbarItem {
    position: relative;
    display: flex;
    justify-content: center;
    position:relative;
    z-index:9;
}

.navbarDropdownOuter
{
    width: 190px;
    min-height: 10px;
    position: absolute;
    left: 0px;
    top: 21px;
    background-color: #fff;
    padding:10px;
    display:none;
    align-items:center;
    justify-content:center;
    flex-direction: column;
    gap: 10px;
    -webkit-box-shadow: 0px 4px 18px -10px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 4px 18px -10px rgba(0,0,0,0.75);
    box-shadow: 0px 4px 18px -10px rgba(0,0,0,0.75);
}

.navbar .navbarItem:hover .navbarDropdownOuter
{
    display:flex;
}

.navbarDropdownLine
{
    width:100%;
    font-size:13px;
    font-weight:400;
    color:#333;
    float:left;
    transition: all 0.3s ease;
}

.navbarDropdownLine:hover
{
    color:var(--main_color);
}

.navbarItemActive {
    color: var(--main_color);
}

.navbarItemActive .dot {
    display: block !important;
}

.navbar .navbarItem:hover {
    color: var(--main_color);
}

.navbar .navbarItem:hover .dot {
    display: block;
}

.navbarItem .dot {
    width: 30px;
    height: 2px;
    background-color: var(--main_color);
    position: absolute;
    top: 100%;
    border-radius: 7px;
    display: none;
}

.contactBtn {
    position: fixed;
    bottom: 25px;
    right: 25px;
    z-index: 999;
    width: 40px;
    height: 40px;
    background-color: rgb(7, 183, 7);
    border-radius: 50%;
    cursor: pointer;
}

.contactBtn i {
    color: white;
    font-size: 20px;
}

.text {
    padding: 10px 0px;
    text-align: justify;
    font-size: 12px;
    color: white;
}

.footerTitle {
    font-weight: bold;
    text-align: center;
    color: white;
}

.footerTextArea {
    align-items: center;
    padding: 15px 15px;
}

.footerItem {
    padding: 5px 0px;
    color: white;
}

.footerItem:hover {
    color: var(--main_color);
}

.footer {
    background-color: var(--second_color);
}

.footerContact {
    color: white;
    gap: 6px;
    padding: 5px 0px;
}

.footerContact i {
    margin-top: 3px;
    color: var(--main_color);
}

.socialMedia {
    gap: 20px;
}

.socialMedia i {
    font-size: 18px;
    margin-top: 3px;
}

.socialMediaItem:hover {
    color: var(--main_color);
}

.socialMediaItem {
    color: white;
}

.footerBottom {
    background-color: rgba(169, 169, 169, 0.563);
    padding: 5px;
    justify-content: space-between;
}

.footerBottomText {
    color: white;
    font-size: 11px;
}

.footerBottomText2 {
    color: var(--second_color);
    font-size: 11px;
    font-weight: bold;
}

.mockup {
    width: 75%;
}

.mockup img {
    height: 100%;
    object-fit: contain;
}

.videoContentArea {
    position: absolute;
    z-index: 99;
}

.videoTitleText {
    font-size: 30px;
    font-weight: bold;
    color: white;
    letter-spacing: 2px;
    padding: 10px 10px;
}

.videoTitleSubText {
    font-size: 20px;
    font-weight: 500;
    color: white;
    letter-spacing: 1px;
    padding: 5px 10px;
}

.videoButton {
    border-radius: 20px;
    background-color: #dd4141b7;
    width: 220px;
}

.videoButton2 {
    border-radius: 20px;
    background-color: #2b2a4ccb;
    width: 220px;
}

.downloadTitle {
    color: white;
    font-size: 30px;
}

.aimBox {
    height: 50%;
    width: 50%;
    padding: 20px 40px;
}

.aimArea {
    padding: 30px 0px;
}

.aimBoxInner {
    background-color: white;
    border-radius: 15px;
    height: 230px;
    padding: 20px;
    box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;
}

.aimIcon {
    width: 50px;
    height: 50px;
    border: 1px solid var(--main_color);
    border-radius: 25px;
}

.aimIcon2 {
    width: 50px;
    height: 50px;
    border: 1px solid #22A699;
    border-radius: 25px;
}

.aimIcon3 {
    width: 50px;
    height: 50px;
    border: 1px solid #2B2A4C;
    border-radius: 25px;
}

.aimTitle {
    font-weight: bold;
}

.aimDesc {
    text-align: justify;
    color: darkgray;
    padding: 0px 10px;
}

.customTitleText {
    font-weight: bold;
    font-size: 25px;
    padding: 10px 0px;
}

.howItWorks {
    padding: 20px 40px;
    position: relative;
}

.howItWorksInner {
    border: 1px solid #EEEEEE;
    border-radius: 15px;
    height: 370px;
}

.howItWorksColorArea {
    background-color: #EEEEEE;
    height: 45%;
    border-top-right-radius: 15px;
    border-top-left-radius: 15px;
}

.howImg {
    height: 110px;
    width: 110px;
}

.howItWorksDesc {
    text-align: center;
    color: rgb(129, 129, 129);
    padding: 5px 10px 20px 10px;
}

.howItWorksTitle {
    padding: 10px 0px;
    font-weight: 600;
    color: var(--second_color);
}

.countNumber {
    position: absolute;
    height: 50px;
    width: 50px;
    background-color: white;
    border-bottom-right-radius: 20px;
    border-top-left-radius: 15px;
    border: 1px solid #EEEEEE;
}

.countNumber {
    font-size: 20px;
    font-weight: bold;
    color: var(--main_color);
}

.teamCardInner {
    width: 100%;
    height: 250px;
    border-radius: 8px;
    background-color: #EEEEEE;
}

.team-slider {
    height: 320px;
}

.team-slider .slick-dots {
    bottom: 10px !important;
}

.imgProfile {
    padding: 10px 0px;
}

.teamCardOuter {
    padding: 10px 20px;
}

.personName {
    font-size: 15px;
    color: var(--second_color);
    font-weight: 700;
}

.personDep {
    font-size: 12px;
    color: #f27474;
    font-weight: 700;
    padding: 8px 0px;
}

.personDetail {
    width: 60%;
    height: 25px;
    padding: 5px 0px;
    border-radius: 20px;
    align-items: center;
    background-color: var(--main_color);
    box-shadow: var(--main_color) 0px 4px 16px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px;
}

.detailButton {
    font-size: 10px;
    color: white;
    font-weight: 300;
}

.homeImg {
    height: 430px;
    width: 90%;
    object-fit: cover;
    border-radius: 10px;
}

.infoOuter {
    padding: 40px 0px;
}

.infoDesc {
    font-size: 25px;
    font-weight: 500;
    letter-spacing: 1px;
}

.exIcon {

    color: var(--main_color);
}

.exampleOuter {
    padding: 30px 0px;
}

.example {
    padding: 5px 10px 25px 0px;
}

.homeInfoOuter {
    padding: 10px 45px;
}

.blogOuter {
    position: relative;
}

.blogInfoitleText {
    padding: 20px 0px;
}

.blogInner {
    background-color: #EEEEEE;
    border-radius: 5px;
    height: 400px;
    width: 100%;
}

.blogImage img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.blogImage {
    height: 175px;
    width: 100%;
}

.blogBoxBody {
    padding: 15px;
}

.blogBoxBody .blogContent {
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    padding: 5px 0px;
}

.blogBoxBody .blogTitle {
    font-weight: 600;
    font-size: 15px;
    color: var(--main_color);
}

.blogOuter .topicText {
    color: white;
    background-color: #2b2a4cd6;
    font-weight: 600;
    position: absolute;
    top: 7px;
    right: 15px;
    width: 150px;
    height: 32px;
    border-radius: 5px;
    box-shadow: rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px;

}

.blogOuter .blogDetailButton {
    background-color: var(--second_color);
    width: 60%;
    color: white;
    border-radius: 7px;
}

.blogDetailButton a {
    padding: 5px 16px;
}

.blogArea .allBlogs {
    margin: 25px;
    font-weight: 700;
    color: var(--second_color);
}

.backgroundLogin {
    width: 100%;
    min-height: 100vh;
    background-image: url('../images/system/loginphoto.jpg');
    background-size: cover;
    background-position: bottom center;
    background-repeat: no-repeat;
}

.backgroundLogin img {
    filter: brightness(0.6);
}

.backgroundLogin .loginContentArea {
    padding: 0 45px;
}

.backgroundLogin .regContentArea {
    padding: 0 45px;
    margin: 45px 0;
}

.loginWhiteArea {
    border-radius: 10px;
    background-color: white;
    padding: 30px;
}

.loginWhiteArea .loginText {
    color: var(--second_color);
    font-size: 18px;
    font-weight: 600;
}

.forgotQuestion a {
    color: var(--main_color);
    font-size: 13px;
    margin-top: 10px;
}

.loginButtonText a {
    background-color: var(--second_color);
    width: 60%;
    margin-top: 30px;
    padding: 10px 20px;
    border-radius: 8px;
    color: white;
    font-size: 13px;
    text-align: center;
}

.loginButtonText button {
    background-color: var(--second_color);
    width: 60%;
    margin-top: 30px;
    padding: 10px 20px;
    border-radius: 8px;
    color: white;
    font-size: 13px;
    text-align: center;
    border: none;
}

.userTypeOuter {
    padding: 10px 0px;
}

.userTypeOuter .usertextArea {
    flex: 1;
    white-space: nowrap;
    padding: 10px 0px;
    text-align: center;
    background-color: #EEEEEE;
    color: rgba(155, 155, 155, 0.738);
}

.userTypeOuter .usertextAreaActive {
    background-color: var(--main_color);
    color: white;
}

.userTypeOuter .usertextArea:nth-child(1) {
    border-right: 1px solid white;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

.userTypeOuter .usertextArea:nth-child(2) {
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

.checkboxText a {
    color: var(--main_color);
    font-size: 13px;
}

.checkboxText span {
    font-size: 13px;
    color: var(--second_color);
}

.customCheckbox {
    width: 15px;
    height: 15px;
    border: 1px solid #1c1c1c;
    border-radius: 3px;
    background-color: white;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.customCheckbox input {
    width: 100%;
    height: 100%;
    opacity: 0;
    position: absolute;
}

.customCheckbox i {
    font-size: 11px;
    display: none;
}

.customCheckbox input:checked~i {
    display: block;
    color: var(--main_color);
}

.backgroundBanner {
    height: 200px;
    background-image: url('../images/system/banner.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    object-fit: cover;
}

.backgroundBanner .bannerTitle {
    padding: 20px 0;
    font-size: 25px;
    font-weight: 600;
    color: white;
}

.agreementDesc {
    text-align: justify;
    margin: 45px 0;
}

.agreementTitle {
    font-size: 25px;
    font-weight: 600;
    color: var(--main_color);
    margin-bottom: 20px;
}

.imageAbout {
    height: 500px;
}

.imageAbout img {
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
}

.aboutOuter {
    margin-bottom: 110px;
}

.companyWork .companyWorkInner {
    height: 110px;
    padding: 10px;
    margin-top: 10px;
}

.companyWork .companyWorkBackground {
    background-color: #c9c9c9b5;
    border-radius: 5px;
    width: 100%;
    height: 100%;
    filter: grayscale(1);
    margin-bottom: 20px;
    border: 1px solid #bababaac;
}

.companyWorkBackground:hover {
    background-color: #EEEEEE;
    filter: grayscale(0);
    transition: 0.5s ease;
    box-shadow: rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px;
}

.contactOuter {
    box-shadow: rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px;
    border-radius: 10px;
    background-color: var(--second_color);
}

.contactOuter .contactInner {
    background-color: white;
    border-top-right-radius: 8px;
    border-top-left-radius: 8px;
    padding: 30px;
}

.contactOuter .contactTitle {
    font-size: 20px;
    color: var(--main_color);
    font-weight: 600;
    letter-spacing: 1px;
}

.contactOuter .inputWrapper {
    padding: 10px;
}

.contactOuter textarea {
    background-color: #F5F5F5;
    padding: 10px;
    border-radius: 7px;
    border: none;
    width: 100%;
    outline: none;
    margin-top: 20px;
    height: 150px;
    resize: none;
    border-left: 3px solid #f5f5f5;
}

.inputWrapper textarea:focus {
    border-left: 3px solid var(--main_color);
    outline: none;
}

.contactDetails {
    padding: 20px;
}

.contactDetailArea .contactIcon {
    border: 1px solid var(--main_color);
    height: 40px;
    width: 40px;
    border-radius: 20px;
    color: var(--main_color);
}

.contactDetailArea {
    color: white;
    text-align:center;
}

.branchImg {
    width: 90%;
}

.branchImg .branchPicture {
    height: 100%;
    width: 100%;
}

.branchDetailImg {
    width: 80%;
    height: 200px;
}

.branchDetailImg img {
    height: 100%;
    width: 100%;
}

.branchDesc .footerContact {
    color: var(--second_color);
    gap: 6px;
    padding: 5px 0px;
}

.blogDetailOuter {
    height: 500px;
}

.blogDetailImage {
    width: 90%;
}

.blogDetailImage img {
    border-radius: 10px;
    height: 100%;
    object-fit: cover;
}

.blogDetailContent {
    text-align: justify;
    color: var(--second_color);
    margin: 3rem;
}

.blogDetailInfo .blogDetailDate {
    font-size: 14px;
    color: grey;
}

.blogDetailInfo {
    width: 100%;
    padding: 20px 60px;
}

.blogDetailInfo .blogDetailTitle {
    font-size: 22px;
    font-weight: 600;
    color: var(--second_color);
}

.blogProfilePhoto {
    width: 40px;
    height: 40px;
    border: 2px solid var(--second_color);
    border-radius: 20px;
}

.blogProfilePhoto img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    border-radius: 20px;
}

.teamMemberOuter {
    padding: 40px;
}

.teamMemberOuter .teamInner {
    width: 100%;
    height: 300px;
    position: relative;
}

.teamMemberOuter .teamInner img {
    height: 100%;
    border-top-right-radius: 8px;
    border-top-left-radius: 8px;
}

.teamMemberOuter .teamInfoImg {
    position: absolute;
    background-color: #2b2a4c82;
    bottom: 0;
    right: 0;
    width: 100%;
    padding: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    color: white;
    justify-content: center;
}

.teamInner .teamName {
    font-weight: 600;
    letter-spacing: 1px;
    font-size: 15px;
}

.teamInner .teamDep {
    font-family: "Poppins-Light";
    font-size: 13px;
}

.teamDetail .teamDetailPhoto {
    width: 70%;
    height: 400px;
}

.teamDetailPhoto img {
    height: 100%;
    border-radius: 10px;
}

.teamDetailInfoArea .teamMemberName {
    font-size: 25px;
    color: var(--second_color);
    font-weight: bold;
    letter-spacing: 1px;
}

.teamDetailInfoArea .teamDep {
    font-family: "Poppins-Light";
    font-size: 15px;
    color: var(--main_color);
}

.memberResumeArea .teamMemberAbout {
    text-align: justify;
    font-family: "Poppins-Light";
}

.memberResumeArea .teamMemberContact {
    font-weight: 600;
    color: var(--second_color);
    font-size: 15px;
}

.teamMemberContact .teamContactDesc {
    font-family: "Poppins-Light";
}

.teamMemberContact i {
    color: var(--main_color);
}

.corporateModal .modal-header {
    border: none;
}

.deleteAccountModal .modal-header {
    border: none;
}

.corporateModal .modal-footer {
    border: none;
}

.deleteAccountModal .modal-footer {
    border: none;
}

.deleteAccountModal .deleteAccountModalButtons {
    background-color: var(--second_color);
    color: white;
    border-radius: 5px;
    width: 80px;
}

.deleteAccountModal .deleteAccountModalButtons2 {
    background-color: grey;
    color: white;
    border-radius: 5px;
    width: 80px;
}

.deleteAccountModal .deleteAccountModalButtons:hover {
    background-color: white;
    color: var(--second_color);
    border: 1px solid var(--second_color);
    font-family: "Poppins-Regular";
    border-radius: 8px;
}

.deleteAccountModal .deleteAccountModalButtons2:hover {
    background-color: white;
    color: grey;
    border: 1px solid grey;
    font-family: "Poppins-Regular";
    border-radius: 8px;
}

.corporateModal .modal-title {
    color: #7A9D54;
    font-size: 20px;
    font-weight: 600;
}

.corporateModal .corcorateClose {
    background-color: var(--second_color);
    color: white;
    font-family: "Poppins-Regular";
    border-radius: 8px;
}

.corporateModal .corcorateClose:hover {
    background-color: white;
    color: var(--second_color);
    border: 1px solid var(--second_color);
    font-family: "Poppins-Regular";
    border-radius: 8px;
}

.getDetailInfo .getDetailButton {
    background-color: var(--second_color);
    color: white;
    padding: 7px 13px;
    border-radius: 8px;
    border: 2px solid transparent;
}

.getDetailInfo .getDetailButton:hover {
    background-color: white;
    border: 2px solid var(--second_color);
    color: var(--second_color);
    padding: 7px  13px;
    border-radius: 8px;
}

.topHead .topHeadIcon {
    width: 20px;
    height: 15px;
}

.languageOuter .languageItem {
    padding: 5px 10px;
    background-color: white;
    border: 1px solid #2b2a4c9a;
    border-radius: 5px;
    gap: 5px;
    width: 100px;
    cursor: pointer;
    color: var(--second_color);
}

.languageOuter .languageItem:hover {
    background-color: var(--second_color);
    color: white;
}

.dropDownInner {
    display: none;
    position: absolute;
}

.languageOuter:hover .dropDownInner {
    display: block;
}

.menuProfileOuter .menuProfilePhoto {
    height: 30px;
    width: 30px;
}

.menuProfilePhoto img {
    border-radius: 15px;
}

.menuProfileOuter .userNameArea {
    font-size: 13px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.menuProfileOuter .userNameArea:hover {
    font-size: 13px;
    color: var(--main_color);
}

.menuIcon i:hover {
    color: var(--main_color);
}

.userProfileArea .userProfileLeftArea {
    background-color: white;
    border-radius: 10px;
    width: 100%;
    height: calc((87vh / 3) - 15px);
    box-shadow: rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px;
    padding: 20px 0;
}

.userProfileLeftArea .userProfileLeftPhoto {
    width: 100px;
    height: 100px;
}

.userProfileLeftArea .userProfileLeftPhoto img {
    border-radius: 50px;
    border: 1px solid var(--second_color);
}

.userProfileLeftArea .userProfileLeftMenu {
    width: 100%;
    height: 100%;
    padding: 10px;
}

.userProfileLeftArea .profileLeftMnuBottomLine {
    border-bottom: 1px solid #dadada;
    width: 100%;
    padding: 10px;
}

.userProfileLeftArea .profileLeftMnuBottomLineChat {
    border-bottom: 1px solid #dadada;
    width: 100%;
    padding: 10px;
    height: 70px;
}

.userProfileLeftArea .profileLeftMnuBottomLineLast {
    width: 100%;
    padding: 10px;
}

.userProfileLeftArea .profileLeftMnuBottomLineLast:hover {
    padding-left: 20px;
    color: var(--main_color);
    transition: 0.5s ease;
}

.profileleftInfo .userprofileLeftName {
    font-weight: 600;
    color: var(--second_color);
}

.profileleftInfo .userprofileLeftMail {
    font-family: "Poppins-Light";
    color: #adadad;
}

.userProfileLeftMenu .profileLeftMnuBottomLine:hover {
    padding-left: 20px;
    color: var(--main_color);
    transition: 0.5s ease;
}

.menuIcon .notificationcount {
    height: 14px;
    width: 14px;
    border-radius: 7px;
    top: 8px;
    right: 7px;
    background-color: var(--main_color);
    font-size: 12px;
    color: white;
}

.menuIcon .countInner {
    display: flex;
    justify-content: center;
    font-size: 10px;
}

.menuIcon i {
    font-size: 16px;
}

.profileSettingsOuter {
    padding: 0 50px 15px;
}

.profileSettingsOuter .profileLeftMnuTitle {
    color: var(--main_color);
    font-weight: 600;
    background-color: #c7c7c744;
    min-width: 190px;
    padding: 10px;
    border-radius: 10px;
    justify-content:flex-start!important;
    padding-left:15px;
    margin-bottom:25px;
}

.profileSettingsTopArea .profileEditPhoto {
    width: 120px;
    height: 120px;
    position: relative;
}

.profileEditPhoto img {
    width: 100%;
    height: 100%;
    border-radius: 60px;
    border: 1px solid var(--second_color);
}

.profileSettingsTopArea .profileEditButton {
    width: 20px;
    height: 20px;
    right: 15px;
    bottom: 2px;
    background-color: var(--second_color);
    border-radius: 10px;
}

.profileEditButton i {
    color: white;
}

.inputProfile input[type='text'],
.inputProfile input[type='password'],
.inputProfile input[type='email'],
.inputProfile input[type='number'],
.inputProfile input[type='date'],
.inputProfile select,
.inputProfile input[type='tel'] {
    padding: 10px;
    border-radius: 7px;
    border: none;
    background-color: #d8d8d86d;
    width: 100%;
    border-left: 3px solid #d8d8d86d;
    outline: none;
    margin-top: 25px;
    flex-wrap: wrap;
}

.inputProfile input:focus {
    border-left: 3px solid;
    outline: none;
    border-left-color: var(--main_color);
}

.inputProfile select:focus {
    border-left: 3px solid;
    outline: none;
    border-left-color: var(--main_color);
}

.profileUpdateButton a {
    background-color: var(--second_color);
    width: 150px;
    margin-top: 30px;
    padding: 10px 20px;
    border-radius: 8px;
    color: white;
    font-size: 13px;
    text-align: center;
}

.profileUpdateButton button {
    background-color: var(--second_color);
    width: 150px;
    margin-top: 30px;
    padding: 10px 20px;
    border-radius: 8px;
    color: white;
    font-size: 13px;
    text-align: center;
}

.profileLeftActive {
    color: var(--main_color);
}

.inputTopArea .inputPassword {
    width: 300px;
}

.table>:not(:last-child)>:last-child>* {
    border-bottom: 1px solid var(--second_color) !important;
}

.appointmentsTable thead {
    background-color: #2b2a4cbb;
}

.appointmentsTable thead th {
    color: white;
}

.appointmentsTable td {
    vertical-align: middle;
}

.userAppointmentBoxArea .operationsButtonTable {
    background-color: var(--second_color);
    padding: 5px;
    color: white;
    border-radius: 5px;
}

.inputProfile textarea {
    background-color: #d8d8d86d;
    padding: 10px;
    border-radius: 7px;
    border: none;
    width: 100%;
    outline: none;
    margin-top: 20px;
    height: 150px;
    resize: none;
    border-left: 3px solid #d8d8d86d;
}

.inputProfile textarea:focus {
    border-left: 3px solid var(--main_color);
    outline: none;
}

.profileSettingsOuter .profileBlogTtle {
    overflow: hidden;
    max-width: 200px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

.profileSettingsOuter .operationsButtonTableBlog {
    padding: 5px;
    color: white;
    border-radius: 5px;
}

.blogTopArea .addBlogButtonArea {
    background-color: var(--second_color);
    padding: 7px 14px;
    border-radius: 8px;
    color: white;
    transition: 0.6s ease;
    border: 1px solid var(--second_color);
}

.blogTopArea .addBlogButtonArea:hover {
    background-color: white;
    padding: 7px 14px;
    border-radius: 8px;
    color: var(--second_color);
    border: 1px solid var(--second_color);
    transition: 0.6s ease;
}

.inputProfile .inputFile::file-selector-button {
    background-color: var(--main_color);
    color: white;
    border-radius: 7px;
    border: none;
    padding: 6px 12px;
    font-size: 13px;
    cursor: pointer;
}

.notificationCountProfile {
    background-color: var(--main_color);
    width: 18px;
    height: 18px;
    border-radius: 6px;
}

.notificationCountProfile .notCountText {
    color: white;
    font-size: 12px;
}

.notificationOuterArea .notificationInner {
    padding: 20px;
    border-radius: 8px;
    background-color: #c7c7c744;
    position: relative;
}

.notificationOuterArea .notificationTitle {
    font-weight: 600;
    color: var(--second_color);
}

.notificationInner .deleteButtonNot {
    position: absolute;
    height: 30px;
    width: 30px;
    border-radius: 15px;
    background-color: red;
    right: -10px;
    top: -13px;
}

.deleteButtonNot i {
    color: white;
    font-size: 12px;
}

.notificationInner .notificationDate {
    font-size: 12px;
    color: grey;
}

.dateTimeNotification {
    color: var(--main_color);
}

.workingHoursOuter .workingHoursCard {
    padding: 10px 20px;
    border-radius: 8px;
    background-color: #c7c7c744;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.workingStartHours input {
    width: 100%;
    height: 45px;
    border: 1px solid #cbcbcb;
    background-color: #fff;
    border-radius: 5px;
    padding: 0px 12px;
    font-size: 13px;
    color: #333;
    outline: none;
}

.workingStartHours {
    color: var(--second_color);
    font-size: 13px;
}

.workingHoursCard .workingDay {
    color: var(--second_color);
    font-weight: 600;
    width: 100px;
}

.switchWorkStatus {
    position: relative;
    display: inline-block;
    width: 45px;
    height: 20px;
}

/* Switch'in görünmeyen giriş alanını gizle (checkbox gizle) */
.switchWorkStatus input {
    opacity: 0;
    width: 0;
    height: 0;
}

/* Switch'in kaydırıcısını stilleyin */
.sliderWorkStatus {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    transition: .4s ease;
    border-radius: 34px;
}

/* Switch açık olduğunda (checked) kaydırıcıyı renklendirin */
.sliderWorkStatus:before {
    position: absolute;
    content: "";
    height: 12px;
    width: 12px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    transition: .4s ease;
    border-radius: 50%;
}

/* Switch açık olduğunda (checked) arka plan rengini değiştirin */
input:checked+.sliderWorkStatus {
    background-color: var(--main_color);
}

/* Switch açık olduğunda (checked) kaydırıcıyı hareket ettirin */
input:checked+.sliderWorkStatus:before {
    transform: translateX(26px);
}

.chatTitle {
    font-weight: 600;
}

.profileLeftMnuBottomLineChat .menuProfilePhoto {
    width: 40px;
    height: 40px;
}

.profileLeftMnuBottomLineChatActive .menuProfilePhoto {
    width: 40px;
    height: 40px;
}

.profileLeftMnuBottomLineChat .menuProfilePhoto img {
    border-radius: 20px;
}

.profileLeftMnuBottomLineChatActive .menuProfilePhoto img {
    border-radius: 20px;
}

.profileLeftMnuBottomLineChat .userNameChatArea {
    font-size: 14px;
}

.profileLeftMnuBottomLineChatActive .userNameChatAreaActive {
    color: white;
    font-size: 14px;
}

.userProfileLeftArea .profileLeftMnuBottomLineChatActive {
    border-bottom: 1px solid #dadada;
    width: 100%;
    padding: 10px;
    height: 70px;
    background-color: #2b2a4cbb;
    border-radius: 10px;
}

.messageContent {
    background-color: rgb(231, 231, 231);
    flex: 1;
    padding: 20px;
    overflow-y: auto;
}

.messageContactPersonTop {
    height: 70px;
    width: 100%;
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
    background-color: #2b2a4c41;
    padding: 0 20px;
}

.messageContactPersonTop .chatTopImg {
    height: 60px;
    width: 60px;
}

.messageContactPersonTop .chatTopImg img {
    border-radius: 30px;
}

.nameDepChatArea .userChatTopArea {
    font-size: 15px;
    font-weight: 600;
}

.nameDepChatArea .userDepChatTopArea {
    color: var(--main_color);
    font-family: "Poppins-Light";
    font-size: 12px;
}

.chatTopInfoArea i {
    font-size: 20px;
    color: var(--second_color);
}

.messageRightOuter {
    height: 87vh;
}

.sendMessageArea {
    background-color: rgb(231, 231, 231);
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    padding: 20px;
}

.sendMessageArea .writeMessageWhiteArea input {
    width: 100%;
    border: 1px solid #2b2a4c4d;
    padding: 10px;
    border-radius: 10px;
    outline: none;
    background-color: rgb(231, 231, 231);
    padding-right: 50px;
}

.sendImgOuter {
    width: 40px;
    height: 34px;
    background-color: var(--main_color);
    right: 5px;
    border-radius: 10px;
    border: 1px solid var(--main_color);
    border-left: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;
}

.sendImgOuter img {
    height: 24px;
    width: 24px;
}

.sendImgOuter:hover {
    transform: scale(1.1);
    transition: 0.2s ease;
}

.messageListInfo .userMessageArea {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    color: rgb(148, 148, 148);
}

.messageListInfo .userMessageAreaActive {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    color: rgb(179, 179, 179);
    font-family: "Poppins-Light";
}

.messageContent .takeMessageBox {
    background-color: white;
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
    border-bottom-right-radius: 10px;
    padding: 10px 20px;
    width: max-content;
    max-width: 90%;
    margin-bottom: 10px;
}

.messageContent .sendMessageBox {
    background-color: #dd4141aa;
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    color: white;
    padding: 10px 20px;
    width: max-content;
    max-width: 90%;
    margin-bottom: 10px;
}

.chatPanelLeftMenu {
    overflow-y: scroll;
}

.chatPanelLeftMenu::-webkit-scrollbar {
    width: 5px;
}

.chatPanelLeftMenu::-webkit-scrollbar-thumb {
    background-color: #dd414168;
    border-radius: 8px;
}

.appointmentPsyChoiceArea {
    padding: 50px 0;
}

.appointmentPsy {
    width: 180px;
    flex-direction: column;
}

.appointmentPsyChoiceArea .appointmentDetailPhoto {
    width: 200px;
    height: 200px;
    box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;
    border-radius: 8px;
}

.appointmentDetailPhoto img {
    border-radius: 8px;
    height: 100%;
    object-fit: cover;
}

.appointmentPsyChoiceArea .choicePsy {
    padding: 20px 10px 10px 10px;
    font-weight: 600;
}

.choicePsy select {
    outline: none;
    width: 100%;
    height: 40px;
    padding: 10px 15px;
    margin-top: 20px;
    border-radius: 10px;
    border: none;
    background-color: #e7e7e7db;
    box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;
}

.paymentSelect select {
    outline: none;
    width: 100%;
    height: 40px;
    padding: 10px 15px;
    margin-top: 20px;
    border-radius: 10px;
    border: none;
    background-color: #f5f5f5;
}

.choicePsy select option {
    background-color: #e7e7e7db;
    color: var(--second_color);
    padding: 10px;
}

.paymentSelect select option {
    background-color: #f5f5f5;
    color: var(--second_color);
    padding: 10px;
}

.psychologistInfo {
    padding: 20px;
    padding-left: 0;
    text-align: justify;
}

.psychologistName {
    font-weight: 600;
    font-size: 18px;
    padding: 20px 10px 0 0px;
}

.psyName {
    font-weight: 600;
    color: var(--second_color);
}

.psyDateTimeTitle {
    font-weight: 600;
    color: var(--second_color);
    font-size: 13px;
}

.psyDateTimeInfo {
    gap: 10px;
}

.psyDep {
    color: var(--second_color);
    font-family: "Poppins-Light";
    font-size: 12px;
}

.apointmentPsyOuter {
    border: 1px solid #e1e1e1;
    border-radius: 5px;
    padding: 10px;
}

.apointmentPsyOuterInfo {
    border-bottom: 1px solid #e1e1e1;
    border-right: 1px solid #e1e1e1;
    border-left: 1px solid #e1e1e1;
    border-radius: 5px;
    padding: 10px;
}

.cardInfoTitle {
    font-weight: 600;
}

.modalTitleArea h5 {
    font-weight: 600;
}

.psychologistPrice {
    font-weight: 600;
    font-size: 22px;
    padding: 20px 10px 0 0px;
    color: var(--main_color);
}

.psyPrice {
    font-weight: 600;
    color: var(--main_color);
}

.choicePsy select option:nth-child(1) {
    font-weight: 600;
    color: var(--second_color);
    display: flex;
    text-align: center;
}

.calenderOuter {
    border: 1px solid #e1e1e1;
}

.calenderOuter .calendarTopArea {
    padding: 15px;
    border-bottom: 1px solid #dadada;
    background-color: var(--second_color);
}

.calenderOuter .calendarMiddleArea {
    font-weight: 600;
    color: white;
}

.calenderOuter .calendarRigtLeftArea i {
    color: var(--main_color);
    cursor: pointer;
}

.calenderOuter .calendarWeek .days {
    flex: 1;
    text-align: center;
    cursor: pointer;
    font-weight: 600;
}

.calendarWeek {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}

.calendarBody {
    padding: 5px;
}

.selectedDay {
    background-color: var(--main_color);
    border-radius: 8px;
    color: white;
    font-weight: 600;
}

.disabledDay {
    color: #c7c7c7;
}

.calendarHours .calenderHoursInner {
    width: 120px;
    border-radius: 10px;
    border: 1px solid var(--main_color);
    padding: 10px 15px;
    color: var(--second_color);
    cursor: pointer;
    user-select: none;
    font-size: 13px;
    text-align: center;
    font-weight: 600;
}

.calendarHours .calenderHoursInner:hover {
    color: white;
    background-color: var(--main_color);
}

.calenderHoursInnerActive {
    color: white !important;
    background-color: var(--main_color);
}

.meetingDayTitle {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 15px;
}

.meetingDayTitle span {
    font-size: 16px;
    font-weight: 600;
    color: var(--main_color);
}

.paymentButtonDesign {
    background-color: var(--second_color);
    color: white;
    padding: 10px 20px;
    border-radius: 8px;
    border: none;
}

.paymentButtonDesign2 {
    border: 1px solid var(--second_color);
    color: white;
    padding: 10px 20px;
    border-radius: 8px;
    border-width: 1px;
    width: 80%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.contentInner {
    border: 1px solid #e1e1e1;
    border-radius: 5px;
    padding: 0 10px 22px 10px;
}

@media(max-width:991px) {
    .infoContentWrapper {
        padding-left: 45px;
    }

    .blogInner {
        margin-bottom: 25px;
    }

    .blogBoxBody {
        padding: 33px 16px;
    }

    .aboutOuter .agreementDesc {
        margin-top: 30px;
    }

    .contactDetailArea .contactIcon {
        border: 1px solid var(--main_color);
        height: 40px;
        width: 40px;
        border-radius: 20px;
        color: var(--main_color);
        margin-top: 20px;
    }

    .descBranchWrite {
        text-align: center;
    }

    .profileLeftMnuTitle {
        margin-top: 30px;
    }

    .profileSettingsOuter {
        padding: 10px;
    }

    .profilePasswordTextArea {
        text-align: center;
    }

    .workingHoursOuter .workingHoursCard {
        display: flex;
        align-items: center;
        justify-content: space-around;
        gap: 15px;
    }

    .workingHoursCard .workinHoursLeftArea {
        margin-top: 10px;
    }


}

@media(max-width:576px) {
    .teamMemberOuter .teamInner {
        width: 80%;
        height: 300px;
        position: relative;
    }

    .memberBoxArea {
        display: flex;
        justify-content: center;
    }

    .workingHoursCard .workinHoursLeftArea {
        display: flex;
        justify-content: center;
        align-items: center;
        margin-top: 10px;
    }

}

@media(max-width:500px) {
    .choiceInner {
        flex-direction: column;
    }

    .appointmentDetailPhotoWrapper {
        width: 100%;
    }
}

.error_page_outer
{
    width:100%;
    min-height:20px;
    float:left;
}

.error_page_inner
{
    width:100%;
    min-height:60vh;
    float:left;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction: column;
    padding:50px 0px;
}

.error_page_inner h1
{
    font-size:65px!important;
    font-weight:600;
}

.error_page_inner h2
{
    font-size:25px;
    font-weight:600;
}

.error_page_inner p
{
    font-size:15px;
    font-weight:500;
    margin-top:10px;
    color:var(--main_color);
}

.custom_blog_box_outer
{
    width:100%;
    min-height:50px;
    float:left;
    border-radius:10px;
    overflow:hidden;
}

.custom_blog_box_image_outer
{
    width:100%;
    height:200px;
    float:left;
    position:relative;
}

.custom_blog_box_image_outer img
{
    width:100%;
    height:200px;
    object-fit: cover;
    object-position: center;
    position:relative;
    z-index:1;
}

.custom_blog_box_tag
{
    min-width:10px;
    height:30px;
    background-color:#2b2a4cd6;
    position:absolute;
    top:10px;
    right:10px;
    z-index:9;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0px 15px;
    color:#fff;
    font-size:15px;
    font-weight:400;
    border-radius:5px;
}

.custom_blog_box_contents_outer
{
    width:100%;
    min-height:20px;
    background-color:#f5f5f5;
    padding:15px;
    float:left;
}

.custom_blog_box_contents_outer h3
{
    width:100%;
    font-size:15px;
    font-weight:600;
    color:var(--main_color);
    margin-bottom:10px;
    float:left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.custom_blog_box_contents_outer p
{
    width:100%;
    height:65px;
    font-size:14px;
    font-weight:400;
    color:#333;
    margin-bottom:5px;
    float:left;
}

.custom_blog_box_button
{
    width:100%;
    height:35px;
    float:left;
    background-color:var(--second_color);
    display:flex;
    align-items:center;
    justify-content:center;
    margin-top:10px;
    border-radius:5px;
    color:#fff;
    font-weight:500;
    cursor:pointer;
}

@media only screen and (max-width: 950px) 
{
    .blogDetailInfo 
    {
        padding: 15px!important;
    }

    .blogDetailInfo .blogwriter 
    {
        display:none!important;
    }

    .blogDetailOuter
    {
        height:250px;
    }

    .blogDetailContent 
    {
        padding: 15px !important;
        margin: 0px !important;
    }

    .teamDetailInfoArea
    {
        flex-direction: column!important;
        margin-top:15px;
        gap:10px;
    }
}

.custom_slider_boxes
{
    width:100%;
    height:calc(100vh - 120px);
    position:relative;
}

.custom_slider_outer
{
    width:100%;
    height:calc(100vh - 120px);
    position:relative;
}

.custom_slider_outer video
{
    width:100%;
    height:100%;
    position:absolute;
    left:0px;
    top:0px;
    object-fit: cover;
    object-position: center;
    z-index:1;
}

.custom_slider_outer image
{
    width:100%;
    height:100%;
    position:absolute;
    left:0px;
    top:0px;
    object-fit: cover;
    object-position: center;
    z-index:1;
}

.custom_slider_contents_outer
{
    width:100%;
    height:100%;
    position:absolute;
    left:0px;
    top:0px;
    z-index:3;
    background-color:#00000072;
    display:flex;
    align-items:center;
    justify-content:center;
}

.custom_slider_contents_inner
{
    width:100%;
    min-height:10px;
    float:left;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction: column;
}

.custom_slider_contents_inner h3
{
    font-size: 30px;
    font-weight: bold;
    color: white;
    letter-spacing: 2px;
    margin:0px;
    margin-bottom:10px;
}

.custom_slider_contents_inner h4
{
    font-size: 20px;
    font-weight: 500;
    color: white;
    letter-spacing: 1px;
    margin:0px;
    margin-bottom:30px;
}

.slider_buttons_outer
{
    width:100%;
    min-height:20px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:20px;
}

.slider_button
{
    min-width:10px;
    min-height:10px;
    color:#fff;
    padding:8px 17px;
    font-weight:500;
    background-color:var(--main_color);
    border-radius:25px;
    text-decoration: none!important;
    cursor:pointer;
}

.custom_blog_numbers_outer
{
    width:100%;
    min-height:10px;
    background-color:#f5f5f5;
    float:left;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    padding:10px;
    border-radius:10px;
}

.custom_blog_number_box
{
    width:30px;
    height:30px;
    background-color:#fff;
    float:left;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:15px;
    font-weight:500;
    color:#333;
    cursor:pointer;
    border-radius:7px;
}

.custom_blog_number_box_select
{
    background-color:var(--second_color);
    color:#fff;
}

.skiptranslate
{
    margin-top:-40px!important;
}

.skiptranslate iframe
{
    visibility: hidden!important;
    margin-top:-40px!important;
}

.languageOuter .skiptranslate
{
    color:#fff!important;
    font-size:0px!important;
    margin-top:0px!important;
}

.languageOuter * select 
{
    width: 100px !important;
    height: 33px !important;
    font-size: 14px !important;
    color: #333;
    border: 0px !important;
    outline: 0px !important;
    box-shadow: none!important;
    margin:0px!important;
    border:1px solid #2b2a4c9a!important;
    border-radius:5px;
}

.languageOuter * span
{
    display:none;
}

.messageBadge
{
    background-color: #ff0000;
    color: #fff;
    padding: 3px 7px;
    font-size: 9px;
    padding-right: 9px;
    border-radius: 5px;
    margin-top: -1px;
    float: right;
    padding-top: 5px;
}

.mobileMenuBtn
{
    display:none!important;
}

.menuProfileOuter
{
    display:flex!important;
}

.navbarNew
{
    display:flex;
}

@media only screen and (max-width: 950px) 
{   
    .navbarNew
    {
        display:none;
    }

    .navbar
    {
        z-index: 999;
        width: 100%;
        height: auto;
        display: none;
        position: absolute!important;
        top: 130px;
        background-color: #f5f5f5;
        left: 0px;
    }

    .menuProfileOuter
    {
        display:none!important;
    }

    .navbarDropdownOuter
    {
        width: 100%;
        position:relative!important;
        margin-bottom: 15px;
    } 

    .navbarItem
    {
        width: 100%;
        height: auto;
        padding: 10px;
        display:block!important; 
    }

    .mobileMenuBtn
    {
        display:block!important;
    }

    .custom_slider_contents_inner h3
    {
        text-align:center;
    }

    .custom_slider_contents_inner h4
    {
        text-align:center;
    }

    .slider_buttons_outer
    {
        flex-direction: column;
    }

    .aimBox
    {
        width:100%!important;
        height:auto!important;
    }

    .aimBoxInner
    {
        height:auto!important;
    }

    .infoContentWrapper
    {
        padding: 0px 20px !important;
    }

    .footerTitle
    {
        text-align:left!important;
    }

    .footerItem
    {
        width:100%;
    }

    .footerTextArea
    {
        padding:15px 0px;
    }
    
    .footer
    {
        padding:0px 15px;
    }

    .footerBottom 
    {
        width:calc(100% + 30px);
        margin:0px -15px;
        padding:10px 0px;
        flex-direction: column;
        gap:7px;
    }

    .footerBottomText
    {
        width:100%;
        text-align:center;
    }
}