/*FOR SCREENS LESS THAN 1700px WIDE*/
@media screen and (max-width: 1700px) {
    #datasetItem{
        width: 95%;
    } 
}

/*FOR SCREENS LESS THAN 1540px WIDE*/
@media screen and (max-width: 1540px) {
    #content{
        width: 50%;
        overflow: hidden;
    }
    #datasetItem{
        width: 86%;
    }
    #resultBox{
        width: 99%;
    }
}

/*FOR SCREENS LESS THAN 1540px WIDE*/
@media screen and (max-width: 1450px) {
    #datasetItem{
        max-width: 80%;
    }
}

/*FOR SCREENS LESS THAN 1380px WIDE*/
@media screen and (max-width: 1380px) {
    #datasetItem{
        max-width: 70%;
    }
}

/*FOR SCREENS LESS THAN 1300px WIDE*/
@media screen and (max-width: 1300px) {
    #datasetItem{
        max-width:65%;
    }
}

/*FOR SCREENS LESS THAN 1200px WIDE*/
@media screen and (max-width: 1200px) {
    #datasetItem{
        max-width:60%;
    }
}
/*FOR SCREENS LESS THAN 1100px WIDE*/
@media screen and (max-width: 1100px) {
    #datasetItem{
        max-width:50%;
    }
}

/*FOR SCREENS LESS THAN 960px WIDE*/
@media screen and (max-width: 960px) {
    #datasetItem{
        max-width:45%;
    }
    #datasetInfo .inlineItem{
        width: 100px;
    }
    .outer{
        display: block;
        width: 100%;
    }
    #datasetInfo{
       display: block;
       width: 100%;
    }
    #datasetDetail{
        width: 100%;
        border-left: 0;
        padding-left: 0px;
        display:block;
    }
}
/*FOR SCREENS LESS THAN 886px WIDE*/
@media screen and (max-width: 886px) {
    #datasetItem{
        max-width:40%;
    }
}
/*FOR SCREENS LESS THAN 768px WIDE*/
@media screen and (max-width: 768px) {
    #datasetItem{
        max-width:30%;
    }
    #datasetItem .button--grey{
        padding: 5px 7px;
    }
}
/*FOR SCREENS LESS THAN 768px WIDE*/
@media screen and (max-width: 768px) {
    #datasetItem{
        max-width:30%;
    }
}
/*FOR SCREENS LESS THAN 768px WIDE*/
@media screen and (max-width: 668px) {
    #datasetItem{
        max-width:25%;
    }
    #categoryDiv{
        display: inline;
    }
    #datasetItem{
        max-width:100%;
    }
    #resultBox{
        width: 350px;
        overflow-x: scroll;
    }
    .rightItem{
        float:left;
    }
    .detail-buttons{
        height: 150px;
    }

}
/*FOR SCREENS LESS THAN 612px WIDE*/
@media screen and (max-width: 629px) {
	#sortDiv, #categoryDiv{
		float: left;
	}
	#dsSearchText{
		padding: 10px;
        border-radius: 5px;
        border: solid 1px;
	}
	::placeholder {
	  margin-left: 10px;
	  font-size: 14px;
	}
}

/*FOR SCREENS LESS THAN 550px WIDE*/
@media screen and (max-width: 550px) {
    #catalog span{
        margin-bottom: 50px;
    }
    #sortDiv{
        margin: 20px 0;
    }
    #dsSearchText{
        width: 70%;
    }
    #sortSelect{
        width: 80%;
    }
    .rightItem{
        float:left;

    }
    .detail-buttons{
        height: 130px;
    }

    #categorySelect{
        width: 80%;
    }
    .dataset--grey{
        overflow:hidden;
    }
    .smallText{
        display: block;
        width: 100%;
        margin-bottom: 10px;
    }
    #resultBox{
        width: 40%;
    }
    .rich_container{
        width: 80%;
    }
    .inlineItem{
        float: left;
    }
    .rightItem{
        clear:both;
        margin-left: 0px;
    }
    .detail-buttons{
        height: 150px;
    }

}


/*FOR SCREENS LESS THAN 440px WIDE*/
@media screen and (max-width: 440px) {
    .viewTabs label{
        padding: 5px;
    }
    #label4{
        margin-top: 20px;
        width: 130px;
        display:block;
    }
    #resultBox{
        width: 370px;
        overflow-x: scroll;
    }

}

/*FOR SCREENS LESS THAN 440px WIDE*/
@media screen and (max-width: 400px) {
    #label4{
        margin-top: 20px;
        width: 150px;
        display:block;
    }
    #resultBox{
        width: 330px;
        overflow-x: scroll;
    }
}