#sec1 {
    display: none;
    background-repeat: no-repeat;
    background-size: cover;
    overflow: hidden;
}

#img_zoom:hover {
    cursor: zoom-in;
}

#setheight::-webkit-scrollbar {
    width: 10px;
}

#setheight::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px grey;
    border-radius: 10px;
}

.disabled {
    pointer-events: none;
}

#setheight::-webkit-scrollbar-thumb {
    background: orange;
    border-radius: 10px;
}

#setheight::-webkit-scrollbar-thumb:hover {
    background: orangered;
}

/* #sec_otr .container-fluid .row {
    justify-content: start !important;
} */

#specifications {
    text-size-adjust: 100%;
    font-family: Open Sans, Noto Nastaliq Urdu Draft, Roboto, Helvetica Neue, Helvetica, Arial, sans-serif;
    line-height: 35px;
    visibility: visible;
    box-sizing: inherit;
    text-decoration: none;
    width: 100%;
    height: 50px;
    font-size: 100%;
    color: white;
    position: relative;
    font-weight: 600;
    /*padding: 16px;*/
    margin-bottom: 5%;
    border-radius: 12px;
    text-align: center;
    background-color: orange !important;
    z-index: 22;
    background: radial-gradient(50% 50% at 50% 50%, rgb(0 123 255) 0, #004085 100%) no-repeat calc(200% - var(--i, 0)*100%) 100% / 200% calc(100%*var(--i, 0) + .08em);
    transition: .5s calc(var(--i, 0)*.3s), background-position .3s calc(.3s - calc(var(--i, 0)*.3s));
}

#specifications:hover {
    --i: 1;
    color: white;
}

#pictures {
    text-size-adjust: 100%;
    font-family: Open Sans, Noto Nastaliq Urdu Draft, Roboto, Helvetica Neue, Helvetica, Arial, sans-serif;
    line-height: 35px;
    visibility: visible;
    box-sizing: inherit;
    text-decoration: none;
    width: 50%;
    height: 50px;
    font-size: 100%;
    color: white;
    position: relative;
    font-weight: 600;
    /*padding: 16px;*/
    margin-bottom: 5%;
    border-radius: 12px;
    text-align: center;
    background-color: orange !important;
    z-index: 22;
    background: radial-gradient(50% 50% at 50% 50%, rgb(0 123 255) 0, #004085 100%) no-repeat calc(200% - var(--i, 0)*100%) 100% / 200% calc(100%*var(--i, 0) + .08em);
    transition: .5s calc(var(--i, 0)*.3s), background-position .3s calc(.3s - calc(var(--i, 0)*.3s));
}

#pictures:hover {
    --i: 1;
    color: white;
}

.btncomparemob {
    text-size-adjust: 100%;
    font-family: Open Sans, Noto Nastaliq Urdu Draft, Roboto, Helvetica Neue, Helvetica, Arial, sans-serif;
    line-height: 1.5;
    visibility: visible;
    box-sizing: inherit;
    text-decoration: none;
    width: 100%;
    font-size: 100%;
    color: white;
    position: relative;
    font-weight: 600;
    /*padding: 16px;*/
    margin-bottom: 5%;
    border-radius: 12px !important;
    text-align: center;
    background-color: orange !important;
    z-index: 22;
    background: radial-gradient(50% 50% at 50% 50%, rgb(0 123 255) 0, #004085 100%) no-repeat calc(200% - var(--i, 0)*100%) 100% / 200% calc(100%*var(--i, 0) + .08em);
    transition: .5s calc(var(--i, 0)*.3s), background-position .3s calc(.3s - calc(var(--i, 0)*.3s)) !important;
}

.btn:focus {
    outline: 0;
    box-shadow: 0 0 0 .2rem rgb(0 0 0 / 0%);
}

#fullpage {
    position: fixed;
    z-index: 9999;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-size: contain;
    background-repeat: no-repeat no-repeat;
    background-position: center center;
    background-color: white;
    display: none;
    animation: fade 2s;
}

@keyframes fade {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.btncomparemob:hover {
    --i: 1;
    color: white !important;
}

#sectbl tr td a {
    color: black
}

#sectbl tr td a:hover {
    color: orange
}

#usr_logo {
    color: #fff;
    background-color: orangered;
    text-decoration: none;
    text-transform: uppercase;
    padding: 12px 20px 12px 20px;
    border-radius: 50px;
    box-shadow: 0 3px 6px rgb(0 0 0 / 20%);
    font-weight: 900;
}

#relatedlatestmobiles a {
    font-size: 12px;
    color: lightslategrey !important;
    font-weight: 400;
}

#relatedcomingsoonmobiles a {
    font-size: 12px;
    color: lightslategrey !important;
    font-weight: 400;
}

#relatedlatestmobiles .col-6 {
    background: linear-gradient(to left, whitesmoke 50%, lightblue 50%) right;
    background-size: 200%;
    transition: .5s ease-out;
}

#relatedcomingsoonmobiles .col-6 {
    background: linear-gradient(to left, whitesmoke 50%, lightblue 50%) right;
    background-size: 200%;
    transition: .5s ease-out;
}

#relatedlatestmobiles .col-6:hover {
    background-position: left;
}

#relatedcomingsoonmobiles .col-6:hover {
    background-position: left;
}

#relatedlatestmobiles a:hover {
    color: white !important;
    font-weight: 500;
}

#relatedcomingsoonmobiles a:hover {
    color: white !important;
    font-weight: 500;
}

#maintable table tbody .RowBG2 td:first-child {
    font-weight: bold;
    vertical-align: middle !important;
}

#maintable table tbody font, b {
    color: black;
    font-weight: normal;
}

#maintable {
    width: 100%;
    border: 1px solid orange;
}

#maintable th {
    border: 1px solid orange;
}

#maintable td {
    border: 1px solid orange;
}

#main2 {
    width: 100%;
    border: 1px solid orange;
}

.rating {
    display: flex;
    direction: row;
}

.rating .star {
    font-size: 2rem;
    color: #ccc;
    cursor: pointer;
}

.rating .star.selected,
.rating .star:hover,
.rating .star:hover ~ .star {
    color: #f39c12;
}

.rating-value {
    margin-top: 10px;
    font-size: 15px;
    font-weight: bold;
}

#main2 th {
    /*color: blueviolet;*/
    font-weight: bold;
    border: 1px solid orange;
}

#main2 td {
    border: 1px solid orange;
}

table tr td a {
    color: black !important;
}

#rltdtable tr:hover td a {
    color: white !important;
    text-decoration: none !important;
}

#rltdtable tr:hover td {
    background-color: coral !important;
}

#main2 tr th h2:first-child {
    font-size: 100%;
    font-weight: bold;
}

/*#main2 tr td:last-child {
    width: 50%;
}*/

/*table th {
    background-color: #dee2e6;
}

table td {
    background-color: #dee2e6;
}*/

table :first-child tr td a {
    /*pointer-events: none;
    cursor: default;
    color: #666666;*/
    display: none;
}

#shadow {
    box-shadow: 0 0 11px rgba(33, 33, 33, .1);
    background-color: white;
}

#sec_otr {
    box-shadow: 0 0 11px rgba(33, 33, 33, .2);
}

.box {
    transition: box-shadow .5s;
    box-shadow: 0 0 11px rgba(33, 33, 33, .1);
    width: 50%;
    /*height: 500px;*/
    /*margin: 50px;*/
    border-radius: 10px !important;
    border: 1px solid #ccc;
    background: #fff;
    /*float: left;*/
    color: black;
}

.box:hover {
    box-shadow: 0 0 11px rgba(33, 33, 33, .5);
    color: orange;
}

table {
    width: 100%;
}

table tbody tr th:first-child {
    width: 20%;
}

/* element.style {
    text-align: left;
    vertical-align: top;
} */

.specs-mainheading {
    padding: 10px 10px 10px 10px;
}

.bottom-border-section {
    border-bottom: 1px solid #ffc107;
}

.hdngArial {
    font-family: Arial, Helvetica, sans-serif;
    /* font-size: 9pt; */
    color: #666666;
    /* font-weight: bold; */
    padding-left: 4px;
    width: auto;
    background-color: white;
}

.bottom-border {
    border-bottom: 1px solid #ffc107;
}


.specs-value {
    padding-left: 6px;
    background-color: white;
    border-left: 1px solid #ffc107;
}

.specs {
    border-collapse: collapse;
    border: 1px solid #ffc107;
}

.fasla {
    padding-top: 3px;
    padding-right: 3px;
    padding-bottom: 3px;
}

.RowBG1 {
    background-color: white;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 100%;
    color: #666666;
    border: 1px solid orange;
    /* font-weight: bold; */
    padding: 1%;
    width: auto;
    word-wrap: break-word;
}

.loader {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: url('https://media.tenor.com/BINsHS7Uo-0AAAAi/temple-loader.gif') 50% 50% no-repeat rgb(255, 255, 255, 0.5);
}

#loader {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: url('https://media.tenor.com/BINsHS7Uo-0AAAAi/temple-loader.gif') 50% 50% no-repeat rgb(255, 255, 255, 0.5);
}

