﻿/*---------------------- Banner Row ---------------------------------*/
.bhg-row-banner {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
}
/*-------------------------------2 col row css-----------------------*/
.bhg-row-col2 {
    grid-template-columns: 1fr 1fr;
    position: unset;
    width: 100%;
    display: grid;
    grid-template-rows: auto;
    justify-content: stretch;
    box-sizing: border-box;
    grid-column-gap: 2em;
}
.bhg-row-col2--column {
    grid-column: auto;
    position: unset;
    display: flex;
    flex-direction: row;
    height: 100%;
}

/*responsive css*/
@media (max-width: 480px)  {
    .bhg-row-col2 {
        grid-template-columns: 1fr;
    }
}
/*responsive css*/
/*@media only screen and (max-width: 1080px) {
    .bhg-row-col2 {
        position: relative;*/
        /*top: 115px;*/
    /*}
}*/
/*-------------------------------End 2 col row css-----------------------*/

/*-------------------------------3 col row css-----------------------*/
.bhg-row-col3 {
    grid-template-columns: 1fr 1fr 1fr;
    position: relative;
    width: 100%;
    display: grid;
    grid-template-rows: auto;
    justify-content: stretch;
    box-sizing: border-box;
    grid-column-gap: 2em;
}
.bhg-row-col3--column {
    grid-column: auto;
    position: relative;
    display: flex;
    flex-direction: row;
    height: 100%;
}
/*responsive css*/
@media (max-width: 480px) {
    .bhg-row-col3 {
        grid-template-columns: 1fr;
    }
}
/*-------------------------------End 3 col row css-----------------------*/

/*-------------------------------Start 4 col row css-----------------------*/
.bhg-row-col4 {
    grid-template-columns: 1fr 1fr 1fr 1fr;
    position: relative;
    width: 100%;
    display: grid;
    grid-template-rows: auto;
    justify-content: stretch;
    box-sizing: border-box;
    grid-column-gap: 2em;
}

.bhg-row-col4--column {
    grid-column: auto;
    position: relative;
    display: flex;
    flex-direction: row;
    height: 100%;
}

/*responsive css*/
@media (max-width: 480px) {
    .bhg-row-col4 {
        grid-template-columns: 1fr;
    }
}

/*-------------------------------End 4 col row css-----------------------*/

/*-------------------------------21 split col row css-----------------------*/
.bhg-row-21split {
    grid-template-columns: 2fr 1fr;
    position: relative;
    width: 100%;
    display: grid;
    grid-template-rows: auto;
    justify-content: stretch;
    box-sizing: border-box;
    grid-column-gap: 2em;
}
.bhg-row-21split--column {
    grid-column: auto;
    position: relative;
    display: flex;
    flex-direction: row;
    height: 100%;
}

/*responsive css*/
@media (max-width: 480px) {
    .bhg-row-21split {
        grid-template-columns: 1fr;
    }
}
/*-------------------------------End 21split col row css-----------------------*/

/*-------------------------------12 split col row css-----------------------*/
.bhg-row-12split {
    grid-template-columns: 1fr 2fr;
    position: relative;
    width: 100%;
    display: grid;
    grid-template-rows: auto;
    justify-content: stretch;
    box-sizing: border-box;
    grid-column-gap: 2em;
}
.bhg-row-12split--column {
    grid-column: auto;
    position: relative;
    display: flex;
    flex-direction: row;
    height: 100%;
}

/*responsive css*/
@media (max-width: 480px) {
    .bhg-row-12split {
        grid-template-columns: 1fr;
    }
}
/*-------------------------------End 21split col row css-----------------------*/

/*---------------------- Column Gap------------------------------*/
.bhg-row--column-gap-sm{
    grid-column-gap: 1em;
}
.bhg-row--column-gap-md {
    grid-column-gap: 1.5em;
}
.bhg-row--column-gap-lg {
    grid-column-gap: 2em;
}
.bhg-row--column-gap-xl {
    grid-column-gap: 3em;
}
.bhg-row--column-gap-none {
    grid-column-gap: 0;
}

@media (max-width: 779px){
    .page-standard__width{
        padding:1em;
    }
}
@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:portrait) {
    .page-standard__width {
        padding: 1em;
    }
}
@media all and (device-width: 1024px) and (device-height: 768px) and (orientation:landscape){
    .page-standard__width {
        padding: 1em;
    }
}