.blockchain-image {
    height: 40em;
    width: 97em
}

.heading-on-image {
    margin-top: 6em;
    position: absolute;
    margin-left: 12em;
    font-size: -webkit-xxx-large;
    color: #fff;
    text-transform: uppercase
}

.block-content {
    width: 50%;
    height: 75%;
    margin-left: 3em;
    font-size: x-large;
    margin-top: 35px
}

.blockchain-cont {
    margin-top: 25px;
    font-size: 20px
}

.dapp-image {
    width: 31em;
    float: right;
    margin-top: -29em;
    margin-right: 20px
}

.ml-image {
    height: 40em;
    width: 97em;
    margin-top: 109px
}

.ai-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-column-gap: 8em;
    margin-left: 5em;
    grid-row-gap: 50px;
    margin-right: 5em
}

.ai-cont {
    text-align: justify
}

.ai-game:hover {
    background: url(/assets/images/services/ai-game.jpg);
    color: transparent;
    height: 207px;
    width: 367px
}

.ai-nlp:hover {
    background: url(/assets/images/services/nlp.jpg);
    color: transparent;
    height: 207px;
    width: 367px
}

.ai-ir:hover {
    background: url(/assets/images/services/ir.jpg);
    color: transparent;
    height: 207px;
    width: 367px
}

.ai-sr:hover {
    background: url(/assets/images/services/sr.png);
    color: transparent;
    height: 207px;
    width: 367px
}

.ai-hr:hover {
    background: url(/assets/images/services/tr.jpg);
    color: transparent;
    height: 207px;
    width: 367px
}

.ai-r:hover {
    background: url(/assets/images/services/es.jpg);
    color: transparent;
    height: 207px;
    width: 367px
}

.ios:hover {
    background: url(/assets/images/services/ios.jpg);
    color: transparent;
    height: 207px;
    width: 367px
}

.android:hover {
    background: url(/assets/images/services/android.png);
    color: transparent;
    height: 207px;
    width: 367px
}

.windows:hover {
    background: url(/assets/images/services/windows.png);
    color: transparent;
    height: 250 px;
    width: 367px
}

.ios {
    text-align: justify
}

.android {
    text-align: justify
}

.windows {
    text-align: justify
}

.pe-head-img {
    margin-top: 3em;
    position: absolute;
    margin-left: 1em;
    font-size: -webkit-xxx-large;
    color: #fff;
    text-transform: uppercase
}

.ai-text {
    text-align: justify
}

.web-img1 {
    height: 100px;
    float: right
}

.wb-grid {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    grid-column-gap: 8em;
    margin-left: 5em;
    grid-row-gap: 50px;
    margin-right: 5em
}

.web-img2 {
    height: 100px;
    float: left
}

.left-wb {
    position: absolute;
    margin-left: 12em;
    margin-right: 5em;
    text-align: justify
}

.heading-on-ai {
    margin-top: 6em;
    position: absolute;
    margin-left: 12em;
    font-size: -webkit-xxx-large;
    color: #fff;
    text-transform: uppercase
}

.aicont {
    text-align: justify
}

@media only screen and (min-width:0px) and (max-width:320px) {
    .heading-on-image {
        margin-left: 6em;
        font-size: larger;
        margin-top: 5em
    }
    .blockchain-image {
        height: auto;
        width: auto
    }
    .block-content {
        margin-left: 25px;
        height: max-content;
        width: -webkit-fill-available;
        margin-right: 25px
    }
    .alinks {
        margin-bottom: 10px
    }
    .dapp-image {
        display: none
    }
    .ml-image {
        height: auto;
        width: auto;
        margin-top: 53px
    }
    .heading-on-ai {
        margin-left: 2em;
        margin-top: 3em;
        font-size: xx-large
    }
    .ai-grid {
        display: grid;
        grid-template-columns: repeat(1, 1fr)
    }
    .ai-game:hover {
        background: url(/assets/images/services/ai-game.jpg);
        color: transparent;
        height: 14em;
        width: auto
    }
    .ai-nlp:hover {
        background: url(/assets/images/services/nlp.jpg);
        color: transparent;
        height: 14em;
        width: auto
    }
    .ai-ir:hover {
        background: url(/assets/images/services/ir.jpg);
        color: transparent;
        height: 14em;
        width: auto
    }
    .ai-sr:hover {
        background: url(/assets/images/services/sr.png);
        color: transparent;
        height: 14em;
        width: auto
    }
    .ai-hr:hover {
        background: url(/assets/images/services/tr.jpg);
        color: transparent;
        height: 14em;
        width: auto
    }
    .ai-r:hover {
        background: url(/assets/images/services/es.jpg);
        color: transparent;
        height: 14em;
        width: auto
    }
    .ios:hover {
        background: url(/assets/images/services/ios.jpg);
        color: transparent;
        height: 14em;
        width: auto
    }
    .android:hover {
        background: url(/assets/images/services/android.png);
        color: transparent;
        height: 14em;
        width: auto
    }
    .windows:hover {
        background: url(/assets/images/services/windows.png);
        color: transparent;
        height: 14em;
        width: auto
    }
    .pe-head-img {
        font-size: x-large;
        margin-top: 4em
    }
    .wb-grid {
        display: grid
    }
    .left-wb {
        margin-top: 9em;
        margin-left: 23px
    }
    .python {
        margin-top: 23em
    }
    .solidity {
        margin-top: 16em
    }
}

@media only screen and (min-width:321px) and (max-width:480px) {
    .heading-on-image {
        font-size: 25px;
        margin-left: 5em;
        margin-top: 4em
    }
    .blockchain-image {
        height: auto;
        width: auto
    }
    .block-content {
        margin-left: 25px;
        height: max-content;
        width: -webkit-fill-available;
        margin-right: 25px
    }
    .alinks {
        margin-bottom: 10px
    }
    .dapp-image {
        display: none
    }
    .ml-image {
        height: auto;
        width: auto;
        margin-top: 53px
    }
    .heading-on-ai {
        margin-left: 2em;
        margin-top: 3em;
        font-size: xx-large
    }
    .ai-grid {
        display: grid;
        grid-template-columns: repeat(1, 1fr)
    }
    .ai-game:hover {
        background: url(/assets/images/services/ai-game.jpg);
        color: transparent;
        height: 14em;
        width: auto
    }
    .ai-nlp:hover {
        background: url(/assets/images/services/nlp.jpg);
        color: transparent;
        height: 14em;
        width: auto
    }
    .ai-ir:hover {
        background: url(/assets/images/services/ir.jpg);
        color: transparent;
        height: 14em;
        width: auto
    }
    .ai-sr:hover {
        background: url(/assets/images/services/sr.png);
        color: transparent;
        height: 14em;
        width: auto
    }
    .ai-hr:hover {
        background: url(/assets/images/services/tr.jpg);
        color: transparent;
        height: 14em;
        width: auto
    }
    .ai-r:hover {
        background: url(/assets/images/services/es.jpg);
        color: transparent;
        height: 14em;
        width: auto
    }
    .ios:hover {
        background: url(/assets/images/services/ios.jpg);
        color: transparent;
        height: 14em;
        width: auto
    }
    .android:hover {
        background: url(/assets/images/services/android.png);
        color: transparent;
        height: 14em;
        width: auto
    }
    .windows:hover {
        background: url(/assets/images/services/windows.png);
        color: transparent;
        height: 14em;
        width: auto
    }
    .pe-head-img {
        font-size: x-large;
        margin-top: 4em
    }
    .wb-grid {
        display: grid
    }
    .left-wb {
        margin-top: 9em;
        margin-left: 23px
    }
    .python {
        margin-top: 23em
    }
    .solidity {
        margin-top: 16em
    }
    .php-con {
        margin-top: 9em;
        margin-left: 22px;
        text-align: justify
    }
    .web-img1 {
        float: left
    }
    .left-wb {
        margin-top: 9em;
        margin-left: 23px
    }
    .python {
        margin-left: 22px
    }
    .solidity {
        margin-top: 16em;
        margin-left: 22px
    }
    .python-con {
        float: left;
        margin-left: 22px;
        margin-top: 11px;
        text-align: justify
    }
    .ionic-con {
        margin-left: 22px;
        text-align: justify
    }
    .solidity-con {
        float: left;
        margin-left: 22px;
        margin-top: 11px;
        text-align: justify
    }
    .ionic {
        margin-left: 22px;
        margin-left: 22px
    }
    .java {
        margin-left: 24px
    }
    .php {
        margin-left: 22px
    }
}

@media only screen and (min-width:426px) and (max-width:700px) {
    .heading-on-image {
        font-size: 42px;
        margin-left: 5em;
        margin-top: 4em
    }
    .blockchain-image {
        height: auto;
        width: auto
    }
    .block-content {
        margin-left: 25px;
        height: max-content;
        width: -webkit-fill-available;
        margin-right: 25px
    }
    .alinks {
        margin-bottom: 10px
    }
    .dapp-image {
        display: none
    }
    .ml-image {
        height: auto;
        width: auto;
        margin-top: 53px
    }
    .heading-on-ai {
        margin-left: 2em;
        margin-top: 3em;
        font-size: xx-large
    }
    .ios:hover {
        background: url(/assets/images/services/ios.jpg);
        color: transparent;
        height: 207px;
        width: 367px
    }
    .android:hover {
        background: url(/assets/images/services/android.png);
        color: transparent;
        height: 207px;
        width: 367px
    }
    .windows:hover {
        background: url(/assets/images/services/windows.png);
        color: transparent;
        height: 14em;
        width: auto
    }
    .pe-head-img {
        font-size: x-large;
        margin-top: 4em
    }
    .wb-grid {
        display: grid
    }
    .left-wb {
        margin-top: 9em;
        margin-left: 23px
    }
    .python {
        margin-top: 23em
    }
    .solidity {
        margin-top: 16em
    }
}

@media only screen and (min-width:701px) and (max-width:768px) {
    .heading-on-image {
        margin-left: 9em;
        margin-top: 6em;
        font-size: xx-large
    }
    .blockchain-image {
        height: auto;
        width: auto
    }
    .block-content {
        margin-left: 25px;
        height: max-content;
        width: -webkit-fill-available;
        margin-right: 25px
    }
    .alinks {
        margin-bottom: 10px
    }
    .dapp-image {
        display: none
    }
    .ml-image {
        height: auto;
        width: auto;
        margin-top: 53px
    }
    .heading-on-ai {
        margin-left: 6em;
        margin-top: 6em;
        font-size: xx-large
    }
    .ai-grid {
        display: grid;
        grid-template-columns: repeat(1, 1fr)
    }
    .ai-game:hover {
        background: url(/assets/images/services/ai-game.jpg);
        color: transparent;
        height: 207px;
        width: 367px
    }
    .ai-nlp:hover {
        background: url(/assets/images/services/nlp.jpg);
        color: transparent;
        height: 207px;
        width: 367px
    }
    .ai-ir:hover {
        background: url(/assets/images/services/ir.jpg);
        color: transparent;
        height: 207px;
        width: 367px
    }
    .ai-sr:hover {
        background: url(/assets/images/services/sr.png);
        color: transparent;
        height: 207px;
        width: 367px
    }
    .ai-hr:hover {
        background: url(/assets/images/services/tr.jpg);
        color: transparent;
        height: 207px;
        width: 367px
    }
    .ai-r:hover {
        background: url(/assets/images/services/es.jpg);
        color: transparent;
        height: 207px;
        width: 367px
    }
    .ios:hover {
        background: url(/assets/images/services/ios.jpg);
        color: transparent;
        height: 14em;
        width: auto
    }
    .android:hover {
        background: url(/assets/images/services/android.png);
        color: transparent;
        height: 14em;
        width: auto
    }
    .windows:hover {
        background: url(/assets/images/services/windows.png);
        color: transparent;
        height: 14em px;
        width: auto
    }
    .pe-head-img {
        font-size: x-large;
        margin-top: 4em
    }
    .wb-grid {
        display: grid
    }
}

@media only screen and (min-width:769px) and (max-width:1314px) {
    .heading-on-image {
        font-size: 42px;
        margin-left: 6em;
        margin-top: 8em
    }
    .blockchain-image {
        height: 100%;
        width: 100%;
    }
    .block-content {
        margin-left: 25px;
        height: max-content;
        width: -webkit-fill-available;
        margin-right: 25px
    }
    .alinks {
        margin-bottom: 10px
    }
    .dapp-image {
        float: left
    }
    .alinks {
        margin-top: 27em
    }
    .heading-on-ai {
        margin-left: 4em
    }
    .ai-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        margin-left: 3em;
        margin-right: 3em
    }
    .ai-game:hover {
        background: url(/assets/images/services/ai-game.jpg);
        color: transparent;
        height: 207px;
        width: 367px
    }
    .ai-nlp:hover {
        background: url(/assets/images/services/nlp.jpg);
        color: transparent;
        height: 207px;
        width: 367px
    }
    .ai-ir:hover {
        background: url(/assets/images/services/ir.jpg);
        color: transparent;
        height: 207px;
        width: 367px
    }
    .ai-sr:hover {
        background: url(/assets/images/services/sr.png);
        color: transparent;
        height: 207px;
        width: 367px
    }
    .ai-hr:hover {
        background: url(/assets/images/services/tr.jpg);
        color: transparent;
        height: 207px;
        width: 367px
    }
    .ai-r:hover {
        background: url(/assets/images/services/es.jpg);
        color: transparent;
        height: 207px;
        width: 367px
    }
    .ios:hover {
        background: url(/assets/images/services/ios.jpg);
        color: transparent
    }
    .android:hover {
        background: url(/assets/images/services/android.png);
        color: transparent
    }
    .windows:hover {
        background: url(/assets/images/services/windows.png);
        color: transparent;
        height: 13em
    }
    .wb-grid {
        display: grid
    }
}

@media only screen and (min-width:1025px) and (max-width:1440px) {
    .alinks {
        margin-left: 43em;
        margin-top: -7em
    }
}

.onhover {
    display: none
}
