.project-tab {
    /* padding: 10%;
    margin-top: -8%; */
    animation: fadein;
    animation-delay: .5s;
}
.project-tab #tabs{
    background: #007b5e;
    color: #eee;
}
.project-tab #tabs h6.section-title{
    color: #eee;
}
.project-tab #tabs .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    color: var(--main-first-color) !important;
    background-color: transparent;
    border-color: transparent transparent #f3f3f3;
    border-bottom: 3px solid !important;
    font-size: 16px;
    font-weight: bold;
}
.project-tab .nav-link {
    border: 1px solid transparent;
    border-top-left-radius: .25rem;
    border-top-right-radius: .25rem;
    color: var(--main-first-color);
    font-size: 16px;
    font-weight: 600;
}
.project-tab .nav-link:hover {
    border: none;
}
.project-tab thead{
    background: #f3f3f3;
    color: #333;
}
.project-tab a{
    text-decoration: none;
    color: #333;
    font-weight: 600;
}



.files input {
    outline: 2px dashed #92b0b3;
    outline-offset: -10px;
    -webkit-transition: outline-offset .15s ease-in-out, background-color .15s linear;
    transition: outline-offset .15s ease-in-out, background-color .15s linear;
    padding: 120px 0px 85px 35% !important;
    text-align: center !important;
    margin: 0;
    width: 100% !important;
}
.files input:focus{     outline: 2px dashed #92b0b3;  outline-offset: -10px;
    -webkit-transition: outline-offset .15s ease-in-out, background-color .15s linear;
    transition: outline-offset .15s ease-in-out, background-color .15s linear; border:1px solid #92b0b3;
 }
.files{ position:relative}
.files:after {  pointer-events: none;
    position: absolute;
    top: 60px;
    left: 0;
    width: 50px;
    right: 0;
    height: 56px;
    content: "";
    background-image: url(https://image.flaticon.com/icons/png/128/109/109612.png);
    display: block;
    margin: 0 auto;
    background-size: 100%;
    background-repeat: no-repeat;
}
.files:before {
    position: absolute;
    bottom: 10px;
    left: 0;  pointer-events: none;
    width: 100%;
    right: 0;
    height: 57px;
    content: " or drag it here. ";
    display: block;
    margin: 0 auto;
    color: var(--main-first-color);
    font-weight: 600;
    text-transform: capitalize;
    text-align: center;
}

.color input {
    background-color: #f7f7f7;
    cursor: pointer;
    text-align: left !important;
}

.uploadExcelBtn,
.uploadImageBtn{
    padding: 10px;
    background-color: var(--main-first-color);
    font-weight: bold;
    color: #FFF;
    text-align: center;
    cursor: pointer;
    float: right;
    border: 1px solid #f1f1f1;
    border-radius: 2px;
}


.confirmData-title {
    padding: 10px 0;
    font-weight: bold;
    display: block;
    color: #c00534;
}

.confirmData-missing > span {
    padding: 5px 0;
    display: block;
    color: gray;
}

.tab-content {
    margin-top: 25px;
}

.successSpan > span {
    font-size: 12pt;
    font-weight: 600;
    color: green;
    padding: 10px;
}

.alertSpan > span {
	font-size: 12pt;
    font-weight: 600;
    color: #c00635;
    padding: 10px;
}

.confirmData-wrapper {
    padding: 0 20px;
}

.finish-btn {
	color: #fff;
	width: 100px;
	padding: 3px 10px;
	border-radius: 3px;
	display: inline-block;
	cursor: pointer;
	text-align: center;
	font-weight: lighter;
	margin-top: 5px;
}

.finish-btn {
	float: right;
	background-color: #c00534;
}

.goBack-btn:hover,
.finish-btn:hover {
	opacity: .85;
}

.goBack-btn > i,
.finish-btn > i {
	font-size: 13pt;
	top: 10px;
}

.goBack-btn > span,
.finish-btn > span {
	vertical-align: top;
}

.goBack-btn {
	border-radius: 50px;
	width: 30px;
	height: 30px;
	background-color: #c00635;
}

.showImagesLoaded {
	display: block;
	position: relative;
	margin-top: 75px;
}

.imageLoaded {
	padding: 15px;
	background-color: #f7f7f8;
	border-radius: 5px;
	color: #333;
	font-weight: lighter;
	margin-bottom: 10px;
}

.removeIcon {
	float: right;
	font-size: 18pt;
	margin-right: 20px;
	margin-top: -4px;
	color: red;
	cursor: pointer;
}