@media all and (min-width: 1096px) { 
    .row {
        display: -ms-flexbox; /* IE10 */
        display: flex;
        -ms-flex-wrap: wrap; /* IE10 */
        flex-wrap: wrap;
        padding: 0 4px;
        /*border-color: red;
        border-style: solid;*/
    }

    /* Create four equal columns that sits next to each other */
    .column {
        -ms-flex: 33.33%; /* IE10 */
        flex: 33.33%;
        max-width: 33.33%;
        /*padding: 0 24px;*/
        left: 2%;   
        /*border-color: blue;
        border-style: solid;*/
    }

    .column img {
        /*margin-top: 8px;*/
        vertical-align: middle;
        width: 80%;
        -webkit-box-shadow: 10px 10px 12px -5px rgba(0,0,0,0.75);
        -moz-box-shadow: 10px 10px 12px -5px rgba(0,0,0,0.75);
        box-shadow: 10px 10px 12px -5px rgba(0,0,0,0.75);
        border-radius: 10px;
    }

    .divTextWheel {
        width: 90%;
        height: 70%;
        top: 10%;
        position: relative;
        display: block;
        vertical-align: middle;
       /* border-color: black;
        border-style: solid;*/
        margin-left: auto;
        margin-right: auto;
        background-color: #336e82;
    }

    .innerMidDiv {
        width: 80%;
        height: 90%;
        top: 5%;
        position: relative;
        display: block;
        vertical-align: middle;
        /*border-color: black;
        border-style: solid;*/
        margin-left: auto;
        margin-right: auto;
        /*background-color: green;*/
    }

    .innerMidDiv .pictureMiddle {
        display: block;
        margin-left: auto;
        margin-right: auto;
    } 

    .divTextWheel p {
        font-size: 2vw;
        font-family: 'Economica', sans-serif;
        padding-left: 2%; 
        font-weight: bolder;
        margin-left: 2%;
        margin-right: 2%;

    }

    .divTextWheel h1 {
        font-size: 2.5vw;
        font-family: 'Economica', sans-serif;
        padding-left: 2%; 
        font-style: italic;
        position: relative;
        margin-left: 2%;
        /*bottom: 10px;*/
    }

     .mainTitle33 {
        float: left;
        top: 10%;
        position: relative;
        line-height: 50px;
        font-size: 7.5vw;
        color: #f16122;
        font-family: 'Teko', sans-serif;
    }

    .menuPictures {
        width: 100%;
        height: auto;
   /*     border-color: red;
        border-style: solid;*/
        overflow: auto;
        padding: 5px;
    }

    .leftMenu {
        float: left;
        position: relative;
        display: block;
        left: 1%;
        width: 24%;
        /*top: 5%;*/
        height: auto;
     /*   border-color: green;
        border-style: solid;*/
    }

    .rightMenu {
        left: 2%;
        position: relative;
        display: inline-block;
        height: auto;
        width: 74%;
       /* border-color: blue;
        border-style: solid;*/
    }


    .innerLeftMenu {
        max-width: 100%;
        max-height: 90%;
        width: auto;
        position: relative;
        /*vertical-align: middle;*/
        height: auto;
       /*  border-color: black;
        border-style: solid;*/

    }

    .innerLeftMenu img {
        width: 100%;
        height: 100%;
    }

    .shortText {
        width: 100%;
        height: 100px;
        /* border-color: blue;
        border-style: solid;*/
    }

    .shortText p{

    }

    .shortTextRight {
        float: right;
        width: 65%;
        height: 100%;
        text-align: center;
      /*  border-color: green;
        border-style: solid;*/
    }

    .leftTexGuide {
        float: left;
        width: 60%;
        height: 100%;
        vertical-align: middle;
        display: table-cell;
        /*border-color: orange;
        border-style: solid;*/
    }

    .leftTexGuide p{
        color: #2d2d2d;
        font-size: 1.6vw;
        text-decoration: underline;
        font-weight: bold;
        text-align: center;
        margin: auto all;
        /*font-weight: */
        /*text-shadow: 0 0 3px #e8e8e8;*/
        letter-spacing: 2px;
        /*font-family: 'Josefin Sans', sans-serif;*/
        /*font-family: 'Economica', sans-serif; */
        /*font-family: 'Open Sans Condensed', sans-serif;*/
        /* border-color: yellow;
        border-style: solid;*/
    }

    .rightTexGuide {
        float: right;
        width: 40%;
        vertical-align: middle;
        display: table-cell;
        height: 100%;
        background-color: #cd772f;
        opacity: 1;
        /*border-color: orange;
        border-style: solid;*/
    }

    .rightTexGuide:hover {
        opacity: 0.8;
        cursor: pointer;
            -webkit-transition: font-size 0.3s ease, background-color 0.3s ease;
    -moz-transition: font-size 0.3s ease, background-color 0.3s ease;
    -o-transition: font-size 0.3s ease, background-color 0.3s ease;
    -ms-transition: font-size 0.3s ease, background-color 0.3s ease;
    transition: font-size 0.3s ease, background-color 0.3s ease;
        /*border-color: orange;
        border-style: solid;*/
    }

    .rightTexGuide .textBox p{
        /*color: #2d2d2d;*/
        font-size: 1.6vw;
        text-decoration: underline;
        font-weight: bold;
        text-align: center;
        margin: auto all;
        color: white;
        text-shadow: none;
        /*font-weight: */
        /*text-shadow: 0 0 3px #e8e8e8;*/
        letter-spacing: 2px;
        /*font-family: 'Josefin Sans', sans-serif;*/
        /*font-family: 'Economica', sans-serif; */
         /*border-color: white;
        border-style: solid;*/
    }

    .proTop {
        width: 100%;
        height: 450px;
        /*border-color: blue;
        border-style: solid;*/
        overflow: hidden;
    }

    .leftProTopTitle {
        width: 40%;
        height: 50%;
        float: left;
        top: 0;
        display: block;
        position: relative;
        /*border-color: red;
        border-style: solid;*/
    }

    .bottomRec {
        width: 100%;
        height: 50%;
        float: left;
        bottom: 0;
        display: block;
        position: relative;
       /* border-color: red;
        border-style: solid;*/
        background-color: #d8d7d7;
        z-index: -1;
    }

    .insidePicturePro {
        object-fit: scale-down;
    }


    .pictureProTop {
        width: 40%;
        height: 100%;
        float: right;
        right: 20%;
        bottom: 100%;
        display: block;
        position: relative;
       /* border-color: green;
        border-style: solid;*/
        /*background-color: black;*/
        z-index: 2;
    }

    .imageDivPro {
        max-height: 100%;
        max-width: 100%;
        height: auto;
        width: auto;
        top: 2%;
        display: block;
        position: relative;
        margin-left: auto;
        margin-right: auto;
        /*border: 3px solid green;*/
        overflow: hidden;
        /*background-color: white;*/
    }

    .insidePicturePro {
        width: 100%;
        /*border: 3px solid blue;*/
        height: auto;
    }

    .twoColumnsGridTextLeft {
        width: 69%;
        position: relative;
        float: left;
    }

    .twoColumnsGridTextLeft  p {
        text-align: justify;
        color: #323232;
        font-size: 2vw;
        /*font-weight: */
        text-shadow: 0 0 3px #e8e8e8;
        letter-spacing: 3px;
        /*font-family: 'Josefin Sans', sans-serif;*/
        /*font-family: 'Economica', sans-serif; */
        font-family: 'Open Sans Condensed', sans-serif;
    }

    .twoColumnsGridPicRight {
        width: 30%;
        position: relative;
        float: right;
    }

    .pictureRightPro {
        max-height: 100%;
        max-width: 100%;
        height: auto;
        width: auto;
        top: 2%;
        display: block;
        position: relative;
        margin-left: auto;
        margin-right: auto;
        overflow: hidden;
    }

    .imgProRight {
        width: 100%;
    }
    
}

@media all and (min-width: 980px) and (max-width: 1096px) { 
    .row {
        display: -ms-flexbox; /* IE10 */
        display: flex;
        -ms-flex-wrap: wrap; /* IE10 */
        flex-wrap: wrap;
        padding: 0 4px;
        /*border-color: red;
        border-style: solid;*/
    }

    /* Create four equal columns that sits next to each other */
    .column {
        -ms-flex: 33.33%; /* IE10 */
        flex: 33.33%;
        max-width: 33.33%;
        /*padding: 0 24px;*/
        left: 2%;   
        /*border-color: blue;
        border-style: solid;*/
    }

    .column img {
        /*margin-top: 8px;*/
        vertical-align: middle;
        width: 80%;
        -webkit-box-shadow: 10px 10px 12px -5px rgba(0,0,0,0.75);
        -moz-box-shadow: 10px 10px 12px -5px rgba(0,0,0,0.75);
        box-shadow: 10px 10px 12px -5px rgba(0,0,0,0.75);
        border-radius: 10px;
    }

    .divTextWheel {
        width: 90%;
        height: 70%;
        top: 10%;
        position: relative;
        display: block;
        vertical-align: middle;
       /* border-color: black;
        border-style: solid;*/
        margin-left: auto;
        margin-right: auto;
        background-color: #336e82;
    }

    .innerMidDiv {
        width: 80%;
        height: 90%;
        top: 5%;
        position: relative;
        display: block;
        vertical-align: middle;
        /*border-color: black;
        border-style: solid;*/
        margin-left: auto;
        margin-right: auto;
        /*background-color: green;*/
    }

    .innerMidDiv .pictureMiddle {
        display: block;
        margin-left: auto;
        margin-right: auto;
    } 

    .divTextWheel p {
        font-size: 2vw;
        font-family: 'Economica', sans-serif;
        padding-left: 2%; 
        font-weight: bolder;
        margin-left: 2%;
        margin-right: 2%;

    }

    .divTextWheel h1 {
        font-size: 2.5vw;
        font-family: 'Economica', sans-serif;
        padding-left: 2%; 
        font-style: italic;
        position: relative;
        margin-left: 2%;
        /*bottom: 10px;*/
    }

     .mainTitle33 {
        float: left;
        top: 10%;
        position: relative;
        line-height: 50px;
        font-size: 7.5vw;
        color: #f16122;
        font-family: 'Teko', sans-serif;
    }

    .proTop {
        width: 100%;
        height: 450px;
       /* border-color: blue;
        border-style: solid;*/
        overflow: hidden;
    }

    .leftProTopTitle {
        width: 30%;
        height: 50%;
        float: left;
        top: 0;
        display: block;
        position: relative;
        /*border-color: orange;
        border-style: solid;*/
    }

    .bottomRec {
        width: 100%;
        height: 50%;
        float: left;
        bottom: 0;
        display: block;
        position: relative;
       /* border-color: red;
        border-style: solid;*/
        background-color: #d8d7d7;
        z-index: -1;
    }

    .insidePicturePro {
        object-fit: scale-down;
    }


    .pictureProTop {
        width: 40%;
        height: 100%;
        float: right;
        right: 20%;
        bottom: 100%;
        display: block;
        position: relative;
       /* border-color: green;
        border-style: solid;*/
        /*background-color: black;*/
        z-index: 2;
    }

    .imageDivPro {
        max-height: 100%;
        max-width: 100%;
        height: auto;
        width: auto;
        top: 2%;
        display: block;
        position: relative;
        margin-left: auto;
        margin-right: auto;
        overflow: hidden;
        /*background-color: white;*/
    }

    .insidePicturePro {
        width: 100%;
        /*height: 100%;*/
    }

    .twoColumnsGridTextLeft {
        width: 69%;
        position: relative;
        float: left;
    }

    .twoColumnsGridTextLeft  p {
        text-align: justify;
        color: #323232;
        font-size: 2vw;
        /*font-weight: */
        text-shadow: 0 0 3px #e8e8e8;
        letter-spacing: 3px;
        /*font-family: 'Josefin Sans', sans-serif;*/
        /*font-family: 'Economica', sans-serif; */
        font-family: 'Open Sans Condensed', sans-serif;
    }

    .twoColumnsGridPicRight {
        width: 30%;
        position: relative;
        float: right;
    }

    .pictureRightPro {
        max-height: 100%;
        max-width: 100%;
        height: auto;
        width: auto;
        top: 2%;
        display: block;
        position: relative;
        margin-left: auto;
        margin-right: auto;
        overflow: hidden;
    }

    .imgProRight {
        width: 100%;
    }
}

@media all and (min-width: 767px) and (max-width: 980px) { 
    .row {
        display: -ms-flexbox; /* IE10 */
        display: flex;
        -ms-flex-wrap: wrap; /* IE10 */
        flex-wrap: wrap;
        padding: 0 4px;
        /*border-color: red;
        border-style: solid;*/
    }

    /* Create four equal columns that sits next to each other */
    .column {
        -ms-flex: 33.33%; /* IE10 */
        flex: 33.33%;
        max-width: 33.33%;
        /*padding: 0 24px;*/
        left: 2%;   
            /*border-color: blue;
            border-style: solid;*/
    }

    .column img {
        /*margin-top: 8px;*/
        vertical-align: middle;
        width: 80%;
        -webkit-box-shadow: 10px 10px 12px -5px rgba(0,0,0,0.75);
        -moz-box-shadow: 10px 10px 12px -5px rgba(0,0,0,0.75);
        box-shadow: 10px 10px 12px -5px rgba(0,0,0,0.75);
        border-radius: 10px;
    }

    .divTextWheel {
        width: 90%;
        height: 70%;
        top: 10%;
        position: relative;
        display: block;
        vertical-align: middle;
       /* border-color: black;
        border-style: solid;*/
        margin-left: auto;
        margin-right: auto;
        background-color: #336e82;
    }

    .innerMidDiv {
        width: 80%;
        height: 90%;
        top: 5%;
        position: relative;
        display: block;
        vertical-align: middle;
        /*border-color: black;
        border-style: solid;*/
        margin-left: auto;
        margin-right: auto;
        /*background-color: green;*/
    }

    .innerMidDiv .pictureMiddle {
        display: block;
        margin-left: auto;
        margin-right: auto;
    } 

    .divTextWheel p {
        font-size: 2vw;
        font-family: 'Economica', sans-serif;
        padding-left: 2%; 
        font-weight: bolder;
        margin-left: 2%;
        margin-right: 2%;

    }

    .divTextWheel h1 {
        font-size: 2.5vw;
        font-family: 'Economica', sans-serif;
        padding-left: 2%; 
        font-style: italic;
        position: relative;
        margin-left: 2%;
        /*bottom: 10px;*/
    }

    .mainTitle33 {
        float: left;
        top: 10%;
        position: relative;
        line-height: 50px;
        font-size: 7.5vw;
        color: #f16122;
        font-family: 'Teko', sans-serif;
    }

    .proTop {
        width: 100%;
        height: 450px;
        /*border-color: blue;
        border-style: solid;*/
        overflow: hidden;
    }

    .leftProTopTitle {
        width: 30%;
        height: 50%;
        float: left;
        top: 0;
        display: block;
        position: relative;
        /*border-color: orange;
        border-style: solid;*/
    }

    .bottomRec {
        width: 100%;
        height: 50%;
        float: left;
        bottom: 0;
        display: block;
        position: relative;
       /* border-color: red;
        border-style: solid;*/
        background-color: #d8d7d7;
        z-index: -1;
    }

    .insidePicturePro {
        object-fit: scale-down;
    }


    .pictureProTop {
        width: 40%;
        height: 100%;
        float: right;
        right: 20%;
        bottom: 100%;
        display: block;
        position: relative;
       /* border-color: green;
        border-style: solid;*/
        /*background-color: black;*/
        /*z-index: 2;*/
    }

    .imageDivPro {
        max-height: 100%;
        max-width: 100%;
        height: auto;
        width: auto;
        top: 2%;
        display: block;
        position: relative;
        margin-left: auto;
        margin-right: auto;
        overflow: hidden;
        /*background-color: white;*/
    }

    .insidePicturePro {
        width: 100%;
        /*height: 100%;*/
    }

    .twoColumnsGridTextLeft {
        width: 69%;
        position: relative;
        float: left;
    }

    .twoColumnsGridTextLeft  p {
        text-align: justify;
        color: #323232;
        font-size: 2vw;
        /*font-weight: */
        text-shadow: 0 0 3px #e8e8e8;
        letter-spacing: 3px;
        /*font-family: 'Josefin Sans', sans-serif;*/
        /*font-family: 'Economica', sans-serif; */
        font-family: 'Open Sans Condensed', sans-serif;
    }

    .twoColumnsGridPicRight {
        width: 30%;
        position: relative;
        float: right;
    }

    .pictureRightPro {
        max-height: 100%;
        max-width: 100%;
        height: auto;
        width: auto;
        top: 2%;
        display: block;
        position: relative;
        margin-left: auto;
        margin-right: auto;
        overflow: hidden;
    }

    .imgProRight {
        width: 100%;
    }
}

@media all and (min-width: 480px) and (max-width: 767px) {
    .row {
        display: -ms-flexbox; /* IE10 */
        display: flex;
        -ms-flex-wrap: wrap; /* IE10 */
        flex-wrap: wrap;
        padding: 0 4px;
        /*border-color: red;
        border-style: solid;*/
    }

    /* Create four equal columns that sits next to each other */
    .column {
        -ms-flex: 100%; /* IE10 */
        flex: 100%;
        max-width: 100%;
        /*padding: 0 24px;*/
        left: 2%;   
        /*border-color: blue;
        border-style: solid;*/
    }

    .column img {
        /*margin-top: 8px;*/
        vertical-align: middle;
        width: 80%;
        -webkit-box-shadow: 10px 10px 12px -5px rgba(0,0,0,0.75);
        -moz-box-shadow: 10px 10px 12px -5px rgba(0,0,0,0.75);
        box-shadow: 10px 10px 12px -5px rgba(0,0,0,0.75);
        border-radius: 10px;
    }

    .divTextWheel {
        width: 90%;
        height: 90%;
        top: 10%;
        position: relative;
        display: block;
        vertical-align: middle;
       /* border-color: black;
        border-style: solid;*/
        margin-left: auto;
        margin-right: auto;
        background-color: #336e82;
    }

    .innerMidDiv {
        width: 80%;
        height: 90%;
        /*top: 5%;*/
        position: relative;
        display: block;
        vertical-align: middle;
        /*border-color: black;
        border-style: solid;*/
        margin-left: auto;
        margin-right: auto;
        /*background-color: green;*/
    }

    .innerMidDiv .pictureMiddle {
        display: block;
        margin-left: auto;
        margin-right: auto;
    } 

    .divTextWheel p {
        font-size: 4vw;
        font-family: 'Economica', sans-serif;
        padding-left: 2%; 
        font-weight: bolder;
        margin-left: 2%;
        margin-right: 2%;

    }

    .divTextWheel h1 {
        font-size: 4.5vw;
        font-family: 'Economica', sans-serif;
        padding-left: 2%; 
        font-style: italic;
        position: relative;
        margin-left: 2%;
        /*bottom: 10px;*/
    }

    .mainTitle33 {
        float: left;
        top: 10%;
        position: relative;
        line-height: 50px;
        font-size: 20vw;
        color: #f16122;
        font-family: 'Teko', sans-serif;
    }

    .proTop {
        width: 100%;
        height: 500px;
       /* border-color: red;
        border-style: solid;*/
        overflow: hidden;
    }

    .leftProTopTitle {
        width: 100%;
        height: 30%;
        float: left;
        top: 0;
        display: block;
        position: relative;
        border-color: blue;
        border-style: solid;
    }

    .bottomRec {
        display: none;
    }

    .insidePicturePro {
        object-fit: scale-down;
    }


    .pictureProTop {
        width: 100%;
        height: 70%;
        float: left;
        /*right: 20%;*/
        bottom: 0%;
        display: block;
        position: relative;
        border-color: green;
        border-style: solid;
        /*background-color: black;*/
        /*z-index: 2;*/
    }

    .imageDivPro {
        max-height: 100%;
        max-width: 100%;
        height: auto;
        width: auto;
        /*top: 2%;*/
        display: block;
        position: relative;
        margin-left: auto;
        margin-right: auto;
        overflow: hidden;
        /*background-color: white;*/
    }

    .insidePicturePro {
        width: 100%;
        /*height: 100%;*/
    }

    .twoColumnsGridTextLeft {
        width: 69%;
        position: relative;
        float: left;
    }

    .twoColumnsGridTextLeft  p {
        text-align: justify;
        color: #323232;
        font-size: 2vw;
        /*font-weight: */
        text-shadow: 0 0 3px #e8e8e8;
        letter-spacing: 3px;
        /*font-family: 'Josefin Sans', sans-serif;*/
        /*font-family: 'Economica', sans-serif; */
        font-family: 'Open Sans Condensed', sans-serif;
    }

    .twoColumnsGridPicRight {
        width: 30%;
        position: relative;
        float: right;
    }

    .pictureRightPro {
        max-height: 100%;
        max-width: 100%;
        height: auto;
        width: auto;
        top: 2%;
        display: block;
        position: relative;
        margin-left: auto;
        margin-right: auto;
        overflow: hidden;
    }

    .imgProRight {
        width: 100%;
    }
}

@media all and (max-width: 480px) { 
    .row {
        display: -ms-flexbox; /* IE10 */
        display: flex;
        -ms-flex-wrap: wrap; /* IE10 */
        flex-wrap: wrap;
        padding: 0 4px;
        /*border-color: red;
        border-style: solid;*/
    }

    /* Create four equal columns that sits next to each other */
    .column {
        -ms-flex: 100%; /* IE10 */
        flex: 100%;
        max-width: 100%;
        /*padding: 0 24px;*/
        /*left: 2%;   */
        /*border-color: blue;
        border-style: solid;*/
    }

    .column img {
        /*margin-top: 8px;*/
        vertical-align: middle;
        width: 80%;
        -webkit-box-shadow: 10px 10px 12px -5px rgba(0,0,0,0.75);
        -moz-box-shadow: 10px 10px 12px -5px rgba(0,0,0,0.75);
        box-shadow: 10px 10px 12px -5px rgba(0,0,0,0.75);
        border-radius: 10px;
    }

    .divTextWheel {
        width: 90%;
        height: 90%;
        top: 10%;
        position: relative;
        display: block;
        vertical-align: middle;
       /* border-color: black;
        border-style: solid;*/
        margin-left: auto;
        margin-right: auto;
        background-color: #336e82;
    }

    .innerMidDiv {
        width: 80%;
        height: 90%;
        /*top: 5%;*/
        position: relative;
        display: block;
        vertical-align: middle;
        /*border-color: black;
        border-style: solid;*/
        margin-left: auto;
        margin-right: auto;
        /*background-color: green;*/
    }

    .innerMidDiv .pictureMiddle {
        display: block;
        margin-left: auto;
        margin-right: auto;
    } 

    .divTextWheel p {
        font-size: 4vw;
        font-family: 'Economica', sans-serif;
        padding-left: 2%; 
        font-weight: bolder;
        margin-left: 2%;
        margin-right: 2%;

    }

    .divTextWheel h1 {
        font-size: 4.5vw;
        font-family: 'Economica', sans-serif;
        padding-left: 2%; 
        font-style: italic;
        position: relative;
        margin-left: 2%;
        /*bottom: 10px;*/
    }

    .mainTitle33 {
        float: left;
        top: 10%;
        position: relative;
        line-height: 50px;
        font-size: 20vw;
        color: #f16122;
        font-family: 'Teko', sans-serif;
    }
}



/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
    .column {
        -ms-flex: 100%;
        flex: 100%;
        max-width: 100%;
    }
}