@media only screen {
    .ksd {
        
        background-color: rgb(255, 0, 0);
    }

    .floaterholder {
        width: 100%;
        position: relative;
        /*margin-bottom: 130px;*/
        z-index: 1;
        display: inline-block;
        padding: 0px;
        overflow: hidden;
    }

        .floaterholder img {
            width: 100%;
            height: auto;
        }




    .floater {
        d-isplay: none;
        width: 100%;
        /*height: 150px;*/
        position: absolute;
        /*top: 100%;*/
        background-color: #ffffff;
        /* border: 1px #cccccc solid;*/
        z-index: 20;
        padding: 10px 5px 5px 5px;
        /*color:#000000;*/
        text-align: left;
        color: #ffffff;
        height: 100%;
        top: 90%;
        /*font-size:1.1em;
         line-height:1.8em;*/
    }

    .floaterwithpics {
        cursor:pointer;
    }
    .floatermore {
        margin-top:-10px;
    }

    .floatertext {
        padding: 4% 0% 0% 6%;
        width: 90%;
        float: left;
    }

    .floaterG {
        d-isplay: none;
        width: 100%;
        /*height: 150px;*/
        position: absolute;
        /*top: 100%;*/
        background-color: #ffffff;
        /* border: 1px #cccccc solid;*/
        z-index: 20;
        padding: 10px 5px 5px 5px;
        /*color:#000000;*/
        text-align: center;
    }

    .floaterS {
        d-isplay: none;
        width: 100%;
        /*height: 150px;*/
        position: absolute;
        top: 90%;
        background-color: #ffffff;
        /* border: 1px #cccccc solid;*/
        z-index: 20;
        padding: 5px;
        /*color:#000000;*/
        text-align: center;
    }

    .floaterLarge1 {
        background-color: #f48f40;
    }

    .floaterLarge2 {
        background-color: #6fc3d5;
    }

    .floaterLarge3 {
        background-color: #55b74e;
    }

    .floaterLarge4 {
        background-color: #eb212e;
    }

    .floaterLarge5 {
        background-color: #8a90c5;
        /*cursor:pointer;*/
    }
}

@media only screen and (min-width: 480px) {
    .ksd {
        /*background-color: Red;*/
    }

    .floaterholder {
        position: relative;
        /*margin-bottom: 120px;*/
        z-index: 1;
    }

    .floater {
        font-size: 0.9em;
        line-height: 1.5em;
    }
}

@media only screen and (min-width: 768px) {
    .ksd {
        background-color: rgb(0, 128, 0);
    }

    .floaterholder {
        width: 48%;
        margin-right: 1%;
        display: inline-block;
        margin-bottom: 1%;
        overflow: hidden;
    }


    .floater {
        text-align: left;
        /* padding:6% 25% 0% 6%;*/
        font-size: 1.1em;
        line-height: 1.8em;
        /*color:#ffffff;
         height: 100%;
         top: 100%;*/
    }

    /*top: 100%;
        height: 100%;
        padding:6% 25% 0% 6%;
        font-size:1.1em;
         line-height:1.8em;
         color:#ffffff;
         
    }
    .floaterLarge1 {
    background-color:#f48f40;
    
    }
    .floaterLarge2 {
    background-color:#6fc3d5;
    }
    .floaterLarge3 {
    background-color:#55b74e;
    cursor:pointer;
    }
    .floaterLarge4 {
    background-color:#eb212e;
    cursor:pointer;
    }
    .floaterLarge5 {
    background-color:#8a90c5;
    cursor:pointer;
    }
   */
}

@media only screen and (min-width: 1024px) {
    .ksd {
        background-color: #ffffff;
    }

    .floaterholder {
        /*overflow: hidden;*/
    }

    .floater {
    }
}

@media only screen and (min-width: 1240px) {
    .ksd {
    }

    .floaterholder {
    }

    /*.floater {
        top: 100%;
        height: 100%;
        padding:6% 25% 0% 6%;
        font-size:1.1em;
         line-height:1.8em;
         color:#ffffff;
         
    }
    .floaterLarge1 {
    background-color:#f48f40;
    }
    .floaterLarge2 {
    background-color:#6fc3d5;
    }
    .floaterLarge3 {
    background-color:#55b74e;
    }
    .floaterLarge4 {
    background-color:#eb212e;
    }
    .floaterLarge5 {
    background-color:#8a90c5;
    }
    */


}