/* #Small laptop screens
================================================== */

    /* Note: Design for a width of 960px */

    @media only screen and (max-width: 959px) {

        #logo-wrapper{

            margin:20px 0px 0px -101px;

        }

        .nivoSlider {

            width:768px;

        }

        #menuButtons #hideMenu.menuVisible{

            background-image:url(../images/up.png);

        }

        #menuButtons #hideMenu.menuInVisible{

            background-image:url(../images/down.png);

        }

        #tablet-menu{

            display:block;
            opacity:1;

        }

        #menuButtons {

            bottom: -44px;
            cursor: pointer;
            left: 20px;
            position: absolute;

        }

        #menu{

            display:none;

        }

        #menu-wrapper{

            width:100%;
            height:auto;
            top:-200px;
            height:175px;
            border-bottom-width:5px;
            border-right-width:0px;
            box-shadow:0 2px 1px rgba(0,0,0,0.2);

        }

        #main-wrapper{

            width:100%;
            top:250px;

        }

        #social-wrapper{

            display:none;

        }

        .half-column{

            width:48%;

        }

        .one-third-column{

            width:30.6%;

        }

        .one-fourth-column{

            width:22%;

        }

        .one-fifth-column{

            width:16.8%;

        }

        .half-column, .one-third-column, .one-fourth-column, .one-fifth-column{

            margin-right:4%;
            float:left;

        }
        
        .simpleImage{

            height:180px;
            width:33.3%;

        }

        #onclickDescriptionWrapper{

            width:100%;
            height:auto;
            top:40px;
            left:0px;

        }

        #onclickItemWrapper{

            width:100%;
            left:0px;

        }

    }


/*  #Tablets and small screens
================================================== */

    /* Note: Design for a width of 768px */

    @media only screen and (max-width: 767px) {
        
        .filter-box a.button:first-child{

            margin-left:0px;

        }

        .nivoSlider {

            width:420px;
            
        }

        #menu{

            display:none;

        }

        #tablet-menu{

            display:block;
            opacity:1;

        }

        .simpleImage{

            height:180px;
            width:50%;

        }

        .masonryImage, .masonryBlogPost{

            width:100%;

        }

        #onclickDescriptionWrapper{

            width:100%;
            height:auto;
            top:40px;
            left:0px;

        }

        #onclickItemWrapper{

            width:100%;
            top:210px;
            left:0px;

        }

    }


/* #Mobile phones
================================================== */

    /* Note: Design for a width of 480px */

    @media only screen and (max-width: 479px){
        
        #menu{

            display:none;

        }

        .nivoSlider {

            width:300px;
            
        }

        #tablet-menu{

            display:block;
            opacity:1;

        }

        .simpleImage{

            height:180px;
            width:100%;

        }

        .masonryImage, .masonryBlogPost{

            width:100%;

        }

    }