﻿


/*----------------------------------------------------------- Bildschirmgrößen Laptop PC -----------------------------------------------------------------------------*/


/*----------------------------------------------------------- Nächste Größe -----------------------------------------------------------------------------*/

@media screen and (max-width: 1790px) {

    .DropdownTun {
        width: 500px;
    }
}

/*----------------------------------------------------------- Nächste Größe -----------------------------------------------------------------------------*/


@media screen and (max-width: 1664px) {

    .flex-container-zeiten {
        padding: 12px 60px 5px 60px;
    }

    .flex-container-bemerkung {
        padding: 15px 60px;
    }

    .DropdownProjektdaten {
        width: 300px;
    }
}

/*----------------------------------------------------------- Nächste Größe -----------------------------------------------------------------------------*/


@media screen and (max-width: 1540px) {

    .DropdownProjektdaten {
        width: 300px;
    }

    .DropdownTun {
        width: 450px;
    }
}



/*----------------------------------------------------------- Nächste Größe -----------------------------------------------------------------------------*/

@media screen and (max-width: 1380px) {
    .flex-container-zeiten {
        padding: 15px 30px;
        justify-content: space-between;
    }

    .flex-container-bemerkung {
        padding: 15px 30px;
    }

    .flex-container-zeitdaten {
        padding: 15px 30px;
        justify-content: space-between;
        display: flex;
    }
}

/*----------------------------------------------------------- Nächste Größe -----------------------------------------------------------------------------*/

@media screen and (min-width: 1367px), (max-height: 700px) {

    .Headlines {
        height: 15px;
    }

    .flex-container-zeiten {
        padding: 8px 30px 0 30px;
    }

    .EditTextBox {
        margin-top: 0;
    }
}



/*----------------------------------------------------------- Bildschirmgrößen Tablet ---------------------------------------------------------------------------------*/

/*----------------------------------------------------------- Nächste Größe -----------------------------------------------------------------------------*/

/*------ Ab Tabletgrößen - Anpassungen Burgermenü ------*/


@media only screen and (max-width: 1366px) {

    #Box {
        width: 280px;
        height: 300px;
    }

    #IRIS_Logo img {
        height: 120px;
        width: 120px;
    }

    #IRIS_Logo {
        left: 25px;
        top: 15px;
    }

    #Zeiterfassung_Logo img {
        width: 120px;
        height: 100px;
    }

    #Zeiterfassung_Logo {
        right: 20px;
        top: 25px;
    }

    #BalkenOben {
        height: 65px;
    }

    .schloss {
        background-size: 28px 30px;
        margin: 8px 30px 15px 31px;
    }

    #loginheader {
        font-size: 28px;
        margin: 12px 0 10px 0;
    }

    .textfeldnamen {
        width: 190px;
        height: 38px;
    }

    #btnLogin {
        margin: 25px 0 0 80px;
    }

    #lblHinweis {
        margin: 0 0 0 27px;
    }

    .togglemenu {
        display: block;
        width: 40px;
        text-align: center;
        cursor: pointer;
        position: fixed;
        z-index: 5;
        top: 0px;
        left: 0px;
    }

    #Menu {
        width: 0px;
        transition: all 0.5s;
        z-index: 4;
    }

    #IRIS_Logo {
        display: none;
    }

    #toggle:checked + #Menu {
        width: 225px;
        transition: all 0.5s;
    }

    #Content {
        height: calc(100% - 17px);
        width: calc(100% - 40px);
        margin-left: 0px;
        padding: 17px 20px 0 20px;
    }

    .Umbruch {
        margin-left: 65px;
    }

    .SpacePic {
        margin-top: 100px;
    }

    .Bemerkungsfeld {
        width: calc(100% - 40px);
    }

    .flex-container-zeiten {
        padding: 15px 50px;
    }

    .flex-container-bemerkung {
        padding: 15px 50px;
    }


    .MenuButton {
        font-size: 15px;
    }

    #ctl00_ContentPlaceHolder1_btnPasswdAendern {
        width: 140px;
    }

    th {
        padding: 13px;
    }

    input[type="button" i] {
        padding: 1px 12px;
    }

    input[type="checkbox" i] {
        transform: scale(1.2);
    }

    .GridView td {
        height: 36px;
    }

    .VerweisMonatsfreigaben {
        width: 150px;
    }

    .VerweisBack {
        width: 90px !important;
    }

    .EditButton {
        font-size: 17px;
        margin-top: 5px;
    }

    #EditButtons {
        padding: 4px 0px 10px 0px;
        position: fixed;
        bottom: 0px;
        background-color: white;
        width: 100%;
        z-index: 2;
    }

    .AddTagButton {
        font-size: 17px;
        background: black;
        width: 45px;
    }

    #EditErrorDiv {
        padding: 60px 0 0 0;
    }

    .VerweisButton {
        width: 120px;
        font-size: 17px;
    }

    .Monatsfreigabebutton {
        margin: 0 85px 0 85px;
        width: 145px;
    }

    #ctl00_ContentPlaceHolder1_btnAZReport {
        width: 170px;
    }

    #ctl00_ContentPlaceHolder1_btnAZReportDetail {
        width: 220px;
    }

    .TitelLabel {
        font-size: 20px;
    }

    .TitelLabel2 {
        margin-left: 0;
        font-size: 20px;
    }

    .GV_HeaderStyle {
        font-size: 17px;
    }

    .GV_Button {
        font-size: 15px;
    }

    .Checkbox2 {
        padding: 0 0 0 32px;
    }

    .GV_Col_Inaktiv {
        padding: 0 0 0 32px;
    }

    .DropdownProjektdaten {
        width: 280px;
        height: 30px;
    }

    .DropdownTun {
        width: 400px;
        height: 30px;
    }

    .ListButton {
        font-size: 17px;
    }


    .Neubutton {
        background-size: 40px 40px;
        background-position: 3px;
    }

    .EintragInaktiv {
        width: 230px;
    }

    .Auswahltext {
        font-size: 17px;
    }

    #Bereich {
        font-size: 17px;
    }

    .txtEingabe {
        font-size: 15px;
    }

    .Button {
        font-size: 16px;
    }

    #ctl00_ContentPlaceHolder1_calTagVon_UpdatePanel1 input[type=text] {
        height: 25px;
    }

    #ctl00_ContentPlaceHolder1_calPTagVon_txtDate {
        height: 25px;
    }

    .Zeitdateneintrag {
        height: 25px;
    }

    .ZeitEdit_InaktiveButton {
        font-size: 17px;
    }

    .ZeitEdit_ActiveButton {
        font-size: 17px;
    }

    .SwitchButtons {
        width: 290px;
    }

    .Headlines {
        padding: 7px;
        width: calc(100% - 14px);
    }



}

/* ---------------------- nächste Größe ---------------------------------------------------------------------------------------------------------------- */

@media only screen and (max-width: 1024px) {

    .SpacePic {
        margin-top: 70px;
    }

    #Box {
        width: 280px;
        height: 280px;
    }

    .schloss {
        background-size: 28px 30px;
        margin: 8px 30px 15px 31px;
    }

    .textfeldnamen {
        height: 38px;
        margin: 6px 24px;
        width: 190px;
    }

    #btnLogin {
        margin: 14px 0 0 80px;
    }

    #lblHinweis {
        margin: 0 0 0 27px;
    }

    .flex-container {
        align-items: flex-end;
    }

    .flex-container-zeiten {
        padding: 15px 40px;
    }

    .flex-container-bemerkung {
        padding: 15px 40px;
    }

    .textfeldnamen {
        height: 38px;
    }

    .TitelLabel2 {
        margin-left: 0;
        font-size: 20px;
    }

    .Neubutton {
        color: rgba(0,0,0,0.0);
        width: 100px;
        height: 35px;
        background-size: 50px 50px;
        background-position: 23px;
    }

    .Copybutton {
        color: rgba(0,0,0,0.0);
        width: 100px;
        height: 35px;
        background-size: 40px 35px;
        background-position: 30px;
    }

    .Aendernbutton {
        color: rgba(0,0,0,0.0);
        width: 100px;
        height: 35px;
        background-size: 25px 25px;
        background-position: 36px;
    }

    .NeubuttonZeit {
        background-size: 43px 43px;
        background-position: 29px;
        color: rgba(0,0,0,0.0);
        width: 100px;
        height: 35px;
    }

    .CopybuttonZeit {
        background-size: 32px 32px;
        background-position: 34px;
        color: rgba(0,0,0,0.0);
        width: 100px;
        height: 35px;
    }

    .AendernbuttonZeit {
        background-size: 21px 22px;
        background-position: 38px;
        color: rgba(0,0,0,0.0);
        width: 100px;
        height: 35px;
    }


    .DeletebuttonZeit {
        background-size: 30px 30px;
        background-position: 34px;
        color: rgba(0,0,0,0.0);
        width: 100px;
        height: 35px;
    }

    .Monatsfreigabebutton {
        margin: 0 85px 0 85px;
        width: 145px;
        font-size: 17px;
    }

    .MenuButton {
        font-size: 15px;
    }

    #ctl00_ContentPlaceHolder1_btnPasswdAendern {
        width: 140px;
    }

    th {
        padding: 13px;
    }

    input[type="button" i] {
        padding: 1px 12px;
    }

    .VerweisMonatsfreigaben {
        width: 150px;
    }

    .VerweisBack {
        width: 90px !important;
    }

    .EditButton {
        font-size: 17px;
        margin-top: 5px;
    }

    #EditButtons {
        padding: 4px 0px 10px 0px;
        position: fixed;
        bottom: 0px;
        background-color: white;
        width: 100%;
        z-index: 2;
    }

    .AddTagButton {
        font-size: 17px;
        background: black;
        width: 45px;
    }

    #ctl00_ContentPlaceHolder1_btnAZReport {
        width: 170px;
    }

    #ctl00_ContentPlaceHolder1_btnAZReportDetail {
        width: 220px;
    }

    .GV_HeaderStyle {
        font-size: 17px;
    }

    .GV_Button {
        font-size: 15px;
    }

    .Checkbox2 {
        padding: 0 0 0 32px;
    }

    .GV_Col_Inaktiv {
        padding: 0 0 0 32px;
    }

    .DropdownProjektdaten {
        width: 280px;
        height: 30px;
    }

    .DropdownTun {
        width: 400px;
        height: 30px;
    }

    .EintragInaktiv {
        width: 230px;
    }

    .Auswahltext {
        font-size: 17px;
    }

    #Bereich {
        font-size: 17px;
    }

    .txtEingabe {
        font-size: 15px;
    }

    .Button {
        font-size: 16px;
    }

    #ctl00_ContentPlaceHolder1_calTagVon_UpdatePanel1 input[type=text] {
        height: 25px;
    }

    #ctl00_ContentPlaceHolder1_calPTagVon_txtDate {
        height: 25px;
    }

    .Zeitdateneintrag {
        height: 25px;
    }

    .ZeitEdit_InaktiveButton {
        font-size: 17px;
    }

    .ZeitEdit_ActiveButton {
        font-size: 17px;
    }

    .SwitchButtons {
        width: 290px;
    }

    .Headlines {
        padding: 7px;
        width: calc(100% - 14px);
    }

    .Bemerkungsfeld {
        height: 200px;
    }



}

/* -------------------------- nächste Größe ---------------------------------------------------------------------------------------------------------------- */

@media only screen and (max-width: 964px) {

    #IRIS_Logo img {
        height: 100px;
        width: 100px;
    }

    #IRIS_Logo {
        left: 20px;
        top: 10px;
    }

    #Zeiterfassung_Logo img {
        width: 100px;
        height: 80px;
        margin-top: 0;
    }

    #Zeiterfassung_Logo {
        right: 15px;
        top: 20px;
    }

    #BalkenOben {
        height: 45px;
    }

    .flex-container-zeiten {
        padding: 15px 55px;
        justify-content: center;
        align-items: center;
        display: block;
    }

    .flex-container-zeitdaten {
        padding: 15px 55px;
        justify-content: space-between;
        align-items: center;
        display: flex;
    }

    .flex-container-bemerkung {
        padding: 15px 55px;
        margin-bottom: 50px;
    }

    .textfeldnamen {
        height: 38px;
    }

    .TitelLabel {
        font-size: 21px;
    }

    .Monatsfreigabebutton {
        font-size: 17px;
    }

    .EditTextBox {
        margin-top: 5px;
        height: 23px;
        font-size: 16px;
    }

    #EditDiv {
        padding: 10px 0 60px 14px;
    }

    #ctl00_ContentPlaceHolder1_btnAZReport {
        width: 177px;
    }

    #ctl00_ContentPlaceHolder1_btnAZReportDetail {
        width: 227px;
    }

    .GV_Button {
        font-size: 15px;
    }

    .DropdownProjektdaten {
        width: 100%;
        height: 38px;
        font-size: 15px;
    }

    .DropdownBerichtszeitraum {
        width: 200px;
    }
    
    .DropdownTun {
        width: 100%;
        height: 38px;
        font-size: 15px;
    }

    .Auswahltext {
        font-size: 18px;
        margin-left: 4px;
    }

    .Auswahlfeld {
        height: 29px;
        margin-left: 0px;
        margin-bottom: 11px;
        font-size: 15px;
    }

    #ctl00_ContentPlaceHolder1_calTagVon_btnDate {
        height: 34px;
    }

    #Bereich {
        font-size: 18px;
    }

    .txtEingabe {
        height: 34px;
    }

    .Button {
        height: 31px;
    }

    #ctl00_ContentPlaceHolder1_calTagVon_UpdatePanel1 input[type=text] {
        height: 31px;
        font-size: 15px;
        width: calc(100% - 10px);
    }

    #ctl00_ContentPlaceHolder1_calPTagVon_txtDate {
        height: 31px;
        font-size: 15px;
    }

    #ctl00_ContentPlaceHolder1_calVon_txtDate {
        height: 31px;
        font-size: 15px;
    }

    #ctl00_ContentPlaceHolder1_calBis_txtDate {
        height: 31px;
        font-size: 15px;
    }

    .Zeitdateneintrag {
        height: 31px;
        font-size: 15px;
        width: 150px;
    }

    .ZeitEdit_InaktiveButton {
        height: 34px;
        width: 105px;
        padding: 0;
    }

    .ZeitEdit_ActiveButton {
        height: 34px;
        width: 105px;
        padding: 0;
    }

    .SwitchButtons {
        width: 254px;
    }

    #ZeitenMonatsauswahl {
        margin-bottom: 5px;
    }

    .Breite1 {
        width: 212px;
    }

    .Breite2 {
        width: 37%;
    }

    .Breite3 {
        width: 96%;
    }

    .Dropdown1 {
        height: 30px;
        font-size: 17px;
        margin-bottom: px;
    }

    input[type="checkbox" i] {
        margin: 5px 0 5px 4px;
    }

    p {    }

    .GridView td {
        height: 40px;
    }

    .GV_Col_Inaktiv {
        width: 65px;
    }

    .VerweisMonatsfreigaben {
        margin-bottom: 7px;
    }

    .VerweisTP {
        margin-bottom: 7px;
    }

    .ButtonWrap {
        display: flex;
        flex-wrap: wrap;
        width: 100%;
    }

    /*---------------------------------------- nächste Größe -------------------------------------------------------------------------------------------------------------------*/

    @media only screen and (max-width: 840px) {

        .Monatsfreigabebutton {
            margin: 0 30px 0 30px;
        }
    }

    /*---------------------------------------- nächste Größe -------------------------------------------------------------------------------------------------------------------*/

    @media only screen and (max-width: 792px) {

        #ListButtons {
            padding: 7px 0 7px 0;
            position: fixed;
            bottom: 0;
            background-color: white;
        }

        .Inaktivbutton {
            width: 130px;
            height: 35px;
        }

        .EintragInaktiv {
            width: 230px;
            height: 35px;
        }

        .flex-container {
            flex-wrap: wrap;
        }

        .buttonpadding {
            padding-bottom: 5px;
        }

        .flex-button {
            width: 100%;
            display: flex;
            justify-content: center;
        }
    }


    /*---------------------------------------- nächste Größe -------------------------------------------------------------------------------------------------------------------*/

    @media only screen and (max-width: 730px) {


        .NeubuttonZeit {
            margin: 0;
            background-size: 45px 45px;
            background-position: 2px;
            width: 50px;
            height: 45px;
        }

        .CopybuttonZeit {
            margin: 0;
            background-size: 38px 38px;
            background-position: 6px;
            width: 50px;
            height: 45px;
        }

        .AendernbuttonZeit {
            margin: 0;
            background-size: 30px 31px;
            background-position: 9px;
            width: 50px;
            height: 45px;
        }

        .DeletebuttonZeit {
            margin: 0;
            background-size: 36px 36px;
            background-position: 7px;
            width: 50px;
            height: 45px;
        }

        .flex-container-zeiten {
            padding: 15px 20px;
        }

        .flex-container-zeitdaten {
            padding: 15px 20px;
        }

        .flex-container-bemerkung {
            padding: 15px 20px;
        }

        .Zeitdateneintrag {
            width: 200px;
        }

        .Breite2 {
            width: 100%;
            padding-left: 30%;
            padding-right: 30%;
        }

        .BerichtButtons {
            justify-content: center;
        }

        .BerichtAbstand {
            margin: 0 10px 10px 0;
        }

    }


    /*---------------------------------------- nächste Größe -------------------------------------------------------------------------------------------------------------------*/

    @media only screen and (max-width: 599px) {

        .Monatsfreigabebutton {
            margin: 0 40px 0 40px;
        }


        #ZeitenMonatsauswahl {
            display: grid;
        }

        .Zeitdateneintrag {
            width: calc(100% - 11px);
        }

        .Breite2 {
            padding-left: 20%;
            padding-right: 20%;
        }
    }

    /*---------------------------------------- nächste Größe -------------------------------------------------------------------------------------------------------------------*/

    @media only screen and (max-width: 520px) {

        .Zeitdateneintrag {
            width: 150px;
            margin: 0 5px 0 5px;
        }

        .flex-container-zeitdaten {
            display: flex;
            justify-content: center;
        }
    }


    /*---------------------------------------- nächste Größe -------------------------------------------------------------------------------------------------------------------*/

    @media only screen and (max-width: 500px) {

        .Monatsfreigabebutton {
            margin: 0 6px 0 6px;
        }

        #Content {
            height: calc(100% - 17px);
            width: calc(100% - 20px);
            padding: 17px 10px 0 10px;
        }

        label {
            margin: 17px 0 0 10px;
        }
    }

    /*---------------------------------------- nächste Größe -------------------------------------------------------------------------------------------------------------------*/

    @media only screen and (max-width: 400px) {

        .NeubuttonZeit {
            background-position: center center;
            width: 45px;
            height: 42px;
        }

        .CopybuttonZeit {
            background-position: center center;
            width: 45px;
            height: 42px;
        }

        .AendernbuttonZeit {
            background-position: center center;
            background-size: 27px 27px;
            width: 45px;
            height: 42px;
        }

        .DeletebuttonZeit {
            background-position: center center;
            background-size: 34px 34px;
            width: 45px;
            height: 42px;
        }





    }

}

