/************************************************************/
/*                        General                           */
/************************************************************/

p {
    line-height: 1.5;
    text-align: justify;
}

ul {
    list-style: none;
}

.right {
    text-align: right;
}

.left {
    text-align: left;
}

.center {
    text-align: center;
}

.down {
    padding-top: 100px;
    padding-bottom: 10px;
}

.fontChange {
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', 'Arial', 'sans-serif';
}


/************************************************************/
/*                        Extras                            */
/************************************************************/
#info {
    background: url("../images/info.png") no-repeat scroll 1.2em center #E2ECEE;
    border: 2px solid #9DDAE6;
    color: #444444;
    font-size: 12px;
    margin-bottom: 1.5em;
    padding: 1em 1.5em 1em 3.5em;
    width: 100%;
}



/************************************************************/
/*                        Header                            */
/************************************************************/

header {
    color: white;
    text-align: center;
}

    header ul li {
        display: inline-block;
        line-height: 60px;
        padding: 0 10px;
        transition: 0.25s ease-in-out;
    }

        header ul li a {
            color: white;
            text-decoration: none;
        }

            header ul li a:hover {
                color: #b9b9b9;
            }

.hamburger {
    display: none;
    position: absolute;
    top: 7px;
    left: 30px;
    font-size: 30px;
    cursor: pointer;
    transition: 0.25s ease-in-out;
}

    .hamburger:hover {
        color: #b9b9b9;
    }


/************************************************************/
/*                      Price Banner                        */
/************************************************************/

.priceBanner {
    position: absolute;
    top: 370px;
    left: -10px;
    -ms-transform: rotate(-11deg); /* IE 9 */
    -webkit-transform: rotate(-11deg); /* Chrome, Safari, Opera */
    transform: rotate(-11deg);
}


/************************************************************/
/*                          Menu                            */
/************************************************************/


.topMenu {
    background: rgba(78, 78, 78, 0.76);
    height: 60px;
    position: fixed;
    z-index: 5;
}

.topMenuList {
    display: inline;
    text-decoration: none;
}

    .topMenuList li:nth-of-type(12):before {
        content: "|";
        font-size: 15px;
        padding-right: 20px;
    }


.banner {
    background: rgba(0, 0, 0, 0.4);
    font-size: 1.5em;
    color: #fff;
}

.bannerLink {
    color: #fff;
}

    .bannerLink:hover {
        color: #555;
    }

/************************************************************/
/*                       Background                         */
/************************************************************/
.heroImage {
    background: url(../images/bgImage.jpg) no-repeat center center fixed;
    background-attachment: fixed !important;
    background-size: cover !important;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    height: 100% auto;
    width: auto;
    color: white;
    padding: 100px;
    z-index: -1;
}

    .heroImage p {
        margin-left: auto;
        margin-right: auto;
        font-size: 19px;
    }

    .heroImage h1 {
        padding-top: 150px;
    }

.bgAll {
    width: auto;
    height: auto;
}

.heroImageTech {
    background: url(../images/bgImage.jpg) no-repeat center center fixed;
    background-attachment: fixed !important;
    background-size: cover !important;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    height: 100% auto;
    width: 100% auto;
    color: white;
    padding-bottom: 130px;
    z-index: -1;
}

    .heroImageTech p {
        margin-left: auto;
        margin-right: auto;
        font-size: 19px;
    }

    .heroImageTech h1 {
        padding-top: 150px;
    }

.bgAllTech {
    width: auto;
    height: 50%;
}

.heroImageMCSA {
    background: url(../images/bgMCSA.jpg) no-repeat center center fixed;
    background-attachment: fixed !important;
    background-size: cover !important;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    height: 100% auto;
    width: 100% auto;
    color: white;
    padding-bottom: 130px;
    z-index: -1;
}

    .heroImageMCSA p {
        margin-left: auto;
        margin-right: auto;
        font-size: 19px;
    }

    .heroImageMCSA h1 {
        padding-top: 150px;
    }

.bgAllMCSA {
    width: auto;
    height: 50%;
}

.heroImageMCSE {
    background: url(../images/bgMCSE.jpg) no-repeat center center fixed;
    background-attachment: fixed !important;
    background-size: cover !important;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    height: 100% auto;
    width: 100% auto;
    color: white;
    padding-bottom: 130px;
    z-index: -1;
}

    .heroImageMCSE p {
        margin-left: auto;
        margin-right: auto;
        font-size: 19px;
    }

    .heroImageMCSE h1 {
        padding-top: 150px;
    }

.bgAllMCSE {
    width: auto;
    height: 50%;
}

.heroImageMTA {
    background: url(../images/bgMTA.jpg) no-repeat center center fixed;
    background-attachment: fixed !important;
    background-size: cover !important;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    height: 100% auto;
    width: 100% auto;
    color: white;
    padding-bottom: 130px;
    z-index: -1;
}

    .heroImageMTA p {
        margin-left: auto;
        margin-right: auto;
        font-size: 19px;
    }

    .heroImageMTA h1 {
        padding-top: 150px;
    }

.bgAllMTA {
    width: auto;
    height: 50%;
}

.heroImageSQL {
    background: url(../images/bgSQL.jpg) no-repeat center center fixed;
    background-attachment: fixed !important;
    background-size: cover !important;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    height: 100% auto;
    width: 100% auto;
    color: white;
    padding-bottom: 130px;
    z-index: -1;
}

    .heroImageSQL p {
        margin-left: auto;
        margin-right: auto;
        font-size: 19px;
    }

    .heroImageSQL h1 {
        padding-top: 150px;
    }

.bgAllSQL {
    width: auto;
    height: 50%;
}

.heroImageProgramming {
    background: url(../images/bgProgramming.jpg) no-repeat center center fixed;
    background-attachment: fixed !important;
    background-size: cover !important;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    height: 100% auto;
    width: 100% auto;
    color: white;
    padding-bottom: 130px;
    z-index: -1;
}

    .heroImageProgramming p {
        margin-left: auto;
        margin-right: auto;
        font-size: 19px;
    }

    .heroImageProgramming h1 {
        padding-top: 150px;
    }

.bgAllProgramming {
    width: auto;
    height: 50%;
}

.heroImageOffice {
    background: url(../images/bgMOS.jpg) no-repeat center center fixed;
    background-attachment: fixed !important;
    background-size: cover !important;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    height: 100% auto;
    width: 100% auto;
    color: white;
    padding-bottom: 130px;
    z-index: -1;
}

    .heroImageOffice p {
        margin-left: auto;
        margin-right: auto;
        font-size: 19px;
    }

    .heroImageOffice h1 {
        padding-top: 150px;
    }

.bgAllOffice {
    width: auto;
    height: 50%;
}

.heroImageDesktop {
    background: url(../images/bgDesktop.jpg) no-repeat center center fixed;
    background-attachment: fixed !important;
    background-size: cover !important;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    height: 100% auto;
    width: 100% auto;
    color: white;
    padding-bottom: 130px;
    z-index: -1;
}

    .heroImageDesktop p {
        margin-left: auto;
        margin-right: auto;
        font-size: 19px;
    }

    .heroImageDesktop h1 {
        padding-top: 150px;
    }

.bgAllDesktop {
    width: auto;
    height: 50%;
}

.heroImageServer {
    background: url(../images/bgServer.jpg) no-repeat center center fixed;
    background-attachment: fixed !important;
    background-size: cover !important;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    height: 100% auto;
    width: 100% auto;
    color: white;
    padding-bottom: 130px;
    z-index: -1;
}

    .heroImageServer p {
        margin-left: auto;
        margin-right: auto;
        font-size: 19px;
    }

    .heroImageServer h1 {
        padding-top: 150px;
    }

.bgAllServer {
    width: auto;
    height: 50%;
}

.heroImageClassroom {
    background: url(../images/bgClassroom.jpg) no-repeat center center fixed;
    background-attachment: fixed !important;
    background-size: cover !important;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    height: 100% auto;
    width: 100% auto;
    color: white;
    padding-bottom: 130px;
    z-index: -1;
}

    .heroImageClassroom p {
        margin-left: auto;
        margin-right: auto;
        font-size: 19px;
    }

    .heroImageClassroom h1 {
        padding-top: 150px;
    }

.bgAllClassroom {
    width: auto;
    height: 50%;
}

.heroImageDemo {
    background: url(../images/bgDemo.jpg) no-repeat center center fixed;
    background-attachment: fixed !important;
    background-size: cover !important;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    height: 100% auto;
    width: 100% auto;
    color: white;
    padding-bottom: 130px;
    z-index: -1;
}

    .heroImageDemo p {
        margin-left: auto;
        margin-right: auto;
        font-size: 19px;
    }

    .heroImageDemo h1 {
        padding-top: 150px;
    }

.bgAllDemo {
    width: auto;
    height: 50%;
}

.heroImageContact {
    background: url(../images/bgContact.jpg) no-repeat center center fixed;
    background-attachment: fixed !important;
    background-size: cover !important;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    height: 100% auto;
    width: 100% auto;
    color: white;
    padding-bottom: 130px;
    z-index: -1;
}

    .heroImageContact p {
        margin-left: auto;
        margin-right: auto;
        font-size: 19px;
    }

    .heroImageContact h1 {
        padding-top: 150px;
    }

.bgAllContact {
    width: auto;
    height: 50%;
}

.heroImageAbout {
    background: url(../images/bgAbout.jpg) no-repeat center center fixed;
    background-attachment: fixed !important;
    background-size: cover !important;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    height: 100% auto;
    width: 100% auto;
    color: white;
    padding-bottom: 130px;
    z-index: -1;
}

    .heroImageAbout p {
        margin-left: auto;
        margin-right: auto;
        font-size: 19px;
    }

    .heroImageAbout h1 {
        padding-top: 150px;
    }

.bgAllAbout {
    width: auto;
    height: 50%;
}

.heroImageWhatWeDo {
    background: url(../images/bgAbout.jpg) no-repeat center center fixed;
    background-attachment: fixed !important;
    background-size: cover !important;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    height: 100% auto;
    width: 100% auto;
    color: white;
    padding-bottom: 130px;
    z-index: -1;
}

    .heroImageWhatWeDo p {
        margin-left: auto;
        margin-right: auto;
        font-size: 19px;
    }

    .heroImageWhatWeDo h1 {
        padding-top: 150px;
    }

.bgAllWhatWeDo {
    width: auto;
    height: 50%;
}

.heroImageThank {
    background: url(../images/bgThankyou.jpg) no-repeat center center fixed;
    background-attachment: fixed !important;
    background-size: cover !important;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    height: 100% auto;
    width: 100% auto;
    color: white;
    padding-bottom: 130px;
    z-index: -1;
}

    .heroImageThank p {
        margin-left: auto;
        margin-right: auto;
        font-size: 19px;
    }

    .heroImageThank h1 {
        padding-top: 150px;
    }

.bgAllThank {
    width: auto;
    height: 50%;
}

.heroImageSorry {
    background: url(../images/bgSorry.jpg) no-repeat center center fixed;
    background-attachment: fixed !important;
    background-size: cover !important;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    height: 100% auto;
    width: 100% auto;
    color: white;
    padding-bottom: 130px;
    z-index: -1;
}

    .heroImageSorry p {
        margin-left: auto;
        margin-right: auto;
        font-size: 19px;
    }

    .heroImageSorry h1 {
        padding-top: 150px;
    }

.bgAllSorry {
    width: auto;
    height: 50%;
}

.downArrow {
    margin-right: auto;
    margin-left: auto;
}

    .downArrow:hover {
        filter: gray; /* IE6-9 */
        filter: grayscale(1); /* Firefox 35+ */
        -webkit-filter: grayscale(1); /* Google Chrome, Safari 6+ & Opera 15+ */
    }

#middleButtons1 a {
    display: inline-block;
    padding: 10px;
    margin: 10px auto;
    color: #fff;
    border: solid thin;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
    text-decoration: none;
    transition: 0.25s ease-in-out;
}

    #middleButtons1 a:hover {
        display: inline-block;
        padding: 10px;
        margin: 10px auto;
        color: #fff;
        background-color: rgba(104, 33, 122, 0.70) /*rgba(78, 78, 78, 0.76)*/;
        border: solid thin;
        border-top-left-radius: 20px;
        border-bottom-left-radius: 20px;
        border-top-right-radius: 20px;
        border-bottom-right-radius: 20px;
        text-decoration: none;
    }

#middleButtons2 a {
    display: inline-block;
    padding: 10px;
    margin: 10px auto;
    color: #fff;
    border: solid thin;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
    text-decoration: none;
    transition: 0.25s ease-in-out;
}

    #middleButtons2 a:hover {
        display: inline-block;
        padding: 10px;
        margin: 10px auto;
        color: #fff;
        background-color: rgba(220, 55, 1, 0.70);
        border: solid thin;
        border-top-left-radius: 20px;
        border-bottom-left-radius: 20px;
        border-top-right-radius: 20px;
        border-bottom-right-radius: 20px;
        text-decoration: none;
    }


/************************************************************/
/*                          Main                            */
/************************************************************/
.mainInfo {
    margin-top: 20px;
}

    .mainInfo h3 {
        font-size: 25px;
        border-bottom: 1px solid black;
        display: inline-block;
    }

    .mainInfo p {
        line-height: 200%;
        text-align: justify;
    }

.included ul li {
    list-style-type: circle;
}

.circleImg {
    display: inline-block;
    margin: 20px 3px -10px;
    width: 95px;
    height: 100px;
    border: 1px solid black;
    border-radius: 150px;
    background-size: contain;
    background-image: url('../images/server.jpg');
    background-repeat: no-repeat;
    background-position: 100%;
}

.bgForm {
    background-color: #e8e8e8;
    border-radius: 5px;
    padding: 10px;
    margin-bottom: 20px;
}

.bgFormEnd {
    background-color: #e8e8e8;
    border-radius: 5px;
    border: solid 2px #cf0505;
    padding: 10px;
    margin-bottom: 20px;
}


.bgFormTech {
    background-color: #e8e8e8;
    border-radius: 5px;
    border: solid 2px #0092ff;
    padding: 10px;
    margin-bottom: 20px;
}

#requestDemo {
    content: url('../images/buttons/requestDemo.jpg');
    z-index: 1;
    display: inline-block;
    text-decoration: none;
    margin-right: 15px;
    border-radius: 10px;
    -webkit-transition: 0.25s ease-in-out;
    transition: 0.25s ease-in-out;
}

    #requestDemo:hover {
        content: url('../images/buttons/requestDemoHover.jpg');
        z-index: 9;
        box-shadow: 0 0 5px #878787;
        -webkit-transition: 500ms linear 0s;
        -moz-transition: 500ms linear 0s;
        -o-transition: 500ms linear 0s;
        transition: 500ms linear 0s;
    }

.contentArea {
    background: #fff;
    width: 100%;
    height: 100%;
    box-shadow: 5px 0px 5px #d0d0d0, 0px -5px 10px #d0d0d0;
}

    .contentArea h1 {
        padding-top: 60px;
    }

    .contentArea h4 {
        border-bottom: 1px solid black;
    }

.contentArea2 {
    background: #fff;
    width: 100%;
    height: 100%;
}

    .contentArea2 h1 {
        padding-top: 30px;
    }

    .contentArea2 h4 {
        border-bottom: 1px solid black;
    }


.aboutRight {
    margin: 20px auto;
    width: 300px;
    height: 300px;
    border: 1px solid black;
    border-radius: 150px;
    background-size: contain;
    background-image: url('../images/front-office.jpg');
    background-repeat: no-repeat;
    background-position: 100%;
}

.aboutLeft {
    margin: 30px auto;
    width: 300px;
    height: 300px;
    border: 1px solid black;
    border-radius: 150px;
    background-size: contain;
    background-image: url('../images/what-we-do.jpg');
    background-repeat: no-repeat;
    background-position: 100%;
}

.table-benefits {
    display: inline-block;
}

#comptiaLogo {
    width: auto;
}

#ciscoLogo {
    width: auto;
}


.middleArea {
    display: inline-block;
    padding: 20px;
    text-align: left;
}


/************************************************************/
/*                          Table                           */
/************************************************************/

table#responsiveTable {
    margin: 0 auto;
    border-collapse: collapse;
    font-weight: 100;
    background: #555;
    color: #fff;
    text-rendering: optimizeLegibility;
    border-radius: 5px;
}

    table#responsiveTable caption {
        font-size: 2rem;
        color: #444;
        margin: 1rem;
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center left, center right;
    }

    table#responsiveTable thead th {
        font-weight: 600;
    }

    table#responsiveTable thead th, table#responsiveTable tbody td {
        padding: .8rem;
        font-size: 1.4rem;
        text-align: center;
    }

    table#responsiveTable tbody td {
        padding: .8rem;
        font-size: 1.4rem;
        color: #444;
        background: #eee;
    }

    table#responsiveTable tbody tr:not(:last-child) {
        border-top: 1px solid #ddd;
        border-bottom: 1px solid #ddd;
    }

@media screen and (max-width: 750px) {
    table#responsiveTable caption {
        background-image: none;
    }

    table#responsiveTable thead {
        display: none;
    }

    table#responsiveTable tbody td {
        display: block;
        padding: .6rem;
    }

    table#responsiveTable tbody tr td:first-child {
        background: #555;
        color: #fff;
    }

    table#responsiveTable tbody td:before {
        content: attr(data-th);
        font-weight: bold;
        display: inline-block;
        text-align: center;
    }
}


/************************************************************/
/*                     AreaContent Image                    */
/************************************************************/

.mcsa-image {
    float: right;
    width: 33%;
    margin: -310px 15px -35px 0;
}

.mcse-image {
    float: right;
    width: 30%;
    margin: -200px 45px -35px 0;
}

.mta-image {
    float: right;
    width: 33%;
    margin: -240px 15px -35px 0;
}

.sql-image {
    float: right;
    width: 33%;
    margin: -300px 15px -35px 0;
}

.programming-image {
    float: left;
    width: 90%;
    margin-left: 20px;
}

.office-image {
    float: right;
    width: 30%;
    margin: -240px 45px -35px 0;
}

.desktop-image {
    float: right;
    width: 33%;
    margin: -320px 15px -35px 0;
}

.server-image {
    float: right;
    width: 30%;
    margin: -250px 45px -30px 0;
}

.classroom-image {
    float: right;
    width: 25%;
    margin: -240px 85px -35px 0;
}

.demo-image {
    position: relative;
    float: right;
    width: 33%;
    margin: -330px 250px -35px 0;
}



/************************************************************/
/*                        Contact                           */
/************************************************************/

.phone-icon {
    list-style-image: url("../images/phone16.png");
    padding: 5px;
}

.email-icon {
    list-style-image: url("../images/close13.png");
    padding: 5px;
}

.address-icon {
    list-style-image: url("../images/map6.png");
    padding-left: 5px;
}

#map-canvas {
    width: auto;
    height: 400px;
    border: solid 2px #999;
    border-radius: 5px;
    background-color: #CCC;
    padding: 50px;
    margin-top: 10px;
}

/************************************************************/
/*                        Footer                            */
/************************************************************/

footer {
    background-color: rgba(0, 32, 80, 0.53);
    line-height: 60px;
}

.footer a {
    display: inline-block;
    padding: 5px;
    color: #fff;
    text-decoration: none;
    font-size: 14px;
}

    .footer a:hover {
        display: inline-block;
        padding: 5px;
        color: #adadad;
        text-decoration: none;
        font-size: 14px;
    }

.footer p {
    display: inline-block;
    padding: 5px;
    color: #fff;
}

    .footer p:before {
        content: "|";
        color: #fff;
        font-size: 15px;
        padding-right: 15px;
        padding-left: 7px;
    }

footer .partners {
}

    footer .partners .retina:hover {
        filter: gray; /* IE6-9 */
        filter: grayscale(1); /* Firefox 35+ */
        -webkit-filter: grayscale(1); /* Google Chrome, Safari 6+ & Opera 15+ */
    }


.approved {
    display: normal;
    margin: 0 auto;
    opacity: 0.7;
}


/************************************************************/
/*                         Icons                            */
/************************************************************/
#iconHoverTwitter:hover {
    content: url('../Images/twitterhover.png');
    width: 50px;
    height: 50px;
}

#iconHoverFacebook:hover {
    content: url('../Images/facebookhover.png');
    width: 50px;
    height: 50px;
}

#iconHoverLinkedin:hover {
    content: url('../Images/linkedinhover.png');
    width: 50px;
    height: 50px;
}

.followIcon li {
    display: inline-block;
    padding: 20px;
}



/************************************************************/
/*                       slidebox                           */
/************************************************************/

#slidebox {
    z-index: 5;
    width: 180px;
    height: 310px;
    padding: 10px;
    background-color: #fff;
    border-top: 3px solid #0092ff;
    position: fixed;
    bottom: 50px;
    right: -430px;
    -moz-box-shadow: -2px 0px 5px #aaa;
    -webkit-box-shadow: -2px 0px 5px #aaa;
    box-shadow: -2px 0px 5px #aaa;
}

    #slidebox p, a.more {
        font-size: 12px;
        font-family: Arial,Helvetica,sans-serif;
        letter-spacing: 1px;
        color: #555;
        text-align: left;
    }

a.more {
    cursor: pointer;
    color: #0092ff;
    text-decoration: none;
    text-transform: uppercase;
}

    a.more:hover {
        text-decoration: underline;
    }

#slidebox h2 {
    color: #0092ff;
    font-size: 19px;
    font-weight: bold;
    margin: 10px 20px 10px 0px;
}

a.close1 {
    background: transparent url(../images/close.gif) no-repeat top left;
    width: 13px;
    height: 13px;
    position: absolute;
    cursor: pointer;
    top: 10px;
    right: 10px;
}

    a.close1:hover {
        background-position: 0px -13px;
    }


/************************************************************/
/*                         Media                            */
/************************************************************/


@media only screen and (max-width: 1430px) {
    .topMenuList li:nth-of-type(12) {
        display: none;
    }
}

@media only screen and (max-width: 1128px) {
    header ul li a {
        font-size: 14px;
        text-decoration: none;
    }
}

@media only screen and (max-width: 942px) {
    header ul li a {
        font-size: 12px;
        text-decoration: none;
    }
}

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

    .topMenuList {
        display: none;
        position: relative;
        top: 60px;
        background: rgba(78, 78, 78, 0.76);
        border-bottom-right-radius: 20px;
        border-bottom-left-radius: 20px;
    }

    header ul li {
        width: 45%;
        cursor: pointer;
    }

        header ul li:hover {
            background: rgba(78, 78, 78, 0.8);
        }

        header ul li a {
            width: 100%;
            height: 100%;
            display: block;
        }

    .hamburger {
        display: block;
    }
}


@media only screen and (max-width: 750px) {
    .topContact a {
        font-size: 12px;
        text-decoration: none;
    }

    .bgAll h1 {
        font-size: 4.0rem;
    }

    .bgAll span {
        font-size: 14px;
    }

    .bgAllMCSA h1 {
        font-size: 4.0rem;
    }

    .bgAllMCSA span {
        font-size: 14px;
    }

    .bgAllMCSE h1 {
        font-size: 4.0rem;
    }

    .bgAllMCSE span {
        font-size: 14px;
    }

    .bgAllMTA h1 {
        font-size: 4.0rem;
    }

    .bgAllMTA span {
        font-size: 14px;
    }

    .bgAllSQL h1 {
        font-size: 4.0rem;
    }

    .bgAllSQL span {
        font-size: 14px;
    }

    .bgAllProgramming h1 {
        font-size: 4.0rem;
    }

    .bgAllProgramming span {
        font-size: 14px;
    }

    .bgAllOffice h1 {
        font-size: 4.0rem;
    }

    .bgAllOffice span {
        font-size: 14px;
    }

    .bgAllDesktop h1 {
        font-size: 4.0rem;
    }

    .bgAllDesktop span {
        font-size: 14px;
    }

    .bgAllServer h1 {
        font-size: 4.0rem;
    }

    .bgAllServer span {
        font-size: 14px;
    }

    .bgAllClassroom h1 {
        font-size: 4.0rem;
    }

    .bgAllClassroom span {
        font-size: 14px;
    }

    .bgAllContact h1 {
        font-size: 4.0rem;
    }

    .bgAllContact span {
        font-size: 14px;
    }

    .bgAllAbout h1 {
        font-size: 4.0rem;
    }

    .bgAllAbout span {
        font-size: 14px;
    }

    .bgAllDemo h1 {
        font-size: 4.0rem;
    }

    .bgAllDemo span {
        font-size: 14px;
    }

    .bgAllWhatWeDo h1 {
        font-size: 4.0rem;
    }

    .bgAllWhatWeDo span {
        font-size: 14px;
    }

    .bgAllThank h1 {
        font-size: 4.0rem;
    }

    .bgAllThank span {
        font-size: 14px;
    }

    .bgAllSorry h1 {
        font-size: 4.0rem;
    }

    .bgAllSorry span {
        font-size: 14px;
    }

    .mcsa-image {
        display: none;
    }

    .mcse-image {
        display: none;
    }

    .mta-image {
        display: none;
    }

    .sql-image {
        display: none;
    }

    .programming-image {
        display: none;
    }

    .office-image {
        display: none;
    }

    .desktop-image {
        display: none;
    }

    .server-image {
        display: none;
    }

    .classroom-image {
        display: none;
    }

    .demo-image {
        display: none;
    }

    .contact-image {
        display: none;
    }

    .topMenuList {
        top: 50px;
    }
}

@media only screen and (max-width: 550px) {
    .banner {
        background: rgba(0, 0, 0, 0.4);
        font-size: 1em;
        color: #fff;
    }

    .bgAll h1 {
        font-size: 2.5rem;
    }

    .bgAll p {
        font-size: 12px;
    }

    .bgAllMCSA h1 {
        font-size: 3.0rem;
    }

    .bgAllMCSA span {
        font-size: 12px;
    }

    .bgAllMCSE h1 {
        font-size: 3.0rem;
    }

    .bgAllMCSE span {
        font-size: 12px;
    }

    .bgAllMTA h1 {
        font-size: 3.0rem;
    }

    .bgAllMTA span {
        font-size: 12px;
    }

    .bgAllSQL h1 {
        font-size: 3.0rem;
    }

    .bgAllSQL span {
        font-size: 12px;
    }

    .bgAllProgramming h1 {
        font-size: 3.0rem;
    }

    .bgAllProgramming span {
        font-size: 12px;
    }

    .bgAllOffice h1 {
        font-size: 3.0rem;
    }

    .bgAllOffice span {
        font-size: 12px;
    }

    .bgAllDesktop h1 {
        font-size: 3.0rem;
    }

    .bgAllDesktop span {
        font-size: 12px;
    }

    .bgAllServer h1 {
        font-size: 3.0rem;
    }

    .bgAllServer span {
        font-size: 12px;
    }

    .bgAllClassroom h1 {
        font-size: 3.0rem;
    }

    .bgAllClassroom span {
        font-size: 12px;
    }

    .bgAllContact h1 {
        font-size: 3.0rem;
    }

    .bgAllContact span {
        font-size: 12px;
    }

    .bgAllAbout h1 {
        font-size: 3.0rem;
    }

    .bgAllAbout span {
        font-size: 12px;
    }

    .bgAllDemo h1 {
        font-size: 3.0rem;
    }

    .bgAllDemo span {
        font-size: 12px;
    }

    .bgAllWhatWeDo h1 {
        font-size: 3.0rem;
    }

    .bgAllWhatWeDo span {
        font-size: 12px;
    }

    .bgAllThank h1 {
        font-size: 3.0rem;
    }

    .bgAllThank span {
        font-size: 12px;
    }

    .bgAllSorry h1 {
        font-size: 3.0rem;
    }

    .bgAllSorry span {
        font-size: 12px;
    }

    .topContact li:nth-of-type(2):before {
        content: "|";
        font-size: 12px;
        padding-right: 15px;
    }

    .priceBanner {
        display: none;
    }
}


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

    .banner {
        background: rgba(0, 0, 0, 0.4);
        font-size: 0.8em;
        color: #fff;
    }

    .bgAll .container {
        margin: 0% -25%;
    }

    .bgAll h1 {
        font-size: 21px;
    }

    .bgAll p {
        font-size: 10px;
    }

    .bgAllMCSA .container {
        margin: 0% -5%;
    }

    .bgAllMCSA h1 {
        font-size: 21px;
    }

    .bgAllMCSA p {
        font-size: 10px;
    }

    .bgAllMCSE .container {
        margin: 0% -5%;
    }

    .bgAllMCSE h1 {
        font-size: 21px;
    }

    .bgAllMCSE p {
        font-size: 10px;
    }

    .bgAllMTA .container {
        margin: 0% -5%;
    }

    .bgAllMTA h1 {
        font-size: 21px;
    }

    .bgAllMTA p {
        font-size: 10px;
    }

    .bgAllSQL .container {
        margin: 0% -5%;
    }

    .bgAllSQL h1 {
        font-size: 21px;
    }

    .bgAllSQL p {
        font-size: 10px;
    }

    .bgAllProgramming .container {
        margin: 0% -5%;
    }

    .bgAllProgramming h1 {
        font-size: 21px;
    }

    .bgAllProgramming p {
        font-size: 10px;
    }

    .bgAllOffice .container {
        margin: 0% -5%;
    }

    .bgAllOffice h1 {
        font-size: 21px;
    }

    .bgAllOffice p {
        font-size: 10px;
    }

    .bgAllDesktop .container {
        margin: 0% -5%;
    }

    .bgAllDesktop h1 {
        font-size: 21px;
    }

    .bgAllDesktop p {
        font-size: 10px;
    }

    .bgAllServer .container {
        margin: 0% -5%;
    }

    .bgAllServer h1 {
        font-size: 21px;
    }

    .bgAllServer p {
        font-size: 10px;
    }

    .bgAllClassroom .container {
        margin: 0% -5%;
    }

    .bgAllClassroom h1 {
        font-size: 21px;
    }

    .bgAllClassroom p {
        font-size: 10px;
    }

    .bgAllContact .container {
        margin: 0% -5%;
    }

    .bgAllContact h1 {
        font-size: 21px;
    }

    .bgAllContact p {
        font-size: 10px;
    }

    .bgAllAbout .container {
        margin: 0% -5%;
    }

    .bgAllAbout h1 {
        font-size: 21px;
    }

    .bgAllAbout p {
        font-size: 10px;
    }

    .bgAllDemo .container {
        margin: 0% -5%;
    }

    .bgAllDemo h1 {
        font-size: 21px;
    }

    .bgAllDemo p {
        font-size: 10px;
    }

    .bgAllWhatWeDo .container {
        margin: 0% -5%;
    }

    .bgAllWhatWeDo h1 {
        font-size: 21px;
    }

    .bgAllWhatWeDo p {
        font-size: 10px;
    }

    .bgAllThank .container {
        margin: 0% -5%;
    }

    .bgAllThank h1 {
        font-size: 21px;
    }

    .bgAllThank p {
        font-size: 10px;
    }

    .bgAllSorry .container {
        margin: 0% -5%;
    }

    .bgAllSorry h1 {
        font-size: 21px;
    }

    .bgAllSorry p {
        font-size: 10px;
    }


    .table {
        display: none;
    }


    .aboutRight {
        margin: 0 auto;
        width: 200px;
        height: 200px;
        border: 1px solid black;
        border-radius: 150px;
        background-size: contain;
        background-image: url('../images/front-office.jpg');
        background-repeat: no-repeat;
        background-position: 100%;
    }

    .aboutLeft {
        margin: 0 auto;
        width: 200px;
        height: 200px;
        border: 1px solid black;
        border-radius: 150px;
        background-size: contain;
        background-image: url('../images/front-office.jpg');
        background-repeat: no-repeat;
        background-position: 100%;
    }


    .table-benefits {
        display: inline-block;
        font-size: 1em;
    }
}

@media only screen and (max-width: 350px) {
    .bgAll .container {
        margin: 0% -50%;
    }

    .bgAllMCSA .container {
        margin: 0% -10%;
    }

    .bgAllMCSE .container {
        margin: 0% -10%;
    }

    .bgAllMTA .container {
        margin: 0% -10%;
    }

    .bgAllSQL .container {
        margin: 0% -10%;
    }

    .bgAllProgramming .container {
        margin: 0% -10%;
    }

    .bgAllOffice .container {
        margin: 0% -10%;
    }

    .bgAllDesktop .container {
        margin: 0% -10%;
    }

    .bgAllServer .container {
        margin: 0% -10%;
    }

    .bgAllClassroom .container {
        margin: 0% -10%;
    }

    .bgAllContact .container {
        margin: 0% -10%;
    }

    .bgAllAbout .container {
        margin: 0% -10%;
    }

    .bgAllDemo .container {
        margin: 0% -10%;
    }

    .bgAllWhatWeDo .container {
        margin: 0% -10%;
    }

    .bgAllThank .container {
        margin: 0% -10%;
    }

    .bgAllSorry .container {
        margin: 0% -10%;
    }

    .modalDialog > div {
        width: 250px !important;
    }

    #comptiaLogo {
        width: 80%;
    }

    #ciscoLogo {
        width: 80%;
    }
}


@media only screen and (max-width: 285px) {
    .bgAll .container {
        margin: -0% -125%;
    }

    .bgAllMCSA .container {
        margin: 0% 5%;
    }

    .bgAllMCSE .container {
        margin: 0% 5%;
    }

    .bgAllMTA .container {
        margin: 0% 5%;
    }

    .bgAllSQL .container {
        margin: 0% 5%;
    }

    .bgAllProgramming .container {
        margin: 0% 5%;
    }

    .bgAllOffice .container {
        margin: 0% 5%;
    }

    .bgAllDesktop .container {
        margin: 0% 5%;
    }

    .bgAllServer .container {
        margin: 0% 5%;
    }

    .bgAllClassroom .container {
        margin: 0% 5%;
    }

    .bgAllContact .container {
        margin: 0% 5%;
    }

    .bgAllAbout .container {
        margin: 0% 5%;
    }

    .bgAllDemo .container {
        margin: 0% 5%;
    }

    .bgAllWhatWeDo .container {
        margin: 0% 5%;
    }

    .bgAllThank.container {
        margin: 0% 5%;
    }

    .bgAllSorry.container {
        margin: 0% 5%;
    }
}