.dashboard { width: 100%; margin-top: -5px; padding: 40px 0; } .dashboard h1{ text-align: right; font-size: 18px; margin: 10px 0; padding: 10px 0; } .dashboardItem-w { width: 90%; height: 180px; background-color: #f1f1f1; border-radius: 10px; color: #bda380; border: 1px solid #bda380; border-top: 0; font-family: 'Cairo', sans-serif; transition: all 05s; } .dashboardItem-w:hover img { -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */ filter: grayscale(100%); } .dashboardItem-w:hover h1 { color: #cdcdcd; } .dashboardItem-w h1 { font-size: 15px; margin: 5px 0; padding: 20px; background-color: #bda380; color: #fff; border-radius: 5px 5px 0 0; font-weight: bold; } .mainFooter-w { width: 100%; height: 288px; background: url('../../assets/image/footer.png') no-repeat center center; background-size: cover; margin-top: -13px; position: relative; direction: rtl; font-family: 'Cairo', sans-serif; } .serviceIcon-w { width: 50px; margin: 30px auto; height: 50px; } .serviceIcon-w img{ width: 100%; height: 100%; transition: all 0.5s; } @media(max-width: 767px){ .dashboardItem-w { width: 100%; } .dashboardItem-w h1 { font-size: 9px; } } @media(min-width: 768px) and (max-width: 991px) { .dashboardItem-w { width: 100%; } .dashboardItem-w h1 { font-size: 16px; } } /* @media(min-width: 992px) { .dashboardItem-w h1 { font-size: 20px; } } */