/***   CUSTOM FONTS   ***/
@font-face {
  font-family: 'Aaargh-webfont';
  src: url('../fonts/Aaargh-webfont.eot'); /* IE9 Compat Modes */
  src: url('../fonts/Aaargh-webfont.eot?#iefix') format('embedded-opentype');
  src: url('../fonts/Aaargh-webfont.woff') format('woff'), 
  		 url('../fonts/Aaargh-webfont.woff2') format('woff2'),
  		 url('../fonts/Aaargh-webfont.ttf')  format('truetype'),
  		 url('../fonts/Aaargh-webfont.svg#svgFontName') format('svg');
  font-weight: 200;
  font-style: normal;
}/* Pretty Modern Browsers, Super Modern Browsers, Safari and Android and iOS, Legacy iOS */

/***   GENERAL   ***/
body {
	width:        100%;
  height:       100%;
	background:   #232937;
	font-family: 'Aaargh-webfont', 'Helvetica Neue', sans-serif;
  font-weight:  200;
	color:        #f9f9d7;
	line-height:  1.5em;
}

a {
	color: #43ccde;
  text-decoration: none;
}
a:hover,
a:focus {
	text-decoration: underline;
	color:           #f9f9d7;
}

/***   BACK TO TOP LINK   ***/
.top-link {
  margin-bottom: 30px;
}

.top-link a {
  position:      relative;
  padding-right: 25px;
  font-size:     1.2em;
}
.top-link a:after,
.top-link a .ie-after {
  content:    " ";
  display:    block;
  position:   absolute;
  top:        5px;
  right:      0;
  width:      15px;
  height:     15px;
  background: url("../images/siteview/arrow-top.png") no-repeat 0 0;
}
.top-link a:hover::after,
.top-link a:focus::after,
.top-link a:hover .ie-after,
.top-link a:focus .ie-after {
  background-position: 0 -20px;
}

p {
  margin:      20px 0;
  line-height: 1.7em;
}

.home main p.copy-para,
main p.copy-para {
  margin:     3px 0;
  padding:    0 0 0 5px;
  font-size:  0.85em;
  text-align: left;
  color:      #A5A7AA;
}

h1,
.home-title {
	font-variant: small-caps;
	text-align:   center;
	line-height:  1.2em;
}

h2, h3, h4 {
	margin-bottom: 30px;
  text-align:    center;
}

h4 {	
	font-size: 1.5em;
}

/***   SITE WRAPPERS   ***/
.wrapper, 
footer, 
header {
	width:  960px;
	margin: 0 auto;
}

.wrapper {
	margin-bottom: 30px;
}

/***   HEADER   ***/
.header-wrapper {
	border-bottom: 1px solid #ff6600;
	background:    #1D2330 url("../images/siteview/body-abstract.png") no-repeat center top;
}

h1.logo {
  margin: 0;
}

/***  SIGNATURE LOGO  ***/
.logo a {
	display:    block;
	overflow:   hidden;
	height:     0;
  background: url("../images/siteview/richard-lopez-logo.png") no-repeat;
	font-size:  0em;
}

/***   MAIN TOP NAVIGATION   ***/
header nav li a {
	display:         block;
	text-decoration: none;
	color:           #ff6600;
}
header nav li a:hover,
header nav li a:focus {
  text-decoration: none;
}

header nav li a:hover,
header nav li a:focus,
a.selected,
header nav li ul li a {
	color: #43ccde;
}

header nav li.first a {
	width:       30px;
  height:      31px;
  padding:     0;
  margin-top:  5px;
  font-size:   0em;
  text-indent: -1000px;
  overflow:    hidden;
  background:  url("../images/siteview/home-icon.png") no-repeat 0 0;
}
header nav li.first a:hover,
header nav li.first a:focus,
.home header nav li.first a.selected {
	background-position: 0 -39px;
}

.home header nav li.first a.selected:hover,
.home header nav li.first a.selected:focus {
  background-position: 0 0;
}

/***   FOOTER   ***/
.footer-wrapper {
  padding:    40px 0 10px;
  background: #1D2330;
	border-top: 1px solid #43ccde;
}

footer ul {
  margin-bottom: 30px;
	text-align:    center;
}

footer li {
	display:     inline;
	margin:      0 3.3%;
	line-height: 2.5em;
	white-space: nowrap;
}

footer li a {
	text-transform: uppercase;
	font-weight:    200;
	font-size:      1.2em;
}

.copyright {
	padding:    10px 3.125%;
	text-align: center;
	border-top: 1px solid #f9f9d7;
}

.copyright span,
.copy {
  font-family: "Helvetica Neue", sans-serif;
}

footer h3 {
  display: none;
}

/***    MAIN AREA    ***/
section {
	margin:        30px 0 40px;
  padding-right: 3%;
}

article {
  margin: 30px 0;
}

/***  GALLERY NAV ART LINKS  ***/
.gallery-nav {
  margin-bottom: 30px;
}

.gallery-nav h2 {
	margin-bottom: 10px;
	text-align:    center;
}

.gallery-nav a {
	text-decoration: none;
}
.gallery-nav a:hover,
.gallery-nav a:focus {
	text-decoration: underline;
}

.gallery-nav a img:hover,
.gallery-nav a img:hover {
	opacity: 0.6;
}

/***   TABLE   ***/
th,
td {
  background: #1D2330;
  border:     1px dotted #43ccde;
}

/***  MAJOR ART GALLERY ON GALLERY PAGES  ***/
.major-gallery figure {
  margin-bottom: 30px;
  border-bottom: 1px solid #f9f9d7;
  background:    #1D2330;
}

.major-gallery figcaption {
  padding: 10px 1em;
  color:   #f9f9d7;
}

.major-gallery figcaption h2 {
  margin:      10px 0;
  font-size:   1.5em;
  line-height: 1.2;
  text-align:  left;
}

.major-gallery figcaption p {
  margin:      10px 0;
  font-size:   1.1em;
  line-height: 1.2;
}

span.sold,
span.price {
  float:          right;
  margin-top:     15px;
  color:          #ff6600;
  text-transform: uppercase;
}

span.price {
  color: #f9f9d7;
}

/***  HOME SPECIFIC  ***/
.home .pic {
  margin-bottom: 7px;
}

.home figure,
.artist figure {
  margin-bottom: 40px;
}

.home figcaption {
  margin-left: 7px;
}

.home main p {
  padding:    0 10%;
  text-align: center;
}

/***  ARTIST SPECIFIC  ***/
.artist figure {
  float:  right;
  margin: 4px 3% 0 60px;
}

.artist .pic {
  margin-bottom: 7px;
}

/***   CONTACT   ***/
.contact .intro-para {
  margin-bottom: 40px;
}

/***   GENERAL LIST STYLES + SECTION DETAIL ON PHOTOGRAPHY   ***/
.section-detail ul {
  list-style-type: square;
  padding-left:    25px;
  font-size:       1.2em;
  line-height:     1.5em;
}

.section-detail.links ul {
  color: #43ccde;
}

/***   CONTACT   ***/
.contact span.mobile {
  color:     #43ccde;
  font-size: 1.2em;
}

/***********  MEDIA QUERIES ***********/

/**  MOBILE PORTRAIT  **/
@media screen and (min-width: 300px) {
  .header-wrapper {
    margin-bottom: 35px;
  }

	.wrapper, 
	footer, 
	header {
		width: 100%;
	}

	p {
 	 font-size: 1.0em;
	}

  .small-font {
    font-size: 0.8em;
  }

  /***  SIGNATURE LOGO  ***/
  .logo a {
		background-size: 85%;
		width:           100%;
		padding-top:     98px;
		margin:          0 8%;
	}

	h1,
  .home-title {
  	margin:    0 3% 30px;
  	font-size: 2em;
	}

	h2 {
  	font-size: 1.17em;
	}

	main {
		padding: 0 6%;
	}

	header {
		margin-bottom: 0;
		padding-top:   50px;
	}

  /***  MAIN TOP NAVIGATION  ***/
	header nav {
		width:  90%;
		margin: 0 auto;
	}

	header nav li {
		float:       none;
		padding:     0 3%;
		border-top:  1px dotted #ff6600;
		font-size:   1.2em;
  	line-height: 2.4em;
	}
	header nav li.first {
		border: none;
	}

	header nav li ul {
		display: none;
	}

  /***   GALLERY NAV ART LINKS  ***/
	.gallery-nav li {
		width:         100%;
		margin-right:  0;
    margin-bottom: 30px;
	}

  /***  MAJOR ART GALLERY ON CATEGORIES PAGES ***/

  .major-gallery figcaption h2 {
    font-size: 1.2em;
  }

  .major-gallery figure.full-width {
    width: 100%;
  }

  /***   SECTION DETAIL ON PHOTOGRAPHY   ***/
  .section-detail.speciality ul {
    padding-left: 0;
  }

  .section-detail.speciality ul li {
    display:       block;
    padding:       8px 0 5px 25px;
    border-right:  none;
    border-left:   none;
    border-bottom: 1px dotted #43ccde;
  }

  /***  ARTIST SPECIFIC  ***/
  .artist figure {
    float: none;
    margin: 0;
  }

  /***   TABLE   ***/
  th,
  td {
    padding: 5px;
  }

  td {
    font-size: 0.75em;
  }

  td ul li {
    margin-bottom: 10px;
  }
}

/***   MOBILE LANDSCAPE:  30.0625em   ***/
@media screen and (min-width: 481px) {
  /***   SIGNATURE LOGO   ***/
  .logo a {
		margin:          0 15%;
		background-size: 74%;
	}

  /***   GALLERY NAV ART LINKS  ***/
  .gallery-nav li {
    width:        47%;
    min-height:   210px;
    float:        left;
    margin-right: 3%;
  }

  .gallery-nav li {
    margin-bottom: 0;
  }

  .fine-art .gallery-nav li,
  .home .gallery-nav li {
    min-height: 260px;
  }

  .fine-art .gallery-nav li.medium-width {
    width: 96%;
  }
}

/***   GALLERY NAV ART LINKS   ***/
@media screen and (min-width: 500px) {
  .fine-art .gallery-nav li,
  .home .gallery-nav li {
    min-height: 290px;
  }

  /***   BACK TO TOP LINK   ***/
  .illusion .top-link {
    display: none;
  }
}

/***   GALLERY NAV ART LINKS   ***/
@media screen and (min-width: 603px) {
	.gallery-nav li {
    width:      45%;
    min-height: 230px;
   }

  .fine-art .gallery-nav li,
  .home .gallery-nav li {
    min-height: 310px;
  }

  .fine-art .gallery-nav li.medium-width {
    width: 93%;
  }

/***  MAJOR ART GALLERY ON CATEGORIES PAGES ***/
  .major-gallery figure {
    width:        47%;
    /*min-height:   368px;*/
    float:        left;
    margin-right: 3%;
  }

  .major-gallery figure.full-width {
    width: 97%;
  }

  /***  ARTIST SPECIFIC  ***/
  .artist figure {
    display: block;
    float:   right;
    margin:  4px 3% 20px 60px;
  }

  /***   TABLE   ***/
  th,
  td {
    padding: 10px;
  }

  td {
    font-size: 0.9em;
  }

  /***   TABLE   ***/

}

/***   629px BREAK POINT   ***/
@media screen and (min-width: 629px) {
	.gallery-nav li {
    width: 44%;
   }

  /***   TABLE   ***/
  td {
    font-size: 1em;
  }
}

/***   ~ TABLET  ***/
@media screen and (min-width: 641px) {
  .header-wrapper {
    margin-bottom: 65px;
  }

	p {
		font-size: 1.2em;
	}

  .small-font {
    font-size: 0.9em;
  }

	h1,
  .home-title {
		font-size: 3em;
	}

	h2 {
    font-size: 1.34em;
	}

  /***   SIGNATURE LOGO  ***/
  h2.logo {
    margin: 0;
  }

  .logo a {
    background-size: 84%;
    padding-top:     188px;
    margin:          0 10%;
  }

  /***   MAIN AREA  ***/
	main {
 		padding: 0 3.125%;
	}

  /***   GALLERY NAV ART LINKS   ***/
	.gallery-nav li {
		width:      47%;
		min-height: 250px;
		float:      left;
	}

  .fine-art .gallery-nav li,
  .home .gallery-nav li {
    min-height: 380px;
  }

  .fine-art .gallery-nav li.medium-width {
    width: 96.5%;
  }
}

/***   684px BREAK POINT   ***/
@media screen and (min-width: 684px) {
  /***   GALLERY NAV ART LINKS   ***/
  .gallery-nav  li {
    min-height: 270px;
  }
}

/***   730px BREAK POINT   ***/
@media screen and (min-width: 730px) {
  /***   GALLERY NAV ART LINKS   ***/
	.gallery-nav  li {
		min-height: 290px;
		width:      46%;
	}

  .fine-art .gallery-nav li,
  .home .gallery-nav li {
    min-height: 400px;
  }

  .fine-art .gallery-nav li.medium-width {
    width: 95%;
  }

  /***  MAJOR ART GALLERY ON CATEGORIES PAGES ***/
  .major-gallery figcaption h2 {
    font-size: 1.5em;
  }
}

/***   790px BREAK POINT   ***/
@media screen and (min-width: 790px) {
  /***   GALLERY NAV ART LINKS   ***/
  .fine-art .gallery-nav li,
  .home .gallery-nav li {
    min-height: 410px;
  }
}


/***   828px BREAK POINT FOR TOP NAV AND FEW MORE   ***/
@media screen and (min-width: 828px) {
	header {
		margin:      0px auto 34px;
  	padding-top: 60px;
	}

	h2 {
		font-size: 1.34em;
	}

  /***    MAIN TOP NAVIGATION    ***/
	header nav {
		width: 95%;
	}

	header nav li {
		float:       left;
		position:    relative;
		padding:     0 2.5% 0 0;
    border-top:  none;
    font-size:   1.3em;
  	line-height: 2.6em;
	}
	header nav li.last {
	padding-right: 0;
}

	/***    NESTED SUBNAV   ***/
	header nav li:hover ul,
  header nav li:focus ul {
		display:       block;
	  width:         805px;
	  padding:       10px 1.12% 0 6.7%;
	  position:      absolute;
	  top:           50px;
		left:          -18px;
		border-bottom: 1px solid #43ccde;
	}

	header nav li:hover ul.photo-nested-nav,
  header nav li:focus ul.photo-nested-nav {
		left: -125px;
	}

  header nav li ul li {
    float:         left;
    display:       block;
    padding-right: 3.16%;
    font-size:     0.75em;
    line-height:   0.6em;
  }
  header nav li ul li a:hover,
  header nav li ul li a:focus {
    color: #f9f9d7;
  }

  /***   GALLERY NAV ART LINKS   ***/
	.gallery-nav li {
		width:      30%;
    min-height: 250px;
	}

  .fine-art .gallery-nav li,
  .home .gallery-nav li {
    min-height: 310px;
  }

  .fine-art .gallery-nav li.medium-width {
    width: 63%;
  }

  /***   SECTION DETAIL ON PHOTOGRAPHY   ***/
  .section-detail.speciality ul li {
    display:       inline-block;
    padding:       2px 1.7%;
    border-bottom: none;
    border-right:  1px dotted #43ccde;
  }

  .section-detail.speciality ul li:first-child {
    border-left: 1px solid #43ccde;
  }

  /***   BACK TO TOP LINK   ***/
  .artist .top-link,
  .events .top-link {
    display: none;
  }
}

/***  858px BREAK POINT FOR THE MAIN TOP NAV AND FEW MORE   ***/
@media screen and (min-width: 858px) {
	header nav li {
		padding-right: 4.5%;
    font-size:     1.3em;
	}

	header nav li:hover ul,
  header nav li:focus ul {
	  width: 870px;
	}

  /***   GALLERY NAV ART LINKS   ***/
  .fine-art .gallery-nav li,
  .home .gallery-nav li {
    min-height: 340px;
  }

  /***   SECTION DETAIL ON PHOTOGRAPHY   ***/
  .section-detail.speciality ul li {
    padding: 2px 2.1%;
  }
}

 /***    DESKTOP   ***/
@media screen and (min-width: 960px) {
  .header-wrapper {
    margin-bottom: 70px;
  }

	.wrapper, 
	footer, 
	header {
		width: 960px;
	}

	h1,
  .home-title {
		margin-bottom: 35px;
	}

  h2 {
    font-size: 1.55em;
  }

  /***    MAIN TOP NAVIGATION    ***/
	header nav {
		width: 100%;
	}

	header nav li {
		font-size:   1.5em;
  	line-height: 2.2em;
	}
	header nav li:hover ul,
  header nav li:focus ul {
		left: -5px;
	}

  /***   GALLERY NAV ART LINKS   ***/
	.gallery-nav li {
		width:      30.3%;
    min-height: 260px;
	}

  .fine-art .gallery-nav li,
  .home .gallery-nav li {
    min-height: 350px;
  }

  /***   HOMEPAGE MAIN ART PIECE   ***/
  .home .pic {
    width:     874px;
    max-width: 874px;
  }

  /***   SECTION DETAIL ON PHOTOGRAPHY   ***/
  .section-detail.speciality ul li {
    padding: 2px 2.8%;
  }
}