/* latin */
@font-face {
  font-family: 'Volkhov';
  font-style: normal;
  font-weight: 400;
  src: local('Volkhov Regular'), local('Volkhov-Regular'), url(https://fonts.gstatic.com/s/volkhov/v10/SlGQmQieoJcKemNecTUEhQ.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin */
@font-face {
  font-family: 'Volkhov';
  font-style: normal;
  font-weight: 700;
  src: local('Volkhov Bold'), local('Volkhov-Bold'), url(https://fonts.gstatic.com/s/volkhov/v10/SlGVmQieoJcKemNeeY4hkHNSbQ.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


body{margin:0; padding:0; width:100%; height:auto; font-family: 'Volkhov', serif; font-size:12px;}
#main-body{position:relative; margin:0; padding:0; width:100%; height:auto;}
#content-box{position:relative; width:100%; height:auto; margin:0; padding:0;}
#slider-show{width:100%; height:700px; position:relative; margin:0 auto; transform: translate3d(0,0,0); box-shadow: 0px 1px 5px #999999;}
#slider-show img{position:absolute; border:none; display:none;}
#header-box{position:absolute; left:0; top:0; width:100%; height:80px;  z-index:9; background:none;}
#logo-menu{width:98%; margin:0 auto 0 auto; height:80px;  position:relative; }
#com-logo{width:140px; margin-top:2px; }
#clogo{width:135px; margin-top:8px;}
#com-menu{float:right;  position:absolute; top:20px; right:2px;}
.buttons{display:block;}
#openbtn,#closebtn {font-size: 30px; cursor: pointer;  color: #fff; text-decoration:none; border: none; font-weight:700; border:none;}
#closebtn{ position:absolute; right:10px; top:20px;}
#sidebar{display:none; width:100%; height:100%; background:#5c4bf5; position:fixed; right:0; top:0; transition:4.5s;}
#menu-ul{margin:80px 0 0 30px; padding:0; list-style:none; }
.menu-li{display:block; width:auto; height:35px; padding:20px 0 40px 0; color:#fff; font-size:14px; cursor:pointer; text-align:center;}
.menu-ref{color:#fff; text-decoration:none; font-size:14px; font-weight:700; text-align:center;}
.menu-ref:hover{text-decoration:underline; color:#eded03;}
#intro-box{position:relative; width:100%; min-height:400px; height:auto; margin:0; padding:0;background: #5c4bf5;}
#com-intro{width:90%; margin:0 auto 0 auto; padding:50px 0 50px 0; height:auto;}
.com-about{display:block;  width:98%;  min-height:400px; height:auto;}
.about-content{display:block; width:95%; margin:20px auto 20px auto; padding:20px 0 20px 0; }
.intro-header{margin:20px 0 40px 0; padding:0 0 20px 0; color:#fff; font-size:18px; font-weight:400; text-align:center;}
.alpha{color:#eded03;}
.beta{color:#5c4bf5;}
.intro-para{margin:40px 0 0 0; padding:0; color:#fff; font-size:14px; font-weight:400; text-align:center;}
.vis-mis{display:block; position:relative; margin:10px auto 20px auto; }
.vm-img,.vm-content{width:100%;}
.vm-pic{display:block; margin:10px auto 10px auto;}
.vm-header{margin:5px auto 5px auto; padding:0;font-size:18px;color:#F1DB00; text-align:center;  font-weight:400; letter-spacing:1px;  }
.vm-para{margin:20px auto 20px auto; padding:0; width:85%; color:#fff; font-size:14px; text-align:center;}
#serv-box{width:100%; min-height:400px; height:auto; position:relative; margin:0 auto 0 auto; padding:30px 0 30px 0; background:#e5e5e5;}
#com-services{width:90%; margin:0 auto 0 auto; position:relative; height:auto;}
.serv{color:#e5d000; text-align:center; font-size:18px;}
.serv-para{text-align:center; color:#222; width:90%; margin:10px auto 10px auto; padding:0 0 20px 0; font-size:14px;}
.servs{color:#1d2a3b; text-align:center; font-size:16px;}
.our-servs{display:block; margin:10px auto 0 auto; padding:0;  width:100%; min-height:200px; height:auto;}
.serv-img{width:100%;}
.serv-pic{display:block; width:100%;margin:0 auto 0 auto; border-radius:5%; box-shadow: 0px 2px 7px 2px rgba(173,163,161,0.81); object-fit:cover;}
.read-more{display:block; margin:20px auto 20px auto; width:140px; height:auto; background:#1d2a3b; color:#fff; text-align:center;
text-decoration:none; padding:7px 0; font-size:16px; font-weight:700; border-radius:4px; box-shadow: 0px 2px 7px 2px rgba(173,163,161,0.41);}
#career-box{position:relative; width:100%; height:auto; margin:0 auto 0 auto; padding:30px 0 30px 0;}
.carr{text-align:center; color:#222;}
.rmc{width:200px; padding:10px 0; background:#eded03;}

/*link-pages css*/
#ref-page{position:relative; width:100%; min-height:700px; height:auto; margin:0; padding:0;}
#ref-page-box{width:90%; margin:20px auto 0 auto; padding:20px 0 20px 0; height:auto; }
.page-ul{margin:0 0 20px 0; padding:0 0 20px 0;}
.list-header{ margin:0; padding:0;font-size:18px;}
.page-li{margin:10px 0 0 30px; padding:0; font-size:14px; color:#444;}
.list-black{color:#222; font-weight:700;}
.contact-box,.contact-form{display:block; width:100%; margin:10px auto 10px auto; padding:0;  min-height:200px; height:auto;}
.add-box{display:block; width:90%; margin:0 auto 0 auto; padding:0; }
.page-header{margin:0; padding:10px 0 10px 0; font-size:18px; color:#000; }
.sub{color:#5c4bf5;}
.psub{color:#555; font-size:12px;}
.italic{font-style:italic; color:#5c4bf5; font-size:14px;}
.fm{text-align:left; font-size:150%;}
.page-para{margin:0; padding:10px 0 10px 0; font-size:14px; color:#444;}
.form-box{width:90%; margin:10px auto 10px auto; padding:30px 0 10px 0; height:auto; display:block; }
#cnt-name,#cnt-email{width:100%;height:40px; border:none; border-bottom:1px solid #c6d0d6;font-family: 'Volkhov', serif;}
#cnt-text{resize:none; width:100%; height:100px;border:none; border-bottom:1px solid #c6d0d6;font-family: 'Volkhov', serif; font-size:120%;}
#name-err,#email-err,#text-err{margin:0; padding:0; color:#ff0000;font-size:12px;  height:13px;}
#thank-you{margin:0; padding:0; color:#41a317; font-size:12px; display:block; text-align:center; font-weight:500;}
#cnt-submit{margin-top:10px; display:block;width:140px;height:43px; color:#fff; font-weight:700; font-size:14px; cursor:pointer;
background:#5c4bf5; outline:none;border:none; box-shadow: 0px 2px 7px 2px rgba(173,163,161,0.31); border-radius:3px; margin:0 auto 0 auto;}


#footer-box{width:100%; height:auto;  position:relative;color:#eded03; font-size:12px; margin:0; padding:0; background:#1d2a3b; }
.copy-text{ font-size:12px;  color:#eded03;text-align:center; display:block; margin:0 auto 0 auto; padding:7px 0;}

/*slider*/
#ninja-slider { width:100%; background:#FFF; padding: 0!important; margin:0; overflow:hidden; box-sizing:border-box; }
#ninja-slider .slider-inner { margin:0; font-size:0px; position:relative; box-sizing:border-box;}
#ninja-slider ul {position:relative; list-style:none; padding:0; box-sizing:border-box; background:black; }
#ninja-slider li {width:100%;height:100%;;top:0;left:0;position: absolute;font-size:12px;list-style:none;margin:0;padding:0;opacity:0; overflow:hidden;
    box-sizing:border-box;}
#ninja-slider li.ns-show { opacity:1;}
/* --------- slider image ------- */
#ninja-slider .ns-img { background-color:rgba(0,0,0,0.8); background-size:contain; cursor:default; display:block; position: absolute; width:100%;
    height:100%; background-repeat:no-repeat; background-position:center center;}
/*---------- Captions -------------------*/
#ninja-slider .caption { font-size:140%;position:absolute;  top: 60%;  left: 0; width:100%; transform: translate(-50%, -50%); color:#fff; text-align:center;}
#ninja-slider li.ns-show .caption {-webkit-animation: titleAnimation 5s linear both; animation: titleAnimation 5s linear both;}
#ninja-slider li.sl-0 .caption { -webkit-animation: none; animation: none; display:none;}
@keyframes titleAnimation {	0% { opacity:0; }	10% { opacity:0;transform: translateY(-20%);}	20% { opacity:1;transform: translateY(0%);}
	70% {opacity:1;transform: translateY(0%);}	80% {opacity:0;transform: translateY(100%);}	100% {opacity:0;transform: translateY(100%);}}
@-webkit-keyframes titleAnimation {	0% { opacity:0; }	10% { opacity:0; -webkit-transform:translateY(-20%);}	25% { opacity:1; -webkit-transform:translateY(0%);}
	70% {opacity:1; -webkit-transform:translateY(0%);}	80% {opacity:0; -webkit-transform:translateY(100%);}	100% {opacity:0; -webkit-transform:translateY(100%);}}



@media only screen and (min-width:580px)
 {
#ninja-slider .caption { font-size:180%; top:55%;}
#com-logo,#clogo{width:140px;}
.add-box{width:50%;}
.fm{text-align:center;}
.page-header{font-size:20px;}
.page-para{font-size:14px;}
 }
 @media only screen and (min-width:768px)
 {
#ninja-slider .caption { font-size:250%; top:52%;}
#com-logo,#clogo{width:155px;}
.menu-ref{font-size:16px;}
.intro-header,.vm-header,.serv{font-size:20px;}
.intro-para,.vm-para,.serv-para,.servs{font-size:16px;}
#com-services{width:98%;}
.our-servs{display:inline-block; vertical-align: top; width:49%; }
.serv-pic{width:350px;}
.add-box{width:90%;}
.page-header{font-size:20px;}
.page-para{font-size:16px;}
.contact-box{display:inline-block; vertical-align: top; width:49%; }
 }
 @media only screen and (min-width:992px)
 {
#ninja-slider .caption { font-size:300%; top:48%;}
#sidebar{display:block; position:absolute; box-shadow:none; right:0; top:0px; width:700px; }
   #menu-ul{margin:0; float:right;}
   .menu-li{display:inline-block; margin:0 10px 0 10px; padding:10px; font-size:16px; }
   .buttons,#closebtn{display:none;}
#logo-menu{width:90%;}
#com-logo{width:200px; margin-top:0;}
#clogo{width:200px; margin-top:3px;}
.intro-header,.vm-header,.serv{font-size:22px;}
.intro-para,.vm-para,.serv-para,.servs{font-size:16px;}
.serv-pic{width:400px;}
.com-about{display:inline-block; vertical-align:top; width:49%;}
#com-services{width:90%;}
.add-box{width:60%;}
.form-box{width:50%;}
#cnt-name,#cnt-email,#cnt-text{width:100%;}
.fm{text-align:center; font-size:24px;}

 }
 @media only screen and (min-width:1200px)
 {
   #ninja-slider .caption { font-size:400%;}
   .menu-ref{font-size:18px;}
   .intro-header,.vm-header,.serv{font-size:24px;}
.intro-para,.vm-para,.serv-para,.servs{font-size:18px;}
   .page-header{font-size:24px;}
   .page-para{font-size:16px;}
   .psub{color:#555; font-size:14px;}
   .italic{font-size:16px;}

 }
 @media only screen and (min-width:1600px)
{
#ninja-slider .caption { font-size:450%;}

 }
