/* Add here all your CSS customizations */
.blue-foreground {
    color: #0000ff;
    font-size: 1.1rem;
}

.smart-home-products h4 {
    font-size: 24px;
    line-height: 40px;
}

.smart-home-products p {
    font-size: 20px;
    line-height: 40px;
}

.owl-stage-outer {
    direction: ltr;
}

.arabic-rtl-right {
    direction: rtl;
    text-align: right;
}

.modal-force-right {
    direction: rtl !important;
    text-align: right !important;
}

.icon-custom-size {
    height: 20%;
    width: 20%;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.center-text-align {
    text-align: center;
}

.english-button {
    margin-right: 20px;
    display: inline-block;
    background-color: #000000;
    color: #ffffff;
    padding: 5px 10px;
    border-radius: 5px;
}

.arabic-button {
    margin-left: 20px;
    display: inline-block;
    background-color: #000;
    color: #fff;
    padding: 5px 10px;
    border-radius: 5px;
}

.arabic-home-p-style {
    font-size: 26px;
    color: #0000ff;
}

.services-headers-margin {
    margin-left: 12px;
    margin-right: 12px;
}

.services-p-left-align {
    text-align: left;
}

.services-p-right-align {
    text-align: right;
}

.scrollable-logos {
    overflow-y: scroll;
}

.strokeme {
    color: white;
    text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000,
        1px 1px 0 #000;
}

.home-main-slider {
    z-index: 5;
    color: black !important;
}

.home-main-slider-line-breaker {
    z-index: 5;
    font-family: Shadows Into Light, cursive;
    font-size: 5.2em;
    padding-top: 5px;
}

.home-main-slider-line-breaker-ar {
    z-index: 5;
    font-family: 'Harmattan', sans-serif;
    font-size: 5.2em;
    padding-top: 5px;
}

.home-slider-buttons {
    font-family: 'Krona One', sans-serif;
}

.old-price{ margin-top: 10px; font-size:0.8em;  text-decoration: line-through;  color:grey;}
.new-price{  color:#8B0000; line-height: 1.1; }

.center-image {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 50%;
}

.modal-button {
    background-color: white!important;
    border: 1px solid #73B2FF!important;
    color: #73B2FF!important;
}

.modal-button:hover{
    background-color: #73B2FF!important;
    color: white!important;

}

.modal-button-s {
    background-color: #73B2FF!important;
    color: white!important;
}

.modal-button-s:hover{
    background-color: white!important;
    border: 1px solid #73B2FF!important;
    color: #73B2FF!important;

}

.modal-p {
    text-align: center!important;

}

.modal-confirm {
    color: #434e65;
}
.modal-confirm .modal-content {
    padding: 20px;
    font-size: 16px;
    border-radius: 5px;
    border: none;
}
.modal-confirm .modal-header {
    background: #73B1FF;
    border-bottom: none;
    position: relative;
    text-align: center;
    margin: -20px -20px 0;
    border-radius: 5px 5px 0 0;
    padding: 35px;
    align-items: center!important;
    display: block!important;
}
.modal-confirm h4 {
    text-align: center;
    font-size: 36px;
    margin: 10px 0;
}
.modal-confirm .form-control, .modal-confirm .btn {
    min-height: 40px;
    border-radius: 3px;
}
.modal-confirm .close {
    position: absolute;
    top: 15px;
    right: 15px;
    color: #fff;
    text-shadow: none;
    opacity: 0.5;
}
.modal-confirm .close:hover {
    opacity: 0.8;
}
.modal-confirm .icon-box {
    color: #fff;
    width: 95px;
    height: 95px;
    display: inline-block;
    border-radius: 50%;
    z-index: 9;
    border: 5px solid #fff;
    padding: 15px;
    text-align: center;
}
.modal-confirm .icon-box i {
    font-size: 64px;
    margin: -4px 0 0 -4px;
}
.modal-confirm.modal-dialog {
    margin-top: 80px;
}
.modal-confirm .btn {
    color: #fff;
    border-radius: 4px;
    background: #73B1FF;
    text-decoration: none;
    transition: all 0.4s;
    line-height: normal;
    border-radius: 30px;
    margin-top: 10px;
    padding: 6px 20px;
    border: none;
}
.modal-confirm .btn:hover, .modal-confirm .btn:focus {
    background: white;
    color: black;
    border: 1px solid #73B2FF;
}
.modal-confirm .btn span {
    margin: 1px 3px 0;
    float: left;
}
.modal-confirm .btn i {
    margin-left: 1px;
    font-size: 20px;
    float: right;
}
.trigger-btn {
    display: inline-block;
    margin: 100px auto;
}
.social-icons li.social-icons-tiktok svg {
    position: relative;
    top: calc(50% - 12px);
}
.social-icons li:hover.social-icons-tiktok a {
    background: rgb(254, 44, 85);
}