body {
 font-family: 'Asap Condensed', sans-serif;
 overflow-x:hidden;
 background:url("../images/portbackground.png") center top no-repeat fixed;
 color:black;
 letter-spacing:1.3px;
}

button:focus {outline: none;}

.tagline1{ font-family: 'Grand Hotel', cursive; color:black; font-size: 25px; }
.tagline{ font-family: 'Grand Hotel', cursive; color:black; font-size: 25px; }

.tagline p{
  margin: 10px 0 0 10px;
  white-space: nowrap;
  overflow: hidden;
  width: 32em;
  animation: type 8s steps(60, end); 
}

.tagline p:nth-child(2){
  animation: type2 8s steps(60, end);
}
@keyframes type{ 
  from { width: 0; } 
} 

@keyframes type2{
  0%{width: 0;}
  50%{width: 0;}
  100%{ width: 100; } 
} 

@keyframes blink{
  to{opacity: .0;}
}

/***side nav****/
.white{color:white !important;}
.menu{ font-size:16px; cursor:pointer; color:#685d5d; background-color:black;padding:5px 10px; z-index:998; margin:20px; position:fixed; right:0; letter-spacing:3px;}

.menu:hover{color:white;}

.sidenav {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 999;
  top: 0;
  right: 0;
  background-color: #111111ed;
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 80px;
}

.sidenav a {
  padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-size: 16px;
  color: #818181;
  display: block;
  transition: 0.3s;
  letter-spacing: 3px;
}

.sidenav a:hover {
  color: #f1f1f1;
}

.sidenav .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 36px;
  margin-left: 50px;
}

@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 16px;letter-spacing: 3px;}
}

/*****banner****/

#banner img{height:auto;width:100%;}
#banner {margin-top:0;}

/**** * ****/
.heading a {background-color:black; color:white; border-radius:15px; font-size:16px;  padding:9px 25px;text-align:center; border:1px solid white;text-decoration:none;letter-spacing: 3px;}

.heading img{width:60px;height:auto;}
.heading1 img{width:60px;height:auto;}
.head-category img{width:58%;}

.ser-head a{color:white;font-size:14px; letter-spacing:2px; text-decoration:none;}
.ser-head {background-color:black; color:white; width:59%; text-align:center; border-radius:50px;padding:2px 0px;}
.ser-head img{width:60px;height:auto;}

/***********/
#index-background {margin-top:-101px; 
background:url("../images/BACKGROUND.jpg") center top no-repeat fixed;
color:white; 
padding-bottom:40px;
 background-size: cover;   
}

#index-services a{text-decoration:none;}

#index-services img{height:auto;width:100px;margin:15px;}

.box{padding:5px; margin:10px 0;cursor:pointer;height:140px; }

/*#index-services a p{background-color:black; color:white; border-radius:50px; font-size:14px;  padding:5px 22px;margin:10px 26px;text-align:center; letter-spacing:2px;}*/


/***** index about for mobile view***/
#mobile-about{display:none;}
#mobile-about p {color:black;}

/*************/

.carousel-wrap {
  margin: 50px auto;
  padding: 0 5%;
  width: 80%;
  position: relative;
}

/* fix blank or flashing items on carousel */
.owl-carousel .item {
  position: relative;
  z-index: 100; 
  -webkit-backface-visibility: hidden; 
}

/* end fix */
.owl-nav > div {
  margin-top: -26px;
  position: absolute;
  top: 50%;
  color: #cdcbcd;
}

.owl-nav i {
  font-size: 52px;
}

.owl-nav .owl-prev {
  left: -30px;
}

.owl-nav .owl-next {
  right: -30px;
}

/**** copyright******/

#copyright { padding:5px;
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  background-color: black;
  color: white;
  text-align: center;
  z-index:999999;
  font-size:12px;
  letter-spacing:2px;
}

/***portfolio********/
.port-details img{width:51%;}


.btn-name {
    width: 138px;
    height: 35px;
    background-color: #1c1b17;
    color: white;
    border: 1px solid white;
    margin-top: 8px;
    margin-left: -14px;
    z-index: -1;
    border-radius: 12px;}
    
  .btn-name h6{ font-weight:bold;}
  
/***********/

.tab-box{background-color:#fdfdfd6b; }
#category .tab-content {border:2px solid white; border-top:none; }

#category .tab-menu img{width:60px;}
#category .tab-pane img{width:100%; height:165px;}
#category .tab-pane{background-color: #969a9b;}
#category .nav-tabs a{color:black;}


#category .nav-link {
    background-color: #bbb;
        padding: 0 1rem;
    border: 2px solid #9a9e9f;
        
    border-bottom: none;
}
#category .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active
{
   color: black;
   background-color: #969a9b !important;
   
   border:2px solid white !important;
   border-bottom-color:transparent;
   margin-bottom:-2px;
   border-bottom:none !important;
}

.tab-menu p {
    margin-top: 0;
    margin-bottom: 0.5rem;
    text-align:center;
}

.nav-tabs .nav-link { border: 0px solid transparent;  }

.nav-tabs {  border-bottom: 2px solid white;}

.nav-tabs .nav-item {  margin-bottom: 0px;}

/*************contact us**********/

.addr p{padding-left:34px;margin-top:-25px; color:black;}
.contact-details .form-control{background-color:#e1dfdf; border:0px solid;}
.contact-details label {font-size:12px;}
.contact-info i{color:#353534;}
.bcolor{font-weight:bold;}

.box1 img{width:100%;}

/*** go to back ***/

.go-to-back .btn{

	position: fixed; 
	bottom: 50px; 
	right: 21px; 
	z-index: 9999; 
	border: 1px solid white; 
	outline: none; 
	background-color: black; 
	color: white; 
	cursor: pointer; 
	border-radius: 50px; 
	font-size: 18px;
	height:40px;
	width:40px;}


/*****media queries**********/

@media only screen and (max-width:1920px){
}
@media only screen and (max-width:1366px){
}
@media only screen and (max-width:1280px){
}
@media only screen and (max-width:1024px){
    .head-category img{width:70%;}
    #category .nav-link{width:20%;}
}

@media only screen and (max-width:990px){
    .port-details img {width: 78%;}
    #index-services a p {
    font-size: 12px;
    padding: 8px 0px;
    margin: 0px;
   
}
#index-services img {
   
    width: 90px;
    margin: 0px;
}

    
} 
@media only screen and (max-width:900px){
    /*#banner img {height: 200px !important;}*/
    .owl-nav .owl-prev { display:none;}
    .owl-nav .owl-next { display:none;}

   /* #index-services a p {font-size: 11px; padding: 8px 0px; margin: 0px; font-weight:700!important;}*/
    #index-services img {width: 90px;  margin: 0px;}
    .head-category img{width:90%;}
    .menu {margin: 3px; padding: 2px 6px;}
    #category .nav-link{width:20%;}
}
@media only screen and (max-width:768px){
    
     .port-details img {width: 71%;}  
    
}
@media only screen and (max-width:767px){
    #topcontact{display:none;}
    #banner {margin-top:0;}
    .navbar-toggler-icon i{color:black;}
    #index-background {margin-top: -84px;}
    .display{display:none;}
    .pad-set{padding-top:3rem !important;}
    .heading a {font-size: 11px !important;}
    .box{height: 81px;padding:0;margin: 6px 0;}
    #category .tab-menu img { width: 35px;}
    #category p{font-size:13px;}
    .tab-menu p {margin-top: -5px;}
    #category .nav-link{width:20%;}
    .ser-head {width: 20%;}
    .ser-head a{font-size:11px; font-weight:700;}
    .heading1 img{width:53px;}
     #index-services img {width: 68px;}
    #mobile-banner{display:block !important;}
    #banner{display:none;}
    #aboutus{display:none;}
    #mobile-about{display:block;}
    
    #index-services{padding-top:10px !important; padding-bottom:0 !important; }
    #index-background {margin-top:0 !important;}
    .head-category img{width:25%;}
    .port-details img {width: 75%;}
}

@media only screen and (max-width:600px){
   .port-details img {width: 61%;}  
   .head-category img{width:35%;}
}

@media only screen and (max-width:576px){
    .col-xs-6{width:244px;}
    .port-details img {width: 81%;}
    #copyright {font-size: 11px;}
    
}

@media only screen and (max-width:575px){
    .col-xs-6{width:48% !important;}
    .port-details img {width: 80% !important;}
    #copyright {font-size: 11px;}
     .heading a {font-size: 12px !important;font-weight:bold !important;}
    .tagline1{font-size:18px !important;}
     #category .nav-link{width:25% !important;}
     .head-category img{width:35%;}
}

@media only screen and (max-width:500px){
    .col-xs-6{width:48% !important;}
    .port-details img {width: 80% !important;}
    #copyright {font-size: 11px;}
    #banner img {height: 400px !important;}
    #category .nav-link{width:25% !important;}
    .head-category img{width:38%;}
}
 

@media only screen and (max-width:480px){
    .port-details img {width:83%;}
    #copyright {font-size: 11px;}
    #category .nav-link{width:33% !important;}
    
}

@media only screen and (max-width:480px){
#copyright {font-size: 11px;}
}

@media only screen and (max-width:414px){
    .port-details img {width: 93%;}
    #copyright {font-size: 11px;}
 .head-category img{width:45%;}
  #copyright {font-size: 9px;}
    
}

@media only screen and (max-width:412px){
    .port-details img {width: 93%;}
    #copyright 
     #copyright {font-size: 9px;}
 
}

@media only screen and (max-width:384px){
   #category p{font-size:10px;}
   .tab-menu p {
        margin-bottom: 0.1rem;}
    #copyright {font-size: 8px;}
}

 
@media only screen and (max-width:375px){
    .head-category img{width:58%;}
   #copyright {font-size: 6px;}
}

@media only screen and (max-width:360px){
   
 
}

@media only screen and (max-width:320px){
    
    .port-details img {width: 95%;}
    #category p{font-size:8px;}
     #copyright {font-size: 6px;}
  }