/* @override 
	http://dev-villa-maria.pantheonsite.io/sites/all/themes/bootstrap_villamaria/css/jessie.css?ovzcxj
	http://local.villamaria.qc.ca/sites/all/themes/bootstrap_villamaria/css/jessie.css?ow81o6
	http://local.villamaria.qc.ca/sites/all/themes/bootstrap_villamaria/css/jessie.css?ow827d */


/* secteur français, secteur anglais*/

#navbar .container {
    border-bottom: 1px solid #feedc4;
}

h1.title {
    font-family: 'Oswald', sans-serif;
    font-size: 52px;
}

h2 {
/*    margin-top: 30px !important;*/
}

body .field-type-text-with-summary h2.jaune{
    color: #fdb813;
    font-size: 22px;
    margin-top: 25px;
}

body .field-type-text-with-summary .option{
    font-size: 20px;
    font-weight: 600;
    margin-top: 25px;
    text-transform: uppercase;
    font-family: 'Oswald', sans-serif !important;
}

.pane-content h2 {
    font-family: 'Oswald', sans-serif !important;
    font-size: 22px;
    font-weight: 400;
}

h3 {
    font-family: 'Oswald', sans-serif !important;
}

h4,
h5 {
    font-size: 20px !important;
    color: #fdb813;
    text-transform: none !important;
    font-family: 'Oswald', sans-serif !important;
    font-size: 22px !important;
    margin-top: 25px;
}
h4.bleu{
    color: #003e6b;
}

div.panels-flexible-region.panels-flexible-region-9-content.panels-flexible-region-first.panels-flexible-region-last.col-lg-9 {
    padding-top: 10px;
}

.pane-content a,
.pane-content p,
.pane-content span {
    /*	font-family: 'Roboto', sans-serif !important;*/
}

#page-page p strong {
    font-family: 'Roboto', sans-serif;
    font-weight: 600;
}

.wrapper-ruban {
    position: fixed;
    top: -60px;
    left: 34px;
    background-image: url("/sites/all/themes/bootstrap_villamaria/img/top-ruban.png");
    background-size: cover;
    background-repeat: no repeat;
    background-position: top center;
    height: 280px;
    width: 111px;
    text-align: center;
    font-size: 14px;
    line-height: 110%;
    color: #003d6a;
    padding-top: 80px;
    transition: all linear 0.3s;
}
.ruban-plus{
    display: block;
    margin-top: 15px;
}

.wrapper-ruban span {
    text-transform: uppercase;
    font-weight: 500;
    font-family: 'Oswald', sans-serif;
    line-height: 120%;
    font-size: 20px;
    margin-top: 20px;
}

.wrapper-ruban .ruban-info {
    margin: 10px 0 10px 0;
    font-size: 14px;
    line-height: 120%;
}

.wrapper-ruban img {
    width: 26px;
    height: 26px;
    cursor: pointer;
}

.wrapper-ruban:hover {
    top: -20px;
}

.faq-question {
    background-color: #eee;
    padding: 5px;
    margin-top: 25px;
}

.btnSousMenu {
    background-color: #003e6b;
    padding: 5px 15px;
    color: #fff !important;
    text-decoration: none !important;
    font-weight: normal !important;
    text-transform: uppercase !important;
    font-family: 'Montserrat', sans-serif !important;
}

.btnSousMenuActif {
    background-color: #feb912;
}

.page-node .menu-block-wrapper {
    max-width: 1170px;
    margin: 0 auto;
}

.page-node .menu-block-wrapper ul:first-child {
    padding-top: 20px;
    padding-bottom: 20px;
    display: flex;
    display: -webkit-flex;
    display: -ms-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    justify-content: flex-start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: flex-start;
    align-items: stretch;
    clear: both;
}

.page-node .menu-block-wrapper ul li {
    /*float: left;*/
    width: auto;
    margin-right: 10px;
    margin-top: 10px;
}

.page-node .menu-block-wrapper ul li a {
    background-color: #003e6b;
    padding: 5px 15px;
    color: #fff !important;
    text-decoration: none !important;
    font-weight: normal !important;
    text-transform: uppercase !important;
    font-family: 'Oswald', sans-serif !important;
    font-size: 15px;
}

.page-node .menu-block-wrapper ul li a:hover {
    background-color: #feb912 !important;
}

.page-node .menu-block-wrapper ul li a.active {
    background-color: #feb912 !important;
}

.page-node .menu-block-wrapper ul li .menu.nav li a:hover {}

.page-node .menu-block-wrapper ul li .menu.nav li a {}

.page-node .menu-block-wrapper ul li .menu.nav li a:before {}

.page-node .menu-block-wrapper ul li a:hover {}

.page-node .menu-block-wrapper ul li ul a {}

.wrapper-footer-pourquoi {
    max-width: 1170px;
    margin: 0 auto;
    padding-top: 70px;
}

.footer-pourquoi-line {
    height: 4px;
    background-color: #fdb813;
    width: 100%;
    margin-top: 10px;
}

.footer-pourquoi-title {
    width: auto;
    text-align: center;
    font-size: 24px;
    text-transform: uppercase;
    margin-top: -20px;
}

.footer-pourquoi-title span {
    background-color: #ffffff;
    padding: 0 8px;
}

.footer-icones-section {
    position: relative;
    margin-top: 30px;
    display: flex;
    display: -webkit-flex;
    display: -ms-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    justify-content: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
}

.footer-icones-liste {
    width: 110px;
    margin-right: 0px;
    text-align: center;
    font-size: 14px;
    text-transform: uppercase;
    padding: 0;
}

.footer-icones-liste .icone-bg {
    width: 92px;
    height: 117px;
    margin: 0 auto;
    margin-bottom: -10px;
}

.icone-1 .icone-bg {
    background: url("/sites/all/themes/bootstrap_villamaria/img/footer-icons-section-milieudevie.png");
    background-size: cover;
}

.icone-2 .icone-bg {
    background: url("/sites/all/themes/bootstrap_villamaria/img/footer-icons-section-technopedagogie.png");
    background-size: cover;
}

.icone-3 .icone-bg {
    background: url("/sites/all/themes/bootstrap_villamaria/img/footer-icons-section-bilinguisme.png");
    background-size: cover;
}

.icone-4 .icone-bg {
    background: url("/sites/all/themes/bootstrap_villamaria/img/footer-icons-section-sports.png");
    background-size: cover;
}

.icone-5 .icone-bg {
    background: url("/sites/all/themes/bootstrap_villamaria/img/footer-icons-section-transport.png");
    background-size: cover;
}

.icone-1:hover .icone-bg {
    background: url("/sites/all/themes/bootstrap_villamaria/img/footer-icons-section-milieudevie-o.png");
    background-size: cover;
}

.icone-2:hover .icone-bg {
    background: url("/sites/all/themes/bootstrap_villamaria/img/footer-icons-section-technopedagogie-o.png");
    background-size: cover;
}

.icone-3:hover .icone-bg {
    background: url("/sites/all/themes/bootstrap_villamaria/img/footer-icons-section-bilinguisme-o.png");
    background-size: cover;
}

.icone-4:hover .icone-bg {
    background: url("/sites/all/themes/bootstrap_villamaria/img/footer-icons-section-sports-o.png");
    background-size: cover;
}

.icone-5:hover .icone-bg {
    background: url("/sites/all/themes/bootstrap_villamaria/img/footer-icons-section-transport-o.png");
    background-size: cover;
}

.footer-icone-fleche {
    width: 58px;
    height: 20px;
    background-image: url("/sites/all/themes/bootstrap_villamaria/img/icon-hover-fleche.png");
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover;
    margin: 0 auto;
    opacity: 0;
}

.footer-box-over {
    position: absolute;
    width: 100%;
    background-color: #FDB913;
    padding: 30px;
    margin-top: 0px;
    z-index: 2;
    text-transform: none;
    text-align: left;
    left: 0;
}

div.footer-box-over.box-1,
div.footer-box-over.box-2,
div.footer-box-over.box-3,
div.footer-box-over.box-4,
div.footer-box-over.box-5 {
    display: none;
}

.icone-1:hover .box-1,
.icone-2:hover .box-2,
.icone-3:hover .box-3,
.icone-4:hover .box-4,
.icone-5:hover .box-5 {
    display: block;
}

.icone-1:hover .footer-icone-fleche,
.icone-2:hover .footer-icone-fleche,
.icone-3:hover .footer-icone-fleche,
.icone-4:hover .footer-icone-fleche,
.icone-5:hover .footer-icone-fleche {
    opacity: 1;
}

.footer-icons-social {
    position: absolute;
    right: 0px;
    z-index: 10;
}

.footer-icons-social ul li {
    display: inline-block;
}

.footer-icones-liste .leaf i {
    margin-left: 13px;
    margin-top: 3px;
    font-size: 23px;
    color: #fdb813;
}

#block-menu-menu-villa-maria-footer--2 ul.menu.nav li.leaf a {
    padding-top: 5px;
}

.page-node .menu-block-wrapper {
    opacity: 1 !important;
}

div.wrapper-message-alerte {
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100%;
    z-index: 1;
    background-color: rgba(0, 0, 0, 0.6);
    z-index: 1000;
}

div.wrapper-message-alerte div.boite-message {
    position: relative;
    max-width: 80%;
    min-width: 230px;
    min-height: 150px;
    margin: 20px auto 0 auto;
    background-color: #ffffff;
    padding: 20px;
    border: 1px solid #000;
}

div.boite-message p {
    padding: 0;
    margin: 0 0 1.5em 0;
}

@media all and (min-width:800px) {
    div.wrapper-message-alerte div.boite-message {
        position: relative;
        max-width: 50%;
        min-width: 230px;
        min-height: 150px;
        margin: 80px auto 0 auto;
        background-color: #ffffff;
        padding: 20px;
        border: 1px solid #000;
    }
}

div.wrapper-message-alerte div.boite-message .fermer {
    position: absolute;
    top: 5px;
    right: 5px;
    height: 25px;
    width: 25px;
    /*background-color: #000;*/
    background-image: url(../img/btn-fermer.png);
    background-size: cover;
    cursor: pointer;
}

/*
div.wrapper-intro-video-accueil {
    width: 1170px;
    margin: 0 auto;
    margin-top: 10px;
    display: flex;
    display: -webkit-flex;
    display: -ms-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
}

div.wrapper-intro-video-accueil div.wrapper-texte-intro {
    width: calc(52% - 130px);
    margin-right: 130px;
}

div.wrapper-intro-video-accueil div.wrapper-texte-intro h1 {
    font-family: 'Oswald', sans-serif;
    font-size: 44px;
    text-transform: uppercase;
    font-weight: 400;
    margin-bottom: 20px;
}

div.wrapper-intro-video-accueil div.wrapper-texte-intro p {
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    line-height: 130%;
    font-weight: 400;
}

div.wrapper-intro-video-accueil div.wrapper-video {
    width: 48%;
    margin-top: 25px;
}

div.wrapper-intro-video-accueil div.wrapper-video img {
    width: 100%;
    cursor: pointer;
}
*/

div.wrapper-programme-distinction {
    background-image: url('../img/distinction-bg-accueil.jpg');
    background-size: 100% 100%;
    background-repeat: repeat-x;
}

div.wrapper-interne-programme-distinction {
    width: 665px;
    margin: 0 auto;
    margin-bottom: 40px;
    display: flex;
    display: -webkit-flex;
    display: -ms-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    -webkit-align-items: center;
    align-items: center;
    -ms-flex-align: center;
}

.icone-programme-distinction {
    width: 108px;
    height: 128px;
    background-image: url('../img/distinction-img-accueil.png');
    background-size: contain;
    background-repeat: no-repeat;
    margin: 45px 25px 45px 0;
}

div.wrapper-programme-distinction div.texte-programme-distinction h2 {
    font-family: 'Oswald', sans-serif;
    color: #fff;
    text-transform: uppercase;
    font-size: 24px;
    font-weight: 400;
    margin-top: 0 !important;
    margin-bottom: 15px;
}

div.wrapper-programme-distinction div.texte-programme-distinction {
    width: calc( 100% - 102px);
}

div.wrapper-programme-distinction div.texte-programme-distinction p {
    font-family: 'Roboto', sans-serif;
    color: #fff;
    font-size: 16px;
    line-height: 140%;
}

div.wrapper-programme-distinction div.texte-programme-distinction a {
    display: block;
    height: 32px;
    background-image: url('../img/distinction-plus-accueil.png');
    background-repeat: no-repeat;
    background-size: 32px 32px;
    font-size: 18px;
    text-transform: uppercase;
    font-family: 'Oswald', sans-serif;
    color: #fff;
    font-weight: 400;
    padding-top: 3px;
    padding-left: 40px;
}

/*
div.wrapper-etape-form {
    width: 1170px;
    margin: 0 auto;
    margin-top: 40px;
    display: flex;
    display: -webkit-flex;
    display: -ms-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    -webkit-align-items: top;
    align-items: top;
    -ms-flex-align: top;
    flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
}

div#webform-ajax-wrapper-302,
div#webform-ajax-wrapper-310 {
    width: 40%;
}

form#webform-client-form-302.webform-client-form.webform-client-form-302,
form#webform-client-form-310.webform-client-form.webform-client-form-310 {
    padding: 0px;
}

div.form-item.webform-component.webform-component-markup.webform-component--intro {
    margin-top: 0 !important;
}

form#webform-client-form-302.webform-client-form.webform-client-form-302 div,
form#webform-client-form-310.webform-client-form.webform-client-form-310 div,
#webform-ajax-wrapper-302 div.webform-confirmation,
#webform-ajax-wrapper-310 div.webform-confirmation {
    background-color: #fdb913;
}

#webform-ajax-wrapper-302 div.webform-confirmation,
#webform-ajax-wrapper-310 div.webform-confirmation {
    padding: 0 30px 30px 30px;
}

#webform-ajax-wrapper-302 div.links a.ajax-processed,
#webform-ajax-wrapper-310 div.links a.ajax-processed {
    display: none;
}

form#webform-client-form-302.webform-client-form.webform-client-form-302 h2,
form#webform-client-form-310.webform-client-form.webform-client-form-310 h2,
#webform-ajax-wrapper-302 div.webform-confirmation h2,
#webform-ajax-wrapper-310 div.webform-confirmation h2 {
    margin-top: 0 !important;
    margin-bottom: 25px;
    padding: 25px 0px 0 0px;
    font-family: 'Oswald', sans-serif;
    line-height: 120%;
    color: #fff;
    font-size: 36px;
    text-transform: uppercase;
    font-weight: 400;
}

form#webform-client-form-302.webform-client-form.webform-client-form-302,
form#webform-client-form-310.webform-client-form.webform-client-form-310,
#webform-ajax-wrapper-302 div.webform-confirmation,
#webform-ajax-wrapper-310 div.webform-confirmation {
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    font-weight: 300;
}
*/

/*
form#webform-client-form-302.webform-client-form.webform-client-form-302 p,
form#webform-client-form-310.webform-client-form.webform-client-form-310 p {
    padding-left: 0;
}

#webform-client-form-302 div.form-item label #webform-client-form-310 div.form-item label {
    font-weight: 400;
}

div.form-type-checkbox.form-item-submitted-je-consens-a-recevoir-des-courriels-du-college-villa-maria-Je-consens-à-recevoir-des-courriels-du-collège-Villa-Maria.form-item.checkbox label,
div.form-type-checkbox.form-item-submitted-i-agree-to-receive-emails-from-villa-maria-college.form-item.checkbox label,
div.form-item.form-item-submitted-im-the-parent-of-a-villa-maria-student-i’m-the-parent-of-a-villa-maria-student label,
div.form-item.form-item-submitted-je-suis-le-parent-dun-eleve-de-villa-maria-je-suis-le-parent-dun-élève-de-villa-maria label {
    padding-left: 10px;
}

#webform-client-form-302 div button.btn-primary.form-submit,
#webform-client-form-310 div button.btn-primary.form-submit {
    background-color: #213c6b;
    font-family: 'Oswald', sans-serif;
    width: 240px;
    text-align: center;
    padding: 5px 0;
    margin-left: calc( 50% - 120px);
    font-size: 20px;
    font-weight: 400;
}

#webform-client-form-302 div div,
#webform-client-form-310 div div {
    margin-top: 10px;
}

#webform-client-form-302 div div.form-item.webform-component,
#webform-client-form-310 div div.form-item.webform-component {
    padding: 0 25px 0 25px;
}

.form-item-submitted-je-consens-a-recevoir-des-courriels-du-college-villa-maria-je-consens-à-recevoir-des-courriels-du-collège-villa-maria.form-type-checkbox,
.form-item-submitted-i-agree-to-receive-emails-from-villa-maria-college-i-agree-to-receive-emails-from-villa-maria-college.form-type-checkbox {
    margin-left: 0;
    margin-top: 20px;
    padding-left: 0;
}

.form-item-submitted-je-suis-le-parent-dun-eleve-de-villa-maria-je-suis-le-parent-dun-élève-de-villa-maria.form-type-checkbox,
input#edit-submitted-im-the-parent-of-a-villa-maria-student-1.form-checkbox,
.form-item.form-item-submitted-im-the-parent-of-a-villa-maria-student-i’m-the-parent-of-a-villa-maria-student.form-type-checkbox {
    padding-left: 10px;
}

#webform-client-form-302 input.form-control,
#webform-client-form-302 input.form-text,
#webform-client-form-310 input.form-control,
#webform-client-form-310 input.form-text {
    padding: 5px;
    height: 35px;
    border-radius: 3px;
    border: 0;
}

div.wrapper-etape-form div.wrapper-etape-inscription {
    width: calc( 60% - 30px);
    margin-right: 30px;
    border-top: 1px solid #fdb913;
}

div.wrapper-etape-form div.wrapper-etape-inscription h2 {
    font-family: 'Oswald', sans-serif;
    font-size: 36px;
    text-transform: uppercase;
    font-weight: 400;
    margin-bottom: 35px;
}

div.wrapper-etape-form div.wrapper-etape-inscription div.etape span {
    display: block;
    float: left;
    margin-left: -120px;
    font-family: 'Oswald', sans-serif;
    font-size: 30px;
    font-weight: 400;
    background-color: #e5ecf0;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    text-align: center;
    padding-top: 7px;
    line-height: 40px;
}

div.wrapper-etape-form div.wrapper-etape-inscription div.etape {
    padding-left: 90px;
    padding-bottom: 40px;
    border-left: 2px dotted #7395ad;
    margin-top: 2px;
    margin-left: 45px;
}

div.wrapper-etape-form div.wrapper-etape-inscription div.etape:last-child {
    border: none;
}

div.wrapper-etape-form div.wrapper-etape-inscription div.etape:nth-child(2) {
    padding-top: 0 !important;
    margin-top: 30px;
}

div.wrapper-etape-form div.wrapper-etape-inscription div.etape h3 {
    font-family: 'Oswald', sans-serif;
    font-size: 20px;
    text-transform: uppercase;
    margin-top: 0;
    margin-left: -120px;
    padding-bottom: 0;
    padding-top: 0;
}

div.wrapper-etape-form div.wrapper-etape-inscription div.etape h4 {
    font-family: 'Roboto', sans-serif;
    font-size: 14px !important;
    font-weight: bold;
    color: #003e6b !important;
    margin-top: 20px;
}

div.wrapper-etape-form div.wrapper-etape-inscription div.etape p {
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    margin-left: -30px;
    padding-top: 0;
    padding-bottom: 0;
}

div.wrapper-etape-form div.wrapper-etape-inscription div.etape p:nth-child(2) {
    margin-left: 0px;
}
*/


/* ---------1025px------------------------------------------------------ */

@media all and (min-width: 1025px) {
/*
    div.wrapper-etape-form div.wrapper-etape-inscription div.etape a.collapse-btn {
        display: none;
    }
*/
}

/*
div.wrapper-etape-form div.wrapper-etape-inscription div.cta {
    margin-left: -30px;
}

div.wrapper-etape-form div.wrapper-etape-inscription div.cta a {
    text-transform: uppercase;
}

div.wrapper-etape-inscription div.etape div.wrapper-colonne {
    display: flex;
    display: -webkit-flex;
    display: -ms-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    margin-left: -30px;
}

div.wrapper-etape-inscription div.etape div.wrapper-colonne .date-colonne {
    width: 50%;
}

div.wrapper-etape-inscription div.etape div.wrapper-colonne .date-colonne p {
    margin-left: 0 !important;
}
*/


/* @group Page Profils */

div.wrapper-page-profils {
    /*max-width: 1470px;*/
    margin: 0 auto 0 0;
}

div.wrapper-page-profils div.col-gauche,
div.wrapper-page-profils div.col-droite {
    float: left;
    /*    display: inline-block;*/
}

div.col-droite {
    position: relative;
    max-width: 1170px;
    display: flex;
    display: -webkit-flex;
    display: -ms-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    justify-content: space-between;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    padding-bottom: 40px;
    margin-bottom: 40px;
    border-bottom: solid 1px #fdb913;
}

/*
div.col-1,
div.col-2 {
    float: left;
    width: calc(50% - 15px);
}

div.col-1 {
    margin-right: 30px;
}
*/

div.col-gauche {
    max-width: 300px;
    overflow: hidden;
    text-align: right;
}

#block-villa-maria-tools-page-profils div.wrapper-page-profils > ul {
    margin: 0;
    padding: 0;
    display: block;
}

div.wrapper-page-profils div.col-gauche img {
    width: 100%;
    max-width: 400px;
}

div.img-mobile img {
    width: 100px;
}

div.wrapper-page-profils ul li {
    display: flex;
    display: -webkit-flex;
    display: -ms-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    /*    padding-left: calc(100% / 3);
    background-size: calc(100% / 3);*/
}

div.wrapper-page-profils h2 {
    padding: 0;
    display: inline-block;
    margin: 0 !important;
    text-transform: uppercase;
    font-family: 'Oswald', sans-serif;
}

div.wrapper-page-profils .aptitudes ul li,
div.wrapper-page-profils .cegep ul li {
    display: list-item;
    list-style-type: disc;
    padding-left: 0;
    margin-left: -22px;
}

div.wrapper-page-profils .metiers ul li {
    display: list-item;
    list-style-type: disc;
}

div.wrapper-page-profils div.wrapper-titre-documentation > img {
    width: 75px;
    height: 75px;
    margin-right: 20px;
}

/*
div.wrapper-video,
div.wrapper-introduction,
div.metiers,
div.cours-specifiques,
div.aptitudes,
div.cegep {
    margin-top: 40px;
    width: calc(100% - 105px);
}
*/

div.col-droite div.col-2 div.cours-specifiques {
    margin-top: 0;
}

div.col-droite div.col-2 div.cours-specifiques h3 {
    margin-top: 0;
}


/* test sans video  */


/*div.col-droite div.col-1 div.wrapper-video {
	margin-top: 0;
	display: none;
}*/


/* test sans video - fin  */

div.col-droite div.col-1 div.wrapper-video {
    margin-top: 0px;
}

div.wrapper-titre-documentation {
    display: flex;
    display: -webkit-flex;
    display: -ms-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    /*
    justify-content:space-between;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
*/
    overflow: hidden;
    margin-bottom: 30px;
    width: 100%;
}

div.wrapper-page-profils div.documentation {
    position: absolute;
    top: 0;
    right: 0;
}

div.wrapper-page-profils div.documentation h3 {
    margin-top: 5px;
}

div.wrapper-page-profils div.documentation a {
    color: #003e6b;
    font-weight: 100;
    display: inline-block;
    padding-left: 45px;
    background-repeat: no-repeat;
    background-position: 0;
    background-size: 32px;
}

div.wrapper-page-profils li#steam div.documentation a {
    background-image: url(../img/icone-telechargement-vert.png);
}

div.wrapper-page-profils li#health-sciences div.documentation a,
div.wrapper-page-profils li#sciences-de-la-sante div.documentation a {
    background-image: url(../img/icone-telechargement-rouge.png);
}

div.wrapper-page-profils li#entrepreneurship--leadership div.documentation a,
div.wrapper-page-profils li#entrepreneuriat-et-leadership div.documentation a {
    background-image: url(../img/icone-telechargement-orange.png);
}

div.wrapper-page-profils li#law--international-studies div.documentation a,
div.wrapper-page-profils li#droit-et-etudes-internationales div.documentation a {
    background-image: url(../img/icone-telechargement-bleu.png);
}

div.wrapper-page-profils h3 {
    font-size: 1.43em;
    text-transform: uppercase;
    font-weight: 400;
    margin-top: 10px;
}

div.metiers ul li {
    margin: 0;
    padding: 0;
    list-style-type: disc
}

div.metiers ul {
    padding: 0 0 0 1.4em;
    margin: 0;
}

div.wrapper-video h3:first-child {
    margin-top: 0;
}

.HYPE_scene {
    background-color: transparent !important;
}

body.page-node-307 .panels-flexible-9 .panels-flexible-row .field-name-field-image > .field-items > .field-item {
    height: calc(100vw * 0.22);
}


/* @end */


/* ---------1600px--------Pour Profil---------------------------------------------- */

@media all and (max-width: 1600px) {
    #block-villa-maria-tools-page-profils div.wrapper-page-profils > ul {
        width: 1170px;
        margin: 0 auto;
        padding: 0;
        display: block;
    }
    div.wrapper-titre-documentation h2 {
        width: 60%;
    }
    div.col-gauche {
        width: 25% !important;
    }
    div.col-droite {
        width: 75%;
    }
    div.col-droite div.col-1 div.wrapper-video img {
        width: 100%;
    }
/*
    div.col-1 {
        margin-right: 0px;
    }
*/
/*
    div.wrapper-video,
    div.wrapper-introduction,
    div.metiers,
    div.cours-specifiques,
    div.aptitudes,
    div.cegep {
        width: calc(100% - 35px);
    }
*/
}


/* ---------1200px------------------------------------------------------ */

@media all and (max-width: 1200px) {
    /*.not-front div.pane-content{
		max-width: 1170px;
		margin: 0 30px;
	}*/
/*
    div.wrapper-presentation-profils {
        margin: 50px 40px 0 40px !important;
    }
*/
/*
    div.wrapper-etape-form {
        max-width: 1170px;
        width: auto;
        margin: 40px 40px 0 40px;
    }
*/
    #block-villa-maria-tools-page-profils div.wrapper-page-profils > ul {
        max-width: 1170px;
        width: auto;
        margin: 0 30px;
    }
    div.wrapper-titre-documentation h2 {
        width: 45%;
    }
    .wrapper-footer-pourquoi {
        max-width: 1170px;
        margin: 0 30px;
    }
    .page-node .menu-block-wrapper {
        max-width: 1170px;
        /*margin: 0 30px;*/
    }
/*
    div.wrapper-intro-video-accueil {
        max-width: 1170px;
        width: auto;
        margin: 30px 30px 0 30px;
    }
*/
}


/* ---------991px--------------------------------------------------------- */

@media all and (max-width: 991px) {
    div.col-1,
    div.col-2 {
        float: none;
        width: 100%;
    }
    div.col-2 {
        margin-top: 40px;
    }
    div.col-droite div.col-1 div.wrapper-video img {
        max-width: 450px;
    }
    div.col-droite div.col-1 div.documentation {
        position: relative;
        margin-top: 40px;
    }
/*
    div.wrapper-intro-video-accueil div.wrapper-texte-intro {
        width: calc(52% - 40px);
        margin-right: 40px;
    }
*/
    .footer-icons-social {
        display: none;
        /*position: absolute;
		left: -60px;
		right: auto;*/
    }
    .footer-icons-social ul li {
        display: inline-block;
    }
    .footer-icones-liste .leaf i {
        margin-left: 10px;
        margin-top: 220px;
        font-size: 23px;
        color: #fdb813;
    }
}

#block-villa-maria-tools-video-profil-front {
    background-color: #003e6b;
    overflow: hidden;
    margin-top: -100px;
    padding: 30px 0;
}

#block-villa-maria-tools-video-profil-front img {
    width: 290px;
    cursor: pointer;
}

#block-villa-maria-tools-video-profil-front iframe {
    display: inline-block
}

div.wrapper-video-profil-front {
    max-width: 1440px;
    margin: 0 auto;
    display: flex;
    display: -webkit-flex;
    display: -ms-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    justify-content: space-around;
    -webkit-justify-content: space-around;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    align-items: center;
    -ms-flex-align: center;
}

div.wrapper-video-profil-front span {
    display: inline-block;
    color: white;
    text-transform: uppercase;
    font-size: 1.429em;
    margin: 0 40px;
    font-weight: 300;
}

@media only screen and (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
    div.wrapper-video-profil-front span {
        display: block;
        margin: 20px 0;
        width: 100%;
        text-align: center;
    }
    #block-villa-maria-tools-video-profil-front {
        font-size: 1em;
    }
}

@media only screen and (max-width: 1099px) {
    div.wrapper-video-profil-front span {
        font-size: ;
    }
}

@media only screen and (min-width: 320px) and (max-width: 768px) {
    div.wrapper-video-profil-front {
        width: 100%;
        margin: 0;
    }
    .content-video-profil-front {
        text-align: center;
    }
    div.wrapper-video-profil-front span {
        display: block;
        margin: 20px 0;
        width: 100%;
        text-align: center;
    }
    #block-villa-maria-tools-video-profil-front {
        padding: 0;
    }
}


/* ---------775px------------------------------------------------------------ */

@media all and (max-width: 775px) {
/*
    div.wrapper-intro-video-accueil {
        display: block;
        margin-top: 20px;
    }
    div.wrapper-intro-video-accueil div.wrapper-texte-intro {
        width: 100%;
        margin-right: 0px;
        margin-bottom: 30px;
    }
    div.wrapper-intro-video-accueil div.wrapper-video {
        width: 100%;
    }
*/
    .footer-icones-section {
        flex-wrap: wrap;
        -webkit-flex-wrap: wrap;
    }
}


/* ---------700px-------------------------------------------------------------- */

@media all and (max-width: 700px) {
    .wrapper-footer-pourquoi {
        display: none;
    }
}


/* ---------500px---------------------------------------------------------------- */

@media all and (max-width: 500px) {
    .wrapper-ruban {
        display: none;
    }
/*
    div.wrapper-intro-video-accueil div.wrapper-video {
        display: none;
    }
*/
}

@media all and (max-width: 400px) {}