body {
    margin: 0;
    padding: 0;
    background-color: #fff;
    font-size: 16px;
    font-family: 'Source Sans Pro', sans-serif;
    -webkit-font-smoothing: subpixel-antialiased;
}

/*
 Primary Rules
*/

h1 {
    font-weight: 300;
    margin: 0px 0 0;
    font-size: 40px;
    color: var(--main-color);
    border-radius: 2px;
    font-family: 'Merriweather', serif;
    text-transform: capitalize;
}

h2 {
    color: var(--main-color) !important;
    font-size: var(--h2-font-size) !important;
    font-weight: 700;
    color: #000;
    font-family: 'Merriweather', serif;
    text-transform: capitalize;
}
.rol {
    color: var(--main-color) !important;
    font-size: var(--h3-font-size) !important;
    font-weight: 700;
    color: #000;
    font-family: 'Merriweather', serif;
    text-transform: capitalize;
}
.title{
    font-size: var(--h2-font-size) !important;
/*    font-weight: 700 !important;*/
}

h3 {
    font-size: var(--h3-font-size) !important;
    font-weight: bold;
    color: var(--main-color) !important;
    margin-bottom: 8px;
    line-height: 24px;
    font-family: 'Merriweather', serif;
    text-transform: capitalize;
}

h2,
h3 {
    margin-top: 5px
}

.add-detail {
    color: var(--main-color);
    display: inline-block;
    text-decoration: none;
    padding: 2px 4px;
    border-radius: 2px;
    margin-right: -2px;
    font-size: 14px;
}

.add-detail:hover {
    background-color: var(--main-color);
    color: #fff;
}

/*p {
    margin-bottom: 0px;
}*/

p,
ul>li {
    font-size: 16px;
}

/*
 Page Rules
*/

.page {
    width: 1000px;
    /*min-height: 29.7cm;*/
    margin: 1cm auto;
    background: white;
    padding: 0px 0px;
}

.grade-brack{
    color: #8b8b8b;
    margin-left: 10px;
}

.grade{
    color: var(--main-color);
    margin: 0px 3px;
}

.place{
    font-weight: 400;
    margin-left: 5px;
    color: var(--main-color);
}

.b-name{
    text-align: right;
    color: var(--main-color);
}

.profile-img {
    width: 130px;
    height: 130px;
    border-radius: 5px;
    margin-right: 15px;
}

.name strong {
    font-weight: bold;
}

.add {
    border-top: dotted 2px var(--main-color);
    border-bottom: dotted 2px var(--main-color);
    padding: 10px;
    margin: 20px 0;
}

.about {
    font-size: 16px;
    color: #555;
    line-height: 24px;
    margin: 5px 0px;
    font-weight: 400;
    font-family: 'Merriweather', serif;
}

.sec {
    margin-bottom: 20px;
}

.add a {
    font-size: 16px;
    margin-right: 15px;
}

.add a i {
    margin-right: 8px;
}

.subtitle {
    color: var(--main-color);
    font-size: var(--h3-font-size);
    font-weight: 700;
    color: #000 !important;
    font-family: 'Merriweather', serif;
    text-transform: capitalize;
}

.light-text {
    color: var(--secondary-color) !important;
    letter-spacing: 1px;
    font-size: 12px;
    line-height: 0px;
    font-weight: 600;
    text-transform: uppercase;
}

.subtext {
    font-size: 16px;
    color: #000;
}

.des {
    margin: 8px 0px 8px 0;
    font-weight: 400;
    font-size: 16px;
}

.div-ul-text ul {
    padding-left: 16px;
}

ul.skills {
    list-style: none;
    padding-left: 0px;
}

ul>li {
    /*margin-bottom: 10px;*/
}

li:marker {
    font-size: 20px;
}

p {
    font-size: 16px;
    /*margin-bottom: 16px;*/
}

.pl-30 {
    padding-left: 30px;
}

@media (min-width: 768px) {
    .container {
        max-width: 950px !important;
    }
}

@media print {
    .page {
        margin: 0;
        border: initial;
        border-radius: initial;
        width: initial;
        min-height: initial;
        box-shadow: initial;
        background: initial;
        page-break-after: always;
    }
    .page-break {
        page-break-before: always;
        padding-top: 30px;
    }
    body {
        font-size: 12pt;
    }
    h1 {
        font-size: 16pt;
    }
    h2 {
        font-size: 10pt;
    }
    h3 {
        font-size: 10pt;
        line-height: 12pt;
        margin-bottom: 6pt;
    }
    p,
    span,
    li,
    a,
    .des {
        font-size: 10pt !important;
    }
    ul {
        margin-bottom: 3pt
    }
    .light-text {
        font-size: 8pt !important;
    }
    .img-area .profile-img {
        max-width: 75pt;
        max-height: 75pt;
    }
    .about {
        /*line-height: 11pt;*/
        font-size: 9pt !important;
    }
    .add {
        margin: 10pt 0pt;
        padding: 2pt 10pt;
        border-top: 0.75pt dotted var(--main-color);
        border-bottom: 0.75pt dotted var(--main-color);
    }
    .sec {
        margin-bottom: 8pt;
    }
    .title{
        font-size: 12pt !important;
        margin-bottom: 4pt;
    }
    .subtitle {
        font-size: 10pt !important;
        margin-bottom: 4pt;
    }
    .line-break {
        height: 4pt;
    }
    .detail {
        margin-bottom: 8pt;
    }
    br {
        display: none;
    }
    ul.skills li,
    ul.certification li,
    ul.interest li,
    ul.language li {
        margin-bottom: 5pt;
    }
}