/*
Description: layout.tpl styles
*/

@media only screen and (min-width: 320px) {
	#CybotCookiebotDialog {
		transform: scale(0.95) !important;
	}
	#footer,
	#footer div,
	#footer span,
	#footer a {
		color: #676767;
	}
	#footer a:hover {
		text-decoration: none;
	}
	#footer .payment-icons span {
		color: #333;
	}
	#footer #incVatInfo {
		float: left;
	}
	#footer .footer-box-content .footer-box-title {
		color: #005AA9;
		font-size: 14px;
		margin-bottom: 10px;
		font-weight: bold;
	}
	#footer .seperator {
		width: 100vw;
	    margin-left: calc(50% - 50vw);
	    margin-right: calc(50% - 50vw);
	}
	#footer .footer-box-last {
		padding-top: 15px;
		padding-bottom: 15px;
		margin-bottom: 50px;
	}
	#footer .footer-box-last .footer-box-content {
    display: flex;
    align-items: start;
    justify-content: flex-start;
    flex-flow: column wrap;
	}

	#footer .footer-box-last .footer-box-content > div {
		display: inline-block;
	}
	#footer .payment-icon,
	#footer .social-icons {
		font-size: 25px;
	}
	#footer .footer-box-last .footer-box-content .social-icons {
		margin-top: 20px;
	}
	#footer .social-icons a:not(:last-child) {
		margin-right: 15px;
	}
	#incVatInfo {
		font-size: 12px;
		line-height: normal;
	}
	#header > .container,
	#wrapper > .container,
	#footer > .container {
		padding: 0 30px;
	}
	#jumptotop {
		line-height: 29px;
		width: 29px;
		height: 29px;
		font-size: 12px;
		background-color: rgba(0,0,0,0.25);
		bottom: 70px;
		right: 17px;
		border-radius: 29px 29px 29px 29px;
	    color: #fff;
        text-align: center;
	}
	body.has-adviser #jumptotop {
		bottom: 140px;
	}
	#jumptotop.show {
		opacity: .9;
        -webkit-transition: all 0.4s cubic-bezier(0.25,1,0.33,1);
        -moz-transition: all 0.4s cubic-bezier(0.25,1,0.33,1);
        -ms-transition: all 0.4s cubic-bezier(0.25,1,0.33,1);
        -o-transition: all 0.4s cubic-bezier(0.25,1,0.33,1);
        transition: all 0.4s cubic-bezier(0.25,1,0.33,1);
	}
	#jumptotop:hover {
		background-color: #035ca8;
		opacity: 1;
	}
	.white-gradient-bg.bg-25 {
		background: #ffffff; /* Old browsers */
		background: -moz-linear-gradient(top,  #ffffff 0%, #ffffff 3%, #f9f9f9 5%, #f9f9f9 45%, #ffffff 50%, #ffffff 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top,  #ffffff 0%,#ffffff 3%,#f9f9f9 5%,#f9f9f9 45%,#ffffff 50%,#ffffff 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom,  #ffffff 0%,#ffffff 3%,#f9f9f9 5%,#f9f9f9 45%,#ffffff 50%,#ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
	}
	[data-revive-zoneid] .img-responsive {
		box-shadow: 0 10px 50px rgb(0 0 0 / 8%), 0 13px 45px rgb(0 0 0 / 8%);
		border-radius: 15px;
	}
	[data-revive-zoneid] .img-responsive img {
		border-radius: 13px;
	}
	body.cl-alist .page-header h1,
	body .page-header h1 {
		font-size: 33.4px;
	    line-height: 35px;		
	    color: #444;
	    margin: 5px 0;
	    display: inline-block;
	    hyphens: auto;
	    -webkit-hyphens: auto;
		-moz-hyphens: auto;
		-ms-hyphens: auto;
	}
	body.cl-alist .page-header h1:after,
	body .page-header h1:after {
		content: '';
	    width: 120px;
	    border-bottom: 2px solid #E20018;
	    padding-bottom: 28px;
	    display: block;
        margin-bottom: 28px;
	}
	#header .service-menu.showLogin .dropdown-menu {
		min-width: 330px;
	}
	.service-menu.showLogin ul.dropdown-menu {
	    display: none;
	}
	.service-menu.showLogin.open ul.dropdown-menu {
		padding: 20px;
		position: fixed;
	    left: 50%;
	    top: 50%;
	    transform: translate(-50%, -50%);
	    z-index: 15;
	    display: block;
		border-radius: 10px;
		border: none;
		box-shadow: rgb(3 92 168 / 23%) 0px 30px 80px;
		max-width: 400px;
		min-width: 1px;
	}
	.service-menu.showLogin .dropdown-overlay {
		position:fixed;
		top:0;
		left:0;
		background-color: rgb(255 255 255 / 75%);
		z-index:5;
		width:100%;
		height:100%;
		display:none;
	}
    
    .service-menu.showLogin.open ul.dropdown-menu + .dropdown-overlay {
		display:block;
		opacity:2;
    }
    .service-menu.showLogin ul.dropdown-menu li > .flex-box {
	    flex-direction: column;
    }
    .service-menu.showLogin ul.dropdown-menu li > .flex-box > div {
	    padding: 15px;
    }
     .service-menu.showLogin ul.dropdown-menu .form-group .input-group {
	     width: 100%;
	}
    .service-menu.showLogin ul.dropdown-menu .form-group input {
	    font-size: 17px;
	    line-height: normal;
	    height: auto;
	    padding: 10.5px 25px;
	    background-color: #efefef;
	    border: 0;
	    box-shadow: none;
	    border-radius: 5px;
    }
    .service-menu.showLogin ul.dropdown-menu #loginBox {
	    display: flex;
	    flex-direction: column;
    }
    .service-menu.showLogin ul.dropdown-menu #loginBox .checkbox label {
	    font-size: 15px;
    }
    .service-menu.showLogin ul.dropdown-menu #loginBox input.checkbox{
	    margin-top: 2px;
    }
    #header .header-box .service-menu.showLogin ul.dropdown-menu .registerBox {
	    display: flex;
	    flex-flow: column wrap;
	    align-items: self-start;
    }
    #header .header-box .service-menu.showLogin ul.dropdown-menu .registerBox a {
	    font-size: 14px;
	    font-weight: bold;
	    color: #005aa9;
    }
    #header .header-box .service-menu.showLogin ul.dropdown-menu .registerBox a:hover {
		text-decoration: none;
	}
    #header .header-box .service-menu.showLogin ul.dropdown-menu #loginBox button {
	    margin: 20px 0;
	    padding: 11.5px 25px;
	    font-size: 15px;
	    line-height: normal;
	    width: 50%;
	    font-weight: bold;
    }
    .logout-link a {
	    color: #999;
	    font-size: 14px;
	}
	.lp-form-field {
		margin: 15px 0 0 0;
	}
	[data-section].emptyContainer,
	[data-container].columnContainer {
		padding: 0 !important;
	}
	form[name=addadress] .form-group input,
	#addressForm .form-group input[type="text"],
	#addressForm .form-group input[type="number"],
	#addressForm .form-group input[type="email"],
	#addressForm .form-group input[type="tel"],
	#addressForm .form-group input[type="url"],
	#addressForm .form-group input[type="password"],
	#addressForm .form-group input[type="date"],
	#addressForm .form-group .bootstrap-select .dropdown-toggle,
	#shippingAddressForm .form-group input[type="text"],
	#shippingAddressForm .form-group input[type="password"],
	#shippingAddressForm .form-group input[type="number"],
	#shippingAddressForm .form-group input[type="email"],
	#shippingAddressForm .form-group input[type="tel"],
	#shippingAddressForm .form-group input[type="url"],
	#shippingAddressForm .form-group input[type="date"],
	.lp-form-field input[type="text"],
	.lp-form-field input[type="password"],
	.lp-form-field input[type="tel"],
	.lp-form-field input[type="number"],
	.lp-form-field input[type="url"],
	.lp-form-field input[type="email"],
	.lp-form-field input[type="date"],
	#orderRemark {
	    background-color: #efefef;
	    border: 0;
	    box-shadow: none;
	    border-radius: 5px;
	    padding: 13px 15px;
	    color: #999;
	    font-size: 17px;
	    height: auto;
	    line-height: initial;
	}
	.cl-order #orderRemark {
		padding: 0;
		background-color: transparent;
	}
	#addressForm .form-group .bootstrap-select .dropdown-toggle,
	#shippingAddressForm .form-group .bootstrap-select .dropdown-toggle,
	.lp-form-field .form-group .bootstrap-select .dropdown-toggle {
		padding: 12px 15px;
		background-color: #fff;
		border: 1px solid #eee;
	}
	#addressForm .form-group .bootstrap-select {
		height: auto;
	}
	#addressForm select:not(.bs-select-hidden).selectpicker.no-js {
		display: inline-block!important;
		height: auto;
		padding: 11.5px 15px;
		font-size: 17px;		
	}
	.lp-form-field input[type="checkbox"] {
		margin-top: 0;
	    vertical-align: middle !important;
	}
	.lp-form-field input[type="checkbox"] + label {
		margin-bottom: 0;
		display: inline-block;
		line-height: normal;
		vertical-align: middle;
		width: 90%;
	}
	.lp-form-field input[type="radio"] {
		margin-top: 0;
	    vertical-align: middle !important;
	}
	.lp-form-field input[type="radio"] + label {
		margin-bottom: 0;
		line-height: normal;
		vertical-align: middle;
	    margin-right: 15px;
	}
	.checkout-box textarea,
	.lp-form-field textarea {
		outline: none;
		border: 0;
		background-color: #efefef;
		box-shadow: none;
		border-radius: 5px;
	}
	.lp-form-field select {
		border-color: #efefef;
		padding: 13px 15px;
		color: #999;
		font-size: 17px;
		line-height: 18.5px;
		height: auto;
	}
	.lp-form-button {
		background-color: #E65D26;
		color: #fff;
		border-radius: 5px;
		padding: 7px 20px;
		font-weight: bold;
		box-shadow: 0 5px 13px 0 rgb(230, 93, 38, 0.5);
		font-size: 14px;
		border: 0;
		margin: 50px 0 35px;
	}
	form[name=addadress] .flex-box.form-wrapper,
	form[name="order"] .flex-box.form-wrapper,
	#orderPayment .flex-box.form-wrapper {
		justify-content: space-between;
		flex-wrap: wrap;
	}
	form[name=addadress] .flex-box.form-wrapper .form-group {
		margin-left: 0;
		margin-right: 0;
	}
	form[name=addadress] .flex-box.form-wrapper .form-group,
	form[name="order"] .flex-box.form-wrapper .form-group,
	#orderPayment .flex-box.form-wrapper .form-group {
		flex: 0 0 100%;
	}
	form[name=addadress] .flex-box.form-wrapper .form-group.long,
	form[name="order"] .flex-box.form-wrapper .form-group.long,
	#orderPayment .flex-box.form-wrapper .form-group.long {
		flex: 0 0 calc(75% - 7.5px);
	}	
	form[name=addadress] .flex-box.form-wrapper .form-group.short,
	form[name="order"] .flex-box.form-wrapper .form-group.short,
	#orderPayment .flex-box.form-wrapper .form-group.short {
		flex: 0 0 calc(25% - 7.5px);
	}
	form[name=addadress] .flex-box.form-wrapper .help-block,
	form[name="order"] .flex-box.form-wrapper .help-block,
	#orderPayment .flex-box.form-wrapper .help-block {
		flex: 0 0 100%;
	}
	#addressForm .form-group > .form-group,
	#addressForm .form-group .form-wrapper > .form-group {
		margin-bottom: 0;
	}
	form[name="order"]#addressForm .flex-box.form-wrapper.flxfrm-fon .form-group.short,
	form[name="order"]#addressForm .flex-box.form-wrapper.flxfrm-mobfon .form-group.short,
	form[name="order"]#addressForm .flex-box.form-wrapper.flxfrm-fax .form-group.short,
	form[name="order"] #addressForm .flex-box.form-wrapper.flxfrm-fon .form-group.short,
	form[name="order"] #addressForm .flex-box.form-wrapper.flxfrm-mobfon .form-group.short,
	form[name="order"] #addressForm .flex-box.form-wrapper.flxfrm-fax .form-group.short,
	form[name="order"]#shippingAddress .flex-box.form-wrapper.flxfrm-fon .form-group.short,
	form[name="order"]#shippingAddress .flex-box.form-wrapper.flxfrm-mobfon .form-group.short,
	form[name="order"]#shippingAddress .flex-box.form-wrapper.flxfrm-fax .form-group.short,
	form[name="order"] #shippingAddress .flex-box.form-wrapper.flxfrm-fon .form-group.short,
	form[name="order"] #shippingAddress .flex-box.form-wrapper.flxfrm-mobfon .form-group.short,
	form[name="order"] #shippingAddress .flex-box.form-wrapper.flxfrm-fax .form-group.short {
		flex: 0 0 30%;
	}
	form[name="order"]#addressForm .flex-box.form-wrapper.flxfrm-fon .form-group.long,
	form[name="order"]#addressForm .flex-box.form-wrapper.flxfrm-mobfon .form-group.long,
	form[name="order"]#addressForm .flex-box.form-wrapper.flxfrm-fax .form-group.long,
	form[name="order"] #addressForm .flex-box.form-wrapper.flxfrm-fon .form-group.long,
	form[name="order"] #addressForm .flex-box.form-wrapper.flxfrm-mobfon .form-group.long,
	form[name="order"] #addressForm .flex-box.form-wrapper.flxfrm-fax .form-group.long,
	form[name="order"]#shippingAddress .flex-box.form-wrapper.flxfrm-fon .form-group.long,
	form[name="order"]#shippingAddress .flex-box.form-wrapper.flxfrm-mobfon .form-group.long,
	form[name="order"]#shippingAddress .flex-box.form-wrapper.flxfrm-fax .form-group.long,
	form[name="order"] #shippingAddress .flex-box.form-wrapper.flxfrm-fon .form-group.long,
	form[name="order"] #shippingAddress .flex-box.form-wrapper.flxfrm-mobfon .form-group.long,
	form[name="order"] #shippingAddress .flex-box.form-wrapper.flxfrm-fax .form-group.long {
		flex: 0 0 70%;
	}
	form[name="order"]#addressForm .flex-box.form-wrapper.flxfrm-fon .form-group.short input,
	form[name="order"]#addressForm .flex-box.form-wrapper.flxfrm-mobfon .form-group.short input,
	form[name="order"]#addressForm .flex-box.form-wrapper.flxfrm-fax .form-group.short input,
	form[name="order"] #addressForm .flex-box.form-wrapper.flxfrm-fon .form-group.short input,
	form[name="order"] #addressForm .flex-box.form-wrapper.flxfrm-mobfon .form-group.short input,
	form[name="order"] #addressForm .flex-box.form-wrapper.flxfrm-fax .form-group.short input,
	form[name="order"]#shippingAddress .flex-box.form-wrapper.flxfrm-fon .form-group.short input,
	form[name="order"]#shippingAddress .flex-box.form-wrapper.flxfrm-mobfon .form-group.short input,
	form[name="order"]#shippingAddress .flex-box.form-wrapper.flxfrm-fax .form-group.short input,
	form[name="order"] #shippingAddress .flex-box.form-wrapper.flxfrm-fon .form-group.short input,
	form[name="order"] #shippingAddress .flex-box.form-wrapper.flxfrm-mobfon .form-group.short input,
	form[name="order"] #shippingAddress .flex-box.form-wrapper.flxfrm-fax .form-group.short input {
		border-top-right-radius: 0;
		border-bottom-right-radius: 0;
		border-right: 1px solid #ccc;
	}
	form[name="order"]#addressForm .flex-box.form-wrapper.flxfrm-fon .form-group.long input,
	form[name="order"]#addressForm .flex-box.form-wrapper.flxfrm-mobfon .form-group.long input,
	form[name="order"]#addressForm .flex-box.form-wrapper.flxfrm-fax .form-group.long input,
	form[name="order"] #addressForm .flex-box.form-wrapper.flxfrm-fon .form-group.long input,
	form[name="order"] #addressForm .flex-box.form-wrapper.flxfrm-mobfon .form-group.long input,
	form[name="order"] #addressForm .flex-box.form-wrapper.flxfrm-fax .form-group.long input,
	form[name="order"]#shippingAddress .flex-box.form-wrapper.flxfrm-fon .form-group.long input,
	form[name="order"]#shippingAddress .flex-box.form-wrapper.flxfrm-mobfon .form-group.long input,
	form[name="order"]#shippingAddress .flex-box.form-wrapper.flxfrm-fax .form-group.long input,
	form[name="order"] #shippingAddress .flex-box.form-wrapper.flxfrm-fon .form-group.long input,
	form[name="order"] #shippingAddress .flex-box.form-wrapper.flxfrm-mobfon .form-group.long input,
	form[name="order"] #shippingAddress .flex-box.form-wrapper.flxfrm-fax .form-group.long input {
		border-top-left-radius: 0;
		border-bottom-left-radius: 0;
	}
	form[name="order"]#addressForm .flex-box.form-wrapper .form-group.flxfrm-zip.short,
	form[name="order"] #addressForm .flex-box.form-wrapper .form-group.flxfrm-zip.short,
	form[name="order"]#shippingAddress .flex-box.form-wrapper .form-group.flxfrm-zip.short,
	form[name="order"] #shippingAddress .flex-box.form-wrapper .form-group.flxfrm-zip.short {
		flex: 0 0 100%;
	}
	#orderPayment .flex-box.form-wrapper label {
		display: block;
	}
	.unzerUI.input,
	#payment-sepa-confirm #sepaagree_unzer {
		display: flex;
	}
	.unzerUI.input .unzerInput,
	.unzerUI.input input,
	.unzerUI.form .wide.field .unzerUI.input input {
		width: auto;
	}
	#payment-sepa-confirm #oscunzersepaagreement {
		margin: 0;
	}
	#payment-sepa-confirm label {
		margin: 0 10px;
	}
}

@media only screen and (min-width: 768px)
{
	body.cl-alist .page-header h1,
	body .page-header h1 {
		font-size: 50px;
	    line-height: 50px;		
	}
	#header > .container,
	#wrapper > .container,
	#footer > .container {
		padding: 0 15px;
	}
	#footer .footer-box-last {
		margin-bottom: 0px;
		min-height: 170px;
	}
	form[name="order"] .flex-box.form-wrapper .form-group.middle {
		flex: 0 0 calc(37.5% - 15px);
	}
	form[name="order"] .flex-box.form-wrapper .form-group.three-box {
		flex: 0 0 calc(33.333333333333333% - 7.5px);
	}
	form[name="addadress"] .flex-box.form-wrapper .form-group.half,
	form[name="order"] .flex-box.form-wrapper .form-group.half {
		flex: 0 0 calc(50% - 7.5px);
	}
	form[name="order"]#addressForm .flex-box.form-wrapper .form-group.flxfrm-zip.short,
	form[name="order"] #addressForm .flex-box.form-wrapper .form-group.flxfrm-zip.short,
	form[name="order"]#shippingAddress .flex-box.form-wrapper .form-group.flxfrm-zip.short,
	form[name="order"] #shippingAddress .flex-box.form-wrapper .form-group.flxfrm-zip.short {
		flex: 0 0 calc(25% - 7.5px);
	}
	form[name="order"]#addressForm .flex-box.form-wrapper.flxfrm-fon .form-group.short,
	form[name="order"]#addressForm .flex-box.form-wrapper.flxfrm-mobfon .form-group.short,
	form[name="order"]#addressForm .flex-box.form-wrapper.flxfrm-fax .form-group.short,
	form[name="order"] #addressForm .flex-box.form-wrapper.flxfrm-fon .form-group.short,
	form[name="order"] #addressForm .flex-box.form-wrapper.flxfrm-mobfon .form-group.short,
	form[name="order"] #addressForm .flex-box.form-wrapper.flxfrm-fax .form-group.short,
	form[name="order"]#shippingAddress .flex-box.form-wrapper.flxfrm-fon .form-group.short,
	form[name="order"]#shippingAddress .flex-box.form-wrapper.flxfrm-mobfon .form-group.short,
	form[name="order"]#shippingAddress .flex-box.form-wrapper.flxfrm-fax .form-group.short,
	form[name="order"] #shippingAddress .flex-box.form-wrapper.flxfrm-fon .form-group.short,
	form[name="order"] #shippingAddress .flex-box.form-wrapper.flxfrm-mobfon .form-group.short,
	form[name="order"] #shippingAddress .flex-box.form-wrapper.flxfrm-fax .form-group.short {
		flex: 0 0 25%;
	}
	form[name="order"]#addressForm .flex-box.form-wrapper.flxfrm-fon .form-group.long,
	form[name="order"]#addressForm .flex-box.form-wrapper.flxfrm-mobfon .form-group.long,
	form[name="order"]#addressForm .flex-box.form-wrapper.flxfrm-fax .form-group.long,
	form[name="order"] #addressForm .flex-box.form-wrapper.flxfrm-fon .form-group.long,
	form[name="order"] #addressForm .flex-box.form-wrapper.flxfrm-mobfon .form-group.long,
	form[name="order"] #addressForm .flex-box.form-wrapper.flxfrm-fax .form-group.long,
	form[name="order"]#shippingAddress .flex-box.form-wrapper.flxfrm-fon .form-group.long,
	form[name="order"]#shippingAddress .flex-box.form-wrapper.flxfrm-mobfon .form-group.long,
	form[name="order"]#shippingAddress .flex-box.form-wrapper.flxfrm-fax .form-group.long,
	form[name="order"] #shippingAddress .flex-box.form-wrapper.flxfrm-fon .form-group.long,
	form[name="order"] #shippingAddress .flex-box.form-wrapper.flxfrm-mobfon .form-group.long,
	form[name="order"] #shippingAddress .flex-box.form-wrapper.flxfrm-fax .form-group.long {
		flex: 0 0 75%;
	}	
}

@media only screen and (min-width: 991px)
{
	#footer .footer-box-last {
		min-height: 0;
	}
	#footer .footer-box-last .footer-box-content {
	    display: flex;
	    align-items: center;
	    justify-content: space-between;
		flex-flow: row wrap;
	}
	#footer .footer-box-last .footer-box-content .social-icons {
		margin-top: 0;
		font-size: 16px;
	}
	.white-gradient-bg.bg-25 {
		background: #ffffff; /* Old browsers */
		background: -moz-linear-gradient(top,  #ffffff 0%, #ffffff 10%, #f9f9f9 15%, #f9f9f9 45%, #ffffff 50%, #ffffff 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top,  #ffffff 0%,#ffffff 10%,#f9f9f9 15%,#f9f9f9 45%,#ffffff 50%,#ffffff 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom,  #ffffff 0%,#ffffff 10%,#f9f9f9 15%,#f9f9f9 45%,#ffffff 50%,#ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
	}
	.register-wrapper {
		width: 75%;
	}
	form[name="addadress"] .flex-box.form-wrapper .form-group.pw,
	form[name="order"] .flex-box.form-wrapper .form-group.pw,
	form[name="order"] .flex-box.form-wrapper .form-group.pwr {
		flex: 0 0 calc(50% - 15px)
	}
}


@media only screen and (min-width: 1300px) {
	.fullwidth-container .main-row #wrapper > .container,
	.fullwidth-container .main-row #header .container,
	.fullwidth-container .main-row #footer .container {
		width: 1245px;
	}
	#footer {
		padding: 0;
	}
}