/*--------------------------------------------
>>>  TABLE OF CONTENTS
----------------------------------------------

1.0 - Fonts

2.0 - Reset

3.0 - Universal Styles

4.0 - Homepage Template
	4.1 - Header
	4.2 - Navigation
	4.3 - Base Navigation
	4.4 - Homepage Body
	4.5 - Footer

5.0 - Media Queries

----------------------------------------------
----------------------------------------------*/

/*--------------------------------------------
1.0 FONTS
----------------------------------------------*/


/* IMPORT FONTS */
@import url(https://fonts.googleapis.com/css?family=Raleway:400,300,500,600,700);
@import url(https://fonts.googleapis.com/css?family=Sanchez);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css);


/*--------------------------------------------
2.0 RESET
----------------------------------------------*/


/* RESET */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	font-family: 'Raleway', Arial, sans-serif;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}

/*--------------------------------------------
3.0 UNIVERSAL
----------------------------------------------*/


html, body {
    height: 100%;
}
.page-wrap {
    min-height: 100%;
    /* equal to footer height */
    margin-bottom: -120px;
}
.page-wrap:after {
    content: "";
    display: block;
}
.site-footer, .page-wrap:after {
    height: 120px;
}

ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
.clear {clear:both;}

/*   UNIVERSAL STYLES  */

.left {
	float: left;
}
.right {
	float: right;
}
.text-left {
	text-align: left;
}
.text-right {
	text-align: right;
}
.text-center {
	text-align: center;
}
.center {
	margin: 0 auto;
	float: none !important;
	display: block;
}


/*  COLORS  */
.yellow {color:#00AEEF;}
.gold {color:#FCB02A;}
.orange {color:#F47A20;}
.tangarine{color:#F05821;}
.mint{color:#D6ECDF;}
.green{color:#4EBA6F;}
.kelly {color:#008A62;}
.air {color:#F5F8FA;}
.light-grey {color:#bcbcbc;}
.grey{color:#8E8E8E;}
.dark-grey{color:#484848;}

/*   TEXT   */
h1, h2, h3, h4, h5, h6 {
	text-align: left;
	clear: both;
}
h1, h3, h5 {
	font-family:'Sanchez', Georgia, "Times New Roman", Times, serif;
	color:#484848;
}
h2, h4, h6 {
	font-family:'Raleway', Arial, sans-serif;
	color: #8E8E8E;
}
*:hover {  -webkit-transition: all .25s; /* Safari */
	transition: all .25s;
}
h1 {font-size:30px; line-height:44px; }
h2 {font-size:24px; line-height:32px; font-weight: 500; color:#484848; margin-bottom: 20px; }
h3 {font-size:22px; line-height:32px; margin-bottom: 8px; }
h4 {font-size:18px; line-height:28px; font-weight: 500; margin: 10px 0 }
h5 {font-size:16px; line-height:24px; }
h6 {font-size:14px; line-height:22px; font-weight: 500; margin: 15px 0 5px; }

p {
	font: normal 14px/21px 'Raleway', arial, sans-serif;
	color:#898989;
	font-weight:300;
	text-align: left;
	padding-bottom:10px;
}

a {
	font-family:'Raleway', Arial, sans-serif;
	color:#4EBA6F;
	font-size: 14px;
	line-height: 22px;
	text-decoration: none;
	cursor: pointer;
}

a:hover {
	color: #008A62;
}


.small {
    font-size:12px;
    line-height: 18px;
}
.large {
    font-size:16px;
    line-height: 24px;
}
.zero {
    margin:0 !important;
    padding: 0;
}

.h200 {	height: 200px;}
.h100 {	height: 100px;}
.l50 { margin-left:50px;}
.l10 { margin-left:10px;}
.w50 { width:50px !important;}

.orangebtn {
    border-radius: 4px;
    padding:9px 15px;
    background-color: #F47A20;
    border: 0;
    min-width: 115px;
    color: #fff;
    font-family: 'Raleway', Arial, sans-serif;
    font-size: 14px;
    margin-top: 12px;
    float: left;
}
/* CANCEL BUTTON */
.whitebtn {
    border-radius: 4px;
    padding:8px 15px;
    background-color: #fff;
    min-width: 115px;
    color: #F47A20;
    font-family: 'Raleway', Arial, sans-serif;
    font-size: 14px;
    margin-top: 12px;
    border: solid 1px #F47A20;
}
.whitebtn:hover {
    background-color: #bcbcbc;
    color: #fff;
	border: solid 1px #fff;
}
.largebtn {
    width: 280px;
}
.orangebtn.largebtn {margin-top: 0;}



.wrapper {margin:0 auto; text-align: center; clear: both; width: 100%;}
.container  {margin:0 auto;  max-width:1200px; padding: 0 40px;}


.bodycontent {
	padding:40px 0 0;
}
.greybg {
    background-color: #f9f9f9;
}


/*  MODAL   */

/* The Modal (background) */
.modal {
	display: none; /* Hidden by default */
	position: fixed; /* Stay in place */
	z-index: 1; /* Sit on top */
	padding-top: 100px; /* Location of the box */
	left: 0;
	top: 0;
	width: 100%; /* Full width */
	height: 100%; /* Full height */
	overflow: auto; /* Enable scroll if needed */
	background-color: rgb(0,0,0); /* Fallback color */
	background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal-content {
	background-color: #fefefe;
	margin: auto;
	padding: 34px 34px 50px;
	width: 580px;
	-webkit-box-shadow: -1px 3px 12px 0px rgba(0,0,0,0.2);
	-moz-box-shadow: -1px 3px 12px 0px rgba(0,0,0,0.2);
	box-shadow: -1px 3px 12px 0px rgba(0,0,0,0.2);
}

.modal-content h4 {color: #484848;}
.modal-content .data-col h3,
.modal-content .data-col h4{ padding-top: 11px;}
.modal-content h6 { font-weight: 200; font-size: 16px;}
/* The Close Button */
.close {
	color: #aaaaaa;
	float: right;
	font-size: 60px;
	font-weight: 200;
	line-height: 0px;
	margin-right: -10px;
}

.close:hover,
.close:focus {
	color: #000;
	text-decoration: none;
	cursor: pointer;
}



/*--------------------------------------------
4.1 HEADER
----------------------------------------------*/
/*   HEADER  */


header {
	background-color: #4eba6e;
	height:83px;
}
header a {
	color: #ffffff;
}
.logo {
	float:left;
	margin-top:4px
}
.icon {
	text-indent: -9999px;
}
.slance-icon {
	background: url("../images/slance-logo.svg") no-repeat;
	width:190px;
	height: 50px;
	display: inline-block;
}

.topnav-search {
	float:right;
	margin:0 40px 0 20px;
}
.topnav-search form {
	border-radius: 4px;
	margin:20px 0 0 0;
	width: 230px;
}

.topnav-search form input {
	border: none;
	font-weight: 500;
	float: left;
	padding:10px 40px 10px 10px;
	height: 20px;
	width: 180px;
}
.topnav-search form button {
	border: none;
	float: left;
	margin-left: -37px;
	background: transparent;
	font-size: 16px;
	padding: 10px;
	color: #8E8E8E;
}

.login-nav{
	float:right;
	margin:20px 30px 0 0;
}

header nav ul li {
	float: left;
	padding:10px 0 0 40px;
}
.logged-in {
	float:right;
	padding-top: 20px;
}
.logged-in * {
	float:left;
}
.user-name {
	padding:9px 15px 0 0;
	font-size: 14px;
	width: 150px;
	text-align: right;
}
.large-user-image {
	border-radius: 50px;
	max-width: 100px;
	vertical-align: middle;
	float: left;
	margin-right: 35px;
}
.user-image {
	border-radius: 25px;
	max-width: 50px;
	vertical-align: middle;
}
.medium-user-image {
	border-radius: 20px;
	max-width: 40px;
	vertical-align: middle;
}
.small-user-image {
	border-radius: 17px;
	max-width: 34px;
	vertical-align: middle;
	float: left;
}
.user-down-arrow {
	padding:10px 0 0 10px;
}

span.number-count {
	color: #fff;
	background-color: #F47A20;
	padding: 3px 7px 5px 7px;
	font-size: 10px;
	border-radius: 30px;
	position: relative;
	top: -13px;
}


/*--------------------------------------------
4.5 FOOTER
----------------------------------------------*/

footer {
	height: 120px;
	width: 100%;
	background-color:#8d8d8d;
	padding-bottom: 40px;
}

footer a,
footer p {
	color: #fff;
}

footer nav {
	margin-left: 100px;
	display: inline-block;
}
footer nav ul {
	width:200px;
	float:left;
	padding-top:40px;
}
footer nav ul li a {
	float: left;
	clear: both;
	padding:0;
	text-transform: uppercase;
	font-size: 11px;
	font-weight: 300;
}
footer nav ul li a:hover {
	color:#484848;
}

.copyright {
	margin-right:100px;
}

.copyright * {
	float: left;
	padding-right: 20px;
	margin-top:30px
}
.copyright p {
	font-size: 12px;
	padding-top:20px;
}



/* LOGIN */



.login-wrapper {
	width: 450px;
	margin: 0 auto;
	padding: 135px 0;
}
.login-box {
	border-radius: 4px;
	padding: 35px;
	border: solid 1px #E6EAED;
}
input[type="text"],
input[type="email"],
input[type="password"]{
	border-radius: 4px;
	padding:15px 10px 15px 15px;
	border: solid 1px #dfe3e9;
	background: #F5F8FA;
	float: left;
	margin-bottom: 15px;
	font-family: 'Raleway', Arial, sans-serif;
	font-size: 15px;
	color: #8d8d8d;
    width: 94%;

}
.login-box input[type="password"] {
	font-size: 29px;
	padding: 7px 15px;
}
.login-box button {
	border-radius: 4px;
	padding:15px;
	background-color: #F47A20;
	border: 0;
	width: 380px;
	color: #fff;
	font-family: 'Raleway', Arial, sans-serif;
	font-size: 14px;
	margin-top: 12px;
}
button:hover {
	background-color: #F05821;
}


/* SIGN UP */

p.checkbox  {
	float: left;
	padding: 20px 0 0 20px;
}

.work-hire div {
	float: left;
	width:172px;
	border-radius: 4px;
	border: solid 1px #dfe3e9;
	background: #F5F8FA;
	font-family: 'Raleway', Arial, sans-serif;
	font-size: 15px;
	color: #8d8d8d;
	margin:25px 30px 20px 0;
	height: 100px;
}
.work-hire div:hover {
	background-color:#4EBA6F ;
}
.work-hire div:hover p {
	color: #fff;

}
.work-hire div:last-child {
	margin-right: 0;
}
.work-hire div p {
	text-align: center;
	line-height: 80px;
}


/* SQUARED FOUR checkbox */
input[type=checkbox] {
	visibility: hidden;
}
.squaredFour {
	width: 20px;
	margin: 20px auto;
	position: relative;
	clear: both;
	float: left;
}
.squaredFour label {
	cursor: pointer;
	position: absolute;
	width: 20px;
	height: 0;
	top: 0;
	left:0;
	border-radius: 4px;
	border: solid 1px #dfe3e9;
	background: #F5F8FA;

		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfff4', endColorstr='#b3bead',GradientType=0 );
}
.squaredFour label:after {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	opacity: 0;
	content: '';
	position: absolute;
	width: 9px;
	height: 5px;
	background: transparent;
	top: 4px;
	left: 4px;
	border: 3px solid #fff;
	border-top: none;
	border-right: none;

	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
.squaredFour label:hover::after {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
	filter: alpha(opacity=30);
	opacity: 0.5;
}
.squaredFour input[type=checkbox]:checked + label:after {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	opacity: 1;
}



/* SELECT CATEGORIES */


section {
	display: none;
	padding: 20px 0 0;
}


section {
    background: #f8fafc;
}

section label {
    background: #fff;
    color: #9f9f9f;
    border: solid 2px #e4e7ec;
    margin: 5px !important;
}


section input:checked + label {
    background: #fff;
    color: #9f9f9f;
}
.work-tab,
.hire-tab {
	width:47%;
	height: 60px;
	padding: 45px 0 0;
}

.squaredFour input[type=checkbox]:checked + label {
	border-width: 1px;
}
.signup input[type=radio],
#skillsForm input[type=radio],
#skillsForm input[type=checkbox] {
	display: none;
}

label {
	display: inline-block;
	margin: 0 .7%;
	font-weight: 600;
	text-align: center;
	color: #595959;
	border: 2px solid #4eba6f;
	background:#f8fafc;
	border-radius:6px;
	width:23%;
	padding:10px 0;
	position:relative;
}
.tab-nav{
	font-family:'Sanchez', Georgia, "Times New Roman", Times, serif;
	font-weight:100;
}
label.first {
	margin-left:0;
}

label.last {
	margin-right:0;
}

label:before {
	font-family: fontawesome;
	font-weight: normal;
	display: block;
	margin: 0 auto;
	padding: 10px 0;
	font-size: 40px;
}

label[for*='1'].tab-nav:before { content: '\f044'; }
label[for*='2'].tab-nav:before { content: '\f1fc'; }
label[for*='3'].tab-nav:before { content: '\f1c9'; }
label[for*='4'].tab-nav:before { content: '\f140'; }

label:hover {
	color: #888;
	cursor: pointer;
}

input:checked + label {
	color: #fff;
	border: 2px solid #4eba6f;
	background: #4eba6f;
}

#skillsForm input[type='radio']:checked + label:after {
	content:"";
	width: 0;
	height: 0;
	border-left: 84px solid transparent;
	border-right: 84px solid transparent;
	border-bottom: 60px solid #f8fafc;
	display:block;
	position: absolute;
	left: 50%;
	margin-left: -84px;
	bottom: -70px;
}
#skillsForm input[type='radio']:checked + label.job-selector-label:after {
    display: none;
}

#tab1:checked ~ #content1,
#tab2:checked ~ #content2,
#tab3:checked ~ #content3,
#tab4:checked ~ #content4 {
	display: block;
}

section {
	background: #f8fafc;
	margin-top: 40px;
	padding: 40px;
}

section label {
	background: #fff;
	color: #9f9f9f;
	width:18%;
	margin-bottom: 20px;
	padding-top:60px;
	height: 60px;
	display: inline-table;
}


#skillsForm section input:checked + label {
	background: #fff;
	color: #9f9f9f;
}



/*  PROFILES   */

.fade-box {
    -webkit-box-shadow: -1px 3px 12px 0px rgba(0,0,0,0.2);
    -moz-box-shadow: -1px 3px 12px 0px rgba(0,0,0,0.2);
    box-shadow: -1px 3px 12px 0px rgba(0,0,0,0.2);
    margin-bottom: 26px;
    clear: both;
    background-color: #fff;
    display: inline-block;
	width: 100%;
}
.cover-image {
    width: 870px;
    height: 190px;
    background-color: #dfe3e9;
}
.cover-upload {
    position: absolute;
    top: 270px;
    margin-left: 260px;

}

.profile-main {
    width:870px;
    float: left;
}

.profile-aside {
    width:280px;
    float: left;
    padding-left: 50px;
}

.avatar-upload {
    position: absolute;
    margin-left: 31px;
    margin-top: -41px;
}
.avatar-upload img {
    border: solid 1px #dfe3e9;
    border-radius: 50px;
    width:88px;
}


.create-form input[type="text"],
.create-form input[type="password"] {
    padding:9px 15px;
    background-color: #fff;
}


.name-inputs{
    padding:12px 0 0 120px
}

.name-inputs input {
    width: 39%;
    float: left;
    margin-left: 20px;
}
.name-inputs p {
    float: left;
    font-size: 38px;
    font-weight:600 ;
    padding-left: 5px;
}
/* View Profile Pages */

.name-inputs h1,
.name-inputs h3 {
    float:left;
    padding:0 0 7px 12px;
    clear: none;
}
.name-inputs h3 {
    padding-top: 8px;
}
.rating {
    padding: 14px 30px;
    text-align: right;
}
.fa-star,
.fa-star-half-o{
    color:#fcb02a;
    font-size: 12px;

}

.full-body {
	padding: 18px 26px 48px ;
	width:1118px;
	min-height: 500px;
}
.profile-body {
    padding: 18px 26px 48px ;
    width:818px;
}


.jobpost {
	float: left;
	width: 44%;
	margin-right: 4%;
	padding: 2%;
	clear: none;
	height: 300px;
}

.jobpost:nth-child(2n) {
	margin-right: 0
}

p.post-detail {
	float: left;
	margin-right: 26px;
}
p.post-detail strong {font-weight: 600; color: #484848; font-size: 16px;}

.major-info {
    width:55%;
    float:left;
}
.major-info input[type="text"] {
    width: 87%;
}
.major-info span {
    padding-top: 11px;
    display: inline-block;
    color: #a0a0a0;
}
.university-info {
    width:41%;
    float:left;
}

.gpa-info {
    width: 100px;
    float: left;

}

.type-info {
    width: 250px;
    float: left;
    padding-left: 50px;
}
.type-info select {
    float: left;
}

select {
    -webkit-appearance: button;
    -webkit-border-radius: 2px;
    -webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
    -webkit-padding-end: 20px;
    -webkit-padding-start: 2px;
    -webkit-user-select: none;
    background-image:url("../images/down-arrow.png"), -webkit-linear-gradient(#fff, #fff 1%, #f5f6f7);
    background-position: 100% center;
    background-repeat: no-repeat;
    border: 1px solid #dfe3e9;;
    color: #555;
    font-size: inherit;
    overflow: hidden;
    padding: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;
    font-family: 'Raleway';
    font-size: 14px;
    color:#a0a0a0;
    font-weight: 500;
}
select:after {
	font-family: fontawesome;
	content: '\f107';
	font-size: 34px;
	color:#484848;
	float: right;

}

textarea {
    width: 94%;;
    border-radius: 4px;
    padding:15px;
    border: solid 1px #dfe3e9;
    float: left;
    margin-bottom: 15px;
    font-family: 'Raleway', Arial, sans-serif;
    font-size: 15px;
    color: #8d8d8d;
    min-height: 60px;

}

a.add-plus {
	display: block;
	margin-top: 15px;
}

.add-plus i {
	vertical-align: middle;
	margin-right: 5px;
}
.url-info {
    width:65%;
    float:left;
    margin-bottom: 20px;
}
.url-info i {
    color: #e5e7ec;
}
.url-info input[type="text"] {
    width: 65%;
}

.uploader-container {
	position: relative;
}

.uploader-container .top {
	width: 100%;
	clear: both;
}

.uploader-container .top .left {
	float: left;
	width: 250px;
}

.uploader-container .top .right {
	float: left;
	margin-left: 20px;
}

.uploader-container .bottom {
	width: 100%;
	clear: both;
}

.clear {
	clear: both;
}

.file-upload {
    border-radius: 4px;
    border: 4px dashed #dfe3e9;
    background-color: #f8fafc;
    width: 250px;
    padding: 40px 0 20px;
    margin:10px 0 30px;
}
.file-upload p {text-align: center;}
.file-upload i {
    color: #e2e3e9;
}

.file-upload.active {
	background-color: #EBF4FC;
}

.file-upload label.btn {
	width: auto;
}

.file-upload-progress-container {
	border-radius: 4px;
	border: 4px dashed #dfe3e9;
	background-color: #f8fafc;
	width: 490px;
	padding: 10px 15px;
	margin:10px 0 30px;
}



.file-upload-progress-container p.demo-note {
	text-align: center;
}

/* D&D Demo */
.demo-panel-files {
	max-height: 290px;
	min-height: 290px;
	overflow: auto;
	cursor: default;
}

.demo-file-id {
	font-weight: bold;
}

.demo-file-size{
	font-style: italic;
	color: gray;
	font-size: 90%;
}

.demo-file-status,
.demo-file-status-default{
	color: gray;
}

.demo-file-status-error{
	color: #990000;
}

.demo-file-status-success{
	color: #009900;
}

.demo-image-preview {
	float:left;
	margin-right: 10px;
	margin-top: 4px;
	height: auto;
	width: 56px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}

.demo-panel-file {
	color: #898989;
	font: 300 14px/21px "Raleway",arial,sans-serif;
	text-align: left;
	clear: both;
	margin-bottom: 25px;
	float: left;
	width: 100%;
}

.demo-panel-file .img-preview-container {
	width: 56px;
	float: left;
}

.demo-panel-file .upload-info-container {
	float: left;
	margin-left: 12px;
	width: 83%;
}

.blink_me {
	animation: blinker 0.5s linear 2;
}

@keyframes blinker {
	50% { opacity: 0.0; }
}


#amount {padding-left: 0; }
#slider {
    margin-top:10px;
    width: 350px;
}
.ui-widget-content {
    background: #dfe3e9 !important;
    border: none !important;
}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {

    background: #fcb02a !important;
    border-color: #fcb02a !important;
}


.client-info input[type="text"] {
    width:48%;
    margin-bottom: 24px;
}

#phone1,
#phone2,
#phone3,
#phone4 {
    float:left;
    width:27px;
    margin-right:12px;
}
#phone3 {
    width: 40px;
}
#phone4 {
	width: 45px;
}
.extension {
	float: left;
	margin-right: 5px;
	padding-top:18px;
	font-size:14px;
	color: #8E8E8E;
}
ul.tags {
    display: table;
    margin-bottom: 20px;
}
ul.tags li {
    float: left;
    padding:3px 6px;
    background-color: #ededed;
    border-radius: 4px;
    margin-right: 8px;
    font-size: 12px;
    color: #9e9e9e;
	margin-bottom: 9px;
}

.show-mo {
    display: block;
    background-color:#F5F8FA;
    border:1px solid #bcbcbc;
    padding:6px;
    margin:30px 0 10px;

}
.aside-main a i {
    margin-right:14px;
    font-size: 22px;
	min-width: 22px;
}
.aside-main {
    height: 280px;
}
.aside-details {
    clear: both;
}

.progress-bar {
    border-radius: 3px;
    border: solid 1px #bababa;
    margin: 0 0 8px 0;
    width: 278px;
    overflow: hidden;
}
.progress-bar p {
    font-size: 12px;
    font-weight: 600;
    color: #fff;
    padding: 0 ;
    float: left;
    text-align: center;

}
.bar33 p {width:33%; background-color: #d0d2d5;}
.bar66 p {width: 66%; background-color: #ffd73e}
.bar100 p {width: 100%; background-color: #4eba6e}

ul.portfolio {
    display: inline-block;
}
ul.portfolio li{
    float: left;
    margin-right: 30px;
    width: 250px;
    height: 174px;
    overflow: hidden;
}
ul.portfolio li:nth-child(3n){
    margin-right: 0;
}





/********   ACCOUNT SETTINGS *********/



.account-main {
    width:870px;
    float: left;
    padding-left: 50px;
}

.account-aside {
    width:280px;
    float: left;
}.account-body {
     padding: 18px 26px 48px ;
     width:818px;
 }



.account-nav li {
    clear: both;
    float: left;
    display: inline-block;
    border-bottom: solid 1px #e6e9f0;
    text-align: left;
    width: 100%;
}
.account-nav li:last-child {border: none;}
.account-nav li a span {
    display: inline-block;
    margin-top: 20px;
	color: #484848;
	font-weight: 500;
}
.account-nav li a:before {
    font-family: fontawesome;
    font-weight: lighter;
    display: inline-block;
    float: left;
    margin: 10px 10px 10px 0;
    padding: 10px ;
    font-size: 22px;
    border-radius:4px ;
    background-color:#e6e9f0 ;
    width: 24px;
    text-align: center;
    color: #8e8e8e;
}
.account-nav li.selected a:before {
    background-color:#FCB02A ;
    color: #fff;
}
.account-nav li.account-info a:before { content: '\f007'; }
.account-nav li.how-to-pay a:before { content: '\f09d'; }
.account-nav li.payment-history a:before { content: '\f1da'; }
.account-nav li.settings a:before { content: '\f013'; }

.short-form {
    width:50% !important;
	float: left;
}
.expiry {
    width: 60%;
}
select.date-month {width:48%;}
select.date-day {width:20%;}
select.date-year {width:27%;}
.cvv {
    margin-left: 50px;
    width: 22%;

}
.cvv h6 {margin-bottom: 5px;}
.cvv input{width: 100%; }

.country select{width:60%;
    float: left;
}
.city {width: 60%;}
.city input {
    width: 95%;
}
.postal-code {width: 30%; margin-left: 30px;}
.postal-code input{width:91%;}


.notifications {
	min-width: 450px;
}

.notifications div {
    float: left;
}
.notifications p {
    padding: 10px 20px;
}
.notifications .squaredFour {
    margin-top: 8px;
}



/* SWITCHES */

/* The switch - the box around the slider */
.switch{
    clear: both;
    padding-bottom: 5px;
    display: inline-block;
    float: left;
}
.switch label {
    position: relative;
    display: inline-block;
    width: 54px;
    height: 28px;
    border: none;
    margin: 0 20px 0 0;
    padding: 0;
}
.switch p {padding-top: 6px;}
/* Hide default HTML checkbox */
.switch input {display:none;}

/* The slider */
.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

.slider:before {
    position: absolute;
    content: "";
    height: 22px;
    width: 22px;
    left: 3px;
    bottom: 3px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

input:checked + .slider {
    background-color: #4EBA6F;
}

input:focus + .slider {
    box-shadow: 0 0 1px #4EBA6F;
}

input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
    border-radius: 28px;
}

.slider.round:before {
    border-radius: 50%;
}


/**   PAYMENT HISTORY       */


.table-header {
	padding:18px 26px 38px ;
}
select.slancer-select {
	width: 250px;
	margin-right: 40px ;
}

.total {
	color: #484848;
	font-size:28px;
}


/*------------------

TABLES

------------------*/


table {
	width: 100%;
}
th {
	border-top:solid 1px #e6e9ee;
	border-bottom:solid 1px #e6e9ee;
	background-color:#f4f8fb;
	padding:10px;
	color: #484848;
	font-size: 14px;
	font-weight: 500;
	text-align: left;
}
td {
	padding: 15px 10px;
	text-align: left;
	border-bottom:solid 1px #e6e9ee;
	font-size: 14px;
	vertical-align: middle;
	min-height: 30px;
}

th:first-child,
td:first-child {
	padding-left: 18px;
}


.pagination {
	margin-top: 12px;
	color:#8793a9;
	font-size:12px;

}
.pagination a i {
	padding: 10px 15px;
	border-radius: 4px;
	border: 1px solid #e5e5e5;
	margin:0 30px;
	color: #8793a9;
}

.pagination a:hover i {
	color:#fff;
	background-color: #4eba6f;
}

.title-col {
    float: left;
    width: 100px;
    clear: both;
    padding-top: 14px;
}
.data-col {
    float: left;
    width: 460px;
	padding-top: 14px;

}
.data-col img,
.data-col h4 {
    float: left;
    clear: none;
    margin: 0 15px 15px 0;
}

.accordion-date {
    margin-top:10px;
}

.fa-calendar {
    margin-left: 10px;
}
.date-dropdown {
    border-top:solid 1px #e6e9ee;
    background-color:#f4f8fb;
    padding:10px;
    color: #484848;
    font-size: 14px;
    font-weight: 500;
    text-align: left;
    margin: 15px 0 0;
    height: 40px;
}
.date-dropdown select {
    float: left;
    margin-right: 10px;
}
.date-dropdown h4 {
    float: left;
    display: block;
    clear: none;
    margin-right: 10px;
    line-height: 20px;
}
.date-dropdown .date-month { width:120px}
.date-dropdown .date-day {width: 70px;}
.date-dropdown .date-year { width: 90px}
.date-dropdown button {
    float: right;
    margin-top:4px;
}



.job-post-type li {
	float: left;
	width:155px;
}
.job-post-type h4 {
	margin:0;
}

.aside-main p span {
	width: 100px;
	display: inline-block;
}



.make-offer .data-col {
	width:910px;
}
.make-offer .data-col h4,
.make-offer .data-col h3{
	margin-top: 10px;
}
.make-offer .data-col p{
	margin-top:4px;
}
.fund-job .title-col {
	width: 160px;
}

.milestone {
	margin-top:40px;
}
.milestone input[type="text"] {
	padding: 9px 15px;
	background-color: #fff;
	margin-bottom: 0;
	padding-right: 0;
}

.milestone .fa-calendar {
	position: absolute;
	margin-left: -28px;
	margin-top: 12px;
}
.milestone a {
	display: block;
}

.how-it-works-side {
	width:40%;
	float: left;
	padding-left: 10%;
}

.numberdisc {
	clear: both;
	margin: 20px 0 0;
	display: inline-block;
}

.numberdisc h1 {
	padding: 13px 24px 5px;
	border-radius: 35px;
	color:#fff;
	line-height: 47px;
	float: left;
}
.numberdisc p {
	float: left;
	width: 67%;
	padding-left: 8%;
}

.n1 h1 {background-color:#ffd83f;}
.n2 h1 {background-color:#FCB02A;}
.n3 h1 {background-color:#F47A20;}


/*Temporary third-party-logos  */
.third-party-logos {
	vertical-align: bottom;
	position: relative;
	top: 35px;
	left: 59px;
  }


.job-selector {
    height:120px;

}
.job-selector-label {
    width:180px;
    height:100px;
    float: left;
    line-height: 100px;
}

.budget-price {
	width: 140px;
	float: left;
	margin-right: 63px;
}
.budget-price input {
    padding-left:30px;
}
.budget-price p {
    position: absolute;
    margin: 10px;
}


.start-end-date input[type=checkbox]:checked {

}

.start-end-date {
	clear: both ;
   	padding-top:20px;
	display: none;
}

.start-date p,
.end-date p {
    float:left;
    padding: 10px 15px 0 0;
}

.start-date,
.end-date {
    width:260px;
    float: left;
}

.start-end-date .fa-calendar {
	position: absolute;
	margin-left: -55px;
	margin-top: 13px;
}

.start-end-date a {
	display: block;
}



.radiobox {
	display: none;
	clear: both;
}


.dashboard-head {
	border-bottom: solid 1px #f2f2f2;
	padding: 30px 0;	
	height: 100px;
}

.job-stats {
	float: right;
}

.job-stats div {
	float: left;
	border-radius: 3px;
	color:#fff;
	width:90px;
	height: 80px;
	font-size: 14px;
	margin-right: 20px;
}
.job-stats span {
	font-size: 38px;
	clear: both;
	display: block;
	font-family:'Sanchez', Georgia, "Times New Roman", Times, serif;
	padding-top: 15px;
	font-weight: lighter;
}
div.offer-box {
	background-color:#4EBA6F ;
}
div.active-box {
	background-color:#FCB02A ;
}
div.past-box {
	background-color:#8E8E8E ;
	margin-right: 0;
}


.recent-favorites {
	padding: 10px 0;
}

.recent-favorites h6,
.recent-favorites a {
	float: left;
	margin-right: 20px;
}
.recent-favorites a {
	margin-top: 15px;
}
.recent-favorites ul {
	clear: both;
}
.recent-favorites ul li {
    float: left;
    min-width: 140px;
	padding-bottom:24px;
}
.recent-favorites ul li img,
.recent-favorites ul li h6 {
    float: left;
    clear: none;
    margin-right: 10px;
}


.dashboard .jobpost {
	width: 28%;
	height: 350px;
	margin-right: 2%;
}

.dashboard .jobpost:nth-child(2n) {
	margin-right: 2%;
}
.dashboard .jobpost:nth-child(3n) {
	clear: both;

}
.dashboard .jobpost:nth-child(3n+2) {
	margin-right: 0;
}
.dashboard p.post-detail {
	margin-right: 16px;
}
.dashboard p.post-detail:last-child {
	margin-right: 0;
}

.jobpost-top {
	height: 250px;
}

.offered-job>h2,
.offered-job>p {
	float: left;
	margin:20px 10px 10px 0 ;
}
.offered-job>p {
	margin-top: 28px;
}




/*--------------------------------------------
5.0 MEDIA QUERIES
----------------------------------------------*/



@media (max-width: 1200px) {
    footer nav ul li:first-child a {
        padding-left: 0;
        clear: both;
    }
    footer nav ul {
    }

}


@media screen and (max-width: 650px) {
    label {
        font-size: 10px;
    }
    label:before {
        margin: 0;
        font-size: 18px;
    }

    section {
        padding:10px;
    }
}

@media screen and (max-width: 400px) {
    label {
        padding: 15px;
    }
}

@media screen and (max-width: 910px) {
    label {
        width:45%;
        margin:0;
        margin-bottom:20px;
    }

    label.first {
        margin-right:10px;
    }

    label.last {
        margin-left:10px;
    }

}


@media screen and (max-width: 796px) {
    label {
        width:45%;
    }
}

@media screen and (max-width: 474px) {
    label {
        width:100%;
        margin: 0 !important;
        margin-bottom: 20px !important;
    }

    section label {
        width: 45%;
        margin: 5px !important;
    }

}


@media screen and (max-width: 475px) {
    section label {
        width: 45%;
        margin: 10px 5px !important;
    }
}

@media screen and (min-width: 911px) {

    #skillsForm input[type='radio']:checked + label:after {
        content:"";
        width: 0;
        height: 0;
        border-left: 84px solid transparent;
        border-right: 84px solid transparent;
        border-bottom: 60px solid #f8fafc;
        display:block;
        position: absolute;
        left: 50%;
        margin-left: -84px;
        bottom: -70px;
    }

    section {
        margin-top: 40px;
        padding: 40px;
    }
    section label {
        width: 17%;
        margin: 10px 5px !important;
    }
}