@font-face {
    font-family: 'regular';
    src: url(../fonts/Nobel-Regular.woff);
}

* {
    padding: 0;
    margin: 0;
    font-family: "nobel", sans-serif;
}

body {
    font-family: 'regular';
}



/*********************************************************************************************
 *********************************************************************************************
 ************************************* GROTERE VERSIE ****************************************
 *********************************************************************************************
 *********************************************************************************************/




/*********************************************************************************************
 ***************************************** HOME **********************************************
 *********************************************************************************************/

/********************************************************************** SLOGAN PHOTO **/

.container {
    width: 100vw;
    height: 100vh;
}

.homeReflectDesign {
    width: 100vw;
    height: 100vh;
    overflow: hidden;

    position: relative;
}

.homeReflectDesignImage {
    background-image: url(../img/HomePageDesignReflectTinosaGrafix.png);
    background-size: cover;
    background-attachment: fixed;

    width: 100vw;
    height: 100vh;
}



/******************************************************************** TINOSA GRAFIX **/

.container2 {
    width: 100vw;
    height: 100vh;

    overflow: hidden;

    position: relative;
}


/******************************************************** HEADER **/

header {
    display: flex;
}

.homeReflectDesignLogo {
    background-image: url(../img/LongLogoBlackTinosaGrafix.png);
    background-size: contain;
    background-repeat: no-repeat;

    width: 14.5vw;
    height: 14.5vh;

    position: absolute;
    top: 20px;
    left: 20px;
}

ul {
    display: flex;
    flex-wrap: nowrap;
    gap: 50px;

    justify-content: right;

    position: absolute;
    top: 7vh;
    left: 320px;
}

li {
    list-style: none;
}

#homeNav, #aboutNav, #workNav, #contactNav{
    display: block;
}

#homeNav::before, #aboutNav::before{
    content: "";

    display: block;
    background-color: #A9D6E4;

    width: 55px;
    height: 7px;

    position: absolute;
    left: -5px;
    top: 12px;

    z-index: -1;
}

#aboutNav::before{
    content: "";

    display: block;
    background-color: #A9D6E4;

    width: 58px;
    height: 7px;

    position: absolute;
    left: 90px;
    top: 12px;

    z-index: -1;
}

#workNav::before{
    content: "";

    display: block;
    background-color: #A9D6E4;

    width: 52px;
    height: 7px;

    position: absolute;
    left: 187px;
    top: 12px;

    z-index: -1;
}

#contactNav::before{
    content: "";

    display: block;
    background-color: #A9D6E4;

    width: 73px;
    height: 7px;

    position: absolute;
    left: 276px;
    top: 12px;

    z-index: -1;
}

.homeNavLinkA {
    color: black;
    text-decoration: none;

    font-size: 20px;
    font-weight: 200;
}

.homeShopCart {
    background-color: #A9D6E4;

    width: 150px;
    height: 150px;

    position: absolute;
    right: 0vw;
    top: 0vh;
}

.homeShoppingCart {
    background-image: url(../img/shoppingCartTinosaGrafix.png);
    background-size: contain;
    background-repeat: no-repeat;

    width: 50px;
    height: 50px;

    position: absolute;
    right: 3vw;
    top: 6.5vh;
}



/********************************************************* MAIN **/
.homeShortAboutBackgroundColor {
    background-color: #698DC4;

    height: 100vh;
    width: 40vw;

    position: absolute;
    right: 10vw;
    top: 0;

    z-index: -10;
}

.homeShortAboutImage {
    background-image: url(../img/TinosaGrafix.jpeg);
    opacity: 20%;

    height: 100vh;
    width: 40vw;

    position: absolute;
    right: 10vw;
    top: 0;

    z-index: -10;
}

.homeShortAboutText {
    position: absolute;
    left: 16.1vw;
    top: 35vh;
}

.homeShortAboutTitle {
    font-size: 60px;
    font-weight: 900;
    line-height: 100%;
}

.homeShortAboutStoryP {
    font-size: 23.5px;
    font-weight: 300;

    margin: 50px 0;
}

.homeShortAboutLinkA {
    color: black;
    text-decoration: none;

    font-size: 25px;
    font-weight: 400;

    z-index: 1;

    display: block;
}

.homeShortAboutLinkA::before{
    content: "";

    display: block;
    background-color: #A9D6E4;

    width: 240px;
    height: 7px;

    position: relative;
    top: 22px;
    left: -10px;

    z-index: -1;
}



/******************************************************** FOOTER **/
footer {
    width: 150px;
    height: 40px;
}

.footerIconsContainer {
    display: flex;

    width: 150px;
    height: 40px;

    position: relative;
    top: 90vh;
    left: 1200px;
}

.ABfooterIconsContainer {
    display: flex;

    width: 150px;
    height: 40px;

    position: relative;
    top: 170vh;
    left: 1200px;
}

.WOfooterIconsContainer {
    display: flex;

    width: 150px;
    height: 40px;

    position: relative;
    top: 270vh;
    left: 1200px;
}

.COfooterIconsContainer {
    display: flex;

    width: 150px;
    height: 40px;

    position: relative;
    top: 190vh;
    left: 1200px;
}

.PHfooterIconsContainer {
    display: flex;

    width: 150px;
    height: 40px;

    position: relative;
    top: 145vh;
    left: 1200px;
}

.LOfooterIconsContainer {
    display: flex;

    width: 150px;
    height: 40px;

    position: relative;
    top: 75vh;
    left: 1200px;
}

.footerIcons {
    background-size: contain;
    background-repeat: no-repeat;

    width: 30px;
    height: 30px;
}

.footerFB {
    background-image: url(../img/FacebookIconTinosaGrafix.png);

    position: absolute;
    bottom: 0;
    right: 5px;
}

.footerFBLight {
    background-image: url(../img/lightFacebookIcon.png);

    position: absolute;
    bottom: 0;
    right: 5px;
}

.footerINSTA {
    background-image: url(../img/InstagramIconTinosaGrafix.png);

    position: absolute;
    bottom: 0;
    right: -30px;
}

.footerINSTALight {
    background-image: url(../img/lightInstagramIcon.png);

    position: absolute;
    bottom: 0;
    right: -30px;
}

.footerIN {
    background-image: url(../img/LinkedInIconTinosaGrafix.png);

    position: absolute;
    bottom: 0;
    right: -75px;
}

.footerINLight {
    background-image: url(../img/lightLinkedInIcon.png);

    position: absolute;
    bottom: 0;
    right: -75px;
}











/*********************************************************************************************
 **************************************** ABOUT **********************************************
 *********************************************************************************************/

.aboutBackgroundColor {
    background-color: #1A4475;

    height: 180vh;
    width: 45vw;

    position: absolute;
    right: 0vw;
    top: 0;

    z-index: -10;
}

.aboutImage {
    background-image: url(../img/TinosaGrafix.jpeg);
    background-size: contain;

    width: 600px;
    height: 600px;

    position: absolute;
    right: 15vw;
    top: 30vw;
}

.aboutLinkA {
    color: #A9D6E4;
    text-decoration: none;

    font-size: 25px;
    font-weight: 400;

    z-index: 1;

    border-bottom: #A9D6E4 7px solid;
}

.aboutLinkAInactive {
    color: #e2e2e2;
    text-decoration: none;

    font-size: 25px;
    font-weight: 400;

    z-index: 1;

    border-bottom: #e2e2e2 7px solid;

    margin-left: 180px;
}

.aboutLinkASk {
    color: #A9D6E4;
    text-decoration: none;

    font-size: 25px;
    font-weight: 400;

    z-index: 1;

    border-bottom: #A9D6E4 7px solid;
    margin-left: 180px;
}

.aboutLinkAInactiveSk {
    color: #e2e2e2;
    text-decoration: none;

    font-size: 25px;
    font-weight: 400;

    z-index: 1;

    border-bottom: #e2e2e2 7px solid;
}











/*********************************************************************************************
 ***************************************** WORK **********************************************
 *********************************************************************************************/

.workBackgroundColor {
    background-color: #1A4475;

    height: 280vh;
    width: 45vw;

    position: absolute;
    right: 0vw;
    top: 0;

    z-index: -10;
}

.workBigColorLine {
    background-color: #698DC4;

    width: 280px;
    height: 1670px;

    position: absolute;
    left: 655px;
    top: 54vh;

    z-index: -5;
}

.workNav {
    display: flex;

    gap: 109px;

    margin-top: 200px;

    position: relative;
}

.workNavText {
    margin-top: 80px;
}

.workH2 {
    font-weight: 300;
    font-size: 23px;
}

.workP {
    margin: 20px 0;
    font-weight: 100;
    font-size: 20px;
}

.workLinkA {
    font-weight: 500;
    font-size: 23px;

    color: black;

    text-decoration: none;
}

.workImg {
    height: 350px;
    width: 350px;

    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.workImg1 {
    background-image: url(../img/workAccMan.png);
}

.workImg2 {
    background-image: url(../img/workGrapDesign.png);
}

.workImg3 {
    background-image: url(../img/workPho.png);
}

.workLinkA1::before{
    content: "";

    display: block;
    background-color: #A9D6E4;

    width: 280px;
    height: 7px;

    position: absolute;
    top: 258px;
    left: -5px;

    z-index: -1;
}

.workLinkA2::before{
    content: "";

    display: block;
    background-color: #A9D6E4;

    width: 195px;
    height: 7px;

    position: absolute;
    top: 258px;
    left: -5px;

    z-index: -1;
}

.workLinkA3::before{
    content: "";

    display: block;
    background-color: #A9D6E4;

    width: 225px;
    height: 7px;

    position: absolute;
    top: 210px;
    left: -5px;

    z-index: -1;
}











/*********************************************************************************************
 ********************************** ACCOUNT MANAGEMENT ***************************************
 *********************************************************************************************/

.amImage {
    background-image: url(../img/AMSamsung.png);
    background-size: cover;

    width: 425px;
    height: 600px;

    position: absolute;
    right: 20vw;
    top: 30vw;
}

strong {
    display: block;
    color: #37B2AA;

    font-size: 40px;
    width: 300px;

    position: relative;
    left: 3vw;
}











/*********************************************************************************************
 ************************************** PHOTOGRAPHY ******************************************
 *********************************************************************************************/

.photoImage {
    background-image: url(../img/PvH/ruimteman.jpg);
    background-size: contain;

    width: 400px;
    height: 600px;

    position: absolute;
    right: 28.9vw;
    top: 30vw;
}

.workPhotoTitle {
    color: #37B2AA;
    font-weight: 600;

    margin-bottom: 20px;
}

.workText {
    margin: 320px 0;
}

/******************************************************** SLIDE **/

.photosSlide {
    position: relative;

    top: 150vh;
}

.viewport-stretch {
    min-height: 100vh;
}

.photosSlide1 {
    background-image: url(../img/PvH/PG1.jpg);
    background-size: cover;
}

.photosSlide2 {
    background-image: url(../img/PvH/PG2.jpg);
    background-size: cover;
    background-attachment: fixed;
}

.photosSlide3 {
    background-image: url(../img/PvH/PG3.jpg);
    background-size: cover;
}

.photosSlide4 {
    background-image: url(../img/PvH/PG4.jpg);
    background-size: cover;
}

.photosSlide5 {
    background-image: url(../img/PvH/PG5.jpg);
    background-attachment: fixed;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    background-color: #A9D6E4;
}

.photosSlide6 {
    background-image: url(../img/PvH/PG6.jpg);
    background-size: cover;
    background-attachment: fixed;
}

.photosSlide7 {
    background-image: url(../img/PvH/PG7.jpg);
    background-size: cover;
}

.photosSlide8 {
    background-image: url(../img/PvH/PG8.jpg);
    background-size: cover;
    background-attachment: fixed;
}

.photosSlide9 {
    background-image: url(../img/PvH/PG9.jpg);
    background-size: cover;
}

.photosSlide10 {
    background-image: url(../img/PvH/PG10.jpg);
    background-size: cover;
}

.photosSlide11 {
    background-image: url(../img/PvH/PG11.jpg);
    background-attachment: fixed;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    background-color: #A9D6E4;
}

.photosSlide12 {
    background-image: url(../img/PvH/PG12.jpg);
    background-attachment: fixed;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    background-color: #A9D6E4;
}

.photosSlide13 {
    background-image: url(../img/PvH/PG13.jpg);
    background-size: cover;
}

.photosSlide14 {
    background-image: url(../img/PvH/PG14.jpg);
    background-size: cover;
    background-attachment: fixed;
}

.photosSlide15 {
    background-image: url(../img/PvH/PG15.jpg);
    background-size: cover;
}

.photosSlide16 {
    background-image: url(../img/PvH/PG16.jpg);
    background-attachment: fixed;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    background-color: #A9D6E4;
}


.photosSlide17 {
    background-image: url(../img/PvH/PG17.jpg);
    background-size: cover;
}

.photosSlide18 {
    background-image: url(../img/PvH/PG18.jpg);
    background-attachment: fixed;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    background-color: #A9D6E4;
}

.photosSlide19 {
    background-image: url(../img/PvH/PG19.jpg);
    background-size: cover;
}

.photosSlide20 {
    background-image: url(../img/PvH/PG20.jpg);
    background-size: cover;
    background-attachment: fixed;
}

.photosSlide21 {
    background-image: url(../img/PvH/PG21.jpg);
    background-size: cover;
}

.photosSlide22 {
    background-image: url(../img/PvH/PG22.jpg);
    background-attachment: fixed;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    background-color: #A9D6E4;
}

.photosSlide23 {
    background-image: url(../img/PvH/PG23.jpg);
    background-size: cover;
}

.photosSlide24 {
    background-image: url(../img/PvH/PG24.jpg);
    background-attachment: fixed;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    background-color: #A9D6E4;
}

.photosSlide25 {
    background-image: url(../img/PvH/PG25.jpg);
    background-size: cover;
}

.photosSlide26 {
    background-image: url(../img/PvH/PG26.jpg);
    background-size: cover;
    background-attachment: fixed;
}

.photosSlide27 {
    background-image: url(../img/PvH/PG27.jpg);
    background-size: cover;
}

.photosSlide28 {
    background-image: url(../img/PvH/PG28.jpg);
    background-attachment: fixed;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    background-color: #A9D6E4;
}

.photosSlide29 {
    background-image: url(../img/PvH/PG29.jpg);
    background-size: cover;
}

.photosSlide30 {
    background-image: url(../img/PvH/PG30.jpg);
    background-attachment: fixed;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    background-color: #A9D6E4;
}

.photosSlide31 {
    background-image: url(../img/PvH/PG31.jpg);
    background-size: cover;
}

.photosSlide32 {
    background-image: url(../img/PvH/PG32.jpg);
    background-size: cover;
    background-attachment: fixed;
}

.photosSlide33 {
    background-image: url(../img/PvH/PG33.jpg);
    background-size: cover;
    background-attachment: fixed;
}

.photosSlide34 {
    background-image: url(../img/PvH/PG34.jpg);
    background-size: cover;
}

.photosSlide35 {
    background-image: url(../img/PvH/PG35.jpg);
    background-attachment: fixed;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    background-color: #A9D6E4;
}

.photosSlide36 {
    background-image: url(../img/PvH/PG36.jpg);
    background-size: cover;
}











/*********************************************************************************************
 ************************************ GRAPHIC DESIGN *****************************************
 *********************************************************************************************/

.workImage {
    background-image: url(../img/homeWorkPhotoTinosaGrafix.png);
    background-size: cover;
    opacity: 20%;

    height: 100vh;
    width: 40vw;

    position: absolute;
    right: 10vw;
    top: 0;
}

.graphicDesignP {
    font-weight: 300;
    font-size: 23.5px;

    margin: 50px 0;
}

.workWrap {
    display: flex;
    flex-wrap: wrap;
}

.workA {
    color: black;
    text-decoration: none;

    font-size: 25px;
    font-weight: 400;

    margin-bottom: 15px;
    display: block;

    border-bottom: white 7px solid;
}

#andless {
    width: 110px;
    position: relative;
}

#andlessLine {
    background-color: #A9D6E4;

    z-index: -1;

    width: 100px;
    height: 7px;

    position: absolute;

    top: 17px;
    left: -10px;

    opacity: 0;
}


#ams {
    width: 110px;
    position: relative;
}

#amsLine {
    background-color: #A9D6E4;

    z-index: -1;

    width: 72px;
    height: 7px;

    position: absolute;
    top: 17px;
    left: -10px;

    opacity: 0;
}


#downdog {
    width: 120px;
    position: relative;
}

#downdogLine {
    background-color: #A9D6E4;

    z-index: -1;

    width: 115px;
    height: 7px;

    position: absolute;
    top: 17px;
    left: -10px;

    opacity: 0;
}

#logo {
    width: 85px;
    position: relative;
}

#logoLine {
    background-color: #A9D6E4;

    z-index: -1;

    width: 82px;
    height: 7px;

    position: absolute;
    top: 17px;
    left: -10px;

    opacity: 0;
}

#card {
    width: 85px;
    position: relative;
}

#cardLine {
    background-color: #A9D6E4;

    z-index: -1;

    width: 80px;
    height: 7px;

    position: absolute;
    top: 17px;
    left: -10px;

    opacity: 0;
}

#mDesigns {
    width: 140px;
    position: relative;
}

#mDesignsLine {
    background-color: #A9D6E4;

    z-index: -1;

    width: 150px;
    height: 7px;

    position: absolute;
    top: 17px;
    left: -10px;

    opacity: 0;
}

#andless:hover #andlessLine,
#ams:hover #amsLine,
#downdog:hover #downdogLine,
#logo:hover #logoLine,
#card:hover #cardLine,
#mDesigns:hover #mDesignsLine {
    opacity: 1;
}











/*********************************************************************************************
 **************************************** ANDLESS ********************************************
 *********************************************************************************************/

.AnDlessImage {
    background-image: url(../img/Andless/AnDless.jpg);
    background-size: cover;
    background-position: center;

    width: 600px;
    height: 600px;

    position: absolute;
    right: 15vw;
    top: 30vw;
}

.AnDlessBackgroundColor {
    background-color: #1A4475;

    height: 275vh;
    width: 45vw;

    position: absolute;
    right: 0vw;
    top: 0;

    z-index: -1;
}

/******************************************************** SLIDE **/

.slideshow-container {
    height: 700px;
    position: relative;
    margin: auto;
    width: 700px;
}

.BDslideshow-container {
    height: 700px;
    position: relative;
    margin: auto;
    width: 500px;
}

.Aprev,
.Anext {
    cursor: pointer;
    position: absolute;
    top: 45%;

    color: #37B2AA;
    font-weight: bold;
    font-size: 80px;
    transition: 0.6s ease;

    user-select: none;
}

.Aprev {
    left: -80px;
}

.Anext {
    right: -80px;
}

.dot,
.dot1,
.dot2,
.dot3 {
    cursor: pointer;
    height: 15px;
    width: 15px;
    margin: 0 2px;
    background-color: rgba(187, 187, 187, 0.432);
    border-radius: 50%;
    display: inline-block;
    transition: background-color 0.6s ease;
}

.active,
.dot:hover,
.dot1:hover,
.dot2:hover,
.dot3:hover {
    background-color: #37B2AA;
}











/*********************************************************************************************
 ****************************************** AMS **********************************************
 *********************************************************************************************/

.AMSImage {
    background-image: url(../img/AMS/AMSLogo.png);
    background-size: cover;
    background-position: center;

    width: 600px;
    height: 600px;

    position: absolute;
    right: 15vw;
    top: 30vw;
}

.AMSTitel {
    width: 200px;
}

/******************************************************** SLIDE **/

.AMS1 {
    background-image: url(../img/AMS/AMS_master.jpeg);
}

.AMS2 {
    background-image: url(../img/AMS/AMS_kickstart.jpeg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    background-color: #A9D6E4;
}

.AMS3 {
    background-image: url(../img/AMS/AMS_barometer.jpg);
}

.AMS4 {
    background-image: url(../img/AMS/AMS_kerstkaartje.jpeg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    background-color: #A9D6E4;
}

.AMS5 {
    background-image: url(../img/AMS/AMS_TomorrowPort.jpg);
}

.AMS6 {
    background-image: url(../img/AMS/AMS_boogkeers.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    background-color: #A9D6E4;
}

.AMS7 {
    background-image: url(../img/AMS/AMS_masterclass.png);
}

.AMS8 {
    background-image: url(../img/AMS/AMS_planning.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    background-color: #A9D6E4;
}

.AMS9 {
    background-image: url(../img/AMS/AMS_familyBrunch.png);
    background-position: center;
}

.AMS10 {
    background-image: url(../img/AMS/AMS_overheid.jpeg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    background-color: #A9D6E4;
}

.AMS11 {
    background-image: url(../img/AMS/AMS_future.png);
    background-position: center;
}

.AMS12 {
    background-image: url(../img/AMS/AMS_bowling.jpg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    background-color: #A9D6E4;
}

.AMS13 {
    background-image: url(../img/AMS/AMS_future2.png);
    background-position: center;
}

.AMS14 {
    background-image: url(../img/AMS/AMS_closure.jpg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    background-color: #A9D6E4;
}

.AMS15 {
    background-image: url(../img/AMS/AMS_closure2.png);
    background-position: center;
}

.AMS16 {
    background-image: url(../img/AMS/AMS_embaElectives.jpg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    background-color: #A9D6E4;
}

.AMS17 {
    background-image: url(../img/AMS/AMS_electivesMoscow.jpeg);
    background-position: center;
}

.AMS18 {
    background-image: url(../img/AMS/AMS_flyer.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    background-color: #A9D6E4;
}

.AMS19 {
    background-image: url(../img/AMS/AMS_backTo80s.png);
}

.AMS20 {
    background-image: url(../img/AMS/AMS_realEstateManagement.jpg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    background-color: #A9D6E4;
}

.AMS21 {
    background-image: url(../img/AMS/AMS_boxer.jpg);
    background-position: center;
}

.AMS22 {
    background-image: url(../img/AMS/AMS_bagInBusiness.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    background-color: #A9D6E4;
}

.AMS23 {
    background-image: url(../img/AMS/AMS_boxer2.jpg);
    background-position: center;
}

.AMS24 {
    background-image: url(../img/AMS/AMS_dressToImpress.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    background-color: #A9D6E4;
}

.AMS25 {
    background-image: url(../img/AMS/AMS_roadshow.png);
}

.AMS26 {
    background-image: url(../img/AMS/AMS_infoSessie.jpg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    background-color: #A9D6E4;
}

.AMS27 {
    background-image: url(../img/AMS/AMS_afterMasterDrink2.png);
}

.AMS28 {
    background-image: url(../img/AMS/AMS_leaderGathering.jpg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    background-color: #A9D6E4;
}

.AMS29 {
    background-image: url(../img/AMS/AMS_afterMasterDrink.jpeg);
    background-position: center;
}

.AMS30 {
    background-image: url(../img/AMS/AMS_infographic.jpg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    background-color: #A9D6E4;
}

.AMS31 {
    background-image: url(../img/AMS/AMS_prom.jpg);
}

.AMS32 {
    background-image: url(../img/AMS/AMS_grow.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    background-color: #A9D6E4;
}

.AMS33 {
    background-image: url(../img/AMS/AMS_pensioen.png);
}

.AMS34 {
    background-image: url(../img/AMS/AMS_laternFestival.jpg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    background-color: #A9D6E4;
}

.AMS35 {
    background-image: url(../img/AMS/AMS_autumnFestival.jpg);
}

.AMS36 {
    background-image: url(../img/AMS/AMS_happy2019.jpg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    background-color: #A9D6E4;
}

.AMS37 {
    background-image: url(../img/AMS/AMS_spring.jpg);
}

.AMS38 {
    background-image: url(../img/AMS/AMS_mobiliteit.jpeg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    background-color: #A9D6E4;
}

.AMS39 {
    background-image: url(../img/AMS/AMS_finclub.jpeg);
    background-position: center;
}

.AMS40 {
    background-image: url(../img/AMS/AMS_60Ideas.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    background-color: #A9D6E4;
}











/*********************************************************************************************
 *************************************** DOWNDOG *********************************************
 *********************************************************************************************/


.downdogImage {
    background-image: url(../img/Downdog/downdog.webp);
    background-size: cover;
    background-position: -110px;

    width: 600px;
    height: 600px;

    position: absolute;
    right: 15vw;
    top: 30vw;
}











/*********************************************************************************************
 ***************************************** LOGO **********************************************
 *********************************************************************************************/

.logoSlide {
    position: relative;
    top: 50vh;
}











/*********************************************************************************************
 ***************************************** CARD **********************************************
 *********************************************************************************************/


.cardsBackgroundColor {
    background-color: #1A4475;

    height: 450vh;
    width: 45vw;

    position: absolute;
    right: 0vw;
    top: 0;

    z-index: -1;
}

/******************************************************** SLIDE **/

.cardsSlide1 {
    position: relative;
    top: 65vh;

    margin-bottom: 150px;
}

.cardsSlide2 {
    position: relative;
    top: 78vh;

    margin-bottom: 370px;
}

.cardsText1 {
    position: absolute;
    left: 16.1vw;
    top: 165vh;
}

.cardsText2 {
    position: absolute;
    left: 16.1vw;
    top: 290vh;
}











/*********************************************************************************************
 **************************************** CONTACT ********************************************
 *********************************************************************************************/

.contactBackgroundColor {
    background-color: #1A4475;

    height: 200vh;
    width: 45vw;

    position: absolute;
    right: 0vw;
    top: 0;
}

.contactH2 {
    margin-top: 50px;
}

.contactQuestion {
    margin-bottom: 20px;
}

textarea,
input {
    border: none;

    border-bottom: 5px solid #A9D6E4;
    padding: 5px;

    width: 500px;
    background-color: rgba(255, 255, 255, 0);
}

input {
    height: 30px;
}

.submit-button {
    width: 500px;
    height: 50px;
    margin-top: 20px;

    background-color: white;
    color: #698DC4;
    border: 5px solid #A9D6E4;
}

.submit-button:hover {
    background-color: #698DC4;
    color: white;

    cursor: pointer;
}





















/*********************************************************************************************
 *********************************************************************************************
 ************************************ KLEINERE VERSIE ****************************************
 *********************************************************************************************
 *********************************************************************************************/

 @media(max-width: 700px) {

 }