@media screen and (max-width: 600px) {
    html {
        font-size: 14px;
    }
    /*
===============================================================================================
HEADING
===============================================================================================
*/
    .header-row h2 {
        margin-bottom: 0;
        font-size: 140%;
        width: 100%;
    }
    .header-row h3 {
        font-size: 50%;
        font-weight: 100;
        margin-top: 0;
    }
    .head-line-1 {
        font-size: 25%;
    }
    .main-logo-left {
        position: absolute;
        left: 5px;
        top: 5px;
        width: 10%;
        height: auto;
        border: 0;
        margin: 0px 5px;
        padding: 0;
    }
    .main-logo-right {
        position: absolute;
        right: 5px;
        top: 5px;
        width: 10%;
        height: auto;
        border: 0;
        margin: 0px 5px;
        padding: 0;
    }
    .heading-lines {
        margin-left: 0;
    }
    /*
===============================================================================================
MENU
===============================================================================================
*/
    .topbar {
        width: 100%;
        margin: 0;
    }
    .topbar button {
        display: none;
    }
    #topbar-col {
        margin-left: 0;
    }
    .topbar .top-dropdown {
        display: none;
    }
    .topbar .icon {
        float: left;
        display: block;
        width: 30px;
        padding-left: 10px;
        margin-top: 10px;
    }
    .sidebar .menu-button,
    .sidebar .side-dropbtn,
    .side-dropdown-content .sub-button {
        font-size: 80%;
    }
    /*
===============================================================================================
HOME
===============================================================================================
*/
    .home img {
        width: 80%;
        height: auto;
        margin-left: 25px;
    }
    .home h1 {
        font-size: 150%;
    }
    /*
===============================================================================================
MODAL
===============================================================================================
*/
    .modal {
        padding-top: 40px;
        background: radial-gradient(ellipse, rgb(122, 245, 122), #eebdf3 50%, #f459e7, #000);
    }
    .modal .wand__large__img {
        width: 70%;
        margin-bottom: 10px;
    }
    .modal .wand__pendant__price {
        width: 80%;
    }
    .modal .wand__desc__para {
        width: 80%;
        margin: auto;
        text-align: centre;
    }
    .modal .wand__price {
        padding-top: 20px;
        font-size: 175%;
        font-weight: bold;
    }
    .modal .prod__desc {
        width: 80%;
    }
    .modal .prod__options {
        width: 65%;
    }
    /*
===============================================================================================
ABOUT
===============================================================================================
*/
    .about .photo-img {
        width: 40%;
        padding: 0 0 10px 10px;
    }
    .about {
        width: 90%;
    }
    .about p {
        text-align: justify;
        font-size: 14px;
    }
    /*
===============================================================================================
CONTACT
===============================================================================================
*/
    .contact {
        width: 90%;
    }
    .contact h1 {
        font-size: 32px;
        font-weight: bold;
    }
    .contact p {
        font-size: 16px;
        margin: 10px auto 10px auto;
    }
    .contact a {
        font-size: 16px;
    }
    .contact .contact-photo {
        position: relative;
        margin-left: 20px;
        margin-right: 0;
    }
    .contact img {
        width: 15px;
        height: auto;
        padding-right: 10px;
    }
    .contact .contact-photo {
        width: 200px;
        margin: auto;
        margin-left: 65px;
        /* text-align: center; */
    }
    .contact .contact-img {
        position: relative;
        margin-top: 20px;
        width: 250px;
        height: auto;
    }
    .contact .initials {
        font-size: 10px;
    }
    /*
===============================================================================================
TESTIMONIALS
===============================================================================================
*/
    .testimonials {
        width: 90%;
        margin: auto;
    }
    .testimonials .main-img {
        width: 30%;
        margin: 0;
        right: 10%;
        top: 120px;
    }
    .testimonials h1 {
        font-size: 36px;
        margin-bottom: 0;
    }
    .testimonials p {
        text-align: justify;
        font-size: 14px;
    }
    /*
===============================================================================================
ANGEL CARD READING
===============================================================================================
*/
    .card-reading {
        width: 90%;
    }
    .card-reading p {
        text-align: justify;
        font-size: 14px;
    }
    .card-reading h1 {
        font-size: 24px;
        font-weight: bold;
    }
    .card-reading .card-photo {
        float: right;
        position: relative;
        margin-left: 10px;
        margin-right: 10px;
        margin-top: 12px;
        width: 150px;
        height: auto;
    }
    .card-reading img {
        width: 15px;
        height: auto;
        padding-right: 10px;
    }
    .card-reading .contact-photo {
        text-align: center;
    }
    .card-reading .initials {
        font-size: 10px;
    }
    /*
===============================================================================================
MEDITATION
===============================================================================================
*/
    .meditation {
        width: 90%;
    }
    .meditation p {
        text-align: justify;
        font-size: 14px;
    }
    .meditation h1 {
        font-size: 24px;
        font-weight: bold;
    }
    .meditation .chakra-photo {
        float: right;
        position: relative;
        margin-left: 0;
        margin-right: 0;
        height: 120px;
        width: auto;
    }
    .meditation .meditation-photo {
        position: relative;
        float: left;
        margin-right: 0;
        margin-bottom: 2px;
        width: 40%;
        height: auto;
    }
    .meditation img {
        width: 20px;
        height: auto;
        padding-right: 10px;
    }
    .meditation .contact-photo {
        text-align: center;
    }
    .meditation .initials {
        font-size: 10px;
    }
    /*
===============================================================================================
CRYSTAL HEALING
===============================================================================================
*/
    .crystal-healing {
        width: 90%;
    }
    .crystal-healing p {
        text-align: justify;
        font-size: 14px;
    }
    .crystal-healing li {
        font-size: 14px;
        padding-bottom: 0;
        margin-left: 30px;
    }
    .crystal-healing h1 {
        font-size: 24px;
        font-weight: bold;
    }
    .crystal-healing .benefits-list {
        font-size: 14px;
    }
    .crystal-healing ul {
        margin-left: 10px;
        padding-left: 0;
    }
    .crystal-healing .crystal-healing-photo {
        float: right;
        position: relative;
        margin-left: 0;
        margin-right: 0;
        height: auto;
        width: 130px;
    }
    .crystal-healing .contact-photo {
        /* margin-top: 10px; */
        width: 110px;
        margin-left: 0;
    }
    .crystal-healing img {
        width: 20px;
        height: auto;
        padding-right: 10px;
    }
    .crystal-healing .contact-photo {
        text-align: center;
    }
    .crystal-healing .initials {
        font-size: 10px;
    }
    /*
===============================================================================================
CRYSTAL COURSE
===============================================================================================
*/
    .crystal-course {
        width: 90%;
    }
    .crystal-course p {
        text-align: justify;
        font-size: 14px;
    }
    .crystal-course li {
        font-size: 14px;
    }
    .crystal-course h1 {
        font-size: 24px;
        font-weight: bold;
    }
    .crystal-course .left-list,
    .crystal-course .right-list {
        display: none;
    }
    .crystal-course .full-list {
        display: block;
    }
    .crystal-course .course-subjects {
        margin: 0;
        padding: 0;
    }
    .crystal-course .crystal-course-photo {
        float: right;
        position: relative;
        margin-top: -60px;
        margin-right: 0;
        margin-bottom: 5px;
        padding-left: 5px;
        height: auto;
        width: 120px;
    }
    .crystal-course .contact-photo {
        margin-top: 40px;
        width: 100px;
        float: left;
    }
    .crystal-course img {
        width: 20px;
        height: auto;
        padding-right: 10px;
    }
    .crystal-course .contact-photo {
        text-align: center;
    }
    .crystal-course .initials {
        font-size: 10px;
    }
    /*
===============================================================================================
ANGEL COURSE
===============================================================================================
*/
    .angel-course {
        width: 90%;
    }
    .angel-course p {
        text-align: justify;
        font-size: 14px;
    }
    .angel-course ul {
        margin-left: -10px;
        text-indent: 0;
    }
    .angel-course li {
        font-size: 14px;
    }
    .angel-course h1 {
        font-size: 24px;
        font-weight: bold;
    }
    .angel-course .angel-course-photo {
        float: right;
        position: relative;
        margin-right: -10px;
        padding-left: 5px;
        height: auto;
        width: 130px;
    }
    .angel-course .contact-photo {
        margin-top: 40px;
        width: 100px;
        float: left;
    }
    .angel-course img {
        width: 20px;
        height: auto;
        padding-right: 10px;
    }
    .angel-course .contact-photo {
        text-align: center;
    }
    .angel-course .initials {
        font-size: 10px;
    }
    /*
===============================================================================================
MANIFESTATION COURSE
===============================================================================================
*/
    .manifestation {
        width: 90%;
    }
    .manifestation p {
        text-align: justify;
        font-size: 14px;
    }
    .manifestation ul {
        margin-left: -10px;
        text-indent: 0;
    }
    .manifestation li {
        font-size: 14px;
    }
    .manifestation h1 {
        font-size: 24px;
        font-weight: bold;
    }
    .manifestation .manifest-course-photo {
        float: right;
        position: relative;
        margin-right: -25px;
        padding-left: 5px;
        height: auto;
        width: 180px;
    }
    .manifestation img {
        width: 20px;
        height: auto;
        padding-right: 10px;
    }
    .manifestation .initials {
        font-size: 10px;
    }
    /*
===============================================================================================
AROMATHEROPY
===============================================================================================
*/
    .aromatheropy {
        width: 90%;
    }
    .aromatheropy p {
        text-align: justify;
        font-size: 14px;
    }
    .aromatheropy h1 {
        font-size: 24px;
        font-weight: bold;
    }
    .aromatheropy .aromatheropy-photo {
        margin-right: 0;
        padding-left: 5px;
        height: auto;
        ;
        width: 100px;
    }
    .aromatheropy img {
        width: 20px;
        height: auto;
        padding-right: 10px;
    }
    .aromatheropy .initials {
        font-size: 10px;
    }
    /*
===============================================================================================
PRIMUS
===============================================================================================
*/
    .primus {
        width: 90%;
    }
    .primus p {
        text-align: justify;
        font-size: 14px;
    }
    .primus li {
        font-size: 14px;
    }
    .primus h1 {
        font-size: 24px;
        font-weight: bold;
    }
    .primus .primus-photo {
        margin-right: 0;
        padding-left: 5px;
        height: auto;
        ;
        width: 150px;
    }
    .primus img {
        width: 20px;
        height: auto;
        padding-right: 10px;
    }
    .primus .initials {
        font-size: 10px;
    }
    /*
===============================================================================================
PRACTITIONER COURSE
===============================================================================================
*/
    .practitioner {
        width: 90%;
    }
    .practitioner p {
        text-align: justify;
        font-size: 14px;
    }
    .practitioner li {
        font-size: 14px;
    }
    .practitioner h1 {
        font-size: 24px;
        font-weight: bold;
    }
    .practitioner .practitioner-photo {
        margin-right: 0;
        padding-left: 5px;
        height: auto;
        ;
        width: 100px;
    }
    .practitioner img {
        width: 20px;
        height: auto;
        padding-right: 10px;
    }
    .practitioner .initials {
        font-size: 10px;
    }
    /*
===============================================================================================
CRYSTAL WANDS
===============================================================================================
*/
    .crystal-wands .wand-img {
        width: 150%;
        display: block;
        padding-left: 5px;
        position: relative;
    }
    .crystal-wands .wand__name {
        padding-left: 15%;
        font-size: 100%;
    }
    .crystal-wands .scroll-down {
        font-size: 105%;
        /* font-weight: bold; */
        color: white;
    }
    /*
===============================================================================================
PRODUCTS WANDS
===============================================================================================
*/
    .products .product-img {
        height: 50px;
        width: auto;
        display: block;
        padding-left: 5px;
        position: relative;
    }
    /* .products .product-img:hover {
        height: 100px;
    } */
    .products .product__name {
        padding-left: 5%;
        font-size: 80%;
    }
    .products .product__price {
        flex: 0 1 20%;
        font-size: 80%;
    }
    .products li {
        text-align: left;
    }
    /*
===============================================================================================
FOOTER
===============================================================================================
*/
    #footer-text {
        font-size: 80%;
    }
}