@import url('https://fonts.googleapis.com/css2?family=Encode+Sans+Semi+Condensed:wght@100;200;300;400&display=swap');


body {
  background-color: #efe9d8;
  font-family: 'Encode Sans Semi Condensed', sans-serif;
  letter-spacing: 1px;
}

h1,h2,h3,h4,h5,h6 {
	line-height: 1.5;
}

a {
    text-decoration: none !important;
    color: #444444;
}

a:hover {
    color: #ffc107;
}

p {
	margin: 0;
}

button {
	outline: none !important;
	border-radius: 3px !important;
}

ul {
    padding: 0;
	list-style: none;
}


nav {
    background-color: #f7505e;
	height: 100px;
}

nav .row {
    max-width: 1000px;
    margin: 0 auto !important;
}

a.navbar-brand {
    color: #fff;
	 font-weight: 700;
	 padding: 0;
    margin: 0;
}

.navbar-brand img {
	width: 200px;
	text-align: center;
}

a.navbar-brand:hover {
    color: #ffc107 !important;
    text-shadow: 0 1px 3px black;
   
}

	@media (max-width: 767px) {
		nav .brand-text {
			font-size: 1.2rem;
		}
	}
	

/*
.form-control {
	border-radius: 3px !important;
}

.form-control:focus, input:focus {
    color: #495057;
    background-color: #fff;
    border-color: #1d1d1d !important;
    outline: 0;
    box-shadow: none !important;
	
}

.navbar-toggler{
    width: 40px;
    height: 38px;
    background-color: #ffa207;
    border: none;
    outline: none !important;
    border-radius: 3px;
    box-shadow: 0 2px 5px #00000073;
}
.navbar-toggler .line{
    width: 100%;
    float: left;
    height: 2px;
    background-color: #212529;
    margin-bottom: 4px;
    box-shadow: 0 1px 2px white;
}


*/


.main-container {
	margin-top: 100px; /*since nav is 100px height */
	padding: 0;
}

.sub-nav {
    background-color: #2d3738;
    padding: 10px;
	position: fixed;
    width: 100%;
    z-index: 1;
	
}

.sub-nav-inner {
	max-width: 1000px;
	margin: 0 auto;
}


.breadcrumbs {
  list-style: none;
  margin: 0;
  padding: 0;
}

.breadcrumbs li {
  list-style: none;
  margin: 0;
  padding: 0;
  display: block;
  float: left;
  font-family: inherit;
  font-size: 13px;
  text-transform: uppercase;
  font-weight: 700;
  letter-spacing: 1px;
  line-height: 20px;
  color: hsl(0, 0%, 30%);
}

.breadcrumbs li a {
  display: block;
  padding: 0 40px 0 0px;
  color: #b8b8b8;
  text-decoration: none;
  height: 20px;
  position: relative;
  perspective: 700px;
}

.breadcrumbs li:not(:last-child) a:after {
  content: '';
  width: 10px;
  height: 10px;
  border-color: #fffff;
  border-style: solid;
  border-width: 1px 1px 0 0;
  
  -webkit-backface-visibility: hidden;
  outline: 1px solid transparent;
  
  position: absolute;
  right: 20px;
  top: 25%;
  -webkit-transition: all .15s ease;
     -moz-transition: all .15s ease;
      -ms-transition: all .15s ease;
          transition: all .15s ease;
  -webkit-transform: rotateZ(45deg) skew(1deg, 1deg);
     -moz-transform: rotateZ(45deg) skew(1deg, 1deg);
      -ms-transform: rotateZ(45deg) skew(1deg, 1deg);
          transform: rotateZ(45deg) skew(1deg, 1deg);
}





.content-container {
	
   width: 100%;
    max-width: 700px;
    margin: 0 auto;
    padding-top: 70px !important;
}



/*--LIST CARD ---*/

.list-card {
    background-color: white;
    padding: 5px 15px;
	margin-bottom: 15px;
    box-shadow: 0 2px 5px -2px #808080ab;
    border-radius: 10px;
}

.first-part h5 a {
    color: #f7505e !important;
}
	@media (max-width: 500px) {
		.first-part h5 a {
			font-size: 1rem;
		}

	}
.list-card .second-part {
	max-height: 85px;
}

.f-container {
    display: flex;
    justify-content: flex-start;
    align-items: baseline;
    flex-wrap: wrap;
}
	@media (max-width: 500px) {
		.f-container {
			flex-direction: column;
		}
		.f-item {
			margin: 0 auto;
		}
		.f-item .texts {
			font-size: 14px;
		}
	}
	


p.hours {
    font-size: 2rem;
}

.invoice-list p.i-amount {
    font-size: 1.2rem;
    font-weight: bold;
}
.invoice-list span.s-date-value, .invoice-list span.d-date-value {
    font-size: 1rem;
    font-weight: bold;
}

.invoice-list span.d-date-value {
    background: #fff6b4;
}



.list-card .single-project {
	height: auto !important;
	
}


.single-project svg.progress {
	
    width: 130px;
    height: 130px;
	position: relative;
	left: 50%;
	transform: translateX(-50%);
	
}

.single-project p.hours {
    font-size: 3em;
}

.single-project .progress .text {
	font-size: 7px;
}

.task-table table {
	background: white;
	border-radius: 10px;
	box-shadow: 0px 2px 5px -2px #808080ab;
}

.task-table .overlay {
	position: absolute;
	width: 100%;
	height: 100%;
	right: 0;
	z-index: 2;
	background: white;
}


span.final-total-billable-cost {
    font-size: 1.2rem !important;
    font-weight: bold;
}




.footer {
    width: 100%;
    min-height: 150px;
    display: flex;
    background: #232c2d;
}

.footer-inner {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
}

.footer .btn-outline-light {
	border-radius: 0px;
    border-width: 2px;
    padding: 3px 35px;
    text-shadow: 0 0 0px white;	
}



.file-share a {
    border-radius: 1px;
    box-shadow: none;
    border: 2px solid #f7505e !important;
    display: flex;
    margin-bottom: 15px;
    justify-content: center;
    background: transparent !important;

}