/*MOBILE*/

@media only screen and (min-width: 320px) and (max-width: 567px){


	.row.portfolio-container{
		justify-content: center;
	}
	/*NAVBAR*/

	li.search-home{
		margin-right: 0;
	}
	.dropdown-content{
		left: 0;
		top: 40px;
	}

	a#HM{
		margin-top: 0;
	}

	.nav-link{
		padding: 0;
	}

	.search-home input{
		width: 80%;
	}

	.navbar-light .navbar-nav .nav-link {
	    color: #000;
	    text-align: center;
	}

	/*HOME PAGE*/

	button.opt-link-btn{
		font-size: 23px;
	}

	.rounded-pill.pro-pic{
		width: 35px;
	}

	.feed-header a{
		font-size: 14px;
	}

	.carousel-control-next, .carousel-control-prev{
		width: 40px;
		height: 40px;
	}

	.regular-heart-btn{
		font-size: 30px;
	}

	.feed-footer a{
		font-size: 30px;
	}

	.regular-save-btn{
		font-size: 30px;
	}

	.solid-save-btn{
		font-size: 30px;
	}

	.pro-viewer{
		display: none;
	}

	input.home-cmnt{
    background-color: #fdf5f0;
    padding: 6px 5px;
    border-radius: 6px;
    width: 170px;
    border: 1px solid #b8b8b8;
}

.btn{
    padding: 5px 20px !important;
    position: relative;
    bottom: 2px;
}

	/*SETTINGS PAGE*/

	input.Edit-profile-input {
	    background-color: #fdf5f0;
	    padding: 6px 5px;
	    border-radius: 6px;
	    width: 100%;
	    margin-right: 0;
	    float: right;
	    border: 1px solid #b8b8b8;
	}

	.Edit-profile-section {
	    text-align: left;
	    margin-left: 1rem;
	    margin-top: 3rem;
	    align-items: center;
	    height: auto;
	}

	.left-settings-pane ul li a{
		padding: 0;
	}

	.left-settings-pane ul{
		padding-left: 0;
	}

	img#preview {
	    border-radius: 50rem;
	    margin-top: 1rem;
	}

	textarea.Edit-profile-input {
	    background-color: #fdf5f0;
	    padding: 6px 5px;
	    border-radius: 6px;
	    width: 100%;
	    margin-right: unset;
	    float: right;
	    border: 1px solid #b8b8b8;
	}

	/*LOGIN PAGE*/

	.left-login{
		display: none;
	}

    .right-login {
	    position: relative;
	    top: 10%;
	    right: 2%;
	    left: 2%;
	    text-align: center;
	    background-color: #fff;
	     padding: 0; 
	     margin-left: 0; 
	    width: 100%; 
	    border-radius: 6px;
	    box-shadow: 5px 3px 5px 0px #c6c6c5;
	}

	.login-input input {
	    background-color: #fdf5f0;
	    padding: 10px 5px;
	    border-radius: 6px;
	    border: 1px solid #b8b8b8;
	    margin-top: 18px;
	    width: 255px;
	}
	div#gSignIn {
    margin-left: 1rem;
	}

	.abcRioButton.abcRioButtonBlue{
		height: 40px !important;
    	width: 250px !important;
	}

	.login-footer p {
	    text-align: center;
	    margin-top: 10px;
	    margin-left: 9px;
	}

	/*INBOX-PAGE*/

	.inbox{
		overflow-x: hidden;
		height: auto;
	}

	.inbox-right{
		display: block;
	}

	.chat-box{
		display: block;
	}

	.left-chat-span{
		font-size: 15px;
		padding: 7px 10px;
		max-width: 80%;
	}

	.right-chat-span{
		font-size: 15px;
		padding: 7px 10px;
		max-width: 80%;
	}

	p.left-chat-time{
		font-size: 13px;
	}

	p.right-chat-time{
		font-size: 13px;
		bottom: 34px;
	}

	.right-chat img{
		top: 8px;
	}

	.left-chat{
		margin-top: 10px;
	}

	.right-chat{
		margin-top: 0px;
	}

	.chat-box-footer input{
		width: 77%;
		margin-left: 0;
	}

	.chat-box-footer button{
		padding: 6px 10px;
		margin-left: unset;
		width: 21%;
	}

	.inbox-right-img{
		margin-top: 3rem;
	}

	.inbox-right-btn button{
		margin-bottom: 2rem;
	}

	.inbox-left{
		text-align: left;
	}

	.inbox-right-list-container {
    width: 300px;
	}

	.inbox-left-heading {
    padding: 15px 25px 0px 25px;
    width: 100%;
    text-align: center;
    border: none;
    margin-bottom: 11px;
    border-bottom: 1px solid transparent;
}

	.inbox-left-heading button{
		display: inline-block;
		float: right;
		margin-right: 5px;
		color: #000;
		background: transparent;
    	border: 1px transparent;
    	font-size: 23px;
	}

	a.back-res{
		display: inline-block;
		background: #ccc4c4;
    	padding: 3px 10px;
    	border-radius: 2px;
    	margin-bottom: 5px;
    	float: left;
	}

	a#rc{
		display: inline-block;
		float: right;
		margin-top: 11px;
	}

	.inbox-left-heading a{
		font-size: 20px;
	}

	.inbox-left ul li {
    padding: 20px;
	}

	.inbox-right-list ul li {
    padding: 4px 5px;
    align-items: center;
    width: 297px;
	}
	
	.close {
    position: absolute;
    color: #000;
    font-size: 35px;
    font-weight: bold;
    top: -10px;
    right: 10px;
	}

	.inbox-right-list-container{
		height: 170px;
		border-bottom: 1px transparent;
	}

	.right-list-header{
		border-bottom: 1px transparent;
	}

	button.form-control {
    border-top-right-radius: 0.25rem;
    border-bottom-right-radius: 0.25rem;
    border-top-left-radius: 0.25rem;
    border-bottom-left-radius: 0.25rem;
    margin-left: -5px;
    border: 1px solid #ced4da;
    margin-top: 8px;
}

.right-list-header h3{
	margin-left: 11px;
	margin-top: 7px;
}

form.new-msg-form{
	margin-top: 20px;
}


	/*NOTIFICATIONS-PAGE
	.pull-right {
    float: none;
    display: -webkit-box;
	}

	/*ADD STORY PAGE*/

	.add-story-form input {
    background: #fddada;
    padding: 10px 10px;
    margin-left: unset;
    border-radius: 5px;
    width: 95%;
	}


	.add-story-filters {
    width: 95%;
    margin-left: 5px;
	}

	.carousel-wrap {
	margin: 1rem auto;
    padding: 0 5%;
    width: 80%;
    position: relative;
	}

	.add-story-footer{
		margin-right: unset;
	}

	/*ADD POST*/

	.Range-sliders input{
		width: 100%;
	}

	.addpost-filters button{
		width: 120px;
		height: 60px;
	}

	/*VIEW_POST*/

	.right-vp-content{
		height: auto;
	}

	.vp-input input{
		width: 69%;
	}

	.vp-input button{
		padding: 5px 20px !important;
	}

	/*SEE-ALL PAGE*/
	.see-all-container{
		width: 300px;
		height: 400px;
	}

	/*REGISTRATION*/

	.register-container{
		overflow-y: auto;
	}

	.right-reg{
		border: none;
	}

	.left-reg{
		border: none;
	}
}

/*TABLETS*/

@media only screen and (min-width: 767px) and (max-width: 990px){

	/*NAVBAR*/

	li.search-home{
		margin-right: 0;
		margin-bottom: 5px;
	}

	.search-home input{
		width: 181px;
	}

	.navbar-brand img {
    height: 55px;
	}

	ul.navbar-nav {
    margin-right: -38px;
	}

	.navbar-light .navbar-nav .nav-link {
    color: #000;
    font-size: 26px;
	}

	.nav-link svg {
    width: 27px;
    height: 24px;
    margin-bottom: 5px;
	}

	img.nav-avatar {
    width: 38px !important;
    height: 37px !important;
    margin-top: 0;
	}

	a#HM {
    font-size: 24px;
    margin-top: 3px;
    margin-left: 38px;
	}

	a#BM{
	font-size: 26px;
	margin-top: 2px;
	}

	.nav-link img {
    width: 26px;
    height: 25px;
    margin-bottom: 4px;
	}

	input.home-cmnt{
    background-color: #fdf5f0;
    padding: 6px 5px;
    border-radius: 6px;
    width: 280px;
    border: 1px solid #b8b8b8;
}

.btn{
    padding: 5px 20px !important;
    position: relative;
    bottom: 2px;
}

	/*SETTINGS*/

	input.Edit-profile-input {
		margin-right: 0;
	}
	.Edit-profile-section{
		margin-left: 2rem;
	}

	.left-settings-pane ul li a{
		padding: 0;
	}

	.left-settings-pane ul{
		padding-left: 0;
	}

	/*LOGIN PAGE*/

	.left-login{
		display: none;
	}

	div#gSignIn {
    margin-left: 10rem;
	}

	textarea.Edit-profile-input{
		margin-right: unset;
	}

	.right-login {
    position: relative;
    top: 5%;
    right: 5%; 
    left: 5%;
    text-align: center;
    background-color: #fff;
    padding: 30px;
    width: 90%;
    border-radius: 6px;
    box-shadow: 5px 3px 5px 0px #c6c6c5;
	}

	/*CHAT-BOX*/
	.chat-box-footer input{
		width: 72%;
	}

	/*HOME PAGE*/

	.pro-viewer{
		right: 2rem;
	}

	.feed-footer a{
		font-size: 32px;
	}

	.regular-save-btn{
		font-size: 31px;
	}

	.carousel-control-next, .carousel-control-prev{
		width: 35px;
		height: 35px;
		font-size: 30px;
	}

	.story-content{
		width: auto !important;
	}

	.regular-heart-btn{
		font-size: 32px;
	}

	.solid-save-btn{
		font-size: 31px;
	}

	.home-footer a{
		margin: 10px 20px;
	}

	/*ADDPOST PAGE*/

	.Range-sliders input{
		width: 100%;
	}

	/*VIEW_POST*/
	.vp-input input{
		width: 235px;
	}

	.vp-input button{
		padding: 5px 15px !important;
	}


}

@media only screen and (min-width: 993px) and (max-width: 1024px){
	.Range-sliders input{
		width: 100%;
	}
}