#career {margin: 0;padding: 0;height: 100vh;}#career canvas {height: 100% !important;}#career .careerBackground {width: 100%;height: 100vh;background: url(../images/career-backgrouns.png) no-repeat bottom center;background-size: cover;position: relative;display: flex;align-items: center;flex-wrap: wrap;justify-content: center;}#career .careerBackground:before {content: "";width: 100%;height: 100%;background: rgba(0, 0, 0, 0.4);position: absolute;left: 0;padding: 0;}#career .careerContent {position: relative;z-index: 2;}#career .careerContent h2 {margin: 0;padding: 0;font-weight: 800;font-size: 71px;line-height: 97px;text-align: center;color: #fff;}#career .careerContent a {display: flex;align-items: center;flex-wrap: wrap;padding: 10px 20px;background: #fff;border-radius: 100px;position: relative;transition: all ease-in-out 0.3s;max-width: 350px;margin: 60px auto 0 auto;height: 60px;}#career .careerContent a span {font-weight: 600;font-size: 22px;color: #2C52B4;width: 100%;}#career .careerContent a i.linkArrow {width: 50px;height: 50px;position: absolute;right: 4px;top: 4px;background: #2c52b4;border-radius: 100%;display: flex;align-items: center;flex-wrap: wrap;justify-content: center;transition: all ease-in-out 0.3s;}#career .careerContent a i.linkArrow svg {fill: #fff;width: 24px;height: 24px;}#career .careerContent a:hover {background: #2c52b4;color: #fff;}#career .careerContent a:hover span {color: #fff;}#career .careerContent a:hover i.linkArrow {background: #fff;}#career .careerContent a:hover i.linkArrow svg {fill: #2c52b4;}

/**** media queries ****/
@media only screen and (min-width: 0px) and (max-width: 575px) {
    #career {height: inherit; background: #18398f;}
    #career .careerBackground {height: 100%; padding: 100px 0;}
    #career .careerContent h2 {font-size: 32px; line-height: 52px;}
    #career .careerContent a {max-width: 320px; margin: 40px auto 0 auto;}
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
    #career {height: inherit; background: #18398f;}
    #career .careerBackground {height: 100%; padding: 100px 0;}
    #career .careerContent h2 {font-size: 40px; line-height: 60px;}
    #career .careerContent a {max-width: 320px; margin: 40px auto 0 auto;}
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    #career {height: inherit; background: #18398f;}
    #career .careerBackground {height: 100%; padding: 120px 0;}
    #career .careerContent h2 {font-size: 44px; line-height: 64px;}
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    #career {height: inherit;}
    #career .careerBackground {height: 100%; padding: 140px 0;}
    #career .careerContent h2 {font-size: 54px; line-height: 74px;}
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
    #career {height: inherit;}
    #career .careerBackground {height: 100%; padding: 140px 0;}
    #career .careerContent h2 {font-size: 32px; line-height: 46px;}
    #career .careerContent a {padding: 10px 20px; max-width: 270px; margin: 50px auto 0 auto; height: 48px;}
    #career .careerContent a span {font-size: 16px;}
    #career .careerContent a i.linkArrow {width: 40px; height: 40px;}
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
    #career {height: inherit;}
    #career .careerBackground {height: 100%; padding: 200px 0;}
    #career .careerContent h2 {font-size: 42px; line-height: 52px; font-weight: 700;}
    #career .careerContent a {max-width: 290px; height: 52px;}
    #career .careerContent a i.linkArrow {width: 44px; height: 44px;}
}