/* custom TBX CSS  */
body{background:#000000;  overflow:hidden;}
.tm-logo img{
    height: 50px;
    width: auto;
    float: left;
    position: relative;
    top: 60px;
    left: 60px;
    z-index: 1;}

.tm-navbar, .tm-headerbar {
position:absolute; top:0px; z-index:9999 !important;
    margin-top: 0px!important;
margin-bottom: 0px!important;
    width: 100%;
transition: height 0.2s ease-in-out, line-height 0.2s ease-in-out;
}
.tm-navbar-small{height:60px;}
/*---------------offcanvas toggle------------------*/
.toggle{position:absolute; top:60px; right:60px;}

.tm-icon-menu {
    background: #eeeeee;
	z-index:999;
		float:right;
	right:30px;
	top:30px;
}
.tm-icon {
    display: block;
    width: 70px;
    height: 70px;
    position: relative;
    z-index: 999;

}
.tm-overlay-toggle{}
[class*='tm-icon-'] {
    position: absolute;
    left: 22px;
    width: 25px;
    height: 3px;
}

.tm-icon-menu:before {
    -webkit-transform: translateY(-300%);
    transform: translateY(-300%);
}
.tm-icon-menu:after {
    -webkit-transform: translateY(300%);
    transform: translateY(300%);
}

[class*='tm-icon-']:before, [class*='tm-icon-']:after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background: #eeeeee;
    -webkit-transition: all 0.2s cubic-bezier(0, 0.99, 0.2, 1);
    transition: all 0.2s cubic-bezier(0, 0.99, 0.2, 1);
}
:hover > .tm-icon-menu:before {
  -webkit-transform: translateY(0) rotate(90deg);
  transform: translateY(0) rotate(90deg);
}
:hover > .tm-icon-menu:after {
  -webkit-transform: translateY(0) rotate(-90deg);
  transform: translateY(0) rotate(-90deg);
}

.tm-icon-close:before {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.tm-icon-close:after {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
:hover > .tm-icon-close:after,
:hover > .tm-icon-close:before {
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
}
.tm-modal-close {
  position: absolute;
    top: 0px;
    right: -20px;
}
@media (max-width:767px){
.toggle{right:0px; top:50px; position:fixed;}
.tm-icon-menu {right:0px;}
}

.uk-navbar.uk-visible-small > .uk-flex-space-between {   
-webkit-justify-content: flex-end;  
justify-content: flex-end;   
}

/*---------------end of offcanvas toggle------------------*/
/*-----------------offcanvas menu toggle customization---------------*/
.uk-navbar-toggle{margin-left:40px; color:#ffffff; font-size:50px;}
.uk-navbar-toggle:hover{color:#ffffff;}
@media (max-width: 767px){
.uk-navbar-toggle{font-size:36px; margin-left:25px;}
}
/*-----------------end of offcanvas menu toggle---------------*/

.uk-nav > li > a {
    font-size: 18px;
	text-align:center;
	border-bottom: 1px solid rgba(255,255,255,0.07);
	border-top: 1px solid rgba(0,0,0,0.8);
}
ul .uk-nav.uk-nav-offcanvas{margin-top:30px;}
.uk-nav-offcanvas ul a{font-size: 18px;
    line-height: 27px;}
html:not(.uk-touch) .uk-nav-offcanvas ul a:hover {
    color: #ddd;
}

ul.uk-nav-sub {
    padding: 5px 0 5px 0px;
    text-align: center;
}
/*.tm-top-a{top: -150px;
    position: relative;z-index:-1;}
.tm-top-b, #tm-bottom-a, #tm-bottom-b{position: relative;top: -150px;}*/
#tm-bottom-b{background:#101010;}
#tm-bottom-b .uk-panel{margin:30px 0px;}
#tm-footer {position:relative; background:#000;margin:0 auto; padding:70px; bottom:0px; border-top: 1px solid rgba(255,255,255,0.1);}
.uk-panel-title {text-transform:uppercase;}
.tm-totop-scroller {
right:0;left:0; top:-30px; margin:0 auto; padding:20px; background:#000; border-top: 1px solid rgba(255,255,255,0.1);}


/*----------smooth scroll anchor bar----------------*/
.tm-smoothscroll-bar {
    z-index: 990;
	    position: fixed;
    top: 50%;
    right: 0;
    margin-right: 20px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);

}
.tm-smoothscroll-bar ul{padding-left:5px; 	text-align:center;}
.tm-smoothscroll-bar ul li{list-style:none;padding:5px; 	text-align:center; }
.tm-smoothscroll-bar ul li a{color:rgba(255,255,255,0.4); font-size:22px;
-webkit-transition: color 0.2s, font-size 0.2s;
       -moz-transition: color 0.2s, font-size 0.2s;
         -o-transition: color 0.2s, font-size 0.2s;
            transition: color 0.2s, font-size 0.2s;
	}
.tm-smoothscroll-bar ul li a:hover{color:rgba(255,255,255,0.9); font-size:25px; }
.tm-smoothscroll-bar span {
    display: none;
}
.tm-smoothscroll-bar li:hover > span {
    position: absolute;
    overflow: inherit;
    display: block;
    right: 40px;
    width: inherit;
    height: 20px;
    margin-top: -24px;
    padding: 5px 10px;
    border-radius: 2px;
    background: #f58020;
    color: #ffffff;
    text-indent: 0;
}
.tm-smoothscroll-bar li:hover > span:after {
    content: '';
    position: absolute;
    left: 100%;
    width: 0px;
    height: 0px;
    margin-top: 6px;
    margin-right: 35px;
    border-width: 5px 0 5px 5px;
    border-style: solid;
    border-color: transparent transparent transparent #f58020;
}

.tm-smoothscroll-bar ul li a.uk-active {color:#fff;}
@media (max-width:767px){
.tm-smoothscroll-bar {
    right: 0;
    margin-right: 0px;
}}
/*----------end of smooth scroll anchor bar----------------*/

/*---------------spotlight menu right------------------
@media screen and (min-width: 768px){
#roundmenu {display:none;
}
.show{position:fixed; top: 60px; right:60px;}
.show i {color:#ffffff;}
.show:hover i {color:#000000;}
#roundmenu{width:10px; 
height:10px;
 border-radius: 50%; 
  position: absolute;
    z-index: 85;
    right: -210px;
	opacity:0;
	display:block;
    top: -180px;color:#000000;
	background:#ffffff;
	    -webkit-transition-property: width, height; 
    -webkit-transition-duration: 0.1s; 
    transition-property: width, height;
    transition-duration: 0.1s;}
.show:hover > #roundmenu {opacity:1;
    width: 400px;
    height:400px;
  	box-shadow: 0px 0px 20px 20px #ffffff;
}

#roundmenu.uk-nav{position:relative; top:250px; right:300px;}
.rightmenu{
	position: relative;
    top: 175px;
    float: right;
    text-align: right;
    right: 200px;
	text-transform:uppercase;
}
.rightmenu a h4{font-size:20px;
	line-height:12px; color:#000000;
	-webkit-transition: color 0.2s ;
       -moz-transition: color 0.2s ;
         -o-transition: color 0.2s;
            transition: color 0.2s ;}
.rightmenu a:hover h4 {color:#f58020;}
.uk-nav > li > a {}
}*/

/*--------------- end of spotlight menu right------------------*/
@media (min-width: 1220px){
.uk-grid + .uk-grid, .uk-grid-margin, .uk-grid > * > .uk-panel + .uk-panel {
    margin-top: 0px;
}}
.uk-grid + .uk-grid, .uk-grid-margin, .uk-grid > * > .uk-panel + .uk-panel {
    margin-top: 0px;
}

.uk-nav.uk-nav-offcanvas > li.uk-active > a {
    background: rgba(0, 0, 0, 0.82);
    color: #999999 !important;}
.uk-nav.uk-nav-offcanvas > li.uk-active > a:hover{
color:#f58020 !important;}


.uk-nav-offcanvas > .uk-open > a, 
html:not(.uk-touch) .uk-nav-offcanvas > li > a:hover, 
html:not(.uk-touch) .uk-nav-offcanvas > li > a:focus {
    background: rgba(13, 13, 13, 0.82);
    color: #ededed;
    outline: none;}

/*-------------animated logo--------------*/
img.firstbox {position:relative; top:-12px; left:25px;}
img.box {position:relative; top:25px; right:42px;}
@media (max-width:664px){
.resp-logo {max-width:100%; height;auto; display:block;}
.resp-logo img{max-width:100%}
img.firstbox{width:13.5%;top:-5px; left:3%}
img.tech{width:55.8%;}
img.box{width:22%; right:4.5%; top:12px;}
}
/*-------------end of animated logo--------------*/
.uk-article{padding:60px;}
@media (max-width:767px){
.uk-article, .uk-panel-space {padding:30px;}
h1, .uk-h1 {
    font-size: 25px;
    line-height: 30px;
}
}


.uk-panel-space {
    padding: 70px;
}
.frontpage-services-left{width:50%; float:left; position:absolute;  top:25%;left:5%;text-align:left;background:rgba(0,0,0,0.5);padding:30px;}
.frontpage-services-right{width:50%; float:right; position:absolute;  top:25%;right:10%;text-align:right;background:rgba(0,0,0,0.5);padding:30px;}
.frontpage-services-left h3, .frontpage-services-right h3{color:#f58020;letter-spacing: 3px;text-transform:uppercase; }
.frontpage-services-left h2, .frontpage-services-right h2, .frontpage-services-left p, .frontpage-services-right p{color:#ffffff; }
.frontpage-services-left p{border-left:3px solid #f58020;padding-left:15px;}
.frontpage-services-right p{border-right:3px solid #f58020;padding-right:15px;}


@media (max-width: 1118px){
.frontpage-services-left h2,.frontpage-services-right h2 {font-size:40px; line-height:normal;}
.frontpage-services-left h3, .frontpage-services-right h3{font-size:20px; letter-spacing: 1.5px;line-height:normal;}
@media (max-width: 894px){
.frontpage-services-left h2,.frontpage-services-right h2 {font-size:30px; line-height:normal;}
.frontpage-services-left h3, .frontpage-services-right h3{font-size:18px; letter-spacing: 1.5px;line-height:normal;}
.frontpage-services-left p, .frontpage-services-right p{font-size:13px;line-height:normal;}
.frontpage-services-left{width:70%; float:left; position:absolute;  top:10%;left:5%;text-align:left;background:rgba(0,0,0,0.5);padding:20px;}
.frontpage-services-right{width:70%; float:right; position:absolute;  top:10%;right:5%;text-align:right;background:rgba(0,0,0,0.5);padding:20px;}
.fullheight > div > div > figure > img{height:100vh; width:100%;object-fit: cover;}}
@media (max-width: 430px){
.frontpage-services-left h2,.frontpage-services-right h2 {font-size:25px; line-height:normal;}
.frontpage-services-left h3, .frontpage-services-right h3{font-size:16px; letter-spacing: 1.5px;line-height:normal;}
.frontpage-services-left p, .frontpage-services-right p{font-size:13px;line-height:normal;}
.frontpage-services-left{width:80%; float:left; position:absolute; left:5%; }
.frontpage-services-right{width:80%; float:right; position:absolute;right:5%; }}