.header img {
    width: 100%;
    height: 450px;
}

.mainbody-message {
    padding-left: 20px;
    background-color: whitesmoke;
    padding-bottom: 50px;
    padding-top: 50px;
    text-align: justify;
    border-radius: 25px;
}

/*the main body style completed*/

#cisco p {
    font-size: 20px;
    color: black;
}

.cdmainbody {
    padding-top: 100px;
    padding-bottom: 100px;
}

.cdmainbody img {
    border-radius: 5%;
}

.cdmainbody h1 {
    color: red;
}

.cisco-logo {
    display: inline-block;
    margin-bottom: 5%;
    vertical-align: top;
    margin-left: 5%;
    margin-right: 5%;
}

.cisco-logo:hover,
.nissan-picture:hover {
    width: 300px;
    height: 150px;
    -webkit-animation: Rotation 2s 1s;
}

@-webkit-keyframes Rotaion {
    0% {
        border-radius: 0 0 0 0;
        transform: rotate(0deg);
    }

    25% {
        border-radius: 50% 0 0 0;
        transform: rotate(45deg);
    }

    50% {
        border-radius: 50% 50% 0 0;
        transform: rotate(90deg);
    }

    75% {
        border-radius: 50% 50% 50% 0;
        transform: rotate(135deg);
    }

    100% {
        border-radius: 50% 50% 50% 50%;
        transform: rotate(180deg);
    }
}

#cisco img {
    border-radius: 15px;
    box-shadow: rgba(255, 0, 0, 0.4) 5px 5px,
        rgba(255, 0, 0, 0.3) 10px 10px,
        rgba(255, 0, 0, 0.2) 15px 15px,
        rgba(255, 0, 0, 0.1) 20px 20px,
        rgba(255, 0, 0, 0.05) 25px 25px;
}

/* 192, 197, 92  */

.cisco-preview {
    display: inline-block;
    width: 60%;
    height: 15%;
    margin-bottom: 10%;
}

.red {
    border-color: #FF0000;
    width: 90%;
    margin-left: auto;
    margin-bottom: 5%;
}


.cisco-preview2 {
    display: inline-block;
    width: 50%;
    height: 15%;
    margin-left: 5%;
    padding-bottom: 3%;
    vertical-align: top;
}

.nissan-picture {
    display: inline-block;
    border-radius: 25px;
    vertical-align: top;
    margin-left: 10%;
}

.cisco1,
.cisco2 {

    box-shadow: 0 4px 8px 0 rgba(80, 135, 64), 0 6px 20px 0 rgba(80, 135, 64);
}

/* 	  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
*/

.cisco1 {
    display: inline-block;
    vertical-align: top;
    width: 37%;
    /*700px*/
    height: 1000px;
    /*900px*/
    margin-left: 10%;
    margin-bottom: 15%;
    border-style: dashed;
    border-color: #c0c55c;
    border-radius: 15%;
}

.ciscoImg1 {
    display: inline-block;
    width: 100%;
}

.cisco1p {
    width: 80%;
    font-size: 19px;
    text-align: justify;
    color: white;
    margin-left: 10%;
    margin-top: 5%;
    word-spacing: -2px;
}

hr {
    border-color: #c0c55c;
    margin-bottom: 10%;
}

.cisco2 {
    display: inline-block;
    margin-left: 7%;
    vertical-align: top;
    width: 37%;
    height: 1000px;
    border-style: dashed;
    border-color: #c0c55c;
    border-radius: 15%;
}

.ciscoImg2 {
    display: inline-block;
    width: 100%;
}

.cisco2p {
    width: 80%;
    font-size: 19px;
    text-align: justify;
    color: white;
    margin-left: 10%;
    /*35px*/
    margin-top: 5%;
    word-spacing: -3px;
}

.quespara,
.skillspara,
.coursepara,
.careerpara {
    vertical-align: top;
    margin-top: 3%;
    color: white;
}

.course,
.skills,
.career,
.question {
    display: flex;
}

.additional {
    margin: 40px var(--content-margin);
}

.additional h3 {
    color: red;
}

.additional a {
    color: lightblue;
}

/*-webkit-box-reflect: below 0px linear-gradient(to bottom, rgba(0,0,0,0.0), rgba(0,0,0,0.4));*/


/*-------------------------------Media queries ------------------------------------------*/

@media screen and (min-width: 500px) {


    .cisco-logo img {
        width: 70%;
        margin-left: 0;
    }

    .cisco-preview {
        width: 50%;
        margin-left: 0;
        margin-bottom: 5%;
    }

    .cisco-preview2 {
        margin-right: 2%;
    }


    .nissan-picture img {
        width: 70%;
    }

    .ciscoImg1 img,
    .ciscoImg2 img {
        width: 100%;
    }

    /*second main body*/

}

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

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

    .cisco-intro,
    .cisco-intro2 {
        margin-left: 5%;
        margin-right: 0px;
    }

    .cisco-logo img {
        width: 35%;
    }

    .nissan-picture img {
        width: 35%;
    }

    .cisco-preview,
    .cisco-preview2 {
        width: 70%;
    }

    .cisco-preview2 {
        margin-left: 0;
    }

    #cisco p {
        font-size: 14px;
    }

    .cisco1,
    .cisco2 {
        height: 600px;
        margin-left: 6%;
    }

    .ciscoImg1 img,
    .ciscoImg2 img {
        width: 100%;
    }

    .cisco1p,
    .cisco2p {
        font-size: 12px;
        margin-left: 10%;
        word-spacing: -2px;
    }


    .additional img {
        width: 150px;
    }

    .additional p {
        font-size: 15px;
    }

    .coursepara,
    .skillspara,
    .careerpara,
    .quespara {
        margin-left: 25px;
    }
}