/*arabic styles*/ [dir="rtl"] { text-align: right; } [dir="rtl"] .container { direction: rtl; } [dir="rtl"] .row { direction: rtl; } [dir="rtl"] .col-lg-8 { text-align: right; } [dir="rtl"] .footer .footer-heading:after { left: auto; right: 0; } [dir="rtl"] .footer .footer-heading:after { right: 0; } [dir="rtl"] .arrows-container { flex-direction: row-reverse; justify-content: left !important; display:flex; } [dir="rtl"] label{ font-family: 'Montserrat', sans-serif; font-size: 16px; } [dir="rtl"] .action-btns{ display: flex; flex-direction: column; width: fit-content; margin: auto; } /*en styles*/ .navbar { font-family: 'Courier Prime', monospace; } h1, h2, h3, h4, h5, h6, p { font-family: 'Montserrat', sans-serif; } .bg-main{ background-color: #7F67A3; } .bg-sec { background-color: #7DC6B6; } .btn-main{ color: white; background-color: #7F67A3; } .main-color { color: #7F67A3; } .sec-color { color: #00A984; } .btn-green { background-color: #7DC6B6; } .btn-outline-main { color: #7F67A3; border-color: #7F67A3; } .white h1,h2,h3,h4,h5,h6 { color: white; } .swiper { width: 100%; height: auto; } .swiper-slide { text-align: center; font-size: 18px; background: #fff; display: flex; justify-content: center; align-items: center; padding: 20px; } .swiper-slide img { max-width: 100%; max-height: 200px; } .left-box { position: relative; text-align: left; padding: 20px; background-color: #7F67A3; color: #fff; height: 450px; } .category-image { max-width: 100%; max-height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .category-text { position: absolute; bottom: 10px; left: 10px; } .right-box { padding: 20px; } .product-card { border: 1px solid #ccc; padding: 10px; margin-bottom: 10px; } @media (max-width: 767px) { .product-card h3 { max-width: 100%; } } .product-card img { max-width: 100%; } .product-img { max-width: 100%; } .thumbnail-img { max-width: 100px; margin: 5px; cursor: pointer; } .img-fixed-height { height: 200px; } .category { text-transform: capitalize; font-weight: 700; color: #9A9A9A; } .nav-item .nav-link, .nav-tabs .nav-link { -webkit-transition: all 300ms ease 0s; -moz-transition: all 300ms ease 0s; -o-transition: all 300ms ease 0s; -ms-transition: all 300ms ease 0s; transition: all 300ms ease 0s; } .tab-card a { -webkit-transition: all 150ms ease 0s; -moz-transition: all 150ms ease 0s; -o-transition: all 150ms ease 0s; -ms-transition: all 150ms ease 0s; transition: all 150ms ease 0s; } [data-toggle="collapse"][data-parent="#accordion"] i { -webkit-transition: transform 150ms ease 0s; -moz-transition: transform 150ms ease 0s; -o-transition: transform 150ms ease 0s; -ms-transition: all 150ms ease 0s; transition: transform 150ms ease 0s; } [data-toggle="collapse"][data-parent="#accordion"][aria-expanded="true"] i { filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2); -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } .now-ui-icons { display: inline-block; font: normal normal normal 14px/1 'Nucleo Outline'; font-size: inherit; speak: none; text-transform: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } @-webkit-keyframes nc-icon-spin { 0% { -webkit-transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); } } @-moz-keyframes nc-icon-spin { 0% { -moz-transform: rotate(0deg); } 100% { -moz-transform: rotate(360deg); } } @keyframes nc-icon-spin { 0% { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } } .now-ui-icons.objects_umbrella-13:before { content: "\ea5f"; } .now-ui-icons.shopping_cart-simple:before { content: "\ea1d"; } .now-ui-icons.shopping_shop:before { content: "\ea50"; } .now-ui-icons.ui-2_settings-90:before { content: "\ea4b"; } .nav-tabs { border: 0; padding: 15px 0.7rem; } .nav-tabs:not(.nav-tabs-neutral)>.nav-item>.nav-link.active { box-shadow: 0px 5px 35px 0px rgba(0, 0, 0, 0.3); } .card .nav-tabs { border-top-right-radius: 0.1875rem; border-top-left-radius: 0.1875rem; } .nav-tabs>.nav-item>.nav-link { color: #888888; margin: 0; margin-right: 5px; background-color: transparent; border: 1px solid transparent; border-radius: 30px; font-size: 14px; padding: 11px 23px; line-height: 1.5; } .nav-tabs>.nav-item>.nav-link:hover { background-color: transparent; } .nav-tabs>.nav-item>.nav-link.active { background-color: #444; border-radius: 30px; color: #FFFFFF; } .nav-tabs>.nav-item>.nav-link i.now-ui-icons { font-size: 14px; position: relative; top: 1px; margin-right: 3px; } .nav-tabs.nav-tabs-neutral>.nav-item>.nav-link { color: #FFFFFF; } .nav-tabs.nav-tabs-neutral>.nav-item>.nav-link.active { background-color: rgba(255, 255, 255, 0.2); color: #FFFFFF; } .tab-card { border: 0; border-radius: 0.1875rem; display: inline-block; position: relative; width: 100%; margin-bottom: 30px; box-shadow: 0px 5px 25px 0px rgba(0, 0, 0, 0.2); } .tab-card .tab-card-header { background-color: transparent; border-bottom: 0; background-color: transparent; border-radius: 0; padding: 0; } .tab-card[data-background-color="main"] { background-color: #7F67A3; } [data-background-color="main"] { background-color: #7F67A3; } @font-face { font-family: 'Nucleo Outline'; src: url("https://github.com/creativetimofficial/now-ui-kit/blob/master/assets/fonts/nucleo-outline.eot"); src: url("https://github.com/creativetimofficial/now-ui-kit/blob/master/assets/fonts/nucleo-outline.eot") format("embedded-opentype"); src: url("https://raw.githack.com/creativetimofficial/now-ui-kit/master/assets/fonts/nucleo-outline.woff2"); font-weight: normal; font-style: normal; } .now-ui-icons { display: inline-block; font: normal normal normal 14px/1 'Nucleo Outline'; font-size: inherit; speak: none; text-transform: none; /* Better Font Rendering */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } @media screen and (max-width: 768px) { .nav-tabs { display: inline-block; width: 100%; padding-left: 100px; padding-right: 100px; text-align: center; } .nav-tabs .nav-item>.nav-link { margin-bottom: 5px; } }