
.type-tab {
	height: 100px;
}

.type-tab.active, .type-tab:hover {
    background-color: #a2c800;
    border-color: #a2c800;
    color: #ffffff;
}

.type-tab.active:after, .type-tab:hover:after {
    content: "";
    width: 0;
    height: 0;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-top: 15px solid #a2c800;
    position: absolute;
    bottom: -15px;
    z-index: 99;
}

label[for=winding_method_1] {
    background: url(/media/theme/icons/orientation_01.png) no-repeat 50% 50%;
}

label[for=winding_method_11] {
    background: url(/media/theme/icons/orientation_02.png) no-repeat 50% 50%;
}

label[for=winding_method_12] {
    background: url(/media/theme/icons/orientation_03.png) no-repeat 50% 50%;
}

label[for=winding_method_13] {
    background: url(/media/theme/icons/orientation_04.png) no-repeat 50% 50%;
}

label[for=winding_method_14] {
    background: url(/media/theme/icons/orientation_05.png) no-repeat 50% 50%;
}

label[for=winding_method_15] {
    background: url(/media/theme/icons/orientation_06.png) no-repeat 50% 50%;
}

label[for=winding_method_16] {
    background: url(/media/theme/icons/orientation_07.png) no-repeat 50% 50%;
}

label[for=winding_method_17] {
    background: url(/media/theme/icons/orientation_08.png) no-repeat 50% 50%;
}

.input-group .line h3, .nomanual .thimble_section .name {
    padding: 10px;
    font-size: 1.1rem;
    font-weight: 700;
	background-color: #ffffff;
    margin: 0;
	padding-right: 40%;
	font-family: 'Taviraj', serif;
}

.input-group h2 {
    color: #ffffff;
    font-weight: 500;
    font-size: 1.3rem;
	background-color: #a2c800;
	text-transform: uppercase;
	padding: 15px 20px;
	font-family: 'Prompt', sans-serif;
}

#middle-header, #middle-header2 {
    background: #3d3d3c;
	color: #ffffff;
    padding: 10px;
    font-weight: 600;
    font-size: 1.1rem;
    line-height: 1.5;
}

#material_info_link {
    background: #a2c800;
}

#tab-menu-calculator {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
	grid-gap: 20px;
}

#product-calculator .type-tab {
	background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 50%;
}

#product-calculator #type-advanced {
	background-image: url(/media/theme/calculator/label-calculator-black.png);
}

#product-calculator #type-special {
	background-image: url(/media/theme/calculator/special-calculator-black.png);
}

#product-calculator #type-sheets {
	background-image: url(/media/theme/calculator/sheets-calculator-black.png);
}

.type-tab {
    font-weight: 600;
    position: relative;
}

#product-calculator h2 {
	background-repeat: no-repeat;
	background-size: contain;
	height: 40px;
	display: flex;
    align-items: center;
	margin-top: 2rem;
}

#product-calculator h2 {
	background-image: url(/media/theme/calculator/calculator-base-data.jpg);
}

#product-calculator #special-options h2{
	background-image: url(/media/theme/calculator/calculator-special-options.jpg);
}

#product-calculator .sheets-disable h2{
	background-image: url(/media/theme/calculator/calculator-packaging.jpg);
}

.input-group .name {
    font-weight: 500;
	padding: 3px;
	display: flex;
    align-items: center;
    gap: 5px;
}

.input-group .line .parameters, .input-group .line .parameter-box {
    padding: 25px;
}

.input-group .line.nomanual .parameters {
	padding: 0;
}

#product-calculator select {
	height: 40px;
    border: 1px solid #e3e3e3;
	font-family: 'Prompt', sans-serif;
}

#product-middle-block-in {
    background: #f5f5f5;
    margin-left: 30px;
}

#product-middle-block-in .product-options-bottom {
	padding: 0px 30px 20px;
}

#product-middle-block #middle-header, #product-middle-block #middle-header2 {
    margin-bottom: 25px;
}

#product-left-block {
	padding-top: 0;
}

.product-info-main .product-add-form {
	padding-top: 0;
}

#price-proposal {
	padding: 0 30px;
}

input[type="text"]::placeholder {
	color: #b9b9b9;
}



@media (min-width: 600px) {
	
	#tab-menu-calculator {
        grid-template-columns: repeat(3, 1fr);
    }
	
	#product-calculator h2 {
		background-size: 50%;
	}
}

@media (min-width: 768px) {


    .parameters .flexcontainer {
        flex-direction: column;
    }
	
	#tab-menu-calculator {
		grid-gap: 30px;
    }
	
	#product-calculator h2 {
		height: 60px;
	}
	
	

}

@media (min-width: 992px) {
    .product-add-form {
        width: 65%;
    }

    #product-middle-block {
        width: 35%;
    }
	
	label[for=winding_method_1], label[for=winding_method_11], label[for=winding_method_12], label[for=winding_method_13], label[for=winding_method_14], label[for=winding_method_15], label[for=winding_method_16], label[for=winding_method_17] {
		display: inline-block;
		background-size: 100%;
		width: 80px;
		height: 80px;
	}
	
}

@media (min-width: 1024px) {
	
	#product-calculator h2 {
		height: 48px;
	}
	

}

@media (min-width: 1170px) {
	
	#product-calculator h2 {
		height: 60px;
	}
	
	label[for=winding_method_1], label[for=winding_method_11], label[for=winding_method_12], label[for=winding_method_13], label[for=winding_method_14], label[for=winding_method_15], label[for=winding_method_16], label[for=winding_method_17] {
		display: inline-block;
		background-size: 100%;
		width: 100px;
		height: 100px;
	}
	
	

}

@media (min-width: 1440px) {
	
	#product-calculator h2 {
		height: 65px;
	}

}
