/* banner */
#banner{position: relative; height: calc(100vh - 35px); margin: 0 auto;}
#banner .item{height: calc(100vh - 35px); background-size: cover; background-repeat: no-repeat; background-position:  center top;}
#banner .banner-text {position: absolute; width: 790px; z-index: 2; margin: 0 auto; left: 0; right: 0; bottom: 0; padding-bottom: 330px;}
#banner .banner-text .sub-title{font-size: 1.5625rem; color: #0a2b34; text-align: center;}
#banner .banner-text .title{font-size: 4.9375rem; color: #067a93; font-weight: 600; line-height: 1.1; text-align: center; }
#banner .banner-caption{position: absolute; width: 790px; z-index: 2; margin: 0 auto; left: 0; right: 0; bottom: 0; padding-bottom: 180px;}
#banner .banner-caption form .search-now{border-radius: 50%; position: relative; top:3px; border: none; border-bottom:none; height:50px; width:50px; background:#41c0a4 url(../images/search.png) no-repeat center center; }
#banner .banner-caption form .form-row{background-color: #fff; border-radius: 40px; margin: 0 auto; padding: 5px 0 5px 20px;}
.form-wrap{border-radius: 50px; -webkit-box-shadow: 0px 0px 41px 5px rgba(6,78,100,0.31); -moz-box-shadow: 0px 0px 41px 5px rgba(6,78,100,0.31); box-shadow: 0px 0px 41px 5px rgba(6,78,100,0.31); border:8px solid rgba(255,255,255,0.5); position: relative; width: 85%; margin: 0 auto; }
.form-wrap .form-row>[class*=col-]{padding: 0;}
.form-wrap .form-control{border: none; border-radius: 0; height: 50px; font-size: 0.875rem;}
.form-wrap .form-control::-webkit-input-placeholder {color: #000;}
.form-wrap .form-control::-moz-placeholder {color: #000;}
.form-wrap .form-control:-ms-input-placeholder {color: #000;}
.form-wrap .form-control:-moz-placeholder {color: #000;}
.form-wrap .form-control:focus{outline: none; box-shadow: none;}
.form-wrap .form-control{border-right:1px solid #ebebeb;}
.form-wrap .form-group .select2:focus{outline: none; box-shadow: none;}
.select2-container--default .select2-selection--single .select2-selection__rendered{font-size:0.875rem; color: #000; line-height: 48px; }
.select2-container--default .select2-selection--single .select2-selection__arrow{display: none;}
.select2-container--default .select2-selection--single{border: none; height: 49px;}
.select2-container--default .select2-selection--single .select2-selection__rendered:focus{box-shadow: none;}
.form-wrap .search-now:focus{outline: none;}
.select2-container--default .select2-selection--single:focus{outline: none;}
.select2-dropdown{z-index: 98;}

#banner .bx-wrapper .bx-pager.bx-default-pager a {margin: 0 auto; outline: 0; width: 10px; height: 8px; display: block; background: rgba(255,255,255,0.35); text-decoration: none;position: relative;}
#banner .bx-wrapper .bx-pager.bx-default-pager a.active {width:25px;transition: all 0.5s linear;background-color: #ffeceb}
#banner .bx-wrapper .bx-prev{background: url(../images/left-arrow.png) no-repeat 0 0; width: 106px; height: 106px;}
#banner .bx-wrapper .bx-next{background: url(../images/right-arrow.png) no-repeat 0 0; width: 106px; height: 106px;}

#banner .owl-nav {position: absolute; top: 50%; transform: translateY(-50%); width: 100%;}
#banner .owl-nav button.owl-prev,#banner .owl-nav button.owl-next{position: absolute; height: 60px; width: 60px; background-color: #fff; border-radius: 50%;}
#banner .owl-nav button.owl-prev{left: 80px;}
#banner .owl-nav button.owl-prev:before,#banner .owl-nav button.owl-next:before{content: ""; background-image: url(../images/sprite.png); background-repeat: no-repeat; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto;}
#banner .owl-nav button.owl-prev:before{ background-position: 0 0; width: 11px; height: 21px;}
#banner .owl-nav button.owl-next:before{ background-position: -14px 0; width: 12px; height: 21px;}
#banner .owl-nav button.owl-next{right: 80px;}
#banner .owl-nav button.owl-prev:hover,#banner .owl-nav button.owl-next:hover{box-shadow: 0px 5px 26.68px 2.32px rgba(6, 78, 100, 0.08); outline: none;}

/* down arrow */
.down-arrow{position: absolute; z-index: 10; background: url(../images/down-shape.png) no-repeat center top; width: 155px; height: 34px; left: 0; right: 0; bottom:0;  margin:0 auto; text-align: center; }
.down-arrow .circle{width: 25px; height: 40px; border: 1px solid #c6c6c6; border-radius: 12px; display: block; overflow: hidden; margin: 15px auto 0;}
.down-arrow .circle .bounce {display: inline-block; vertical-align: middle; background:#c6c6c6; width: 2px; height: 10px; margin: 0 auto; position: relative; top:0; -moz-animation: bounce 2s infinite;-webkit-animation: bounce 2s infinite;animation: bounce 2s infinite;}
.down-arrow .icon{background-position: -22px -83px; width: 10px; height: 18px;display: block; margin: 10px auto 0;}  
.down-arrow img{margin: 0 auto; }

@keyframes bounce { from {transform: translateY(0); opactiy:0; } to {transform: translateY(15px); opactiy:1;}}
@-webkit-keyframes bounce { from {-webkit-transform: translateY(0); opactiy:0;} to {-webkit-transform: translateY(15px); opactiy:1;}}
@-moz-keyframes bounce {from {-moz-transform: translateY(0); opactiy:0;} to {-moz-transform: translateY(15px); opactiy:1;}}

/* about */
#about .about-pic{position: relative;}
#about .about-pic:after{content: ""; width: 200px; height: 200px; border-radius: 50%; background-color: rgba(65,192,164,0.1); position: absolute; right: -220px; top: 60px;}
#about .about-pic img{position: absolute; right: -100px; max-width: none;}

/* job categories */
#job-categories{background-color: #e3f6f1; position: relative;}
#job-categories:after{content: ""; background: url(../images/bg-pattern.png) no-repeat right bottom; width: 639px; height: 904px; position: absolute; right: 0; bottom: -50%; z-index: 0;}
.job-domain{position: relative; z-index: 1;}
.job-domain .item{text-decoration: none; text-align: center; margin-bottom: 30px; display: block;}
.job-domain .item span{display: block;}
.job-domain .item .icon-wrap{border: 10px solid rgba(255,255,255,0.55); margin-bottom: 20px; width:190px; height:190px;}
.job-domain .item .icon-wrap .icon{ height: 170px;position: relative; background-color: #fff; margin-bottom: 20px;}
.job-domain .item .icon-wrap .icon img{position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto;}
.job-domain .item .icon-wrap .icon .svg{ max-height:80px; max-width: 80px; position: absolute; left:0; right: 0; top: 0; bottom: 0; margin: auto; fill: #067a93;}
.job-domain .item:hover .icon-wrap .icon .svg { fill: #FFFFFF; }
.job-domain .item .name{color: #0a2b34; font-size: 1.125rem; margin-bottom: 10px;}
.job-domain .item .position{color: #067a93; }
.job-domain .item:hover .icon-wrap{border-color: rgba(65,192,164,0.15);}
.job-domain .item:hover .icon-wrap .icon{background-color: #41c0a4;}
.job-domain .item:hover .icon-wrap .icon img{filter: brightness(0) invert(1);}
.job-domain .item:hover .position{text-decoration: underline;}


/* popular jobs */
#popular-jobs{}
.job-list .item{border: 1px solid #ebebeb; border-radius: 20px; padding: 35px; display: flex; flex-direction: column; margin-bottom: 30px; height: calc(100% - 30px); background-color: #fff;}
.job-list .item:hover{text-decoration: none;}
.job-list .item span{display: block;}
.job-list .item span.posted{color: #41c0a4; font-size: 0.92rem; margin-bottom: 5px;}
.job-list .item .post-name{color: #067a93; font-weight: 600; font-size: 1.3125rem; margin-bottom: 10px;}
.job-list .item .company-name{color: #8f8f8f; margin-bottom: 10px;}
.job-list .item .address{color: #8f8f8f; position: relative; padding-left: 18px; margin-bottom:30px;}
.job-list .item .address .map-pin{position: absolute; background-position: -3px -76px; width: 10px; height: 15px; left: 0; top: 3px;}
.job-list .item .type{float: left; background-color: #f4f4f4; color: #bababa; font-size: 0.875rem; border-radius: 20px; padding: 15px; min-width: 120px; text-align: center;}
.job-list .item .more{float: right; background-color: #41c0a4; width: 45px; height: 45px; border-radius: 50%; position: relative;}
.job-list .item .more .arrow{position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; background-position: -3px -57px; width: 18px; height: 14px;}
.job-list .item:hover{border-color: #fff; box-shadow: 0 0 10px 10px rgba(192, 192, 192, 0.17); }
.job-list .item:hover .post-name{color: #41c0a4;}

/* success stories */
#success-stories{position: relative; padding-bottom: 100px;}
#success-stories:after{content: ""; background-color: #41c0a4; position: absolute; z-index: 0; left: 0; right: 0; bottom: 0; height: 470px;}
#success-stories [class*=col-]{position: relative;}
#success-stories .person-pic{max-width: 700px; position: relative; left: -250px; z-index: 2;}
#success-stories .circle{background-color: #ecf9f6; border-radius: 50%; padding: 12px; position: absolute;  z-index: 2; display: flex; flex-direction: column; justify-content: center; text-align: center;}
#success-stories .circle.small{width: 300px; height: 300px;}
#success-stories .circle.small.first{left: 420px; top: 70px;}
#success-stories .circle.big{width: 340px; height: 340px;}
#success-stories .circle.big.second{right:50px; top: -20px;}
#success-stories .circle.small.third{right: 190px; bottom:-50px;}
#success-stories .circle .icon{margin-bottom: 10px;}
#success-stories .circle .icon .quote{background-position:  -35px -76px; width: 37px; height: 30px;}
#success-stories .circle .message{color: #067a93; font-size: 1.125rem; margin:15px 0 30px;}
#success-stories .circle .name{color: #0a2b34; font-size: 1rem; font-style: italic; text-transform: uppercase;}
#success-stories .circle .name:before{content: "-"; margin-right: 2px; display: inline-block;}
#success-stories .more{background-color: #71d0bb; width: 85px; height: 85px; border-radius: 50%; position: absolute; right: 0; top: 50%; z-index: 1; border: none;}
#success-stories .more:before{content: "";border: 10px solid rgba(255,255,255,0.15); position: absolute; left: -10px; top: -10px; right: -10px; bottom: -10px; border-radius: 50%; display: block; transition: all .3s linear;}
#success-stories .more .arrow{position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; background-position: -3px -96px; width: 26px; height: 22px;}
#success-stories .more:focus{outline: none; box-shadow: none;}
#success-stories .more:hover:before{border-color: rgba(255,255,255,0.3);}