@media all {
  body {
    margin: 0px;
    font: 15px arial, sans-serif;
  }
  .baseBackground {
    z-index: -1000;
    min-height: 700px;
    min-width: 1024px;
    width: 100%;
    height: auto;
    position: fixed;
    top: 0;
    left: 0;
  }
  .windowSection {
    height: 100%;
    width: 100%;
    min-height: 700px;
    min-width: 1024px;
    overflow: visible;
  }
  .blankSection {
    background-color: white;
  }
  .halfSection {
    width: 100%;
  }
  .imageSection {
    min-height: 100%;
    min-width: 1024px;
    width: 100%;
    height: auto;
  }
  .contactSection {
    background-image: url("../image/contact.jpg");
    background-size: cover;
  }
  #banner {
    z-index: 3000;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 40px;
    background-color: RGB(220,220,220);
  }
  #lowerBanner {
    z-index: 3000;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 40px;
    line-height: 40px;
    text-align: center;
    vertical-align: middle;
    background-color: RGB(220,220,220);
    color: RGB(127,127,127);
  }
  #nav {
    margin-top:0;
    list-style: none;
    width: 1000px;
    margin-left: auto;
    margin-right: auto;
  }
  #nav li .button {
    top:0;
    float: right;
    width: 150px;
    display: block;
  }
  .button {
    line-height: 40px;
    vertical-align: middle;
    color: RGB(127,127,127);
    margin-right: auto;
    margin-left: auto;
  }
  .button:hover {
    color: black;
  }
  #nav li a:hover {
    cursor: pointer;
  }
  .focusedNav {
    text-decoration: underline;
    color: black;
  }
  .icon img {
    width:100px;
    height:100px;
  }
  .icon {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 35px;
  }
  #nav li#logo {
    float: left;
    color: RGB(112,48,160);
    font: 30px calibri, sans-serif;
  }
  #servicesListBox {
    display:block;
    margin-top: -40px;
    width: 800px;
    height:auto;
    margin-left: auto;
    margin-right: auto;
    text-align:left;
    margin-bottom: 150px;
  }
  #servicesList {
    width: 800px;
    margin-left: auto;
    margin-right: auto;
  }
  #servicesList li{
    float:left;
    width:800px;
  }
  #services {
    list-style: none;
    width: 800px;
  }
  #services li{
    float:left;
    width:200px;
    margin-left:23px;
    margin-right:23px;
    margin-bottom:50px;
  }
  #contacts {
    margin-top:100px;
    list-style: none;
    width: 800px;
  }
  #contacts li{
    float:left;
    width:260px;
    height: 165px;
    margin-left:40px;
    margin-bottom:50px;
    background-color: white;
    border-style: solid;
    border-width: 1px;
    border-color: RGB(112,48,160);
    text-align: left;
    padding: 0px 20px 0 20px;
    line-height: 20px;
    vertical-align: middle;
  }
  .sectionContent {
    padding: 50px 0px 50px 0px;
    margin-left: auto;
    margin-right: auto;
    width: 800px;
  }
  .textSection {
    width: 800px;
    text-align: center;
  }
  .sectionHeader {
    top: 50px;
    text-align: center;
  }
  .textP {
    margin-top: 50px;
    margin-bottom: 50px;
    text-align: justify;
  }
  a.proprietary {
    text-decoration: none;
    color: RGB(112,48,160);
    font-weight: bold;
  }
  #introTitle{
    color: inherit;
    line-height: 50px;
    margin-top: 220px;
  }
  a {
    text-decoration: none;
    color: inherit;
  }
  a:visited{
    color: RGB(112,48,160);
  }
}
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation:portrait),
       only screen and (min-device-height : 320px) and (max-device-height : 480px) and (orientation:landscape),
       only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2),
       only screen and (min-device-width: 320px) and (max-device-width: 568px) and (-webkit-min-device-pixel-ratio: 2),
       only screen and (min-device-width: 375px) and (max-device-width: 667px) and (-webkit-min-device-pixel-ratio: 2),
       only screen and (min-device-width: 414px) and (max-device-width: 736px) and (-webkit-min-device-pixel-ratio: 3),
       only screen and (min-device-width: 375px) and (max-device-width: 812px) and (-webkit-min-device-pixel-ratio: 3)
{
  body {
    margin: 0px;
    font: 15px arial, sans-serif;
  }
  .baseBackground {
    display: none;
  }
  .windowSection {
    min-height:100%;
    width: 100%;
    height: auto;
    min-width: 100%;
    overflow: visible;
    display: flex;
    flex-direction: column;
    padding: 0px 20px 0px 20px;
  }

  .blankSection {
    background-color: white;
  }
  .halfSection {
    width: 100%;
  }
  .imageSection {
    min-height: 100%;
    width: 100%;
    height: auto;
  }
  .contactSection {
    background: url("../image/contact.jpg") scroll no-repeat center/cover;
  }
  #banner {
    z-index: 3000;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 40px;
    background-color: RGB(220,220,220);
  }
  #lowerBanner {
    z-index: 0;
    position:relative;
    width: 100%;
    height: 40px;
    line-height: 40px;
    text-align: center;
    vertical-align: middle;
    background-color: white;
    color: RGB(127,127,127);
    bottom: auto;
    left:auto;
  }
  #nav {
    margin-top:0;
    list-style: none;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
  #nav li .button {
    top:0;
    float: right;
    width: 33%;
    display: block;
  }
  #nav li#logo {
    width:100%;
    float: left;
    color: RGB(112,48,160);
    font: 30px calibri, sans-serif;
  }
  .button {
    line-height: 40px;
    vertical-align: middle;
    color: RGB(127,127,127);
    margin-right: auto;
    margin-left: auto;
  }
  .focusedNav {
    text-decoration: none;
  }
  .icon img {
    width:100px;
    height:100px;
  }
  .icon {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 35px;
  }
  /*#services {
    list-style: none;
    width: 100%;
  }
  #services li{
    float:left;
    width:40%;
    margin-left:0px;
    margin-bottom:50px;
  }*/
  #contacts {
    margin-top:100px;
    list-style: none;
    width: 100%;
  }
  #contacts li{
    margin-left: auto;
    margin-right: auto;
    float:left;
    width:70%;
    margin-bottom:50px;
    background-color: white;
    border-style: solid;
    border-width: 1px;
    border-color: RGB(112,48,160);
    text-align: left;
    padding: 0px 20px 0 20px;
    line-height: 20px;
    vertical-align: middle;
  }
  .sectionContent {
    padding: 50px 0px 50px 0px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
  }
  .textSection {
    width: 100%;
    text-align: center;
  }
  .sectionHeader {
    top: 50px;
    text-align: center;
  }
  a.proprietary {
    text-decoration: none;
    color: RGB(112,48,160);
    font-weight: bold;
  }
  #introTitle{
    color: inherit;
    line-height: 50px;
    margin-top: 220px;
  }
  a {
    text-decoration: none;
    color: inherit;
  }
  a:visited{
    color: RGB(112,48,160);
  }
}