/* max-width:575px */
@media(min-width:0px) {

    /* choose your location modal */
    .modal {
        position: absolute;
        top: 3.5em;
        left: 15%;
        height: 80%;
        width: 70%;
    }

    .modal a {
        text-decoration: none;
        color: black;
    }

    .modal-header {
        background-color: rgb(240, 237, 237);
        padding: .7em 1.3em;
        justify-content: space-between;
    }

    .modal-title {
        font-size: .96rem;
    }

    .modal-close {
        color: black;
        font-size: .8rem;
    }

    /* modal body */
    .modal-body {
        padding: 1em 1.5em;
    }

    .modal-body p {
        color: rgb(85, 83, 83);
        font-size: .83rem;
        /* margin-bottom: 1em;  */
    }

    .modal__btn {
        margin: 1em 0;
    }

    .modal__signinBtn,
    .modal__doneBtn,
    .modal__continueBtn {
        cursor: pointer;
        background-color: rgb(243, 209, 17);
        border: none;
        font-size: .8rem;
        text-align: center;
        padding: .5em 5em;
        border-radius: 2em;
    }

    .modal__signinBtn {
        padding: .5em .5em;
    }

    .modal__signinBtn:hover,
    .modal__doneBtn:hover,
    .modal__continueBtn:hover {
        background-color: rgb(229, 197, 15);
        color: black;
    }

    /* us zip code */
    .modal__text {
        display: flex;
        color: rgb(85, 83, 83);
        padding: .5em 0em;
    }

    .modal__text::before,
    .modal__text::after {
        content: "";
        align-self: center;
        flex: 1 0;
        margin: 0 1em 0 0;
        border-top: 1px solid rgba(85, 83, 83, 0.313);
    }

    .modal__text::after {
        margin: 0 0em 0 1em;
    }

    .modal-zipcode__container {
        display: flex;
        justify-content: space-between;
    }

    .modal-zipcode__container input {
        width: 65%;
        padding: 0 .5em;
    }

    .modal-zipcode__container input:focus {
        border-radius: 1px;
        border: 1px solid rgb(74, 74, 216);
        outline: 3px solid rgb(74, 74, 216);
        outline-offset: .2em;
    }

    .modal-zipcode__container .btn {
        border: 1px solid rgb(85, 83, 83);
        border-radius: 15em;
        padding: .2em 2.3em;
        font-size: .82rem;
    }

    .modal-zipcode__container .btn:hover {
        background-color: rgba(240, 248, 255, 0.482);
    }

    /* ship outside */
    .outsideUs__container {
        padding: .6em 0;
    }

    .outsideUs__container select {
        width: 100%;
        padding: .6em .6em;
        background-color: rgb(240, 237, 237);
        border: none;
        border-radius: .5em;
        outline: none;
        margin-bottom: 1.7em;
        font-size: .8rem;
    }

    .outsideUs__container select:hover {
        background-color: rgba(220, 216, 216, 0.607);
    }

    .outsideUs__container select:focus {
        border-radius: 1px;
        border: .5px solid rgb(74, 74, 216);
        outline: 3px solid rgb(74, 74, 216);
        outline-offset: .2em;
    }

    .modal-doneBtnContainer {
        display: flex;
        justify-content: flex-end;
    }

    .modal__doneBtn {
        padding: .3em 1.5em;
    }

    /* 2nd modal  */


    .modal-body__info {
        font-size: .8rem;
        color: black;
        margin: .5em 0;
        margin-right: 1em;
    }

    .modal__continueBtnContainer {
        display: flex;
        justify-content: flex-end;
    }

    .modal__continueBtn {
        padding: .4em 1.6em;
        color: black;
        margin-bottom: .6em;
    }

    /* account &list dropdown */

    .nav__account-list {
        position: relative;
    }

    .dropdown-accList .dropdown-menu {
        font-size: .8rem;
        width: 30em;

        height: 30.2em;
        position: absolute;
        top: 2em;
    }

    .nav__account-list__dropdown {
        font-weight: 500;
        text-align: center;
        padding: 2em;
        background-color: white;
        border-radius: .3em;
    }

    .accListDropdown__section1 {
        border-bottom: 1px solid rgba(128, 128, 128, 0.218);
    }

    .accListDropdown__Btn {
        font-size: .87rem;
        text-decoration: none;
        color: black;
        background-color: rgb(243, 209, 17);
        padding: .5em 4.5em;
        border-radius: .6em;
    }

    .accListDropdown__Btn:hover {
        background-color: rgb(238, 206, 25);
    }

    .accListDropdown__text {
        font-size: .8rem;
        margin: 1em;
    }

    .accListDropdown__section2 {
        margin-top: 2em;
        display: flex;
        justify-content: space-between;
        text-align: left;
    }

    .accListDropdown__section2 h6 {
        font-size: .9rem;
    }

    .accListDropdown__links {
        font-size: .75rem;
        text-decoration: none;
        color: rgb(81, 78, 78);
    }

    .accListDropdown__links:hover {
        text-decoration: underline;
        color: brown;
    }

    .accListDropdown__section2__col2 {
        width: 53%;
        padding-left: 2em;
        border-left: 1px solid rgba(128, 128, 128, 0.218);
    }

    /* change language dropdown bootstrap*/

    .dropdown-menu {
        position: absolute;
        z-index: 1050;
    }



    /* Hide the default radio button */
    .nav__language__dropdown input[type="radio"],
    .dropdown-menu__wrapper input[type="radio"] {
        appearance: none;
        width: .8em;
        height: .8em;
        border: 1.5px solid #938f8f;
        border-radius: 50%;
        position: relative;
        cursor: pointer;
    }

    .dropdown-item:hover input[type="radio"]::before {
        content: "•";
        /* Solid dot */
        font-size: 1.7rem;
        color: rgb(226, 123, 55);
        position: absolute;
        transform: translate(1%, -37.2%);
    }

    .dropdown__heading {
        font-size: .75rem;
        font-weight: 500;
        padding-left: .5em;
        padding-top: .3em;
        padding-bottom: .5em;
    }

    .dropdown-heading__link {
        margin-left: .8em;
    }

    .dropdown-item span {
        font-size: .67rem;
    }

    .nav__language__dropdown .dropdown-menu {
        width: 11.5em;
        padding: .1em;
    }

    .seperator {
        margin: .1em 0;
        border-bottom: 1px solid rgba(128, 128, 128, 0.218);
    }

    .dropdown-item {
        padding: 0 .5em;
    }

    .dropdown-item:hover {
        text-decoration: underline;
        color: rgb(165, 89, 42);
    }

    .dropdown-section3 {
        padding: 0 .5em;
        display: flex;
        justify-content: space-between;
    }

    .dropdown-section3__col2 {
        margin-right: 1em;
        text-decoration: none;
    }

    .dropdown-section4-link__container {
        margin-top: .7em;
    }

    .dropdown-section4__link {

        text-decoration: none;
    }

    .dropdown-section4__link:hover {
        text-decoration: underline;
        text-decoration-color: brown;
    }

    /* header */

    /* navbar  */

    .navigationBar {
        background-color: rgba(27, 32, 39, 0.944);
        color: white;
        height: 3.2em;
        display: flex;
        align-items: center;
        justify-content: space-evenly;
        position: fixed;
        top: 0px;
        width: 100%;
        z-index: 3;
    }


    /* box1 site logo*/
    .navbar__logo {
        margin-left: .2em;
        padding: .45em 0em;
    }

    .navbar__logo__link {
        background-image: url(/images/amazon_logo.png);
        /* background-size: cover; */
        background-size: 100%;
        background-repeat: no-repeat;
        width: 3.2em;
        height: 1.5em;
    }

    .outline:hover {
        border: 1px solid white;
        border-radius: .1em;
        cursor: pointer;
    }

    /* .special-outline {
        border: 1px solid white;
        border-radius: .1em;
        cursor: pointer;
    } */

    /* box2 deliver to india*/
    .navbar__location {
        display: flex;
        justify-content: space-between;
        align-items: end;
        /* height: 2em; */
        width: 3.7em;
        padding: .5em .1em .3em 0;
    }

    .navbar__location_img {
        width: 20%;
        transform: scale(.7);
        padding-right: 1em;
    }

    .navbar__location__info {
        width: 80%;
    }

    .navbar__location__info__line1 {
        color: rgb(207, 201, 201);
        font-size: .56rem;
    }

    .navbar__location__info__line1 {
        margin: 0;
    }

    /* box3 navbar search form for tablet etc*/
    .nav__search-form {
        display: none;
    }


    /* modal search form for mobile */

    .nav__search-form.search-form-inside-modal {
        display: flex;
        justify-content: center;
        height: 2em;
        border-radius: .35em;
        box-shadow: 0px 0px 20px 5px rgba(0, 0, 0, 0.099);
        align-items: center;
    }

    #searchModal {
        position: absolute;
        left: 5%;
        top: 35%;
        height: 50%;
        width: 90%;
    }

    #searchModal .modal-content {
        background-color: #f0efea;
    }

    #searchModal .modal-header {
        padding: 2.5% 1% 2.5% 7%;
        color: white;
        background-color: #232f3ee6;
    }

    #searchModal .modal-title {
        font-size: .92rem !important;
    }

    #searchModal .searchModal__btn {
        background-color: transparent;
        border: none;
        color: white;
    }

    #searchModal .modal-body {
        padding: 5% 7% 7%;
    }



    /* search dropdown inside modal */
    .search-form-inside-modal .nav__search-dropdown {
        width: 20%;
        height: 100%;
        padding: 0.1em .3em 0 .2em;
        color: grey;
        border: none;
        border-radius: .35em 0 0 .35em;
        font-size: .8rem;
        background-color: #f0efea;
    }

    .search-form-inside-modal .nav__search-dropdown:focus {
        outline: none;
        border: 2px solid #f09824;
    }

    .search-form-inside-modal .nav__search-dropdown:hover {
        cursor: pointer;
        color: black;
        background-color: rgb(224, 223, 218);
    }

    .search-form-inside-modal .nav__search-dropdown option {
        background-color: white;
        color: black;
    }

    /* search input inside modal */
    .search-form-inside-modal .nav__search-input {
        border: none;
        width: 60%;
        height: 100%;
        font-size: .8rem;
        padding: 0 .5em;
    }

    .search-form-inside-modal .nav__search-input:focus {
        outline: none;
    }

    /* search btn inside modal */
    .search-form-inside-modal .nav__search-button {
        border: none;
        width: 20%;
        height: 100%;
        font-size: .7rem;
        background-color: #fbbe6e;
        border-radius: 0 .35em .35em 0;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .search-form-inside-modal .nav__search-button i {
        color: white;
    }

    .search-form-inside-modal .nav__search-button:hover {
        cursor: pointer;
        background-color: #f0a038;
    }

    .search-form-inside-modal .nav__search-button a {
        color: black;
    }


    /* when btn in the nav bar  */

    .nav__search-button--mobile {
        font-size: .6rem;
        border: none;
        background-color: transparent;
        color: white;
        border-radius: .35em;
    }

    .nav__search-button--mobile:hover {
        height: 65%;
        cursor: pointer;
        background-color: #eab979;
        color: black;
    }

    .hidden {
        display: none;
    }

    /* nav search form input  */
    .nav__search-input--focus {
        border: 3px solid #f09824;
        border-radius: .45em;
    }

    /* box4 change language*/
    .nav__language {
        display: flex;
        align-items: center;
    }

    .nav__language__info {
        display: flex;
        padding: .85em .2em .6em .2em;
    }

    .nav__language__info span {
        padding-left: .3em;
        font-size: .63rem;
    }

    .language__flag {
        width: 1em;
    }

    .nav__language__dropdown {
        width: .5em;
        height: .5em;
        font-size: .7em;
        background-color: rgba(27, 32, 39, 0.123);
        border: none;
        color: rgb(221, 216, 216);
        margin-left: .2em;
        margin-bottom: .1em;
    }

    .nav__language__dropdown:hover .dropdown-menu {
        display: block;
    }

    .nav__language__dropdown option,
    .nav__language__dropdown optgroup {
        background-color: white;
        color: black;
        width: 50em;
    }

    .nav__language__dropdown optgroup {
        font-weight: 500;
    }

    /* box5 accounts and lists segment on the navbar*/
    .nav__account-list {
        display: flex;
        align-items: flex-end;
    }

    .nav__account-list__info {
        width: 4.1em;
    }

    .nav__account-list__info,
    .nav__returns-orders,
    .nav__cart {
        padding: .3em .1em .2em .3em;
    }

    .nav__cart {
        font-size: .6rem;
        padding: 1.2em .3em;
    }

    .nav__returns-orders {
        padding: .45em .2em;
    }

    .nav-line1 {
        font-weight: 500;
        font-size: .6rem;
    }

    .nav-line2 {
        font-size: .65rem;
        font-weight: bold;
    }

    .dropdown-accList {
        font-size: .8em;
    }

    .nav__account-list__dropdown {
        margin-bottom: 0.4em;
    }

    /* offcanvas All menu hamburger*/

    .offcanvas {
        position: absolute;
        width: 63% !important;
    }

    .offcanvas-body {
        padding: 1.5em 2em;
    }

    .offcanvas__closeBtn {
        background-color: transparent;
        font-size: 1.3rem;
        padding: .1em .4em;
        border: 1.4px solid white;
        border-radius: .2em;
        position: absolute;
        top: 1.5%;
        left: 102%;
        cursor: pointer;
    }

    .offcanvas-header {
        padding: .8em;
        padding-left: 2.3em;
        background-color: #232f3ee1;
        color: white;
        /* align-items: center !important; */
    }

    .offcanvas-header:hover {
        cursor: pointer;
    }

    .offcanvas-title {
        /* font-size: rem !important; */
        text-decoration: none;
        color: white;
    }

    .offcanvas-header h5 {
        font-size: 1rem;
        font-weight: bold;
    }

    .offcanvas__item {
        text-decoration: none;
        color: black;
        font-weight: 500;
    }

    .offcanvas-section__heading h6 {
        font-size: .9rem;
        font-weight: 700;
    }

    /* accordion inside offcanvas-body */

    .accordion-body {
        background-color: rgb(231, 235, 239);
    }

    .accordion-button {
        font-size: .85rem !important;
        cursor: text;
    }

    .accordion-button:focus,
    .accordion-button:not(.collapsed) {
        background-color: transparent;
        box-shadow: none;
        border: none;
    }

    .accordion-button:focus {
        background-color: #8faacce1;
    }

    .accordion-item {
        border: none;
        margin: 0;
    }

    .accordion-button,
    .accordion-body,
    .accordion-body h6 {
        font-size: .9rem;
    }

    .accordion-button:hover {
        cursor: pointer;
        background-color: rgba(204, 199, 199, 0.382);
    }

    .accordion-button[aria-expanded="true"] {
        font-weight: bold;
        color: black;
    }

    .accordion-body a {
        text-decoration: none;
        color: black;
        font-weight: 500;
        display: block;
        padding: .7em 0;
    }

    .accordion-body a:hover {
        background-color: rgba(204, 199, 199, 0.377);
    }

    .accordion-body h6 {
        font-weight: 700;
    }

    .offcanvas-section__links {
        font-size: .85rem;
        padding-left: 2em;
    }

    .offcanvas-section__links a {
        padding: 1em 0;
        display: block;
        text-decoration: none;
        color: black;
        font-weight: 500;
    }

    .offcanvas-section__links a:hover {
        background-color: rgba(204, 199, 199, 0.377);
    }

    /* panel */
    .panel-wrapper {
        background-color: #232f3ee1;
        color: white;
        margin-top: 3.21em;
        height: auto;
        padding-bottom: .4em;
    }

    .panel {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: .1em .8em;
    }

    .hover {
        padding: .37em .1em;
    }

    .menu-bars {
        font-size: 1rem;
        padding: 0 .3em 0 0;
    }

    .panel a {
        color: white;
        text-decoration: none;
        font-size: .67rem;
        margin-right: .7em;
    }

    .panel__links {
        font-weight: 500;
        width: 87%;
    }

    .panel__deals a {
        display: flex;
        justify-self: center;
        font-weight: 600;
        text-align: right;
        font-size: .7rem;
        text-decoration: none;
        color: white;
    }

    /* footer  */
    footer {
        text-align: center;
    }

    footer a {
        text-decoration: none;
    }

    /* back to top - footer */
    .footer-back-to-top {
        /* height: 3em; */
        width: 100%;
        padding: .6em;
        background-color: #232f3e;
    }

    .footer-back-to-top:hover {
        cursor: pointer;
        background-color: #37475c
    }

    .back-to-top__link {
        display: block;
        width: 100%;
        font-size: .73rem;
        text-align: center;
        font-weight: 500;
        color: white;
    }

    /* secondary tasks */
    .footer-secondary-tasks a {
        display: block;
        color: rgba(255, 255, 255, 0.674);
        font-size: .68rem;
        font-weight: 500;
        text-align: left;
        margin: .48em 0;
    }

    .task__heading {
        font-size: .8rem;
        font-weight: bold;
        color: white;
        text-align: left;
    }

    .footer-secondary-tasks {
        background-color: #041122f2;
        padding: 2em 2.2em 3em 2.1em;
    }

    .secondary-tasks {
        /* width: 83%;
    margin: 0 auto; */
        display: flex;
        justify-content: space-between;
    }

    .task-section {
        /* width: 19.5%; */
        width: 22%;
    }

    .footer-secondary-tasks a:hover {
        text-decoration: underline;
    }

    /* hr {
    border: 1px solid grey;
} */

    /* footer settings */
    .footer-settings {
        background-color: hsla(214, 79%, 7%, 0.949);
        /* height: 3.5em; */
        color: rgba(255, 255, 255, 0.674);
        border-top: 1px solid rgba(128, 128, 128, 0.251);
        padding-bottom: 1em;
    }

    .footer-wrapper {
        display: flex;
        justify-content: space-between;
        width: 90%;
        margin: 0 auto;
    }

    .footer-amazon-logo {
        /* background-image: url(images/amazon_logo.png);
    background-size: cover;
    width: 8%;
    height: 40%; */
        /* display: inline-block; */
        width: 3.5em;
        height: 6em;
        transform: scale(1, .39);

        /* margin-right: 0em; */
        /* margin-left: 3em;  */
    }

    .setting-items {
        /* display: inline-block; */
        width: 79%;
        display: flex;
        justify-content: space-around;
        align-items: center;

    }

    .setting-item__wrapper {
        width: 25.5%;
    }

    .setting-item__wrapper:hover .dropdown-menu {
        display: block;
    }

    .setting-item__wrapper .dropdown-menu__wrapper {
        width: 110%;
    }

    .setting-item {
        padding: .5em .6em;
        /* width: 31.5%; */
        font-size: .5rem;
        display: flex;
        justify-content: space-between;
        border: 1px solid grey;
        border-radius: .2em;
        text-align: left;
    }

    .setting-item p {
        font-size: .6rem;
    }

    .column2 {
        width: 65%;
    }

    .column3 {
        width: 10%;
        text-align: center;
    }

    .column1 {
        line-height: 1.4em;
        width: 20%;
    }

    .caret {
        /* font-size: 2rem; */
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    .fa-caret-up {
        height: .5em;
    }

    /* .item1 {
    display: block; 
   width: 25%;
} */

    .item3 {
        cursor: pointer;
        width: 35%;
    }

    .item2 {
        cursor: pointer;
        width: 35%;
    }

    .region-setting {
        background-image: url(../images/united-states-flag-icon.png);
        background-size: cover;
        width: 1.5em;
        height: 1em;
    }

    /* more on amazon */
    .footer-moreOnAmazon-wrapper {
        padding: 2.5em 2.6em;
        background-color: #0e1319;
        /* color: rgba(255, 255, 255, 0); */
        /* font-size: .7rem; */
    }

    .moreOnAmazon {
        /* padding-bottom: 4em; */
        /* width: 87%; */
        /* margin: 0 auto; */
        /* height: 67em; */
        /* display: flex; */
        /* justify-content: space-between; */
        text-align: left;
        /* font-size: .7rem; */
        /* flex-direction: row; */
    }

    .moreOnAmazon p {
        font-size: .7rem;
    }

    /* .flex-column {
        /* width: 11.1%; */

    /* display: flex;
        flex-direction: column; */
    /* justify-content: space-between; */
    /* align-items: center; 
    } */

    /* .flex-col:hover{
    text-decoration: underline;
} */
    .more-section a {
        font-weight: 500;
        color: rgba(255, 255, 255, 0.466) !important;
    }

    .more-section:hover h4 {
        text-decoration: underline;
    }

    .more-section:hover p {
        /* text-decoration-color: white;
    text-decoration-line: underline; */
        text-decoration: underline;
    }

    .more-section__heading {
        font-size: .74rem;
        color: rgba(255, 255, 255, 0.873);
        margin-bottom: 0em;
    }

    .column-flexbox {
        margin-right: .05em;
        margin-bottom: 1em;
    }

    /* .flex-column {
        /* justify-content: space-between;
    } */

    .column-flexbox__item1 {
        padding-bottom: 5em;
        height: 25.5%;
    }

    .column-flexbox__item2 {
        height: 25.5%;
    }

    .column-flexbox__item3 {
        height: 27.5%;
    }

    .column-flexbox__item4 {
        height: 21.5%;
    }

    .last-column-flexbox {
        width: 25%;
        margin: 3.3em auto;
        margin-bottom: 0em;
        /* padding-top: 3%; */
        /* padding-left: 25vh !important; */
        /* display:flex;
        flex-direction: column;
        justify-content: flex-start; */
    }

    .last-column-flexbox .column-flexbox__item1 {
        height: 35%;
    }

    /* footer-copyright */
    .footer-copyright {
        /* width:100%; */
        font-weight: 500;
        font-size: .7rem;
        margin-top: 1.2em;
        color: white;
    }

    .copyright__links-wrapper {
        margin-bottom: .3em;
    }

    .copyright__link {

        color: white;
        margin-right: .8em;
    }

    .copyright__link:hover {
        text-decoration: underline;
    }


    /* interactivity */
    /* .open-menu button {
    color: red;
}
both of them do same things, change the color of the button when a class - "active" is added.
  
button.active{
    color: blue;
} */


}


/* 576 to 767 px = for mobile landscape  max-width:767px*/

@media(min-width:576px) {

    /* Navbar and panel mostly same as above  */
    .offcanvas {
        position: absolute;
        width: 55% !important;
    }

    /* box1 site logo*/
    .navbar__logo {
        width: 14.5%;
        padding: 0;
    }

    .navbar__logo__link {
        width: 100%;
        height: 7.6vh;
    }

    /* box2 deliver to india*/
    .navbar__location {
        width: 12%;
    }

    .navbar__location_img {
        transform: scale(.9);
    }

    .navbar__location__info__line1 {
        font-size: .7rem;
    }

    /* box3 navbar search form*/

    /* when btn in the nav bar  */

    .nav__search-button--mobile {
        width: 7%;
        font-size: .8rem;
    }

    .nav__search-button--mobile:hover {
        height: 75%;
    }

    /* modal search form  */
    #searchModal .modal-title {
        font-size: 1.1rem !important;
    }

    /* #searchModal .searchModal__btn {
        /* font-size: 1.2rem;
    } */

    /* search dropdown  */
    .search-form-inside-modal .nav__search-dropdown {
        font-size: .9rem;
    }

    /* nav search form input  */
    .search-form-inside-modal .nav__search-input {
        font-size: .9rem;
    }

    /* nav search form search btn  */
    .search-form-inside-modal .nav__search-button {
        font-size: .9rem;
    }

    /* box4 change language*/
    .nav__language {
        width: 10%;
    }

    .nav__language__info {
        width: 85%;
    }

    .nav__language__info span {
        width: 60%;
        padding-left: .3em;
        font-size: .8rem;
    }

    .nav__language .language__flag {
        width: 50%;
    }

    .nav__language__dropdown {
        width: 15%;
        font-size: .9rem;
    }

    .nav__language__dropdown .language__flag {
        width: 12%;
    }

    /* box5 accounts and lists segment on the navbar*/
    .nav__account-list {
        width: 22%;
    }

    .nav__account-list__info {
        width: 97%;
    }

    .nav__account-list__info,
    .nav__returns-orders,
    .nav__cart {
        padding: .3em .1em .2em .3em;
    }

    .nav__cart {
        font-size: .6rem;
        padding: 1.2em .3em;
    }

    .nav__returns-orders {
        padding: .45em .2em;
    }

    .nav-line1 {
        font-size: .72rem;
    }

    .nav-line2 {
        font-size: .77rem;
        font-weight: bold;
    }

    .dropdown-accList {
        font-size: .8em;
    }

    .nav__returns-orders {
        width: 10.9%;
    }

    .nav__cart {
        width: 9%;
    }

    .nav__account-list__dropdown {
        margin-bottom: 0.4em;
    }

    .navbar__location__info__line2 {
        font-size: .8rem;
    }

    /* panel  */
    .panel__links {
        font-weight: 500;
        width: 90%;
    }

    .panel a {
        font-size: .8rem;
        margin-right: .8em;
    }

    .panel__deals a {
        font-size: .8rem;
    }

    /* footer  */
    .back-to-top__link {
        font-size: .8rem;
    }

    .task__heading {
        font-size: 1rem;
    }

    .footer-secondary-tasks a {
        font-size: .8rem;
    }

    .setting-item {
        font-size: .79rem;
    }

    .setting-item p {
        font-size: .82rem;
    }

    /* .item2, .item-3{
        font-size: .9rem;
    } */

    /* more on amazon  */
    .footer-moreOnAmazon-wrapper {
        font-size: .8rem;
    }

    .moreOnAmazon p {
        font-size: .8rem;
    }

    .more-section__heading {
        font-size: .8rem;
    }

    /* .moreOnAmazon p {
        font-size: .8rem;
    } */

    /* footer copyright  */
    .footer-copyright {
        font-size: .75rem;
    }

}

/* 768 to 991 px = for tablet  max-width:991px*/
@media(min-width:768px) {

    /* header */

    /* navbar  */
    /* .navigationBar{
        height:
    } */

    /* box1 site logo*/
    .navbar__logo {
        width: 10%;
        margin-left: 0em;
    }

    .navbar__logo__link {
        height: 7vh;
    }

    /* box2 deliver to india*/
    .navbar__location {
        /* width: 9.7%; */
        width: 10%;
    }

    .navbar__location_img {
        padding-bottom: .4em;
        transform: scale(1.1);
    }

    .navbar__location__info__line1 {
        font-size: .77rem;
    }

    .navbar__location__info__line2 {
        font-size: .9rem;
    }

    /* box3 navbar search form*/
    .open.nav__search-form--mobile {
        display: none;
    }

    .nav__search-button--mobile {
        display: none;
    }

    .nav__search-form {
        display: flex;
        height: 2.3em;
        width: 35%;
    }

    /* search dropdown  */
    .nav__search-dropdown {
        width: 22%;
        padding: 0 .3em 0 .2em;
        color: grey;
        border: none;
        border-radius: .35em 0 0 .35em;
        background-color: #f0efea;
    }

    .nav__search-dropdown:focus {
        outline: none;
        border: 2px solid #f09824;
    }

    .nav__search-dropdown:hover {
        cursor: pointer;
        color: black;
        background-color: rgb(224, 223, 218);
    }

    .nav__search-dropdown option {
        background-color: white;
        color: black;
    }

    /* search input  */
    .nav__search-input {
        border: none;
        width: 75%;
        font-size: .9rem;
        padding: 0 .5em;
    }

    .nav__search-input:focus {
        outline: none;
    }

    /* search btn  */
    .nav__search-button {
        border: none;
        width: 15%;
        font-size: .8rem;
        background-color: #fbbe6e;
        border-radius: 0 .35em .35em 0;
    }

    .nav__search-button:hover {
        cursor: pointer;
        background-color: #f0a038;
    }

    .nav__search-button a {
        color: black;
    }

    /* box4 change language*/
    .nav__language {
        width: 7%;
    }

    .nav__language__info span {
        font-size: .85rem;
    }

    .nav__language .language__flag {
        width: 50%;
    }

    .nav__language__dropdown .language__flag {
        width: 12%;
    }

    /* box5 accounts and lists segment on the navbar*/
    .nav__account-list {
        width: 17%;
    }

    .nav__cart {
        font-size: 1rem;
        padding: .5em .1em;
    }

    .nav-line2 {
        font-size: .8rem;
    }

    .nav__returns-orders {
        width: 8.5%;
    }

    .nav__cart {
        width: 8.5%;
    }

    /* panel */
    .panel-wrapper {
        display: flex;
        align-items: center;
        margin-top: 3.2em;
        padding-bottom: 0;
    }

    .panel {
        height: 2.5em;
        padding: 0em 0 0 .7em;
        width: 78%;
    }

    .hover {
        padding: .57em .5em;
    }

    .menu-bars {
        font-size: 1.2rem;
    }

    .panel a {
        font-size: .83rem;
        margin-right: .2em;
    }

    .panel__deals {
        display: block;
        align-items: center;
        justify-content: start;
    }

    .panel__deals a {
        text-align: left;
        font-size: .8rem;
    }


    /* choose your location modal */
    /* .modal a {
        text-decoration: none;
        color: black;
    } */
    .modal {
        height: 85%;
    }

    .modal-header {
        padding: .8em 1.5em;
    }

    .modal-title {
        font-size: 1.2rem;
    }

    .modal-close {
        font-size: 1.1rem;
    }

    /* modal body */
    .modal-body {
        padding: 1.2em 1.5em;
    }

    .modal-body p {
        font-size: .9rem;
    }

    .modal__signinBtn,
    .modal__doneBtn,
    .modal__continueBtn {
        font-size: .9rem;
        padding: .5em 9em;
    }

    .modal__doneBtn {
        padding: .5em 2.5em;
    }

    /* us zip code */
    .modal__text {
        padding: .6em 0;
    }

    .modal-zipcode__container input {
        width: 71%;
    }

    .modal-zipcode__container .btn {
        padding: .2em 2.8em;
        font-size: .9rem;
    }

    /* ship outside */
    .outsideUs__container {
        padding: .6em 0 .4em;
    }

    .outsideUs__container select {
        width: 100%;
        padding: .7em .6em;
        font-size: .9rem;
    }

    /* 2nd modal  */

    .modal-body__info {
        font-size: 1rem;
    }

    .modal__continueBtn {
        padding: .4em 2em;
    }

    /* account &list dropdown */

    .dropdown-accList .dropdown-menu {
        font-size: .9rem;
        width: 33em;
        height: 28em;
    }

    .accListDropdown__Btn {
        font-size: 1rem;
    }

    .accListDropdown__section2 h6 {
        font-size: 1.1rem;
    }

    .accListDropdown__links {
        font-size: .85rem;
    }


    /* change language dropdown bootstrap*/

    /* Hide the default radio button */
    .nav__language__dropdown input[type="radio"],
    .dropdown-menu__wrapper input[type="radio"] {
        width: 1.1em;
        height: 1.1em;
    }

    .dropdown-item:hover input[type="radio"]::before {
        font-size: 2rem;
        transform: translate(18%, -33%);
    }

    .dropdown__heading {
        font-size: .82rem;
        padding-left: .7em;
        padding-top: .5em;
    }

    .nav__language__dropdown .dropdown-menu {
        width: 13em;
        padding: .1em .3em;
    }

    .seperator {
        margin: .5em 0;
    }

    .dropdown-item span {
        font-size: .8rem;
    }

    .dropdown-section3__col2 {
        margin-right: 0.5em;
    }

    /* offcanvas */

    .offcanvas {
        width: 40% !important;
    }

    .offcanvas-header h5 {
        font-size: 1.4rem;
    }

    .offcanvas-section__heading h6 {
        font-size: 1.17rem;
    }

    /* accordion */

    .accordion-button {
        font-size: .92rem !important;
    }

    .offcanvas-section__links a {
        font-size: 1.1em;
    }

    /* footer  */

    /* back to top - footer */
    .footer-back-to-top {
        padding: .8em;
    }

    .back-to-top__link {
        font-size: 1rem;
    }

    /* secondary tasks */

    .footer-secondary-tasks {
        padding: 3em 1em 4em 1em;
    }

    .footer-secondary-tasks a {
        font-size: .85rem;
    }

    .task__heading {
        font-size: 1.1rem;
    }

    .secondary-tasks {
        width: 83%;
        margin: 0 auto;
    }

    .task-section {
        width: 19.5%;
    }

    /* footer settings */

    .footer-amazon-logo {
        width: 5em;
        height: 6.5em;
    }

    .setting-items {
        width: 70%;
    }

    .setting-item {
        font-size: .83rem;
    }

    .setting-item p {
        font-size: .83rem;
    }

    /* more on amazon */
    .footer-moreOnAmazon-wrapper {
        font-size: .9rem;
        padding: 4.5em 0em 2.5em 4em;
    }

    .moreOnAmazon {
        padding: 0 1em 0 0em;
        height: 30em;
    }

    /* .moreOnAmazon p {
            font-size: .8rem;
        }

        .more-section__heading {
            font-size: .8rem;
        } */

    .flex-column {
        width: 13.35%;
        display: flex;
        flex-direction: column;
    }

    .column-flexbox__item1 {
        height: 25%;
        padding-bottom: 0;
    }

    .column-flexbox__item2 {
        height: 26%;
    }

    .column-flexbox__item3 {
        height: 25%;
    }

    .column-flexbox__item4 {
        height: 24%;
    }

    .last-column-flexbox {
        margin: 0 auto;
    }

    .last-column-flexbox .column-flexbox__item1 {
        height: 23%;
    }

    /* footer-copyright */
    .footer-copyright {
        margin-top: 5em;
    }

}

/* 992px to so on = for desktop devices and so in */
@media(min-width:992px) {

    .modal-header h1 {
        font-size: 1.3rem;
    }

    .modal-close {
        font-size: 1rem;
    }

    .modal__doneBtn {
        padding: .5em 2.5em;
    }

    /* offcanvas  */

    .offcanvas {
        width: 30% !important;
    }

    .navbar__logo__link {
        height: 8.2vh;
    }

    .navbar__location {
        width: 7.5%;
    }

    .nav__search-form {
        width: 45%;
    }

    .nav__search-dropdown {
        width: 9.3%;
    }

    .nav__search-input {
        width: 85%;
    }

    .nav__search-button {
        width: 10%;
    }

    .nav__account-list {
        width: 12%;
    }

    .nav__returns-orders {
        width: 7%;
    }

    .nav__cart {
        width: 7%;
    }

    /* footer settings  */
    .footer-wrapper {
        width: 55%;
    }

    /* more on amazon */
    .footer-moreOnAmazon-wrapper {
        padding: 4.5em 0em 2.5em 9em;
    }

    .moreOnAmazon {
        width: 88%;
        margin: 0 auto;
        padding: 0 0em;
    }

    .moreOnAmazon p {
        font-size: .85rem;
    }

    .more-section__heading {
        font-size: .85rem;
    }

    .flex-column {
        width: 12.35%;

        display: flex;
        flex-direction: column;
    }

    .last-column-flexbox {
        margin: 0 0;
    }

    .last-column-flexbox .column-flexbox__item1 {
        height: 19.5%;
    }

    .more-section a {
        font-weight: 500;
        color: rgba(255, 255, 255, 0.466) !important;
    }

    .column-flexbox__item1 {
        height: 20%;
    }

    .column-flexbox__item2 {
        height: 24%;
    }

    .column-flexbox__item3 {
        height: 25%;
    }

    .column-flexbox__item4 {
        height: 20%;
    }

    .footer-copyright {
        font-size: .87em;
    }
}

@media(min-width:1200px) {
    .navbar__logo__link {
        height: 8.7vh;
    }
}

@media(min-width:1400px) {

    .navigationBar {
        height: 3.7em;
    }

    .panel-wrapper {
        margin-top: 3.7em;
    }
}