﻿/*-----------------------------------------------------------------------Login / Register Table-----------------------------------------------------------------------*/
body {
    background: url(../Images/RecruitmentLandingscreenBG.png) no-repeat;
    background-size: cover;
}
#formRegisterScreenOnPortal{
	z-index: 10;
	
}
#loginContainer {
    background-color: rgba(128, 128, 128, 0.2);
    backdrop-filter: blur(1px);
    -webkit-backdrop-filter: blur(1px);
    z-index: 10;
    border: solid 1px #09D9A7;
}

#loginContainer div.column-1 {
	color: rgba(247,247,247);
    /*opacity: 0.5;*/	
}

#loginContainer border{
	border: 1px;
	
	
}

#loginContainer .emailBox .textbox ,#loginContainer .pwBox .textbox,#loginContainer .column-2 .textbox{
	background-color: rgba(0, 50, 47);
	color: rgba(247,247,247);
	border: solid 1px #09D9A7;
}

#loginContainer .action-strip{
	border-top: 0;	
	display: flex;
	flex-direction: row-reverse;
    justify-content: space-between; 
    align-items: center;
    gap: 10px; 
	margin-inline: 10px;
	margin-bottom: 10px;
	padding-right: 0;
	
}
#loginContainer .action-strip a {
    flex: 1; 
    text-align: center; 
    padding: 8px 4px; 
    /*background-color: #007bff; */
    color: white;
    text-decoration: none;
    border-radius: 5px; 
	border: solid 1px #09D9A7;
}
#loginContainer .action-strip .action:hover {
    background-color: #09D9A7;
}
#loginContainer .action-strip a {
    float: none !important;
	margin: 0;
}

#loginContainer .action-strip #idLoginButton  {
    color: black;
}

#loginContainer .action-strip #idLoginButton:hover  {
    color: white;
	border: solid 1px #00322F;
}

#loginContainer .action-strip .action  {
	color: rgba(247,247,247);
    background-color: #00322F;
}



div.login-box {

    width: 100%;
    background-color: transparent !important;
	text-align: center;
	
}

div.login-box div {
	font-weight: bold !important;
	font-size: 27px;
	padding-top: 12px;
}

/*---------------------------------------------------------------------------Login As Table---------------------------------------------------------------------------*/
/*
#loginContainer {
    width: 340px !important;
    height: auto !important;
    font: normal "Trebuchet MS",Arial,sans-serif;
    font-weight: bolder;
    background: none !important;
    border: none !important;
    color: white !important;
    margin-left: 0px !important;
    margin-top: 0px !important;
    left: 20vw !important;
    top: 15vh !important;
}
#welcomeMessageBlock {
	display: none;
}
#welcomeMessageBlock td {
    display: none;
}
div.column-1 {
    color: white;
    font: normal "Trebuchet MS",Arial,sans-serif !important;
    font-size: 11px;
    width: 95px;
    text-align: right;
    padding: 5px 10px 0px 20px !important;
    text-transform: uppercase;
}
div.column-2 {
    font: normal "Trebuchet MS",Arial,sans-serif !important;
    width: 205px;
    padding: 0px !important;
}
.login-box {
    font-family: "Trebuchet MS",Arial,sans-serif;
    font-weight: bolder;
    text-transform: uppercase;
    padding: 15px;
    width: auto !important;
    border: solid white 6px;
    background: #064181 !important;
}
.login-box div {
    font-family: "Trebuchet MS",Arial,sans-serif;
    background: none !important;
    padding: 10px 0px 35px 0px !important;
    font-size: 30px !important;
}
.loginAsBox {
    margin-top: 25px;
    padding-top: 10px;
    background: #064181;
    border: solid white 1px;
    border-bottom: none;
}
.emailBox {
    border-left: solid white 1px;
    border-right: solid white 1px;
    background: #064181;
}
.pwBox {
    border: solid white 1px;
    border-top: none;
    border-bottom: none;
    background: #064181;
    padding-bottom: 0px;
}
.dropDownList {
    width: 200px;
    border: solid #5D6F77 2px;
    border-radius: 5px;
}
input[type=text], input[type=password], input[type=number], textarea {
    width: 192px;
    border: solid #5D6F77 2px;
    border-radius: 5px;
}
#loginFooterPadding {
    padding-top: 48px !important;
	padding-left: 12px !important;;
}
.action-strip {
    padding-top: 5px;
    padding-bottom: 7px;
    border: solid white 1px;
    border-top: none;
    background: #064181;
}
a.action:link, a.action:active, a.action:visited {
    border: solid white 1px;
    color: white;
    padding: 4.5px;
}



#lblStatus {
	color: white ;
	font-size: 18px;
    position: absolute;
}
#loginImage {
    width: 20px;
    position: absolute;
    top: 155px;
    left: 7px;
}
#regIndividualImage {
    width: 20px;
    top: 336px;
    left: 7px;
    position: absolute;
}
#idLoginButton, #LinkButton1 {
    width: 140px;
    padding: 5px;
    text-transform: uppercase;
    text-align: center;
}
#LinkButton1 {
    float: left !important;
    margin-left: 6px;
}
#LinkButton2 {
    position: absolute;
    top: 90px;
    left: -3px;
    float: none;
    width: 330px;
    padding: 7px 5px;
    text-transform: uppercase;
    text-align: center;
    background: #064181;
}
#btnResendVerification {
    position: absolute;
    top: 120px;
    left: -3px;
    float: none;
    width: 330px;
    padding: 7px 5px;
    text-transform: uppercase;
    text-align: center;
}
#LinkButton2:hover {
    background: #B2B2B2;
}
*/
/*---------------------------------------------------------------------------Shared Content---------------------------------------------------------------------------*/
#tableRegisterScreenOnPortal{
	top: 37%;
	background: url(../Images/Recruitmentlandingscreenblock.png);
    background-repeat: no-repeat;
    background-size: contain;
    height: auto;
    aspect-ratio: 16 / 9;
    width: auto;
   
}
#tableRegisterScreenOnPortal td{
	padding-inline: 10px;
}

a.customaction:link, a.customaction:active, a.customaction:visited {
	min-height: 0 !important;
}

table#tableRegisterScreenOnPortal tr:nth-of-type(1),
table#tableRegisterScreenOnPortal tr:nth-of-type(2) {
    display: none;
}
img.icon {
    height: 65px !important;
}

/*-------------------------------------------------------------------------------Header-------------------------------------------------------------------------------*/

.wrapper{
	border-top: 0px;
}

#imgLogoTop {
	background: url(../Images/RecruitmentLandingscreentitle.png) !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;
    width: 23vw;
    position: absolute;
    height: 17vh;
    left: 2.5%;
    max-width: 100%;
    margin-top: 0;
}

#header_Logo{
	position: absolute;
	bottom: 27%;
    left: 5%;	
}


#headerStrip {
    background: url(../Images/RecruitmentLandingscreenpattern.png);
    /* height: 8vh; */
    width: 100%;
    position: relative;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: top;
    aspect-ratio: 45 / 3;
}
#imgLogoRight {

}
#imgLogoLeft {

}
/*#imgLogoCenter {
    background: url(../Images/Recruitmentlandingscreenblock.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 31%;
    height: 36%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}*/
#imgLogoCenter {
    background: url(../Images/Recruitmentlandingscreenblock.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 34%;
    height: 40%;
    position: absolute;
    top: 40%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 6px;
}

.icon-box img {
    height: 9.5vh;
    object-fit: contain;
}

/*------------------------------------------------------------------------------Carousel------------------------------------------------------------------------------*/
.carouselImage {
    background-size: cover;
    max-width: 1366px;
    width: 72vw;
    left: 14vw;
}
#carouselContainer {

    max-width: 100%;
    width: 100% !important;
	height: 100% !important
    /*left: 0vw;*/
}

/*-------------------------------------------------------------------------------Footer-------------------------------------------------------------------------------*/
.footer {
    background: url(../Images/RecruitmentLandingscreenbottompattern.png);
    /* height: 15vh; */
    width: 100%;
    position: absolute;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: bottom;
    bottom: 0;
    border: 0;
    aspect-ratio: 40 / 3;
    height: auto;
}
.footerInner {
background: url(../Images/RecruitmentlandingscreenCockerel.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 9%;
    position: relative;
    height: auto;
    bottom: 0px;
    right: 0px;
    padding-left: 0px;
    padding-top: 0;
    aspect-ratio: 1 / 3;
    float: inline-end;
    left: -8%;
    top: 130%;
}
#powered {
    display: none;
}


/*-----------------------------------------------------------------------Smaller window display-----------------------------------------------------------------------*/
@media only screen and (max-width: 1366px) {
    .carouselImage {
        background-size: auto;
        max-width: 1366px;
        width: 100%;
        left: 0;
    }
    #carouselContainer {
        max-width: 1366px;
        width: 100% !important;
        left: 0;
    }
    #tableRegisterScreenOnPortal td {
        text-align: center;
    }
}
@media only screen and (max-width: 476px) {
    #tableRegisterScreenOnPortal {
        width: 152vw;
    }
		#imgLogoTop {
		width: 87vw;
	}
	#header_Logo {
		position: absolute;
		bottom: 77%;
		left: 5%;
	}
	.footerInner {
    background: url(../Images/RecruitmentlandingscreenCockerel.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 8vw;
    position: absolute;
    height: 18vh;
    top: -35px;
    right: 112px;
    padding-left: 0;
    padding-top: 0;
}

}

@media only screen and (max-height: 840px) {


    img.icon {
        height: 50px !important;
    }
    /*#loginContainer {
        top: 110px !important;
    }*/

}