/*TEST-VERSION-BUTTON*/
.positioned-button {position:absolute;right:32px;display:none;}
.positioned-button-fixed {position:fixed;top:160px;display:block;}
/*NAVIGATION-ASSISTANCE*/
.navigation-assistance {position:fixed;top:320px;right:32px;height:290px;padding:16px;border-radius:16px;z-index:20;width:256px;}
.navigation-assistance li {margin-bottom:24px;}

/*FUNCTIONALITIES*/
#functionalities {padding:64px 0;}

/*WARENWIRTSCHAFT*/
#warenwirtschaft {position:relative;margin:0;padding:32px 0;}
#warenwirtschaft .big-p {font-size:48px;width:90%;margin:0 auto;padding:128px 0 32px 0;font-family:"Poppins-Light",serif;text-align:center;}
#warenwirtschaft .information {text-align:left;padding-bottom:128px;}
#warenwirtschaft .call-to-action {padding:32px 0;font-family:"Poppins-Light",serif;font-size: 28px;}
#warenwirtschaft .arrow-down {width:64px;height:64px;animation: jump 0.5s ease-in infinite;cursor: pointer;}

/*REFERENCES-OVERVIEW*/
#references-overview {position:relative;display:block;padding:64px 0 32px 0;}
#references-overview .surrounder {width:80%;margin:0 auto;}
#references-overview ul {width:100%;display:inline-block;}
#references-overview li {width:25%;display:inline-block;float:left;margin-bottom:64px;}
#references-overview .blog-entry {background:white;margin:0 auto;width:320px;height:560px;border-radius:16px;}
#references-overview h3 {height:90px;font-size:20px;}
#references-overview .image-holder {overflow: hidden;width:100%;height:192px;border-top-left-radius:6px;border-top-right-radius:6px;}
#references-overview .teaser-image {width:100%;}
#references-overview .information-holder {height:310px;padding:12px;overflow:hidden;}
#references-overview .teaser-text {text-align:left;}
#references-overview .date-text{font-size:14px;padding:8px 0;}
#references-overview .button {margin:240px auto 0 auto;width:256px;}

/*PRICING*/
#pricing .pricing-options {width:100%;display:block;padding:32px 0;}
#pricing .pricing-option-holder {width:24%;display:inline-block;margin-bottom:32px;}
#pricing .pricing-option {width:90%;height:460px;text-align:center;border-radius:16px;overflow:hidden;}
#pricing .pricing-option .top-holder {width:100%;height:80px;}
#pricing .pricing-option .top-holder h3 {padding-top:24px;}
#pricing .pricing-option .price-holder {width:90%;margin:8px auto;}
#pricing .pricing-option .price-holder .price-label {margin:16px auto;font-size:20px;font-weight:bold;}
#pricing .pricing-option .price-holder .start-up-label {margin:16px auto;color:lightcoral;}
#pricing .pricing-option .info-list-holder {width:90%;margin:8px auto;display:inline-block;text-align:left;}
#pricing .pricing-option .icon-check {margin-bottom:-10px;}
#pricing .switch-holder {margin:32px 0;}
#pricing .info-list-holder li .disabled {color:grey;}
#pricing .extended-info-holder {margin-top:32px;}
#pricing .extended-info-holder p {font-size: 14px;color:grey;padding-bottom:16px;}

/*CALL-TO-ACTION*/
#call-to-action .content-holder {display:block;position:relative;width:720px;height:600px;margin:0 auto;}
#call-to-action h2 {text-align:center;}
#call-to-action .separate-line {width:100%;height:1px;border:none;}
#call-to-action .contact-element {width:100%;margin:12px 0 0 0;padding-left:3%;background:transparent;color:white;border:none;}
#call-to-action .textfield {height:48px;}
#call-to-action .content {margin:0 auto;padding:32px 64px 0 64px;}
#call-to-action .textarea {height:160px;resize:none;padding-top:12px;}
#call-to-action .field-holder {width:97%;}
#call-to-action .info-text {text-align:right;}
#call-to-action .button {margin:12px 0 0 0;}

@media screen and (max-width: 1800px){
    /*REFERENCES-OVERVIEW*/
    #references-overview li {width:33.3%;}
}
@media screen and (max-width: 1300px) {
    /*POSITIONED-BUTTON*/
    .positioned-button {right:16px;}
    .positioned-button-fixed {top:112px;}
    /*PRICING*/
    #pricing .pricing-option {width:95%;}
    #pricing .pricing-option-holder {width:49%;}
    /*REFERENCES-OVERVIEW*/
    #references-overview li {width:50%;}
}
@media screen and (max-width: 1000px) {
    /*QUOTE*/
    #quote .ceo-image {margin:-32px 64px 0 0;width:256px;float:right;}
    /*TECHNOLOGIES*/
    #technologies .content-holder {margin-top:8px;height:1024px;}
    #technologies .content-holder .technologies-li {display:block;width:100%;height:15%;}
    #technologies .content-holder .content {padding:8px 0;}
    #technologies .logo-img {max-width:96px;max-height:96px;margin:8px auto;}
    #technologies p {width:80%;margin:8px auto;}
    #technologies .content-holder .plus-icon {width:32px;height:32px;margin:0;}
    #technologies .content-holder .folded-content {display:none;}
    #technologies .content-holder .expanded {height:55%;}
    #technologies .separator {height:1px;width:80%;margin:0 0 0 10%;}
    /*REFERENCES-OVERVIEW*/
    #references-overview .surrounder {width:100%;}
    /*PRICING*/
    #pricing .pricing-option-holder {width:100%;}
}
@media screen and (max-width: 800px) {
    /*QUOTE*/
    #quote .image-holder {width:100%;display: inline-block;text-align: center;}
    #quote .ceo-image {margin:-32px auto 0 auto;float:none;}
    #quote .quote {width:90%;}
    /*WARENWIRTSCHAFT*/
    #warenwirtschaft .video-holder {width:100%;padding-bottom:56.25%;}
    #warenwirtschaft .link-hover {width:96px;}
    /*REFERENCES-OVERVIEW*/
    #references-overview li {width:100%;}
    /*PRICING*/
    #pricing .pricing-options {display: inline-block;}
    #pricing .pricing-option {width:100%;margin-top:16px;}
    /*CALL-TO-ACTION*/
    #call-to-action .surrounder {width:100%;margin:0;padding:0;}
    #call-to-action .content-holder {height:580px;width:100%;margin:0;}
    #call-to-action .content {padding:16px 32px 0 32px;}
    /*SME*/
    #sme .content-div {width:100%;}
    #sme .separator {display:none;}
    #sme .left-div p {padding-left:0;}
    #sme .right-div p {padding-left:0;}
}

@media screen and (max-width: 600px) {
    /*TECHNOLOGIES*/
    #technologies .content-holder {height:1024px;}
    #technologies h3 {margin-top:40px;}
    #technologies p {width:90%;}
    #technologies .separator {width:90%;margin:0 0 0 5%;}
    /*REFERENCES-OVERVIEW*/
    #references-overview .blog-entry {width:90%;}
    /*CALL-TO-ACTION*/
    #call-to-action .button {width:100%;}
}