body{
    font-family: 'Open Sans', sans-serif;
    background-color: #ececec;
}

.wrapper{
    margin:0 auto;
    max-width: 984px;
    padding:0 20px;
    position: relative;
}

a{
    color:#387c48;
}
a:hover{
    color:#37ba37;
}

ol{
    padding: 0 0 0 20px;
}

ol li{
    list-style-type:decimal
}

.green{
    color:#4fb548;
}

.dark-green{
    color:#387c48;
}

.orange{
    color:#f99e29;
}

.blue{
    color:#34bce2;
}

header{
    padding:0px 0 0;
    position: fixed;
    width: 100%;
    top:0;
    z-index: 9999;
}

@media only screen and (min-width: 1400px) {
    header .wrapper{
        max-width: 1320px;
    }
}

@media only screen and (min-width: 1200px) {
    header .wrapper{
        max-width: 1140px;
    }
}

header .wrapper{
    padding:0;
    max-width: 1024px;
    position: relative;
    z-index: 999;
}

#maincontainer{
    padding:120px 0 0;
}

p{
    margin:0px 0 20px;
	line-height: 21px;
}

.logo-container{
    display: inline-block;
    padding:0px 0px 0px 20px;
    background-color: #fff;
}

.logo-container::before{
    position: absolute;
    height: 100%;
    display: inline-block;
    background: #FFF;
    top: 0;
    left: -9999px;
    right: 100%;
    content: "";
}

.oblique{
    display: inline-block;
    background: #000;
}

.smu-logo,.bu-logo{
    padding:5px 0;
}

.logo-container div{
    display: inline-block;
    vertical-align: top;
}

.logo-side{
    border-left: 1px solid #122d70;
    display: inline-block;
    padding:0px 20px;
    margin:10px 0 10px 20px;
    color:#122d70;
    font-size:12px;
}

.logo-side strong{
    display: block;
    font-size:18px;
}

#header{
    background-color: #000;
}

#header nav{
    background-color:rgba(112, 112, 112, 0.8);
    color:white;
}

#header nav .wrapper{
    padding:0 20px;
}

#header nav .wrapper div{
    margin:0 -20px;
}

#header nav a{
    display: inline-block;
    padding:10px 0px;
    font-weight: bold;
    font-size:14px;
    color:#fff;
    margin:0 20px;
}

#header nav a:last-child{
    background-color: #707070;
    border-bottom:3px solid #707070;
    padding:10px 20px;
}
#header nav a.selected:last-child{
    border-bottom:3px solid #fff
}

.menu{
    background-color: #fff;
}
.menu a{
    border-bottom:3px solid transparent;
}
.menu a.selected{
    border-bottom:3px solid #fff;
}

.hero{
    background-image: url("../assets/home/hero.jpg");
    background-size: cover;
    background-position: center center;
    color:#fff;
    text-align: center;
    padding:200px 0;
    font-family: 'Oswald';
    margin:0 auto;
    z-index: 2;
    position: relative;
}

.hero blockquote{
    font-size:60px;
    line-height: 130%;
    font-weight: normal;
    font-weight: 300;
    text-shadow: 1px 1px 3px #000;
}

.hero span{
    display: block;
    margin:20px 0 50px;
    font-size: 30px;
    text-shadow: 1px 1px 3px #000;
}

.hero img{
    margin:0 auto 50px;
}
.hero a{
    color:#fff;
}

.button{
    background-color: #34bce2;
    border:0px solid white;
    display: inline-block;
    border-radius: 20px;
    padding: 4px 35px 5px;
    text-transform: uppercase;
    font-size:20px;
    font-family: "Oswald";
}

.button.cta{
    background-color: #f89c26;
    text-transform: uppercase;
}


.title-header{
    margin:30px 0;
    font-size:45px;
    font-family: 'Oswald';
    text-transform: uppercase;
    font-weight: bold;
	margin-top: 50px;
}

.title-header-alt{
    margin:30px 0;
    font-size:40px;
    font-family: 'Oswald';
    line-height: 130%;
}

.title-header-sub{
    font-size:25px;
    margin:30px 0;
    font-family: 'Oswald';
}

.title-header-seq{
    font-size:33px;
    line-height: 120%;
    font-weight: bold;
}

#about-us{
    position: absolute;
    width: 5px;
    height: 5px;
    border:0px solid red;
    margin-top:76px;
}

#footer{
    background-color: #1c1c1c;
    color:#fff;
    font-size:13px;
}

#footer .media{
    background-color:#e4e4e4;
    color:#10676e; 
}

#footer .media .wrapper{
    background-image:url("../assets/share/bg-footer.jpg");
    background-repeat: no-repeat;
    padding:30px 20px 40px;
}

#footer .media h4{
    font-size:40px;
    font-family: 'Oswald';
    display: inline-block;
}

#footer .media .wrapper span,#footer .media .wrapper div{
    display: inline-block;
}

#footer .media .wrapper span{
    border-top:2px solid #999;
    display: inline-block;
    width: 200px;
    position: relative;
    bottom:8px;
    margin:0 15px 0 20px;
}

#footer .media .wrapper span pre{
    background:#999;
    border-radius:20px;
    width: 11px;
    height: 11px;
    position: absolute;
    right:0;
    top:-7px;
}

#footer .media .wrapper div{
    position: relative;
    top:11px;
}

#footer .media .wrapper div a{
    display: inline-block;
    line-height: 0;
}

#footer .sitemap{
    display: flex;
    padding:70px 0;
    font-size:12px;
    color:#CBCBCB;
}

#footer .sitemap p{
    line-height: 150%;
}

#footer .sitemap div{
    flex:1;
    line-height: 200%;
}

#footer .sitemap h5{
    font-size:15px;
    font-weight: bold;
    text-transform: uppercase;
    font-family: "Oswald";
    margin:0 0 20px;
}

#footer .sitemap .sitemap-info{
    margin-top:0px;
    padding:20px 0;
}

#footer .sitemap .sitemap-info i{
    margin:0 5px 0 0;
} 

#footer .sitemap .sitemap-info span{
    display: block;
}

#footer .sitemap .divider{
    width:40px;
    height:3px;
    background-color: #CBCBCB;
    margin:5px 0;
}

#footer .sitemap .links p{
    line-height: 200%;
}

#footer .sitemap .links p a{
    color:#cbcbcb;
}

#footer .copyright{
    font-size:11px;
    border-top:1px solid #ccc;
    padding-top:10px;
    color:#CBCBCB;
}

#footer nav{
    margin-bottom:0px;
}

#footer nav a:first-child{
    padding-left:0;
    border-left:0;
}

#footer nav a{
    padding:0 10px;
    border-left:2px solid #ccc;
    color:#fff;
}

#footer .copyright span{
    display: block;
    padding:10px 0;
}


.alt-banner{
    padding:0 35px;
    background: #ebebeb;
}

.alt-banner .date{
    font-weight: bold;
}

.date{
    font-size:24px;
    position: relative;
    padding: 40px 0px;
    font-family: 'Oswald';
}

.date span{
    position: absolute;
    background-image: url("../assets/programme/ico2.png");
    background-size:50px 50px;
    width:50px;
    height: 50px;
    z-index: 0;
    margin-top:-8px
}

.date p{
    margin:0 0 0 20px;
    position: relative;
}



.small{
    display: none;
}

.smu-logo img{
    margin:6px 10px 0 0;
}

.bu-logo img{
    margin:5px 0 0;
    width: 157px;   
}

.oblique img{
    width:30px
}

.small-menu,.small-nav{
    display: none;
}

.sosumi{
    display: flex;
}

.social-media{
    width: 30%;
    text-align: right;
}

.social-media ul li{
    display: inline-block;
    margin:0 5px 0 0;
}

.social-media ul li a{
    font-size:30px;
    line-height: 0;
    opacity: 0.8;
    color:#fff;
}

#footer .social-media .menu-item{
    display: none;
}

.terms{
    width: 70%;
}

.backtotop{
    position: fixed;
    bottom:10px;
    right:10px;
    z-index: 1;
    cursor: pointer;
}

@media only screen and (max-width: 734px) {
    .small{
        display: inline-block;
    }
    .large{
        display: none;
    }

    .logo-container{
        padding-left:0;
    }

    .smu-logo{
        padding:2px 0px 5px 12px;
    }

    .bu-logo{
        padding:0;
    }

    .bu-logo img{
        width: 125px;
        position: relative;
        top:0px;
    }

    .oblique img{
        width:24px
    }

    .small-menu{
        display: block;
    }

    #maincontainer{
        padding:64px 0 0;
        background:#ebebeb;
    }
    .menu{
        display: none;
    }

    .small-menu{
        background: #fff;
        width: 40px;
        height: 40px;
        position: fixed;
        top:10px;
        right:10px;
        border-radius:10px;
        padding:9px;
        z-index: 9999;
    }

    .small-menu .hamburger{
        width: 100%;
        display: block;
        position: relative;
        top: 6px;
        background: #000;
        height: 3px;
        border-radius: 10px;
    }
    .small-menu .hamburger::before{
        width: 100%;
        height: 3px;
        background-color: #000;   
        display: block;
        position: relative;
        bottom:6px;
        content:"";
        transition: transform 0.5s;
        border-radius: 10px;
    }
    .small-menu .hamburger::after{
        width: 100%;
        height: 3px;
        background-color: #000;   
        display: block;
        position: relative;
        bottom:15px;
        content:"";
        transition: transform 0.5s,bottom 0.5s;
        border-radius: 10px;
    }

    .small-menu.active .hamburger{
        background-color: transparent;
    }
    .small-menu.active .hamburger::before{
        transform: rotate(-45deg);
    }
    .small-menu.active .hamburger::after{
        transform: rotate(45deg);
        bottom:9px;
    }

    #header .small-nav{
        display: block;
        left:-100vw;
        position: fixed;
        height: 100vh;
        width: 100vw;
        top:0;
        background-color: rgba(138, 112, 76, 0.9);
        transition: left 0.5s;
        z-index: 999;
        padding-top:50px;
    }
    #header .small-nav.active{
        left:0;
    }
    #header .small-nav a{
        display: block;
        border-left:3px solid transparent;
        color:#fff;
        margin:0;
        padding:10px 20px;
    }
    #header .small-nav a.selected{
        border-left:3px solid #fff;
    }
    #header .small-nav a:last-child{
        float: none;
        background-color: transparent;
        border-bottom:0;
        padding:10px 20px;
    }
    #header .small-nav a.selected:last-child{
        border-bottom:0;
    }
    
    .hero{
        padding:100px 0;
    }

    .title-header{
        font-size:40px;
    }
    .title-header-alt{
        font-size:30px;
    }

    #footer .media h4{
        font-size:24px;
    }
    #footer .media .wrapper span{
        display: none;
    }

    #footer .media .wrapper div{
        top:12px;
        margin-left:20px;
    }
    #footer .media div a{
        width:40px;
    }

    #footer .sitemap{
        display: block;
    }

    #footer .sitemap div{
        margin:0 0 20px;
    }

    #footer .copyright{
        text-align: center;
        margin:0 auto;
    }
    #footer .copyright .sosumi{
        display: block;
    }
    .terms{
        margin:0 0 20px;
    }
    .terms,.social-media{
        width: 100%;
        text-align: center;
    }

    .hero blockquote{
        font-size:35px;
        line-height: 120%;
    }

    .alt-banner{
        padding:0 10px;
    }
    .alt-banner p{
        font-size:20px;
        position: relative;
        z-index: 0;
    }
    .alt-banner .date{
        padding:20px 0;
    }
    .alt-banner img{
        width:100px;
    }
    .date span{
        z-index: 0;
    }

    #about-us{
        margin-top:36px;
    }

    .backtotop{
        width: 50px;
    }
}
