/* Costal oil */

* {
	margin: 0;
	padding: 0;
}
img {
	border: none;
}
a {
	text-decoration: none;
}
ul, li, p, h1, h2, h3, h4 {
	margin: 0;
	padding: 0;
}
.clr {
	clear: both;
}
#sohaib 
{  
    /*background-position: center;
    width: 100%;*/     
}
.zone-header {
        padding: 2.307em 1em 2.307em !important;
    position: relative;
        margin: 0% 7% 0% 7% !important;
}
body {
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 14px !important;
    line-height: 1.42857143;
    color: #333;
    width: 100% !important;
}

body {
	background: #5d5d5d;
	margin-left:85px;
	padding: 0 !important;
	font-family: roboto !important;
    /*----------*/
    display: block;
    margin: 0;
}
#layout-header {
    max-width: 100% !important;
    min-height: 200px;
    max-height: 200px;
}

#layout-main-container {
 background: #fff none repeat scroll 0 0;
 /*box-shadow: 0 0 3px #000;*/
 padding: 0 !important;
    margin: 3% 4% 5% 4% !important;
    min-height: 500px;
}


.page>header {
    display: none;
}
#layout-wrapper {
    background: #fff none repeat scroll 0 0;
    /*box-shadow: 0 0 3px #000;*/
    padding: 0 !important;
    /*margin-right: auto;*/
    /*margin-left: auto;*/
}

header {
	background: rgba(0, 0, 0, 0) url("../Content/images/nav-bg.jpg") no-repeat scroll center top;
    background-size: cover;
	/*border-bottom: 17px solid #e6e7e8;
	overflow: hidden;*/
}
#srchimg {
     background:url(../Content/images/searchbutton.png) no-repeat;
     width: 25px;
     height:25px;
     margin-right: 18px !important;
     margin-top: 5px !important;
}
.logo {
    background:url(../Content/images/logo.png) no-repeat;
    width: 195px;
    height: 106px;
	padding: 30px 0;
}
.top-menu {
	text-align: right;
	margin-top: -12px !important;
}
.top-menu .set {
	float: left;
	list-style: outside none none;
	margin: 4px 0 0 !important;
	width: 60%;
}
.set li {
	display: inline;
	padding: 0 20px !important;
}
.set li a {
	color: #173f4d;
}

/*.set li:last-child .hdbtn {
	background: #5fbedd none repeat scroll 0 0;
    border-radius: 4px;
    padding: 10px 15px;
    text-decoration: none;
}

.set li:nth-child(2) .hdbtn {
	background: #5fbedd none repeat scroll 0 0;
    border-radius: 4px;
    padding: 10px 15px;
    text-decoration: none;
}

.set li:first-child .hdbtn {
	background: #fff;
    border-radius: 4px;
    padding: 10px 15px;
    text-decoration: none;
}
.set li {
  display: block;
  float: right;
}
}*/

/*.set > li:first-child {
  left: 25px;
  position: relative;
}
.set > li:last-child {
  left: 75px;
  position: relative;
}
.set li a {
	color: #fff;
}
    }*/
.top-menu-mobile{
    display: none;
    padding-left: 0px !important;
    padding-right: 0px !important;
}

.set li:first-child .hdbtn {
  background: #fff none repeat scroll 0 0;
  border-radius: 4px;
  padding: 10px 15px;
  text-decoration: none;
  line-height: 3em;

}
.set li:last-child .hdbtn {
  background: #5fbedd none repeat scroll 0 0;
  border-radius: 4px;
  padding: 10px 15px;
  text-decoration: none;
  line-height: 3em;
}
    .set li:nth-child(2) .hdbtn {
        background: #5fbedd none repeat scroll 0 0;
        border-radius: 4px;
        padding: 10px 15px;
        text-decoration: none;
        line-height: 3em;
    }

.top-menu-mobile:first-child .hdbtn {
  background: #fff none repeat scroll 0 0;
  border-radius: 4px;
  padding: 10px 15px;
  text-decoration: none;
  width: 100%;
    line-height: 3em;
}
.top-menu-mobile:last-child .hdbtn {
  background: #5fbedd none repeat scroll 0 0;
  border-radius: 4px;
  padding: 10px 15px;
  text-decoration: none;
  width: 100%;
    line-height: 3em;
}
.top-menu-mobile:nth-child(2) .hdbtn {
        background: #5fbedd none repeat scroll 0 0;
        border-radius: 4px;
        padding: 10px 15px;
        text-decoration: none;
        width: 100%;
          line-height: 3em;
}
  
.search-mobile {
	float: right;
	position: relative;
    margin-right: 18px !important;
    padding-left: 0px !important;
    padding-right: 0px !important;
    margin-top: 20px;
}
.search-mobile input {
	background: transparent none repeat scroll 0 0 !important;
	border: 1px solid #fff !important;
	border-radius: 15px !important;
	color: #fff !important;
	padding: 5px 35px 5px 10px !important;
	width: 230px !important;
}
.search-mobile a {
	position: absolute;
	right: 3px;
	top: 4px;
}
.srchimg {
    position: absolute;
	right: 3px;
	top: 4px;
}

.search {
	float: right;
	position: relative;
    margin-right: 18px !important;
    margin-top: 5px !important;
}
.search input {
	background: transparent none repeat scroll 0 0 !important;
	border: 1px solid #fff !important;
	border-radius: 15px !important;
	color: #fff !important;
	padding: 5px 35px 5px 10px !important;
	width: 250px !important;
}

.search input[type="text"]
 {    
    width: 120% !important;     
}

.search a {
	position: absolute;
	right: 3px;
	top: 4px;
}
.srchimg {
    position: absolute;
	right: 3px;
	top: 4px;
}

.nav >li {
    background: transparent;
}
.navbar {
	min-height: 40px !important;
}
.navbar-default {
	background-color: transparent;
	border: medium none;
	margin: 0;
}

.navigation li a {
	color: #1c4756 !important;
	padding: 10px 49px !important;
}
.navigation li a:hover {
	color: #173f4d !important;
	background-color: #e6e7e8 !important;
}
.navigation .Active {
	color: #173f4d !important;
	background-color: #e6e7e8 !important;
}
.dropdown.current.Active {
    background: white;
}
.dropdown-backdrop {
  position: static !important;
}
.dropdown.current.Active {
    background: white;
}
.dropdown>a:first-child{
    color: #173f4d !important;
}
.show li.current.Active a {
    color: white;
}

.welcome-section {
	margin-top: 60px;
}
.repo {
	padding: 0 !important;
}
.repo h1 {
	/*background: #1dafec none repeat scroll 0 0;*/
	font-size: 14px !important;
	margin: 0 !important;
	padding: 8px 10px !important;
	color: #fff;
}
.repo ul {
	list-style: outside none none;
	margin:0px 0 0 7px !important;
    line-height: 2em;
}

.dropdown ul {
    background: white;
}


.repo ul .Active {
    /*background: #1dafec none repeat scroll 0 0;*/
    color:#09f
    
}
.repo ul .current.Active a {
    background: #00aeef; 
    color:#fff;
}
.repo ul .dropdown.current.first.Active a, .dropdown.Active.current a{background:none !important;}
.repo ul li ul.show .current.Active li a{color:#173f4d !important;}
.repo ul li a {
  border-bottom: 1px solid #ccc;
  color: #173f4d;
  float: left;
  font-size: 14px;
  padding: 5px 0px 5px 2px !important;
  width: 100%;
  text-decoration:none;
}
.widget-welcomecoll > h1 {
	margin: 0 40px;
	color: #1dafec;
}
.widget-welcomecoll > h1 span {
	color: #173f4d;
}
.status h1 {
	font-size: 18px;
	color: #173f4d;
	font-weight: 600;
}
.status ul {
	list-style: none;
}
.status ul li {
	color: #fff;
	font-size: 17px;
	font-weight: 600;
	margin-bottom: 10px !important;
	padding: 10px 5px !important;
}
.status ul li span {
	font-weight: normal;
}
.status ul li.green {
	background-image: -webkit-gradient(  linear,  left top,  right top,  color-stop(0, #41B34F),  color-stop(1, #8DC449) );
	background-image: -o-linear-gradient(right, #41B34F 0%, #8DC449 100%);
	background-image: -moz-linear-gradient(right, #41B34F 0%, #8DC449 100%);
	background-image: -webkit-linear-gradient(right, #41B34F 0%, #8DC449 100%);
	background-image: -ms-linear-gradient(right, #41B34F 0%, #8DC449 100%);
	background-image: linear-gradient(to right, #41B34F 0%, #8DC449 100%);
}
.status ul li.red {
	background-image: -webkit-gradient(  linear,  left top,  right top,  color-stop(0, #E7212E),  color-stop(1, #BC2131) );
	background-image: -o-linear-gradient(right, #E7212E 0%, #BC2131 100%);
	background-image: -moz-linear-gradient(right, #E7212E 0%, #BC2131 100%);
	background-image: -webkit-linear-gradient(right, #E7212E 0%, #BC2131 100%);
	background-image: -ms-linear-gradient(right, #E7212E 0%, #BC2131 100%);
	background-image: linear-gradient(to right, #E7212E 0%, #BC2131 100%);
}
footer {
	background: #bcbec0;
	overflow: hidden;
	/*margin: 30px 1px 0 1px !important;*/
    /*margin-bottom: -10px !important;*/
	padding: 20px !important;
	max-height: 200px;
}
.ft-logo {
	margin-top: 40px;
}
.about {
	margin-top: 20px;
}
.about h3 {
	font-size: 20px;
        color: black;
}
.about ul {
	list-style: none;
}
.about ul li {
	padding: 5px 0 !important;
}
.about ul li a {
	color: #58595b;
}
.cont {
	margin-top: 20px;
}
.cont h3 {
	font-size: 20px;
    color: black;
}
.cont ul {
	list-style: none;
}
.cont ul li {
	padding: 5px 0 !important;
}
.cont ul li a {
	color: #58595b;
}
.joint {
	margin-top: 20px;
	text-align: center !important;
}
.joint h3 {
	font-size: 15px;
    color: black;
}
.joint ul {
	list-style: none;
    margin-top: 10px !important;
}
.joint ul li {
	display: inline-block;
	padding: 4px 6px !important;
}
.joint ul li a {
	color: #58595b;
}
.copy {
	margin-top: 30px !important;
	color: #58595b;
}
.copy span {
	margin-left: 20px !important;
}
.copy span a {
	color: #58595b;
}
.user-display
 {
    margin: 0 1.25% !important;
    text-align: center !important;
    float: none !important;
}
   
/**************************Custom*********************************/
.bp {
    background: url("../Content/Images/bp.png") no-repeat;
    width: 50px;
    height: 50px;   
}
.chevion {
    background: url("../Content/Images/chevion.png") no-repeat;    
    width: 50px;
    height: 50px;
}
.mobi {
    background: url("../Content/Images/mobi.png") no-repeat;    
    width: 50px;
    height: 50px;
}
.z-logo {
    background: url("../Content/Images/z-logo.png") no-repeat;
    width: 50px;
    height: 50px;  
}
.ftr-btm {
    background: url("../Content/Images/ftr-btm.png") no-repeat;   
    width: 190px;
    height: 150px; 
    float: left;
}
.navigation {
	margin-top: 100px;
}
/*****************************MEDIA CSS *************************/


 @media ( min-width:320px ) and ( max-width:989px ) {
.search input {
	width: auto;
}
/*.search {
	margin-top: 20px;
}
.search a {
    margin-top: 20px;
}*/
/*.set li {
	display: inline;
	padding: 0 3px;
}*/
/*.hdbtn{
    display: none;
}*/
.top-menu-mobile{
    display: block;
}
.top-menu{
    display: none;
}
.right-haed{
    padding-left: 0px !important;
    padding-right: 0px !important;
}

.top-menu-mobile .set {
	list-style: outside none none;
	margin: 4px 0 0 !important;
	width: 60%;
}

.navigation > nav > .navbar-header > .navbar-collapse {
  position: relative;
  z-index: 99;
}

/*.top-menu-mobile {
	text-align: right;
	margin-top: 20px !important;
}

.top-menu-mobile .hdbtn {
	margin-bottom: 20px !important;
}

.top-menu-mobile .set {
	float: left;
	list-style: outside none none;
	margin: 4px 0 0 !important;
}*/
#layout-header {
    max-width: 100% !important;
    min-height: 200px;
    max-height: 450px;
}


}
 @media ( min-width:320px ) and ( max-width:767px ) {
.top-menu .set {
	width: auto !important;
}
.logo {
	padding: 30px 0;  
	text-align: center;
}
.navbar-default .navbar-nav > li > a {
	color: #555 !important;
	padding: 10px 49px !important;
}
.widget-content {
	margin-top: 30px;
}
.widget-welcomecoll {
    margin-left: 20px !important;
}
.wel > h1 {
	color: #1dafec;
	margin: 0;
}
.ft-logo {
	margin-top: 40px;
	text-align: center;
}
.about {
	margin-top: 54px;
	text-align: center;
}
.cont {
	margin-top: 54px;
	text-align: center;
}
.table-scond-down td input {
  max-width: 100%;
  width: 100% !important;
}
body .table-scond-down table {
  padding: 0% !important;
}
}
 @media ( min-width:768px ) and ( max-width:1023px ) {
.top-menu .set {
	width: 49%;
}
.navigation li a {
	color: #1c4756 !important;
	padding: 10px 12px !important;
}
.navigation {
  margin-top: 2%;
}
}
 @media ( min-width:990px ) and ( max-width:1340px ) {
.top-menu .set {
	width: 60%;
}
.search input[type="text"]
 {    
    width: 100% !important;     
}

.zone-header {
        padding: 2.307em 1em 2.307em !important;
    position: relative;
        margin: 0% 0% 0% 0% !important;
}

.set li {
	display: inline;
	padding: 0 0 !important;
}

.navigation li a {
	color: #1c4756 !important;
	padding: 10px 33px !important;
}
}


@media (min-width: 1200px) {
    #layout-wrapper {
        width: 100% !important;
    }
}

@media only screen and (min-width: 769px) {
    .aside-12 #layout-content {
        /*width: 50% !important;*/
    }
}
.aside-first {
    /*min-height: 400px !important;*/
}

@media only screen and (min-width: 769px) {
    .aside-first, .aside-second {
        width: 24% !important;
    }
}

/*****************************MEDIA CSS *************************/

#layout-navigation {
    float: right;
    /*margin-top: -4.2% !important;*/
    margin-right: 6% !important;
}
nav ul li {
    border: 0px !important;
}
#layout-main,#layout-footer {

    max-width: 100% !important;
    /*margin-left: 15px !important;
    margin-right: 15px !important;*/
}
#layout-content {
    padding: 0px 40px 40px 40px !important;
}

#footer-sig {
    padding: 40px !important;
}
#aside-second {
    padding: 15px !important;
    margin-top: 0px !important;
}
.aside-1 #layout-content {
    /*float: right;*/
    width: 100%;
}


input[type="submit"], input[type="button"], button, .button, .button:link, .button:visited {
    color: #333 !important;
    background: #F5F5F5 !important;
    background: -webkit-gradient(linear, left top, left bottom, from(#F5F5F5), to(#cbcbcb)) !important;
    background: -moz-linear-gradient(top, #F5F5F5, #cbcbcb);
    border: 1px solid #999;
    cursor: pointer !important;
    margin: .2em 0 2em 0 !important;
    padding: .3em 1.8em !important;
    text-align: center;
}

select, textarea, input.text, input.textMedium, input.text-small, input.text-box {
    width: 96%;
    font-family: inherit !important;
    padding: 3px !important;
    border: 1px solid #bdbcbc;
    font-family: inherit !important;
    font-size: inherit;
}

input[type="text"], input[type="password"] {
    display: block;
    width: 43.33333333333333%;
    padding: 0.4615em !important;
}

.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th {
    padding: 8px !important;
    line-height: 1.42857143;
    vertical-align: top;
    border-top: 1px solid #ddd;
}
#table_id_length select {
    width: 30%;
}
.dataTable_wrapper {
    line-height: 1.5;   
}
.dataTables_length {
    width: 200px;
    height: 25px;
}

.dataTables_length {
    float: left;
    margin-bottom: 20px !important;
}

fieldset select {
    max-width: 43% !important;
}
fieldset label {
    font-size: 100% !important;
}

.edit-item-content fieldset {
    padding: .4615em 0 0 !important;
    margin: 0 0 .923em 0 !important;
    border: 0px solid #dbdbdb;
}
/*.search input[type="text"]
 {    
    width: 140% !important;     
}*/

.searchboxwidth
 {    
    width: 100% !important; 
    background: transparent none repeat scroll 0 0 !important;
	border: 1px solid #fff !important;
	border-radius: 15px !important;
	color: #fff !important;
	padding: 0.4615em !important;
	float: right;
	position: relative;
}

.dataTables_wrapper .dataTables_filter {
    float: right !important;
    text-align: right !important;
}
#table_id {
    width: 100% !important;
}
.dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_filter {
    float: left;
    text-align: center;
}


.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0,0,0,0) !important;
    border: 0 !important;
}

.navbar-toggle {
    position: relative !important;
    float: right !important;
    padding: 9px 10px !important;
    margin-top: 8px !important;
    margin-right: 15px !important;
    margin-bottom: 8px !important;
    background-color: transparent !important;
    background-image: none !important;
    /*border: 1px solid transparent !important;*/
    border-radius: 4px !important;
}
.navbar-nav {
    margin: 7.5px -15px;
}
/*.navbar-collapse.in {
    overflow-y: hidden !important;
}*/
.navbar-default .navbar-toggle .icon-bar {
    background-color: #888 !important;
    margin: 4px !important;
}
.widthmargin {
    width: 100% !important;
    margin-left: 0 !important;
}
.marginclass {
    margin-top: 80px !important;    
}
.minheightclass {
    min-height: 350px !important;    
}
 
select {
    max-width: 43% !important;
}
.edit-item-content .forpicker {
    display: none;
}
.col-centered {
    float: none;
    margin: 0 auto !important;
}

::-webkit-input-placeholder {
   color: #fff;
}

:-moz-placeholder { /* Firefox 18- */
   color: #fff;  
}

::-moz-placeholder {  /* Firefox 19+ */
   color: #fff;  
}

:-ms-input-placeholder {  
   color: #fff;  
}


/**/

.repo ul li ul {
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  margin: 0 !important;
  padding: 0 0 0 0px !important;
  overflow: inherit !important;
}

aside.aside-first.group {
  /*background: #f2f2f2 none repeat scroll 0 0;*/
}

.repo ul li:last-child a {
  border: medium none;
}

.repo ul li ul li a {
  color: #000 !important;
  font-size: 13px;
  padding: 5px 20px !important;
}

.repo ul li ul li a::before {
  font-family: "Glyphicons Halflings";
  padding: 0 6px 0 0;
}
aside.aside-first.group {
  background: rgba(0, 0, 0, 0);
}
.repo ul li a {
  border-bottom: 0 solid #ccc;
}
a:focus {
  outline: medium none !important;
  outline-offset: 0 !important;
}

.alert.alert-success {
    padding: 10px !important;
    float: left;
    margin: 0 0 20px !important;
    width: 100%;
}

.navigation  #navbarCollapse1 { float:left; width:100%;
}
#navbarCollapse {
    float: left;
    width: 100%;
}
.my_coll_work {
  float: left;
  margin: -10px 0 15px;
  width: 100%;
}
.my_coll_work h1 {font-size:1.308em !important;}

.width-min { margin:0 10px 0 0;  }
.repo ul li ul li a { background:#fff !important; color:#333 !important;
}


.repo ul li { float:left; width:100%;}
/*.repo ul li.dropdown.Active a { 
  background: #00aeef ;
}*/
/*.dropdown.current.Active a {
  background: #000 none repeat scroll 0 0;
}
.repo ul li ul li.Active {float: left;  width: 100%;}
.repo ul li ul li.Active a { color:#fff !important; background:#00aeef !important ;  }*/

.menu.menu-coastal-oil-logistics-main-menu li.dropdown.current.Active ul li.Active a {background: #00aeef !important; color:#fff !important;
}

@media ( min-width:768px) and ( max-width:1024px) {

    .aside-1 .aside-first {
  float: left;
  width: 40%;
}
.aside-1 #layout-content {
  float: right;
  width: 60%;
}
.navigation.menu-section {
  margin: 0;
}
.form-section .editor-field input {
  width: 100%;
  max-width: 300px;
  width: 1;
}
.editor-field select, textarea, input.text, input.textMedium, input.text-small, input.text-box {
  max-width: 76% !important;
  width: 300px !important;
}
.form-section .editor-field select {
  height: 32px;
  max-width: 300px !important;
  padding: 2px;
}
 #tblPortDetail input {
  margin-bottom: 11px !important;
  padding: 8px !important;
  width: 71%!important;
}
}
@media( max-width:767px) {
    span.availble-usese.span-section {  width: 39%;}
  span.width-min.min-width-section {

  width: 39%;
}

.zone.zone-content .the-main {padding:0;   }
.main-form-content-top .editor-label label{ width:100%;}
.editor-field input[type="text"], input[type="password"] { width:100%;  }
.zone.zone-content .editor-field textarea {max-width:100%; width:100%;  }
.main-form-content-top .editor-field select {max-width:100%!important; width:100%;  }
    .zone.zone-content .editor-label label { width:100%;    }
   .zone.zone-content .table-scond-down td { width:50%;}
   .table-scond-down td input { max-width: 100%;  width: 100%;}
   .zone.zone-content .main-form-content-top .editor-field { margin: 0 0 15px ;}
   .zone.zone-content .table-scond-down td:first-child {   width: 40%;}
.zone.zone-content .table-scond-down td {   float: left;    width: 60%;}
.zone.zone-content .table-scond-down table { padding:0;   }

    .zone .navigation { margin:15px 0 0;
    }
   

    .set li { padding:0 12px !important;
    }
    .search input[type="text"] { width:100% !important;
    }



}




/*@media( max-width:480px) {

     .zone.zone-content .table-scond-down table { padding:0;
    }
    .zone.zone-content .table-scond-down td {
    float: left;
    width: 100%;
}
    .table-scond-down td input {
  max-width: 100%;
  width: 100%;
}

}*/


.checkk > p {
  float: left;
  width: 100%;
}
.checkk .check-input {
  float: left;
  margin-top: 0;
}
.form-section .editor-label > label {
  width: 100%;
}
.form-section .editor-field select {
  height: 32px;
  padding: 2px;
}
.form-section .editor-field > input {
  height: 35px;
}
.editor-label label {
  width: 100%;
}
.editor-label.text-area-seaction > label {
  width: 100%;
}
.availble-usese.span-section {
  width: 21%;
}
.width-min {
  float: left;
  width: 25%;
}

.editor-field select, textarea, input.text, input.textMedium, input.text-small, input.text-box {
  max-width: 43%;
  padding: 0px!important;
}
.alert.alert-danger {
  clear: both;
}