.flex {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.flex-1 {
    flex: 1;
}

.flex-container {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

    .flex-container > div {
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
    }

.flex-row-reverse {
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row-reverse;
}

    .flex-row-reverse > div {
        display: flex;
    }

.flex-row {
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
}

    .flex-row > div {
        display: flex;
    }

.flex-column {
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
}

    .flex-column > div {
        display: flex;
    }

.flex-wrap {
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}

/*Flex align - Vertical*/
.flex-align-baseline {
    -webkit-align-items: baseline !important;
    align-items: baseline !important;
}

    .flex-align-baseline > div {
        -webkit-align-items: baseline;
        align-items: baseline;
    }

.flex-align-center {
    -webkit-align-items: center !important;
    align-items: center !important;
}

    .flex-align-center > div {
        -webkit-align-items: center;
        align-items: center;
    }

.flex-align-start {
    -webkit-align-items: flex-start !important;
    align-items: flex-start !important;
}

    .flex-align-start > div {
        -webkit-align-items: flex-start;
        align-items: flex-start;
    }

.flex-align-end {
    -webkit-align-items: flex-end !important;
    align-items: flex-end !important;
}

    .flex-align-end > div {
        -webkit-align-items: flex-end;
        align-items: flex-end;
    }

/*Flex content - Horizontal*/
.flex-content-start {
    -webkit-justify-content: flex-start !important;
    justify-content: flex-start !important;
}

    .flex-content-start > div {
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
    }

.flex-content-center {
    -webkit-justify-content: center !important;
    justify-content: center !important;
}

    .flex-content-center > div {
        -webkit-justify-content: center;
        justify-content: center;
    }

.flex-content-space-around {
    -webkit-justify-content: space-around !important;
    justify-content: space-around !important;
}

    .flex-content-space-around > div {
        -webkit-justify-content: space-around;
        justify-content: space-around;
    }

.flex-content-space-between {
    -webkit-justify-content: space-between !important;
    justify-content: space-between !important;
}

    .flex-content-space-between > div {
        -webkit-justify-content: space-between;
        justify-content: space-between;
    }

.flex-content-end {
    -webkit-justify-content: flex-end !important;
    justify-content: flex-end !important;
}

    .flex-content-end > div {
        -webkit-justify-content: flex-end;
        justify-content: flex-end;
    }

.flex-grow-1 {
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: 0%;
}

.flex-grow-2 {
    flex-grow: 2;
    flex-shrink: 2;
    flex-basis: 0%;
}

.flex-grow-3 {
    flex-grow: 3;
    flex-shrink: 3;
    flex-basis: 0%;
}

.flex-grow-4 {
    flex-grow: 4;
    flex-shrink: 4;
    flex-basis: 0%;
}

/*Flex All in*/

.flex-center {
    -webkit-justify-content: center !important;
    justify-content: center !important;
    -webkit-align-items: center !important;
    align-items: center !important;
}

    .flex-center > div {
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-align-items: center;
        align-items: center;
    }

.flex-end {
    -webkit-justify-content: flex-end !important;
    justify-content: flex-end !important;
    -webkit-align-items: flex-end !important;
    align-items: flex-end !important;
}

    .flex-end > div {
        -webkit-justify-content: flex-end;
        justify-content: flex-end;
        -webkit-align-items: flex-end;
        align-items: flex-end;
    }

.flex-space-around {
    -webkit-justify-content: space-around !important;
    justify-content: space-around !important;
    -webkit-align-items: space-around !important;
    align-content: space-around !important;
}

    .flex-space-around > div {
        -webkit-justify-content: space-around;
        justify-content: space-around;
        -webkit-align-items: space-around;
        align-content: space-around;
    }

.flex-space-between {
    -webkit-justify-content: space-between !important;
    justify-content: space-between !important;
    -webkit-align-items: space-between !important;
    align-content: space-between !important;
}

    .flex-space-between > div {
        -webkit-justify-content: space-between;
        justify-content: space-between;
        -webkit-align-items: space-between;
        align-content: space-between;
    }

.flex-stretch {
    align-content: stretch !important;
}

    .flex-stretch > div {
        align-content: stretch;
    }


/*Flex width*/
.flex-5 {
    width: 5%;
}

.flex-10 {
    width: 10%;
}

.flex-15 {
    width: 15%;
}

.flex-20 {
    width: 20%;
}

.flex-25 {
    width: 25%;
}

.flex-30 {
    width: 30%;
}

.flex-35 {
    width: 35%;
}

.flex-40 {
    width: 40%;
}

.flex-45 {
    width: 45%;
}

.flex-50 {
    width: 50%;
}

.flex-55 {
    width: 55%;
}

.flex-60 {
    width: 60%;
}

.flex-65 {
    width: 65%;
}

.flex-70 {
    width: 70%;
}

.flex-75 {
    width: 75%;
}

.flex-80 {
    width: 80%;
}

.flex-85 {
    width: 85%;
}

.flex-90 {
    width: 90%;
}

.flex-95 {
    width: 95%;
}

.flex-100 {
    width: 100%;
}

.flex-max-width-100 {
    max-width: 100%;
}

/*Flex height*/
.flex-height-10 {
    height: 10%;
}

.flex-height-20 {
    height: 20%;
}

.flex-height-30 {
    height: 30%;
}

.flex-height-40 {
    height: 40%;
}

.flex-height-50 {
    height: 50%;
}

.flex-height-60 {
    height: 60%;
}

.flex-height-70 {
    height: 70%;
}

.flex-height-80 {
    height: 80%;
}

.flex-height-90 {
    height: 90%;
}

.flex-height-100 {
    height: 100%;
}

.flex-hinherit {
    height: inherit;
}

/*Flex margin*/

.flex-margin-end {
    margin-left: auto;
}

.flex-1{
    flex:1;
}
.flex-2 {
    flex: 2;
}


.d-none {
	display: none;
}
@media (min-width:768px) {
	.d-sm-block {
		display: block;
	}
}