.red .mainItem {
    background-color: #8a241b
}

.blue .mainItem {
    background-color: #062f6e;
}

.blue svg * {
    fill: #062f6e;
}

.red svg * {
    fill: #8a241b;
}

.mainItem p {
    color: #fff;
}

.documentationDisplay .content {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    gap: 30px;
    width: 100%;
}

    .documentationDisplay .content .column {
        width: 50%;
    }

        .documentationDisplay .content .column .itemWrap .title {
            font-weight: 700;
        }
        .documentationDisplay .content .column .itemWrap .title a {
            color: inherit;
        }

            .documentationDisplay.blocks .content {
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
            }

            .documentationDisplay .content .mainItem {
                display: block;
                width: 100%;
                height: auto;
                padding-top: 80px;
                padding-bottom: 80px;
                color: #ffffff;
            }

            .documentationDisplay.leftAlign .content .mainItem {
                padding-left: max(0px, calc((100vw - 1485px) / 2));
                margin-right: 2%;
            }

                .documentationDisplay.leftAlign .content .mainItem .miWrap {
                    padding-left: 2%;
                    padding-right: 60px;
                }

            .documentationDisplay.rightAlign .content .mainItem {
                padding-right: max(0px, calc((100vw - 1485px) / 2));
            }

                .documentationDisplay.rightAlign .content .mainItem .miWrap {
                    padding-left: 60px;
                    padding-right: 2%;
                }

            .documentationDisplay.blocks .content .mainItem .h1Styled {
                font-size: 40px;
                line-height: 1em;
                margin-bottom: 40px;
            }

            .documentationDisplay.blocks .content .itemsList {
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                flex-wrap: wrap;
                height: 100%;
                column-gap: 20px;
            }

            .documentationDisplay.blocks.leftAlign .content .col2 .itemsList {
                padding-right: max(0px, calc((100vw - 1485px) / 2));
                margin-right: 2%;
            }

            .documentationDisplay.blocks.leftAlign .content .col1 .itemsList {
                padding-left: max(0px, calc((100vw - 1485px) / 2));
                margin-left: 2%;
            }

            .documentationDisplay.blocks .content .itemsList .itemWrap {
                width: 48%;
                padding: 10% 0;
            }

            .documentationDisplay.blocks.leftAlign .content .col2 .itemsList .itemWrap.num1,
            .documentationDisplay.blocks.leftAlign .content .col2 .itemWrap.num2,
            .documentationDisplay.blocks.rightAlign .content .col1 .itemsList .itemWrap.num1,
            .documentationDisplay.blocks.rightAlign .content .col1 .itemWrap.num2 {
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                flex-direction: column;
            }

            .documentationDisplay.blocks .content .itemsList .itemWrap .iconWrap {
                height: 50px;
                margin-bottom: 10px;
            }

                .documentationDisplay.blocks .content .itemsList .itemWrap .iconWrap svg {
                    height: 98%;
                }

            .documentationDisplay.blocks .content .itemsList .itemWrap .title {
                margin-bottom: 15px;
            }

            .documentationDisplay.list .content .column .itemsList {
                height: 100%;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                flex-direction: column;
                gap: 40px;
            }

            .documentationDisplay.list.rightAlign .content .col1 .itemsList,
            .documentationDisplay.list.leftAlign .content .col1 .itemsList {
                padding-left: max(0px, calc((100vw - 1485px) / 2));
                margin-left: 2%;
            }

            .documentationDisplay.list.rightAlign .content .col2 .itemsList,
            .documentationDisplay.list.leftAlign .content .col2 .itemsList {
                padding-right: max(0px, calc((100vw - 1485px) / 2));
                margin-right: 2%;
                padding-left: 2%;
                margin-top: 30px;
            }

            .documentationDisplay.list .content .itemWrap {
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                align-items: center;
            }

            .documentationDisplay.list.rightAlign .content .col1 .itemWrap {
                flex-grow: 1;
            }

            .documentationDisplay.list .content .itemWrap .iconWrap {
                width: 30px;
                margin-right: 15px;
            }

            .documentationDisplay.list .content .itemWrap .text {
                width: 100%;
            }

            @media (max-width: 1250px) {
                .documentationDisplay.blocks .content {
                    flex-direction: column;
                }

                .documentationDisplay.blocks.rightAlign .content .col2 {
                    order: 1;
                }

                .documentationDisplay.blocks.rightAlign .content .col1 {
                    order: 2;
                }

                .documentationDisplay.blocks .content .column {
                    width: 100%;
                }

                .documentationDisplay.blocks .content .itemsList {
                    padding: 0 2% !important;
                    margin: 0 !important;
                }

                    .documentationDisplay.blocks .content .itemsList .itemWrap {
                        padding: 25px 0 25px 0 !important;
                        height: unset !important;
                    }
            }

            @media (max-width: 850px) {
                .documentationDisplay.blocks {
                    margin-bottom: 30px;
                }

                    .documentationDisplay.blocks .content {
                        gap: 0;
                    }

                        .documentationDisplay.blocks .content .mainItem .miWrap {
                            padding: 0 2% !important;
                        }

                        .documentationDisplay.blocks .content .itemsList {
                            flex-direction: column;
                            gap: 0;
                        }

                            .documentationDisplay.blocks .content .itemsList .itemWrap {
                                width: 100%;
                            }
            }


            @media (max-width: 1175px) {
                .documentationDisplay.list .content {
                    flex-direction: column;
                }

                    .documentationDisplay.list .content .mainItem .miWrap {
                        padding: 0 2% !important;
                    }

                .documentationDisplay.list.rightAlign .content .col2 {
                    order: 1;
                }

                .documentationDisplay.list.rightAlign .content .col1 {
                    order: 2;
                }

                .documentationDisplay.list .content .column {
                    width: 100%;
                }

                    .documentationDisplay.list .content .column .itemsList {
                        padding: 0 2% !important;
                        margin: 0 !important;
                    }
            }