/* tablets and desktop
@media only screen and (min-width: 768px) {
}
*/

/* phones
@media only screen and (max-width: 768px) {
}
*/

/* portrait phones 
@media only screen and (max-width: 768px) and (orientation: portrait) {
    
}
*/

@media only screen and (max-width: 768px) 
{ 

    body.ResponsiveDesign { background: url('images/bg-paper.jpg') repeat-y right top !important; }

    .ResponsiveDesign .RightContentTop, 
    .ResponsiveDesign .RightContentBottom,
    .ResponsiveDesign .LeftContent .LogoContainer,
    .ResponsiveDesign .LeftContent .MenuContainerTop,
    .ResponsiveDesign .LeftContent .MenuContainerBottom
     { display: none; }

    .ResponsiveDesign .LeftContent .MenuContainer .MenuContainerMiddle { min-height: 0; }
    .ResponsiveDesign .MobileMenuContainer { color: black; background: url('images/bg-1px-overlay-50.png'); border-bottom: 3px solid #dbab47; }
    .ResponsiveDesign .Diary .DiaryList ul.FirstLevel,
    .ResponsiveDesign .MobileMenuContainer ul.DropMenu { color: black; background: url('images/bg-paper.jpg'); border-bottom: 3px solid #dbab47; border-top: 3px solid #dbab47; }

    .ResponsiveDesign .Diary .DiaryList .GroupByMonth .LevelOneDate,
    .ResponsiveDesign .Diary .DiaryList .GroupByYear .LevelOneDate,
    .ResponsiveDesign .Diary .DiaryList .GroupByYear .LevelTwoDate,
    .ResponsiveDesign ul.DropMenu li a.expandable,
    .ResponsiveDesign ul.DropMenu li a.parent { background-image: url('/resources/functions/images/downarrow-black.png'); }
    
    .ResponsiveDesign .LeftBG,
    .ResponsiveDesign .RightBG, 
    .ResponsiveDesign .LeftContent,
    .ResponsiveDesign .RightContent {
        position: static;
        float: none;
        width: auto;
        overflow: visible;
        background: none;
        margin: 0;
    }

    .ResponsiveDesign .RightContentMiddle { padding: 0; }
    .ResponsiveDesign .HeaderContainer { padding: 5px; }
    .ResponsiveDesign .HeaderContainer h1 { color: black; }
    .ResponsiveDesign .CopyrightText { color: black; }


    .ResponsiveDesign .PageFooter { border-top: 3px solid #dbab47; }

    .ResponsiveDesign .MainPage .NewsHeader .ParagraphContainer { margin-left: 0; }
    .ResponsiveDesign .MainPage .NewsContainer .NewsItem { padding: 5px; margin-left: 0; width: auto; }

    .ResponsiveDesign .Diary .DiaryCommentFormTable input,
    .ResponsiveDesign .Diary .DiaryCommentFormTable textarea { width: 100%; }

    .ResponsiveDesign .FileArea .FileListContainerMiddle { padding: 5px; }

    .ResponsiveDesign .Guestbook .GuestbookList .GuestbookListItemContainer { width: auto; }

    .ResponsiveDesign .ImageGallery1 .FunctionTable { width: auto; max-width: 480px; margin: 20px auto; }
    .ResponsiveDesign .ImageGallery1 .FunctionTable .ImageCell { width: 140px; padding: 0 10px; }
    .ResponsiveDesign .ImageGallery1 .FunctionTable .ParagraphContainer  { padding: 0; }
    .ResponsiveDesign .ImageGallery2 .FunctionTable .TextCell,
    .ResponsiveDesign .ImageGallery3 .FunctionTable .TextCell { width: auto; }

    .ResponsiveDesign .ImageGallery .Gallery1 .GalleryCell { width: 130px; padding: 5px; }

    .ResponsiveDesign .ImageGallery .Slide1 .ImageContainer img,
    .ResponsiveDesign .ImageGallery .Slide2 .ImageContainer img,
    .ResponsiveDesign .ImageGallery .Slide3 .ImageContainer img { width: 100%; }

}