/*
The Bootstrap grid system has four classes:
xs (for phones - screens less than 768px wide)
sm (for tablets - screens equal to or greater than 768px wide)
md (for small laptops - screens equal to or greater than 992px wide)
lg (for laptops and desktops - screens equal to or greater than 1200px wide)
*/
/* STYLES */
@media (max-width: 500px) {
	h1, .h1 {
		font-size: 30px; 
	}	
	.pagetitle {
		text-align: center;
		margin-top: 30px;
	}	
	.breadcrumbs {
		text-align: center;
		margin-bottom: 30px;
	}
}
/* LAYOUT */
@media (max-width: 1200px) {
	.container {
		width: auto;
		padding: 0 15px;
	}
	.payment-item {
		width: 30%;
		margin-right: 5%;
	}
}
/*
[header -> logo & card]
*/
@media (max-width: 992px) {
	.hidden-sm {
		display: none !important;
	}
	.visible-sm {
		display: block !important;
	}
	.hamburger {
		position: absolute;
		left: 15px;
		width: 19px;
		height: 17px;
		background: url('../img/hamburger.png') no-repeat center;
		top: 65px;
		cursor: pointer;
	}
	.header.header-new .hamburger {
		top:45px;
	}
	.header .logo {
		margin-left: 40px;
	}
	.header-right {
		margin-left: 300px;
	}
	.header .header-area {
		padding-top: 17px;
		padding-bottom: 17px;
		min-height: 0;
	}
	.header .card .col {
		width: 50%;
	}	
	.header .card .col.time {
		width: 50%;
	}	
	.header .card .col.phone {
		margin-top: 15px;
	}
	.header .card .col.callback {
		margin-top:15px;
		text-align: left;
	}
	.header .card .callback .item {
		text-align:center;
	}
	.container-menu {
		position: absolute;
		width: 290px;
		background: #121E30;
		top: 0;
		bottom: 0;
		left: -290px;
		-webkit-transition: .25s ease;
		-o-transition: .25s ease;
		transition: .25s ease;
		z-index: 3;
	}
	.header .menu {
		display: block;
	}
	.header .menu ul {
	    display: block;
	    font-size: 16px;
	}
	.header .menu ul li {
		display: block;
		text-align: center !important;
		margin-top: 30px;
	}
	.header .menu ul li ul {
		display: none !important;
	}
	.open-mobile-menu .container-menu {
		left: 0;
	}
	.mobile-logo {
		text-align: center;
		margin-top: 15px;
	}
	.mobile-logo img {
		width: 75px;
	}
	.container-menu .close-menu {
		position: absolute;
		top: 40px;
		left: 15px;
		cursor: pointer;
		background: url('../img/close.png') no-repeat center;
		width: 15px;
		height: 15px;
	}
	.payment-item {
		width: 100%;
		margin-right: 0;
	}
}
@media (max-width: 768px) {
	.hidden-xs {
		display: none !important;
	}
	.visible-xs {
		display: block !important;
	}
	.hamburger {
		top: 42px;
	}
	.header.header-new .hamburger
	{
		top: 35px;
	}
	.header .logo {
		width: 75px;
	}
	.header-right {
		margin-left: 150px;
		margin-top: 22px;
	}
	.header .card .col {
		width: 50%;
	}
	.header .card .email .item {
		background-image: url('../img/email.png');
	}
	.header .card .item {
		font-size: 14px !important;
		font-weight: 400 !important;
		padding-left: 25px;
		line-height: 15px;
		height: auto;
	}
	.header .card .phone .item {
		background-image: url('../img/phone.png');
	}
	.header .card .col.phone {
		margin-top: 0;
	}
}
@media(max-width: 500px) {
	.header .card .col {
		width: 100%;
	}
	.header-right {
		margin-top: 15px;
		margin-left: 135px;
	}
	.header .card .col.phone {
		margin-top: 10px;
	}
}

/*
[header -> slider]
*/
@media (max-width: 992px) {	
	.header .slider {
		display:none;
	}	
}
/*
[advertblock]
*/
@media (max-width: 1100px) {
	.advertblock {
		background-position:top center;
		background-repeat:repeat-y;
		background-color:#121e30;
		text-align:center;
	}	
	.advertblock .container {
		height:950px;
	}	
	.advertblock ul {
		width:36%;
		margin:auto 7%;
	}	
	.advertblock ul li {
		text-align:left;
	}	
	.advertblock .link {
		margin-top:120px;
		right:60px;
	}	
	.advertblock .link a {		
		text-align:left;
	}	
	.advertblock .chuvak {
		right:60px;
	}
}
@media (max-width: 768px) {
	.advertblock {
		background-image:url(../img/advertblock/bg-2.jpg);
	}	
	.advertblock .container {
		height: auto;
		overflow:auto;
	}	
	.advertblock ul {
		width:auto;
		float:none;
		margin:0;
		padding:0;
	}	
	.advertblock ul.r {
		margin-top:30px;
	}	
	.advertblock ul li {
		height:auto;
		overflow:auto;
		background-position:top center;
		text-align:center;
		padding-top:20px;
		margin-bottom:30px;
	}	
	.advertblock ul li:last-child {
		margin-bottom:0px;
	}	
	.advertblock .link {
		position:relative;
		margin:65px 0 65px 0;
		padding:0;
		top:auto;
		right:auto;
		width:auto;
		height:auto;
		background-image:none;
		border:1px solid #fff;
		padding:30px;
	}	
	.advertblock .link a {
		display:inline;
		margin:0;
		padding:0;
	}	
	.advertblock .chuvak {
		display:none;
	}
}
@media(max-width:500px) {
	.advertblock .title {
		margin: 30px 0;
		font-size: 24px;
	}
	.advertblock .link {
		margin: 30px 0;
		padding: 15px;
	}
	.advertblock .link a {
		font-size: 22px;
	}
}
/*
[productiontable-toc]
*/
@media (max-width: 768px) {
	.productiontable-toc a {
		margin: 15px;
		font-size: 12px;
	}
}
@media(max-width: 500px) {
	.productiontable-toc {
		margin-top: 25px;
	}
	.productiontable-toc a {
		height: 28px;
		line-height: 28px;
		padding: 0 15px;
		border-radius: 14px;
		margin: 5px 5px 0;
	}
	.productiontable-toc a + a {
		margin-left: 7px;
	}
}
/*
[productiontable]
*/
@media (max-width: 768px) {
	.productiontable table.l, .productiontable table.r, .productiontable table.alone {
		width:100%;
		float:none;
		margin:0;
	}
	.productiontable table tr.empty {
		display: none;
	}
	.productiontable .title {
		font-size: 16px;
		line-height: 16px;
	}
	.productiontable .title .cost {
		display: inline;
		font-size: 13px;
	}
	.productiontable .title .cost span {
		font-size: 16px;
	}
}
@media (max-width: 500px) {
	.productiontable {
		margin-top: 30px;
	}
	.productiontable table {
		font-size:12px;
		display: none !important;
	}
	.productiontable .table-xs {
		display: block;
	}
	.button-v3 {
		height: 45px;
		line-height: 45px;
		-webkit-background-size: auto 40px;
		background-size: auto 40px;
	}
}
/*
[banner]
*/
@media (max-width: 992px) {
	.banner .area {
		text-shadow: 1px 1px 1px #000;
	}
}
@media (max-width: 768px) {
	.banner .container {
		padding: 0;
	}
	.banner .area a {
		font-size: 24px;
		height: 100px;
		padding-top: 20px;
	}
}
@media (max-width: 500px) {
	.banner {
		margin-top: 30px;
	}
	.banner .area a {
		font-size: 18px;
		height: 75px;
		padding-top: 15px !important;
		padding-left: 15px;
		padding-right: 15px;
	}
	.banner .area br {
		display: none;
	}
}
/*
[calculator]
*/
@media (max-width: 992px) {
	.calculator .bottom {
		text-align:center;
	}	
	.calculator .bottom .input {
		width:auto;
		float:none;
	}	
	.calculator .itogo {
		display:inline-block;
	}	
	.calculator .itogo-torg {
		display:inline-block;
	}	
	.calculator .itogo-h.loader {
		background-position: bottom center;
	}
}
@media (max-width: 768px) {
	.calculator .top {
		background-image: none;
	}	
	.calculator .input {
		width:auto;
		float:none;
	}	
	.calculator .seperator {
		display:none;
	}	
	.calculator .arm {
		display:none;
	}
}
@media (max-width: 500px) {
	.calculator {
		margin-top: 30px;
	}
	.calculator .title {
		padding: 30px 0 20px;
	}
	.calculator .input div {
		padding: 0 15px;
	}
	.calculator .top {
		padding-bottom: 20px;
	}
	.calculator .bottom {
		padding-top: 30px;
	}
	.calculator .input div.itogo {
		margin-top: -30px;
	}
}
/*
[productionorder]
*/
@media (max-width: 600px) {
	.productionorder .input {
		width:auto;
		float:none;
	}
	
	.productionorder .input div, .productionorder .textarea div {
		padding:0 5px 0 5px;
	}
}
@media(max-width: 500px) {
	.productionorder {
		margin-top: 30px;
	}
	.productionorder .title {
		padding: 30px 0;
		font-size: 22px;
		line-height: 24px;
	}
}
/*
[infoblock]
*/
@media (max-width: 992px) {
	.infoblock .i {
		text-align: center;
	}	
	.infoblock .i img {
		height: 300px;
	}	
	.infoblock .i div {
		top: 110px;
		font-size: 18px;
	}
}
@media (max-width: 768px) {
	.infoblock .col {
		width: auto;
		float: none;
		margin-left: 0;
		margin: 30px 0;
	}	
	.infoblock .i div {
		left: 50px;
	}
	.infoblock p {
		margin-top: 20px;
	}
}
@media (max-width: 500px) {
	.infoblock {
		margin-top: 30px;
	}
	.infoblock .title {
		font-size: 25px;
		line-height: 27px;
	}
	.infoblock .i img {
		height: 275px;
	}	
	.infoblock .i div {
		top: 95px;
		left: 20px;
	}
}
/*
[contacts]
*/
@media (max-width: 768px) {
	.contacts {
		text-align:center;
	}
	
	.contacts ul li {
		width:auto;
	}
	
	.contacts ul li.map {
		float:none;
		width:auto;
		margin-left:0;
		text-align:center;
	}
}
/*
[advantages]
*/
@media (max-width: 768px) {	
	.advantages ul li {
		width: 50%;
	}	
	.advantages ul li div.icon {
		padding-top: 100px;
	}
}
@media (max-width: 500px) {
	.advantages {
		margin-top: 30px;
	}
	.advantages ul li {
		margin-top: 30px;
	}
}
/*
[production]
*/
@media (max-width: 1200px) {	
	.production .area ul li .title {
		overflow:hidden;
	}	
	.production .area ul li .icon {
		overflow:hidden;
	}
}
@media (max-width: 992px) {	
	.production .area ul li {
		width:100%;
	}	
	.production .area ul li#item-armatura:hover, .production .area ul li#item-beton:hover, .production .area ul li#item-prokat:hover {
		background-image:url(../img/productions/area_bg-orig.jpg);
	}	
	.production .area ul li.item-hover#item-beton {
		background-image:url(../img/productions/area_bg-orig.jpg);
	}
}
@media (max-width: 768px) {	
	.production .area ul li {
		min-height:350px;
	}	
	.production .area ul li .title {
		margin-top:40px;
		font-size:35px;
	}	
	.production .area ul li .icon img {
		height:200px;
	}
}
@media (max-width: 500px) {
	.production, .production .area {
		margin-top: 30px;
	}
}
/*
[partners]
*/
@media(max-width: 500px) {
	.partners {
		margin: 30px 0;
	}
	.partners .control {
		margin-top: 30px;
	}
	.partners .pagination {
		margin-top: 30px;
	}
}
/*
[/partners]
*/	
/*
[footer -> logo & card]
*/
@media (max-width: 992px) {
	.footer .logo {
		float:none;
		width:100%;
		text-align:center;
	}
	
	.footer .card {
		margin-left:0px;
	}
	
	.footer .card .col {
		width:33.33333%;
	}
	
	.footer .card .col.time {
		width:33.33333%;
	}
	
	.footer .card .col.phone {
		text-align:right;
	}
	
	.footer .card .col.email {
		text-align:center;
	}
	
	.footer .card .col.callback {
		text-align:center;
		width:100%;
		clear:both;
		margin-top:25px;
	}
	
	.footer .card .callback .item {
		text-align:center;
	}
}
@media (max-width: 768px) {
	.footer .card .col {
		text-align:center;
		width:100%;
		float:none;
	}
	
	.footer .card .col.time {
		width:100%;
	}
	
	.footer .card .col.phone {
		text-align:center;
	}
	
	.footer .card .col.callback {
		text-align:center;
	}
	
	.footer .card .item {
		text-align:center;
		height:auto;
		line-height:normal;
		padding:0;
		margin:0;
	}
	
	.footer .card .time .item, .footer .card .email .item, .footer .card .phone .item {
		background-image:none;
	}
	
	.footer .card .phone .item {
		font-size:20px;
		margin-top:5px;
	}
}
/*
[footer -> menu]
*/
@media (max-width: 768px) {	
	.footer .menu, .footer .menu ul, .footer .menu ul li {
		display: block;
	}
	.footer .menu ul li {
		text-align: center !important;
	}
	.footer .menu ul li + li {
		margin-top: 30px;
	}
}
/*
[footer -> epilog]
*/
@media (max-width: 500px) {
	.footer .footer-area {
		padding: 30px 0;
	}
	.footer .epilog {
		margin-top: 30px;
	}
	.footer .epilog ul {
		display: block;
	}	
	.footer .epilog ul li {
		display: block;
		width: 100%;
	}	
	.footer .epilog ul li:first-child, .footer .epilog ul li:last-child {
		text-align: center;
	}	
	.footer .epilog ul li:last-child {
		margin-top: 30px;
	}
}
/*
[popup]
*/
@media (max-width: 600px) {
	.popup-window {
		width: auto; 
		top: 1%; 
		left: 1%; 
		right: 1%; 
		margin: 0;
		max-height: 98%;
	}	
	.popup-window .area.success {
		border-width: 10px;
		font-size: 18px;
	}
}



@media(max-width: 1200px) {
	.armatura .slider .area .item .text {
		font-size: 30px;
	}
	.armatura .slider .text-left {
		font-size: 46px;
	}
	.armatura .slider .text-right {
		line-height: 36px;
	}
	.armatura .slider .slider-right img {
		max-width: calc(100% +  30px);
	}	
	.armatura .content {
		width: calc(100% - 290px);
	}
	.armatura-table {
		padding: 20px 30px 30px;
	}
	.armatura-table .left {
		width: 30px;
	}
	.armatura-table .bottom {
		height: 30px;
	}
	.armatura-table .bottom:after {
		border-width: 0 30px 30px 0;
	}
	.armatura-table .top {
		width: 190px;
	}
	.armatura-table .right {
		display: none;
	}
}
@media(max-width: 992px) {
	.armatura .content {
		width: 100%;
		float: none;
	}
	.calculator-new .calc-title {
		display: none;
	}
	.calculator-new .calc-content {
		margin-left: 20px;
	}
	.myprice-left {
		width: 100%;
		float: none;
	}
	.myprice-right {
		margin-left: 0;
		margin-top: 20px;
	}
}
@media(max-width: 768px) {
	.armatura-table {
		background: transparent;
		padding: 0;
	}
	.armatura-table .bg {
		display: none;
	}
	.armatura-table .title {
		color: #333;
		float: none;
	}
	.armatura-table .title span {
		display: inline-block;
		margin-left: 5px;
	}
	.armatura-table .armatura-table-top {
		float: none;
		margin-bottom: 20px;
	}
	.calculator-new {
		height: auto;
		padding-bottom: 30px;
	}
	.calculator-new .calc-content {
		margin-right: 20px;
	}
	.calculator-new .calc-price {
		position: static;
		border-left: none;
	}
	.calculator-new .calc-price .title {
		margin-bottom: 20px;
	}
	.price-block {
		margin-bottom: 20px;
	}
	.price-item {
		float: none;
		width: 100%;
		margin-bottom: 0;
	}
	.price-item:nth-child(2n) {
		text-align: left;
	}
}

@media(max-width: 500px) {
	.calculator-new .calc-content .calc-input {
		width: 100%;
		margin-right: 0;
	}
	.calculator-new .calc-content .calc-input label {
		float: none !important;
		display: block !important;
		width: 100% !important;
	}
	.calculator-new .calc-content .calc-input .input {
	    margin-left: 0 !important;
	}
	.myprice-right .input {
		width: 100% !important;
		margin-right: 0;
	}
}