@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&family=Ubuntu:wght@400;700&display=swap');
* {
    margin:0;
    padding:0;
    box-sizing:border-box;
    text-decoration:none;
}
/*scrollbar design*/
::-webkit-scrollbar {
    width:20px;
}
::-webkit-scrollbar-track {
    background:#111;
}
::-webkit-scrollbar-thumb {
    background:#e7d981;
}
/*body, div, p, ul, li, block {
    margin:0;
    padding:0;
}*/
body {
    background-color:#fff;
    /*rgb(224,224,224)*/
    font-family:Arial, Helvetica, sans-serif;
    font-size:12px;
    /*font-family: 'Tangerine', serif;*/

}

/*Home page design*/
.vdoList {
    width:30%;
    /*max-height:500px;*/
    float:left;
    background-color:rgb(26, 26, 26);
    margin-left:5%;
    padding:5px;
    color:#fff;
    font-size:large;
    /*border:3px solid red;*/
}
.showvdo {
    width:55%;
    /*max-height:500px;*/
    float:right;
    background-color: rgb(78,78,78);
    margin-right:5%;
    padding:5px;
    color:#aaa;
    font-size:large;
    /*border:3px solid red;*/
}
.article-full {
    width:65%;
    padding:5px;
    margin:auto;
    color:rgb(61,61,61);
    font-size:x-large;


}
h1 {
    color:rgb(10,110,178);
    text-shadow: 4px 4px 4px #aaa;
}
p {
    /*font-family:Arial, Helvetica,sans-serif;*/
    /*font-family: 'Quicksand', sans-serif;*/
    /*font-size:13px;*/
    padding-right:15px;
    font-family: 'Tangerine', serif;
    font-size: 20px;

}
.colorth {
    text-decoration:none;
    color:#fff;
    background-color:#ff6a00;
    display:block;
    width:90px;
    text-align:center;
    border-radius: 5px;
    padding:8px;
}
.loc {
    background-color:rgb(194, 227, 246);
    margin-bottom:15px;
    padding:10px;
    color:rgb(10,110,178);
    width:230px;
    float:left;
    margin-left:20px;
    border:3px solid rgb(10,110,178);
    border-radius: 5px 5px 5px 5px;
    box-shadow: 4px 4px 4px #aaa;
}
.pdn {
    margin-left:20px;
}
.Wrapper {
    /*display:flex;*/
    width:90%;
    margin:auto; 
    /*background:linear-gradient(#7a6565 70%, rgb(78,78,78) 30%);*/ 
    /*background-image: linear-gradient(to bottom, #7a6565 90%, rgba(78,78,78, 0) 10);*/  
    /*background-color: rgb(255, 255, 255);*/  
}
.contents {
    width:100%;
    height:auto;
    background-color:#fff;
    /*background-color:rgb(224,224,224);*/
    /*background:linear-gradient(#7a6565 70%, rgb(78,78,78) 30%);*/
    /*background-image: linear-gradient(to bottom, #7a6565 0, rgba(78,78,70, 0) 100%);*/
    /*border: 1px solid rgb(224,224,224);*/
    border-radius: 5px 5px 5px 5px;
    float:left;
    margin-top:8px;
    margin-bottom:8px;
    color:rgb(243,243,243);
    /*min-height:390px;*/
    /*padding:5px;*/
}

.logo {
    height:200px;
    width:100%;   
    background-image: url("../Images/programming.jpg");
    background-repeat: no-repeat;
    background-position: left top;
    background-size:cover;
    
    /*float:left;*/
    /*border-radius:50%;*/

}
.hero-image {
  margin: auto;
}

.hero-image::after {
  display: block;
  position: relative;
  background-image: linear-gradient(to bottom, rgba(26, 26, 26, 0) 0, rgb(78,78,78) 100%);
  margin-top: -70px;
  height: 200px;
  width: 100%;
  content: '';
}
.contactinf {
    float:right;
    margin-right:10px;
    margin-top:30px;
    text-decoration:none;
    color:rgb(255, 0, 0);
    border-radius: 5px;
    padding:3px;
    margin-bottom: -170px;

}
.nav
{
    /*background-color:rgb(78,78,78);*/
    background:linear-gradient( rgb(78,78,78) 30%, #e7d981 70% );
    width:100%;
    margin:-5px 0px 10px;
    padding:0px;
    height:50px;
    color:rgb(243,243,243);    
    border-radius:5px 5px 5px 5px;   
    text-shadow: 4px 4px 4px #aaa;    
    z-index:2;
}
.navigation_first_item {
    border-left:0px;
    border-radius:5px 0 0 5px;
}
.nav ul
{
    padding:0px;
    list-style:none;
}
    .nav ul li
    {        
        float:left;
        display:block;
        list-style:none;
        border-right:1px solid rgb(10,85,125);
        border-left:1px solid rgb(67,153,200);

    }
.nav ul li.navigation_first_item:hover
    {
        border-radius:5px 0px 0px 5px;
    }
 .nav ul li a
  {
     font-size:large;
     /*font-size:13px;*/
     font-weight:bold;
     line-height:50px;
     padding:8px 20px;
     color:#ffffff;
     text-decoration:none;
     /*border-radius: 5px 5px 5px 5px;
     background-color:rgb(10,110,178);
     display:block;*/

  }
 .nav ul li:hover
 {
     background-color:rgb(26,26,26);
     border-right: 1px solid rgb(14, 89, 130);
     color: rgb(255, 0, 0);
     display:block;
 }
.selected {
     /*background-color:rgb(14,79,114);
     border-right: 1px solid rgb(14, 89, 130);
     color: rgb(255, 0, 0);
     display:block;*/
     background-color:rgb(26,26,26);
     border-right: 1px solid rgb(14, 89, 130);
     color: rgb(255, 0, 0);
     display:block;
}
.nav ul li a:hover
 {
     /*background-color:rgb(14,79,114);*/
    background-color:rgb(26,26,26);
     border-right: 1px solid rgb(26,26,26);
     color: rgb(255, 0, 0);
 }

.nav ul li:hover > ul
    {        
        border-radius: 5px 5px 5px 5px;             
    }
    .menu ul ul
    {
        /*position:absolute;*/
        display:none; /*This is to display the sublist*/
    }
.nav ul ul ul
  {
     border-radius: 5px 5px 5px 5px;
     margin-left:128px;
     top:0px;
     bottom:0px;
     /*display:block;*/
  }
.nav .active{
     background-color:rgb(14,79,114);
     border-right: 1px solid rgb(14, 89, 130);
     color: rgb(255, 0, 0);
}
.text-content {
    width:60%;
    float:right;
    /*padding-right:5px;*/
    padding:10px;
    font-family:Arial, Helvetica,sans-serif;
    font-size:12px;
}
.content-left {
    width:35%;
    height:260px;
    float:left;
    margin-top:22px;
    /*border: 1px solid red;*/
}
.message {

    width:90%;
    padding:10px;
    margin:auto;
    margin-top:300px;
    /*border: 3px solid black;*/
}
.rightmsg {
    width:47%;
    float:right;
    background-color: rgb(194, 227, 246);
    border: 1px solid rgb(67,153,200);
    box-shadow: 4px 4px 4px #aaa;
}
.leftmsg {
    width:47%;
    float:left;
    background-color: rgb(194, 227, 246);
    border: 1px solid rgb(67,153,200);
    box-shadow: 4px 4px 4px #aaa;
}

.mshead {
    background-color:rgb(0, 148, 255);
    /*width:100%;*/
    padding:7px;
    margin-bottom:5px;
    height:45px;
    color:#fff;
    border-top:12px solid;
    border-top-color:rgb(14,79,114);
}
.imglong {
    height:395px;
    width:100%;
    margin-bottom:20px;
    
}
/*p {
    padding:2px;
}*/
.clear {
    clear:both;
}
.pg {
    width:90%;
    margin:auto;
    /*padding-left:50px;*/
}
/*This is to show and hide the menu when in mobile*/
.show-menu
{
    font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
    text-decoration:none;
    color:#fff;
    display:none;
    float:right;
}
input[type=checkbox]
{
    display:none;
}
input[type=checkbox]:checked~#menu
{
    display:block;
}
.mn
{
    width:50px;
    height:50px;
}
/*End of mobile*/

.footer
{
    /*height:50px;*/
    background-color:rgb(10,110,178);
    color:rgb(25,255,255);
    border-radius:5px 5px 5px 5px;
}
.footer h2
    {
        padding:15px;
        text-align:center;
    }

.Text-area {
    margin:auto;
    border:0px solid rgb(10,110,178);
    height:395px;
    width:70%;
}
.text-box {
    width:97%;
    height:30px;
    border-color:rgb(10,110,178);
    margin-bottom:5px;
    padding:5px;
    vertical-align:central;
    border-radius:5px 5px 5px 5px;
    background-image: linear-gradient(to bottom, #7a6565 0, rgba(78,78,70, 0) 100%);
    color:#fff;

}
.text-box-captcha {
    width:40%;
    height:30px;
    border-color:rgb(10,110,178);
    margin-bottom:5px;
    padding:5px;
    vertical-align:central;
    border-radius:5px 5px 5px 5px;
    background-image: linear-gradient(to bottom, #7a6565 0, rgba(78,78,70, 0) 100%);
    color:#fff;
}
.text-box-message {
    width:97%;
    border-color:rgb(10,110,178);
    margin-bottom:1px;
    padding:5px;
    vertical-align:central;
    border-radius:5px 5px 5px 5px;
    height:80px;
    background-image: linear-gradient(to bottom, #7a6565 0, rgba(78,78,70, 0) 100%);
   color:#fff;
}
.smb {
    text-decoration:none;
    color:#fff;
    background-color:#282020;
    display:block;
    width:90px;
    text-align:center;
    border-radius: 5px;
    padding:8px;
    float:right;
    margin:5px;
}
.smb:hover {
    background-color:#554b16;
}
.pic {
    width:45%;
    height:auto;
    float:left;
}
.Thanks {
    width:50%;
    height:auto;
    float:right;
}
.clch {
    color:#ff6a00;
}
.max-width {
    max-width:100%;
    padding: 0 80px;
    margin:auto;
}
.home {
    display:flex;
    background: url("/Myimages/me.png") no-repeat center;
    height:100vh;
    color:#fff;
    min-height:500px;
    font-family:'Ubuntu',sans-serif;
}
.home .home-content a{
    display:inline-block;
    background:#e7d981;
    color:#fff;
    font-size:25px;
    padding:12px 36px;
    margin-top:20px;
    border-radius:6px;
    border:2px solid #e7d981;
    transition:all 0.3s ease;
    }
.home .home-content a:hover {
    background:rgb(0,0,0);
    color:#e7d981;
    }
.home .max-width {
    margin:auto 0 auto 40px;
    }
.home .home-content .text-1 {
    font-size:27px;
    }
.home .home-content .text-2 {
    font-size:75px;
    font-weight:600;
    margin-left:-3px;
    }
.home .home-content .text-3 {
    font-size:40px;
    margin:5px 0;
    }
.home .home-content .text-3 span{
    color:#e7d981;
    font-weight:500;
    }
section {
    padding:100px 0;
    position:relative;
    clear:both !important;
}

.aboutme, .advantage, .skills {
    font-family: 'poppins',sans-serif;
    position:absolute;
    z-index:-1;
        /*clear:both;*/
    /*width:95%;
    height:1000px;
    margin:auto;
    padding:12px;
    background-color:#fff;
    color:rgb(65, 61, 61);
    font-size:small;
    font-family:'Segoe UI' 'Arial Rounded MT';    
    margin-top:5px;*/
}
section .title {        
        text-align:center !important;
        position:relative !important;
        /*width:100%;*/
        font-size:40px;
        font-weight:500;
        margin-bottom:50px !important;
        padding-bottom:20px !important;
        font-family: 'Ubuntu', sans-serif;
        color:rgb(0,0,0);
    }

section .title::before {
        content:"";
        position:absolute;
        bottom:0px;
        left:50%;
        width:180px;
        height:3px;
        background:#111;
        transform:translateX(-50%)
    }
section .title::after {        
        position:absolute;
        bottom:-12px;
        left:50%;
        font-size:20px;
        color:#e7d981;
        padding:5px;
        background:#fff;
        transform:translateX(-50%)
    }
.aboutme .title::after{
    content:"who I am";
}
.aboutme .about-content, .advantage .advantage-content, .skill-content{
    display:flex !important;
    flex-wrap:wrap;
    align-items:center;
    justify-content:space-between;
}
.aboutme .about-content .left{
    width:45%;
}

.aboutme .about-content .left img {
    height: 400px;
    width: 400px;
    -o-object-fit: cover;
    border-radius: 6px;
}
.aboutme .about-content .right{
    width:55%;
    color:rgb(0,0,0);
}
.aboutme .about-content .right .text{
    font-size:25px;
    font-weight:600;
    margin-bottom:10px;
    width:55%;
    color:rgb(0,0,0);
}
.aboutme .about-content .right .text span{
color:#e7d981;
}
.aboutme .about-content .right p{
    text-align:justify;
}
.aboutme .about-content .right a{
    display:inline-block;
    background:#e7d981;
    color:#fff;
    font-size:20px;
    font-weight:500;
    padding:10px 30px;
    margin-top:20px;
    border-radius:6px;
    border:2px solid #e7d981;
    transition:all 0.3s ease;
    }
.aboutme .about-content .right a:hover{
    color:#e7d981;
    background:none;
}

/*Advantage*/
.advantage {
    color:#fff;
    background:#111;
    top:1900px;
    width:90%;
    height:auto;
}
.advantage .title{
    color:#aaa;
}
.advantage .title::before{
    background:#fff;
}
.advantage .title::after{
    background:#111;
    content:"Your benefits are";
}
.advantage .advantage-content .card {
    width:calc(25% - 20px);
    background:#222;
    text-align:center;
    border-radius:6px;
    padding:20px 25px;
    cursor:pointer;
    transition:all 0.3s ease;
}
.advantage .advantage-content .card:hover{
    background:#e7d981;
    
}
.advantage .advantage-content .card .box{
    transition:all 0.3s ease;    
}
.advantage .advantage-content .card:hover .box {
    transform: scale(1.05);
    
    }
.advantage .advantage-content .card i{
    font-size:50px;
    color:#e7d981;
    transition:all 0.3s ease;
}
.advantage .advantage-content .card:hover i{
    color:#fff;
}
.advantage .advantage-content .card .text{
    font-size:25px;
    font-weight:500;
    margin:10px 0 7px 0;
    text-wrap:normal;
}
/*section skill code*/
.skills {
    /*color:#fff;*/
    background:#fff;
    top:2400px;
    width:90%;
    margin-bottom:20px !important;
    /*border:2px solid;*/
}
.skills .title::after{
    content:"My capabilities";
}
.skills .skill-content .left p {
    text-align:justify;
}
.skills .skill-content .left a {
   display:inline-block;
    background:#e7d981;
    color:#fff;
    font-size:18px;
    font-weight:500;
    padding:8px 16px;
    margin-top:20px;
    border-radius:6px;
    border:2px solid #e7d981;
    transition:all 0.3s ease;
}
.skills .skill-content .left a:hover {   
    color:#e7d981;
     background:none;
 }
.skills .skill-content .column {
    width: calc(50% - 30px);
    color:#111;
}
.skills .skill-content .left .text {
font-size:20px;
font-weight:600;
margin-bottom:10px;
}
.skills .skill-content .right .bars {
margin-bottom:15px;
}
.skills .skill-content .right .info {
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:15px;
}
.skills .skill-content .right span {
    font-weight:500;
    font-size:18px;
}
.skills .skill-content .right .line {
    height:5px;
    width:100%;
    background:#aaa;
    position:relative;
}
.skills .skill-content .right .da::before {
    content:"";
    position:absolute;
    height:100%;
    width:95%;
    left:0;
    top:0;
    background:#e7d981;
}
.skills .skill-content .right .dba::before {
    content:"";
    position:absolute;
    height:100%;
    width:90%;
    left:0;
    top:0;
    background:#e7d981;
}
.skills .skill-content .right .etl::before {
    content:"";
    position:absolute;
    height:100%;
    width:95%;
    left:0;
    top:0;
    background:#e7d981;
}
.skills .skill-content .right .proc::before {
    content:"";
    position:absolute;
    height:100%;
    width:98%;
    left:0;
    top:0;
    background:#e7d981;
}
.skills .skill-content .right .dvw::before {
    content:"";
    position:absolute;
    height:100%;
    width:80%;
    left:0;
    top:0;
    background:#e7d981;
}
.skills .skill-content .right .ddv::before {
    content:"";
    position:absolute;
    height:100%;
    width:70%;
    left:0;
    top:0;
    background:#e7d981;
}
.skills .skill-content .right .dvc::before {
    content:"";
    position:absolute;
    height:100%;
    width:20%;
    left:0;
    top:0;
    background:#e7d981;
}
.skills .skill-content .right .cfe::before {
    content:"";
    position:absolute;
    height:100%;
    width:10%;
    left:0;
    top:0;
    background:#e7d981;
}
.list {
    width:90%;
    height:auto;
    /*margin:auto;*/
    color:rgb(65, 61, 61);
    font-family:'Segoe UI' 'Arial Rounded MT';    

}
.contactme {
    width:80%;
    margin:auto;
    padding:12px;
    background-image: linear-gradient(to bottom, #7a6565 0, rgba(78,78,70, 0) 100%);
    color:#fff;
    font-size:small;
    font-family:'Segoe UI' 'Arial Rounded MT';
}
.im {
    float:left;
    width:220px;
    height:250px;
    margin-right:10px;
    margin-bottom:5px;
    border: 10px solid;
}
/*p {
    padding:10px;
}*/
.abhead {
    width:100%;
    height:45px;
    background:linear-gradient(rgb(26, 26, 26) 20%, rgb(65, 61, 61) 80%);
    /*margin-bottom:10px;*/
    text-align:center;
    /*padding:1px;*/
}
.abheadsm {
    width:100%;
    height:25px;
    background:linear-gradient(gray 20%, Darkgray 80%);
    margin-top:-20px;
    margin-bottom:10px;
    text-align:center;
    color:#fff;
}
.contact-form {
    width:55%;
    float:left;
    padding:5px;
    background-image: linear-gradient(to bottom, rgb(65, 61, 61) 0, rgba(78,78,70, 0) 100%);
}
.contact-right {
    width:40%;
    float:right;
    padding:5px;
    background-image: linear-gradient(to bottom, rgb(65, 61, 61) 0, rgba(78,78,70, 0) 100%);
}
.cert {
    width:70%;
    margin:auto;
}
.certhead {
    height:35px;
    margin:auto;
    width:100%;
    text-align:center;
    background-image: linear-gradient(to bottom, rgb(65, 61, 61) 0, rgba(78,78,70, 0) 100%);
}

/*.list {
    padding-left:12px;
    font-size:small;
    font-family:'Segoe UI' 'Arial Rounded MT';
}*/
.specimg::after {
  display: block;
  position: relative;
  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0, #fff 100%);
  content: '';
}
.Model-Head, .Model-footer
{
    /*background:#45214e;*/
    box-shadow:0px 2px 5px 0px lightblue;
    /*background:linear-gradient(#45214e 20%, #966707 80%);*/
    background-image: linear-gradient(to bottom, rgb(65, 61, 61) 0, rgba(78,78,70, 0) 100%);
    height:60px;
    color:#fff;
    border-bottom:none;
    width:100%;
    float:left;
    padding-bottom:8px;
}
.footerbtn 
{
    border-style:none;
    border-color:inherit;
    border-width:medium;
    float:right;
    /*background:#45214e;*/
    box-shadow:0px 2px 5px 0px lightblue;
    /*background:linear-gradient(#45214e 20%, #966707 80%);*/
    background-image: linear-gradient(to bottom, rgb(65, 61, 61) 0, rgba(78,78,70, 0) 100%);
    padding:12px 25px;
    width:100px;
    height:46px;
    color:#fff;
    border-radius:5%;
    margin:7px 5px 5px 0px;
}
.footerbtn:hover
{
    box-shadow:0px 2px 5px 0px lightblue;
    /*background:linear-gradient(#45214e 20%, #966707 80%);*/
    background-image: linear-gradient(to bottom, rgb(78,78,26, 0), rgba(26,26,26, 0) 100%);
    color:#4cff00;
}
.login-Content 
{
     /*background-color:#fff;*/
     margin:7% auto;
     height:45%;
     width:45%;
     background-image: linear-gradient(to bottom, rgb(65, 61, 61) 0, rgba(78,78,70, 0) 100%);
     /*box-shadow:0 5px 8px 0 #7a6565,0 7px 20px 0 rgba(0,0,0,0.17);*/
     /*#7a6565 0, rgba(78,78,70, 0) 100%*/
     animation-name:modalopen;
     animation-duration:5s;
}
.login-Content h1 
{
        text-transform:uppercase;
        padding:7px 0px;
        margin-left:5px;
}
.txtB 
{
    padding: 10px 20px;
    margin-top:3px;
    color:#fff;
    font-family:Arial 'Berlin Sans FB';
    font-size:large;
    text-decoration:solid;
    width:92%;
}
.boxUserName 
{
    background:url(../SiteImages/if_user_16_22656.ico) no-repeat;
    background-position:100% 5px;
    background-size:30px;
}
.boxPassword 
{
    background:url(../SiteImages/if_icon-118-lock-rounded_314485.ico)no-repeat;
    background-position:100% 5px;
    background-size:30px;
}
.emailMessage {
    width:75%;
    margin:auto;
}
.vdosearch {
    width:100%;
    height:25px;
    position:inherit;
    margin-bottom:5px;
    margin-top:5px;
}
.searchbtn {
    width:65px;
    height:26px;
    text-align:center;
    background-image: linear-gradient(to bottom, rgb(65, 61, 61) 0, rgba(78,78,70, 0) 100%);
}
.searchbtn:hover {
    background-color:rgb(67,153,200);
}
.searchbox {
    width:60%;
    height:20px;
    margin-left:60px;
    background-image: linear-gradient(to bottom, rgb(65, 61, 61) 0, rgba(78,78,70, 0) 100%);
}
.docs {
    margin:auto;

}
.vdo_contents {
    width:80%;
    padding:10px;
    height:auto;
}
.brws {
    height:auto;
    background-image: linear-gradient(to bottom, rgb(65, 61, 61) 0, rgba(78,78,70, 0) 100%);
}
.vdo_form {
    width:500px;
    margin:auto;
}
.thide
{
    width:250px;
    display:block;
    float:right;
    margin-right:61px;
    /*margin-bottom:0.0001px;*/
    /*margin:auto;*/
}
.stat {
    width:100%;
    margin:auto;
    text-align:center;
    background-image: linear-gradient(to bottom, rgb(65, 61, 61) 0, rgba(78,78,70, 0) 100%);
}
.keyskl {
    width:81%;
    border-left:2px solid rgb(39, 39, 20);
    padding-left:10px;
    float:left;
}
/*.title {
    float:left;
    width:17%;
    text-align:left;
}*/
.cht {
    width:100% !important;
    height:auto !important;
    background-image: linear-gradient(to bottom, rgb(65, 61, 61) 0, rgba(78,78,70, 0) 100%) !important;

}
.btnstl {
    border-radius:7px;
    width:135px;
    height:35px;
    padding:3px;
    background-image: linear-gradient(to bottom, rgb(65, 61, 61) 0, rgba(78,78,70, 0) 100%);
    color:#fff;
    rotation-point:center;
    pointer-events:painted;
}
.btnstl:hover {
    background:rgb(0,0,0);
    color:#aaa;
}
.btnstl-back {
    border-radius:7px;
    width:60px;
    height:35px;
    padding:3px;
    background-image: linear-gradient(to bottom, rgb(65, 61, 61) 0, rgba(78,78,70, 0) 100%);
    color:#fff;
    rotation-point:center;
    pointer-events:painted;
}
.btnstl-back:hover {
    background:rgb(0,0,0);
    color:#aaa;
}
.postManage {
    width:70%;
    height:auto;
    background-image: linear-gradient(to bottom, rgb(65, 61, 61) 0, rgba(78,78,70, 0) 100%);
    margin:auto;
}
.post-content-left {
 width:60%;
 float:left;

}
.post-content-right {
   width:35%;
   float:right;
}
.secControl {
    color:rgb(26, 26, 26);
}
.NewArticle {
    margin-top:2px;
    background-image: linear-gradient(to bottom, rgb(65, 61, 61) 0, rgba(78,78,70, 0) 100%);
}
.ArticleDetail {
   margin-top:2px;
   background-image: linear-gradient(to bottom, rgb(65, 61, 61) 0, rgba(78,78,70, 0) 100%);
}
.ArticaleImage {
  margin-top:2px;
  background-image: linear-gradient(to bottom, rgb(65, 61, 61) 0, rgba(78,78,70, 0) 100%);
}
.postimg {
    width:90%;
    height:auto;
    margin:auto;
    margin-top:10px

}
/*Mobile version section*/
.amz-ad {
    width:100%;
    margin:auto;
}
.amz-ad-lng {
    display:none;
}
@media (max-width:1567px) {

    .skills {
    top:2550px;
    height: auto;
}
}

@media (max-width:1100px) {
        .advantage .advantage-content .card {
        width: calc(50%-10px);
        margin-bottom:20px;
    }
    .advantage {
    top:1850px;
    height: auto;
}
}
@media (max-width:1024px)
{
.home {
    /*display:flex;*/
    background: url("/Myimages/me.png") no-repeat center !important ;
    height:100vh;
    color:#fff;
    min-height:500px;
    font-family:'Ubuntu',sans-serif;
}
.max-width {
    max-width:800px;
    }

.aboutme .about-content .column {
    width:100%;
    }
.aboutme .about-content .left {
    display:flex;
    justify-content:center;
    margin:0 auto 60px;
    }

.aboutme .about-content .right {
    flex:100%;
    justify-content:center;
    margin:0 auto 60px;
    }
.aboutme .about-content .right .text{
    width:90%;
    /*margin:0 auto 60px;*/
    }
.aboutme .about-content .left img {
    height: 350px;
    width: 350px;
}

.home .home-content .text-1 {
    font-size:20px;
    }
.home .home-content .text-2 {
    font-size:65px;
    font-weight:600;
    margin-left:-3px;
    }
.home .home-content .text-3 {
    font-size:35px;
    margin:5px 0;
    }
.home .home-content .text-3 span{
    color:#e7d981;
    font-weight:500;
    }
    .advantage .advantage-content .card {
        width: 46%;
        margin-bottom:20px;
    }
    .advantage {
    top:2220px;
    height: auto;
}
.skills {
    top:3200px;
    /*height: 700px;*/
}

.amz-ad {
    display:none;
    float:none;
}
.amz-ad-lng {
    display:block;
    width:85%;
    height:auto;
    margin:auto;
    background:#fff;
}
.thide
{
    width:90%;
    float:none;
    margin-right:0px;
    margin-bottom:0px;
    margin:auto;
}
 .login-Content 
{
     /*background-color:#fff;*/
     height:95%;
     width:95%;
}
   .cert {
    width:90%;
}
    .show-menu
    {
        display:block;
    }
    .nav {
       margin:0px 0px 10px;
       margin-top:190px;
       position:fixed;
       width:90%;
       z-index:2;
    }
    .nav ul
    {
        width:100%;
        text-align:center;
        /*background-color:rgb(10,110,178);*/
        background-color:rgb(78,78,78);  
        /*position:static;*/
        display:none;/*has to be none in order for the hamburger menu to work*/ 
             
    }
    .spaceright
    {
        width:100%;
    }
    .nav ul li
    {        
        width:90%;
        margin:auto;  
        float:none; 
        position:relative;
        display:block;
        background-color:rgb(78,78,78);
        /*border-top:1px solid rgb(194, 227, 246);*/
        border-top:1px solid #ff6a00;
        color:rgb(255, 0, 0);
    }
    .nav ul li a
    {       
        width:85%;
        margin-right:0px; 
        display:block;     
        font-size:large;  
    }
    /*.im
    {
        width:70%;
        height:100px;
        margin:auto;

    }*/
 .text-content {
    width:90%;
    float:none;
    padding-right:5px;
    font-family:Arial, Helvetica,sans-serif;
    font-size:12px;
    font-weight:bold;
}
.content-left {
    width:100%; 
    height:auto;   
    float:none;
    margin-top:2px; 
}
.pg {
     width:90%;
}
.message {

    width:90%;
    margin-top:0;
    /*padding:10px;*/
    /*margin-left:39px;*/
    /*border: 3px solid black;*/
}
.mshead {
    background-color:rgb(0, 148, 255);
    padding:7px;
    margin-bottom:5px;
    height:70px;
    color:#fff;
}
.imglong {

    width:100%;
    margin-bottom:20px;
    height:200px;
}
.rightmsg {
    width:100%;
    float:none;
    margin-top:10px;    
}
.leftmsg {
    width:100%;
    float:none;
    margin-top:10px;
}
.Text-area {
    width:98%;
    height:auto;
}
.text-box {
    width:95%;
    height:30px;
}
.text-box-message {
    width:95%;
}
.smb {
    text-decoration:none;
    color:#fff;
    background-color:rgb(61,61,61);
    display:block;
    width:96%;
    text-align:center;
    border-radius: 5px;
    padding:8px;
    /*margin:5px;*/
  }
.loc {
width:90%;
float:none;
margin:auto;
margin-bottom:10px;
}
.contactinf {
        display:none;
}
.pic {
    width:90%;
    height:auto;
    float:none;
    margin:auto;
}
.Thanks {
    width:90%;
    height:auto;
    float:none;
    margin:auto;
}
.contents {
    margin-top:265px;
}
    .sttop {
        position:fixed;
        top:0;
        width:90%;
        background:#fff;
        display: block; 
        z-index:2;
    }
    .logo {
        margin-top:70px;
    }


    /*Home page design*/
.vdoList {
    width:97%;
    height:100px;
    max-height:none;
    background-color:rgb(26, 26, 26);
    float:none;
    margin:auto;
    /*border: 3px solid red;*/
    margin-top:10px;
    
}
.showvdo {
    width:97%;
    max-height:none;
    background-color: rgb(78,78,78);
    float:none;
    margin:auto;
    
    /*margin-top:2px;*/
    /*border: 3px solid white;*/
}
.im {
    float:none;
    margin:auto;
    width:95%;
    height:260px;
}
.aboutme {
    width:93%;
    height:auto;
}
.contactme {
    width:90%;
    margin:auto;
}
.contact-form {
    width:99%;
    float:none;
    margin:auto;    
}
.contact-right {
    width:99%;
    float:none;
    margin:auto;
}
.footerbtn {
    width:95%;
    margin:auto;
}
 .imslide {

     height:450px;
}
.list {
    width:100%;
}
.keyskl {
    width:95%;
    margin:auto;
    border:none;
    padding:0;
    background-image: linear-gradient(to bottom, Gray 0, silver 100%);
    color:#000;
}
.title {
    width:100%;
}
.article-full {
    width:98%;
    padding:7px;
}
}
@media (max-width:1010px) {
    .advantage .advantage-content .card {
        width: calc(50%-15px);
        margin-bottom: 20px;
    }
    .skills {
    display:flex;
    justify-content:center;
    margin:0 auto 60px;
    }
}
@media (max-width:744px) {
            .advantage .advantage-content .card {
        width: 100%;
    }
     .skills {
    top:3450px;
    height: auto;
}
}
@media (max-width:699px) {
            /*.advantage .advantage-content .card {
        width: 100%;
    }*/
     .skills {
    top:3550px;
    height: auto;
}
}
@media (max-width:690px) {
        .advantage .advantage-content .card {
        width: 100%;
    }
}