* {
    margin:0;
    padding: 0;
}

html {
    overflow-x: hidden;
}

body {
    overflow-x: hidden;
}

html, body {
    background-color:white;
    font-family: Quicksand, sans-serif;
    font-weight: lighter;
    overflow-x: hidden;
    position: initial;
}

p {
    font-family: Quicksand, sans-serif;
}

.clear {
    clear:both;
}

a {
    text-decoration: none;
}

h1 {
    font-family: Quicksand, sans-serif;
    font-size: 60px;
}
h2 {
    font-family: Quicksand, sans-serif;
    font-size: 30px;
    text-align: center;
    font-weight: lighter;
}

h3 {
    font-family: Quicksand, sans-serif;
    font-size: 25px;
    text-align: center;
    font-weight: lighter;
}
small { font-size:12px; }
strong {
    font-family: Quicksand, sans-serif;
    font-weight: 700;
}


input {
    width: calc(100% - 16px);
    height:30px;
    border-radius: 4px;
    background-color:white;
    border:1px solid rgb(3, 125, 192);
    margin: 3px;
    padding-left:6px;
    color: #aaaaaa;
    -webkit-appearance: none;
    outline: none;
}

input[type=text] {


}

input[type=email] {

}

input[type=submit] {
    width: calc(50% - 8px);
    float:left;
}

input[type=submit]:hover {
    border-radius: 4px;
    background-color:skyblue;
    border:1px solid rgb(3, 125, 192);
    margin: 3px;
    padding-left:6px;
    color: white;
}


textarea {
    width: calc(100% - 16px);
    height:90px;
    border-radius: 4px;
    background-color:white;
    border:1px solid rgb(3, 125, 192);
    margin: 3px;
    padding-left:6px;
    padding-top:6px;
    color: #aaaaaa;
}


@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}


/** HEADER **/
/** NAVIGATION **/

nav {
    max-width:100%;
    height:80px;
    background-color:white;
    display:block;
    /* overflow: hidden;*/
}

.logo {
    width:250px;
    height:246px;
    background-image: url('../images/cs7logo_klein.png');
}

#navigation {
    height:100%;
    max-width:100%;
    text-align: center;
    /*margin-right:10%;*/
    margin:0 auto;
    display:block;
}

#navigation ul li {
    display: inline;
    font-family:Quicksand, sans-serif;
    font-size: 25px;
    /*padding-left:15px;*/
    border: 7px solid white;
}

#navigation ul li a { text-decoration: none; color:black; }
#navigation ul li a:hover { text-decoration: underline; color:black;}

#navspace { display: none;}
#toggleopen {
    /*background-image: url('../images/toggle_open.png');
    width: 29px;
    height:22px;
    float:right;*/
    display: none;
}

#toggleclose {
    /*background-image: url('../images/toggle_close.png');
    width: 29px;
    height:22px;
    float:right;*/
    display: none;
}

/** close_NAVIGATION **/

/** BANNER **/

#banner {
    max-width:100%;
    height:420px;
    background: url('../images/banner10-min.png');
    background-repeat:   no-repeat;
    background-position: center 22%;
}

#bannerindex {
    max-width:100%;
    height:700px;
    background: url('../images/banner10-min.png');
    background-repeat:   no-repeat;
    background-position: top center;
    text-align: center;
    margin-top: 20px;
}

#bannerindex #guckloch {
    position: relative;
    height:140px;
    width:185px;
    background: url('../images/fenster1-min.png');
    background-position: center;
    background-size: 100%;
    z-index: 10;
    margin: 0 auto;
    margin-top: -90px;
    border-radius: 2px;
}

#bannerindex #guckloch:hover {
    position: relative;
    height:140px;
    width:185px;
    background: url('../images/fenster2-min.png');
    background-position: center;
    background-size: 100%;
    z-index: 10;
    margin: 0 auto;
    margin-top: -90px;
    border-radius:2px;
}

#bannerindex #guckloch #gucklochtext { display: none; }
#bannerindex #guckloch:hover #gucklochtext {
    position: relative;
    display: block;
    width: 100px;
    height:50px;
    color: rgb(3, 125, 192);
    margin-left:200px;
    background-color:rgba(255,255,255,0.7);
    border-radius: 10px;
    display:table;
}
#bannerindex #guckloch:hover #gucklochtext p{
    display: table-cell;
    vertical-align: middle;
}

#bannercontent {
    max-width:100%;
    height:auto;
    text-align: center;
    margin-top:0px;
    color: white;
}

#titlebig   { display:block; color:grey; }
#titlesmall { display: none; color:white; }
#titleextra { display: none; }

/** close_BANNER **/
/** close_HEADER **/

/** MAIN **/

main {
    margin:0 auto;
    width: 100%;
    height:auto;
}

main p {
    text-align: justify;
    font-weight: lighter;
    font-size:13px;
}
main ul {
    font-weight: lighter;
    font-size:13px;
    list-style: none;
}

#section1 {
    /*background-color: skyblue;*/
    background-color: rgb(3, 125, 192);
}
#section1content {
    width: 60%;
    margin: 0 auto;
    padding: 20px;
    color: white;
    -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadein 1s; /* Firefox < 16 */
    -ms-animation: fadein 1s; /* Internet Explorer */
    -o-animation: fadein 1s; /* Opera < 12.1 */
    animation: fadein 1s;
}
#section1contentind {
    width: 60%;
    margin: 0 auto;
    padding: 20px;
    color: white;
    -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadein 1s; /* Firefox < 16 */
    -ms-animation: fadein 1s; /* Internet Explorer */
    -o-animation: fadein 1s; /* Opera < 12.1 */
    animation: fadein 1s;
}
.indexleft {
    float:left;
    display:block;
    width:35%;
    height: auto;
}

.indexright {
    float:left;
    width:65%;
    height: auto;
}

.indexleft2 {
    float:left;
    display:block;
    width:65%;
    height: auto;
}

.indexright2 {
    float:left;
    width:35%;
    height: auto;
    text-align: center;
    display:none;
}

.indexright2 img {
    width:80%;
    height: auto;
    border-radius: 3px;
    box-shadow: 0 3px 6px rgba(0,0,0,0.9);
}

#galerie {
    width:90%;
    min-width: 90%;
    height:auto;
    /*border-radius: 3px;
	box-shadow: 0 3px 6px rgba(0,0,0,0.9);*/
    display: block;
    margin: 0 auto;
    background-color: green;
}

#galerie img {
    height:auto;
    width:100%;
    border-radius: 3px;
    opacity: 0.7;
    display: none;
}

.rslides {
    position: relative;
    list-style: none;
    overflow: hidden;
    width: 95%;
    padding: 0;
    /*margin: 0 auto;*/
    border-radius: 3px;
    box-shadow: 0 3px 6px rgba(0,0,0,0.9);
}

.rslides li {
    -webkit-backface-visibility: hidden;
    position: absolute;
    display: none;
    width: 100%;
    left: 0;
    top: 0;
    border-radius: 3px;
}

.rslides li:first-child {
    position: relative;
    display: block;
    float: left;
    border-radius: 3px;
}

.rslides img {
    display: block;
    height: auto;
    float: left;
    width: 100%;
    border-radius: 3px;
}

.responsivebox {
    height:150px;
    width: 32%;
    background-color:white;
    text-align: center;
    border: 2px solid rgb(3, 125, 192);
    float: left;
}

.responsivebox2 {
    height:150px;
    width: 32%;
    background-color:white;
    text-align: center;
    border: 2px solid rgb(3, 125, 192);
    float: left;
    color:black;
    display: table;
}

.responsivebox2:hover {
    background-color:rgba(0,0,0,0.5);
    /*opacity: 0.5;*/
    color:white;
}

.responsivebox2 small { display: none; }
.responsivebox2:hover small { display:block; color:blue; text-align: center; }

.responsivebox2 p {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}

.horizontalspace {
    /*width:3px;*/
    /*height:1px;*/
    /*float:left;*/
}

.teamnumber {
    width:40%;
    height:50px;
    background-color: rgba(255, 255, 255, 0.5);
    float:left;
    padding-top:22px;
    -webkit-transition: width 2s;
    -moz-transition:    width 0.3s;
    -o-transition:      width 0.3s;
    transition:         width 2s;
}
.teamnumber p {
    color:white;
    text-align:center;
    font-size: 21px;
}

.teambox {
    min-height:100px;
    height:auto;
    width:100%;
    background-color: rgba(255,255,255,0.5);
    float:left;
    text-align:center;
    color: black;
    padding-top:80px;
    margin: 0 auto;
    border: 2px solid rgb(3, 125, 192);
    z-index: 1;
    position: relative;
    cursor: pointer;
}




.teambox:hover {
    background-color: rgba(255,255,255,0.9);
}

.teambox:focus {
    background-color: rgba(255,255,255,0.1);
}

.teambox .emailogo {
    display:none;
    float:none;
    -webkit-transition: width 0.3s;
    -moz-transition:    width 0.3s;
    -o-transition:      width 0.3s;
    transition:         width 0.3s;
}

.teambox:hover .emaillogo {
    background-image: url('../images/email.png');
    width:180px;
    height:180px;
    display:block;
    margin: 0 auto;
    margin-top: -100px;
    opacity: 1.0;
    position:relative;
    z-index:100;
    -webkit-transition: width 0.3s;
    -moz-transition:    width 0.3s;
    -o-transition:      width 0.3s;
    transition:         width 0.3s;
}

.teambox .nom            { float: none; text-align: center; display: block; font-size: 21px; }
.teambox:hover .nom      { width: 38%; opacity: 1.0; }
.teambox .fonction       { text-align: center; display: block; }
.teambox:hover .fonction { display:none; }

.teambox .email {
    width:90%;
    height:auto;
    display:none;
    margin: 0 auto;
    opacity: 1.0;
}
.teambox input[type=submit] {
    width: calc(50% - 8px);
    height:30px;
    float:left;
    border-radius: 4px;
    background-color:white;
    border:1px solid rgb(3, 125, 192);
    margin: 3px;
    padding-left:6px;
    color: #aaaaaa;
    -webkit-appearance: none;
}

.teambox input[type=submit]:hover {
    width: calc(50% - 8px);
    height:30px;
    float:left;
    border-radius: 4px;
    background-color:rgb(90,196,255);
    border:1px solid rgb(148,240,255);
    margin: 3px;
    padding-left:6px;
    color: white;
}

.spacesubmitbuttons {
    width:2%;
    display: block;
}


.ventes img {
    border-radius: 3px;
    box-shadow: 0 3px 6px rgba(0,0,0,0.9);
}


/* LIGHTBOX */

.lightboxthumb {
    width:33.3%;
    height:200px;
    display: block;
    background-color: black;
    float:left;
    border: 2px solid rgb(3,125,192);
    background-size:auto 150%;
}

.lightboxthumb2 {
    width:33%;
    height:200px;
    display: block;
    background-color: black;
    float:left;
    border-left: 3px solid rgb(3,125,192);
    border-right: 3px solid rgb(3,125,192);
    border-bottom: 2px solid rgb(3,125,192);
    border-top: 2px solid rgb(3,125,192);
    background-size:auto 150%;
}

.lightboxthumb3 {
    width:6%;
    height:47px;
    display: block;
    background-color: black;
    float:left;
    border: 2px solid rgb(3,125,192);
    background-size:auto 150%;
}

.lightboxthumb p, .lightboxthumb2 p, .lightboxthumb3 p { display:none; }
.lightboxthumb:hover, .lightboxthumb2:hover, .lightboxthumb3:hover { background-color:black; }

.lightboxthumb:hover p, .lightboxthumb2:hover p, .lightboxthumb3:hover p {
    display: block;
    background-color:black;
    font-size: 20px;
    height: -webkit-calc(100% - 20px);
    height:    -moz-calc(100% - 20px);
    height:         calc(100% - 20px);

    width:  -webkit-calc(100% - 19px);
    width:     -moz-calc(100% - 19px);
    width:          calc(100% - 19px);
    text-align: center;
    color:white;
    padding: 10px;
    opacity: 0.65;
}

.lightbox {
    display: none;
    background-color: #333333;
    opacity: 0.998;
    width:100%;
    height:100%;
    text-align: center;
    position: fixed;
    top:0;
    left: 0;
    z-index:98;
}

.lightbox .content {
    width:80%;
    height: auto;
    position: absolute;
    top: 50%;
    left:50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index:99;
}

.lightbox .content img {
    width: 100%;
    min-height:100px;
    height: auto;
    border-radius: 3px;
    box-shadow: 0 3px 6px rgba(0,0,0,0.9);
    z-index:100;
    float:left;
}

.lightbox .content .info {
    width:100%;
    height:5%;
    background-color:rgb(255,255,255);
    position: absolute;
    z-index: 102;
    display: table;
    bottom: 0;
    opacity: 0.3;
}

.lightbox .content .info:hover {
    opacity: 0.75;
}

.lightbox .content .info p {
    color:black;
    font-size: 100%;
    text-align: center;
    display: table-cell;
    vertical-align: middle;
}

.lightbox .click {
    position: absolute;
    width: 100%;
    height: 100%;
    /*top: 20%;
    left: 10%;*/
    z-index:101;
    /*margin-top:-67%;
    color:rgb(3,125,192);*/
}

.lightbox .click .space {
    height: 41%;
}

.lightbox .click .clickleft {
    float:left;
    text-align: left;
    width:50%;
    height:100%;
    /*padding-top:30%;*/
    font-size: 50px;
    opacity: 0.2;
    /*background-color: red;*/
}

.lightbox .click .clickleft:hover {
    /*background-color:#FFFFFF;*/
    opacity: 1;
}

.lightbox .click .clickright {
    float:left;
    text-align: right;
    width:50%;
    height:100%;
    /*padding-top:30%;*/
    font-size: 50px;
    opacity: 0.2;
    /*background-color: green;*/
}

.lightbox .click .clickright:hover {
    /*background-color:#FFFFFF;*/
    opacity: 1;
}

.lightbox .click .clickclose {
    position: absolute;
    float:left;
    text-align: right;
    width:5%;
    height:10%;
    font-size: 50px;
    opacity: 0.2;
    color:white;
    /*background-color: green;*/
    margin-left:95%;
    text-align: center;
}

.lightbox .click .clickclose:hover {
    /*background-color:#FFFFFF;*/
    opacity: 1;
}



/* LIGHTBOX_close */



#section2 {
    background-color: white;
}
#section2content {
    width: 60%;
    margin:0 auto;
    padding:20px;
}

#section2content input[type=text] {

}

#section2content input[type=email] {

}

#section2content input[type=submit] {
    width: calc(50% - 8px);
}

#section2content input[type=submit]:hover {
    background-color:rgb(3, 125, 192);;
    border:1px solid rgb(148,240,255);
    color: white;
}

#section2content textarea {
    width: calc(100% - 16px);
    height:90px;
    border-radius: 4px;
    background-color:white;
    border:1px solid rgb(3, 125, 192);
    margin: 3px;
    padding-left:6px;
    padding-top:6px;
    color: #aaaaaa;
}

#section3 {
    /*background-color: skyblue;*/
    background-color: rgb(3, 125, 192);
}
#section3content {
    width: 60%;
    margin: 0 auto;
    padding: 20px;
}

.overlay {
    background: transparent;
    position: relative;
    width: 100%;
    height: 400px;
    top: 400px;
    margin-top: -400px;
}

#section4 {
    background-color: white;
    /*background-color: rgb(3, 125, 192);*/
}
#section4content {
    width: 60%;
    margin: 0 auto;
    /*padding: 20px;*/
}

input[type=text], input[type=email], textarea {
    color:black;
}
input:focus {
    color:black;
}

/** close_MAIN **/


/** FOOTER **/

footer {
    width:100%;
    height:auto;
    color:white;
    background-color: #555666;
    font-size: 14px;
}

#footercontent {
    width: 60%;
    margin:0 auto;
    padding:20px 20px 0 20px;
    text-align: center;
    height: 80%;
}

#footers {
    border-right: 1px solid white;
    border-left:  1px solid white;
    width: 90%;
    text-align: center;
    margin: 0 auto;
}

footer a {
    color: #abcdef;
}


/** close_FOOTER **/

/** RESPONSIVE DESIGN **/

@media only screen and (max-width:60000px) {
    .logo { display: none; }
    nav {
        display: table;
        z-index: 9999;
        width: 100%;
        /*max-width:1918px !important;*/
        height:50px;
        border-left: 1px solid rgb(3, 125, 192);
        border-right: 1px solid rgb(3, 125, 192);
        margin: 0 auto;
        left: 0;
        text-align: center;

    }
    #navigation         { display: table-cell; vertical-align: middle;}
    #banner             { width: 1920px; margin:0 auto; }
    #bannerindex        { width: 1920px; margin:0 auto; }
    #guckloch           { display: block; }
    #section1           { width: 1920px; margin:0 auto; }
    #section1content    { width: 65%; }
    #section1contentind { width: 50%; }
    .responsivebox      { width: 24%; }

    .teambox            { width: 100%; }
    /*.teambox:hover .emaillogo { height: 180px; margin-top:-30px; background-repeat: no-repeat; }
    .teambox:hover .nom       { width:100%; margin-top:-35px;}*/
    .lightboxthumb      { width:24.5%; }
    .lightbox .content  {
        width:80%;
        height: auto;
        max-width:100%;
    }

    .lightbox .content img {
        width: 100%;
        min-height:100px;
        height: auto;
    }
    #section2 {
        width:1918px;
        margin:0 auto;
        border-left:  1px solid rgb(3, 125, 192);
        border-right: 1px solid rgb(3, 125, 192);
    }
    #section2content { width: 70%; }
    #section3        { width: 1920px; margin:0 auto;}
    #section3content { width: 70%; }
    #section4 {
        width:1918px;
        margin:0 auto;
        border-left:1px solid rgb(3, 125, 192);
        border-right: 1px solid rgb(3, 125, 192);
    }
    #section4content { width: 70%; }
    footer           { width: 1920px; margin:0 auto; }
    #footercontent   { width:70%; }

}
@media only screen and (max-width:1920px) {
    nav {
        width:100%;
        border:none;
    }
    #navigation      { display: table-cell; vertical-align: middle;}
    #banner          { max-width:100%; }
    #bannerindex     { max-width:100%; }
    #bannerindex     { max-width:100%; }
    #section1        { max-width:100%; width:100%; }
    .responsivebox   { width: 32%; }
    .responsivebox2  { width: 32%; }
    .teambox         { width: 100%;}
    .lightboxthumb   { width: 32.5%; }
    #section2        { max-width:100%; width:100%; border:none;}
    #section3        { max-width:100%; width:100%; }
    #section4        { max-width:100%; width:100%; border:none;}
    footer           { max-width:100%; width:100%; }
}
@media only screen and (max-width:1650px) {
    #navigation         { display: table-cell; vertical-align: middle;}
    #section1content    { width:60%; }
    #section1contentind { width:50%; }
    #section2content    { width:60%; }
    #section3content    { width:60%; }
    #section4content    { width:60%; }
    .teambox            { width:100%; }
}
@media only screen and (max-width:1280px) {
    /*#navigation         { padding-top:27px; }*/
    #navigation ul li   { font-size:19px; }
    #navigation         { display: table-cell; vertical-align: middle;}
    #section1contentind { width: 60%; }
    .responsivebox      { width: 48%; }
    .responsivebox2     { width: 48%; }
}
@media only screen and (max-width:1020px) {
    /* #navigation         { padding-top: 30px; }*/
    #navigation ul li   { font-size:16px; }
    #navigation         { display: table-cell; vertical-align: middle;}
    #section1content    { width: 80%; }
    #section1contentind { width: 70%; }
    .lightboxthumb      { width: 49%;  height: 300px; }
    #section2content    { width: 80%; }
    #section3content    { width: 80%; }
    #section4content    { width: 80%; }
}
@media only screen and (max-width:920px) {
    .logo { display: block; margin: 0 auto; z-index:10;}

    #navigation {
        background-color:white;
        max-width:100%;
        height:100%;
        display: none;
        position:relative;
        z-index: 12;
        opacity: 1;
        margin-top: 15%;
        vertical-align: initial;
    }
    #navigation ul { }
    #navigation ul li {
        display: block;
        text-align: center;
        font-size: 28px;
        padding-left:0;
        margin: auto;
    }
    #navspace { height:50px; display: block;}
    #toggleopen {
        background-image: url('../images/toggle_open.png');
        width: 29px;
        height:22px;
        margin-top:25px;
        margin-left:90%;
        display:block;
        position:absolute;
        z-index:13;
    }
    #toggleclose {
        font-size: 36px;
        margin-top:15px;
        display:none;
        font-family: Quicksand, sans-serif;
        font-weight: bolder;
        position:absolute;
        z-index:13;
        margin-left:90%;
        font-size: 50px;
    }

    #banner                     { margin: 0px; background: white; height:400px; z-index:1;}
    #bannerindex                { margin: 0px; background: white; height:500px; z-index:1;}
    #guckloch      { display: none; }
    main p, main ul li, input, textarea { font-size:18px; }
    #section1content            { width:90%; }
    #section1contentind         { width:90%; }
    .indexleft                  { width:100%;
        text-align: center;
        border-bottom: 50px solid rgb(3, 125, 192);
        border-top: 40px solid rgb(3, 125, 192);
    }
    .indexright                 { width: 100%;}
    .indexright2                { width:100%; display: block;
        text-align: center;
        border-bottom: 50px solid rgb(3, 125, 192);
        border-top: 40px solid rgb(3, 125, 192);
    }
    .indexleft2                 { width: 100%; }
    .rslides                    { margin: 0 auto; }
    .teambox:hover .emaillogo   { height: 180px; margin-top:-30px; background-repeat: no-repeat; }
    .teambox:hover .nom         { width: 100%; margin-top:-35px;}
    .teambox input[type=submit] { width: calc(100% - 8px); }
    .spacesubmitbuttons         { width:0; }
    .lightboxthumb              { width:49%; height: 230px; }
    .lightboxthumb2             { width:97%; height: 250px; margin: 0 auto; background-size:auto 250%; }
    .lightboxthumb3             { width:9%;  height: 45px; }
    .lightbox                   { z-index:100; }
    .lightbox .content          { width: 95%; }
    .lightbox .content .info    { opacity: 0.75; }
    .lightbox .click .clickleft { opacity: 1; }
    .lightbox .click .clickright{ opacity: 1; }
    .lightbox .click .clickclose{ margin-left:90%; width:10%; opacity: 1; }
    #section2content            { width:90%; }
    #section2content input[type=submit] { width: calc(100% - 8px); }
    #section3content            { width:90%; }
    #section4content            { width: 90%; }

    footer           { height:auto; padding:0; }
    #footercontent   { width:80%; }
    #footers {
        border:none;
    }

    #titlebig        { display:none; }
    #titlesmall      { display:block; }
    #titleextra      { display: block; }
}
@media only screen and (max-width:490px) {
    nav     { height:70px; border:none; overflow-y: auto;}
    #banner {
        max-height:90%;
    }
    #guckloch        { display: none; }
    #titlebig        { display:none; }
    #titlesmall      { display:block; }
    #titleextra      { display: block; }
    #navigation {
        display:none;
        margin-top: 8%;
    }

    .responsivebox    { width: 100%; }
    .responsivebox2   { width: 100%; }
    .lightbox img     { max-width: 99%; height: auto; }
    .lightboxthumb    { width: 100%; }
    .lightboxthumb2   { float:none; width:98%; background-size:auto 200%; }
    .lightboxthumb3   { width: 8%; }
    .lightbox .click .clickleft  { opacity: 1; }
    .lightbox .click .clickright { opacity: 1; }
}

@media screen and (orientation: landscape) {
    .lightbox .content {
        width: auto;
        height: 79%;
        position: absolute;
    }
    .lightbox .content img {
        height: 100%;
        width: auto;
    }
    .lightbox .click .clickleft {

    }
    .lightbox .click .clickright {

    }
}

@media only screen and (max-height:500px) {
    .navigation {
        overflow-y: scroll;
    }
    .lightbox .content {
        width: auto;
        height: 95%;
        /*max-height:95%;*/
        position: absolute;
    }
    .lightbox .content img {
        height: 100%;
        /*max-height:95%;
        min-height:300px;*/
        width: auto;
    }
}
/** RESPONSIVE DESIGN_close **/

@import url("navigation.css");