﻿
.two-columns {
    margin: 0 -20px 0 0;
}

.two-column {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    width: 50%;
    float: left;
    padding-right: 20px;
}

@media only screen and (max-width: 650px) {
    .two-column {
        width: 100%;
    }
}

.one-columns {
    margin: 0 0px 0 0;
}

.three-columns {
    margin: 0 -20px 0 0;
}

.three-column {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    width: 33.333%;
    float: left;
    padding-right: 20px;
}

    .three-column.over-two {
        width: 66.6666%;
    }

@media only screen and (max-width: 650px) {
    .three-column {
        width: 50%;
    }

        .three-column.over-two {
            width: 100%;
        }

        .three-column.alone {
            width: 100%;
        }
}

@media only screen and (max-width: 350px) {
    .three-column {
        width: 100%;
    }
}

@media only screen and (max-width: 1000px) {
    .regions-basic-info .three-column {
        width: 100%;
    }
}

.four-columns {
    margin: 0 -20px 0 0;
}

.four-column {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    width: 25%;
    float: left;
    padding-right: 20px;
     
}

    .four-column:first-child {
    }

    .four-column.over-two {
        width: 50%;
    }

    .four-column.last {
        padding: 0;
    }

    .four-column img {
        width: 100%;
        vertical-align: top;
    }

@media only screen and (max-width: 950px) {
    .four-columns {
        margin-right: -20px;
    }

    .four-column {
        width: 33.33%;
    }

        .four-column.over-two {
            width: 66.66%;
        }
}

@media only screen and (max-width: 700px) {
    .four-columns {
        margin-right: -20px;
    }

    .four-column {
        width: 50%;
    }

        .four-column.over-two {
            width: 100%;
        }
}

@media only screen and (max-width: 550px) {
    .four-column.datetime {
        width: 100%;
    }
}

@media only screen and (max-width: 450px) {
    .four-columns {
        margin-right: -20px;
    }

    .four-column {
        width: 100%;
    }

        .four-column.over-two {
            width: 100%;
        }
}

.five-columns {
    margin: 0 -20px 0 0;
}

.five-column {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    width: 20%;
    float: left;
    padding-right: 20px;
}

    .five-column:first-child {
    }

    .five-column.over-two {
        width: 40%;
    }

    .five-column.last {
        padding: 0;
    }

@media only screen and (max-width:1280px) {
    .five-columns {
        margin-right: -20px;
    }

    .five-column {
        width: 25%;
    }

        .five-column.over-two {
            width: 50%;
        }
}

.four-layout .five-columns {
    margin-right: -20px;
}

.four-layout .five-column {
    width: 25%;
}

    .four-layout .five-column.over-two {
        width: 50%;
    }

@media only screen and (max-width: 950px) {
    .five-columns {
        margin-right: -20px;
    }

    .five-column {
        width: 33.33%;
    }

        .five-column.over-two {
            width: 66.66%;
        }
}

.three-layout .five-columns {
    margin-right: -20px;
}

.three-layout .five-column {
    width: 33.33%;
}

    .three-layout .five-column.over-two {
        width: 66.66%;
    }

@media only screen and (max-width: 700px) {
    .five-columns {
        margin-right: -20px;
    }

    .five-column {
        width: 50%;
    }

        .five-column.over-two {
            width: 100%;
        }
}

@media only screen and (max-width: 550px) {
    .five-column.datetime {
        width: 100%;
    }
}

@media only screen and (max-width: 450px) {
    .five-columns {
        margin-right: -20px;
    }

    .five-column {
        width: 100%;
    }

        .five-column.over-two {
            width: 100%;
        }
}

.six-columns-container {
    max-width: 100%;
    overflow: hidden;
}

.six-columns {
    margin: 0 -20px 0 0;
}

.six-column {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    width: 16.6666%;
    float: left;
    padding-right: 20px;
}

    .six-column.over-two {
        width: 33.3333%;
    }

@media only screen and (max-width: 950px) {
    .six-column {
        width: 20%;
    }

        .six-column.over-two {
            width: 40%;
        }
}

@media only screen and (max-width: 700px) {
    .six-column {
        width: 33.3333%;
    }

        .six-column.over-two {
            width: 66.6666%;
        }
}

@media only screen and (max-width: 450px) {
    .six-column {
        width: 50%;
    }

        .six-column.over-two {
            width: 100%;
        }
}

@media only screen and (max-width: 300px) {
    .six-column {
        width: 100%;
        text-align: center;
    }
}


.EditorWidget .WebPartActionButton, .GroupWidget .WebPartActionButton,
.StandardZone .WebPartZoneTypeIcon {
    width: auto!important;
}