﻿a.navbar-brand {
  white-space: normal;
  text-align: center;
  word-break: break-all;
  padding:0 0 0 25px;
}

/* Provide sufficient contrast against white background */
a {
  color: #3f90b7;
  text-decoration:none;
}

.btn-primary {
  color: #fff;
  background-color: #3f90b7;
  border-color: #3f90b7;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
  color: #fff;
  background-color: #3f90b7;
  border-color: #3f90b7;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
  font-size: 14px;
}
@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.border-top {
  border-top: 1px solid #e5e5e5;
}
.border-bottom {
  border-bottom: 1px solid #e5e5e5;
}

.box-shadow {
  box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05); width:100%; display:block;
}

button.accept-policy {
  font-size: 1rem;
  line-height: inherit;
}

/* Sticky footer styles
-------------------------------------------------- */
html { position: relative; min-height: 100%; }

body {background:#fafafa; color:#555; font-size:14px; }
.footer {position: absolute; bottom: 0; width: 100%; white-space: nowrap; line-height: 60px; /* Vertically center the text there */}

.clearfix{width:100%; clear:both;}
.clearfix::after {display: block; clear: both; content: "";}

/*@media (min-width: 1200px){
.container {
    max-width:1330px;
}
}*/

.top-header {
    background-color: #5e97c7!important;
}


.intro-info{margin:100px 0 0; min-height:450px;}
.Login_box .title{color:#333; font-weight:bold; text-align:center;}
.Login_box{padding:0; position:relative; overflow:hidden; margin:80px 10px 40px 10px; background:#fff; box-shadow:0 10px 29px 0 rgba(68, 88, 144, 0.1); transition:all 0.3s ease-in-out;}
.login-right{padding:30px; text-align:center; margin:50px 0 0;}
.login-logo{margin:0 0 20px;}
/*--------------------------------------------------------------
# Start Top Navigation Menu
--------------------------------------------------------------*/

.TopNav{background:#fff; padding:0; width:100%; display:block;}
.navbar-brand {display: inline-block; width: 230px; text-align: center;}
/*.main-nav{margin:5px 0 0 !important;}*/
.main-nav,
.main-nav *{margin: 0; padding:0; list-style: none;}
.main-nav > ul > li { position: relative; white-space: nowrap; float: left; color:#333;}
.main-nav a {display: block; position: relative; color: #c6c6c6; padding:10px 20px; transition: 0.3s; font-size: 14px;font-weight: 500;}
.main-nav a:hover{color: #5e97c7; text-decoration: none; border-radius:5px;}
.main-nav .active > a{color: #fff; text-decoration: none; background:#007bff; border-radius:5px;}
.main-nav .drop-down ul { display: block; position: absolute; left: 0; top: calc(100% + 30px); z-index: 99; opacity: 0; visibility: hidden; padding: 10px 0; background: #fff; box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25); transition: ease all 0.3s;}
.main-nav .drop-down:hover > ul{opacity: 1; top:85%; visibility: visible;}
.main-nav .drop-down li{min-width: 180px; position: relative;}
.main-nav .drop-down ul a{padding:7px 10px; font-size: 13px; color: #004289;}

.main-nav .drop-down ul a:hover,
.main-nav .drop-down ul .active > a,
.main-nav .drop-down ul li:hover > a {color: #007bff;}

.main-nav .drop-down > a:after {content: "\f107";font-family: FontAwesome;padding-left: 5px;}
.main-nav .drop-down .drop-down ul {top: 0;left: calc(100% - 30px);}
.main-nav .drop-down .drop-down:hover > ul {opacity: 1;top: 0;left: 100%;}
.main-nav .drop-down .drop-down > a {padding-right: 35px;}
.main-nav .drop-down .drop-down > a:after {content: "\f105";position: absolute;right: 15px;}

/* Mobile Navigation */
.mobile-nav {position: fixed;top: 0;bottom: 0;z-index: 9999;overflow-y: auto;left: -260px;width: 260px;padding-top: 18px;background: rgba(19, 39, 57, 0.8);transition: 0.4s;}
.mobile-nav * {margin: 0;padding: 0;list-style: none;}
.mobile-nav a {display: block;position: relative;color: #fff;padding: 10px 20px;font-weight: 500;font-size:13px;}

.mobile-nav a:hover,
.mobile-nav .active > a,
.mobile-nav li:hover > a {color: #74b5fc !important;text-decoration: none;}

.mobile-nav .drop-down > a:after {content: "\f078";font-family: FontAwesome;padding-left: 10px;position: absolute;right: 15px;}
.mobile-nav .active.drop-down > a:after {content: "\f077";}
.mobile-nav .drop-down > a {padding-right: 35px; color:#fff;}
.mobile-nav .drop-down > a:focus {color:#007bff;}
.mobile-nav .drop-down.active > a{color:#007bff;}
.mobile-nav .drop-down ul {display: none;overflow: hidden;}
.mobile-nav .drop-down li {padding-left: 20px;}
.mobile-nav-toggle{position: fixed;right: 0;top: 0;z-index: 9998;border: 0;background: none;font-size: 24px;transition: all 0.4s;outline: none !important;line-height: 1;cursor: pointer;text-align: right;}
.mobile-nav-toggle i {margin: 18px 18px 0 0;color: #004289;}
.mobile-nav-overly{width: 100%;height: 100%;z-index: 9997;top: 0;left: 0;position: fixed;background: rgba(19, 39, 57, 0.8);overflow: hidden;display: none;}
.mobile-nav-active{overflow: hidden;}
.mobile-nav-active .mobile-nav{left: 0;}
.mobile-nav-active .mobile-nav-toggle i{color: #fff;}

/*--------------------------------------------------------------
# End Top Navigation Menu
--------------------------------------------------------------*/


.LoginSection {
    height: auto;
    min-height: 242px;
    margin: 115px auto 15px;
    width: 450px;
    background: #fff;
    padding: 20px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    border: 1px solid #ccc;
    border-radius: 10px;
}

/*--------------------------------------------------------------
# Start Form CSS
--------------------------------------------------------------*/
.formtable{width:auto;}
.formtable td{padding:5px;}
.listTable{width:100%; position:relative; overflow:auto; max-height:150px;}
.listTable table{border-collapse:separate; border-spacing:0;}
.listTable thead th{position:-webkit-sticky; position:sticky; top:0; background:#f8f7fc;}

.DatePick{background:#fff url(../images/CalIcon.png) right center no-repeat; background-position:right; background-repeat:no-repeat;}

.mandatory{color:#cd1414;}
.error_msg{color:#cd1414; position:absolute; font-size:11px;}
/*--------------------------------------------------------------
# End Form CSS
--------------------------------------------------------------*/
.header{background:#fff;}
.title-bar{width:100%; padding:5px 15px; margin:0 0 10px; display:block;background-image: linear-gradient(90deg, rgb(64 144 183), rgb(237, 242, 249)); border-radius:5px;}
.border{border:1px solid #dee2e6!important; padding:15px; margin:10px 0 0;}



/*------------------------ Start Top Header CSS ----------------*/
.head-title{font-size:23px; margin:0; color:#fff;}


/*------------------------ End Top Header CSS ----------------*/

/*--------------------------------------------------------------
# Start Datatable CSS
--------------------------------------------------------------*/
.table {color: #333;}
.table tr{border-bottom:1px solid #ccc;}
.table thead{background: #736f81; color: #fff;}
table.dataTable.no-footer{border-bottom:0;}
table.dataTable thead th{padding:5px;}
table.dataTable tbody td{padding:5px;}

.dataTables_wrapper .dataTables_paginate .paginate_button{padding: 0px 8px; background: #3f90b7;}
.dataTables_wrapper .dataTables_paginate .paginate_button.current{background:#3f90b7; color:#fff !important;}

.dataTables_length{display:none;}
.dataTables_info{display:none;}
.dataTables_filter{display:none;}

/*--------------------------------------------------------------
# End Datatable CSS
--------------------------------------------------------------*/
.inner-container{background:#fff; padding:10px; margin: 10px 0 0; border:1px solid #dee2e6 ;min-height:480px; }
.info{float:right; position:absolute; right:-5px; top:5px; color:#3f90b7;}
.action_icon a{margin:0 3px;}

.search_icon{background:#fff; border:1px solid #ccc; border-radius:3px;padding: 3px; width: 35px; height: 31px; text-align: center; cursor:pointer;}
.Features_Section{width:100%; position:relative; overflow-x:hidden; overflow-y:auto; max-height:600px; margin:10px 0; padding:0 5px;}
.Features_box{background:#fff;  -webkit-box-shadow: 0 0 5px 0 rgba(0,0,0,0.1); box-shadow: 0 0 5px 0 rgba(0,0,0,0.1); padding:10px; margin:5px 0 15px 0;}
.Feature_img{width:60px; height:60px; border:1px solid #ccc; margin:15px auto;}
.Feature_img img{width:100%;}


.tags{margin:0; padding:0;}
.tags li{margin: 5px 0 !important; padding: 0 10px !important; list-style-type: none !important; display: inline-block !important; background: #efefef; border-radius: 10px; color: #999; -webkit-transition: .5s !important; transition: .5s !important; width: auto !important;}
/*.tags li:hover{background:#3f90b7; color:#fff;}*/

.tag_list.tag_list_hide{display: none;}
.tag_list span{cursor: pointer; margin:0 0 0 5px; background:#ccc; padding:0 4px; border-radius:50%; color:#333;}

.createdby{margin:5px 0; font-size:12px; color:#999;}
.createdby .name{color:#3f90b7;}

.SourceCode_Section{padding:2px 5px;border-top: 1px solid #ccc; margin: 5px 0 0;}
.free{background:#3f90b7; color:#fff; padding:2px 10px; margin:0 10px; border-radius:20px; font-weight:bold;}
.paid{background:#ffbf5a; color:#fff; padding:2px 10px; margin:0 10px; border-radius:20px; font-weight:bold;}


.project_list_box{background:#fff; -webkit-box-shadow:0 0 5px 0 rgba(0,0,0,0.1); box-shadow:0 0 5px 0 rgba(0,0,0,0.1); padding:10px; margin:5px 0 15px 0; height:440px; overflow:hidden;}
.project_img{width:100%; height:auto; margin:0 0 10px;}
.project_img img{width:100%;}
/*-------------------------- Start Dashboard CSS -----------------*/
.box{position: relative; border-top: 0; margin-bottom: 20px; width: 100%; background: #fff; padding: 0px; -webkit-transition: .5s; transition: .5s; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; border-radius: 4px; -webkit-box-shadow: 0 1px 2px 0 rgba(0,0,0,0.1); box-shadow: 0 1px 2px 0 rgba(0,0,0,0.1);}
.box-body{padding: 1.25rem; -ms-flex: 1 1 auto; flex: 1 1 auto;}
.box-header{color: #455a64; display: block; padding: 0.5rem 1.25rem; position: relative; border-bottom: 1px solid rgba(97, 106, 120, 0.07);}
.box-title{line-height: 22px; font-size: 18px; color:#c6c6c6;}


.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {color:#fff; background-color:#3f90b7; border-color:#dee2e6 #dee2e6 #3f90b7;}
.dp-highlighter{background-color:#E7E5DC; width:100%; overflow:auto;}
.dp-highlighter ol{list-style:decimal; background-color: #fff; margin: 0px 0px 1px 45px !important; padding: 0px; color: #5C5C5C;}
.dp-highlighter ol li, .dp-highlighter .columns div{list-style: cimal-leading-zero; list-style-position:outside !important; border-left:3px solid #3f8bae; background-color:#F8F8F8; color:#666; padding:0 3px 0 10px !important; margin:0 !important; line-height:25px; border-right:1px solid #ddd;}
.dp-highlighter ol li.alt{background-color: #FFF; color: inherit;}


.tooltip-inner{max-width:200px;padding:.25rem .5rem;color:#fff;text-align:center;background-color:#3f90b7;}
.bs-tooltip-auto[data-popper-placement^=top] .tooltip-arrow::before,.bs-tooltip-top .tooltip-arrow::before{top:-1px;border-width:.4rem .4rem 0;border-top-color:#3f90b7;}
/*-------------------------- End Dashboard CSS -------------------*/

.searchicon{background:none; border:1px solid #ccc; border-radius:3px; padding:5px 10px;}
.search_head {
    font-size: 20px;
    font-weight: bold;
}

.PossibleRights{}
.PossibleRights ul{margin:0; padding:0;}
.PossibleRights ul li{margin:0 15px 0 0; padding:0; display:inline-block; list-style-type:none; line-height: 23px;}


.btn-google {
  background-image: url('../images/btn_google.png'); width:191px; height:46px; border:none; 
}

.btn-facebook {
  background-image: url('../images/facebook-login-button.png'); width:191px; height:46px; border:none; 
}

@media (max-width: 768px) {
.content-header>.breadcrumb, .content-header>.container>.breadcrumb {top:15px;}
.responsive_table{width:100%; overflow-x:scroll; overflow-y:hidden;}
.main-contener{margin: 0;}
.login-bg{display:none;}
}

/*.ShowHide{position:absolute; right:15px; margin:-27px 0 0;}
.ShowHide .fa{cursor:pointer;}*/

<!-- Start Grid & List View CSS -->					
.list{list-style:none; margin: 0; padding: 0; display: flex;}
.list li{transition: 0.3s; list-style-type:none; display:inline-block;}
.list.list-view-filter {flex-direction: column;}
.list.list-view-filter .project_list_box{height:auto;}
.list.list-view-filter li{display:block;}
.list.grid-view-filter {flex-flow: row wrap;}
.list.grid-view-filter li{width: calc(43.3% - 210px); padding:0px; margin: 5px;}
.list-view-filter .project_img{width:23%; display:inline-block; margin:0;}
.list-view-filter .project_Desc{width:75%;  display:inline-block; vertical-align:top;}
@media (max-width: 768px) {
.list.grid-view-filter li {width: calc(100% - 0px); padding: 0; margin: 5px;}
.list-view-filter li{margin:5px;}
.list-view-filter .project_img{width:100%; display:inline-block;}
.list-view-filter .project_Desc{width:100%;  display:inline-block; vertical-align:top;}
}
<!-- End Grid & List View CSS -->	