/*!
 * mobile style
 */
section.menu-mobil {
    height: 116px;
    background: #FFFFFF;
    border-bottom-right-radius: 20px;
    border-bottom-left-radius: 20px;
    box-shadow: 0 3px 6px #0000001F;
	display:none;
}
.dismobil,.dis-mobil  {
    display: none !important;
}
@media (max-width: 768px) { 
    #DialogModal .modal-dialog.modal-dialog-centered {
        width: 100%;
        min-width: 100%;
        margin: 0;
    }
    span.share-span {
       display: inline-block;
        padding-left: 6px;
        padding-right: 8px;
    }
    .col.flex {
        padding: 10px 5px;
    }
    .img-box {
        padding-right: 10px;
    }
    .box-person {
        margin-right: 15px;
    }
	.dismobil {
		display: block !important;
	}
	.dis-mobil {
		display: inline-block !important;
	}
	a.addpro.me-auto {
		margin-bottom: 10px;
		display: inline-block;
		margin-right: auto;
		font-size: 10px;
		color: #FEFEFE;
	}
	a.navbar-brand.web {
		display: none;
	}
	a.navbar-brand.mobil {
		display: unset;
	}
	.login-btn {
		max-width: 225px;
	}
	.navbar-expand-lg .navbar-nav .nav-link {
		padding: 5px 15px;
	}
	.distop {
		display: none;
	}
	section.menu-mobil {
		display: flex;
		padding-top: 40px;
		align-items: center;
	}
	.logo img {
		width: 77px;
		height: 72px;
	}
	section.menu-mobil .row {
		display: flex;
		align-items: center;
	}
	.btn-mobil-login {
		background: #424689;
		border-radius: 20px;
		color: #FEFEFE;
		font-size: 10px;
		font-family: 'Light';
		text-align: center;
		padding: 10px 14px;
		width: 116px;
		margin-right: auto;
	}
	.btn-mobil-login  a{
		color: #FEFEFE;
		font-size: 10px;
		font-family: 'Light';
	}
	#menuModel .modal-dialog {
		margin: 0;
		width: 90%;
		background: transparent;
		height: 122%;
		border-radius: 0;
	}
	#menuModel .modal-dialog .modal-content {
		border-radius: 0;
		border-top-left-radius: 16px;
		border-bottom-left-radius: 16px;
		padding: 40px 0 0;
		background: #FFFFFF;
		padding-bottom: 20px;
	}
	.modal-header .mobil-logo img {
		width: 77px;
		height: 71px;
	}
	div#menuModel button.close {
		border: 0;
		background: transparent;
	}
	.modal-header {
		display: flex;
		align-items: center;
	}
	.modal-header a.addpro.me-auto {
		margin-bottom: 0px;
	}
	.nav-link {
		background: #4246891A;
		margin-bottom: 4px;
		padding: 10px 40px 15px 0;
		color: #424689;
	}
	.navbar-nav .nav-link.active, .navbar-nav .show>.nav-link {    
		background: #CA18781A;
	}
	.opinions h3 {
		font-size: 14px;
		min-height: 23px;
	}
	a.add-project {
		font-size: 10px;
		padding: 7px 18px;
	}
	h2.toptop {
		display: none;
	}
	.flex-mobil {
		display: flex;
		align-items: center;
		align-content: center;
		justify-content: space-around;
	}
	.form-name .form-control {
		margin-bottom: 0;
	}
	select#last {
		flex: 0 0 130px;
		max-width: 130px;
		font-size: 11px;
		padding: 7px 5px;
	}
	.form-name {
		max-width: 240px;
	}
	.bink-h2 {
		color: #CA1878;
		font-size: 12px;
		margin-top: 20px;
	}
	.bink-h2 img{
		margin-left:5px;
	}
	section.breadcrumb-sec {
		display: none;
	}
	.box.pad-20 {
		padding: 0;
		background: transparent;
	}
	.employe p:first-child {
		width: 100%;
	}
	.project-box a.add-project {
		float: revert;
		margin-bottom: 10px;
	}	
	.box {
		margin-bottom: 10px;
	}
	ul.ofer li {
		font-size: 11px;    
	}
	ul.ofer li.done-li::before {
		left: 2px;
		width: 100%;
	}
	ul.ofer li:before {
		left: 15px;
	}
	.col-mobil-12 {
		flex: 0 0 100%;
	}
	.flex-filter {
		display: block;
	}
	.nav-tabs .nav-link {
		padding: 7px;
		font-size: 11px;
		border-bottom: 1px solid #d9dae7;
	}
	.tab-content>.tab-pane {
		padding: 10px 5px;
	}
	h4.pro-name {
		width: 100%;
		font-size: 11px;
	}
	.login-box {
		display: block;
		padding: 10px 5px;
	}
	.login-img {
		display: none;
	}
	.login-content .center .me-auto {
		font-size: 12px;
		padding: 15px;
	}
	a.edit-profile.me-auto {		
		font-size: 11px;
		padding: 10px 15px;
		height: 40px;
	}
	.cart-products {
		height: 300px;		
		padding: 10px;
	}
	.cart-product{
		padding: 10px;
	}
	.gt-quantity {
		bottom: -6px;
	}
	a.cart-pro-img {
		margin-left: 10px;
	}
	ul.buy li:before {		
		width: 49%;		
		right: -32px;
		z-index: 1;
	}
	.col-sm.wed1 {
		display: flex;
	}
	.col-sm.wed1 p img {
		width: 92px;
	}
	ul.footer-contact li img {
		width: 24px;
		margin-left: 4px;
		height: 24px;
	}
	.col-sm.wed1 p {
		margin-left: 10px;
	}
	ul.footer-contact li a {
		font-size: 10px;
		line-height: 10px;
	}
	ul.footer-contact li {
		margin-bottom: 4px;
	}
	ul.footer-contact li a span {		
		line-height: 15px;
	}
	footer .dismobil {
		display: flex !important;
	}
	ul.menu li {
		margin-bottom: 6px;
	}
	footer h2 {		
		font-size: 12px;
		margin-bottom: 20px;		
	}
	footer ul li a {		
		font-size: 11px;		
		font-family: 'Light';
	}
	.col.wed4, .col.wed5, .col.wed3 {
		padding: 0 10px;
	}
	p.copyright {		
		font-size: 9px;
	}
	section.slider-home {
		background-image: url(../img/bg-slider-mobil.png);
		margin-top: -20px;
		padding-top: 20px;
		background-position: left;
	}
	ul.social-media-slider {
		margin-top: 11px;
		margin-bottom: 0;
		padding: 0;
	}
	ul.social-media-slider li img {
		width: 20px;
		height: 20px;
	}
	.social-media-slider li {
		margin-bottom: 0px;
	}
	.mobil-row .col-xs-2{
		flex: 0 0 8%;
	}
	.mobil-row .col{
		flex: 0 0 80%;
	}
	.slider-home h2 {
		font-size: 12px;
		width: 67%;
		margin: 0 auto;
		padding-top: 70px;
		line-height: 16px;
		padding-bottom: 11px;
	}
	.slider-home p {
		font-size: 10px;
		font-family: 'Light';
		width: 60%;
		margin: 0 auto;
		padding-bottom: 11px;
	}
	form.d-flex.form-project {
		width: 100%;
		margin-bottom: 13px;
	}
	.down {
		margin-bottom: 35px;
	}
	header {
		z-index: 999999999999999;
		position: relative;
	}
	.sec2 {
		padding-top: 15px;
	}
	h2.main {
		font-size: 12px;
		margin-bottom: 15px;
	}
	.sec2 img.dis-mobil {
		max-height: 200px;
		margin-bottom: 10px;
	}
	.sec2-box h3 {
		font-size: 12px;
		margin-bottom: 12px;
	}
	.sec2-box p {		
		font-size: 10px;		
	}
	.sec2 .two {
		padding-top: 0px;
		font-size: 12px;
		text-align: center;
		font-family: 'Bold';
		margin-bottom: 16px;
	}
	.carousel-item {
		padding: 10px 35px;
	}
	div#carouselhome .flex {
		display: block;
	}
	.img-carousel img {
		width: 61px;
		height: 61px;
		margin-bottom: 13px;
	}
	.content-carousel h3 {
		font-size: 12px;
		margin-bottom: 10px;
	}
	.content-carousel p {
		width: 100%;
		font-size: 10px;
		line-height: 16px;
	}
	a.transparent-btn {
		margin-bottom: 10px;
		font-size: 10px;
	}
	.carousel-control-next {
		left: -11px;		
		width: 25px;
	}
	.carousel-control-prev {
		right: -11px;
		width: 25px;
	}
	div#carouselhome {
		margin: 0 3px;
	}
	.carousel-control-prev img,.carousel-control-next img {
		width: 25px;
		height: 25px;
	}
	.carousel-indicators {
		margin-bottom: 16px;
	}
	.sec3 .main {		
		margin-bottom: 30px;
	}
	section.sec3 {
		background: url(../img/bg-sec3-mobil.png);
	}
	.base h4 {		
		font-size: 12px;
		height: 45px;
	}
	.base {		
		padding: 45px 37px 35px;
		margin-bottom: 10px;
	}
	.sec4 {
		padding-top: 23px;
		padding-bottom: 23px;
	}
	.sec4 p {
		font-size: 10px;
		margin-bottom: 17px;
	}
	.boxsec4 {
		padding: 40px 45px;
		margin: 0 35px 25px;
	}
	.boxsec4 h3 {
		font-size: 14px;
	}
	.boxsec4 p {
		margin: 0;
	}
	img.iconn {
		width: 51px;
		margin-top: -30px;
	}
	.sec5 .main {
		width: 86%;
	}
	p.m {
		font-size: 10px;
	}
	.flex-slid {
		display: unset;
	}
	div#carouselExampleIndicators .carousel-item {
		padding: 15px 0px 35px;
	}
	div#carouselExampleIndicators {
		width: 80%;
		margin: 0 auto;
	}
	.slid2 p, .slid2 h4 {
		font-size: 12px;
		text-align: center;
		margin-bottom: 8px;
	}
	.slid1 {
		text-align: center;
	}
	img.person-slid {
		width: 115px;
	}
	#carouselExampleIndicators .carousel-indicators {		
		margin: 0px auto 30px;
		bottom: -40px;
		width:30%
	}
	#carouselExampleIndicators button.carousel-control-next {
		left: 75px;
		bottom: -14px;
		top: unset;
	}
	#carouselExampleIndicators button.carousel-control-prev {
		right: 75px;
		bottom: -14px;
		top: unset;
	}
	img.iconl {
		width: 52px;
		margin-top: -30px;
	}
	.box-sec6 {
		padding: 50px 40px;
		background-image: url(../img/bg-sec6-mobile.png);
	}
	.box-sec6 h2 {
		font-size: 12px;
		margin-bottom: 20px;
	}
	.box-sec6 p {
		font-size: 10px;    
		margin-bottom: 20px;
	}
	div#shopCarousel {
		display: none;
	}
	.user-login .nav-link {
		padding: 0 10px;
		background: transparent;
	}
	ul.navbar-nav.user-login {
		display: flex;
		flex-direction: row;
	}
}
	@media (max-width: 767px){
		.box-product h2 {
			font-size: 16px;
			margin-bottom: 10px;
		}
		.box-product p {
			color: #9A9A9A;
		}
		ul#products-tab {
			border-radius: 34px;
			padding: 10px;
		}
		#products-tab .nav-link {
			font-size: 11px;			
			line-height: 21px;
			padding: 0 5px;
		}
		#productsContent p {
			font-size: 11px;			
			margin-bottom: 10px;
		}
		.description-ul li {
			color: #2D2D2D;
			font-size: 13px;
			margin-bottom: 8px;
		}
		.chat-content {
			padding-bottom: 0px;
		}
		div#project-imgs .carousel-control-next {
			left: 100px;
		}
		div#project-imgs .carousel-control-prev {
			right: 100px;
		}
		label.address-select .checkmark1, label.delevry-select .checkmark1 {
			padding: 14px;
			height: 50px;
			padding-right: 40px;
			width: 100%;
			font-size: 12px;
		}
	}
	.carousel-inner .carousel-item.active, .carousel-inner .carousel-item-next, .carousel-inner .carousel-item-prev{display: flex}
	@media (min-width: 768px){
		.carousel-inner .carousel-item-end.active, .carousel-inner .carousel-item-next{transform: translateX(25%)}
		.carousel-inner .carousel-item-start.active, .carousel-inner .carousel-item-prev{transform: translateX(-25%)}
	}
	.carousel-inner .carousel-item-end, .carousel-inner .carousel-item-start{transform: translateX(0)}