/* ----------- iPad 1, 2, Mini and Air ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 1) {
.mobile-logo {display: none;}
	#menuToggle {display: none;}
}

/* Portrait */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 1) {
html, body {
        margin: 0px;
    }
    .container {
        background: #3d1900;
		height:auto;
    }
	.left {height: auto; width:100%; display:inline-block; background-color: #3d1900}
	
	.left > .LeftMenu {
    height: auto;
    width: 100%;
    display: block;
}
	.left > .ColOne {
    height: 100%;
    width: 100%;
    float: left;
}
	.profileText {
    margin-top: 25px;
	margin-left:25px;
}
	.left > .ColTwo {
    height: 100%;
    width: 100%;
    float: left;
}
	.logo {
    float: right;
    margin-top: 30px;
    margin-right: 30px;
}
	.right {
		height: auto; 
		width:100%; 
		display:inline-block;
		min-height:600px;
}
.rightProfile {
    float: right;
    height: auto;
	min-height:600px;
    width: 100%;
    display: inline-block;
    background-color: #FFFFFF;
    background-image: url(../img/Andrew_Street_Clovelly_016_upscaled_image_x4.jpg);
    background-size: cover;
    background-position: center center;
    overflow: hidden;
}
.ProjectList {
    font-family: Arial, Helvetica, sans-serif;
    margin-top: 25px;
	margin-left:25px;
}
.rightProjects {
    float: right;
    height: auto;
	min-height:600px;
    width: 100%;
    display: inline-block;
    background-color: #FFFFFF;
}
.rightContact {
    float: right;
    height: auto;
	min-height:670px;
    width: 100%;
    display: inline-block;
    background-color: #FFFFFF;
    background-image: url(../img/contact_upscaled_image_x4.jpg);
    background-size: cover;
    background-position: center center;
    overflow: hidden;
}
.slider-container {
    height: auto;
	min-height:600px;
    width: 100%;
    position: relative;
    overflow: hidden;
    text-align: center;
}
	  .mobile-logo {display: none;}
	#menuToggle {display: none;}
  }

/* Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 1) {
html, body {
        height: 100%;
        margin: 0px;
    }
    .container {
        height: 100%;
        background: #f0e68c;
    }
	.left {height: 100%; width:50%; display:inline-block;background-color: #3d1900}
	.right {float: right; height: 100%; width:50%; display:inline-block;background-color: #B3B3BF}
}

/* ----------- iPad 3, 4 and Pro 9.7" ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 2) {
.mobile-logo {display: none;}
	#menuToggle {display: none;}
}

/* Portrait */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 2) {
html, body {
        margin: 0px;
    }
    .container {
        background: #3d1900;
		height:auto;
    }
	.left {height: auto; width:100%; display:inline-block; background-color: #3d1900}
	
	.left > .LeftMenu {
    height: auto;
    width: 100%;
    display: block;
}
	.left > .ColOne {
    height: 100%;
    width: 100%;
    float: left;
}
	.profileText {
    margin-top: 25px;
	margin-left:25px;
}
	.left > .ColTwo {
    height: 100%;
    width: 100%;
    float: left;
}
	.logo {
    float: right;
    margin-top: 30px;
    margin-right: 30px;
}
	.right {
		height: auto; 
		width:100%; 
		display:inline-block;
		min-height:970px;
}
.rightProfile {
    float: right;
    height: auto;
	min-height:780px;
    width: 100%;
    display: inline-block;
    background-color: #FFFFFF;
    background-image: url(../img/Andrew_Street_Clovelly_016_upscaled_image_x4.jpg);
    background-size: cover;
    background-position: center center;
    overflow: hidden;
}
.ProjectList {
    font-family: Arial, Helvetica, sans-serif;
    margin-top: 25px;
	margin-left:25px;
}
.rightProjects {
    float: right;
    height: auto;
	min-height:600px;
    width: 100%;
    display: inline-block;
    background-color: #FFFFFF;
}
.slider-container {
    height: auto;
	min-height:600px;
    width: 100%;
    position: relative;
    overflow: hidden;
    text-align: center;
}
.mobile-logo {display: none;}
#menuToggle {display: none;}
}

/* Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 2) {
html, body {
        height: 100%;
        margin: 0px;
    }
    .container {
        height: 100%;
        background: #f0e68c;
    }
	.left {height: 100%; width:50%; display:inline-block;background-color: #3d1900}
	.right {float: right; height: 100%; width:50%; display:inline-block;background-color: #B3B3BF}
.mobile-logo {display: none;}
#menuToggle {display: none;}
}

/* ----------- iPad Pro 10.5" ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 834px) 
  and (max-device-width: 1112px)
  and (-webkit-min-device-pixel-ratio: 2) {
.mobile-logo {display: none;}
#menuToggle {display: none;}
}

/* Portrait */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen 
  and (min-device-width: 834px) 
  and (max-device-width: 834px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 2) {
html, body {
        margin: 0px;
    }
    .container {
        background: #3d1900;
		height:auto;
    }
	.left {height: auto; width:100%; display:inline-block; background-color: #3d1900}
	
	.left > .LeftMenu {
    height: auto;
    width: 100%;
    display: block;
}
	.left > .ColOne {
    height: 100%;
    width: 100%;
    float: left;
}
	.profileText {
    margin-top: 25px;
	margin-left:25px;
}
	.left > .ColTwo {
    height: 100%;
    width: 100%;
    float: left;
}
	.logo {
    float: right;
    margin-top: 30px;
    margin-right: 30px;
}
	.right {
		height: auto; 
		width:100%; 
		display:inline-block;
		min-height:600px;
}
.rightProfile {
    float: right;
    height: auto;
	min-height:600px;
    width: 100%;
    display: inline-block;
    background-color: #FFFFFF;
    background-image: url(../img/Andrew_Street_Clovelly_016_upscaled_image_x4.jpg);
    background-size: cover;
    background-position: center center;
    overflow: hidden;
}
.ProjectList {
    font-family: Arial, Helvetica, sans-serif;
    margin-top: 25px;
	margin-left:25px;
}
.rightProjects {
    float: right;
    height: auto;
	min-height:600px;
    width: 100%;
    display: inline-block;
    background-color: #FFFFFF;
}
.slider-container {
    height: auto;
	min-height:600px;
    width: 100%;
    position: relative;
    overflow: hidden;
    text-align: center;
}
	  .mobile-logo {display: none;}
#menuToggle {display: none;}
}

/* Landscape */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen 
  and (min-device-width: 1112px) 
  and (max-device-width: 1112px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 2) {
html, body {
        height: 100%;
        margin: 0px;
    }
    .container {
        height: 100%;
        background: #f0e68c;
    }
	.left {height: 100%; width:50%; display:inline-block;background-color: #3d1900}
	.right {float: right; height: 100%; width:50%; display:inline-block;background-color: #B3B3BF}
	  .mobile-logo {display: none;}
	#menuToggle {display: none;}
	  .mobile-logo {display: none;}
#menuToggle {display: none;}
}

/* ----------- iPad Pro 12.9" ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 1024px) 
  and (max-device-width: 1366px)
  and (-webkit-min-device-pixel-ratio: 2) {
.mobile-logo {display: none;}
#menuToggle {display: none;}
}

/* Portrait */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen 
  and (min-device-width: 1024px) 
  and (max-device-width: 1024px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 2) {
html, body {
        margin: 0px;
    }
    .container {
        background: #3d1900;
		height:auto;
    }
	.left {height: auto; width:100%; display:inline-block; background-color: #3d1900}
	
	.left > .LeftMenu {
    height: auto;
    width: 100%;
    display: block;
}
	.left > .ColOne {
    height: 100%;
    width: 100%;
    float: left;
}
	.profileText {
    margin-top: 25px;
	margin-left:25px;
}
	.left > .ColTwo {
    height: 100%;
    width: 100%;
    float: left;
}
	.logo {
    float: right;
    margin-top: 30px;
    margin-right: 30px;
}
	.right {
		height: auto; 
		width:100%; 
		display:inline-block;
		min-height:600px;
}
.rightProfile {
    float: right;
    height: auto;
	min-height:600px;
    width: 100%;
    display: inline-block;
    background-color: #FFFFFF;
    background-image: url(../img/Andrew_Street_Clovelly_016_upscaled_image_x4.jpg);
    background-size: cover;
    background-position: center center;
    overflow: hidden;
}
.ProjectList {
    font-family: Arial, Helvetica, sans-serif;
    margin-top: 25px;
	margin-left:25px;
}
.rightProjects {
    float: right;
    height: auto;
	min-height:600px;
    width: 100%;
    display: inline-block;
    background-color: #FFFFFF;
}
.slider-container {
    height: auto;
	min-height:600px;
    width: 100%;
    position: relative;
    overflow: hidden;
    text-align: center;
}
	  /* Style the navigation menu */
.topnav {
  overflow: hidden;
  background-color: #333;
  position: relative;
}

/* Hide the links inside the navigation menu (except for logo/home) */
.topnav #myLinks {
  display: none;
}

/* Style navigation menu links */
.topnav a {
  color: white;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
  display: block;
}

/* Style the hamburger menu */
.topnav a.icon {
  background: black;
  display: block;
  position: absolute;
  right: 0;
  top: 0;
}

/* Add a grey background color on mouse-over */
.topnav a:hover {
  background-color: #ddd;
  color: black;
}

/* Style the active link (or home/logo) */
.active {
  background-color: #04AA6D;
  color: white;
}
.mobile-logo {display: none;}
#menuToggle {display: none;}
}

/* Landscape */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen 
  and (min-device-width: 1366px) 
  and (max-device-width: 1366px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 2) {
html, body {
        height: 100%;
        margin: 0px;
    }
    .container {
        height: 100%;
        background: #f0e68c;
    }
	.left {height: 100%; width:50%; display:inline-block;background-color: #3d1900}
	.right {float: right; height: 100%; width:50%; display:inline-block;background-color: #B3B3BF}
.mobile-logo {display: none;}
#menuToggle {display: none;}
}