/*PictureSummary*/
.float-item {
    padding: 0;
    margin-right: 0;
    margin-bottom: 38px;
    list-style-type: none
}

    .float-item img {
        width: 100%;
        height: auto;
        margin-bottom: 10px;
    }

.float-title {
    font-family: 'BlenderBold', Arial, sans-serif;
    font-size: 19px;
    color: #3c3c3c;
}

.float-subjects-2 .float-title {
    font-family: 'BlenderBold', Arial, sans-serif;
    font-size: 19px;
    color: #3c3c3c;
    height: 50px;
    overflow: hidden;
}

.float-text {
    font-family: 'BlenderRegular', Arial, sans-serif;
    font-size: 20px;
    color: #3c3c3c;
    margin: 0;
    margin-top: 5px;
    max-height: 75px;
    overflow: hidden;
    line-height: 25px;
}

.float-splitter {
    border-top: 3px solid #646464;
    width: 100%;
    float: right;
    margin-top: 10px;
    margin-bottom: 10px;
}

.float-more-items {
    font-family: 'BlenderRegular', Arial, sans-serif;
    font-size: 18px;
    color: #3c3c3c;
    float: left;
}

    .float-more-items:hover {
        color: #0072C1;
    }

    .float-more-items:after {
        content: ">"
    }

.float-subjects-2 ul {
    width: 100%;
    margin: 0;
    padding: 0;
    display: inline-block;
}

    .float-subjects-2 ul li {
        padding: 0 0 0 3%;
    }


#planAndDev .LandingPageDiv .float-item h3 {
    color: #2E2E2E;
    text-align: right;
    font-family: BlenderRegular;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px;
    margin-bottom: 0px !important;
    transform: translate(0%, -50%);
    top: 50%;
    position: relative;
}


@media (min-width: 768px) {
    .float-text {
        font-size: 17px;
        max-height: 55px;
        line-height: 19px;
    }

    .float-subjects-2 .float-item {
        float: right;
        width: 287px;
        height: 400px;
        margin-bottom: 38px !important;
        margin-left: 38px !important;
        overflow: hidden;
    }

    .float-subjects-2 img {
        height: 203px !important;
    }

    .float-subjects-2 ul li {
        padding: 0
    }
}

@media (min-width: 1200px) {
    .float-subjects-2 .float-item {
        float: right;
        width: 361px;
        height: 405px;
        margin-bottom: 38px !important;
    }

    .float-subjects-2 .float-text {
        font-size: 20px;
    }

    .float-subjects-2 img {
        height: 203px !important;
    }
}


/*Columns*/
.float-item {
    padding: 0;
}

.float-subjects-3 .float-title {
    font-family: 'BlenderBold', Arial, sans-serif;
    font-size: 19px;
    height: 50px;
    color: #3c3c3c;
    overflow: hidden
}

.float-text {
    font-family: 'BlenderRegular', Arial, sans-serif;
    font-size: 20px;
    color: #3c3c3c;
    margin: 0;
    margin-top: 5px;
    max-height: 75px;
    overflow: hidden;
    line-height: 25px;
}

.float-splitter {
    border-top: 3px solid #646464;
    width: 100%;
    float: right;
    margin-top: 10px;
    margin-bottom: 10px;
}

.float-more-items {
    font-family: 'BlenderRegular', Arial, sans-serif;
    font-size: 18px;
    color: #3c3c3c;
    float: left;
}

    .float-more-items:hover {
        color: #0072C1;
    }

    .float-more-items:after {
        content: ">"
    }

.float-subjects-3 ul {
    padding: 0px !important;
}


@media (min-width: 768px) {
    .float-subjects-3 .float-text {
        font-size: 17px;
        max-height: 55px;
        line-height: 19px;
        display: block;
        height: 60px;
    }

    .float-subjects-3 .float-item {
        width: 165px;
        margin-left: 38px;
    }

        .float-subjects-3 .float-item img {
            width: 100%;
            height: 95px;
            margin-bottom: 10px;
        }
}


@media (min-width: 1200px) {
    .float-subjects-3 .float-item {
        width: 228px;
        overflow: hidden;
        margin-bottom: 38px;
    }
    /*height:318px; add if more than 3 items */
    .float-subjects-3 .float-text {
        font-size: 20px;
        display: block;
        height: 60px;
    }

    .float-subjects-3 .float-item img {
        width: 100%;
        height: 135px;
        margin-bottom: 10px;
    }
}

/*PictureTitle*/
.float-item {
    padding: 0;
    margin-right: 0px;
    margin-bottom: 15px;
}

    .float-item img {
        width: 100%;
        height: auto;
        margin-bottom: 10px;
    }

.float-title {
    font-family: 'BlenderBold', Arial, sans-serif;
    font-size: 19px;
    color: #3c3c3c;
    display: inline-block
}

.float-text {
    font-family: 'BlenderRegular', Arial, sans-serif;
    font-size: 20px;
    color: #3c3c3c;
    margin: 0;
    margin-top: 5px;
    max-height: 75px;
    overflow: hidden;
    line-height: 25px;
}

.float-splitter {
    border-top: 3px solid #646464;
    width: 100%;
    float: right;
    margin-top: 10px;
    margin-bottom: 10px;
}

.float-more-items {
    font-family: 'BlenderRegular', Arial, sans-serif;
    font-size: 18px;
    color: #3c3c3c;
    float: left;
}

    .float-more-items:hover {
        color: #0072C1;
    }

    .float-more-items:after {
        content: ">"
    }

.float-subjects-4 ul {
    width: 100%;
    margin: 0;
    padding: 0;
    display: inline-block;
    list-style-type: none;
}

    .float-subjects-4 ul li {
        padding: 0 0 0 3%;
    }

@media (min-width: 768px) {
    .float-subjects-4 .float-text {
        font-size: 17px;
        max-height: 55px;
        line-height: 19px;
    }

    .float-subjects-4 .float-item {
        width: 44%;
        height: 105px;
        margin-left: 38px;
        margin-bottom: 38px;
    }

    .float-subjects-4 img {
        width: 50%;
        height: 105px;
        float: right;
    }

    .float-subjects-4 .float-desc {
        padding-right: 150px;
    }

    .float-subjects-4 .float-title {
        line-height: 100%;
    }

    .float-subjects-4 .float-more-items {
        margin-top: 7px;
    }

        .float-subjects-4 .float-more-items.side {
            float: right;
            margin-right: 13px;
        }
}

@media (min-width: 1200px) {
    .float-subjects-4 .float-item {
        width: 361px;
        margin-bottom: 38px;
        height: 115px;
    }

    .float-subjects-4 .float-text {
        max-height: 65px;
    }

    .float-subjects-4 img {
        width: 50%
    }

    .float-subjects-4 .float-desc {
        padding-right: 195px;
    }

    .float-subjects-4 .float-more-items.side {
        margin-right: 17px
    }
}

/*LandingPage*/

.LandingPageDiv {
    display: inline-block;
    width: 100%;
    border-radius: 16px;
    background: linear-gradient(96deg, rgba(247, 233, 190, 0.25) 0%, rgba(255, 204, 49, 0.25) 100%), #FFF;
    padding: 60px;
}

    .LandingPageDiv ul {
        padding: 0;
        margin: 0 -10px;
    }

    .LandingPageDiv .float-item {
        padding: 10px;
        border-radius: 8px;
    }



.LandingPageDiv .float-item .LandingPageItemBottomDiv .float-desc {
    background-image: url(/_layouts/15/TlvSP2013PublicSite/images/arrowLinks.svg);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 10px 12px;
    padding-left: 15px;
}

.LandingPageDiv .float-item .LandingPageImgDiv {
    height: 160px;
    padding: 20px;
    align-self: stretch;
    border-radius: 8px 8px 0 0;
    border: 2px solid transparent;
    border-bottom: none;
}

.LandingPageDiv .float-item:hover .LandingPageImgDiv {
    border: 2px solid rgba(46, 46, 46, 0.45);
    border-bottom: none;
}

.LandingPageDiv .float-item:hover .LandingPageItemBottomDiv {
    border: 2px solid rgba(46, 46, 46, 0.45);
    border-top: none;
}



.LandingPageDiv .float-item .LandingPageItemBottomDiv {
    background: var(--ffffff, #FFF);
    padding: 20px;
    display: grid;
    align-self: stretch;
    border-radius: 0 0 8px 8px;
    border: 2px solid transparent;
    border-top: none;
}

    .LandingPageDiv .float-item .LandingPageItemBottomDiv .float-more-items {
        color: #0072C1;
        text-align: right;
        font-family: BlenderRegular;
        font-size: 20px;
        font-style: normal;
        font-weight: 700;
        line-height: 20px;
        float: right;
    }

.LandingPageDiv .float-item a:hover .LandingPageItemBottomDiv .float-more-items, .LandingPageDiv .float-item a:focus .LandingPageItemBottomDiv .float-more-items {
    text-decoration: underline;
    cursor: pointer;
}

.LandingPageDiv .subTitleText {
    display: none;
    color: #2E2E2E;
    text-align: right;
    font-family: BlenderRegular;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 32px;
}

@media (max-width: 768px) {

    .LandingPageDiv {
        padding: 32px 4px;
        margin: 0 16px;
        width: auto;
    }

        .LandingPageDiv .float-item {
            padding: 6px;
            background-color: transparent;
            margin-bottom: 0px;
        }

            .LandingPageDiv .float-item .LandingPageImgDiv {
                height: 72px;
                padding: 12px;
            }

            .LandingPageDiv .float-item .LandingPageItemBottomDiv {
                padding: 12px 8px;
            }

        .LandingPageDiv ul {
            padding: 0;
            margin: 0 4px;
        }

    #planAndDev .LandingPageDiv .float-item h3 {
        color: #2E2E2E;
        text-align: right;
        font-family: BlenderRegular;
        font-size: 16px;
        font-style: normal;
        font-weight: 700;
        line-height: 18px; /* 112.5% */
        letter-spacing: -0.2px;
    }

    #planAndDev .LandingPageDiv h2 {
        margin-right: 16px;
        margin-bottom: 12px;
    }

    .LandingPageDiv .float-item .LandingPageItemBottomDiv .float-more-items {
        color: #0072C1;
        text-align: right;
        font-family: BlenderRegular;
        font-size: 14px;
        font-style: normal;
        font-weight: 700;
        line-height: 20px; /* 142.857% */
    }

    .LandingPageDiv .subTitleText {
        display: block;
        color: #2E2E2E;
        text-align: right;
        font-family: BlenderRegular;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: 18px;
        margin-left: 16px;
        margin-right: 16px;
        margin-bottom: 10px;
    }
}