/**************************** _Variables.Sixt.css ****************************/
:root
{
    /* Standard variables*/
    --MarginRatio: 1;
    --PaddingRatio: 1;
    --HeaderRatio: 1;
    --FontRatio: 1;
    --FontRatioFixed: 1;
    
    --BodyBackgroundColor: var(--White);

    --MainFontFamily: 'Open Sans', sans-serif;
    --MainFontWeight: 400;
    --MainFontSize: var(--T0);
    --MainLineHeightRatio: 1.25;
    --MainFontColor: var(--White);

    --HsFontFamily: 'Oswald', sans-serif;
    --HsFontWeight: 700;
    --HsLineHeightRatio: 1.25;
    --HsColor: var(--White);

    --FormControlFontFamily: 'Open Sans', sans-serif;
    --FormControlFontWeight: 400;
    --FormControlFontSize: 16px;
    --FormControlTextColor: var(--Black);
    --FormControlBackgroundColor: var(--White);
    --FormControlShadow: rgba(0,0,0,0.2) 2px 2px 4px inset;
    --FormControlPaddingV: 8px;
    --FormControlPaddingH: 20px;
    --FormControlRadius: var(--D2);
    --FormControlBorder: 2px solid #ffffff;
    --FormControlHeight: 50px;

    --FormButtonFontFamily: 'Open Sans', sans-serif;
    --FormButtonFontWeight: 700;
    --FormButtonFontSize: 16px;
    --FormButtonTextColor: var(--White);
    --FormButtonBackgroundColor: var(--AvisRed);
    --FormButtonTextColorHover: var(--White);
    --FormButtonBackgroundColorHover: var(--Black);

    --ValidatorOKBackgroundColor: var(--DarkGreen);
    --ValidatorOKTextColor: var(--White);
    --ValidatorErrorBackgroundColor: var(--DarkGray);
    --ValidatorErrorTextColor: var(--White);
    --ValidatorFieldHighlighterBackgroundColor: var(--DarkGray);
    --ValidatorFieldHighlighterTextColor: var(--White);
    --ValidatorErrorFieldBackgroundColor: var(--AvisRed);
    --ValidatorErrorFieldTextColor: var(--White);

    --ListColor: var(--DarkGreen);
    --AColor: var(--AvisRed);
    --StrongFontWeight: 700;

    --LayoutMaxWidth: 1280px;
    --LayoutMargin: 20px;

    --M1: 12px;
    --M2: 24px;
    --M3: 36px;
    --M4: 48px;
    --M8: 96px;
    --M10: 120px;
    --M12: 144px;
    --D2: 6px;
    --D3: 4px;
    --D6: 2px;

    --T0: 16px;     --T0MA: 12px;      --T0MB: 12px;  /* For standard texts, T0MA is typically M1, while T0MB can be M1 or M2 */
    --T1: 32px;     --T1M: 12px;   --T1P: 12px;   /* As H1 */
    --T2: 32px;     --T2M: 12px;   --T2P: 12px;   /* As H2 */
    --T3: 24px;     --T3M: 12px;   --T3P: 8px;     /* As H3 */
    --T4: 24px;     --T4M: 12px;   --T4P: 8px;     /* As H4 */
    --T5: 18px;     --T5M: 8px;     --T5P: 6px;     /* As H5 */
    --T6: 16px;     --T6M: 8px;     --T6P: 6px;     /* As H6 */

    /* Custom colors & variables*/
    --SixtOrange:#ff6000;
    --Black: #202020;
    --White: #ffffff;
    --DarkBlue: #00448b;
    --LightGray: #ccc;
    --DarkGray: #444444;
    --Red: #a00000;
    --DarkRed: #800000;
    --LightRed: #ff4040;
    --DarkGreen: #208040;
    --LightBlue: #1095d3;
    --Orange: #f7931d;
    --LightGrayBackground: #f4f7fa;
    --DarkBlueSemiOpaque: rgba(0,68,139,0.9);
    --LightBlueSemiOpaque: #1095d3c0;
    
    --FormControlDropdownShadow: rgba(0,0,0,0.2) 0px 0px 4px;
    --FormControlDropdownItemTextColor: var(--Black);
    --FormControlDropdownHeaderTextColor: var(--AvisRed);
    --FormControlDropdownHeaderFontWeight: 700;
    --FormControlDropdownItemBackgroundColorHover: var(--AvisRed);
    --FormControlDropdownItemTextColorHover: var(--White);
    
    --SmallTItleFontSize: 16px; /* Used for Extra titles*/
    --SmallTitleHeightRatio: 1.25;

    --MedFontSize: 14px;     /* Used for Extra descriptions*/
    --MedLineHeightRatio: 1.25;

    --SmallFontSize: 12px; /* Used for Comments Under Quote*/
    --SmallLineHeightRatio: 1.25;

    /* Separation Between Sections - a section is a differently colored div area, or divs separated by a line */
    /* Base is 4px, 8px, 16px, 28px, 40px */
    --SeparationBeforeSection: 28px; /* Typically a 16px margin and the 12px padding of the H1/H2*/
    --SeparationAfterSection: 40px; /* This is a 40px margin at the bottom*/

    /* Base is 20px, 40px for Horizontal, but 8px or 16px can exist for padding */
    --SeparationInsideSections: 20px; /* In between subtitles*/

    /* These paddings are for text content boxes*/
    --PaddingTopInsideBox: 16px;
    --PaddingBottomInsideBox: 24px;
    --PaddingSideInsideBox: 20px;
    
    /* These paddings are for more square / image content, where we will have a constant padding all around*/
    --PaddingAroundBoxSmall: 4px; /* Destinations and Testimonials*/
    --PaddingAroundBoxMedium: 8px; /* Extras*/
    --PaddingAroundBoxLarge: 16px; 

    --HorizontalGap: 40px;
    --GapBetweenSmallBoxes: 16px; /* For example, Testimonials and Destiantions on home page*/
    --LineColor: rgba(255,255,255,0.5);
    
    /* These are buttons used in QuoteForm and QuoteInfo, that is, orange panels */
    --OrangePanelBackgroundColor: var(--DarkGray);
    --OrangePanelBoxShadow: rgba(0,0,0,0.5) 0px 0px 10px;
    --OrangePanelButtonFontFamily: 'Open Sans', sans-serif;
    --OrangePanelButtonFontWeight: 700;
    --OrangePanelButtonFontSize: 16px;
    --OrangePanelButtonTextColor: var(--White);
    --OrangePanelButtonBackgroundColor: var(--AvisRed);
    --OrangePanelButtonTextColorHover: var(--White);
    --OrangePanelButtonBackgroundColorHover: var(--Black);

    --ComboboxDropdownItemColor: var(--DarkGray);

    --CalendarTHBackgroundColor: var(--AvisRed);
    --CalendarTHTextColor: var(--White);
    --CalendarTDDisabledBackgroundColor: var(--White);
    --CalendarTDDisabledTextColor: var(--LightGray);
    --CalendarTDEnabledBackgroundColor: var(--White);
    --CalendarTDEnabledTextColor: var(--DarkGray);
    --CalendarButtonBackgroundColor: var(--AvisRed);
    --CalendarButtonTextColor: var(--White);
    --CalendarTDEnabledBackgroundColorHover: var(--DarkGray);
    --CalendarTDEnabledTextColorHover: var(--White);
    --CalendarCurrentMonthTextColor: var(--DarkGray);

    --NoExcessGradient: linear-gradient(to right, darkviolet, #400080);

    /* These are used in  */
    --ProcessButtonBackgroundColor: var(--Orange);

    --QuoteFormPadding: 20px;

    --QuoteResultsWrapperBackgroundColor: var(--AvisRed);
    --QuoteResultTextColor: var(--Black);
    --QuoteResultTitleColor: var(--AvisRed);
    --QuoteResultTitleFontWeight: 700;
    --QuoteResultBoxShadow: rgba(0,0,0,0.5) 0px 0px 10px;
    --QuoteResultPriceColor: var(--Black);
    --QuoteResultButtonBackgroundColor: var(--AvisRed);
    --QuoteResultButtonTextColor: var(--White);
    --QuoteResultButtonFontWeight: 600;
    --QuoteResultButtonFontSize: 16px;
    --QuoteResultButtonBackgroundColorHover: var(--Black);
    --QuoteResultButtonTextColorHover: var(--White);
    --QuoteResultPricePanelBackgroundColor: var(--LightGrayBackground);

    --QuoteInfoBackgroundColor: var(--DarkGray);
    --QuoteInfoTextColor: var(--White);
    --QuoteInfoTextHighlightShadow: rgba(0, 0, 0, 0.6) 0px 0px 6px;
    --QuoteInfoTextHighlightFontWeight: 700;
    --QuoteInfoTitleColor: inherit;
    --QuoteInfoTitleFontWeight: 300;

    --TopBarBackgroundColor: var(--White);
    --TopBarbackgroundImage: linear-gradient(transparent, var(--LightGray));
    --TopBarBorderBottom: 8px solid var(--SixtOrange);
    --TopBarComboboxButtonBackgroundColor: var(--DarkGray);
    --TopBarComboboxButtonBackgroundColorHover: var(--AvisRed);
    --TopBarComboboxButtonActiveBackgroundColor: var(--Black);
    --TopBarComboboxMenuBackgroundColor: var(--DarkGray);
    --TopBarComboboxMenuTextColor: var(--White);
    --TopBarLoginButtonBackgroundColor: var(--Red);
    --TopBarLoginButtonTextColor: var(--White);
    --TopBarLoginButtonBackgroundColorHover: var(--Black);
    --TopBarLoginButtonTextColorHover: var(--White);
    --TopBarTextColor: var(--DarkGray);
    --TopBarBoxShadow: rgba(0,0,0,0.3) 10px 0px 20px;

    --WhatsIncludedWrapperBackgroundColor: var(--AvisRed);
    --WhatsIncludedTitleAlign: center;
    --WhatsIncludedTextColor: inherit;
    --WhatsIncludedTitleColor: inherit;

    --DestinationsWrapperBackgroundColor: var(--AvisRed);
    --DestinationsWrapperBackgroundImage: linear-gradient(rgba(0,0,0,0.1), transparent); 
    --DestinationBackgroundColor: var(--White);
    --DestinationsTitleColor: var(--White);
    --DestinationsTitleFontWeight: 700;
    --DestinationsTitleAlign: center;
    --DestinationTitleColor: var(--AvisRed);
    --DestinationTextColor: var(--Black);
    --DestinationBulletColor: var(--AvisRed);
    --DestinationBoxShadow: rgba(0,0,0,0.2) 0 0 10px;
    
    --WorkingTitleColor: var(--White);
    --WorkingTextColor: var(--White);

    --FooterBackgroundImage: linear-gradient(rgba(0,0,0,0.2), rgba(0,0,0,0.4)); 
    --FooterBackgroundColor: var(--DarkGray);
    --FooterBorderTop: 8px solid var(--White);
    --FooterMinHeight: 200px;

    --BookItMainWrapperBackgroundColor: var(--AvisRed);

    --ExtraBackgroundColor: var(--White);
    --ExtraBackgroundColorHover: var(--LightGrayBackground);
    --ExtraTextColor: var(--Black);
    --ExtraTitleColor: var(--AvisRed);

    --BookItButtonBackgroundColor: var(--DarkGray);
    --BookItButtonBackgroundColorHover: var(--Black);
    --BookItButtonTextColor: var(--White);
    --BookItButtonTextColorHover: var(--White);
    --BookItButtonFontWeight: 700;
    --BookItTitleColor: inherit;

    --BookItSectionPadding: 16px;
    --BookItSectionBorder: solid 1px var(--LineColor);
    --BookItSectionBorderRadius: 4px;
    --BookItSectionBoxShadow: rgba(0,0,0,0.2) 0 0 10px;
    --BookItSectionBoxBackgroundColor: none;

    --HomeBackgroundImage: linear-gradient(transparent 80%, rgba(0,0,0,1)), url('/images/sixt/HomeBack.webp');
    --HomeTitleColor: var(--Black);
}

/**************************** TopBar.Sixt.css ****************************/
div#TopBar img.Logo
{
        max-width: 160px;
}