/* ==========================================================================
   Landing / Index page
   ========================================================================== */

/*Fontello*/
@font-face {
    font-family: 'ftello';
    src: url('/fonts/ftello.eot?87360145');
    src: url('/fonts/ftello.eot?87360145#iefix') format('embedded-opentype'),
    url('/fonts/ftello.woff?87360145') format('woff'),
    url('/fonts/ftello.ttf?87360145') format('truetype'),
    url('/fonts/ftello.svg?87360145#ftello') format('svg');
    font-weight: normal;
    font-style: normal;
}

.karla{
    font-family: 'Karla', sans-serif;
}
.josefin{
    font-family: 'Josefin', sans-serif;
}
.chivo{
    font-family: 'Chivo', sans-serif;
}
.sintony{
    font-family: 'Sintony', sans-serif;
}

.ftello-icon
{
    font-family: "ftello";
    font-style: normal;
    font-weight: normal;
    speak: none;

    display: inline-block;
    text-decoration: inherit;
    width: 1em;
    margin-right: .2em;
    text-align: center;
    /* opacity: .8; */

    /* For safety - reset parent styles, that can break glyph codes*/
    font-variant: normal;
    text-transform: none;

    /* fix buttons height, for twitter bootstrap */
    line-height: 1em;

    /* Animation center compensation - margins should be symmetric */
    /* remove if not needed */
    margin-left: .2em;

    /* You can be more comfortable with increased icons size */
    /* font-size: 120%; */

    /* Font smoothing. That was taken from TWBS */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;

    /* Uncomment for 3D effect */
    /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
    
    font-size: 30px;
    color: #ffffff;
}

.ftello-icon:hover {
    color: #78aeee;
    text-decoration: none;
}

.wrapperGraduate{
    background-color: #2d73c4;
    height: 32vh;
}

.wrapperGraduate a img{
    position: absolute;
}

.navbar-header img{
    margin-top: 20px;
}

.navMenu{
    margin-top: 10px;
}

h1, h2{
    font-family: "Open Sans", Helvetica, Arial, sans-serif; /*'Roboto', sans-serif;*/
}

h1{
    font-size: 39px;
}


.joblistingsBody h1{
    font-size: 30px;
}

.joblistingsBody h1 .h1bread{
    font-size: 16px;
}

h2{
    font-size: 28px;
}
h3{
    font-family: helvetica, arial, sans-serif; /*'Lato', sans-serif;*/
    font-size: 22px;
}
p, a , body{
    font-family: helvetica, arial, sans-serif;
    font-size: 14px;
}

a{
    color: #ffffff;
}

.font-arbutus{
    font-family:  "Open Sans", Helvetica, Arial, sans-serif;
}

.font-source-san{
    font-family: helvetica, arial, sans-serif;
}

.bg-blue{
    background-color: #2d73c4;
}

.bg-blue-light{
    background-color: #78aeee;
}

.bg-blue-dark{
    background-color: #205593;
}

.bg-green{
    background-color: #6fa333;
}

.bg-green-light{
    background-color: #9dd95b;
}

.bg-green-dark{
    background-color: #4d7223;
}

.bg-grey{
    background-color: #4a4a4a;
}

.bg-grey-light{
    background-color: #9b9b9b;
}

.bg-grey-dark{
    background-color: #2d2d2d;
}

.bg-warning{
    background-color: #de3d4e;
}

.navbar-toggle {
    background-color: #6fa333;
    border-bottom: 1px solid #4d7223;
}

.logo{
    margin-top: 20px;
    margin-bottom: 10px;
}

.navbar-toggle .icon-bar {
    border: 1px solid #fff;
}

.navbar-default {
    background-color: #2d73c4;
    background-image: none;
    box-shadow: none;
    border-color: transparent;
    color: #fffff;
}

.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .open > a {
    background-image: none;
    background-repeat: repeat-x;
    box-shadow: none;
}
/*Underline for ACTIVE page*/
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover {
    background-color: transparent;
    color: #ffffff;
    text-decoration: underline;
}

.navbar-default .navbar-nav > li > a {
    color: #fff;
}
.navbar-default .navbar-nav > li > a:focus, .navbar-default .navbar-nav > li > a:hover{
    color: #fff;
    text-decoration: underline;
}

.navbar-default .navbar-nav > li > a.btn:hover{
    text-decoration: none;
    background-color: #9dd95b;
}

.margin-top-zero{
    margin-top: 0;
}

.wrapper:before{
    background-color: #000000;
    opacity: 0.33;
    content: " "; /*This is very important for the transparency*/
    min-height: 100%;
    position: absolute;
    width: 100%;
}

.wrapper{
    /*background: transparent url("/img/men-suit.jpg") no-repeat scroll center center / cover ;*/
    background: transparent url("/img/wrapper-bg.jpg") no-repeat scroll center center / cover ;
    /*min-height: 88vh; This is important for */
    min-height: 88vh; /*This is important for */
    position: relative;
}

.btnScroll{
    display: block;
    font-size: 12px;
    /*left: 45%;*/
    position: absolute;
    text-decoration: none;
    text-align: center;
    margin-top: 20px;
}

.intro .btnScroll:hover{
    text-decoration: none;
    background-color: transparent;
}

.btnScrollTextDown{

}

.btnScrollArrowDown{
    font-size: 25px;
    display: block;
}

/*.intro{
    opacity: 1;
}*/

.divHolder{
    margin-top: 2vh;
    display: inline-block;
    text-align: left;
    min-width: 260px;
}


.divHolder p a{
    background-color: transparent;

}

.intro h1{
    font-family: helvetica, arial, sans-serif;
    line-height: 40px;
   /* margin: 3vh auto;*/
    margin: 0 auto;
}

.intro h1 small{
    font-size: 18px;
    color:#ffffff;
}

.intro h2{
    font-family: helvetica, arial, sans-serif;
    margin-top: 3vh;
}

.intro a{
    color: #ffffff;
    text-decoration: none;
    line-height: 20px;
}

    .intro a:hover{
        text-decoration: underline;

    }


.font-white, .font-white a{
    color: #ffffff;
}

.graduateJobsUl li{
    height: 70px;
    margin: 3vh 0;
    padding: 5px 0;
}
.graduateJobsUl li{
    position: relative;
}

.graduateJobsUl li a span{
    position: absolute;
    top: 15px;
    left: 81px;
}

.intro h3 a{
    font-size: 39px;
    padding: 20px;
    margin-top: 3vh;
}

.btn-success {
    background-color: #6fa333;
    color: #fff;
    border: none;
    background-image: none;
    border-bottom: 3px solid #4d7223;

}


.btn-success:hover {
    background-color: #9dd95b;
}

.btn-success.active, .btn-success:active {
    background-color: #4d7223;
/*    border: none;*/
}

.bg-blue{
    background-color: #2d73c4;
}

.bg-blue-light{
    background-color: #78aeee;
}

.bg-blue-dark{
    background-color: #205593;
}

.btn-primary {
    background-color: #2d73c4;
    color: #fff;
    border: none;
    background-image: none;
    border-bottom: 3px solid #205593;

}

.btn-primary:hover {
    background-color: #78aeee;
}

.btn-primary.active, .btn-primary:active {
    background-color: #205593;
    border: #none;
}

.partners{
    min-height: 12vh;
}

.partners li{
    margin: 30px 4vh;
    display: inline-block;
    opacity: 0.4;
    transition: all 0.4s ease-in-out 0s;
}


.iconLanding{
    background: rgba(0, 0, 0, 0) url("../img/icon-top-section-index.png") no-repeat scroll 0 0;
    display: inline-block;
    height: 60px;
    margin-right: 20px;
    width: 61px;
    float: left;
}

.iconMcsattchi{
    background-position: 0 0;
}

.iconOk{
    background-position: -119px 0;
}

.iconSearch{
    background-position: -246px 0;
}

.iconVideoTop{
    background-position: 0 -114px;
}
.iconVideoMiddle{
    background-position: -119px -114px;
}

.iconVideoBottom{
    background-position: -246px -114px;
}



.partners li:hover{
    opacity: 1;
}

.graduatesEmployersSection{
    background-color: #2d73c4;
    color: #ffffff;
}

.graduatesEmployersSection h3 {
    font-size: 22px;
    margin-top: 15px;
    padding-top: 25px;
    margin-bottom: 25px;
}

.graduatesEmployersSection li{
/*    height: 40px;
    margin: 60px 0;*/
    clear: both;
    min-height: 70px;
    margin-top: 20px;
}

.graduatesEmployersSection li i{
    float: left;
    width: 40px;
    height: 70px;

}

.icon-number{
    margin-top: 10px;
    height: 70px;
}

.icon-graduates-interface{
    background: rgba(0, 0, 0, 0) url("../img/icon-graduates-interface.svg") no-repeat scroll 0 0;
    margin: 5px 20px 0 20px;
}

.icon-graduates-circle-arrow{
    background: rgba(0, 0, 0, 0) url("../img/icon-graduates-circle-arrow.svg") no-repeat scroll 0 0;
    margin: 10px 20px 0 20px;
}

.icon-graduates-video-camera{
    background: rgba(0, 0, 0, 0) url("../img/icon-graduates-video-camera.svg") no-repeat scroll 0 0;
    margin: 7px 20px 0 20px;
}

.icon-employers-portrait{
    background: rgba(0, 0, 0, 0) url("../img/icon-employers-portrait.svg") no-repeat scroll 0 0;
    margin: 5px 20px 0 20px;
}

.icon-employers-tv{
    background: rgba(0, 0, 0, 0) url("../img/icon-employers-tv.svg") no-repeat scroll 0 0;
    margin: 10px 20px 0 20px;
}

.icon-employers-handshake{
    background: rgba(0, 0, 0, 0) url("../img/icon-employers-handshake.svg") no-repeat scroll 0 0;
    margin: 10px 20px 0 20px;
}

.icon-text-section{
/*    float: left;
    max-width: 60%;*/
}



a.btn-custom-landing{
    border: 1px solid #ffffff;
    padding: 10px 20px;
    color: #ffffff;
    margin: 20px;
    display: inline-block;
    text-decoration: none;
}

a.btn-custom-landing:hover{
    background-color: #78aeee ;

}


footer{
    background-color: #333333;
    /*padding-bottom: 50px;*/
    padding: 7px 0;
}

footer a:focus, footer a:hover {
    color: #78aeee;
    text-decoration: underline;
}


.joblistingsBody{
    margin-top: -178px;
}

body .joblistingsBodyHeightFix{
    margin-top: -105px;
}

body .joblistingsBodyHeightFixEmployers{
    margin-top: -102px;
}


.joblistingsBodyLeftSide{
    margin-top: 117px;
}


.joblistingsBody a{
    color: #2d73c4;
}

.joblistingsBox{
    background-color: #ffffff;
    border-bottom: 2px solid #b2b2b2;
    border-radius: 3px;
    margin: 10px 0 0px;
}

.joblistingsBox h3 a, .joblistingsBox i{
    color: #2d73c4;
    font-size: 22px;
}

.joblistingsBox p, .joblistingsBox li{
    color: #333;
}

.joblistingsBox li a{
    color: #ffffff;
    padding: 15px;
    /*margin: 15px auto;*/
    font-size: 18px;
}

.joblistingsBox li a.btn-success{
    margin-top: 5px;
}

.joblistingsBox li {
    line-height: inherit; /*line-height: 50px;*/
    padding: 0 0 5px 5px;
}


.ulPillar ul {
    margin: 0;
    padding: 5px 0 5px 35px;
    list-style: outside none none;
}

.ulPillar li {
    margin: 5px 0;
}

.ulPillar li a i {
    font-size: 15px;
    margin-right: 5px;
}

.current{
     color: #2d73c4 !important;
     font-family: helvetica, arial, sans-serif;
     font-weight: 700;
}

.currentHover {
    color: #2d73c4 !important;
    font-family: helvetica, arial, sans-serif;
    font-weight: 700;
}

.breadcrumbSection a {
    color: #ffffff;
}

.footer-shares{
    padding: 20px;
}

.footer-nav-links a{
    margin: auto 10px;
}

.footer-address address{
    color: #fff;
}

/*Fix screen height issue*/
/*Index Page*/
.heightFixed h2, .heightFixed .graduateJobsUl li {
    margin: 0 auto 10px auto;
}

/*Upload CV*/
/* layout.css Style */
.upload-drop-zone {
    height: 200px;
    border-width: 2px;
    margin-bottom: 20px;
}

/* skin.css Style*/
.upload-drop-zone {
    color: #ccc;
    border-style: dashed;
    border-color: #ccc;
    line-height: 200px;
    text-align: center
}

.upload-drop-zone.drop {
    color: #222;
    border-color: #222;
}

.font-pink{
    background-color: #e07ca5;
    color: #fff;
    font-size: 15px;
    padding: 5px;
    position: absolute;
    right: 0;
    top: 0;
}

.font-video i{
    color: #e07ca5;
    top: 5px;

}

.video-spec{
    position: absolute;
    top: 0;
    right: 15px;
}

/*
Testimonial Feefo
*/
.testimonials{
    min-height: 24vh;
}

.testimonials .feefo-badge{
    margin: 0 auto;
    display: block;
    width: 175px;
}
#quote-carousel {
    padding: 0 10px 30px 10px;
   /* margin-top: 15px;*/
}
#quote-carousel .carousel-control {
    background: none;
    color: #CACACA;
    font-size: 2.3em;
    text-shadow: none;
    margin-top: 30px;
}
#quote-carousel .carousel-indicators {
    position: relative;
    right: 50%;
    top: auto;
    bottom: 0px;
    margin-top: 20px;
    margin-right: -19px;
}
#quote-carousel .carousel-indicators li {
    width: 10px;
    height: 10px;
    cursor: pointer;
    border: 1px solid #ccc;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
    border-radius: 50%;
    opacity: 0.4;
    overflow: hidden;
    transition: all .4s ease-in;
    vertical-align: middle;
}
#quote-carousel .carousel-indicators .active {
    width: 20px;
    height: 20px;
    opacity: 1;
    transition: all .2s;
}
.item blockquote {
    border-left: none;
    margin: 0;
    font-style: italic;
    /*color: #999999;*/
}
.item blockquote p:before {
    content: "\f10d";
    font-family: 'Fontawesome';
    /*float: left;*/
    margin-right: 10px;
    font-size: 20px;
}

.item blockquote p:after {
    content: "\f10e";
    font-family: 'Fontawesome';
    /*float: right;*/
    margin-left: 5px;
    font-size: 20px;
}