@font-face{

	font-family: fastorder;
	src : url('/api/public/font/AvenirLTStd-Roman.otf');
}

*{font-family: fastorder}

body{font-family: fastorder!important; background: #f2f2f2!important;height: 100%;overflow: auto;}
html{height: 100%}
.mg-auto{margin: auto;}
.main-body-setting{background: #fff!important;margin: 0rem auto;}
.main-body-setting{height: 100vh;}
.header-top{    height: 100%;
    border-bottom: 1px solid #f2f2f2;
    display: flex;
    align-items: center;background: #fff}
.settings-list li {width: 100%;float: left;padding: 1rem 0px}
section .container{    max-width: 100%!important;}
.main-body-setting nav{    height: 10%;}
.menu-list-left{height: 80%;overflow-y: auto;}
.settings-list{overflow: auto;}
.settings-list li{cursor: pointer;}
.right-side-section{padding: 0px!important}
.right-side-section .tab-content{height: 100%;    background: #fff;    padding: 0px 15px;	}
.main-body-setting{border-right: 1px solid #f2f2f2;
    box-shadow: 1px 8px 10px -9px #170505;
    z-index: 9;}
.main-body-setting .menu-list-left .nav-link.active, .main-body-setting .menu-list-left .nav-link:hover, .main-body-setting .menu-list-left .nav-link{border: none!important;border-color: transparent;background: transparent}
.menu-list-left ul li{margin: 0rem 0px!important;border-bottom: 1px solid #f2f2f2;    padding: .2rem 0px;}
.main-body-setting{padding: 0px!important}
.menu-list-left{padding: 0px!important}
.right-side-section .tab-pane{height: 100%;}
.right-side-section .tab-pane .header-right {height: 10vh;
    background: white;
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom: 1px solid #f2f2f2;}

.right-side-section .tab-pane .header-right h4{margin: 0px;
    font-size: larger;}
		.right-side-section .tab-pane .header-right h4 span{display: none;}
		.right-side-body{height: 90vh;overflow-y: auto;}
		.right-side-heading{    padding: 1rem 0px!important;
    border-bottom: 1px solid #d2d1d1;}
		.right-side-heading h6{margin-bottom: 0px!important;font-size: 16px;color: #686868;    letter-spacing: .06em;}

.switch-btn	input[type=checkbox]{
	height: 0;
	width: 0;
	visibility: hidden;
}

.switch-btn label {
	box-shadow: 0px 0px 8px -5px inset #4c4c4c6b;
	cursor: pointer;
	text-indent: -9999px;
	width: 65px;
	    height: 40px;
	background: #78788029;
	display: block;
	border-radius: 100px;
	position: relative;
	    margin-bottom: 0px;
}

.switch-btn label:after {
	content: '';
	position: absolute;
	top: 5px;
	left: 5px;
	width: 30px;
	    height: 30px;
	background: #fff;
	border-radius: 90px;
	transition: 0.3s;
}

.switch-btn input:checked + label {
	background: #22a7de;
}

.switch-btn input:checked + label:after {
	left: calc(100% - 5px);
	transform: translateX(-100%);
}

.switch-btn label:active:after {
	width: 35px;
}
.right-side-content{padding: 0px!important}
.right-side-content ul{padding: 0px;margin: 0px;}
.right-side-content ul li{padding: 10px 0px; border-bottom: 1px solid #d2d1d1;cursor: pointer;}
.right-side-content ul li p{margin-bottom: 0px;color: #686868}
.right-side-content ul li a{color: #22a7de!important}
.spacer20px{height: 20px}

.menu-list-left ul .nav-item.active{    background: #22a7de0d;}
.right-side-content ul li h5{ margin-bottom: 0px;
    font-size: large;color: #000}

	/*modal css */
		#lastseen, #Sharedaddress, #FullAddress, #photo-tag , #Discoverality, #Muted, #notification-option{width: 75%;
    right: 0px;
    left: auto;}
	#lastseen .modal-dialog, #Sharedaddress .modal-dialog, #FullAddress .modal-dialog, #Muted .modal-dialog, #photo-tag .modal-dialog, #Discoverality .modal-dialog,  #notification-option .modal-dialog{    margin: 0px 0px 0px auto;    height: 100%;
    min-height: 100%;max-width: 	100%}
	#lastseen .modal-dialog .modal-content, 	#Sharedaddress .modal-dialog .modal-content, #FullAddress .modal-dialog .modal-content, #Muted .modal-dialog .modal-content, #photo-tag .modal-dialog .modal-content, #Discoverality  .modal-content, #notification-option  .modal-content {    height: 100%;
    border: none;
    border-radius: 0px;}
		.last-seen-list{padding: 0px;margin: 0px}
.last-seen-list li{border-bottom: 1px solid #f2f2f2;    padding: 10px 10rem 10px 10px;cursor: pointer;}

.last-seen-list li .media-body h4{margin-bottom: 0px;font-size: 16px}

.last-seen-list li .media-body p{    margin-bottom: 0px;
    margin-top: 0px;
    font-size: 12px;
    letter-spacing: 0.06em;color: #686868;}
		#lastseen .modal-header .col-md-12{padding: 0px!important}

		.last-seen-list li .icon-select img{    width: 25px;position: absolute;left: 0px;top: 50%;transform: translateY(-50%);}
		.last-seen-list  .icon-select img{display: none;}

		.last-seen-list  .active .icon-select img{display: block!important;transition: .5s ease; animation: icon-animation 1s ease }
		.last-seen-list li .media-right{margin: auto;position: relative;}
		.switch-btn{    display: flex;}
		.border-bottom-none{border-bottom: none!important}

/*address book css */
.add-address-book-list{list-style: none;padding: 0px;margin: 1rem 0px}
.add-address-book-list li{padding: 10px 5rem 10px 0px;border-bottom: 1px solid #f2f2f2}
.add-address-book-list li a{color: #22a7de!important;}
		/*animation*/

		@keyframes icon-animation {
			0%{
				opacity: 0;
				    margin-left: -20px;
			}
			100%{
				opacity: 1;
				    margin-left: 0px;
			}
		}

/*common css*/
		ul{list-style: none;}
		.mg-auto{margin: auto;}
		.fa-chevron-left{    color: #22a7de;}

		/*RANGE */



.range-near {
  position: relative;
  width: 550px;
  height: 5px;
}

.range-near input {
  width: 100%;
  position: absolute;
  top: 2px;
  height: 0;
  -webkit-appearance: none;
}

  .range-near input::-webkit-slider-thumb {
    -webkit-appearance: none;
		width: 18px;
	  height: 18px;
	  margin: -8px 0 0;
	  border-radius: 50%;
	  background: #37adbf;
	  cursor: pointer;
	  border: 0 !important;
  }

  .range-near input::-moz-range-thumb {
		width: 18px;
		height: 18px;
		margin: -8px 0 0;
		border-radius: 50%;
		background: #37adbf;
		cursor: pointer;
		border: 0 !important;
  }

 .range-near input::-ms-thumb {
	 width: 18px;
	 height: 18px;
	 margin: -8px 0 0;
	 border-radius: 50%;
	 background: #37adbf;
	 cursor: pointer;
	 border: 0 !important;
  }


  .range-near input::-webkit-slider-runnable-track {
		width: 100%;
		height: 2px;
		cursor: pointer;
		background: #b2b2b2;
  }

 .range input::-moz-range-track {
	 width: 100%;
	 height: 2px;
	 cursor: pointer;
	 background: #b2b2b2;
  }

 .range input::-ms-track {
	 width: 100%;
	 height: 2px;
	 cursor: pointer;
	 background: #b2b2b2;
  }

  .range input:focus {
    background: none;
    outline: none;
  }

  .range input::-ms-track {
    width: 100%;
    cursor: pointer;
    background: transparent;
    border-color: transparent;
    color: transparent;
  }



.near-setting-labels {
  margin: 0px 0px!important;
  padding: 0;
  list-style: none;
	display: flex;
    justify-content: space-between;
}
 .near-setting-labels li {
    position: relative;
    float: left;
    width: auto;
    text-align: center;
    color: #b2b2b2;
    font-size: 14px;
    cursor: pointer;padding-top: 15px!important;padding-bottom: 15px!important;transition: .5s ease;
}

  .near-setting-labels .active {
    color: #000;
		padding-bottom: 0px!important;
padding-top: 25px!important;
  }

  .near-setting-labels .selected::before {
    background: #37adbf;
  }

  .near-setting-labels .active.selected::before {
    display: none;
  }

/*left side btn*/
	.left-side-bottom-btn{    padding: 0px!important;height: 10%;    border-top: 1px solid #f2f2f2;background: #fff}
	.left-side-bottom-btn button{color: #686868;padding-left: 15px;text-align: left;background: transparent;height: 100%;width: 100%;border: none;transition: .5s ease;cursor: pointer;}
.left-side-bottom-btn button:hover{background: #22a7de;color: #fff}
.no-padding{padding: 0px!important}

/*range section*/

.Range-section{padding: 2rem 0px 3rem!important;
    border-bottom: 1px solid #f2f2f2;}
.Range-section ul{list-style: none;padding: 0px;margin: 0px}
.discription{margin-top: 1rem;    font-size: 13px;
    color: #7b7b7b;}
		.header-right .media{    width: 100%;
    height: 100%;align-items: center;}
		.color-blue{ color: #22a7de!important}
		.padding-right15px{padding-right: 15px!important}
		.color-grey{color: #686868}
.Remove-all{padding: 0px!important;cursor: pointer;}
.Remove-all .media{border-bottom: 1px solid #f2f2f2;padding: 10px 0px }
.Remove-all .media .media-left {    margin: auto;}

.Remove-all .media .media-body{margin: auto;padding-left: .5rem}
.Remove-all .media .media-body h4{margin-bottom: 0px;font-size: 16px;    font-weight: 700;color: red;letter-spacing: .04em;
}
.Muted-list{list-style: none;padding: 0px;margin: 0px}
.Muted-list li{border-bottom: 1px solid #f2f2f2;padding: 10px 0px;cursor: pointer;}
.Muted-list li h4{font-size: 16px;margin-bottom: 0px}



@media only screen and (max-width: 768px) {
.main-section-parent.mobile-right .col-md-9.right-side-section{display: block!important; animation: }
	.main-section-parent .col-md-9.right-side-section{display: none;}
	.main-section-parent.mobile-right .col-md-3{display: none;}
	.right-side-section .tab-content{    padding: 0px 0px!important;}
	.right-side-section .tab-pane .header-right h4 span {
    display: inline-block;
}
.right-side-section .tab-pane .header-right h4{text-align: left!important;    font-size: 18px;}
.right-side-content ul li p{    font-size: 12px;}
.right-side-content ul li h5{    font-size: 16px;}
.right-side-section .tab-pane .header-right{align-items: center;
    justify-content: start;}
		#lastseen, #Sharedaddress, #FullAddress, #photo-tag, #Discoverality, #Muted, #notification-option {
		    width: 100%;}
				.last-seen-list li{    padding: 10px 1rem 10px 10px!important;}

}