.navbar-brand {
        padding: 15px 15px;  /* adjust the top and bottom padding to less than default 15px  if your logo is too small  */
        margin-top: 0px;  /* adjust the top margin if your logo doesn't line up well  */
        height: 50px; /* you should ONLY need to  adjust this when your navbar is larger than default 50px. This should equal the height of computed height of  .navbar>li>a which is by default is 50px. Don't use this to try and make your logo bigger or smaller. Instead adjust the top and bottom padding accordingly. */
   }


    /* Get rid of link padding to make the above easier */
    .navbar-nav>li>a {
         padding-top:0px;
         padding-bottom:0px;
		 font-weight:700;
    }
	
    ul.nav li a, ul.nav li a:visited {		 
         font-size:13px;
		  color: #fff !important; 
    }

    ul.nav li a:hover, ul.nav li a:active {		 
	     font-size:13px;
		  color: #fff !important; 
    }

    ul.nav li.active a {
		 font-size:13px;
		 color: #fff !important;
    }
	
	/*  navbar ahref hover */
	ul.nav a:hover { 
	     background-color: #61A8DD !important;
	}
	
	/* drop-down bg color*/
    .dropdown-menu {
         background-color: #434A54; 
    }
	
	/* drop-down active bg color*/
    .navbar .nav li.dropdown.open > .dropdown-toggle, .navbar .nav li.dropdown.active > .dropdown-toggle, .navbar .nav li.dropdown.open.active > .dropdown-toggle {
         background-color: #61A8DD;
    }
    
	/* drop-down ahref color*/
    .dropdown-menu>li>a{
         /* color:#ffffff; */
    }
	
    .subtitle{
        color:black;
    }
	
	.dropdown-menu > li > a:hover {
         background-color: #86D0D9;
    }
	
    /* EDIT these but should be the same depending on on what font you're using */
    .navbar-brand, .navbar-nav>li>a {
        height: 67px;
        line-height: 67px;
    }


   /*EDIT top and bottom padding to shrink and grow image */
   .navbar-brand { 
        padding: 0px 15px;
   }
   
   
   .navbar {
         -webkit-box-shadow: 0 6px 6px -6px #999;
         -moz-box-shadow: 0 6px 6px -6px #999;
         box-shadow: 0 6px 6px -6px #999;
		 background-color:#1C6FAF; 
         /* -moz-animation:myfirst 10s; */ /* Firefox */
         /* -webkit-animation:myfirst 10s; */ /* Safari and Chrome */
		 
   }
   
    .wrapper{
	      background-image: url('../img/bg2.jpg');
	      padding:55px;
	      display:absolute; 
	      height:570px;
	}
	
   .page-header{
	   margin-top:70px;
	   border-bottom: 4px solid #6D6D6D;
   }
	
   .prod_header{
       margin-top:70px;
   }
   
   .leftsidebar{
      margin-top:150px;
   }
   
    #myCarousel{
       width:67%;
    }
   
    .carousel-control.left, .carousel-control.right {
        background-image: none;
    }

	.hr_style{
	     border: 1px solid #6D6D6D;
	}

    /* MISC */
    #myCarousel .item {
        overflow: hidden;
        height: auto;
        background-color: transparent;
        background-size: cover;
    }
	
    #myCarousel > .carousel-control {
        width: 30px;
        font-size: 40px;
        color: #fff;
        text-shadow: none;
        filter: none;
        opacity: 1;
    }
	
    #myCarousel > .carousel-control span {
        position: absolute;
        top: 50%;
        margin-top: -30px;
        width: 100%;
        text-align: center;
        display: block;
    }

    .slogan{
	    color:#fff; 
		text-indent:30px;
	}
	
    .aboutus_header{
        font-weight:bold; 
		font-size:33px; 
		color:#fff; 
		text-transform:uppercase;
    }	
	
    .carousel-indicators {
		left: 60%;
		text-align: right;
    }
   
    .carousel-caption{  
	    float:left;
	    left:0;
	    bottom:0;
		background-color:#656D78;
		opacity: 0.8;
	    width:100%;
		height:65px;
    } 

    .slide_rightside{
		float:right; 
		width:31%; 
		height:20%; 
	}
	
	.ssBtn{
	    margin-left:30px; 
		margin-top:-5px; 
		float:left;
	}
	
	.ssheader{
	    text-align:left; 
		margin-top:0px; 
		padding-left:35px; 
		float:left;
		display:inline;
		color:#fff;
	}
	

    .dropdown-menu .sub-menu {
		left: 100%;
		position: absolute;
		top: 0;
		visibility: hidden;
		margin-top: -1px;
	}

	
	.product_list{
			list-style-image: url('../img/list.jpg');
	}
	
	.dropdown-menu li:hover .sub-menu {
		visibility: visible;
	}

	.dropdown:hover .dropdown-menu {
		display: block;
	}

	.nav-tabs .dropdown-menu, .nav-pills .dropdown-menu, .navbar .dropdown-menu {
		margin-top: 0;
	}

	.navbar .sub-menu:before {
		border-bottom: 7px solid transparent;
		border-left: none;
		border-right: 7px solid rgba(0, 0, 0, 0.2);
		border-top: 7px solid transparent;
		left: -7px;
		top: 10px;
	}
	
	.navbar .sub-menu:after {
		border-top: 6px solid transparent;
		border-left: none;
		border-right: 6px solid #fff;
		border-bottom: 6px solid transparent;
		left: 10px;
		top: 11px;
		left: -6px;
	}
	
	#sidebar li {
		border:0 #f2f2f2 solid;
		border-bottom-width:1px;
		background-color:#11B8B1;
	}

	.productlink:hover{
		text-decoration:none;
	}

	.productName{
		font-size:13px;
	}

    /* Firefox */  
    /*  
	@-moz-keyframes myfirst 
    {
          0%   {background:#fff;}
          10%  {background:#019873;}
    }
	
	/* Safari and Chrome */
    /*
    @-webkit-keyframes myfirst 
    {
          0%   {background:#fff;}
          10%  {background:#019873;}
    } */
	
   .motto{
        color: #FFFFFF;
        font-size: 36px;
        font-weight: 600;
        left: 100%;
        margin-left: -67%;
        position: absolute;
        text-align: center;
        text-transform: uppercase;
        top: 150px;
        z-index: 3;
		
		/* default animation */
		opacity:0.4;
		filter: alpha(opacity=40);
   }

   .solution-container{
        padding:55px;
   }

   .contactDiv{
        background-color:#434A54;
   }

   .contactH1{
        font-size:55px;
        color:#fff;
   }
   
   .contactMobile{
        display:none;
   }
   
   .mailImage{
        min-height: 150px;
        min-width: 150px;
        margin-left: auto;
        margin-right: auto;
        text-align: center;
        display: table-cell;
        vertical-align: middle
    }
	
	/* if email format incorrect the border will display as red in the contact.html  */
	.errorEmail {
        border:2px solid red;
    }
	
	.footer{
	    background-color:#01579B;
	}

	.footerCompany{
	    padding-top:15px;
		color:#fff; 
		float:left;
	}
	
    .footerContact{
        text-align:right; 
		font-size:12px;
		padding-top:17px; 
		color:#fff; 
		float:right; 
    } 
	
	.navigation-erp{
    	height: 360px;
    	background-image: url('../img/separatedlayer.jpg'); 
    	background-position: center center;
    	background-size: cover;
    	position: relative;
    }
	
	.navigation-hris{
    	height: 360px;
    	background-image: url('../img/separatedlayer_hris.jpg'); 
    	background-position: center center;
    	background-size: cover;
    	position: relative;
    }
	
    .scrollup {
        width: 40px;
        height: 40px;
        position: fixed;
        bottom: 60px;
        right: 100px;
        display: none;
        text-indent: -9999px;
        background: url('../img/scrolltop.png') no-repeat;
    }

@media only screen and (max-width: 768px) {
   .divspan{
       display:none;
   }

   .div_slogan{
       left:0;
       margin-left:-40%;
   }
   
   .prod_header{
       margin-top:10px;
   }
   
   .leftsidebar{
      margin-top:100px;
   }

   .contactH1{
       font-size:35px;
   }
   
   .pcImage{
       max-width: 100%;
   }
   
   /* reconstruct the contact us layout in the index.html  */
   .contactDiv{
       max-width: 100%;
   }   
   
   .contactTable{
       display:none;
   }
   
   .contactMobile{
       text-align:center;
       display:initial;
   }
   
   /* if mobile the image of the contact will display as none  */
   .mailImage{
       display:none;
   }
   
   /* make footer's text center it  */
   #wrap{
       text-align:center;
   }
   
   /* make about page's image fitable in mobile screen */
   .winframejpg{
       max-width: 100%;
   }
   
   /* navbar header icon color */
   .navbar-default .navbar-toggle {
       border-color: #fff;
	   background-color: #26C6DA !important;
   }

   .navbar-default .navbar-toggle .icon-bar {
       background-color: #fff !important;
   }

   .navbar-toggle:hover {
       background-color: #00B8D4 !important;
   }
   
    .wrapper{
	   background-image: url('../img/bg.jpg');
	   padding:0px;
	   display:absolute; 
	   height:600px;
	} 
	
    .slogan{
		text-indent:0px;
	}
	
    .carousel-inner{
	   margin-top:30px;
	}
	
    .carousel-caption{  
	   height:60px;
    } 
	
    .ssheader{  
       font-size:15px;
    } 	
	
    .slide_rightside{
	    float:left;
	    margin:auto;
	    width:100%;
	    text-align:center;
	}
	
	.aboutus_header{
	    left:0;
	    float:left;
	    text-align:center;
	}
	
    #myCarousel{
	    left:0;
        width:100%;
    }
	
    .scrollup {
        bottom: 100px;
    }
	
	.ssBtn{
	display:none;
	}
	
	.footerCompany{
        float:none;
	}
	
    .footerContact{
	    text-align:center;
        float:none;
    } 

    .scrollup {
        right: 40px;
    }	
}