body {
	margin:0;
	padding:0;
	font-family: 'Josefin Sans', sans-serif;
	color:#263363;
	background-color:#eee;
	font-size:14px;
}

a {
	color:inherit;
	text-decoration:none;
}

header {
	background-image:url(../images/header.jpg);.
	background-position:right;
	background-size:cover;
}

.top {
	background-color:#263363;
	color:white;
	text-align:right;
	padding:10px 0;
}

.top span:last-child {
	color:#E68028;
	display:inline-block;
	margin-left:10px;
}

.inner {
	width:94%;
	max-width:1500px;
	margin:auto;
	position:relative;
}

.heading {
	padding:30px 0;
}

header h1 {
	position:absolute;
	font-weight:normal;
	text-align:center;
	margin:auto;
	width:200px;
	left:0;
	right:0;
	top:50px;
}

.down {
	position:absolute;
	margin:auto;
	width:172px;
	left:0;
	right:0;
	bottom:-30px;
}

nav {
	background-color:white;
	text-align:center;
	padding-top:5px;
}

nav a {
	padding:14px 30px;
	font-size:24px;
	display:inline-block;
}

nav a.sel, nav a.sel:hover {
	border-bottom:5px solid #263363;
}

nav a:hover {
	border-bottom:5px solid #F5B458;
}

footer {
	background-color:#263363;
	color:white;
	padding:40px 0;
}

.sublogo {
	margin-bottom:20px;
}

.legal {
	font-size:12px;
}

.legal span {
	margin-left:15px;
}

.subcontact {
	float:right;
	margin-top:20px;
}

.subcontact div {
	margin-bottom:15px;
}

.subcontact i {
	font-size:20px;
	margin-right:10px;
}

.content {
	padding:20px 0;
	display:table;
	width:100%;
}

.folders, .documents {
	padding-top:20px;
	clear:btoh;
}

.folders a {
	position:relative;
	display:block;
	float:left;
	width:220px;
	height:181px;
	background-image:url(../images/folder.png);
	margin-right:20px;
	margin-bottom:20px;
	color:white;
	background-size:100% 100%;
}

.documents a {
	position:relative;
	display:block;
	float:left;
	width:180px;
	height:181px;
	margin-right:20px;
	margin-bottom:20px;
	color:white;
	text-align:center;
	padding-top:20px;
	border:1px solid transparent;
	border-radius:5px;
}

.documents a img {
	width:70px;
	margin-bottom:5px;
}

.documents a span {
	display:block;
	color:#263363;
	padding:5px 10px;
}

.documents a > i {
	position:absolute;
	top:15px;
	right:15px;
	color:red;
}

.documents a span:nth-child(2) {
	font-size:16px;
	font-weight:bold;
}

.documents a span:last-child {
	display:none;
	background-color:#263363;
	color:white;
	position:absolute;
	bottom:0;
	border-bottom-left-radius:5px;
	border-bottom-right-radius:5px;
	width:100%;
	padding:5px 0;
}

.documents a:hover {
	border:1px solid #ccc;
	background-color:white;
}

.documents a:hover span:last-child {
	display:block;
}

.folders a span:nth-child(2) {
	position:absolute;
	top:8px;
	right:0;
	color:#E40303;
}

.folders a:hover {
    -webkit-filter: brightness(140%); /* Safari 6.0 - 9.0 */
    filter: brightness(140%);
}

.search {
	display:inline-block;
	background-color:white;
	padding:5px;
	border-radius:5px;	
}

.switch {
	padding:5px;
	border:0;
	margin-right:20px;
	border-radius:5px;	
}

.search input {
	border:0;
}

*:focus {outline:0;}

.folders a span {
  position: relative;
  top: 54%;
  transform: translateY(-50%);
  display:block;
  text-align:center;
  font-size:20px;
}

.left {
	width:56%;
	float:left;
	margin-right:1%;
}

.alt .left {
	width:70%;
	margin-right:6%;
	border-right:1px solid #ccc;
}

.right {
	width:43%;
	float:left;
}

.alt .right {
	width:23%;
}

.account {
	width:47%;
	margin-right:4%;
	float:left;
	padding-top:20px;
}

.alt .account {
	width:100%;
	margin-right:0;
}

.account > img {
	width:100%;
	max-width:500px;
	margin:auto;
	display:block;
	margin-bottom:30px;
}

.action {
	display:block;
	border-radius:8px;
	height:80px;
	color:white;
	margin-bottom:15px;
}

.archive {
	display:block;
	text-align:center;
	text-decoration:underline;
	padding:20px 0; 
}

.upload {
	background-color:#263263;
}

.loading {
    position: fixed;
    background-color: rgba(255,255,255,0.5);
    width: 100%;
    height: 50vh;
    padding-top: 50vh;
    z-index: 99999;
    left: 0;
    bottom: 0;
    text-align: center;
}

.download {
	background-color:#F1AD4F;
}

.action > span:first-child {
	float:right;
	display:block;
	height:80px;
	width:20%;
	background-color:rgba(255,255,255,0.5);
	border-top-right-radius:8px;
	border-bottom-right-radius:8px;
	text-align:center;
	font-size:30px;
	line-height:80px;
}

.success {
    color:green;
    padding:10px;
}

.upload:hover {
    -webkit-filter: brightness(120%); /* Safari 6.0 - 9.0 */
    filter: brightness(120%);
}

.download:hover {
    -webkit-filter: brightness(105%); /* Safari 6.0 - 9.0 */
    filter: brightness(105%);
}

.action > span:last-child {
	display:block;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
	padding-left:8%;
	width:70%;
	font-size:18px;
}

.action > span > span:last-child {
	display:block;
	opacity:0.8;
	font-size:12px;
}

.manager {
	background-color:white;
	border-radius:8px;
	padding:15px;
	text-align:center;
}

.manager img {
	max-width:80%;
	margin:auto;
	display:block;
	margin-top:15px;
    border-radius:100%;
}

.manager a {
	display:block;
}

.manager p {
	font-size:20px;
}

.dates {
	float:right;
	background-color:#E0E0E0;
	border:1px solid #ccc;
	width:47%;
	text-align:center;
	font-size:20px;
}

.date strong {
	display:block;
	margin-top:4px;
}

.date {
	padding:50px 10px;
	border-top:1px solid #ccc;
}

.dates h3 {
	background-color:white;
	display:block;
	margin:0;
	padding:40px 10px;
	font-size:22px;
}

.edit, .contact {
	width:94%;
	max-width:800px;
	margin:auto;
	padding:30px 0;
	display:table;
}

.clientlogo {
	display:block;
	width:45%;
	float:left;
	margin-right:9%;
	background-color:white;
	border:1px solid #ccc;
	border-radius:5px;
	text-align:center;
}

.contactinfo {
	width:45%;
	float:left;
	margin-left:9%;
	font-size:18px;
}

.contactinfo div {
	margin-bottom:15px;
}

.contactinfo div:first-child {
	font-size:22px;
}

.clientlogo img {
	margin:20px 0;
	max-width:90%;
}

.clientlogo a {
	display:block;
	padding:10px;
	background-color:#263363;
	color:white;
}

.clientlogo a:hover {
	background-color:#F4B759;
}

.clientinfo, .form {
	display:block;
	width:45%;
	float:left;
	font-size:15px;
}

.form.login {
	width:100%;
	max-width:400px;
	margin:auto;
	float:none;
}

label {
	width:40%;
	display:block;
	float:left;
	padding-top:9px;
	font-weight:bold;
}

.txt {
	width:50%;
	padding:8px 3%;
	float:left;
	border:0;
	font-size:15px;
	font-family: 'Josefin Sans', sans-serif;
}

textarea {
	height:80px;
}

.row {
	display:table;
	width:96%;
	margin-bottom:10px;
	border-radius:5px;
	background-color:white;
	padding-left:4%;
}

.row:last-child {
	background-color:transparent;
}

.btn {
	background-color:#263363;
	border:0;
	border-radius:5px;
	padding:5px 20px;
	color:white;
	margin-right:5px;
	font-size:15px;
	cursor:pointer;
}

.btn:first-child {
	margin-left:43%;
}

.btn:hover {
	background-color:#F4B759;
}

.error {
	text-align:center;
	color:red;
}

.users {
	margin-top:30px;
}

.users a {
	display:block;
	margin-bottom:15px;
	font-size:16px;
}

.users a:hover {
	color:#F4B759;
}

.user {
	margin-top:30px;
}

/* MEDIA */

@media screen and (max-width:1400px) {
	.folders a {
		width:180px;
		height:148px;
	}
	.folders a span {
		font-size:16px;
	}
	
	.documents a {
		width:150px;
	}
}

@media screen and (max-width:1300px) {
	header {
		background-color:#F3B658;
		background-image:none;
	}
	.logo {
		width:200px;
	}
	.heading h1 {
		top:25px;
	}
	nav a {
		padding:11px 22px;
		font-size:22px;
	}
}


@media screen and (max-width:980px) {
	.alt .left, .alt .right {
		width:100%;
		margin-right:0;
		border-right:0;
	}
	.switch {
		margin-bottom:7px;
	}
}

@media screen and (max-width:780px) {
	.left, .right {
		width:100%;
		margin-right:0;
	}
	.legal {
		display:block;
		width:100%;
		clear:both;
	}
	.subcontact {
		margin-top:0;
	}
	.date {
	padding:20px 10px;
	font-size:16px;
}

.dates h3 {
	padding:20px 10px;
	font-size:16px;
}

.clientlogo, .clientinfo {
	width:100%;
	margin-right:0;
}

.clientinfo {
	margin-top:30px;
}
	
}

@media screen and (max-width:670px) {
	.dates, .account, .form, .contactinfo {
		width:100%;
		margin-right:0;
		margin-left:0;
		margin-bottom:20px;
	}
	.heading {
		padding:10px 0;
	}
	.top {
	font-size:11px;
	}
	.logo, .sublogo {
		width:150px;
	}
	.subcontact div {
		margin-bottom:5px;
	}
	.heading h1 {
		right:0%;
		margin-right:0;
		text-align:right;
		font-size:20px;
	}
	.down {
		width:100px;
		bottom:-10px;
	}
	nav a {
		padding:7px 17px;
		font-size:18px;
	}
	nav a.sel, nav a.sel:hover, nav a:hover {
		border-bottom-width:3px;
	}
	footer {
		padding:30px 0;
	}
}


@media screen and (max-width:445px) {
	.folders a span:nth-child(2) {
		top:3px;
	}
	.documents a {
		width:120px;
		height:200px;
		margin-right:5px;
	}
	.folders a {
		width:120px;
		height:99px;
		margin-right:5px;
	}
	.folders a span {
		font-size:11px;
	}
	.top span:first-child {
		display:none;
	}	
	.subcontact {
		float:none;
		text-align:center;
	}
	.legal {
		font-size:11px;
	}
	footer {
		padding:20px 0;
	}
	.sublogo {
		display:block;
		margin:20px auto;
	}
	.logo, .sublogo {
		width:120px;
	}
	.heading h1 {
		top:20px;
		font-size:18px;
	}
	.down {
		width:70px;
		bottom:-10px;
	}
	nav a {
		padding:3px 6px;
		font-size:14px;
	}
	nav a.sel, nav a.sel:hover, nav a:hover {
		border-bottom-width:2px;
	}
	.legal {
		text-align:center;
	}
	.legal span {
		display:block;
		margin-left:0;
		margin-top:5px;
	}
}