/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {

/****************************** BEGIN REPEAT FOR ALL MOBILE ******************************/
body, html {
  width: 100%;
  height: 100%;
  padding:0!important;
  margin:0 !important;
}

div#logo,
nav#top-nav,
nav#menu,
div#wpadminbar,
div#new-royalslider-1,
div.template-hero-image,
div#google-map-location {
  display: none;
}

ul.footer-column-ul {
  height: auto !important;
  margin-bottom: 40px;
}

div#wrapper {
  position: relative;
  width: 100%;
  margin: 0;
  padding: 0;
}

div#responsive-header {
  display: block;
  position: fixed;
  top: 0;
  width: 100%;
  height: 55px;
  background-color: #333333;
  z-index: 100;
}

div#responsive-header img {
  float: right;
  width: 60px;
  margin: 5px;
}

div.latest,
div#container {
  margin-top: 60px;

}

div.homepage-highlight {
  margin-top: 40px;
}

div#general-template-sidebar,
div#general-template-column,
div.general-template-subcontent,
div.general-template-thumb,
div.general-template-banner,
div.faculty-template-sidebar,
div.excerpt-image-right {
  width: auto;
}

div.general-template-banner {
  width: 100%;
  height: 150px;
}

div.general-template-banner h1 {
  width: 100%;
  text-align: center;
}

div.general-template-thumb img {
  width: 250px;
  height: auto;
}

div.general-template-subcontent {
  margin: 0;
  padding: 5px;

}

div.entry {
  margin-top: 40px;
  padding: 10px;
}

div.catalogue-bar {
  width: auto;
}

div.catalogue-bar-middle,
div.catalogue-bar-item,
div.catalogue-bar-quote,
div.catalogue-bar-learn-more,
div.view-catalogue {
  display: none;
}

div.faculty-template-sidebar {
  margin: 0;
  padding: 0;
}

div.faculty-template-sidebar img {
  width: 250px !important;

}

footer#footer {
  height: auto;
  margin-bottom: 0;
}

div#copyright {
  height: 150px;

}

p.right {
  float: left;
}

/** NEWS LIST TEMPLATE **/

article.excerpt {
  padding: 20px;
}

article.excerpt img {
  max-width: 300px !important;
}

/** FACULTY TEMPLATE **/

div.excerpt-image-left,
div.excerpt-image-right {
  display: inline-block;
}

div.excerpt-image-left {
  margin-bottom: 20px;
}

div#responsive-general-column-button {
  position: relative;
  float: left;
  margin: 20px auto;
  width: 100%;
}

div.read-more {

}

.more-button {
  margin-top: 0;
  margin-bottom: 50px;
}

/* RESPONSIVE NAV BUTTON */

div#responsive-nav-button {
  position: fixed;
  top: 5px;
  left: 5px;
  z-index: 200;
  cursor: pointer;
}

.container {
  display: inline-block;
  cursor: pointer;

}

.bar1, .bar2, .bar3 {
  width: 35px;
  height: 5px;
  background-color: #cccccc;
  margin: 6px 0;
  transition: 0.4s;
}

/* Rotate first bar */
.change .bar1 {
  -webkit-transform: rotate(-45deg) translate(-9px, 6px) ;
  transform: rotate(-45deg) translate(-9px, 6px) ;
  -ms-transform: rotate(-45deg) translate(-9px, 6px) ;
  -moz-transform: rotate(-45deg) translate(-9px, 6px) ;
  -o-transform: rotate(-45deg) translate(-9px, 6px) ;

}

/* Fade out the second bar */
.change .bar2 {
  opacity: 0;
}

/* Rotate last bar */
.change .bar3 {
  -webkit-transform:  rotate(45deg) translate(-8px, -8px) ;
  transform:  rotate(45deg) translate(-8px, -8px) ;
  -ms-transform:  rotate(45deg) translate(-8px, -8px) ;
  -moz-transform:  rotate(45deg) translate(-8px, -8px) ;
  -o-transform:  rotate(45deg) translate(-8px, -8px) ;
}
/* NAV */

nav#responsive[role=responsive] {
  display: block;

}

nav#responsive[role=responsive]  {
  position: fixed;
  top: 0;
  bottom: 0;
  overflow-y: scroll;
  width: 280px;
  padding-top: 50px;
  margin-left: -280px;
  background-color: #333333;
  z-index: 100;

  font-family: GothamBook;
}

ul#responsive-nav-ul li {
  padding-left: 10px;
  color: #cccccc;
}

ul#responsive-nav-ul a {
  color: #cccccc;
}

h1.responsive-nav-tab-title {
  padding: 20px;
  border-top: 1px solid #999999;
  text-transform: uppercase;
}

li.responsive-nav-sublink {
  padding: 20px;
  border-top: 1px solid #999999;
  background-color: #525252;
}

li.responsive-nav-sublink a {
  padding-left: 10px;
}

div.responsive-nav-tab-subgroup-wrap {
  display: none;
}
/****************************** END REPEAT FOR ALL MOBILE ******************************/

}

/* Smartphones (landscape) ----------- */
@media only screen and (min-width : 321px) {

}

/* Smartphones (portrait) ----------- */
@media only screen and (max-width : 320px) {

}

/* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
ul#main-nav-ul {
  width: 700px;
}

li.main-nav-tab {
  max-width: 140px;
}

div.main-nav-tab-subgroup-wrap {
  position: absolute;
  top: 48px;
  left: 24px;
  width: 652px;
}

ul.student-services {
  display: none;
}

div.template-hero-image {
  height: auto;
}
}

/* iPads (landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {

div.homepage-highlight {
  width: 250px;
  height: 350px;
}

img#featured-artist-image {
  width: 250px;
  max-height: 250px;
}

div#featured-artist-info {
  width: 200px;
  margin: 0px 25px 0px;
}

div#homepage-video iframe {
  max-width: 250px !important;
  max-height: 200px !important;
}

div.footer-column {
  width: 200px;
}
}

/* iPads (portrait) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
div#logo {
  display: none;
}

div.homepage-highlight {
  position: relative;
  margin: 50px auto;
  display: block;
}
}

/**********
iPad 3
**********/

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 2) {

}

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio : 2) {

}

/* Desktops and laptops ----------- */
@media only screen  and (min-width : 1224px) {

}
/* Large screens ----------- */
@media only screen  and (min-width : 1824px) {

}

/* iPhone 4 ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 2) {

}

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio : 2) {

}

/* iPhone 5 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-height: 568px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2){


}

@media only screen and (min-device-width: 320px) and (max-device-height: 568px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2){

div.latest h1 {
  font-size: 26px;
}

div.homepage-highlight {
  width: 250px;
  height: 350px;
}

img#featured-artist-image {
  width: 250px;
  max-height: 250px;
}

div#featured-artist-info {
  width: 200px;
  height: auto;
  margin: 0px 25px 0px;
}

div#homepage-video iframe {
  width: 250px;
}

/** FACULTY TEMPLATE **/

div.excerpt-image-left,
div.excerpt-image-right {
  display: inline-block;
}

div.read-more {
  float: left;
}

}

/* iPhone 6 ----------- */
@media only screen and (min-device-width: 375px) and (max-device-height: 667px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2){

}

@media only screen and (min-device-width: 375px) and (max-device-height: 667px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2){

}

/* iPhone 6+ ----------- */
@media only screen and (min-device-width: 414px) and (max-device-height: 736px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2){

}

@media only screen and (min-device-width: 414px) and (max-device-height: 736px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2){

}

/* Samsung Galaxy S3 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2){

}

@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2){

}

/* Samsung Galaxy S4 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 3){

}

@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 3){

}

/* Samsung Galaxy S5 ----------- */
@media only screen and (min-device-width: 360px) and (max-device-height: 640px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 3){

}

@media only screen and (min-device-width: 360px) and (max-device-height: 640px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 3){

}

/* Nexus 5X ----------- */
@media only screen and (min-device-width: 412px) and (max-device-height: 732px) and (orientation : landscape) {
/****************************** BEGIN REPEAT FOR ALL MOBILE ******************************/
body, html {
  width: 100%;
  height: 100%;
  padding:0!important;
  margin:0 !important;
}

div#logo,
nav#top-nav,
nav#menu,
div#wpadminbar,
div#new-royalslider-1,
div.template-hero-image,
div#google-map-location,
footer#footer {
  display: none;
}

div#wrapper {
  position: relative;
  width: 100%;
  margin: 0;
  padding: 0;
}

div#responsive-header {
  display: block;
  position: fixed;
  top: 0;
  width: 100%;
  height: 55px;
  background-color: #333333;
  z-index: 100;
}

div#responsive-header img {
  float: right;
  width: 60px;
  margin: 5px;
}

div.latest,
div#container {
  margin-top: 60px;

}

div.homepage-highlight {
  margin-top: 40px;
}

div#general-template-sidebar,
div#general-template-column,
div.general-template-subcontent,
div.general-template-thumb,
div.general-template-banner,
div.faculty-template-sidebar,
div.excerpt-image-right {
  width: auto;
}

div.general-template-banner {
  width: 100%;
  height: 150px;
}

div.general-template-banner h1 {
  width: 100%;
  text-align: center;
}

div.general-template-thumb img {
  width: 250px;
  height: auto;
}

div.general-template-subcontent {
  margin: 0;
  padding: 5px;

}

div.entry {
  margin-top: 40px;
  padding: 10px;
}

div.catalogue-bar {
  width: auto;
}

div.catalogue-bar-middle,
div.catalogue-bar-item,
div.catalogue-bar-quote,
div.catalogue-bar-learn-more,
div.view-catalogue {
  display: none;
}

div.faculty-template-sidebar {
  margin: 0;
  padding: 0;
}

div.faculty-template-sidebar img {
  width: 250px !important;

}

footer#footer {
  height: auto;
  margin-bottom: 0;
}

div#copyright {
  height: 150px;

}

p.right {
  float: left;
}

/** NEWS LIST TEMPLATE **/

article.excerpt {
  padding: 20px;
}

article.excerpt img {
  max-width: 300px !important;
}

/** FACULTY TEMPLATE **/

div.excerpt-image-left,
div.excerpt-image-right {
  display: inline-block;
}

div.excerpt-image-left {
  margin-bottom: 20px;
}

div#responsive-general-column-button {
  position: relative;
  float: left;
  margin: 20px auto;
  width: 100%;
}

div.read-more {

}

.more-button {
  margin-top: 0;
  margin-bottom: 50px;
}

/* RESPONSIVE NAV BUTTON */

div#responsive-nav-button {
  position: fixed;
  top: 5px;
  left: 5px;
  z-index: 200;
  cursor: pointer;
}

.container {
  display: inline-block;
  cursor: pointer;

}

.bar1, .bar2, .bar3 {
  width: 35px;
  height: 5px;
  background-color: #cccccc;
  margin: 6px 0;
  transition: 0.4s;
}

/* Rotate first bar */
.change .bar1 {
  -webkit-transform: rotate(-45deg) translate(-9px, 6px) ;
  transform: rotate(-45deg) translate(-9px, 6px) ;
  -ms-transform: rotate(-45deg) translate(-9px, 6px) ;
  -moz-transform: rotate(-45deg) translate(-9px, 6px) ;
  -o-transform: rotate(-45deg) translate(-9px, 6px) ;

}

/* Fade out the second bar */
.change .bar2 {
  opacity: 0;
}

/* Rotate last bar */
.change .bar3 {
  -webkit-transform:  rotate(45deg) translate(-8px, -8px) ;
  transform:  rotate(45deg) translate(-8px, -8px) ;
  -ms-transform:  rotate(45deg) translate(-8px, -8px) ;
  -moz-transform:  rotate(45deg) translate(-8px, -8px) ;
  -o-transform:  rotate(45deg) translate(-8px, -8px) ;
}
/* NAV */

nav#responsive[role=responsive] {
  display: block;

}

nav#responsive[role=responsive]  {
  position: fixed;
  top: 0;
  bottom: 0;
  overflow-y: scroll;
  width: 280px;
  padding-top: 50px;
  margin-left: -280px;
  background-color: #333333;
  z-index: 100;

  font-family: GothamBook;
}

ul#responsive-nav-ul li {
  padding-left: 10px;
  color: #cccccc;
}

ul#responsive-nav-ul a {
  color: #cccccc;
}

h1.responsive-nav-tab-title {
  padding: 20px;
  border-top: 1px solid #999999;
  text-transform: uppercase;
}

li.responsive-nav-sublink {
  padding: 20px;
  border-top: 1px solid #999999;
  background-color: #525252;
}

li.responsive-nav-sublink a {
  padding-left: 10px;
}

div.responsive-nav-tab-subgroup-wrap {
  display: none;
}
/****************************** END REPEAT FOR ALL MOBILE ******************************/
}

@media only screen and (min-device-width: 412px) and (max-device-height: 732px) and (orientation : portrait) {
div.homepage-highlight {
  margin-top: 40px;
}
}

/* Nexus 6P ----------- */
@media only screen and (min-device-width: 412px) and (max-device-height: 732px) and (orientation : landscape) {

}

/* Nexus 6P ----------- */
@media only screen and (min-device-width: 412px) and (max-device-height: 732px) and (orientation : portrait) {

}