﻿
    body { background-color:black;}

    div.container { margin: auto;  }
    div.main-image { background-image:url("/images/NewHouseInSunset.jpg"); background-color: #1a1315; background-size: cover; 
                      background-repeat:no-repeat; margin: 0px auto 2px; opacity: 75%; padding-bottom: 75%; position: absolute; width:100%  }
    div.main-center div.main-title div.main-link { font-size: .9em;margin-top: 2px }
    div.main-center div div { font-size:1.1em; } 
    div.left-side { float: left; margin-left: 25px; position: relative; width:75% }
    div.left-side div { margin-top: 20px }
    div.left-side div.main-title { margin-top: 25px }
    div.left-side div.main-link { margin-top: 10px }

    div.right-side { float: left; margin: 90px 0 0 0px; position:relative }
    div.main-title { position: relative; z-index: 99 }
    div.main-text1 { margin-top: 15px; } /*width: 275px; } */
    div.main-text2 { top:-30px }
   /* div.main-text3 { font-size: 1.1em; }
    div.main-text4 { font-size: 1.1em; } */

    #image-window { left:10%; position:absolute; }
    #image-window img { background-color: white; border: 2px solid gray; padding: 1px;}
/*    canvas#image-closer { position:relative; border: 2px solid gray; color: gray; font-size:1.5em; font-weight:bold; height:20px; left:415px; padding:0px 0 0 4px;top:-246px; width:20px; z-index: 200} */
    canvas#image-closer { position:relative; border: 2px solid gray; height:20px; left:415px; top:-245px; width:20px; z-index: 200}

    @media (min-width: 1000px) {
        div.main-text1 { width: 275px }
        div.main-text2 { width: 275px }
        div.main-text3 { width: 190px }
        div.main-text4 { width: 200px }
    }
    @media (max-width: 1000px) {
        div { font-size: .97em; }
        div.main-text1 { width: 35%; }
        div.main-text2 { width: 30%; } 
        div.main-text3 { width: 25%; }
        div.main-text4 { width: 150px; }
    }
    @media (max-width: 800px) {
       body { padding: 4px }
       div { font-size: 1.0em; }
       /*  div.main-center { background-image:url("/images/HouseInSunset.jpg"); height:400px; margin: 0px auto 2px; padding: 2px 10px; width:500px;  } */
       div.container { height: 400px }
       /* div.main-center { background-image:url("/images/HouseInSunsetDark.jpg"); padding-bottom: 40% } */
       div.main-center a { color: bisque;}
       div.left-side { float: none;  margin-left: 25px; width: 90% }
       div.right-side { float: none; margin-top: 0; margin-left: 25px; width: 90% }
       div.left-side div { margin-top: 10px; width: 90% }
       div.right-side div { margin-top: 10px; width: 90% }
       div-main-text4 { margin-left: 30px }
  }
       
    @media (max-width: 780px) {
        div.left-side { float: none }
    }
    /*
    @media (max-width: 600px) {
        div.main-center {
            background-image: url("/images/HouseInSunsetNarrow.jpg");
        }
    }
    @media (max-width: 500px) {
        canvas#image-closer { top: -179px  }
    }
    @media (max-width: 450px) {
        div.main-center {
            background-image: url("/images/HouseInSunsetTall.jpg");
        }
    */
    }
