/*============================ FONTS ===============================*/
    @font-face {
        font-family: BahijP;
        src: url('Bahij_TheSansArabic/Bahij_TheSansArabic-Plain.ttf');
    }
    @font-face {
        font-family: BahijSB;
        src: url('Bahij_TheSansArabic/Bahij_TheSansArabic-SemiBold.ttf');
    }
    @font-face {
        font-family: BahijB;
        src: url('Bahij_TheSansArabic/Bahij_TheSansArabic-Black.ttf');
    }
    @font-face {
        font-family: BahijXB;
        src: url('Bahij_TheSansArabic/Bahij_TheSansArabic-ExtraBold.ttf');
    }
    body{
        font-family: BahijP;
        line-height: normal;
    }
    .bolded{
        font-family: BahijSB;
    }
    .x-bolded{
        font-family: BahijXB;
    }
    .black-bolded{
        font-family: BahijB;
    }
/*============================ REPORT COVER =======================*/
    #logo{
        width: auto;
        height: auto;
        /*max-width: 260px;*/
       max-height: 300px;
    }
    #cover-content h1{
        font-size: 5em;
    }
     
/*============================ REPORT BODY ========================*/
        #circles-list {
            width: 80%;
            max-width: 400px;
            display: block;
            margin: 0 auto;
        }
        #circles-list li {
            margin-bottom: 1em;
            text-align: center;
            padding: 1em;
            font-size: 1.2em;
            font-family: "BahijSB";
            border-radius: 0.2em;
            color: white;
        }
        #circles-description dd{
            margin-right: 1em; /* LTR Change - margin-left: 1em; */
        }
        #circles-description th{
            text-align: center;
        }
    /*======================== CIRCLE TYPE Section =============*/
        #circle-type h1 {
            font-size: 4em;
        }
        #circle-type ul {
            margin-right: 1.5em; /* LTR Change - margin-left: 1.5em; */
            position: relative;
        }
        #circle-type ul li {
            margin-bottom: 0.2em;
            position: relative;
        }
        #circle-type ul li:before {
            font-family: 'Glyphicons Halflings';
            content: "\e257";
            position: absolute;
            right: -1.5em; /* LTR Change - right: 50px; */
            font-size: 0.7em;
        }
        .sub-section{
            margin-bottom: 4em;
        }
        .sub-section:last-child{
            margin-bottom: 0;
        }
    /*======================== INTERSECTIONS Section ===========*/
        #intersections table thead th{
            line-height: 2em;
            text-align: center;
        }
    /*======================== PERSONALITY TYPE Section ========*/
        #personality-type>.container {
            position: relative;
        }
        #personality-type br {
            line-height: 2em;   
        }
        #personality-type dl{
            margin-bottom: 2em;
        }
        #personality-type dd{
            margin-right: 1em; /* LTR Change - margin-left: 1em; */
        }
        .type-graph {
            position:relative;
            float:left;
            left:0;
            display: none;
            margin-right: 0.5em;
        }
        .type-graph img {
            width:300px;
            float:left;
        }
        @media screen and (min-width: 992px) {
            .type-graph {
                display: block;
            }
        }
        
    /*======================== GENERAL GUIDANCE Section =======*/
        #general-guidance ul {
            margin-right: 1.5em; /* LTR Change - margin-left: 1.5em; */
            position: relative;
            counter-reset: section;
        }
        #general-guidance ul li {
            margin-bottom: 2em;
            position: relative;
        }
        #general-guidance ul li:before {
            counter-increment: section;
            content: counter(section);
            display: block;
            position: absolute;
            right: -1.5em; /* LTR Change - right: 50px; */
            font-size: 1em;
            width: 1em;
            height: 100%;
            background-color: #336699;
            color: #fff;
            text-align: center;
        }
    /*======================== GRAPH & TABLE Section =======*/
        #graph-table{
            text-align: center;
        }
        #graph-table table thead th{
            line-height: 2em;
            text-align: center;
        }
        #graph-table img{
            display: inline-block;
            max-width: 500px !important;
        }
/*======================== OTHER TYPES Section ========*/
        #other-types {
            position: relative;
        }
        #other-types .sub-section {
            padding: 1em;
            border-radius: 0.5em;
        }
        #other-types dt{
            /*display: inline-block;*/
        }
        #other-types dt:after{
            content: ":";
        }
        #other-types dd{
            /*display: inline;*/
            margin-right: 1em;
        }
        
/*====================== PDF BUTTON ==================*/
    #btn-PDF {
        position: fixed;
        display: block;
        z-index: 15;
        top: 50%;
        left: -7em;
        transform: translateY(-50%);
        border-radius: 0 1.75em 1.75em 0;
        background: transparent;
        color: #58595b;
        transition: all 0.4s ease-in-out;
    }
    #btn-PDF img {
        width: 3.5em;
    }
    #btn-PDF span {
        height: 3.5em;
        display: inline-block;
        line-height: 2.5em;
        padding: 0.5em;
        width: 7em;
        text-align: center;
    }
    #btn-PDF:hover {
        left: 0;
        color: #e14045;
        background: #fff;
    }