/* ==================================================== */
/* CSS FOR ART & 3D PAGES: */
/* ==================================================== */

* {
-ms-box-sizing:border-box;
-moz-box-sizing:border-box;
-webkit-box-sizing:border-box;
-o-box-sizing:border-box;
box-sizing: border-box;
}

/* DEFAULT PAGE LINK COLORS: */
a { text-decoration:none; }
a:link { color:#770000; }
a:visited { color:#90c; }
a:hover { color:#f90; }
a:active { color:#f00; }

body { 
margin:0px; 
background-color:#faf4de; 
height:100%;
font-family: 'Merriweather', 'Clarendon', serif; 
font-weight:300; 
font-size:18px;
line-height:22px;
}

/* ==================================================== */
/* CONTAINER DIV: */
/* ==================================================== */

#container_div {
border:0px solid green;
position:relative;
width:100%;
min-width:300px;
height:100%;
margin:0px;
-ms-transition-duration:0.4s;
-moz-transition-duration:0.4s;
-webkit-transition-duration:0.4s;
-o-transition-duration:0.4s;
transition-duration:0.4s;
}

/* ==================================================== */
/* IMAGE GRID CONTAINER: */
/* ==================================================== */

#img_grid_container {
border:0px solid slateblue;
width:100%;
max-width:1600px;
overflow:hidden;
text-align:center;
margin:auto;
display:block;
padding-top:110px;
padding-bottom:30px;
}

/* ==================================================== */
/* ART INDEX PAGE ITEMS: */
/* ==================================================== */

#art_index_headline {
border:0px solid DeepPink;
width:100%;
height:30px;
margin-top:40px;
margin-bottom:-8px;
font-family: 'Merriweather', 'Clarendon', serif; 
font-weight: 300; 
font-size: 28px;
line-height:30px;
color:#595959;
text-align:center;
letter-spacing:0px;
  overflow:visible;
  animation-name:contract_big;
  animation-duration:1s;
  animation-delay:1.5s;
  animation-fill-mode:both;
}

@keyframes contract_big {
0% {opacity:0.0; letter-spacing:35px;}
100% {opacity:1.0; letter-spacing:0px;}
}

@keyframes contract_medium {
0% {opacity:0.0; letter-spacing:22px;}
100% {opacity:1.0; letter-spacing:0px;}
}

@keyframes contract_small {
0% {opacity:0.0; letter-spacing:11px;}
100% {opacity:1.0; letter-spacing:0px;}
}

#art_index_text_block_one {
border:0px solid limegreen;
width:100%;
max-width:1300px;
overflow:visible;
padding-top:0px;
padding-left:0px;
padding-right:0px;
text-align:center;
margin:auto;
}

.art_index_image_group_square {
border:0px solid purple;
width:400px;
background-color:white;
display: inline-block;
margin-top:10px;
margin-left:10px;
margin-right:10px;
margin-bottom:10px;
-ms-box-shadow: 0px 5px 12px 5px #888888;
-moz-box-shadow: 0px 5px 12px 5px #888888;
-webkit-box-shadow: 0px 5px 12px 5px #888888;
-o-box-shadow: 0px 5px 12px 5px #888888;
box-shadow: 0px 5px 12px 5px #888888;
}

.art_index_image_box_square {
border:0px solid orange;
width:100%;
}

.art_index_img_thumb_square {
border:0px solid red;
width:100%;
}

.art_index_body_text {
font-family: 'Merriweather', 'Clarendon', serif; 
font-weight: 300; 
font-size: 18px;
line-height:22px;
color:#595959;
}

.art_index_image_info {
border:0px solid green;
text-align:center;
padding-left:10px;
padding-right:10px;
padding-bottom:0px;
}

/* ==================================================== */
/* ART FEATURE PAGES ITEMS: */
/* ==================================================== */

.art_feature_page_image_group {
border:0px solid purple;
width:600px;
background-color:white;
display: inline-block;
-ms-box-shadow: 0px 5px 12px 5px #888888;
-moz-box-shadow: 0px 5px 12px 5px #888888;
-webkit-box-shadow: 0px 5px 12px 5px #888888;
-o-box-shadow: 0px 5px 12px 5px #888888;
box-shadow: 0px 5px 12px 5px #888888;
}

.art_feature_page_image_box {
border:0px solid violet;
width:100%;
height:auto;
}

.art_feature_page_feature_image {
width:100%;
}

#art_feature_page_prev_next_arrows_container {
border:0px solid red;
position:absolute;
z-index:2;
top:490px;
height:82px;
width:600px;
padding-left:11px;
padding-right:10px;
}

#left_arrow {
display:block;
float:left;
width:30px;
opacity:0.2;
}

#right_arrow {
display:block;
float:right;
width:30px;
opacity:0.2;
}

#art_feature_pages_text_block_one {
border:0px solid limegreen;
width:100%;
max-width:1300px;
text-align:center;
padding-top:10px;
margin:auto;
}

.art_feature_pages_headline {
font-family:'Merriweather', 'Clarendon', serif; 
font-weight:300; 
font-size:28px;
line-height:38px;
margin-bottom:0px;
color:#595959;
text-align:center;
}

.art_feature_pages_body_text {
font-family:'Merriweather', 'Clarendon', serif;
font-weight:300; 
font-size:18px;
line-height:28px;
margin-top:0px;
color:#595959;
text-align:center;
}

.art_feature_pages_body_text_small {
font-family: 'Merriweather', 'Clarendon', serif; 
font-weight: 300; 
font-size: 15px;
line-height:22px;
text-align:center;
color:#595959;
}

.art_feature_pages_image_info {
border:0px solid DodgerBlue;
text-align:center;
padding-left:20px;
padding-right:20px;
padding-bottom:10px;
}

/* ==================================================== */
/* TOP BANNER: */
/* ==================================================== */

#top_banner {
position: fixed; 
text-align:center;
left:0px;
top:0px;
width:100%;
min-width:0px;
height:80px;
background-color: #5b1a1e;
background: -ms-linear-gradient(#4e0101, #5b1a1e, #4e0101);
background: -webkit-linear-gradient(#4e0101, #5b1a1e, #4e0101);
background: -o-linear-gradient(#4e0101, #5b1a1e, #4e0101);
background: -moz-linear-gradient(#4e0101, #5b1a1e, #4e0101);
background: linear-gradient(#4e0101, #5b1a1e, #4e0101);
-ms-box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.5);
-webkit-box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.5);
-o-box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.5);
box-shadow: -0px 5px 5px rgba(0, 0, 0, 0.5);
z-index:100;
display:block;
}

#dg_logo {
width:80px;
padding-top:12.5px;
padding-bottom:5px;
margin-right:5px;
}

#dg_name {
width:375px;
padding-bottom:13px;
}

#up_down_arrow {
position:fixed;
left:25px;
top:28px;
width:80px;
cursor:pointer;
z-index:205;
}

/* ==================================================== */
/* TOP LINKS PANEL: */
/* ==================================================== */

#top_links_panel { 
position:fixed;
left:0px;
top:80px;
height:34px;
width:100%;
min-width:250px;
background-color:#af7804;
padding-top:4px;

text-align:center;
font-family: 'Open Sans', 'Verdana Bold', sans-serif;
font-weight: 700; 
font-size: 18px;
line-height: 26px;
color:#ffffff;

-ms-box-shadow: 0px 15px 15px rgba(0, 0, 0, 0.7);
-moz-box-shadow: 0px 15px 15px rgba(0, 0, 0, 0.7);
-webkit-box-shadow: 0px 15px 15px rgba(0, 0, 0, 0.7);
-o-box-shadow: 0px 15px 15px rgba(0, 0, 0, 0.7);
box-shadow: -0px 15px 15px rgba(0, 0, 0, 0.7);
-ms-transition-duration:0.4s;
-moz-transition-duration:0.4s;
-webkit-transition-duration:0.4s;
-o-transition-duration:0.4s;
transition-duration:0.4s;
display:block;
z-index:90;
}

a.top_links_colors:link { color:#ffff00; }
a.top_links_colors:visited { color:#ffcc00; }
a.top_links_colors:hover { color:#ffffff; }
a.top_links_colors:active { color:#ffff00; }

/* ==================================================== */
/* TEXT ITEMS: */
/* ==================================================== */

#text_block_two {
width:600px;
overflow:hidden;
text-align:center;
margin:auto;
padding-left:30px;
padding-right:30px;
}

#footer_links_container {
border:0px solid red;
display:block;
width:100%;
min-width:0px;
overflow:hidden;
left:0px;
top:0px;
text-align:center;
margin-top:0px;
padding-top:30px;
padding-bottom:0px;
background-color:#e3ad6a;
}

.footer_links {
display:block;
text-align:center;
padding-left:0px;
padding-right:0px;
font-size:18px;
line-height:38px;
}

.copyright_text {
display:block;
text-align:center;
padding-left:0px;
padding-right:0px;
font-size:16px;
line-height:30px;
}

/* flc = footer link colors */
a.flc:link { text-decoration:none; color:#a00000; }
a.flc:visited { text-decoration:none; color:#bf00a0; }
a.flc:hover { text-decoration:none; color:#ffffff; }
a.flc:active { text-decoration:none; color:#ffff00; }


/* ==================================================== */
/* FEEDBACK WINDOW:*/
/* ==================================================== */

#feedback_window {
position:fixed;
display:none; /* Hidden by default */
width:50%;
height:50%;
top:25%;
left:25%;
text-align:center;
padding:20px 20px;
background-color:rgba(255,255,0,0.9); /* Black background with opacity */
z-index:50; /* Specify a stack order */
cursor:pointer; /* Add a pointer on hover */
}

/* ==================================================== */
/* MEDIA QUERIES: */
/* ==================================================== */

@media screen and (max-width:1100px)
{
	#top_banner { height:80px; }
	#dg_name { width:375px; }
	#dg_logo { width:80px; }
	#up_down_arrow { top:28px; }
}

@media screen and (max-width:900px)
{
	#top_banner { height:65px; }
	#dg_name { width:325px; padding-top:16px; }
	#dg_logo { width:65px; padding-top:0px; padding-bottom:9px; }
	#up_down_arrow { top:22px; width:75px; }
	#top_links_panel { top:65px; }
	.art_index_body_text { font-size: 16px; line-height:26px; }
}

@media screen and (max-width:844px)
{
	#art_index_text_block_one { width:400px; }
}

@media screen and (max-width:800px)
{
	#up_down_arrow { top:22px; width:70px; }
}

@media screen and (max-width:750px)
{
	.art_feature_page_image_group { width:580px; }
	#art_feature_page_prev_next_arrows_container { top:482px; width:580px; }
}

@media screen and (max-width:700px)
{
	#dg_logo { width:62px; padding-top:0px; padding-bottom:9px; margin-left: 30px; }
}

@media screen and (max-width:670px)
{
	#art_index_headline { animation-name:contract_medium; }
}

@media screen and (max-width:650px)
{
	.art_feature_page_image_group { width:480px; }
	#art_feature_page_prev_next_arrows_container { top:438px; width:480px; }
}

@media screen and (max-width:625px)
{
	#dg_name { width:300px; padding-top:18px; }
	#dg_logo { width:60px; padding-top:0px; padding-bottom:9px; margin-left: 50px; }
}

@media screen and (max-width:550px)
{
	#dg_name { width:275px; padding-top:18px; }
	#dg_logo { width:57px; padding-bottom:8px; margin-left:60px; }
	.art_feature_page_image_group { width:440px; }
	#art_feature_page_prev_next_arrows_container { top:420px; width:440px; }
}

@media screen and (max-width:525px)
{
	#top_links_panel { height:62px; }
	#dg_logo { padding-bottom:8px; margin-left:80px; }
}

@media screen and (max-width:500px)
{
	#dg_name { width:270px; padding-top:20px; }
	#dg_logo { margin-left:90px; }
	#art_index_headline { animation-name:contract_small; }
	.art_feature_page_image_group { width:400px; }
	#art_feature_page_prev_next_arrows_container { top:402px; width:400px; }
}

@media screen and (max-width:480px)
{
	#dg_name { width:270px; margin-left:80px; }
	#dg_logo { display:none;; }
}

@media screen and (max-width:450px)
{
	#dg_name { width:270px; padding-top:20px; margin-left: 85px; }
	.art_index_image_group_square { width:90%; }
	#art_index_text_block_one { width:90%; }
	.art_feature_page_image_group { width:360px; }
	#art_feature_page_prev_next_arrows_container { top:384px; width:360px; }
}

@media screen and (max-width:400px)
{
	#up_down_arrow { width:60px; top:24px; left:16px; }
	#dg_name { width:250px; padding-top:20px; margin-left: 80px; }
	.art_feature_page_image_group { width:310px; }
	#art_feature_page_prev_next_arrows_container { top:362px; width:310px; }
}

@media screen and (max-width:360px)
{
	#up_down_arrow { top:24px; width:55px; left:16px; }
	#dg_name { width:225px; padding-top:22px; margin-left: 70px; }
}

@media screen and (max-width:350px)
{
	#art_index_headline { animation-name:none; }
	.art_feature_page_image_group { width:290px; }
	#art_feature_page_prev_next_arrows_container { top:353px; width:290px; }
}

