/* --------------------------------------------------------

Template Name: henry – Personal Portfolio & landing page HTML Template
Description: Personal Portfolio & landing page html5 template
Author: kingsley
Author URI: https://themeforest.net/user/kwerum
Version: 1.0

-----------------------------------------------------------
Table of Contents
===========================================================
    1. Default CSS
       1.2 Google Fonts
       
 
-------------------------------------------------------- */


/* 1.2 Google Fonts */
@import url('https://fonts.google.com/specimen/Roboto+Mono?category=Monospace');
@import url('https://fonts.googleapis.com/css?family=Mulish');
@import url('https://fonts.googleapis.com/css?family=Poppins:wght@300');

:root{
    --header-font: 'Monospace';
    --text-font: 'Monospace';
    --nav-font: 'Monospace';
    --primary-color: rgba(97,205,50,1);
    --secondary-color: rgba(65,67,69,1);
    --dark-color: rgba(35,37,38,1);
    --white-color: #fff;
}


::-moz-scrollbar {width: 1em;background: rgba(0,0,0,.9);}
::-o-scrollbar {width: 1em;background: rgba(0,0,0,.9);}
::-ms-scrollbar {width: 1em;background: rgba(0,0,0,.9);}
::-webkit-scrollbar {width: 1em;background: rgba(0,0,0,.9);}
::scrollbar {width: 1em;background: rgba(0,0,0,.9);}

::-moz-scrollbar-track {box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);}
::-webkit-scrollbar-track {box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);}
::-ms-scrollbar-track {box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);}
::-o-scrollbar-track {box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);}
::scrollbar-track {box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);}

::-moz-scrollbar-thumb {background-color: rgba(97,205,50,.8);outline: 1px solid slategrey;} 
::-ms-scrollbar-thumb {background-color: rgba(97,205,50,.8);outline: 1px solid slategrey;} 
::-webkit-scrollbar-thumb {background-color: rgba(97,205,50,.8);outline: 1px solid slategrey;} 
::-o-scrollbar-thumb {background-color: rgba(97,205,50,.8);outline: 1px solid slategrey;} 
::scrollbar-thumb {background-color: rgba(97,205,50,.8);outline: 1px solid slategrey;} 

        ::selection{background: lightgrey;}
        ::-webkit-selection{background: lightgrey;}
        ::-o-selection{background: lightgrey;}
        ::-moz-selection{background: lightgrey;}
        ::-ms-selection{background: lightgrey;}

/* dark rgba(52,58,64,1)*/


        *{margin:0;padding:0;}
    body, header, section, main, footer {width: 100%;-webkit-font-family:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;-moz-font-family:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;-o-font-family:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;-ms-font-family:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;font-family:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;}
    i{cursor: pointer;}
p{font-family:'poppins',serif;-webkit-font-family:'poppins',serif;-o-font-family:'poppins',serif;-ms-font-family:'poppins',serif;-moz-font-family:'poppins',serif;letter-spacing: 0.15em;}
h1{-webkit-font-size: 4em;-moz-font-size: 4em;-ms-font-size: 4em;-o-font-size: 4em;font-size: 4em;}
li{-webkit-list-style-type: none;-ms-list-style-type: none;-moz-list-style-type: none;-o-list-style-type: none;list-style-type: none;}
    button, .a_btn{cursor: pointer;-webkit-outline: none;-ms-outline: none;-moz-outline: none;-o-outline: none;outline: none;background: transparent;border: 2px solid rgba(97,205,50,1);color:white;border-radius: 100px;-webkit-transition: .8s ease-in-out;-o-transition: .8s ease-in-out;-moz-transition: .8s ease-in-out;-ms-transition: .8s ease-in-out;transition: .8s ease-in-out;font-weight: 600;}
button:active, .a_btn:active{-webkit-outline: none;-ms-outline: none;-moz-outline: none;-o-outline: none;outline: none;}
    button:hover, .a_btn:hover{background: rgba(38,43,43,1);color: rgba(97,205,50,1);}
    img{   -webkit-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    -ms-user-select: none;
        user-select: none;cursor:auto;}
body{min-height: 100vh;}
body, .contact-me div {background: -webkit-repeating-linear-gradient(-45deg, rgba(38,43,43,1), rgba(38,43,43,1) 3px, rgba(54,58,58,1) 3px, rgba(54,58,58,1) 6px);background: -ms-repeating-linear-gradient(-45deg, rgba(38,43,43,1), rgba(38,43,43,1) 3px, rgba(54,58,58,1) 3px, rgba(54,58,58,1) 6px);background: -moz-repeating-linear-gradient(-45deg, rgba(38,43,43,1), rgba(38,43,43,1) 3px, rgba(54,58,58,1) 3px, rgba(54,58,58,1) 6px);background: -o-repeating-linear-gradient(-45deg, rgba(38,43,43,1), rgba(38,43,43,1) 3px, rgba(54,58,58,1) 3px, rgba(54,58,58,1) 6px);background: repeating-linear-gradient(-45deg, rgba(38,43,43,1), rgba(38,43,43,1) 3px, rgba(54,58,58,1) 3px, rgba(54,58,58,1) 6px);}   





footer{min-height: 70vh;background: rgba(38,43,43,1);margin-top:0;text-align: center;color: white;}
footer div{width:100%;margin: 5vh auto 0 auto;text-align: center;padding: 0 10vw;}
footer div div a{display: block;color: white;text-decoration: none;transition: .8s ease;}
footer div div a:hover{color:rgba(97,205,50,1);text-decoration: none;}
footer div div i{display: block;color: rgba(97,205,50,1);font-size: 2em;margin-bottom: 30px;}
footer div button{outline: none;box-shadow: none;}
footer div button:active{outline: none;}
footer small{width: 100%;text-align: center;bottom:0;left: 0; padding: 15px 0;border-top:1px solid rgba(0,0,0,.6);margin-top: 10vh;}
footer b{color: rgba(97,205,50,1);}
.mo{background: rgba(38,43,43,1);position: absolute;margin-top: -90px;left: 0;width: 100%;height: 75px;transition: 4.5s ease;}
.dr{width: 60%;}
.green::before{content: '';position: absolute;width: 100%;height: 40px;background: -webkit-linear-gradient(to top, rgba(97,205,50,.8),1%, transparent);background: -o-linear-gradient(to top, rgba(97,205,50,.8),1%, transparent);background: -moz-linear-gradient(to top, rgba(97,205,50,.8),1%, transparent);background: linear-gradient(to top, rgba(97,205,50,.8),1%, transparent);background: -ms-linear-gradient(to top, rgba(97,205,50,.8),1%, transparent);margin: -40px 0 0 0;}

footer div small b{position: relative;padding:0vh 0 0vh 0;display: block}
footer div small b a{text-decoration: none;color: grey;}
footer div small b a:hover{color: rgba(97,205,50,1);}
footer div small b a i{margin: 0 1vw;}
