/* Read me!!! */
/* Please note that when creating the buttons styles for back refer a friend and apply, this is how it should be: */
/* Back - needs to be white with a grey border */
/* Refer a Friend - needs to be white with a grey border */
/* Apply - need to be their colours and to be same width as refer a friend */
/* Same goes for Cancel and Continue buttons: */
/* Cancel - needs to be white with a grey border */
/* Continue - their colours and same size as the Apply button */

/* On mobile: */
/* Remove the Back button */
/* Apply and Refer a friend - need to be 100% */
/* Same for Cancel and Continue - need to be 100% */


.col-lg-1, .col-lg-2, .col-lg-3, 
.col-lg-4, .col-lg-5, .col-lg-6,
.col-lg-7, .col-lg-8, .col-lg-9,
.col-lg-10, .col-lg-11, .col-lg-12
{
    float:left;
}

.col-lg-1
{
    width:8.33333333%;
}

.col-lg-2
{
    width:16.66666667%;
}

.col-lg-3
{
    width:25%;
}

.col-lg-4
{
    width:33.33333333%;
}

.col-lg-5
{
    width:41.66666667%;
}

.col-lg-6
{
    width:50%;
}

.col-lg-7
{
    width:58.33333333%;
}

.col-lg-8
{
    width:66.66666667%;
}

.col-lg-9
{
    width:75%;
}

.col-lg-10
{
    width:83.33333333%;
}

.col-lg-11
{
    width:91.66666667%;
}

.col-lg-12
{
    width:100%;
}

a 
{
    text-decoration: none;
    color: #000;
    font-weight: 700;
    -moz-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

a:hover
{
    text-decoration:underline;
}

body
{
    font-family:"Open sans", Arial, Helvetica, sans-serif;
    color: #333333;
    background-color: #fff;
    margin:0;
    font-size:16px;
}

.container {
    width:100%;
    max-width:1200px;
    position:relative;
    margin:auto;
}

.main-container
{
    max-width:1000px;
    width:100%;
}

.col-6
{
    width:50%;
    float:left;
}

.links-inner a
{
    display: inline-block;
    margin: 0;
    padding: 5px 20px;
    background-color: #fff;
    color: #000;
    border-radius: 3px;
    border:1px solid #fff;
    min-width:120px;
    text-align:center;
}

.links-inner a:hover
{
    opacity:0.8;
    text-decoration:none;
}

.links-inner 
{
    text-align:right;
}

.clearfix:before,
.clearfix:after {
  content: " ";
  display: table;
}
.clearfix:after {
  clear: both;
}

#firefish .pageTop
{
    border-top: 5px solid #1e1e1e;
    padding: 20px 30px 15px 30px;
    margin: 0px;
    background:#1e1e1e;
}

#firefish #footer
{
    margin-top: 0;
    padding: 30px;
    background: #1e1e1e;
    color: #fff;
    position: relative;
    font-size:13px;
}

#firefish #footer a
{
    color:#fff;
    text-decoration:none;
    font-weight:normal;
}

#firefish #footer a.ff-powered-by-rec-lgn
{
    font-weight:700;
}

#firefish #footer a.ff-powered-by-rec-lgn:hover
{
    text-decoration:underline;
}

#firefish #footer .footer-email
{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#firefish .p-f
{
    margin-bottom:10px;
}

#firefish .contentArea
{
    margin:5% 1% 5% 1%;
}

#firefish #advertSearchArea
{
    margin-left:20%;
    margin-right:20%;
    margin-bottom:2%;
}

.ff-powered-by {
	text-align: right;
}

/* General */
#firefish input {
	vertical-align: middle;
}
#firefish input[type=password],
#firefish input[type=text],
#firefish input[type=file],
#firefish select,
#firefish textarea {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
    width: 94%;
    padding: 11px 10px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid #ddd;
}

#firefish #advertSearchArea input[type=password],
#firefish #advertSearchArea input[type=text],
#firefish #advertSearchArea input[type=file],
#firefish #advertSearchArea select,
#firefish #advertSearchArea textarea {
    width:100%;	
}

#firefish input[type=submit],
#firefish input[type=button],
#firefish button {
	-moz-box-sizing: border-box; -webkit-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box;

    background-color: #000;
    border:1px solid #000;
    display: inline-block;
    padding: 6px 20px;
    margin-bottom: 0;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.5;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    border-radius: 5px;
    white-space: nowrap;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    color: white;
    width:auto;
    height:auto;
}

#firefish input.btn-apply,
#firefish input.btn-go-profile
{
    background-color:#E51837;
    border:1px solid #E51837;
    min-width:116px;
}

#firefish input.btn-back,
#firefish input.btn-refer,
#firefish input.btn-cancel,
#firefish input.btn-prev
{
    color:#a5a5a5;
    border:1px solid #ccc;
    background-color:#fff;
}

#firefish input[type=submit]:hover,
#firefish input[type=button]:hover,
#firefish button:hover 
{
    opacity:0.7;
}

#firefish input[type=submit]:focus,
#firefish input[type=button]:focus,
#firefish button:focus 
{
    outline:none;
}

#firefish input.btn-back:hover,
#firefish input.btn-refer:hover,
#firefish input.btn-cancel:hover,
#firefish input.btn-prev:hover
{
    opacity:0.7;
}

.ie8 #firefish input[type=submit],
.ie8 #firefish input[type=button],
.ie8 #firefish button {
	min-height: auto;
}
#firefish .inputButtonBig {
	min-width: 130px; }
#firefish .inputButtonBigger {
	min-width: 150px; }
#firefish .inputButtonBig {
	min-width: 130px; }
#firefish .inputButtonBigger {
	min-width: 150px; }
#firefish table {
	table-layout: fixed;
}
#firefish .webWidgetFormField {
	width:94%;
	*width:90%;
}

/* Search fields */
#firefish #advertSearchArea FIELDSET{
	border-width:0;
	margin: 0;
	padding: 0;
}
#firefish #advertSearchArea dl {
    float: none; 
    display: block; 
    clear: both; 
    margin: 0; }
#firefish #advertSearchArea dt, 
#firefish #advertSearchArea dd {
    float: left; 
    margin: 0; 
    padding: 0; 
    padding-bottom: 3px;
}
#firefish #advertSearchArea dd { 
    width: 100%;
}
#firefish #advertSearchArea dt {

}
#firefish #advertSearchArea dl.searchButtons dt {
	display: none;
}
#firefish #advertSearchArea dl.searchButtons dd {
	width: 100%; 
	text-align: right;
}

/* Advert Rows/advert Item styles */
#firefish .attract .title {
	margin-top: 10px;
}
#firefish .attract .title .main,
#firefish .attract .title h1
{
    font-size:30px;
    margin-bottom:8px;
    line-height:40px;
}

#firefish .attract .title .main span,
#firefish .attract .title h1
{
    font-weight:bold;
    margin-bottom:8px;
    margin-top:0;
}

#firefish .attract .title h1
{
    margin-bottom:3%;
}

#firefish .attract .title .extra {
    padding: 3px; 
    padding-top: 0;
    padding-left: 0;
    font-size:14px;
    font-weight:700;
    margin-bottom:3px;
}
#firefish .attract .title .logoArea {
    float: right; 
    width: 90px; }
#firefish .attract .title .logoAreaContent {
    padding: 3px; }
#firefish .attract .advertArea {
    vertical-align: top;
    margin-top:7px;
}
#firefish .attract .advertArea .advertBody {
    padding: 3px 0; 
    line-height:25px;
}
#firefish .resultsGrid {
    border-collapse: separate;
    width: 100%;
    text-align: left; }
#firefish .resultsRow span {
    vertical-align: middle; }
#firefish .resultsRow td.resultsRowCell 
{
    border-top:1px solid #eee;
    border-bottom:1px solid #eee;
}
#firefish .resultsRow td.resultsRowCell 
{
    border-top: @advert_item_border_seperator@;
    border-bottom: @advert_item_border_seperator@;
    margin: 0px;
    margin-bottom: 2px;
    padding: 3px;
    cursor: default;
}

/* Pager Control */
#firefish .pager 
{
    font-size:14px;
    margin-top:10px;
}

#firefish .pager a
{
    font-weight:normal;
}

#firefish .pager a.selected
{
    font-weight:700;
}

#firefish .pager td {
    padding: 5px;
    width:15%;
}

#firefish .pager td.pages
{
    text-align:left;
}

#firefish .pager td.recordsWithLogo 
{
    width:28%;
    text-align: left;
    padding-left: 0px;
}
#firefish .pager .pagerPageLinks 
{
    text-align: center;
    width:70%;
}
#firefish .pager .pagerPageLinks a {
    padding: 4px;
    text-decoration: none;
}
#firefish .pager .pagerPageLinks a.selected
{
    font-weight: bold;
    padding: 4px;
}
#firefish .pager .pagerPageLinks a:hover {
    text-decoration: underline;
}
#firefish .pager .pagerLogo {
    width:28%;
    background: url('https://resource.firefishsoftware.com/img/firefish/red/22x29/firefish.png') no-repeat bottom right;
    text-align: right;
    padding-right: 25px;
}
#firefish .pager .records {
    text-align: right;
    width:15%;
}

/* advert view styles */
#firefish .candidateAdvertApplicationArea {
	text-align: left;
}
#firefish .candidateAdvertApplicationArea .candidateAdvertApplication {
	background-color: transparent;
	padding: 0;
}
#firefish .candidateAdvertApplicationArea .requiredFieldIndicator,
#firefish .registrationTable textarea + .requiredFieldIndicator
{
    width: 5px;
    display: inline-block;
    padding-left: 5px;
    vertical-align:top;
}
#firefish table.advertApplicationTable td.advertApplicationFieldDescription,
#firefish .registrationTable .registrationDescription {
    width: 40%; 
    text-align: left; 
    vertical-align: middle;
    padding-top: 3px 
}
#firefish div.candidateAdvertApplication table.advertApplicationTable .ad-cvr-ltr .requiredFieldIndicator,
#firefish .registrationTable textarea + .requiredFieldIndicator {
	float: none;
}
#firefish div.candidateAdvertApplication table.advertApplicationTable .ad-cvr-ltr td {
	vertical-align:top;
}
#firefish div.advertApplicationButtonArea {
    text-align: right;
    padding-top: 12px;
    padding-bottom: 12px; 
    padding-right: 15px;
    *padding-right: 10px;
 }
 /* popup styles */
 #firefish .advertLogin .advertLoginDescription{
	width:20%;
}
 #firefish .advertLogin .advertLoginDataCell{
	width:60%;
}
 #firefish .advertLogin .advertLoginLinkCell{
	width:20%;
}
#firefish .advertLogin .row-err {
	text-align: left;
}
#firefish .errorText,
#firefish .forgottenPasswordError {
	color: #f00; 
}
/* misc styles*/
#firefish .forgottenPassowrdTable,
#firefish .contactFormTable
{
    min-width:60%;
}

.homePageLogo img
{
    max-width:100%;
}

#firefish .AdvertReferral .col-one
{
    width:40% !important;
}

/*Template site styles*/

#firefish .defaultPageText
{
    font-size:20px;
    font-weight:bold;
    color:#666;
}

div.questionnaire div.questions table td.vlu label
{
    margin-left:3px;
    margin-right:3px;
}

div.questionnaire div.questions table label
{
    display:inline-block;
}

div.questionnaire div.questions input[type="radio"]
{
    margin-top:0;
}

.forgottenPasswordContainer table.forgottenPassowrdTable,
.forgottenPasswordContainer table.contactFormTable
{
    width:100%;
}

span.datepicker input[type="image"] {
    margin-left: -24px;
    margin-top: -0px;
    margin-top: -2px\9;
}

.registration-indented
{
    width:95%;
}

.social-media img
{
    width:32px;
    height:32px;
}

.social-media 
{
    text-align:right;
    margin-bottom:4%;
}

.social-media p
{
    text-align:right;
}

#footer h4
{
    margin: 5px 0 20px 0;
    font-size: 19px;
    line-height: 29px;
}

.apply-top a
{
    background-color: #000;
    color: #fff;
    padding: 15px 50px;
    display: inline-block;
    border-radius: 5px;
    margin-bottom: 15px;
    text-align:center;
    min-width:140px;
    text-decoration:none;
    border:1px solid #000;
    font-size:20px;
}

.apply-top a:hover
{
    opacity:0.7;
}

#footer iframe
{
    border:none;
}

.social-media a:hover img
{
    opacity:0.8;
}

.flex
{
    display:flex;
    align-items:center;

   -webkit-flex-direction: row;
   flex-direction: row;
   -webkit-justify-content: flex-end;
   justify-content: flex-end;
}

.ff-powered-by p
{
    padding: 0;
    margin: 0;
    display: inline-block;
}

.ff-powered-by p:first-of-type 
{
    margin-right: 5px;
    margin-top:7px;
}

/*Mobile Styles*/

@media only screen and (max-width: 767px) 
{
    #firefish input.btn-back
    {
        display:none;
    }

    #firefish input[type="button"],
    #firefish input[type="submit"]    
    {
        width:100%;
    }

    .apply-top a
    {
        width:100%;
        padding-left:0;
        padding-right:0;
    }
}

@media only screen and (max-width: 767px)
{
    #firefish #advertSearchArea
    {
        margin-left:0;
        margin-right:0;
    }
}

@media only screen and (max-width: 981px)
{
    table.AdvertReferral 
    {
        width:100%;
    }
}

@media only screen and (max-width: 767px)
{
    div.registrationArea input.textbox,
    div.registrationArea select
    {
        width:100%;
    }

    .landingPage
    {
        margin:0;
    }

    .registrationPage .registrationTable td
    {
        display:block;
        width:100%;
    }

    .steveCalendar td
    {
        display:table-cell !important;
        width:auto !important;
    }

    div.registrationArea input.webWidgetFormField, 
    div.registrationArea textarea, 
    div.registrationArea select
    {
        width:75%;
    }

    div.registrationArea select.webWidgetFormField_Small
    {
        float:left;
    }

    #firefish #advertSearchArea dd
    {
        width:100%;
    }
}

/*Request A Vacancy*/
@media only screen and (max-width: 767px)
{
    .vacancyRequest td
    {
        display:block;
        width:100%;
        text-align:left !important;
    }
}

/*Contact Us*/
@media only screen and (max-width: 630px)
{
    .contact-us-form td
    {
        display:block !important;
		float:left !important;
        width:96%;
        text-align:left !important;
    }
}

/*Forgotten Password*/
@media only screen and (max-width: 630px)
{
    .forgottenPassowrdTable td
    {
        display:block !important;
		float:left !important;
        width:96% !important;
    }
    .contactFormTable
    {
        margin-left: 0px;
    }
    .forgottenPassowrdTable td input.textbox,
    .forgottenPassowrdTable td textarea,
    .contactFormTable input.textbox,
    .contactFormTable textarea
    {
        width:91% !important;
    }
}

/*Pager Mobile*/
@media only screen and (max-width: 767px) 
{
    #firefish .pager .pages,
    #firefish .pager .records
    {
        display:none;
    }
}

@media only screen and (max-width: 767px)
{    
    table.pager .pages {
        text-align: left;
        width: 20%;
        padding-bottom: 3px;
    }
    table.pager td.pagerPageLinks {
        width: 100%;
    }
    table.pager .records
    {
        text-align:right;
    }
    tr.resultsEmptyData {
        text-align: center;
    }
}

/*Advert Page*/
@media only screen and (max-width: 767px)
{
    .attract .title .main,
    .attract .title h1
    {
        line-height:25px;
    }

    #advertSearchArea fieldset dl
    {
        margin:0;
    }
    #advertSearchArea dd
    {
        width:100%;
    }
    #advertSearchArea dt
    {
        width:100% !important;
    }

    .attract .advertApplicationButtonArea
    {
        text-align:left !important;
    }
}

/*Refer a friend*/
@media only screen and (max-width: 767px)
{
    .attract .AdvertReferral
    {
        width:100% !important;
    }

    .attract .AdvertReferral td
    {
        display:block !important;
        width:100% !important;
		float:left !important;
		
        text-align:left !important;
    }
}

/*Advert Page*/
@media only screen and (max-width: 767px)
{	
	.attract .advertApplicationTable td
	{
        display:block !important;
		float:left !important;
        width:100% !important;
    }
	
	div.candidateAdvertApplication table.advertApplicationTable textarea
      {
        width:95% !important;
    }
}

/*Buttons*/
@media only screen and (max-width: 767px)
{
    #firefish input[type=submit],
    #firefish input[type=button],
    #firefish button
    {
        margin-bottom:5px;
    }
}

/*Sign in popup*/
@media only screen and (max-width: 767px)
{
    #firefish .advertLoginTable td
    {
        display:block !important;
		float:left !important;
        width:100% !important;
    }
}

@media only screen and (max-width: 450px)
{
    .candidateAdvertApplicationArea .mdl-wrap .modalPanel
    {
        width:280px !important;
    }

    .candidateAdvertApplicationArea .mdl-wrap .modalPanel .UploadMain.UploadBody input[type="file"]
    {
        display:block;
        width:100%;
    }

    .ffLogin .advertLoginTable td
    {
        display:block;
    }
}

@media only screen and (max-width: 767px)
{
    .homePageLogo.five.columns
    {
        width:auto !important;
    }

    #footer .eleven.columns
    {
        width:auto !important;
    }
}

div.mdl-wrap div.mdl-body {
    overflow:hidden !important;
}

@media (min-width: 767px) and (max-width: 1040px) {
    iframe
    {
        width:95%;
        height:auto;
    }
}

@media (max-width: 1070px) {    
    .main-container .contentArea
    {
        margin:5% 6% !important;
    }
}

@media (max-width: 767px) {
    .col-sm-12 {
        width: 100%;
        float: none;
    }

    .social-media
    {
        text-align:left;
    }

    .pageTop .container
    {
        text-align:center;
    }

    .links-inner
    {
        text-align:center;
        margin-top:4%;
    }
}

@media (max-width: 571px) {

    a.links-inner-jobs, .links-inner a:nth-child(2)
    {
        margin-bottom:12px;
    }


}