html { color: #444; font-size: 1em; line-height: 1.5; }
::-moz-selection { background: #b3d4fc; text-shadow: none; border:none; }
::selection { background: #b3d4fc; text-shadow: none;  border:none; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; clear:both; }
audio, canvas, iframe, img, svg, video { vertical-align: middle; }
fieldset { border: 0; margin: 0; padding: 0; }
textarea { resize: vertical; }
.browserupgrade { margin: 0.2em 0; background: #ccc; color: #000; padding: 0.2em 0; }

body { font-family: Helvetica, Arial, sans-serif; color:#444; font-size:14px; }

a:link      { text-decoration:underline; color: #000; }
a:hover  { text-decoration:underline;  color: blue; }
a:visited { text-decoration:none; color: #444;  }
a:active  { text-decoration:none;  color: green; }

.header a { text-decoration:none; }

a span { color:#999; font-weight:lighter; }

h1, h2, h3, h4, h5, h6 { font-weight: normal; margin:0; padding:0; }

h1 { font-size:22px;  color: #fff; font-weight:bold; }
.hero-content h1 { text-shadow: 0px 2px 2px rgba(0, 0, 0, 0.6);  }
.main-copy h1 {   color:#444; }
.col-left h1 {  color:#444; margin-bottom:10px; }
.tile-info h1 { margin:5px 10px 0 10px; line-height:1.3em; }
.result .work-info h1 { font-size:18px;  margin:5px 10px 0 10px; line-height:1.4em;  color: #444;  }
.half-page h1 {  color:#444; }
.page-content h1 {   color: #444;   }
.result-news h1 { font-size:16px; }

h2 { font-size:32px; } /* Page Title Only */
.hero-content h2 { position: absolute; top: 10px; left: 10px;  color: #fff; text-shadow: 0px 2px 2px rgba(0, 0, 0, 0.6); z-index:1000; }
.page-content h2 {   color: #444; margin-bottom:10px; margin-top:-20px;  }

h3 { font-size:15px;  color: #fff; }
.hero-content h3 {   color: #fff; text-shadow: 0px 2px 2px rgba(0, 0, 0, 0.6); }
.main-copy .work-info h3 {   color:#444; }
.news-item h3 { color:#444; font-size:18px; font-weight:bold;  }
.tile-info h3 { margin:0 10px; }
.result .work-info h3 { margin:0 10px;  color: #444;  }
.page-content h3 {  color: #444;  }

h4 { font-size:18px; color:#fff;  padding:5px 10px; margin:0; 
background: #bb0000; 
background: linear-gradient(top, #dd0101 0%, #bb0000 100%); 
background: -moz-linear-gradient(top, #dd0101 0%, #bb0000 100%); 
background: -webkit-linear-gradient(top, #dd0101 0%, #bb0000 100%); }

h5 { font-size:20px; } /* Titles in Footer Only */

h6 { font-size:20px;  color: #fff; }
.home-hero h6 { text-align:center; position:absolute; bottom:0; left:0; width:100%; background-color: rgba(0,0,0,0.3); padding:10px 0; }
.home-hero h6:hover {  background-color: rgba(0,0,0,0.6); }

.page-content .main-copy .tile-info h1,
.page-content .main-copy .tile-info h2,
.page-content .main-copy .tile-info h3 { color:#444; }

.in-black h1,
.in-black h3 { color:#444 !important;  text-shadow: 0px 2px 2px rgba(255, 255, 255, 8);  }

.h-rule { width:100%; display:block; background-color:#ccc; border:1px solid red; margin:30px 0 0 0; padding:0; clear:both; }

p { padding:2px 0; margin:10px 0;  }
ul, li { margin:0; padding:0; }

.result-news p { padding: 0 10px;}

img { border:none; }
.pad { margin:0; padding:10px;}

.copy { padding:10px;  float: left; display: inline; }

.more  { text-align:right;  display:block; clear:both;  }
.more p  { padding:0; margin:0; }

.smaller { font-size:13px; }

.frame { float: right; margin: 15px 0 10px 30px; width: 560px; height: 315px; }
.frame-new { float: right; width: 100%; height: available; }
.tube-new { float: right; margin: 15px 0 10px 30px; width: 55%; }

.youtube-video-container { 
  position: relative;
  overflow: hidden;
  width: 100%;
}

.youtube-video-container::after {
  display: block;
  content: "";
  padding-top: 56.25%;
}

.youtube-video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; object-fit:contain;
}

/* TOP NAV */
.nav-wrap { margin: 0; padding:0; height:41px; background: #bb0000; background: linear-gradient(top, #dd0101 0%, #bb0000 100%); 
background: -moz-linear-gradient(top, #dd0101 0%, #bb0000 100%); background: -webkit-linear-gradient(top, #dd0101 0%, #bb0000 100%);  }
.nav { margin: 0 auto; width: 960px;  z-index: 2000; position: relative;  font-size:14px; }
.nav ul ul { display: none; }
.nav ul li:hover > ul { display: block; }
.nav ul {   padding: 0;  list-style: none; position: relative; display: inline-table; }
.nav ul:after { content: ""; clear: both; display: block; }
.nav ul li { float: left; }
.nav ul li:hover { background: #dd0101; background: linear-gradient(top, #bb0000 0%, #dd0101 100%); 
background: -moz-linear-gradient(top, #bb0000 0%, #dd0101 100%); background: -webkit-linear-gradient(top, #bb0000 0%, #dd0101 100%);  }
.nav ul li:hover a { color: #fff; }
.nav ul li a { display: block; padding: 10px 10px; color: #fff; text-decoration: none; }
.nav ul ul { background: #cb0000; border-radius: 0; padding: 0; position: absolute; top: 100%; width: 260px; }
.nav ul ul li { float: none; border-top: 1px solid #fff; position: relative; }
.nav ul ul li a { padding: 6px 10px; color: #fff; width: 240px; }
.nav ul ul li a:hover { background: #777; }
.nav ul ul ul { position: absolute; left: 100%; top: 0; }
.nav .home { background: url(/img/icin-home.png) no-repeat center center; }
.nav .home a:hover { background: url(/img/icin-home.png) no-repeat center center; }
.nav .home a { text-indent: -9999px; width: 10px; }

.nav .instagram { background: url(/img/insta-22.png) no-repeat center center; }
.nav .instagram a:hover { background: url(/img/insta-22.png) no-repeat center center; }
.nav .instagram a { text-indent: -9999px; width: 10px; }
/* TOP NAV */

/* HERO IMAGES */
.monoprints {background:url(/monoprints/bird-standing-on-a-mound/01.jpg) no-repeat center; background-size:cover; }
.home-page {background:url(/bronzes/lady-with-flowers-2017/hero.jpg) no-repeat center; background-size:cover; }
.commissions {background:url(/bronzes/owl-2014/hero.jpg) no-repeat center; background-size:cover; }
.wop {background:url(/drawings/giant-bee-2013/hero.jpg) no-repeat center; background-size:cover; }
.paintings {background:url(/paintings/vroom-vroom-2017/hero.jpg) no-repeat center; background-size:cover; }
.bronzes {background:url(/bronzes/grey-whale-2018/hero.jpg) no-repeat center; background-size:cover; }
.essays {background:url(/assemblages/the-orange-dog-pant-2018/hero.jpg) no-repeat center; background-size:cover; }
.assemblages {background:url(/assemblages/the-happy-dog-2018/hero.jpg) no-repeat center; background-size:cover; }
.etchings {background:url(/etchings/abydos-2014/hero.jpg) no-repeat center; background-size:cover; }
.lithographs {background:url(/lithographs/echidna-with-ant-2017/hero.jpg) no-repeat center; background-size:cover; }
.gouache {background:url(/gouache-and-watercolours/journey-of-the-turtles-2007/hero.jpg) no-repeat center; background-size:cover; }
.relief-prints {background:url(/relief-prints/nagasawa-bird-2000/hero.jpg) no-repeat center; background-size:cover; }
.artists-books {background:url(/artists-books/hero-2.jpg) no-repeat center; background-size:cover; }
.artists-books-prev {background:url(/artists-books/hero.jpg) no-repeat center; background-size:cover; }
.drawing {background:url(/drawings/dog-with-a-bone-ii-2013/hero.jpg) no-repeat center; background-size:cover; }
.studio {background:url(/studio/cheltenham-studio-2018-by-ali-yeldham/hero.jpg) no-repeat center; background-size:cover; }
/* HERO IMAGES */

.header-wrap { margin: 0; padding:0 ; }
.header { margin: 0 auto; padding:5px 10px; width: 940px; }
.hero { width:100%; height:800px;  }
.hero-content { margin:0 auto; padding:0; width: 960px; position:relative; height:800px; position:relative;   }
.hero-content .tile-info {   position: absolute; bottom: 10px; left: 10px; background-color: rgba(0,0,0,0.0);  }
.hero-content .work-info { width: auto; height: auto; z-index: 10; position: absolute; bottom: 10px; left: 10px;  padding: 0; height: 150px; }
.hero-content .top-right { top: 30px; left: 650px; }
.page-content { margin: 20px auto 20px auto; width: 960px; }

.col-left { width:610px; padding:0 20px 10px 10px; margin:0; display:inline; float:left; }
.col-right { width:320px; padding:0; margin:0;   display:inline; float:left; }
.result { width: 460px; min-height: 150px; margin:10px 10px 10px 0;  position: relative; overflow: hidden; display: inline; float: left; }
.result img { width: 160px; height: 160px; border: 1px solid #EBEBEB; float:left; padding:7px; margin-right:10px; margin-bottom:20px;  }
.col-left .result { position: relative;  width: 190px; height: 190px; margin:0 10px 10px 0;  position: relative; overflow: hidden; display: inline; float: left; }
.col-left .result h1 {  position: absolute; left:0; bottom:5px;  }
.col-left .result img { width: 170px; height: 170px; border: 1px solid #EBEBEB; float:left; padding:7px; margin-right:10px; margin-bottom:20px;  }
.result-news { width: 100%; height: auto; margin:15px 0 5px 0;  position: relative; overflow: hidden; display: inline; float: left; }
.result-news img { width: 130px; height: auto; border: 1px solid #EBEBEB; float:left; padding:7px; margin-right:10px;  }
.work-info {  margin:0;  padding: 0;  min-height: 100px; }

.result-news:hover, 
.result:hover {  background-color: #EBEBEB; }
.result-news:active, 
.result:active {  background-color: #CF9; }

.main-image {  width: 960px; height:auto; background:url(/img/loading.gif) no-repeat top 290px left 220px; }
.main-image img {  max-width: 960px; max-height:700px; border:none; }
.main-copy { padding:10px;  }

.news-item { margin-bottom:25px; border-bottom:1px solid #999; }
.news-item img { float:right; width:250px; height:auto; border: 1px solid #EBEBEB; padding:7px; margin:0 0 15px 15px; }
.news-item img:hover { background:#f4f4f4;}

.books img { clear: both; float:right; width:350px; height:auto; border: 1px solid #EBEBEB; padding:7px; margin:0 0 15px 15px; }

.content-item { margin:20px 0 25px 0; }
.content-item-new { margin:0 0 25px 0; }

.bio-year { float: left; width: 60px; display: inline; margin: 5px 0; }
.bio-content { float: left; width: 880px; display: inline; margin: 5px 0;}

.text-cols { -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; } 

.half-page { float:right; display:inline; width:450px; height:auto; margin-top:-50px;  }
.half-page img { width:450px; height:auto; margin-bottom:10px; }

.quater-page { float:left; display:inline; width:220px; height:auto; margin:0 10px;  }
.social-space { display:inline; float:left; width:60px; height:30px; margin: 5px 10px 0 0;  }

.mobile-footer { display:none;  }
.std-footer {  margin: 0 auto; padding:5px 10px 0 0; width: 940px;  }

.new-social-space {  display: inline;  float:right; width:30px; height:30px; margin: 10px 10px 0 0;  }

.thumbnail-w { height:120px; display:inline; float:right; margin-right:-10px;}

a:link .thumb { background-color: #fff; }
a:hover .thumb { background-color: #ccc; }
.thumb { height: 100px; padding: 5px;  margin: 10px 0 0 15px; border: 1px solid #D6D6D6; }
.thumbnail-w ul {	 padding:0; margin:0 0 0 10px;  }
.thumbnail-w li { list-style:none; display: block; height:100px;   float: left; }

.contact_form ul { width: 100%; list-style-type: none; list-style-position: outside; margin: 0px; padding: 0px; }
.contact_form li { padding: 10px 0; position: relative; }
.contact_form li:first-child, .contact_form li:last-child { }
.contact_form label { width: 100%; margin-top: 3px; display: inline-block; float: left; padding: 3px; }
.contact_form input { height: 20px; width: 250px; padding: 5px 8px; }

.message-area { height:150px; }

.contact_form textarea { padding:8px; width:250px; }
.contact_form button { margin-left:0; }

.contact_form input, .contact_form textarea { border: 1px solid #aaa; box-shadow: 0px 0px 3px #ccc, 0 10px 15px #eee inset; border-radius: 2px; padding-right: 30px; -moz-transition: padding .25s; -webkit-transition: padding .25s; -o-transition: padding .25s; transition: padding .25s; }
.contact_form input:focus, .contact_form textarea:focus { background: #fff; border: 1px solid #555; box-shadow: 0 0 3px #aaa; padding-right: 70px; }
 .contact_form input:required, .contact_form textarea:required { background: #fff url(/img/red_asterisk.png) no-repeat 98% center; }
.contact_form input:required:valid, .contact_form textarea:required:valid { background: #fff url(/img/valid.png) no-repeat 98% center; box-shadow: 0 0 5px #5cd053; border-color: #28921f; }
.contact_form input:focus:invalid, .contact_form textarea:focus:invalid { background: #fff url(/img/invalid.png) no-repeat 98% center; box-shadow: 0 0 5px #d45252; border-color: #b03535; }
.form_hint { background: #d45252; border-radius: 3px 3px 3px 3px; color: white; margin-left: 8px; padding: 1px 6px; z-index: 999; /* hints stay above all other elements */ position: absolute; /* allows proper formatting if hint is two lines */ display: none; }
.form_hint::before { content: "\25C0"; color: #d45252; position: absolute; top: 1px; left: -6px; }
.contact_form input:focus + .form_hint { display: inline; }
.contact_form input:required:valid + .form_hint { background: #28921f; }
.contact_form input:required:valid + .form_hint::before { color:#28921f; }
button.submit { background-color: #bb0000; background: linear-gradient(top, #dd0101 0%, #bb0000 100%); background: -moz-linear-gradient(top, #dd0101 0%, #bb0000 100%); background: -webkit-linear-gradient(top, #dd0101 0%, #bb0000 100%); border: 1px solid #bb0000; border-bottom: 1px solid #bb0000; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; box-shadow: inset 0 1px 0 0 #CCC; -webkit-box-shadow: 0 1px 0 0 #CCC inset; -moz-box-shadow: 0 1px 0 0 #CCC inset; -ms-box-shadow: 0 1px 0 0 #CCC inset; -o-box-shadow: 0 1px 0 0 #CCC inset; color: white; font-weight: bold; padding: 6px 20px; text-align: center; text-shadow: 0 -1px 0 #396715; }
button.submit:hover { opacity: .85; cursor: pointer; }
button.submit:active { border: 1px solid #bb0000; box-shadow: 0 0 10px 5px #CCC inset; -webkit-box-shadow: 0 0 10px 5px #CCC inset; -moz-box-shadow: 0 0 10px 5px #CCC inset; -ms-box-shadow: 0 0 10px 5px #CCC inset; -o-box-shadow: 0 0 10px 5px #CCC inset; }

.hidden { display: none !important; }
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
.invisible { visibility: hidden; }
.clearfix:before, .clearfix:after { content: " "; /* 1 */ display: table; /* 2 */ }
.clearfix:after { clear: both; }

@media only screen and (max-width: 768px) {
h1 { font-size:16px; }


.frame { float: right; margin: 15px 0 10px 30px; width: 100%; height: available; }


.tube-new { float: right; margin: 15px 0 10px 30px; width: 100%; }



.page-content h2 { font-size:24px; line-height:1.2em;  margin-top:1px; }
.bio-year { width: 100%; display: block; }
.bio-content { width: 100%; display: block; }
.text-cols {     -webkit-column-count: 1;    -moz-column-count: 1;    column-count: 1; }
.half-page { display:none; }
.header-wrap { border-bottom: 2px solid #bb0000;  width:100%;  padding:0; margin:0;}
.header {  padding:0 0 0 10px; margin:0; width:300px; }
.nav-wrap { display:none; }
.hero { width:100%; height:450px; padding:0; margin:0; }
.hero-content { margin:0; padding:0; position:relative; height:450px; width:100%; }
.page-content { margin: 0 0 20px 0;  padding:0; width: 100%; }


.hero-content .top-right { top: 180px; left: 10px;}


.news-item img { width:100px; height:auto; }
.col-left { width:auto;  padding: 10px 10px 0 10px; margin:0; display:block;  }
.col-right {width:90%;  padding:0 10px; margin:0;  display:block; }
.quater-page { display:block; width:auto; height:auto; margin:10px 10px 0 10px;  }
.main-image {  width: 100%; height:auto;}
.main-image img { width: 100%; height:auto; border:none; }
.result { width: 100%; height: auto; min-height:120px;}
.result img { width: 100px; height: 100px; margin-bottom:10px; }
.result-news { width: 100%; height: auto; }
.result-news img { width: 100px; height: auto;  }
.thumbnail-w  { display:none; }
.std-footer { display:none;  }
.mobile-footer { display:block; margin: 0; padding:0; width: 100%;  }
.mobile-footer-part { width:100%; margin: 0; padding:0; min-height:200px; display:block;}
.mobile-footer a { display:block; text-decoration:none; }
.mobile-footer a:link { color:#fff; }
.mobile-footer a:visited { color:#fff; }
.mobile-footer a:hover { color:#fff; }
.mobile-footer ul { margin: 0; padding:0;  }
.mobile-footer li { margin:0; padding:5px 10px ; height:28px; font-size:16px;  background: #bb0000; background: linear-gradient(top, #dd0101 0%, #bb0000 100%); 
background: -moz-linear-gradient(top, #dd0101 0%, #bb0000 100%); background: -webkit-linear-gradient(top, #dd0101 0%, #bb0000 100%);}
.mobile-footer li:active {	background: #dd0101; background: linear-gradient(top, #bb0000 0%, #dd0101 100%); background: -moz-linear-gradient(top, #bb0000 0%, #dd0101 100%); 	 
background: -webkit-linear-gradient(top, #bb0000 0%, #dd0101 100%);  }
li.nav-sub { text-indent:15px; }
.contact_form input { width:200px; }
.contact_form textarea {  width:200px; }
.contact_form input:focus, .contact_form textarea:focus { padding-right:30px; }
.message-area { height:80px; }
}


@media only screen and (max-width: 320px) {
.col-left .result {  width: 140px;  }
.col-left .result img { width: 120px; height: 120px;  }
}

 @media print,  (-webkit-min-device-pixel-ratio: 1.25),  (min-resolution: 1.25dppx),  (min-resolution: 120dpi) {
/* Style adjustments for high resolution devices */
}



@media print {
*,  *:before,  *:after { background: transparent !important; color: #000 !important;  box-shadow: none !important; text-shadow: none !important; }
a,  a:visited { text-decoration: none; }
.page-content { margin: 0; width: 100%; }
pre,  blockquote { border: none; page-break-inside: avoid; }
thead { display: table-header-group; }
tr,  img { page-break-inside: avoid; }
img { max-width: 100% !important; }
p,  h2,  h3 { orphans: 3; widows: 3; }
h2,  h3 { page-break-after: avoid; }
.nav-wrap, 
.mobile-footer, 
.std-footer { display:none;  }
}
