@media screen and (max-width: 1024px) {
    .newtitle-gov {
        font-size: 6vh;
        padding-top: 3rem !important;
    }
    
    .gov-row {
        height: 80%;
    }

    .bottom-icon img{
        width: auto;
        height: 40%;
    }
}

@media screen and (max-width: 912px) {
    :root {
        --btn-size: 5rem !important;
        --extra-space: 4rem !important;
    }

    .menu,
    .menu-items,
    .cycle,
    .item {
        width: 85% !important;
        left: 51px;
        bottom: 70px;
    }

    .csstransforms .opened-nav {
        -webkit-transform: scale(1) !important;
        -moz-transform: scale(1) !important;
        -ms-transform: scale(1) !important;
        transform: scale(1) !important;
    }
}

@media screen and (max-width: 768px) {
    .newtitle-gov {
        font-size: 5vh;
        padding-top: 1rem !important;
    }

    .gov-row {
        height: 70%;
    }

    .lets-work-area p {
        font-size: 18px;
    }

    .working-with-us p {
        font-size: 18px;
        padding: 0px !important;
    }

    .gsa-schedule p {
        font-size: 2vh;
    }

    .working-title {
        font-size: 2em !important;
    }

    .powering-people .content {
        height: 55vh;
    }

    .btm-btn button {
        padding: 3.25rem 5.25rem;
    }
}

@media screen and (max-width: 430px) {

    .powering-people .title {
        padding: 70px 20px;
    }

    :root {
        --btn-size: 4rem !important;
        --extra-space: 3rem !important;
    }

    .menu,
    .menu-items,
    .cycle,
    .item {
        width: 80% !important;
        left: 12px;
        bottom: -15px;
    }

    .powering-people h1 {
        font-size: xx-large;
    }

    .csstransforms .opened-nav {
        -webkit-transform: scale(1) !important;
        -moz-transform: scale(1) !important;
        -ms-transform: scale(1) !important;
        transform: scale(0.7) !important;
        margin-left: -13.5em !important;
        margin-top: -22em !important;
    }

    .btm-btn button {
        font-size: 3vh;
    }
}

@media screen and (max-width: 425px) {
    .powering-people .content {
        height: 100%;
    }

    .focus-2{
        padding-bottom: 15%;
    }

    .btm-btn button {
        padding: 1.25rem 2.25rem;
    }
    
    :root {
        --btn-size: 4rem !important;
        --extra-space: 3rem !important;
    }
    
    .menu,
    .menu-items,
    .cycle,
    .item {
        width: 81% !important;
        left: 12px;
        bottom: 0px;
    }

    .csstransforms .opened-nav {
        -webkit-transform: scale(1) !important;
        -moz-transform: scale(1) !important;
        -ms-transform: scale(1) !important;
        transform: scale(0.7) !important;
        margin-left: -13.5em !important;
        margin-top: -18em !important;
    }               
}

@media screen and (max-width: 375px) {
    .gov-row {
        padding: 3rem 3rem 0rem 2rem;
        height: 55%;
        text-align: center;
    }

    .newtitle-gov {
        font-size: 4vh;
    }
}

@media screen and (max-width: 320px) {
    .btm-btn button {
        font-size: 2.5vh;
    }
}

:root {
    --btn-size: 7rem;
    --extra-space: 6rem;
}

.item {
    --radius: calc(var(--btn-size) + var(--extra-space));
    background-color: var(--bg);
    transform: translateX(calc(cos(var(--angle)) * var(--radius))) translateY(calc(sin(var(--angle) * 5) * var(--radius))) rotate(0deg);
    transition: all 0.3s var(--delay) ease;
}

.item:nth-child(1) {
    --angle: 0deg;
}

.item:nth-child(2) {
    --angle: 60deg;
}

.item:nth-child(3) {
    --angle: -60deg;
}

.item:nth-child(4) {
    --angle: 120deg;
}

.item:nth-child(5) {
    --angle: 180deg;
}
.item:nth-child(6) {
    --angle: 240deg;
}

.item {
    border-radius: 50%;
    width: var(--btn-size);
    aspect-ratio: 1/1;
}

.menu,
.menu-items,
.cycle,
.item {
    display: grid;
    place-content: center;
    width: 100%;
}

.menu>*,
.menu-items>*,
.cycle>* .item button {
    grid-area: 1/1;
}

.cycle button {
    border: none;
    background: none;
    font-family: 'Noto Emoji';
    color: #222;
    font-size: 1.25rem;
    padding: 0px !important;
}

.effect button img:hover {
    transform: scale(0.9) !important;
    -webkit-transform: scale(0.9) !important;
}

* {
    position: relative;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
} 

.component {

    position: relative;
    margin-bottom: 3em;
    height: 15em;
    background: rgba(0, 0, 0, 0.05);
    font-family: 'Lato', Arial, sans-serif;
}

.component>h2 {
    position: absolute;
    overflow: hidden;
    width: 100%;
    text-align: center;
    text-transform: uppercase;
    white-space: nowrap;
    font-weight: 300;
    font-style: italic;
    font-size: 12em;
    opacity: 0.1;
    cursor: default;
}

.csstransforms .cn-wrapper {
    position: absolute;
    top: 100%;
    left: 50%;
    z-index: 10;
    margin-top: -13em;
    margin-left: -13.5em;
    width: 27em;
    height: 27em;
    border-radius: 50%;
    background: transparent;
    opacity: 0;
    -webkit-transition: all .3s ease 0.3s;
    -moz-transition: all .3s ease 0.3s;
    transition: all .3s ease 0.3s;
    -webkit-transform: scale(0.1);
    -ms-transform: scale(0.1);
    -moz-transform: scale(0.1);
    transform: scale(0.1);
    pointer-events: none;
    overflow: hidden;
}

.csstransforms .opened-nav {
    border-radius: 50%;
    opacity: 1;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    transition: all .3s ease;
    -webkit-transform: scale(1.3);
    -moz-transform: scale(1.3);
    -ms-transform: scale(1.3);
    transform: scale(1.3);
    pointer-events: auto;
}

.csstransforms .cn-wrapper li {
    position: absolute;
    top: 50%;
    left: 50%;
    overflow: hidden;
    margin-top: -1.3em;
    margin-left: -10em;
    width: 10em;
    height: 10em;
    font-size: 1.5em;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    transition: all .3s ease;
    -webkit-transform: rotate(76deg) skew(60deg);
    -moz-transform: rotate(76deg) skew(60deg);
    -ms-transform: rotate(76deg) skew(60deg);
    transform: rotate(76deg) skew(60deg);
    -webkit-transform-origin: 100% 106%;
    -moz-transform-origin: 100% 106%;
    transform-origin: 100% 106%;
    pointer-events: none;
}

.csstransforms .cn-wrapper li a {
    position: absolute;
    right: -7.25em;
    bottom: -7.25em;
    display: block;
    width: 14.5em;
    height: 14.5em;
    border-radius: 50%;
    background: #429a67;
    background: -webkit-radial-gradient(transparent 25%, #664d17 25%);
    background: -moz-radial-gradient(transparent 25%, #664d17 25%);
    background: radial-gradient(transparent 25%, #664d17 25%);
    color: #fff;
    text-align: center;
    text-decoration: none;
    font-size: 1.2em;
    line-height: 2;
    -webkit-transform: skew(-60deg) rotate(-75deg) scale(1);
    -moz-transform: skew(-60deg) rotate(-75deg) scale(1);
    -ms-transform: skew(-60deg) rotate(-75deg) scale(1);
    transform: skew(-60deg) rotate(-75deg) scale(1);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    pointer-events: auto;
}

.csstransforms .cn-wrapper li a span {
    position: relative;
    top: 1.8em;
    display: block;
    font-size: 14px;
    line-height: normal;
}
.csstransforms .cn-wrapper li a:hover,
.csstransforms .cn-wrapper li a span:hover {
    color: #fff!important;
}

.csstransforms .cn-wrapper li a:hover,
.csstransforms .cn-wrapper li a:active,
.csstransforms .cn-wrapper li a:focus {
    background: -webkit-radial-gradient(transparent 25%, #664d17 25%);
    background: -moz-radial-gradient(transparent 25%, #664d17 25%);
    background: radial-gradient(transparent 25%, #664d17 25%);
}

.csstransforms .cn-wrapper li a:focus {
    position: fixed;
}

.csstransforms .opened-nav li {
    -webkit-transition: all .3s ease .3s;
    -moz-transition: all .3s ease .3s;
    transition: all .3s ease .3s;
}

.csstransforms .opened-nav li:first-child {
    -webkit-transform: rotate(-42deg) skew(60deg);
    -moz-transform:rotate(-42deg) skew(60deg);
    -ms-transform: rotate(-42deg) skew(60deg);
    transform: rotate(-42deg) skew(60deg);
}

.csstransforms .opened-nav li:nth-child(2) {
    -webkit-transform: rotate(-13deg) skew(60deg);
    -moz-transform: rotate(-13deg) skew(60deg);
    -ms-transform: rotate(-13deg) skew(60deg);
    transform: rotate(-13deg) skew(60deg);
}

.csstransforms .opened-nav li:nth-child(3) {
    -webkit-transform: rotate(17deg) skew(60deg);
    -moz-transform: rotate(17deg) skew(60deg);
    -ms-transform: rotate(17deg) skew(60deg);
    transform: rotate(17deg) skew(60deg);
}

.csstransforms .opened-nav li:nth-child(4) {
    -webkit-transform: rotate(46deg) skew(60deg);
    -moz-transform: rotate(46deg) skew(60deg);
    -ms-transform: rotate(46deg) skew(60deg);
    transform: rotate(46deg) skew(60deg);
}

.csstransforms .opened-nav li:nth-child(5) {
    -webkit-transform: rotate(75deg) skew(60deg);
    -moz-transform: rotate(75deg) skew(60deg);
    -ms-transform: rotate(75deg) skew(60deg);
    transform: rotate(75deg) skew(60deg);
}

.csstransforms .opened-nav li:nth-child(6) {
    -webkit-transform: rotate(105deg) skew(60deg);
    -moz-transform: rotate(105deg) skew(60deg);
    -ms-transform: rotate(105deg) skew(60deg);
    transform: rotate(105deg) skew(60deg);
}

.csstransforms .opened-nav li:nth-child(7) {
    -webkit-transform: rotate(134deg) skew(60deg);
    -moz-transform: rotate(134deg) skew(60deg);
    -ms-transform: rotate(134deg) skew(60deg);
    transform: rotate(134deg) skew(60deg);
}

.csstransforms .opened-nav li:nth-child(8) {
    -webkit-transform: rotate(-195deg) skew(60deg);
    -moz-transform: rotate(-195deg) skew(60deg);
    -ms-transform: rotate(-195deg) skew(60deg);
    transform: rotate(-195deg) skew(60deg);
}

.csstransforms .opened-nav li:nth-child(9) {
    -webkit-transform: rotate(-164deg) skew(60deg);
    -moz-transform: rotate(-164deg) skew(60deg);
    -ms-transform: rotate(-164deg) skew(60deg);
    transform: rotate(-164deg) skew(60deg);
}

.csstransforms .opened-nav li:nth-child(10) {
    -webkit-transform: rotate(-134deg) skew(60deg);
    -moz-transform: rotate(-134deg) skew(60deg);
    -ms-transform: rotate(-134deg) skew(60deg);
    transform: rotate(-134deg) skew(60deg);
}

.csstransforms .opened-nav li:nth-child(11) {
    -webkit-transform: rotate(-102deg) skew(60deg);
    -moz-transform: rotate(-102deg) skew(60deg);
    -ms-transform: rotate(-102deg) skew(60deg);
    transform: rotate(-102deg) skew(60deg);
}

.csstransforms .opened-nav li:nth-child(12) {
    -webkit-transform: rotate(-72deg) skew(60deg);
    -moz-transform: rotate(-72deg) skew(60deg);
    -ms-transform: rotate(-72deg) skew(60deg);
    transform: rotate(-72deg) skew(60deg);
}

.qualitY {
    transform: rotate(111deg);
    padding-left: 30px;
    font-family: "the_seasonsregular" !important;
    padding-bottom: 24px;
}

.localizatioN {
    transform: rotate(90deg);
    padding-left: 64px;
}

.grammaR {
    transform: rotate(51deg);
    padding-left: 15px;
    font-family: "the_seasonsregular" !important;
    padding-top: 16px;
}

.predictivE {
    transform: rotate(18deg);
    font-family: "the_seasonsregular" !important;
    padding-top: 9px;
}

.custoM {
    transform: rotate(359deg);
    font-family: "the_seasonsregular" !important;
    padding-top: 9px;
}

.sentimenT {
    transform: rotate(325deg);
    font-family: "the_seasonsregular" !important;
    padding-top: 29px;
    padding-right: 11px;
}

.entitY {
    transform: rotate(298deg);
    font-family: "the_seasonsregular" !important;
    padding-top: 26px;
    padding-right: 44px;
}

.generativE {
    transform: rotate(268deg);
    font-family: "the_seasonsregular" !important;
    padding-right: 56px;
    padding-bottom: 11px;
}

.conversationaL {
    transform: rotate(233deg);
    font-family: "the_seasonsregular" !important;
    padding-right: 27px;
    padding-bottom: 23px;
}

.texT {
    transform: rotate(205deg);
    font-family: "the_seasonsregular" !important;
    padding-right: 13px;
    padding-bottom: 23px;
}

.voicE {
    transform: rotate(179deg);
    font-family: "the_seasonsregular" !important;
    padding-bottom: 29px;
}

.audiO-Transcription {
    transform: rotate(144deg);
    font-family: "the_seasonsregular" !important;
    padding-left: 4px;
    padding-bottom: 31px;
}