@main_green: #6aa034; /* светлый зеленый цвет, текст и кнопки */

@main_grey: #898b8e;  /* средний серый цвет, текст и кнопки */

@light_grey: #C6C7C9; /* светлый серый цвет, рамки и линии */

@dark_grey: #333333;  /* темный серый цвет, большие названия, цифры */  

.main_cont_wrap {
	width: 940px;
	margin: auto;
	padding: 0px 10px;
	color: #333333;
	line-height: 19px;
	.services_title {
		font-size: 30px;
		padding-top: 0px;
		padding-bottom: 26px;
		font-weight: bold;
		margin: 0px;
	}
	.services_title_servis { 
		font-size: 30px;
		padding-top: 0px;
		padding-bottom: 39px;
		font-weight: bold;
		margin: 0px;
	}
	
	.services_block {
		display: flex;
		flex-wrap: wrap;
		.services_each {
			width: 215px;
			padding: 0 10px;
			text-align: center;
			display: inline-block;
			margin-bottom: 45px;
			.name {
				font-size: 18px;
				font-weight: bold;
				padding: 20px 0px;
				display: block;
				padding-bottom: 16px;
			}
			img {
			    display: block;
			    height: 65px;
			    margin: auto;
			}
			p { font-size: 13px; line-height: 16px; } 
		}
	}
}
.delivery_block {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	padding-bottom: 362px;
	padding-top: 11px;
}
.delivery_each_block {
	font-size: 13px;
	width: 450px;
	line-height: 16px;
	img {
		display: block;
		width: 290px;
		margin: auto;
	}
	.name { 
		font-weight: bold; 
		padding: 27px 0 18px; 
		display: block; 
		text-align: center;
		font-size: 15px;
	}
	.address {
		font-size: 16px;
		font-weight: bold;
		display: block;
		padding-bottom: 20px;
	}
}
.contact_page_phones {
	font-size: 16px;
	font-weight: bold;
	padding-bottom: 15px;
}
.align_items_bottom {
	align-items: flex-end;
}
.manufacturers_block {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-bottom: 40px;
	margin-top: 13px;
	a {
		width: 172px;
		height: 100px;
		background-image: url('../images/manufacturers/manufacturers.png');
		overflow: hidden;
		margin-bottom: 20px;
		&:nth-child(1) { background-position:  0px 0px; }
		&:nth-child(2) { background-position: -182px 0px; }
		&:nth-child(3) { background-position: -360px 0px; }
		&:nth-child(4) { background-position: -541px 0px; }
		&:nth-child(5) { background-position: -723px 0px; }
		&:nth-child(6) { background-position:  0px -108px; }
		&:nth-child(7) { background-position: -181px -108px; }
		&:nth-child(8) { background-position: -360px -108px; }
		&:nth-child(9) { background-position: -541px -108px; }
		&:nth-child(10) { background-position: -721px -108px; }
		&:nth-child(11) { background-position:  0px -216px; }
		&:nth-child(12) { background-position: -182px -216px; }
		&:nth-child(13) { background-position: -360px -216px; }
		&:nth-child(14) { background-position: -541px -216px; }
		&:nth-child(15) { background-position: -721px -216px; }
		&:nth-child(16) { background-position:  0px -325px; }
		&:nth-child(17) { background-position:  -182px -325px; }
		&:nth-child(18) { background-position:  -360px -325px; }
		&:nth-child(19) { background-position:  -541px -325px; }
		&:nth-child(20) { background-position:  -723px -325px; }
	}
}
.payment_icon_1 {
	display: inline-block;
	background-image: url('../images/payment01.png');
	background-repeat: no-repeat;
	width: 90px;
	height: 40px;
	float: left;
	background-position: 26px 5px;
}
.payment_icon_2 {
	display: inline-block;
	background-image: url('../images/payment01.png');
	background-repeat: no-repeat;
	width: 90px;
	height: 40px;
	float: left;
	background-position: 26px -32px;	
}
.payment_01 {
	margin: 21px 2px;
	display: block;
}
span.bold { font-weight: bold; }
span.red { color: red; }
.font_size_13 { font-size: 13px; }
.padding_450 { padding-bottom: 450px; }

.basket_main_title {
	margin-top: 0;
	font-weight: bold;
	font-size: 30px;
	margin-bottom: 29px;
}
.privet_info_block {
	h3 {
		font-size: 18px;
		font-weight: bold;
		padding-bottom: 16px;
	}
	label {
		font-size: 13px;
		font-weight: bold;
	}
	span.placehold {
		font-size: 12px;
		color: @main_grey;
		font-weight: normal;
	}
	input {
		padding: 7px 5px 9px;
    	border: 1px solid @light_grey;
   		border-radius: 2px;
   		margin: 0 12px 0 8px;
   		width: 256px;
	}
	.padding_cust { 
		padding: 0px 0px 8px 14px; 
		&:nth-child(3) { padding-left: 17px; }
		&:nth-child(4) { padding-left: 1px; }
	}
}
.separator {
	width: 960px;
	height: 1px;
	border-bottom: 1px solid @light_grey;
	margin: 11px 0 27px;
}
.delivery_radio {
	h3 { padding-bottom: 12px; }
	p { display: inline-block; font-size: 13px;}
	.padding_cust { padding-bottom: 6px; }
	span.placehold {
		color: @main_grey;
		display: block;
		font-size: 13px;
		padding-left: 23px;
    	position: relative;
    	bottom: 4px;
	}
}
.basket_pay_block {
	h3 { padding-bottom: 12px; }
	p { display: inline-block; font-size: 13px;}
	.padding_cust { padding-bottom: 6px; position: relative; }
	span.placehold {
		color: @main_grey;
		display: block;
		font-size: 13px;
		padding-left: 23px;
    	position: relative;
    	bottom: 4px;
	}
	input[type="text"] {
	    margin-left: 8px;
	    height: 17px;
	    top: -11px;
	    position: absolute;
	    left: 315px;
	    height: 22px;
	    border-radius: 2px;
	    border: 1px solid @light_grey;
	    width: 89px;
	    padding: 5px;
	}
}
.separator_02 {
	width: 960px;
	height: 1px;
	border-bottom: 1px solid @light_grey;
	margin: 3px 0 27px;
}
.for_margin {text-align: center; margin: 27px 0 84px; }
.order_01_btn {
	font-size: 13px;
	box-shadow: 0 2px darken(@main_green, 10%);
	border: none;
	border-radius: 2px;
	background-color: @main_green;
	padding: 6px 22px;
	color: white;
	&:hover { background-color: darken(@main_green, 5%); }
	&:active {
		position: relative;
		box-shadow: none;
		top: 2px;
	}
}
.order_list {
	width: 595px;
	.active { background-color: lighten(@light_grey, 10%); } 
	h3 { margin-bottom: 6px; }
	hr { 
		margin-top: 0px; 
		margin-right: 0; 
		margin-left: 0; 
		margin-bottom: 16px;
		&:nth-child(5) {
			margin-top: 15px;
    		width: 930px;
    		margin-left: -10px;
		} 
	}
	.all_price {
		p { 
			font-size: 15px;
			display: inline-block;
			&:nth-child(1) { padding-left: 19px; } 
			&:nth-child(2) { float: right; padding-right: 20px; } 
		}
		.all_count {  }
		.all_price { font-size: 20px; font-weight: bold; }
	}
}
.order_list_li {
	padding: 10px 20px;
	display: inline-flex;
	.little_img {
		height: 78px;
		width: 78px;
		border: 1px solid @light_grey;
		overflow: hidden;
		display: inline-block;
		margin-right: 14px;
		float: left;
		img { height: 100%; }
	}
	.name_and_code {
		display: inline-block;
		float: left;
		.name {
		    display: block;
		    color: @main_green;
		    font-size: 15px;
		    width: 175px;
		    margin-bottom: 7px;
		    position: relative;
		    line-height: 18px;
		    top: -3px;
		}
		.code {
			display: block;
			font-size: 12px;
		}
	}
	.how_many {
		display: inline-block;
	    padding: 32px 20px 0px 85px;
	    font-weight: bold;	
	}
	.price {
	    display: inline-block;
	    padding-left: 44px;
	    font-weight: bold;
	    font-size: 18px;
	    padding-top: 31px;
    	padding-left: 48px;
    	.price_text { font-size: 15px; font-weight: normal; }
	}

}
.basket_step_2_delivery {
	h3 { 
		font-size: 18px; 
		font-weight: bold;
		margin-top: 28px;
    	margin-bottom: 12px; 
	}
	h4 {
		font-size: 18px; 
		font-weight: bold;
		margin-top: 24px;
    	margin-bottom: 12px;
	}
	.detail {
		font-size: 13px;
		margin-bottom: 7px;
		.grey {
			color: @main_grey;
			display: inline-block;
			width: 69px;
		}
	}
}
.for_margin_2 {
	text-align: center;
    margin: 34px 0 42px;
}

.cabinet_main_title {
	margin-top: 0;
	font-weight: bold;
	font-size: 30px;
	margin-bottom: 38px;
}
.cabinet_wrap {
	position: relative;
	margin-bottom: 282px;
	span.grey { color: @main_grey; }
	.cab_01 { padding-bottom: 24px; }
	.block_01 {
		display: inline-block;
		width: 233px;
	}
	.block_02 {
		display: inline-block;
		width: 79px;
	}
	.block_03 {
		display: inline-block;
		width: auto;
	}
	.block_04 {
		display: inline-block;
		padding-left: 60px;
		border-left: 1px solid @light_grey;
		position: relative;
		vertical-align: top;
		margin-left: 20px;
		.link {
			padding-top: 21px;
		    padding-bottom: 20px;
		    font-size: 13px;
		    .dotted { border-bottom: 1px dotted @main_green; }
		    a { text-decoration: none; }
		    &:nth-child(2) {
		    	padding-top: 4px;
			    font-size: 13px;
			    padding-bottom: 20px;
			    a { border-bottom: none; text-decoration: none; }
		    }

		}

	}
}

/*=============================================== MODAL WINDOWS ================================================*/
											
											/* registration window */
/* стили модального окна*/
.modal_window_basic (@heigth, @width, @top, @left) {
    text-align: right;
    height: @heigth;
    width: @width;
    background-color: #fff;
    padding: 20px;
    position: fixed;
    left: @left;
    top: @top;
    border-radius: 2px;
    overflow: hidden;
	.title {
		font-size: 18px;
		font-weight: bold;
		padding-top: 29px;
		padding-bottom: 27px;
		text-transform: uppercase;
		text-align: center;
	}
	input {
	    padding: 8px;
	    width: 251px;
	    margin-right: 56px;
	    margin-left: 11px;
	    border: 1px solid @light_grey;
	    border-radius: 3px;
	}
	.my_cust_btn {
		font-size: 13px;
	    padding: 8px 31px;
		color: white;
		border: none;
		border-radius: 3px;
		background-color: @main_green;
		box-shadow: 0 2px darken(@main_green, 10%);
		&:hover { background-color: darken(@main_green, 5%); }
		&:active { position: relative; box-shadow: none; top: 2px; }
	}
}
/* стили основного модального окна */
.modal_close_btn {
	position: absolute;
    right: -42px;
    top: -59px;
    cursor: pointer;
    width: 100px;
    height: 120px;
    overflow: hidden;
    background-image: url(../images/modal_close_btn.png);
    background-repeat: no-repeat;
    background-position: -143px 0;
    &:hover { background-position: 0 0; };
}

.modal_wrapper {
	color: @dark_grey;
	width: 100%;
    background: rgba(0, 0, 0, 0.4);
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
}

.modal_wrapper_reg {
	.modal_wrapper;
	display: none;
	.modal_window {
		.modal_window_basic (428px, 560px, 35px, 27.6%);
		.title {
			font-size: 18px;
			font-weight: bold;
			padding-top: 30px;
			padding-bottom: 26px;
			text-transform: uppercase;
			text-align: center;
		}
		label{
			display: block;
			font-size: 13px;
			width: 500px;
			margin: auto;
			margin-bottom: 8px;
			&:last-of-type {
				position: relative;
				input {
					width: 119px;
					margin-left: 140px;
				}
				img {
					position: absolute;
					top: 4px;
					left: 176px;
				}
			}
		}
		.for_btn_position {
			text-align: center;
			margin-top: 30px;
		}

	}
}



												/* login window */

.modal_wrapper_login {
	.modal_wrapper;
	display: none;
	.modal_window {
		.modal_window_basic (247px, 459px, 35px, 27.6%);
		.title { padding-right: 8px; }
		label{
			display: block;
			font-size: 13px;
			width: 459px;
			margin: auto;
			margin-bottom: 8px;
			input { margin-right: 68px; }
		}
		.pass_links {
			text-align: center;
		    padding-left: 55px;
		    font-size: 13px;
		    margin-top: 11px;
			a { padding-left: 47px; }
			label { display: inline; }
			.remember_pas {
				color: @main_green;
				text-decoration: underline;
			}
		}
		.for_btn_position {
			text-align: center;
    		margin-top: 23px;
    		.my_cust_btn { padding: 8px 38px; }
		}
	}
}

												/* forgot password window */
.forgot_pass_modal_wrapper {
	.modal_wrapper;
	display: none;
	.modal_window {
		.modal_window_basic (252px, 459px, 35px, 27.6%);
		.title { 
		    padding-right: 0px;
		    padding-top: 30px;
		    padding-bottom: 23px; 
		}
		.text { 
			color: @main_grey; 
			font-size: 13px; 
			text-align: left;
			margin-bottom: 28px; 
		}
		label{
			display: block;
			font-size: 13px;
			width: 459px;
			margin: auto;
			margin-bottom: 30px;
			input { margin-right: 52px; }
		}
		.pass_links {
			text-align: center;
		    padding-left: 55px;
		    font-size: 13px;
		    margin-top: 11px;
			a { padding-left: 47px; }
			label { display: inline; }
			.remember_pas {
				color: @main_green;
				text-decoration: underline;
			}
		}
		.for_btn_position {
			text-align: center;
    		margin-top: 23px;
    		.my_cust_btn { padding: 8px 28px; }
		}
	}

}

												/* forgot password success window */
.forgot_pass_success_wrapper {
	.modal_wrapper;
	display: none;
	.modal_window {
		.modal_window_basic (158px, 459px, 35px, 27.6%);
		.title { 
		    padding-right: 0px;
		    padding-top: 30px;
		    padding-bottom: 23px; 
		}
		.text { 
			color: @main_grey; 
			font-size: 13px; 
			text-align: center;
			margin-bottom: 27px; 
		}
		.for_btn_position {
			text-align: center;
    		margin-top: 23px;
    		.my_cust_btn { padding: 8px 22px; }
		}
	}

}

												/* callback window */
.callback_wrapper {
	.modal_wrapper;
	display: none;
	.modal_window {
		.modal_window_basic (158px, 459px, 35px, 27.6%);
		.title { 
		    padding-right: 0px;
		    padding-top: 32px;
		    padding-bottom: 25px;
		    font-size: 28px; 
		}
		.text { 
			color: @dark_grey; 
			font-size: 16px; 
			text-align: center;
			margin-bottom: 27px; 
		}
	}
}

/*=============================================== CATEGORY PAGE ================================================*/

.category_page_main_title {
	margin-top: 0;
	margin-bottom: 41px;
	font-weight: bold;
}
.category_wrap {
	margin-bottom: 18px;
	.category_wrap_3_colum {
		width: 300px;
		display: inline-block;
		vertical-align: top;
		margin-right: 15px;
		&:last-of-type { margin-right: 0px; }
	}
	.wrap {
		a { text-decoration: none; }
		margin-bottom: 16px;
		.cat_li_cont {
			border: 1px solid @light_grey;
		    border-radius: 2px;
		    width: 298px;
		    height: 78px;
		    display: inline-block;
		    position: relative;
			img {
				padding-top: 9px;
			    padding-left: 7px;
			    float: left;
			    padding-right: 20px;
			}
			.desc {
			    font-size: 15px;
			    width: 150px;
			    color: #333333;
			    margin-left: 87px;
			    height: 78px;
			    display: table-cell;
			    vertical-align: middle;
			}
			.arrow {
			    background-image: url("../images/category/green_arrows.png");
			    width: 20px;
			    height: 10px;
			    background-repeat: no-repeat;
			    display: block;
			    position: absolute;
			    right: 15px;
			    top: 35px;
			    background-position: 0px 0px;
			}
		}
		.cat_li_sub_ul {
		    padding: 18px 2px 13px 18px;
		    font-size: 13px;
		    line-height: 20px;
		    border: 1px solid #C6C7C9;
		    width: 278px;
		    background-color: white;
		    position: relative;
		    top: -6px;
		    border-top: none;
		    display: none;
		}
	}

}

/*=============================================== 404 PAGE ================================================*/

.wrap_for_404 {
	min-height: 670px;
	.main_title_404 {
		font-size: 30px;
		margin-top: 0;
		margin-bottom: 30px;
		font-weight: bold;
	}
	.main_img_404 {
		float: left;
		position: relative;
    	right: 10px;
    	padding: 27px 21px 10px 0px;
	}
	.block_404 {
		.first {
		    font-size: 16px;
		    margin-top: 103px;
		    line-height: 20px;
		}
		.second {
			font-size: 13px;
		    margin-top: 60px;
		    line-height: 15px;
			color: @main_grey;
		}
		button {
		    padding: 7px 21px;
		    background-color: @main_green;
		    margin-top: 47px;
		    margin-left: 151px;
		    border: none;
		    font-size: 13px;
		    color: white;
		    border-radius: 3px;
		    box-shadow: 0 2px darken(@main_green, 10%);
		    &:hover { background-color: darken(@main_green, 5%); }
		    &:active { position: relative; top: 2px; box-shadow: none; }
		}
	}
}