@charset "utf-8";
/* CSS Document */

@font-face {
  font-family: "ec";
  src: url("ethnocentric rg.ttf");
  }

@font-face {
    font-family: "Roboto";
    src: url("Roboto-Regular.ttf");
}
@font-face {
    font-family: "Roboto";
    src: url("Roboto-Bold.ttf");
    font-weight: bold;
}

@font-face {
    font-family: "Asap";
    src: url("Asap-Regular.ttf");
}
@font-face {
    font-family: "Asap";
    src: url("Asap-Bold.ttf");
    font-weight: bold;
}

body { font-family:Roboto !important; }

.ec { font-family:ec;  }
.Asap { font-family:Asap; }
.close_bt { width:45px; top:-15px; right:-10px; }

#tak_link { width:5px; height:5px; }

.htk { height:calc(100% - 125px); }
.top_veil { top:0px; background-color:rgba(225,225,225,0.65); }
.bot_veil { background-color:rgba(0,0,0,0.75); }
.t8 { font-size:8px; }
.pt4 { padding-top:4px; }
.w5000p { width:100%; }

.xbg5 { background-color:#aaff85; }
.xbg7 { background-color:#F94242; }
.xbg8 { background-color:#C31616; }

.xbs7 { box-shadow:0px -2px 7px inset #AE0A0A; }
.xbs8 { box-shadow:  0px -2px 12px inset #454545; }

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

	}

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

	.w5000p { width:50%; }
	.xbs8 { box-shadow:  0px -5px 25px inset #454545; }

	}

/* width */
::-webkit-scrollbar {
  width: 4px !important;
}

/* Track */
::-webkit-scrollbar-track {
  background-color:rgba(0,0,0,0.75) !important;
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: #252525 !important;  
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #000000 !important; 
}

.tk_grid {
  max-height:100vh;
  grid-template-columns: 25% 75%;
  grid-template-rows: 45px 1fr 45px auto; 
  grid-template-areas: 
           "header header" 
           "nav main"
           "sub sub"
         }

@media only screen and (max-width: 700px) {
  
  .menu_list {
    grid-template-columns:1fr 1fr 1fr 1fr 1fr;
    background-color:#151515;
    border-radius:5px;
    }

  .contact_listb {
    grid-template-columns: 1fr;
    grid-column-gap: 1%;
    grid-row-gap: 2px;
    }

  .tk_grid {
    grid-template-columns:1fr;
    grid-template-rows: 45px 1fr; 
    grid-template-areas: 
    "header"
    "main";
    }

    .main {overflow-y:visible !important; }
    #nav { position:fixed; bottom:45px; width: 100%; height:10vh; }
    #sub { position:fixed; bottom:0px; width:100%; height:45px; }

  .close_bt { right:0% !important; }

  .nav_option { background-color:#101010 !important; }
  
  }

#header { grid-area: header; background-color:#202020; }
.main { grid-area: main; }
#nav { grid-area: nav; }
#sub { grid-area: sub; }

#logo_sub { bottom:-5px; }

.nav_option { background-color:rgba(0,0,0,0.75); border-bottom:#FFFFFF; }
.nav_option:hover { box-shadow: 0px -1px 1px red inset; }

#tool_0 { border-bottom:1px solid red; }

.showperc { top:47%; }
.item { margin-top:-5px; }
.icon_id { font-size:12px !important; }