﻿/* Viewport settings */
@media (min-width: 768px) {
    .Page_OnlineQuote #divQuote.container,
    .Page_OnlineQuote_Texoil #divQuote.container,
    .Page_Login #divLogin.container,
    .Page_AdminLogin #divAdminLogin.container,
    .Page_ForgottenPassword #divForgottenPassword.container,
    .Page_ChangePassword #divChangePassword.container,
    .Page_ChangeEmail #divChangeEmail.container,
    .Page_SavedQuote .contentSection,
    .Page_YourDetails #divYourDetails.container,
    .Page_Register #divRegister.container,
    .Page_RegisterProfile #divRegister.container,
    .Page_OrderAddress_Texoil #divOrderAddress.container,
    .Page_OrderAddress_Donegal #divOrderAddress.container,
    .Page_OrderAddress_EuroOil #divOrderAddress.container,
    .Page_OrderPaymentNotification #orderDetailsSection,
    .Page_OrderConfirmation #divOrderConfirmation,
    .Page_AdhocPayment #divAdhocPayment,
    .Page_CardEnquiry #divCardSearch,
    .Page_ContactReasons #divContactReasons,
    .Page_ContactUs #divContactUs,
    .Page_LastLoginAudit #divLoginAudit,
    .Page_Profiles #divProfileSearch,
    .Page_AccountRestrictions #divAccountRestrictions,
    .Page_ProfileAccessRequest #divRequestHandle,
    .Page_DrawingEnquiry #divDrawingSearch,
    .Page_DrawingEnquiry #divExtractConfig,
    .Page_CardRequest #divCardRequest.container,
    .Page_CardEnquiry #moreResults.container,
    .Page_TestEmails #divTestEmails.container,
    .Page_APIConfig #divAPIConfig.container,
    .Page_WebPlusConfig #divWebPlusConfig.container,
    .Page_EditWebPlusConfig #divEditWebPlusConfig.container,
    .Page_EditWebPlusConfig #divEditWebPlusConfigButtons.container,
    #messageSection.container,
    #dockedFixedMode > .container,
    .SmallButtonBar.container,
    .simpleCookieDialog .container,
    .Page_Stats #divAdminStats.container,
    .Page_ImpersonationLogin #divLogin.container,
    .Page_RegisterAccount #registerFieldsSection.container,
    .Page_ProfileManager .optionsSelection.container,
    .Page_AddAccessToUser #divAccessUser.container,
    .Page_CreateProfile #divCreateProfile.container,
    .Page_LegacyLogin #divLegacyLogin.container,
    .Page_Dashboard #divAdminDashboard.container {
        width: 500px;
    }

    .Page_WebSettings .optionsSelection.container {
        width: 550px;
    }

    .Page_ProfileManager div#divProfileMgr.container,
    .Page_WebSettings #divWebSettings.container {
        width: 800px;
    }

    .Page_CardRequest #cardsTable.container,
    .Page_CardEnquiry #divCardsTable.container,
    .Page_CardRequest #dockedFixedMode > .container {
        width: 700px;
    }


}

@media (min-width: 992px) {
    .Page_OnlineQuote #divQuote.container,
    .Page_OnlineQuote_Texoil #divQuote.container,
    .Page_Login #divLogin.container,
    .Page_AdminLogin #divAdminLogin.container,
    .Page_ForgottenPassword #divForgottenPassword.container,
    .Page_ChangePassword #divChangePassword.container,
    .Page_ChangeEmail #divChangeEmail.container,
    .Page_SavedQuote .contentSection,
    .Page_YourDetails #divYourDetails.container,
    .Page_Register #divRegister.container,
    .Page_RegisterProfile #divRegister.container,
    .Page_OrderAddress_Texoil #divOrderAddress.container,
    .Page_OrderAddress_Donegal #divOrderAddress.container,
    .Page_OrderAddress_EuroOil #divOrderAddress.container,
    .Page_OrderPaymentNotification #orderDetailsSection,
    .Page_OrderConfirmation #divOrderConfirmation,
    .Page_AdhocPayment #divAdhocPayment,
    .Page_CardEnquiry #divCardSearch,
    .Page_ContactReasons #divContactReasons,
    .Page_ContactUs #divContactUs,
    .Page_LastLoginAudit #divLoginAudit,
    .Page_Profiles #divProfileSearch,
    .Page_AccountRestrictions #divAccountRestrictions,
    .Page_ProfileAccessRequest #divRequestHandle,
    .Page_DrawingEnquiry #divDrawingSearch,
    .Page_DrawingEnquiry #divExtractConfig,
    .Page_CardRequest #divCardRequest.container,
    .Page_CardEnquiry #moreResults.container,
    .Page_TestEmails #divTestEmails.container,
    .Page_APIConfig #divAPIConfig.container,
    .Page_WebPlusConfig #divWebPlusConfig.container,
    .Page_EditWebPlusConfig #divEditWebPlusConfig.container,
    .Page_EditWebPlusConfig #divEditWebPlusConfigButtons.container,
    #messageSection.container,
    #dockedFixedMode > .container,
    .SmallButtonBar.container,
    .simpleCookieDialog .container,
    .Page_Stats #divAdminStats.container,
    .Page_ImpersonationLogin #divLogin.container,
    .Page_RegisterAccount #registerFieldsSection.container,
    .Page_ProfileManager .optionsSelection.container,
    .Page_AddAccessToUser #divAccessUser.container,
    .Page_CreateProfile #divCreateProfile.container,
    .Page_LegacyLogin #divLegacyLogin.container,
    .Page_Dashboard #divAdminDashboard.container {
        width: 500px;
    }
    
    .Page_WebSettings .optionsSelection.container{
        width:550px;
    }

    .Page_ProfileManager div#divProfileMgr.container,
    .Page_WebSettings #divWebSettings.container {
        width: 800px;
    }

    .Page_CardRequest #cardsTable.container,
    .Page_CardEnquiry #divCardsTable.container,
    .Page_CardRequest #dockedFixedMode > .container {
        width: 700px;
    }
}

@media (min-width: 1200px) {
    .Page_OnlineQuote #divQuote.container,
    .Page_OnlineQuote_Texoil #divQuote.container,
    .Page_Login #divLogin.container,
    .Page_AdminLogin #divAdminLogin.container,
    .Page_ForgottenPassword #divForgottenPassword.container,
    .Page_ChangePassword #divChangePassword.container,
    .Page_ChangeEmail #divChangeEmail.container,
    .Page_SavedQuote .contentSection,
    .Page_YourDetails #divYourDetails.container,
    .Page_Register #divRegister.container,
    .Page_RegisterProfile #divRegister.container,
    .Page_OrderAddress_Texoil #divOrderAddress.container,
    .Page_OrderAddress_Donegal #divOrderAddress.container,
    .Page_OrderAddress_EuroOil #divOrderAddress.container,
    .Page_OrderPaymentNotification #orderDetailsSection,
    .Page_OrderConfirmation #divOrderConfirmation,
    .Page_AdhocPayment #divAdhocPayment,
    .Page_CardEnquiry #divCardSearch,
    .Page_ContactReasons #divContactReasons,
    .Page_ContactUs #divContactUs,
    .Page_LastLoginAudit #divLoginAudit,
    .Page_Profiles #divProfileSearch,
    .Page_AccountRestrictions #divAccountRestrictions,
    .Page_ProfileAccessRequest #divRequestHandle,
    .Page_DrawingEnquiry #divDrawingSearch,
    .Page_DrawingEnquiry #divExtractConfig,
    .Page_CardRequest #divCardRequest.container,
    .Page_CardEnquiry #moreResults.container,
    .Page_TestEmails #divTestEmails.container,
    .Page_APIConfig #divAPIConfig.container,
    .Page_WebPlusConfig #divWebPlusConfig.container,
    .Page_EditWebPlusConfig #divEditWebPlusConfig.container,
    .Page_EditWebPlusConfig #divEditWebPlusConfigButtons.container,
    #messageSection.container,
    #dockedFixedMode > .container,
    .SmallButtonBar.container,
    .simpleCookieDialog .container,
    .Page_Stats #divAdminStats.container,
    .Page_ImpersonationLogin #divLogin.container,
    .Page_RegisterAccount #registerFieldsSection.container,
    .Page_ProfileManager .optionsSelection.container,
    .Page_AddAccessToUser #divAccessUser.container,
    .Page_CreateProfile #divCreateProfile.container,
    .Page_LegacyLogin #divLegacyLogin.container,
    .Page_Dashboard #divAdminDashboard.container {
        width: 500px;
    }

    .Page_WebSettings .optionsSelection.container {
        width:550px;
    }

    .Page_ProfileManager div#divProfileMgr.container,
    .Page_WebSettings #divWebSettings.container {
        width: 800px;
    }

    .Page_ProfileManager ul#leftSettingsMenu, 
    .Page_WebSettings ul#leftSettingsMenu {
        list-style-type:square;
        float: left;
        top:0;
    }

    .Page_ProfileManager ul#leftSettingsMenu{
        width: 250px;
    }

    .Page_WebSettings ul#leftSettingsMenu{
        width:200px;
    }

    .Page_ProfileManager ul#leftSettingsMenu.defaultPositionMenu,
    .Page_WebSettings ul#leftSettingsMenu.defaultPositionMenu {
        position: relative;
    }

    .Page_ProfileManager ul#leftSettingsMenu.floatingPositionMenu,
    .Page_WebSettings ul#leftSettingsMenu.floatingPositionMenu {
        position:fixed;
    }

    .Page_CardRequest #cardsTable.container,
    .Page_CardEnquiry #divCardsTable.container,
    .Page_CardRequest #dockedFixedMode > .container {
        width: 900px;
    }
}

@media (min-width: 500px ) and (max-width: 600px ) {
    .Page_CardEnquiry #divCardsTable .resultsData .dataRow,
    .Page_CardEnquiry #divCardsTable .resultsTableSubInfo,
    .Page_Profiles #tblProfiles .resultsData .dataRow,
    .Page_Profiles #tblProfiles .resultsTableSubInfo,
    .Page_DrawingEnquiry #tblDrawings .resultsData .dataRow,
    .Page_DrawingEnquiry #tblDrawings .resultsTableSubInfo {
        font-size: 0.8em;
    }
}

@media (max-width: 400px) {
    .pageButtons.btn-group .btn {
        width: 100% !important;
        clear: both;
        border-radius: 6px !important;
        margin-bottom: 5px;
    }

    .Page_OrderAddress div.pageButtons.btnConfirmGroup,
    .Page_YourDetails div.pageButtons.btnConfirmGroup {
        flex-direction: column;
        display: flex;
    }

    .Page_OrderAddress div.pageButtons.btnConfirmGroup button#btnBack,
    .Page_YourDetails div.pageButtons.btnConfirmGroup button#btnBack {
        order: 2;
    }

    .Page_OrderAddress div.pageButtons.btnConfirmGroup button#btnContinue,
    .Page_YourDetails div.pageButtons.btnConfirmGroup button#btnContinue {
        order: 1;
    }

}

@media (max-width:768px) {
    .dialogWarning {
        width: 100%;
    }

    .gridGDPR label {
        padding: 0 1px;
    }
    
    .Page_AccountSummary div.currentOrderStats div.stageIndicatorIcon {
        width: 14%;
        height: 180%;
    }

    .Page_AccountSummary div.currentOrderStats div.stageIndicatorSep {
        width: 5%;
        height: 4px;
        line-height: 180%;
        margin-top: 16px;
    }

    .Page_AccountSummary div.currentOrderStats div.currentOrdersContainer {
        height: 20px;
        margin-top: 20px;
    }

    .Page_AccountSummary div.currentOrderStats div.stageIndicatorIcon:first-child {
        margin-left: 5px;
    }

    .Page_AccountSummary div.currentOrderStats div.stageIndicatorIcon.status-success,
    .Page_AccountSummary div.currentOrderStats div.stageIndicatorIcon.status-failed {
        margin-right: 5px;
    }

    .Page_AccountSummary div.currentOrderStats div.stageIndicatorIcon span.glyphicon {
        top: 28%;
    }

    .Page_AccountSummary div.currentOrderStats div.stageIndicatorSep.complete {
        margin-top: 14px;
        height: 6px;
        box-shadow: 5px 5px 5px #9ca998;
    }

    .Page_AccountSummary div.currentOrderStats div.stageIndicatorIcon span.glyphicon {
        width: 100%;
        height: 70%;
        line-height: 100%;
        font-size: 18px;
    }

}

@media (min-width:769px) {
    .dialogWarning {
        width: 50%;
    }

    .gridGDPR label {
        padding: 0 10px;
    }

    .Page_AccountSummary div.currentOrderStats div.stageIndicatorIcon {
        width: 50px;
        height: 50px;
    }

    .Page_AccountSummary div.currentOrderStats div.stageIndicatorSep {
        width: 30px;
        height: 4px;
        line-height: 50px;
        margin-top: 26px;
    }

    .Page_AccountSummary div.currentOrderStats div.currentOrdersContainer {
        height: 50px;
        margin-top: 30px;
    }

    .Page_AccountSummary div.currentOrderStats div.stageIndicatorIcon:first-child {
        margin-left: 10px;
    }

    .Page_AccountSummary div.currentOrderStats div.stageIndicatorIcon.status-success,
    .Page_AccountSummary div.currentOrderStats div.stageIndicatorIcon.status-failed {
        margin-right: 10px;
    }

    .Page_AccountSummary div.currentOrderStats div.stageIndicatorIcon span.glyphicon {
        top: 28%;
    }

    .Page_AccountSummary div.currentOrderStats div.stageIndicatorSep.complete {
        margin-top: 24px;
        height: 6px;
        box-shadow: 5px 5px 5px #9ca998;
    }

    .Page_AccountSummary div.currentOrderStats div.stageIndicatorIcon span.glyphicon {
        width: 100%;
        height: 70%;
        line-height: 100%;
        font-size: 18px;
    }
}


@media (min-width:1200px){

    .Page_AccountSummary div.currentOrderStats div.stageIndicatorIcon {
        width: 60px;
        height: 60px;
    }

    .Page_AccountSummary div.currentOrderStats div.stageIndicatorSep {
        width: 60px;
        height: 4px;
        line-height: 60px;
        margin-top: 28px;
    }

    .Page_AccountSummary div.currentOrderStats div.currentOrdersContainer {
        height: 40px;
        margin-top: 40px;
    }

    .Page_AccountSummary div.currentOrderStats div.stageIndicatorIcon:first-child {
        margin-left: 60px;
    }

    .Page_AccountSummary div.currentOrderStats div.stageIndicatorIcon.status-success,
    .Page_AccountSummary div.currentOrderStats div.stageIndicatorIcon.status-failed {
        margin-right: 60px;
    }

    .Page_AccountSummary div.currentOrderStats div.stageIndicatorIcon span.glyphicon {
        top: 30%;
    }

    .Page_AccountSummary div.currentOrderStats div.stageIndicatorSep.complete {
        margin-top: 27px;
        height: 6px;
        box-shadow: 5px 5px 5px #9ca998;
    }

    .Page_AccountSummary div.currentOrderStats div.stageIndicatorIcon span.glyphicon {
        width: 100%;
        height: 70%;
        line-height: 100%;
        font-size: 22px;
    }
}

/* Portal specific - if in mobile or tablet view we want to restrict the Admin Portal as many features can only be managed by desktop */
@media only screen and (max-width:700px) {
    body#PageBody.adminSectionPage div.wrapper.adminWrapper {
        display: none;
    }

    body#PageBody.adminSectionPage div.wrapper.adminMobileView {
        display: block;
    }

    body#PageBody.adminSectionPage div.wrapper.adminMobileView .container .infoBubble{
        margin-bottom:40px;
    }
}

@media only screen and  (min-width:701px) {
    body#PageBody.adminSectionPage div.wrapper.adminMobileView {
        display: none;
    }
}