@import "style.css";

/*default class*/
body{
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}
.transition-me{
    -weebkit-transition: all 0.3s ease-in-out;
    -noz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.index_over{
    z-index: 100
}
button:focus:not(:focus-visible),
button,
select,
input,
textarea{
    outline: none
}
.rounded{
    border-radius: 8px !important
}
.carousel-control-next:focus, .carousel-control-next:hover, .carousel-control-prev:focus, .carousel-control-prev:hover,
.carousel-control-next, .carousel-control-prev{
    opacity: 1
}
.point{
    cursor: pointer;
}
.row{
    margin-right: 0px;
    margin-left: 0px;
}
.teny_font{
    font-size: 14px
}
.back_me{
    background: transparent
}
fieldset{
    display: block;
    border-width: 2px !important;
    border-style: groove !important;
    border-color: threedface !important;
    border-image: initial !important;
}
fieldset > legend{
    margin-left: 30px
}
legend{
    float: none;
    width:auto
}
/*main-class*/
:root{
    --main--color: #ec1f24;
    --second--color: #f5e49e;
}
.main_color{
    color: var(--main--color);
}
.second_color{
    color: var(--second--color);
}
.main_bg{
    background: var(--main--color);
}
.second_bg{
    background: var(--second--color);
}
.main_bt{
    background: var(--main--color);
    color: #FFF;
}
.main_bt:hover{
    background: #000;
    color: #FFF;
}
.last_bt{
    background: #000;
    color: #FFF;
}
.last_bt:hover{
    background: var(--main--color);
    color: #FFF;
}
.my_light{
    font-weight: 300 !important;
}
.main_link{
    color: #000;
}
.main_link:hover{
    color: var(--main--color)
}
.second_link_1{
    color: var(--main--color)
}
.second_link_1:hover{
    color: #000
}
.second_bt{
    background: transparent;
    color: var(--main--color);
    border: 2px solid #DDD
}
.second_bt:hover{
    background: #FFF;
    color: var(--main--color);
}
.my_border{
    border: 1px solid var(--main--color)
}
/*start main_slider*/
.main_slider .inside_slide{
    position: absolute;
    top: 0px;
    margin: auto;
}
.main_slider h2.font-weight-bold.main_color{
    border-bottom: 5px solid var(--main--color);
    padding-bottom: 30px;
}
.my_down{
    position: absolute;
    bottom: -40px;
    margin: auto;
    color: #FFF;
    background: var(--main--color);
    width: 80px;
    height: 80px;
    border-radius: 50%;
}
.my_down:hover{
    background: #FFF;
    color: var(--main--color);
}
/*strat teams*/
.back_color{
    width: 260px;
    height: 710px;
    background: #EC1F24 0% 0% no-repeat padding-box;
    opacity: 0.36;
    display: flex;
    align-items: center;
    justify-content: center
}
/*start follow*/
.overflow{
    position: absolute;
    top: 0px;
    left: -380px;
    width: 100%;
    height: 100%;
}
.back_over{
    background: rgba(0, 0, 0, 0.6);
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center
}
.back_over i{
    color: #FFF;
}
.back_over i:hover{
    color: var(--main--color)
}
.my_follow:hover .overflow{
    left: 0px
}
/*start about us*/
.bread{
    color: #000;
    font-weight: 600;
    font-size: 20px
}
.bread:hover{
    color: var(--main--color);
}
.main_about .inside_about{
    position: absolute;
    top: 100px;
    margin: auto
}
.video .position-relative{
    overflow: hidden
}
.video .inside_video{
    position: absolute;
    width: 100%;
    height: 100%;
    top: -300px;
    left: 0px;
}
i.icon-youtube-play.display-1.transition-me{
    color: #FFF
}
.main_bold{
    font-weight: 700
}
.video .position-relative:hover .inside_video{
    top: 0px
}
.video .inside_video i:hover{
    color: var(--main--color);
    cursor: pointer
}
/*start history*/
.main_history .inside_history{
    position: absolute;
    top: 50px;
    margin: auto
}
.my_line_hight{
    height: 420px;
    width: 5px;
    background: #FFF;
    margin: auto;
}
.link_history{
    color: #FFF
}
.link_history:hover{
    color: #FFF
}
/*start gallery*/
.gallery img{
    width: 100%;
}
.gallery .thumbnails{
    overflow: hidden;
}
.gallery .thumbnails img{
    cursor: pointer;
    -webkit-transition: all .5s ease-in-out;
    -mox-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
}
.gallery .thumbnails img:not(:last-child){margin-right: 0.5%;}
/*start news*/
.myslide{
    height: 70px;
    width: 70px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--main--color);
    color: #FFF;
    border-radius: 50%;
}
.myslide:hover{
    background: #FFF;
    color: var(--main--color);
}
.myslide_2{
    height: 70px;
    width: 70px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--main--color);
    color: #FFF;
    border-radius: 10%;
}
.myslide_2:hover{
    background: #000;
    color: #fff;
}
/*start details*/
.discription .nav-tabs{
    border-bottom: 5px solid var(--main--color)
}
.discription .nav-tabs .nav-item.show .nav-link, .discription .nav-tabs .nav-link.active{
    background: transparent;
    color: #000;
    border: none;
}
.discription .nav-tabs .nav-link{
    background: var(--main--color);
    color: #FFF;
    border: none;
    border-radius: 0
}
/*start cart*/
.color_cart{
    background: #EEE;
    color: #000
}
.text-line{
    height: 3px
}
i.icon-bin.h3.transition-me.position-absolute.point{
    top: 0px;
    right: 20px
}
/*start profile*/
.profile .nav-pills .nav-link.active{
    background: var(--main--color);
    color: #FFF
}
.profile .nav-pills .nav-link.active:hover{
    background: #000;
    color: #FFF
}
.profile .nav-pills .nav-link{
    color: #000
}
.profile .nav-pills .nav-link:hover{
    color: var(--main--color)
}
.current-inside.py-2.shadow-sm.text-center{
    display: none
}
.inprofile .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active{
    background: var(--main--color);
    color: #FFF;
    border: 0px
}
.nav-tabs .nav-link{
    border: none !important;
    color: #000;
    font-size: 22px;
    font-weight: 600
}
/*start login*/
i.icon-user.main_color.h3.position-absolute,
i.icon-lock.main_color.h3.position-absolute,
i.icon-mobile.main_color.h1.position-absolute{
    left: 12px;
    top: 17px;
}
/*start online shop*/
.online .nav-pills .nav-link.active, .online .nav-pills .show>.nav-link{
    background: var(--main--color);
    color: #FFF;
    width: 100%
}
.online ul#pills-tab{
    display: flex;
    justify-content: space-between;
    border: 1px solid #CCC
}
.online .nav-pills .nav-link{
    color: #000;
    font-size: 30px;
    font-weight: bold;
}
.online .nav-pills .nav-link:hover{
    color: #000;
}
.online li.nav-item{
    width: 20%;
    display: flex;
    justify-content: center
}
/*start result_2*/
.table>:not(:last-child)>:last-child>*{
    color: #000;
    text-align: center;
    font-weight: bold
}
.table table.dataTable thead .sorting{
    background-image: none;
    color: #000
}
.table div#example_filter,
.table div#example_length{
    color: #000
}
.table .dataTables_wrapper .dataTables_filter input,
.table .dataTables_wrapper .dataTables_length select{
    color: #FFF;
    background-color: transparent;
    margin: 10px
}
.table select{
    background: #000 !important;

}
.table div#example_info{
    display: none
}
.table td.sorting_1{
    padding: 22px !important
}
.table table.dataTable.stripe tbody tr.odd, .table table.dataTable.display tbody tr.odd, .table table.dataTable.display tbody tr.odd td.sorting_1{
    background-color: #e2e2e2;
}
.table table.dataTable.stripe tbody tr.even, .table td.sorting_1, .table table.dataTable.display tbody tr.even, .table table.dataTable.display tbody tr.even td.sorting_1{
    background-color: #b7b7b7;
}
table.dataTable thead .sorting_asc{
    background-image: none !important
}
table.dataTable thead th, table.dataTable thead td{
    border-bottom: none
}
.table tbody, td, tfoot, th, thead, tr{
    color: rgba(0 0 0 / 50%)
}
.table table.dataTable.no-footer{
    border-bottom: 0px
}
.table a#example_previous{
    color: #000 !important;
}
.table a#example_next{
    color: #000 !important
}
.table .dataTables_wrapper .dataTables_paginate .paginate_button.current, .table .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover{
    background: #000;
    color: #FFF !important;
    border: 1px solid #FFF
}
.table .dataTables_wrapper .dataTables_paginate .paginate_button{
    color: #000 !important;
}
.table .dataTables_wrapper .dataTables_paginate .paginate_button:hover{
    color: #000 !important;
    background: transparent;
    border: 1px solid #FFF;
    -weebkit-transition: all 0.3s ease-in-out;
    -noz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
/*start event*/
.event td.my_border{
    color: var(--main--color)
}


