@font-face {
  font-family: mblack;
  src: url("../fonts/mBold.ttf");
}

/* @font-face {
  font-family: regular;
  src: url("../fonts/mRegular.ttf");
} */

h1 ,h2 ,h3 ,h4 ,h5 ,h6 {
    font-family: mblack;
}

p ,a ,span {
    font-family: mblack;
}

th{
    text-align: center;
}

html,body{
    height: 100%;
    
}

div[class*=col-]{
    float: right!important;
}

ul {
    margin: 0;
    padding: 0;
    list-style: none;
  }

body {
    overflow-x: hidden!important;
    background-color: #eeeeee!important;
    font-family: mblack;
    position: relative;
    
    overflow-y: scroll!important;
    scrollbar-color: #995e7c #35292c;

    background-image: url("../img/page_full.jpg");
    -ms-background-image: url("../img/page_full.jpg");
    -moz-background-image: url("../img/page_full.jpg");
    -webkit-background-image: url("../img/page_full.jpg");
    background-repeat: no-repeat;
    -ms-background-repeat: no-repeat;
    -moz-background-repeat: no-repeat;
    -webkit-background-repeat: no-repeat;
    background-size: cover;
    -ms-background-size: cover;
    -moz-background-size: cover;
    -webkit-background-size: cover;
    background-attachment: fixed;
    background-position-x: center;
}

/* scrollbar */
::-webkit-scrollbar{
    width: 1.2em;
    overflow-x: unset;
    height: 100vh!important;
    cursor: pointer;
}

::-webkit-scrollbar-track{
    background-color: #35292c;
    margin-block: 0.25em;
}

::-webkit-scrollbar-thumb{
    background-color: #995e7c;
}
/* scrollbar end */

.logo_wrapper{
    width: 100%;
    text-align: center;
    margin: 2rem 0;
}

.logo_sub{
    text-align: center!important;
    color: #015b77!important;
}

.logo{
    width: 70%;
    height: auto;
}

/* sub pages */
.sub_pages_logo_background_container{
    margin-top: 2rem;
}

.sub_pages_logo{
    width: 20%!important;
}

.sub_pages_contact{
    margin-top: 4rem;
    width:100%;
    height:100%;
    text-align: center;
}

.sub_pages_title{
    font-size: 2rem!important;
    color: #e2e3e4!important;
}

.sub_pages_paragraph_wrapper{
    font-size: 1.8rem!important;
    color: #e2e3e4!important;
    text-align: center!important;
    padding: 0!important;
}

.sub_pages_paragraph_wrapper .icon{
    padding: 1rem;
}
.sub_pages_paragraph{
    display: inline-block!important;
}
/* sub pages end */

.my_box{
    margin-top: 5rem;
    margin-bottom: 5rem;
}

.my_text_box {
    margin-top: 9rem;
    width:100%;
    /* height:100%; */
    opacity: 98%;
    text-align: center;
    padding: 2rem;
    box-shadow: 0px 0px 5px 0 rgb(49,37,40);
    background-color: rgb(49,37,40);
    background-image: linear-gradient(to top, rgb(49,37,40),  rgb(153,94,124));
    -ms-background-image: linear-gradient(to top, rgb(49,37,40),  rgb(153,94,124));
    -moz-background-image: linear-gradient(to top, rgb(49,37,40),  rgb(153,94,124));
    -webkit-background-image: linear-gradient(to top, rgb(49,37,40),  rgb(153,94,124));
}

.icon_wrapper{
    width: 40%;
    background-color: #312528;
    font-size: 5rem!important;
    color: #e2e3e4!important;
    text-align: center!important;
    margin: -6rem auto 2rem auto!important;
    border-radius: 50%;
    padding: 2rem;
}

.icon_wrapper .icon{
    padding: 4rem;
}

.service_end_text{
    margin: 1rem 0;
    opacity: 98%;
    text-align: center;
    padding: 2rem;
    box-shadow: 0px 0px 5px 0 rgb(49,37,40);
    background-color: rgb(49,37,40);
    background-image: linear-gradient(to top, rgb(49,37,40),  rgb(153,94,124));
    -ms-background-image: linear-gradient(to top, rgb(49,37,40),  rgb(153,94,124));
    -moz-background-image: linear-gradient(to top, rgb(49,37,40),  rgb(153,94,124));
    -webkit-background-image: linear-gradient(to top, rgb(49,37,40),  rgb(153,94,124));
}

.service_end_text .sub_pages_title{
    margin-top: 0!important;
}

.service_end_contact{
    margin-top: 5rem;
    text-align: center;
}
.cards{
    padding-bottom: 5rem!important;
}

.my_eff{
    background-color: rgb(100,52,95)!important;
    background-image: linear-gradient(to top, rgb(100,52,95),  rgb(10,33,71))!important;
    -ms-background-image: linear-gradient(to top, rgb(100,52,95),  rgb(10,33,71))!important;
    -moz-background-image: linear-gradient(to top, rgb(100,52,95),  rgb(10,33,71))!important;
    -webkit-background-image: linear-gradient(to top, rgb(100,52,95),  rgb(10,33,71))!important;
}

.cards .icon{
    padding: 1.5rem!important;
}

.cards .icon_wrapper{
    width: 50%!important;
    font-size: 4rem!important;
    padding: 4rem!important;
    margin: -9rem auto 2rem auto!important;
}

/* service-end page */
.service_end_page .sub_pages_logo{
    width: 25%!important;
}


.service_end_contact .sub_pages_logo{
    width: 15%!important;
}

.service_end_page .service_end_contact .sub_pages_title ,.service_end_page .service_end_contact .sub_pages_paragraph_wrapper{
    color: #efefef!important;
}
.service_end_page .service_end_contact .sub_pages_paragraph_wrapper_link{
    color: #efefef!important;
}

/* service-end page end */




/* responsive */
@media only screen and (max-width: 1024px) {
    .login_container{
        width: 70%!important;
    }
    
    /* .login_wrapper{
        padding-top: 0!important;
    } */

    .logo_sub{
        font-size: 1.3rem!important;
    }
    .table_attr {
        width: 40%!important;
    }

    .icon_wrapper .icon {
        padding: 2rem!important;
    }
}

@media only screen and (max-width: 768px) {
    .background{
        background-size: contain;
        -ms-background-size: contain;
        -moz-background-size: contain;
        -webkit-background-size: contain;

    }
    .objects_container{
        margin-top: 2rem!important;
    }
    .user_icon_wrapper{
        width: 30%!important;
    }
    
    .logo{
        width: 30%!important;
    }

    .logo_sub{
        font-size: 2rem!important;
    }

    .login_container {
        width: 50%!important;
    }
    .table_attr {
        width: 50%!important;
    }
    
    .my_text_box{
        margin-top: 5rem!important;
    }

    .icon_wrapper{
        width: 20%!important;
        font-size: 3rem!important;
        margin: -6rem auto 2rem auto!important;
    }

    .icon_wrapper .icon {
        padding: 2rem!important;
    }

    .service_end_page .sub_pages_logo {
        width: 60%!important;
    }
}

@media only screen and (max-width: 425px) {
    .body{
        background-image: url("../img/page_m.jpg");
        -ms-background-image: url("../img/page_m.jpg");
        -moz-background-image: url("../img/page_m.jpg");
        -webkit-background-image: url("../img/page_m.jpg");


        background-repeat: no-repeat;
        -ms-background-repeat: no-repeat;
        -moz-background-repeat: no-repeat;
        -webkit-background-repeat: no-repeat;

        background-size: cover;
        -ms-background-size: cover;
        -moz-background-size: cover;
        -webkit-background-size: cover;

        background-attachment: fixed;
    }

    .circle_eff{
        box-shadow: 0px 0px 15px 4px #1c363e;
    }

    .logo{
        width: 50%!important;
    }

    .logo_background_container .logo_wrapper .logo{
        width: 60%!important;
    }

    .logo_sub{
        font-size: 1.2rem!important;
    }

    .logo_wrapper .logo_wrapper_icon{
        width: 25%;
    }

    .my_text_box{
        margin-top: 6rem!important;
    }

    .icon_wrapper{
        width: 20%!important;
    }

    .icon_wrapper .icon {
        padding: 2rem!important;
    }

    .sub_pages_logo {
        width: 70%!important;
    }


    .sub_pages_title{
        font-size: 1.5rem!important;
    }

    .sub_pages_paragraph_wrapper{
        font-size: 1rem!important;
    }

    .service_end_page .sub_pages_logo {
        width: 60%!important;
    }
}

@media only screen and (max-width: 375px){
    .icon_wrapper{
        font-size: 3rem!important;
        width: 25%!important;
        margin: -7rem auto 2rem auto!important;
    }
    
    .icon_wrapper .icon {
        padding: 2rem!important;
    }
}

@media only screen and (max-width: 320px) {
    .login_container {
        width: 100%!important;
    }

    .logo{
        width: 60%!important;
    }
    
    .login_title{
        font-size: 2rem!important;
    }
    .logo_wrapper .logo_wrapper_icon{
        width: 25%;
    }

    .icon_wrapper{
        width: 25%!important;
    }
}
/* responsive end */



