*{
    padding: 0;
    margin: 0;
}
body{
        background: #666;
        font-family: Poppins, verdana, sans-serif;
        color: #fff;
    }
    h1, h2{
        font-size:  1em;
        text-align:  center;
        color: #fff;
    }
    h1 > span, h2 > span{
        display:  none;
    }
    h1{
        margin: 1em auto;
        font-size: 2em;
    }
    .hideme{
        display:  none;
    }
    main{
            width:  96%;
            border-radius: 1em;
            box-shadow:  0px 0px 6px 0px rgba(0,0,0,0.9);
            min-height:  10em;
            position: relative;
            padding:  .5em;
            background:  rgba(0,0,0,.95);
            display:  none;
            margin: 2% auto;
        }
    @media only screen and (min-width: 900px) {
        main{
            max-width: 60em;
            border-radius: 1em;
            background:  rgba(0,0,0,.9);
            padding:  1em;
        }
    }
    
    #profileImage{
        border-radius: .5em;
        width:  200px;
        display:  block;
        margin:  auto;
    }

    
    @media only screen and (min-width: 900px) {
        #profileImage{
            width:  256px;
            display:  block;
            margin:  auto;
            position: relative;
            left: 1em;
        }
    }
    p, h2{
        text-align: center;
        font-family: poppins, verdana, sans-serif;
        font-size: 1.1em;
        color: #fff;
    }
    h2{
        font-size: 1em;
        font-weight:  normal;
        margin: 2em 0 1em 0;
    }

    a{
        color: inherit;
    }
    .synopsis, #benefits{
        width: 100%;
        margin: 2em auto;
    }

    @media only screen and (min-width: 900px) {
        .synopsis, #benefits{
            margin: 4em auto 2em;
        }

    }

    .synopsis > div > p{
        text-align: left;
        font-size: 1em;
    }
    #benefits > div > h2{
        text-align: left;
        margin: 1em 0;
    }
    @media only screen and (min-width: 900px) {
        .synopsis, #benefits{
            text-align: left;
            font-size: 1em;
            width: 80%;
        }
        #benefits > div > h2{
            margin: 0 0 1em 0;
        }
        
    }
    #copyright{
        font-size: .8em;
        color: #fff;
        margin-top: 5em;
        opacity: .4;
    }
    #myVideo {
      position: fixed;
      right: 0;
      bottom: 0;
      min-width: 100%;
      min-height: 100%;
    }

    .btn{
        display:  block;
        margin:  2em auto 1em auto;
        width:  80%;
    }
    #profile-details{
        margin: 2em 0 0 0;
        padding: 0 0 0 .75em;
    }

    #profile-details li{
        margin: 0;
        padding: 0;
        list-style: none;
        line-height: 1.5;
    }
    #profile-details li i{
        margin-right: .5em;
        font-weight: bold;
    }
    #profile-details li span{
        display: none;
        font-weight: bold;
    }
    @media only screen and (min-width: 900px) {
        #profile-details li{
            list-style: none;
            line-height: 1.5;
        }
        #profile-details li i{
            display: none;
        }
        #profile-details li span{
            display: inline-block;
        }

    }

    #quals{
        margin: 0;
        padding: 0;
        color: #fff;
    }
    #quals li {list-style:  none; line-height: 1.5}
     #quals li i{color:  #fff; margin-right:  1em;}
    @media only screen and (min-width: 900px) {
        #usps{
            margin: 2em 0 0 3.75em;
        }
    }
    #projects ul, #projects ul li {
        margin: 0;
        padding: 0;
        list-style: none;
    }
    #projects ul li {
        line-height: 1.5;
        margin-bottom: .5em;
    }

    #projects ul li i {
        margin-right: .5em;
    }
    footer ul{
        width: 40%;
        margin: auto;
    }
    
    footer ul li{
        list-style: none;
        display: inline-block;
        width: 45%;
    }
    footer ul li span{display: none}
    footer ul li i{
        display: block;
        margin: auto;
    }
    @media only screen and (min-width: 900px) {
        footer{
            padding-top: 2em;
        }
        footer ul{
            width: 40%;
        }
        footer ul li i{
            display: block;
            margin: auto;
            width: 40%;
        }
        footer ul li a{
            display: block;
            margin: auto;
            width: 0;
        }
        footer ul li:last-child a{
            width: 70%;
        }

    }
    hr{width: 80%; margin: auto;}