/*
 * Developer: Alireza Eskandarpour Shoferi
 * Designer: Nevide (codecanyon.net/user/Nevide)
 *
 * Distributed under the terms of the MIT license
 * http://opensource.org/licenses/MIT
 */
/*ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
}
a {
  color: #646464;
  text-decoration: none;
}
body {
  background-color: #64D7E2;
  font-family: "Source Sans Pro", sans-serif;
}*/

#shopBydpsec {
    float: left;
    width: 29px;
    height: 25px;
    margin-left: 12px;
    margin-top: 3px;
    cursor: pointer;
    display: none;
    text-align: center;
}

    #shopBydpsec:hover {
        opacity: 0.8;
        background: #e9eef3;
        box-shadow: 0 2px 5px #979797;
    }

.arrowdiv {
    position: relative;
    top: -9px;
    left: 12px;
    width: 15px;
    height: 10px;
    display: block;
    cursor: pointer;
    background: url(../images/arrow_top1.png) no-repeat left top;
    z-index: 1000;
}

#shopWrapper {
    position: absolute;
    top: 135px;
    left: 12px;
    width: 280px;
    background-color: #fff;
    /*box-shadow: 0 4px 10px #7A9BAC;*/
    box-shadow: 0 4px 10px #b9b9b9;
    border-top: #e9e9e9 solid 1px;
    font-size: 0.875em;
    z-index: 1000;
    display: none;
}


ul.items {
    padding: 18px 0px 0px;
    margin: 0px;
}

    ul.items li {
        margin-bottom: 1px !important;
    }

    ul.items > li > a {
        display: block;
        margin: 0 auto;
        /*width: 90%;*/
        width: 100%;
        font-size: 12px;
        text-indent: 18px;
        line-height: 39px;
        /*background:#e9e9e9;*/
        background: #eeeeee;
        color: #3a3a3a;
        border-top: #cfcfcf solid 1px;
    }

        ul.items > li > a:hover {
            background: #d7d7d7;
        }

        ul.items > li > a::after {
            position: absolute;
            right: 30px;
            margin-top: 2px;
            font-family: "FontAwesome";
        }

        ul.items > li > a::after {
            right: 30px;
            content: "\f061";
            /*color:#277487;*/
            color: #3a3a3a;
            font-size: 12px;
            font-weight: normal;
        }

.itemHover {
    color: #fff;
    /*font-weight: 600;*/
    -webkit-transition: background-color 0.4s ease-in-out;
    transition: background-color 0.4s ease-in-out;
}

.items > li > a:hover {
    background-color: #5fc7cb;
    color: #3a3a3a;
    /*font-weight: 600;*/
    -webkit-transition: background-color 0.4s ease-in-out;
    transition: background-color 0.4s ease-in-out;
}

.items > li > a.expanded {
    /*background-color: #64D7E2;*/
    background-color: #d7d7d7;
    color: #3c3c3c;
    /*font-weight: 600;*/
    -webkit-transition: background-color 0.4s ease-in-out;
    transition: background-color 0.4s ease-in-out;
}

    .items > li > a.expanded::after {
        content: "\f063";
    }

.sub-items > li a {
    margin-top: 3px;
    margin-bottom: 3px;
    min-height: 21px;
}

    .sub-items > li a:hover {
        background: #e0ecee;
    }


    .sub-items > li a ul {
        /*margin-left:10px;*/
    }

.sub-items > li:first-child > a {
    margin-top: 4px;
    min-height: 21px;
}

.sub-items > li:first-child > a {
    margin-top: 4px;
    min-height: 21px;
}

.sub-items > li:first-child > a {
    margin-top: 4px;
    min-height: 21px;
}

.sub-items > li:last-child > a {
    margin-top: 4px;
    min-height: 21px;
}

.sub-items a {
    position: relative;
    display: block;
    /* margin: 0 auto;*/
    /* margin-left:6px;*/
    /*width: 212px;*/
    text-indent: 12px;
    line-height: 21px;
}

.sub-items a {
    /*border-left: 2px solid #64D7E2;*/
    border-left: 1px solid #c2c2c2;
    color: #3a3a3a;
}

.sub-items .current {
    position: relative;
    color: #3a3a3a;
    border-color: white;
}

.sub-items > li:hover > a {
    color: #3a3a3a;
    -webkit-transition: color 0.4s ease-in-out;
    transition: color 0.4s ease-in-out;
}

.sub-items {
    display: none;
}

ul.items li .viewall {
    margin: 5px 17px !important;
    width: 120px;
}

    ul.items li .viewall img {
        float: left;
        margin-right: 3px;
    }

    ul.items li .viewall a {
        text-decoration: none;
        cursor: pointer;
        color: #3a3a3a;
    }

        ul.items li .viewall a:hover {
            color: #3d3d3d;
        }
/*-----------*/
ul.items li .restaurantslist {
    width: 100%;
    float: left;
}

    ul.items li .restaurantslist img {
        float: left;
        margin-right: 3px;
    }

    ul.items li .restaurantslist a {
        text-decoration: none;
        cursor: pointer;
        color: #277487;
        font-size: 12px;
        text-indent: 18px;
        line-height: 39px;
        background: #eeeeee;
        color: #277487;
        border-top: #cfcfcf solid 1px;
        display: block;
        margin-top: -4px;
    }

        ul.items li .restaurantslist a:hover {
            color: #363f41;
        }

/*-----------*/

ul.items li .spalist {
    width: 100%;
    float: left;
}

    ul.items li .spalist img {
        float: left;
        margin-right: 3px;
    }

    ul.items li .spalist a {
        text-decoration: none;
        cursor: pointer;
        color: #277487;
        font-size: 12px;
        text-indent: 18px;
        line-height: 39px;
        background: #eeeeee;
        color: #ae5638;
        border-top: #cfcfcf solid 1px;
        display: block;
    }

        ul.items li .spalist a:hover {
            color: #665f5c;
        }


/*@media screen and (max-width:1200px) {
	#shopBydpsec{
		display:block;
	}
}
@media screen and (max-width:1100px) {
#shopWrapper {
  top:150px;
}
}*/
@media screen and (max-width:900px) {
    #shopBydpsec {
        display: block;
    }


    #shopWrapper {
        position: absolute;
        top: 150px;
        left: 12px;
        width: 300px;
    }
}

@media screen and (max-width:600px) {
    #shopWrapper {
        position: absolute;
        top: 178px;
        left: 19px;
    }

    #shopBydpsec {
        margin-left: 22px;
    }
}

@media screen and (max-width:440px) {

    #shopBydpsec {
        float: left;
        width: 29px;
        height: 25px;
        position: absolute;
        top: 7px;
        left: 0px;
    }

    #shopWrapper {
        position: absolute;
        top: 45px;
        left: 19px;
        width: 280px;
        z-index: 20000;
    }

    #shopBydpsec {
        margin-left: 19px;
    }

    logo img {
        margin-left: 12%;
    }
}

@media only screen and (min-width:481px) and (max-width : 510px) {
    #shopBydpsec {
        margin-left: 25px;
    }
    #shopWrapper {        
        z-index: 20000;
    }
}
