@charset "utf-8";

/*===========================================================================================
	Import of font awesome style sheet	@import url('https://warwick.ac.uk/static_war/render/id7/css/pack7.css.163187469781');
============================================================================================= */
:root {
    --radius: 0.25em;
    --shadow-sm: 0 1px 1px rgba(255, 255, 255, .2), 0 1px 8px rgba(255, 255, 255, .1);
    /* White */
    --shadow-md: 0 1px 8px rgba(0, 0, 0, .1), 0 8px 24px rgba(0, 0, 0, .15);
    --shadow-lg: 0 1px 8px rgba(0, 0, 0, .1), 0 16px 48px rgba(0, 0, 0, .1), 0 24px 60px rgba(0, 0, 0, .1);
    --transition-bounce: cubic-bezier(0.175, 0.885, 0.32, 1.275);
    --transition-ease-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);
    --transition-ease-in: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    --transition-ease-out: cubic-bezier(0.215, 0.61, 0.355, 1);
}

:root {
    --space-unit: 1em;
    --space-xxxxs: calc(0.125*var(--space-unit));
    --space-xxxs: calc(0.25*var(--space-unit));
    --space-xxs: calc(0.375*var(--space-unit));
    --space-xs: calc(0.5*var(--space-unit));
    --space-sm: calc(0.75*var(--space-unit));
    --space-md: calc(1.25*var(--space-unit));
    --space-lg: calc(2*var(--space-unit));
    --space-xl: calc(3.25*var(--space-unit));
    --space-xxl: calc(5.25*var(--space-unit));
    --space-xxxl: calc(8.5*var(--space-unit));
    --space-xxxxl: calc(13.75*var(--space-unit));
    --component-padding: var(--space-md)
}

:root {
    --pts-color-1: hsl(333, 72%, 24%, 1);
    /* ISO mainsite dark blue color #00698C */
    --pts-color-1-h: 333;
    --pts-color-1-s: 72%;
    --pts-color-1-l: 24%;
    --pts-color-2: #00698C;
    /* ISO blue link and title color #00698C */
    --pts-color-2-h: 309;
    --pts-color-2-s: 58%;
    --pts-color-2-l: 32%;
    --pts-color-3: hsl(0, 0%, 22%, 1);
    /* ISO default text color - gray #383838 */
    --pts-color-3-h: 0;
    --pts-color-3-s: 0%;
    --pts-color-3-l: 22%;
    --pts-color-4: hsl(0, 0%, 100%);
    /* White #fff */
    --pts-color-4-h: 0;
    --pts-color-4-s: 0%;
    --pts-color-4-l: 100%;
    --font-primary: 'Lato', sans-serif
}

@media only screen and (max-width:575px) {
    .hero {
        display: none;
        margin-top: 0px;
    }

    .fade-overlay {
        display: none;
    }
}

@media only screen and (max-width:768px) {

    .boxstyle_.box2,
    .boxstyle-sm.box2 {
        padding: 0px;
    }

	.fade-overlay, h3 {
		margin: 30px 0 0 0 !important;
	}
}

/* Container */

.container {
    margin: 0 auto;
    max-width: 100%;
    width: 70em;
}

@media screen and (max-width: 1680px) {

    .container {
        width: 70em;
    }

}

@media screen and (max-width: 1280px) {

    .container {
        width: calc(100% - 60px);
    }

}

@media screen and (max-width: 980px) {

    .container {
        width: calc(100% - 80px);
    }

}

@media screen and (max-width: 736px) {

    .container {
        width: calc(100% - 40px);
    }

}

/* ************************************ */
/* key box with Image head #main > .inner >*/
/* ************************************ */

.centrefade {
    padding-left: 10%;
    padding-right: 10%;
}

.noUnderline a {
    text-decoration: none;
}
.targetBlank {
    display: none;
}

.box {
    width: 100%;
    /* border: 1px solid #999;
	background: #eee; */
    border-top: 0;
    flex: 1 1 auto;
    margin-bottom: 22px;
}

.noUnderline .col-md-4>a {
    display: flex;
}

.noUnderline .col-md-4>a:hover .box_head {
    opacity: 1;
}

.box_head {
    width: 100%;
    height: 115px;
    opacity: 1;
}

.box_body {
    padding: 10px 20px;
    border-top: 1px solid #999;
}

.box_body ul {
    /* list-style-type: none; */
    padding: 0 20px;
	/* color: #00698C; */
}

section {
    padding: 4em 0 4em 0;
    /* border-top: dashed 1.5px rgba(86, 152, 210, 0.75); */
}

.noborder {
    border: none !important;
}

/* ====================================
	BOX2 style
	======================================= */
.boxstyle_.box2,
.boxstyle-xs.box2,
.boxstyle-sm.box2,
.boxstyle-md.box2,
.boxstyle-lg.box2 {
    border: 0;
    background: #eee !important;
    color: inherit;
}

.boxstyle_.box2 a:link,
.boxstyle-sm.box2 a:link,
.boxstyle_.box2 a:visited,
.boxstyle-sm.box2 a:visited {
    color: #00698C;
    text-decoration-color: #00698C;

    -o-transition: 500ms ease-in-out;
    -ms-transition: 500ms ease-in-out;
    -moz-transition: 500ms ease-in-out;
    -webkit-transition: 500ms ease-in-out;
    transition: 500ms ease-in-out;
}

.boxstyle_.box2 a:hover,
.boxstyle-sm.box2 a:hover,
.boxstyle_.box2 a:focus,
.boxstyle-sm.box2 a:focus,
.boxstyle_.box1 a:active,
.boxstyle-sm.box2 a:active {
    color: #00698C;
    text-decoration-color: #00698C;
    border-bottom: 1px solid #00698C;
    outline: none !important;
    -webkit-text-decoration-color: #00698C;
    -moz-outline-style: none !important;
}

/* =========================================
	BOX RADIUS TOP LEFT AND BOTTOM RIGHT
============================================ */
.box-border-radius {
    border-radius: 20px 0;
}

/* =========================================
	BOX RADIUS TOP LEFT ONLY FOR BOX IMAGES
============================================ */
.box-image-radius-tl {
    border-radius: 20px 0 0 0;
}

.id7-main-content section {
    margin-bottom: 20px;
}


/************************************************************/
/* custom style immigration service website - 20190410 [BP] */
/************************************************************/

.fade-overlay {
    position: absolute;
    bottom: 0px;
    left: 0;
    right: 0;
    height: 25%;
    background: rgba(255, 255, 255, 0.9);
    padding: 20px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0px 10px;
    border-radius: 0px 0px 15px 0px;
}

.bg-light {
    background-color: #ddeaf2 !important;
}

/* =========================================================================================
	homepage tab menu style - Recent Update Area css
============================================================================================ */
ol ul,
ul ul {
    list-style: square;
    margin-left: 20px;
    color: hsl(0, 0%, 22%, 1);
    color: var(--pts-color-3);
}

/* ------------------------ faq content accordion style copy from here ------------------------ */
.pts-faq__content .text-component {
    font-size: 0.95em;
}

.pts-faq__content p {
    color: hsl(210, 14%, 49%);
    color: var(--pts-color-3);
}

@media (min-width: 64rem) {
    .pts-faq__content {
        display: none;
        padding: 0 0.75em;
        padding: 0 var(--space-sm);
        overflow: hidden;
    }

    .pts-faq__content .text-component {
        font-size: 0.75em;
        padding-bottom: 1.25em;
        padding-bottom: var(--space-md);
    }
}

.pts-faq {
    box-shadow: 0 1px 1px rgba(0, 0, 0, .2), 0 1px 8px rgba(0, 0, 0, .1);
    box-shadow: var(--shadow-sm);
}

.pts-faq a {
    text-decoration: none;
}

.pts-faq__items {
    z-index: 1;
    height: 100%;
    width: 90%;
    top: 0;
    right: 0;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: translateZ(0) translateX(100%);
    transform: translateZ(0) translateX(100%);
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s, -webkit-transform .3s;
}

@media (min-width: 64rem) {
    .pts-faq__items {
        height: auto;
        width: auto;
        -ms-flex-positive: 1;
        flex-grow: 1;
        overflow: visible;
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
        background: transparent;
    }
}

.pts-faq__items--slide-in {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
}

.pts-faq__items {
    position: relative;
    height: auto;
    width: 100%;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
}

ul.pts-faq__group {
    padding-left: 0;
}

pts-faq__group {
    display: block;
}

.pts-faq__title {
    margin: 1.25em 0;
    margin: var(--space-md) 0;
}

.pts-faq__title h2 {
    text-transform: uppercase;
    font-size: 0.83333em;
    font-size: var(--text-sm);
    font-weight: 700;
    color: hsl(240, 1%, 74.7%);
    color: hsl(var(--color-contrast-low-h), var(--color-contrast-low-s), calc(var(--color-contrast-low-l)*0.9));
}

ul.pts-faq__group {
    list-style-type: none;
}

@media (min-width: 64rem) {
    .pts-faq__title {
        margin-bottom: 0.75em;
        margin-bottom: var(--space-sm)
    }

    .pts-faq__title h2 {
        font-size: 0.69444em;
        font-size: var(--text-xs);
    }
}

.pts-faq__item {
    background: hsl(0, 0%, 100%);
    background: var(--pts-color-4);
    margin-bottom: 0.50em;
    margin-bottom: var(--space-xs);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
    transition: box-shadow .2s;
}

.pts-faq__item:hover {
    --box-shadow: hsla(210, 14%, 49%, 0.3);
    --box-shadow: hsla(var(--pts-color-3-h), var(--pts-color-3-s), var(--pts-color-3-l), 0.3);
    box-shadow: undefined;
    box-shadow: 0 1px 10px var(--box-shadow);
}

@media (min-width: 64rem) {
    .pts-faq__item:hover {
        box-shadow: 0 1px 10px hsla(210, 14%, 49%, 0.3);
        box-shadow: 0 1px 10px var(--box-shadow);
    }
}

.pts-faq__item:last-of-type {
    margin-bottom: 0;
}

ul.pts-faq__list {
    list-style-type: none;
}

input.pts-faq__input {
    display: none;
}

.pts-faq input:checked~.article i {
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}

.pts-faq input:checked~.article.pts-faq-content {
    height: auto;
}

.pts-faq i {
    position: absolute;
    transform: translate(-30px, 0);
    margin-top: 16px;
    right: 0;
}

.pts-faq .article {
    background: rgb(255, 255, 255);
    overflow: hidden;
    height: 0px;
    max-height: auto;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.pts-faq .article p {
    color: hsl(0, 0%, 22%);
    padding: 0 0 10px 0;
    margin: 0 20px;
}

.pts-faq .boxstyle_.box5 p {
    color: hsl(0, 100%, 100%);
    color: var(--cd-color-3);
    line-height: 23px;
    font-size: 14px;
    padding: 0 20px;
}

.pts-faq input:checked~.article i {
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}

.pts-faq input:checked~.article.pts-faq-content {
    height: auto;
}

/* ------------------------ trigger style copy from here ------------------------ */
.pts-faq__trigger {
    padding: 20px 20px;
    position: relative;
    display: block;
    height: auto;
    cursor: pointer;
    line-height: 20px;
    /* font-size: 20px;
    font-weight: 100; */
    color: #00698C;
    color: var(--pts-color-2);
}

.pts-faq__trigger::before,
.pts-faq__trigger::after {
    position: absolute;
    right: 24px;
    top: 50%;
    height: 1px;
    width: 13px;
	-webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    transition: -webkit-transform .2s;
    transition: transform .2s;
    transition: transform .2s, -webkit-transform .2s;
}

.pts-faq__trigger::before {
    content: '';
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    right: 32px;
	background: #4D96AF;
}

.pts-faq__trigger::after {
    content: '';
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
	background: #00698C;
}

/* ------------------------ content style copy from here ------------------------ */
.pts-faq__content .text-component {
    font-size: 0.95em;
}

.pts-faq__content p {
    color: hsl(210, 14%, 49%);
    color: var(--pts-color-3);
}

@media (min-width: 64rem) {
    .pts-faq__content {
        display: none;
        overflow: hidden;
    }

    .pts-faq__content .text-component {
        font-size: 0.75em;
    }
}

.pts-faq__content--visible {
    display: block
}

/* free styles */

hr {
    margin-top: 15px;
    margin-bottom: 15px;
    border: 0px;
    border-top: 1.5px solid #00698C;
}

.hr-line-dotted {
    border-bottom: 1.5px dotted #00698C;
}

.hr-line-dashed {
    border-bottom: 1.5px dashed #00698C;
}

.hr-line-solid {
    border-bottom: 1.5px solid #00698C;
}

blockquote {
    padding: 11px 22px;
    margin: 0 0 22px;
    font-size: inherit;
    border-left: 5px solid #00698C;
}

ul.square {
    list-style-type: square;
    padding-left: 20px;
}

.noPad {
    padding: 0;
}

.pd-20 {
    padding: 20px !important;
}

.pd-30 {
    padding: 30px !important;
}
.pdt-20 {
    padding-top: 20px;
}
.pdt-30 {
    padding: 30px 0 0 0;
}
.pdr-20 {
    padding-right: 20px !important;
}
.pdr-30 {
    padding-right: 30px !important;
}
.pdb-20 {
    padding-bottom: 20px;
}
.pdb-30 {
    padding-bottom: 30px;
}
.pdl-20 {
    padding-left: 20px !important;
}
.pdl-30 {
    padding-left: 30px !important;
}
.pdtb-20 {
    padding: 20px 0;
}
.pdrl-20 {
    padding: 0 20px;
}

.noMgn {
    margin: 0px !important;
}
.mg-20 {
    margin: 20px !important;
}

.mg-30 {
    margin: 30px !important;
}
.mgt-20 {
    margin-top: 20px;
}
.mgt-30 {
    margin-top: 30px;
}
.mgr-20 {
    margin-right: 20px;
}
.mgr-30 {
    margin-right: 30px;
}
.mgb-20 {
    margin-bottom: 20px !important;
}
.mgb-30 {
    margin-bottom: 30px !important;
}
.mgl-20 {
    margin-left: 20px;
}
.mgl-30 {
    margin-left: 30px;
}
.mgtb-20 {
    margin: 20px 0;
}
.mgrl-20 {
    margin: 0 20px;
}