/* ------------------------
---------------------------

		Home

---------------------------
---------------------------*/
#logo{
	margin-bottom: 30px;
    padding-left: 0px !important;
}


.techno {

  color: #4e4f51;
  font-size: 20px;
  font-weight: 200;
  min-height: 60px;
}

.description {
    padding-top:60px;
}

.first, .second, .third, .fourth,.fifth{
	position: relative;
}

.hub, .hub2 {
  color: #81be37;
  font-weight: 300;
  font-size: 20px;
}

#btn-modal{
	/*margin-top: 30px;*/
}


.btn:focus, .btn:hover{
  /*color: #4d4e50 !important;*/
  outline: none;
}


.medium-height{
	width: 100%;
	height:25px
}



#G,#R,#E,#E2,#N,#R2,#ACOLADE,#O1,#SLASH,#O2,#M,#btn-modal {
	display: none;
}

.hub,.hub2,.first,.second,.third,.fourth {
    display: none;
}


/* ------------------------
---------------------------

		Modal Content 

---------------------------
---------------------------*/



/* --------------------------------

Primary style

-------------------------------- */
*, *::after, *::before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

html, body {
    height: 100%;
}

html {
    font-size: 62.5%;
}

body {
    font-size: 1.6rem;
    font-family: "Open Sans", sans-serif;
    color: #0f594d;
    background-color: #f2e6cd;
}
@media only screen and (min-width: 1048px) {
    body {
        /* hide horizontal scroll bar in IE */
        overflow-x: hidden;
    }
}

a {
    color: #93a748;
    text-decoration: none;
}

b {
    font-weight: 500 !important;
}

/* --------------------------------

Main Components

-------------------------------- */
.cd-header {
    position: relative;
    height: 100%;
    background-color: #fff;
    /*box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);*/
    z-index: 1;
}

.slide2{
    background-color: #fff;
    color: #fff;
    -o-transition:0.5  ease-in;
    -ms-transition:0.5s  ease-in;
    -moz-transition:0.5s  ease-in;
    -webkit-transition:0.5s  ease-in;
    /* ...and now for the proper property */
    transition:0.5s ease-in;
    transition-delay: 0.5s;
}

.text{
    color: #888a8f !important;
    font-size: 2rem !important;
    font-weight: 200 !important;
    -font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.contact-email {
    line-height:2.4rem;
    font-weight: 300;
}

.contact-email  h4 {
    color: #ffffff !important;
}

.logo-header {
    margin-bottom: 70px;
}

.cd-header > .baseline {
    width: 75%;
    color: #e6e6e6;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    position: absolute;
    font-weight: 300;
    left: 50%;
    top: 42%;
    bottom: auto;
    right: auto;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    -o-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}

@media only screen and (min-width: 768px) {
    .cd-header > .baseline {
        font-size: 2rem !important;
        line-height:2.4rem;
        font-weight: 300;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }
}

.cd-fixed-background {
    position: relative;
    padding: 3em 5% 0;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}

.cd-fixed-background h2 {
    color: #fff;
    font-size: 3.4rem;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.cd-fixed-background h4 {
    color: #292c2f;
    font-size: 2rem;
    font-weight: 100;
    -font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.cd-fixed-background p {
    color: #292c2f;
    margin-top: 30px;
    font-size: 1.8rem;
    font-weight: 200;
}
/* ------light background --------- */


.cd-fixed-background .light-background h2 {
    color: #292c2f;
    font-size: 3.4rem;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.cd-fixed-background .light-background h4 {
    color: #BFBBBB;
    font-size: 2rem;
    font-weight: 100;
    -font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.cd-fixed-background .light-background p {
    color: #BFBBBB;
    margin-top: 30px;
    font-size: 1.8rem;
    font-weight: 200;
}
/* ------light background --------- */

.cd-fixed-background a {
    text-decoration: none;
    text-align: center;
    padding: 10px 20px;
    margin:35px 15px 0px 0px;
    color: #fff;
    background-color: #292c30;
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border: 0px solid #fff;
}
.cd-fixed-background a:hover {
    color: #fff;
    text-decoration: none;
    background-color: #34383c;
}


.cd-fixed-background .cd-content::after {
    /* phone image on small devices */
    content: '';
    display: block;
    width: 100%;
    padding: 60% 0;
    margin: 2em auto 0;
}

@media only screen and (min-width: 768px) {
    .cd-fixed-background {
        height: 100%;
        padding: 0;
    }
    .cd-fixed-background h2 {
        color: #fff;
        font-size: 3.4rem;
        font-weight: 300;
    }

    .cd-fixed-background h4 {
        color: #292c30;
        font-size: 2rem;
        font-weight: 300;
        -font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }

    .cd-fixed-background p {
        color:#34383c;
        margin-top: 30px;
        font-size: 1.8rem;
        font-weight: 200;
    }
    .cd-fixed-background .cd-content {
        width: 45%;
        position: absolute;
        left: 5%;
        top: 50%;
        bottom: auto;
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);
    }
    .cd-fixed-background .cd-content::after {
        display: none !important;
    }
    .cd-fixed-background.img-0 {
        background-color:#fff;
    }
    .cd-fixed-background.img-wacan {
        background-image: url("../img/wacan.jpg");
    }
    .cd-fixed-background.img-perlegrise {
        background-image: url("../img/perlegrise.jpg");
    }
    .cd-fixed-background.img-atk {
        background-image: url("../img/atk.jpg");
    }
    .cd-fixed-background.img-void {
        background-image: url("../img/void.jpg");
    }
    .cd-fixed-background.img-1 {
        background-image: url("../img/mevia.jpg");
    }
    .cd-fixed-background.img-2 {
        background-image: url("../img/basedepop.jpg");
    }
    .cd-fixed-background.img-3 {
        background-image: url("../img/vacancy.jpg");
    }
    .cd-fixed-background.img-4 {
        background-image: url("../img/study.jpg");
    }
    .cd-fixed-background.img-5 {
        background-image: url("../img/upro.jpg");
    }
    .cd-fixed-background.img-6 {
        background-image: url("../img/dwyt.jpg");
    }
}

@media only screen and (min-width: 1048px) {
    .cd-fixed-background {
        background-attachment: fixed;
    }
    .cd-fixed-background .cd-content {
        width: 40%;
        left: 10%;
    }
}


/*------------------------------
        NAVIGATION
-------------------------------*/

.cd-vertical-nav {
    position: fixed;
    z-index: 2;
    left: 3%;
    top: 52%;
    bottom: auto;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    display: none;
}
.cd-vertical-nav a {
    display: block;
    height: 30px;
    width: 30px;
    /* image replace */
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    background: transparent url(../img/cd-icon-arrow.svg) no-repeat center center;
    -webkit-transition: opacity 0.2s 0s, visibility 0.2s 0s;
    -moz-transition: opacity 0.2s 0s, visibility 0.2s 0s;
    transition: opacity 0.3s 0s, visibility 0.2s 0s;
}

.cd-vertical-nav a:hover {
        opacity: 0.5;
}

.cd-vertical-nav a.cd-prev {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
    margin-bottom: 10px;
}
.cd-vertical-nav a.inactive {
    visibility: hidden;
    opacity: 0;
    -webkit-transition: opacity 0.2s 0s, visibility 0s 0.2s;
    -moz-transition: opacity 0.2s 0s, visibility 0s 0.2s;
    transition: opacity 0.2s 0s, visibility 0s 0.2s;
}

/* Home cd-next launch */
.home-cd-next {
    position: fixed;
    z-index: 2;
    left: 48%;
    top: 85%;
    bottom: auto;
    display: none;
    height: 60px;
    width: 60px;
    /* image replace */
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    background: transparent url(../img/home-cd-icon-arrow.svg) no-repeat center center;
    -webkit-transition: all 0.2s 0s;
    -moz-transition: all 0.2s 0s;
    transition: all 0.3s 0s;
}

.home-cd-next:hover {
    background: transparent url(../img/home-cd-icon-arrow-hover.svg) no-repeat center center;

}



.mail {
    /*position: fixed;*/
    z-index: 2;
    left: 3%;
    /*top: 10%;*/
    bottom: auto;
    display: block;
    height: 30px;
    width: 30px;
    /* image replace */
    overflow: hidden;
    text-indent: 100%;
    margin-top: 10px;
    white-space: nowrap;
    background: transparent url(../img/cd-icon-mail.svg) no-repeat center center !important;
    -webkit-transition: opacity 0.2s 0s, visibility 0s 0.2s;
    -moz-transition: opacity 0.2s 0s, visibility 0s 0.2s;
    transition: opacity 0.2s 0s, visibility 0s 0.2s;
}

@media only screen and (min-width: 1024px) {
    .cd-vertical-nav {
        display: block;
    }
}

.no-js .cd-vertical-nav {
    display: none;
}

.cd-fixed-background.img-1 {
    background-color: #fff;
}

.cd-fixed-background.img-1 {
    background-color: #81be37;
}
.cd-fixed-background.img-1 .cd-content::after {
    background: url("../img/img-mobile-1.png") no-repeat;
    background-size: 100% auto;
}
.cd-fixed-background.img-2 {
    background-color: #4d4e50;
}
.cd-fixed-background.img-2 .cd-content::after {
    background: url("../img/img-mobile-2.png") no-repeat;
    background-size: 100% auto;
}
.cd-fixed-background.img-3 {
    background-color: #81be37;
}
.cd-fixed-background.img-3 .cd-content::after {
    background: url("../img/img-mobile-3.png") no-repeat;
    background-size: 100% auto;
}
.cd-fixed-background.img-4 {
    background-color: #4d4e50;
}
.cd-fixed-background.img-4 .cd-content::after {
    background: url("../img/img-mobile-4.png") no-repeat;
    background-size: 100% auto;
}
.cd-fixed-background.img-5 {
    background-color: #81be37;
}
.cd-fixed-background.img-5 .cd-content::after {
    background: url("../img/img-mobile-5.png") no-repeat;
    background-size: 100% auto;
}
.cd-fixed-background.img-6 {
    background-color: #4d4e50;
}
.cd-fixed-background.img-6 .cd-content::after {
    background: url("../img/img-mobile-6.png") no-repeat;
    background-size: 100% auto;
}

.cd-fixed-background.img-void {
    background-color: #4d4e50;
}
.cd-fixed-background.img-void .cd-content::after {
    background: url("../img/img-mobile-void.png") no-repeat;
    background-size: 100% auto;
}

.cd-fixed-background.img-perlegrise {
    background-color: #4d4e50;
}
.cd-fixed-background.img-perlegrise .cd-content::after {
    background: url("../img/img-mobile-perlegrise.png") no-repeat;
    background-size: 100% auto;
}

.cd-fixed-background.img-wacan {
    background-color: #81be37;
}
.cd-fixed-background.img-wacan .cd-content::after {
    background: url("../img/img-mobile-wacan.png") no-repeat;
    background-size: 100% auto;
}

.cd-fixed-background.img-atk {
    background-color: #4d4e50;
}
.cd-fixed-background.img-atk .cd-content::after {
    background: url("../img/img-mobile-atk.png") no-repeat;
    background-size: 100% auto;
}

.cd-fixed-background.contact {
    padding-top: 40%;
    background-color: #34383c;
}
.cd-fixed-background.contact .cd-content::after {
    background-size: 100% auto;
}


.mail a {
  	color: #81be37 !important;
}

.mail a:hover  {
  	color: #fff !important;
  	text-decoration: none;
}