// fixing problems after removing * from all elements
.ArtsDot-Content-Block *{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin: 0;
  	padding: 0;
}

/*********************    HOME PAGE CSS    *********************/

/******************* Most Famous Artworks Slider *******************/ 

.ArtsDot-Content-Most_Famous_Artworks-Block {

}

.ArtsDot-Content-Most_Famous_Artworks-Slider,
.ArtsDot-Content-Most_Famous_Artworks-Slider:after {
  position: relative;
  width: 99%;
  height: 100%;
  top: 0px;
  left: 0px;
  z-index: 0;
}

.ArtsDot-Content-Most_Famous_Artworks-Slider:after {
  content: '';
  background: transparent;
}

.ArtsDot-Content-Most_Famous_Artworks-Slider {
  overflow: hidden;
  height: 36vW;
  box-shadow: -0.1vW 0vW 0.5vW 0vW rgba(0,0,0,0.5);
  -moz-box-shadow: -0.1vW 0vW 0.5vW 0vW rgba(0,0,0,0.5);
  -webkit-box-shadow: -0.1vW 0vW 0.5vW 0vW rgba(0,0,0,0.5);
  -khtml-box-shadow: -0.1vW 0vW 0.5vW 0vW rgba(0,0,0,0.5);
  margin: 1%;
}

.ArtsDot-Content-Most_Famous_Artworks-Slider li {
  list-style: none;
}

.ArtsDot-Content-Most_Famous_Artworks-Slider li span {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
  color: transparent;
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  opacity: 0;
  z-index: 0;
  -webkit-backface-visibility: hidden;
  -webkit-animation: imageAnimation 70s linear infinite 0s;
  -moz-animation: imageAnimation 70s linear infinite 0s;
  -o-animation: imageAnimation 70s linear infinite 0s;
  -ms-animation: imageAnimation 70s linear infinite 0s;
  animation: imageAnimation 70s linear infinite 0s;
}

.ArtsDot-Content-Most_Famous_Artworks-Slider-Slide {
  z-index: 1000;
  position: relative;
  left: 9vW;
  top: 8vW;
  width: 100%;
  text-align: left;
  opacity: 0;
  -webkit-animation: titleAnimation 70s linear infinite 0s;
  -moz-animation: titleAnimation 70s linear infinite 0s;
  -o-animation: titleAnimation 70s linear infinite 0s;
  -ms-animation: titleAnimation 70s linear infinite 0s;
  animation: titleAnimation 70s linear infinite 0s;
}

/*-- .ArtsDot-Content-Most_Famous_Artworks-Slider:hover span,  <--- Animation Pause on mouseover
.ArtsDot-Content-Most_Famous_Artworks-Slider:hover div {
	-moz-animation-play-state: paused;
	-webkit-animation-play-state: paused;
	-o-animation-play-state: paused;
	animation-play-state: paused;
} --*/

.ArtsDot-Content-Most_Famous_Artworks-Slider li:nth-child(1) span {
  background-image: url('ArtsworksSlider-StarryNight.jpg');
}

.ArtsDot-Content-Most_Famous_Artworks-Slider li:nth-child(2) span {
  background-image: url('ArtsworksSlider-GirlWithAPearlEarring.jpg');
  -webkit-animation-delay: 10s;
  -moz-animation-delay: 10s;
  -o-animation-delay: 10s;
  -ms-animation-delay: 10s;
  animation-delay: 10s;
}

.ArtsDot-Content-Most_Famous_Artworks-Slider li:nth-child(3) span {
  background-image: url('ArtsworksSlider-NightWatch.jpg');
  -webkit-animation-delay: 20s;
  -moz-animation-delay: 20s;
  -o-animation-delay: 20s;
  -ms-animation-delay: 20s;
  animation-delay: 20s;
}

.ArtsDot-Content-Most_Famous_Artworks-Slider li:nth-child(4) span {
  background-image: url('ArtsworksSlider-ThePeraiatenceOfMemory.jpg');
  -webkit-animation-delay: 30s;
  -moz-animation-delay: 30s;
  -o-animation-delay: 30s;
  -ms-animation-delay: 30s;
  animation-delay: 30s;
}

.ArtsDot-Content-Most_Famous_Artworks-Slider li:nth-child(5) span {
  background-image: url('ArtsworksSlider-MonaLisa.jpg');
  -webkit-animation-delay: 40s;
  -moz-animation-delay: 40s;
  -o-animation-delay: 40s;
  -ms-animation-delay: 40s;
  animation-delay: 40s;
}

.ArtsDot-Content-Most_Famous_Artworks-Slider li:nth-child(6) span {
  background-image: url('ArtsworksSlider-TheKiss(Bacio).jpg');
  -webkit-animation-delay: 50s;
  -moz-animation-delay: 50s;
  -o-animation-delay: 50s;
  -ms-animation-delay: 50s;
  animation-delay: 50s;
}

.ArtsDot-Content-Most_Famous_Artworks-Slider li:nth-child(7) span {
  background-image: url('ArtsworksSlider-WaterLilies.jpg');
  -webkit-animation-delay: 60s;
  -moz-animation-delay: 60s;
  -o-animation-delay: 60s;
  -ms-animation-delay: 60s;
  animation-delay: 60s;
}

.ArtsDot-Content-Most_Famous_Artworks-Slider li:nth-child(2) div {
  -webkit-animation-delay: 10s;
  -moz-animation-delay: 10s;
  -o-animation-delay: 10s;
  -ms-animation-delay: 10s;
  animation-delay: 10s;
}

.ArtsDot-Content-Most_Famous_Artworks-Slider li:nth-child(3) div {
  -webkit-animation-delay: 20s;
  -moz-animation-delay: 20s;
  -o-animation-delay: 20s;
  -ms-animation-delay: 20s;
  animation-delay: 20s;
}

.ArtsDot-Content-Most_Famous_Artworks-Slider li:nth-child(4) div {
  -webkit-animation-delay: 30s;
  -moz-animation-delay: 30s;
  -o-animation-delay: 30s;
  -ms-animation-delay: 30s;
  animation-delay: 30s;
}

.ArtsDot-Content-Most_Famous_Artworks-Slider li:nth-child(5) div {
  -webkit-animation-delay: 40s;
  -moz-animation-delay: 40s;
  -o-animation-delay: 40s;
  -ms-animation-delay: 40s;
  animation-delay: 40s;
}

.ArtsDot-Content-Most_Famous_Artworks-Slider li:nth-child(6) div {
  -webkit-animation-delay: 50s;
  -moz-animation-delay: 50s;
  -o-animation-delay: 50s;
  -ms-animation-delay: 50s;
  animation-delay: 50s;
}

.ArtsDot-Content-Most_Famous_Artworks-Slider li:nth-child(7) div {
  -webkit-animation-delay: 60s;
  -moz-animation-delay: 60s;
  -o-animation-delay: 60s;
  -ms-animation-delay: 60s;
  animation-delay: 60s;
}

  /*********** Most Famous Artworks Slider Animation Settings ************/
@-webkit-keyframes imageAnimation {
 
  0% {
    opacity: 0;
    -webkit-animation-timing-function: ease-in;
  }

  5% {
    opacity: 1;
    -webkit-transform: scale(1.1);
    -webkit-animation-timing-function: ease-out;
  }

  17% {
    opacity: 1;
    -webkit-transform: scale(1.2) rotate(3deg);
  }

  20% {
    opacity: 0;
    -webkit-transform: scale(1.2) rotate(3deg);
  }

  100% {
    opacity: 0;
  }
}

@-moz-keyframes imageAnimation {
 
  0% {
    opacity: 0;
    -moz-animation-timing-function: ease-in;
  }

  5% {
    opacity: 1;
    -moz-transform: scale(1.1);
    -moz-animation-timing-function: ease-out;
  }

  17% {
    opacity: 1;
    -moz-transform: scale(1.2) rotate(3deg);
  }

  20% {
    opacity: 0;
    -moz-transform: scale(1.2) rotate(3deg);
  }

  100% {
    opacity: 0;
  }
}

@-o-keyframes imageAnimation {
 
  0% {
    opacity: 0;
    -o-animation-timing-function: ease-in;
  }

  5% {
    opacity: 1;
    -o-transform: scale(1.1);
    -o-animation-timing-function: ease-out;
  }

  17% {
    opacity: 1;
    -o-transform: scale(1.2) rotate(3deg);
  }

  20% {
    opacity: 0;
    -o-transform: scale(1.2) rotate(3deg);
  }

  100% {
    opacity: 0;
  }
}

@-ms-keyframes imageAnimation {
 
  0% {
    opacity: 0;
    -ms-animation-timing-function: ease-in;
  }

  5% {
    opacity: 1;
    -ms-transform: scale(1.1);
    -ms-animation-timing-function: ease-out;
  }

  17% {
    opacity: 1;
    -ms-transform: scale(1.2) rotate(3deg);
  }

  20% {
    opacity: 0;
    -ms-transform: scale(1.2) rotate(3deg);
  }

  100% {
    opacity: 0;
  }
}

@keyframes imageAnimation {
 
  0% {
    opacity: 0;
    animation-timing-function: ease-in;
  }

  5% {
    opacity: 1;
    transform: scale(1.1);
    animation-timing-function: ease-out;
  }

  17% {
    opacity: 1;
    transform: scale(1.2) rotate(3deg);
  }

  20% {
    opacity: 0;
    transform: scale(1.2) rotate(3deg);
  }

  100% {
    opacity: 0;
  }
}

@-webkit-keyframes titleAnimation {
 
  0% {
    opacity: 0;
    -webkit-transform: translateX(-200px);
  }

  3% {
    opacity: 0;
    -webkit-transform: translateX(-100px);
  }

  10% {
    opacity: 1;
    -webkit-transform: translateX(0px);
  }

  14% {
    opacity: 1;
    -webkit-transform: translateX(0px);
  }

  17% {
    opacity: 0;
    -webkit-transform: translateX(400px);
  }

  25% {
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}

@-moz-keyframes titleAnimation {
 
  0% {
    opacity: 0;
    -moz-transform: translateX(-200px);
  }

  3% {
    opacity: 0;
    -moz-transform: translateX(-100px);
  }

  10% {
    opacity: 1;
    -moz-transform: translateX(0px);
  }

  14% {
    opacity: 1;
    -moz-transform: translateX(0px);
  }

  17% {
    opacity: 0;
    -moz-transform: translateX(400px);
  }

  25% {
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}

@-o-keyframes titleAnimation {
 
  0% {
    opacity: 0;
    -o-transform: translateX(-200px);
  }

  3% {
    opacity: 0;
    -o-transform: translateX(-100px);
  }

  10% {
    opacity: 1;
    -o-transform: translateX(0px);
  }

  14% {
    opacity: 1;
    -o-transform: translateX(0px);
  }

  17% {
    opacity: 0;
    transform: translateX(400px);
  }
  
  25% {
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}

@-ms-keyframes titleAnimation {
 
  0% {
    opacity: 0;
    -ms-transform: translateX(-200px);
  }

  3% {
    opacity: 0;
    -ms-transform: translateX(-100px);
  }

  10% {
    opacity: 1;
    -ms-transform: translateX(0px);
  }

  14% {
    opacity: 1;
    -ms-transform: translateX(0px);
  }

  17% {
    opacity: 0;
    -ms-transform: translateX(400px);
  }

  25% {
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}

@keyframes titleAnimation {
 
  0% {
    opacity: 0;
    transform: translateX(-200px);
  }
  
  3% {
    opacity: 0;
    transform: translateX(-100px);
  }

  10% {
    opacity: 1;
    transform: translateX(0px);
  }

  14% {
    opacity: 1;
    transform: translateX(0px);
  }

  17% {
    opacity: 0;
    transform: translateX(400px);
  }

  25% {
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}
  /********* Most Famous Artworks Slider Animation Settings END **********/
  /* Show at least something when animations not supported */
.no-cssanimations .ArtsDot-Content-Most_Famous_Artworks-Slider li span {
  opacity: 1;
}

  /************* Most Famous Artworks Text and Button *************/
.ArtsDot-Image-Block-Shadow-Main-Image {
  position: absolute;
  width: initial;
  padding: 0.5vW 1.5vW;
  left: 0;
  top: 0;
  background-color: rgba(0, 0, 0, 0.5);
}



.ArtsDot-Image-Block-Shadow-Main-Image > a,
.ArtsDot-Image-Block-Shadow-Main-Image-Button > a {
  text-decoration: none;
}

.ArtsDot-Image-Block-Shadow-Main-Image-Text-Type_1 {
  width: 100%!important;
  font-size: 5vW!important;
  color: #fff!important;
  font-family: 'Oswald-Bold', Arial, Sans-serif!important;
  text-transform: uppercase;
  text-align: left;
  white-space: nowrap;
  padding-bottom: 0!important;
  line-height: 5vW;
}

.ArtsDot-Image-Block-Shadow-Main-Image-Text-Type_2 {
  width: 100%!important;
  font-size: 1.2vW!important;
  color: #fff!important;
  font-family: 'Oswald-Bold', Arial, Sans-serif!important;
  text-transform: uppercase;
  text-align: left;
  padding-bottom: 0!important;
}

.ArtsDot-Image-Block-Shadow-Main-Image-Text-Type_3 {
  width: 100%!important;
  font-size: 1.2vW!important;
  color: #9b9b9b!important;
  font-family: 'Oswald-Light', Arial, Sans-serif!important;
  text-transform: uppercase;
  text-align: left;
  padding-bottom: 0.5vW!important;
}

.ArtsDot-Image-Block-Shadow-Main-Image-Button {
  position: absolute;
  left: 0vW;
  top: 12.5vW;
  text-transform: uppercase;
  font-size: 1.2vW;
  background-color: orange;
  font-family: 'Oswald-Bold', Arial, Sans-serif;
  padding: 0.8vW 2vW;
  transition: color 0.3s, background-color 0.3s;
}
/**
.ArtsDot-Image-Block-Shadow-Main-Image-Button:hover {
  transition: color 0.3s, background-color 0.3s;
  cursor: pointer;
  text-decoration: none!important;
  background-color: #F66600;
  color: white!important;
}
**/
  /************ Most Famous Artworks Text and Button END ************/
/******************* Most Famous Artworks Slider END *******************/

/************************  Popular Topics Block  *********************/
.ArtsDot-Content-Popular-Topics-Block {
  
}
/************************  Popular Topics Block END *********************/

/************************  Popular Artists Block *********************/
.ArtsDot-Content-Most_Popular_Artists-Block {
  height: 34vW;
  overflow: inherit!important;
}
/************************  Popular Artists Block END *********************/

/************************  Artworks by style Block *********************/
.ArtsDot-Content-Artworks_by_style-Block {
  height: 34vW;
  overflow: inherit!important;
}
/************************  Artworks by style Block END *********************/

/************************  Content Interior Block  *********************/
.ArtsDot-Content-Interior-Block {

}
  /*************  Content Interior Block 50-50   ***************/
.ArtsDot-Image_Block-50-50 {
  position: relative;
  float: left;
  height: auto;
  width: 48.5%;
  margin: 0 0 2% 0;
  text-align: left;
  margin-left: 0.5%;
  margin-top: 0.5%;
  box-shadow: -0.1vW 0vW 0.5vW 0vW rgba(0,0,0,0.5);
  -moz-box-shadow: -0.1vW 0vW 0.5vW 0vW rgba(0,0,0,0.5);
  -webkit-box-shadow: -0.1vW 0vW 0.5vW 0vW rgba(0,0,0,0.5);
  -khtml-box-shadow: -0.1vW 0vW 0.5vW 0vW rgba(0,0,0,0.5);
}

.ArtsDot-Image_Block-50-50 img {
  float: left;
  width: 100%;
  height: 38.8vW;
}

.ArtsDot-Image_Block-50-50-Heading {
  position: absolute;
  text-align: left;
}

.ArtsDot-Image_Block-50-50-Heading div:first-child {
  position: relative;
  top: 4vW;
  left: 4vW;
  font-size: 3vW;
  font-family: 'Oswald-Bold', Arial, Sans-serif;
  text-transform: uppercase;
  line-height: 4vW;
}

.ArtsDot-Image_Block-50-50-Heading div:nth-child(2) {
  position: relative;
  top: 4vW;
  left: 4vW;
  font-size: 1.4vW;
  font-family: 'Oswald-Light', Arial, Sans-serif!important;
  text-transform: uppercase;
}

.ArtsDot-Image_Block-50-50 a {
  position: relative;
  padding: 1vW 0.5vW;
  font-size: 1.2vW;
  margin-left: 1vW;
  top: 27vW;
  background-color: grey;
  text-transform: uppercase;
  color: white;
  float: left;
  font-family: 'Oswald-Bold', Arial, Sans-serif;
  transition: all 0.3s ease-out;
  white-space: nowrap;
  max-width: 100%;
}

.ArtsDot-Image_Block-50-50 a:hover {
  text-decoration: none;
  background-color: orange;
  color: #000;
}
/***********************  Content Interior Block END  *********************/

/********************* Specialize block *********************/
.ArtsDot-Content-Specialize-Block {
  position: relative;
  padding-top: 2vW;
  padding-bottom: 3vW;
}

.ArtsDot-Content-Specialize-Block-50 {
  width: 49%;
  float: left;
  text-align: left;
  min-height: 40vW;
}

.ArtsDot-Content-Specialize-Block-50 p {
  padding-bottom: 3vW;
  font-size: 1.4vW;
  text-align: justify;
}

.ArtsDot-Content-Specialize-Block-50 img {
  float: left;
  padding-right: 3%;
  width: 33%;
}

.ArtsDot-Content-Specialize-Block-50 h1 {
  padding-top: 0;
  text-align: left;
}
.ArtsDot-Content-Specialize-Block-50 h2 {
  padding-top: 0;
  text-align: justify;
}

.ArtsDot-Content-Specialize-Block-50 h4 {
  padding-top: 0;
  text-align: left;
}
.ArtsDot-Content-Specialize-Block-50 h5 {
  padding-top: 0;
  text-align: justify;
}

.ArtsDot-Content-Specialize-Block-50 .ArtsDot-Content-Specialize-Block-50-Warranty-Title {
  padding-top: 0;
  text-align: left;
}
.ArtsDot-Content-Specialize-Block-50 .ArtsDot-Content-Specialize-Block-50-Warranty-Text {
  padding-top: 0;
  text-align: justify;
}

  /******************* Specialize Buttons *******************/
.ArtsDot-Image-Blocks-Specialize-Button {
  position: absolute;
  height: 2vW;
  width: 5vW;
  left: 3.5vW;
  top: 13.5vW;
  float: left;
  z-index: 1000;
}

.ArtsDot-Image-Blocks-Specialize-Button a {
  position: relative;
  padding: 0.5vW 1.5vW;
  font-size: 1.2vW;
  background-color: rgba(0, 0, 0, 0.5);
  text-transform: uppercase;
  color: #fff;
  font-family: 'Oswald-Bold', Arial, Sans-serif;
  transition: color 0.3s, background-color 0.3s;
  white-space: nowrap;
}
/********************* Specialize block END *********************/

/*********************** Shop by room ************************/
.ArtsDot-Content-Shop_By_Room {
  position: relative;
  overflow: inherit!important;
}

.ArtsDot-Content-Shop_By_Room img {
  padding-top: 1vW;
  width: 100%;
  padding-bottom: 4vW;
}

  /***************Shop by room Buttons **************/
.ArtsDot-Image-Blocks-Shop_By_Room-Button {
  position: relative;
  height: 1vW;
  width: 25%;
  float: left;
}

.ArtsDot-Image-Blocks-Shop_By_Room-Button a {
  position: absolute;
  padding: 0.5vW 1.5vW;
  font-size: 1.2vW;
  top: -15vW;
  left: 7vW;
  background-color: rgba(0, 0, 0, 0.5);
  text-transform: uppercase;
  color: white;
  font-family: 'Oswald-Bold', Arial, Sans-serif;
  transition: color 0.3s, background-color 0.3s;
  white-space: nowrap;
}

.ArtsDot-Image-Blocks-Shop_By_Room-Button a:hover {
  text-decoration: none;
  transition: color 0.3s, background-color 0.3s;
  color: black;
  background-color: orange;
}
/********************* Shop by room END *********************/

/********************* H1 -> H2 for SEO *********************/

.ArtsDot-Content-Block h2 {
    float: none;
    padding: 2vW 0;
    font-size: 3vW;
    text-align: center;
    text-transform: uppercase;
    font-weight: bold;
    font-family: 'Oswald-Bold', Arial, Sans-serif;
}

.ArtsDot-Content-Specialize-Block h2{
	
	text-align: left;
	padding-top: 0;
	
}

/********************* H1 -> H2 for SEO END *********************/


/********************* New HomePage 6 images block *********************/

.Artsdot-HomePage-DB-Images{

	display: inline-block;
	overflow: inherit!important;
		
}

.Artsdot-HomePage-DB-Image-Block {
	
	box-shadow: -0.1vW 0vW 0.5vW 0vW rgba(0,0,0,0.5);
	-moz-box-shadow: -0.1vW 0vW 0.5vW 0vW rgba(0,0,0,0.5);
	-webkit-box-shadow: -0.1vW 0vW 0.5vW 0vW rgba(0,0,0,0.5);
	-khtml-box-shadow: -0.1vW 0vW 0.5vW 0vW rgba(0,0,0,0.5);
	position: relative;
	font-size: 0;
    width: 32.66%;
    margin: 1% 1% 0% 0%;
    float: left;
    overflow: hidden;
        
}

.Artsdot-HomePage-DB-Image-Block > a >  img {
  width: 100%;
  -webkit-transition: all 0.3s ease-out, transform 1s ease-out;
  -moz-transition: all 0.3s ease-out, transform 1s ease-out;
  -o-transition: all 0.3s ease-out, transform 1s ease-out;
  -ms-transition: all 0.3s ease-out, transform 1s ease-out;
  transition: all 0.3s ease-out, transform 1s ease-out;
  opacity:0.25;
}

.Artsdot-HomePage-DB-Image-Block-Right{

	margin-right:0;
		
}

.Artsdot-HomePage-DB-Image-Block img {
	
    width: 100%;
    
}

.Artsdot-HomePage-DB-Images-Text {
	
    position: absolute;
    padding: 0 1vW;
    left: 4vW;
    top: 1.4vW;
    font-size: 3vW;
    font-weight: bold;
    text-align: left;
    color: #fff;
    background-color: rgba(0, 0, 0, 0.5);
    
}


.Artsdot-HomePage-DB-Image-Block:hover {
	
  /*border: 1px solid orange;*/
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
  
}

.Artsdot-HomePage-DB-Image-Block:hover .Artsdot-HomePage-DB-Images-Text {
	
  text-decoration: none;
  color: black;
  background-color: orange;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
  
}

.Artsdot-HomePage-DB-Image-Block:hover img { 
	
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  filter: url('ArtsDot-Grayscale_Filter-Matrix.svg#grayscale');
  filter: grayscale(100%);
  transform: scale(1.02, 1.02);
  -webkit-transition: all 0.3s ease-out, transform 1s ease-out;
  -moz-transition: all 0.3s ease-out, transform 1s ease-out;
  -o-transition: all 0.3s ease-out, transform 1s ease-out;
  -ms-transition: all 0.3s ease-out, transform 1s ease-out;
  transition: all 0.3s ease-out, transform 1s ease-out;
  
}


/********************* New HomePage 6 images block END *********************/



/************************ Home Page Topics CSS ************************/

.ArtsDot-Image_Block-Topics_WithBanner {
width: 32%;
position: relative;
float: left;
margin-right: 2%
}

.Artsdot-HomePage-DB-Image-Block {
width: 100%;
margin-top: 0;
margin-bottom: 4vW;
}

.ArtsDot-Image_Block-Topics_FrameTopics-2-MarginRight {
margin-right: 0;
}

.ArtsDot-Image_Block_FrameTopics-2 {   /*--- Image block 25/25 with inner text on gray background.  Image become gray when mouseover--*/
  position: relative;
  float: left;
  height: auto;
  box-shadow: -0.1vW 0vW 0.5vW 0vW rgba(0,0,0,0.5);
  -moz-box-shadow: -0.1vW 0vW 0.5vW 0vW rgba(0,0,0,0.5);
  -webkit-box-shadow: -0.1vW 0vW 0.5vW 0vW rgba(0,0,0,0.5);
  -khtml-box-shadow: -0.1vW 0vW 0.5vW 0vW rgba(0,0,0,0.5);
  font-size:0;
  width: 46%;
  margin: 0 2% 4% 2%;
  text-align: center;
  //border: 1px solid transparent;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
  overflow: hidden;
}
.ArtsDot-Image_Block_FrameTopics-2 img {
  width: 100%;
  -webkit-transition: all 0.3s ease-out, transform 1s ease-out;
  -moz-transition: all 0.3s ease-out, transform 1s ease-out;
  -o-transition: all 0.3s ease-out, transform 1s ease-out;
  -ms-transition: all 0.3s ease-out, transform 1s ease-out;
  transition: all 0.3s ease-out, transform 1s ease-out;
}
.ArtsDot-Image_Block_FrameTopics-2:hover img {
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  filter: url('ArtsDot-Grayscale_Filter-Matrix.svg#grayscale');
  filter: grayscale(100%);
  transform: scale(1.02, 1.02);
  -webkit-transition: all 0.3s ease-out, transform 1s ease-out;
  -moz-transition: all 0.3s ease-out, transform 1s ease-out;
  -o-transition: all 0.3s ease-out, transform 1s ease-out;
  -ms-transition: all 0.3s ease-out, transform 1s ease-out;
  transition: all 0.3s ease-out, transform 1s ease-out;
}
.ArtsDot-Image_Block_FrameTopics-2:hover {
  /*border: 1px solid orange;*/
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}
.ArtsDot-Image_Block_FrameTopics-2:hover > .ArtsDot-Image_Block_FrameTopics-2-Bottom-Button > a,
.ArtsDot-Image_Block_FrameTopics-2:hover > .ArtsDot-Image_Block_FrameTopics-2-Heading-Button > a {
  text-decoration: none;
  color: #000;
  background-color: orange;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}
.ArtsDot-Image_Block_FrameTopics-2:nth-child(5n-4) {
margin-left: 2%;
}

.Artsdot-HomePage-DB-Images-Text {
/*padding: 0.5vW 2vW;
left: 2.1vW;
top: 2.1vW;
font-size: 3.5vW;*/
top: 1.3vW;
}

.ArtsDot-Content-Popular-Topics-Block {
margin-bottom: 0!important;
}

.Artsdot-HomePage-DB-Images-Text {
background-color: inherit;
left: 0;
width: 100%;
text-align: center;
}

.Artsdot-HomePage-DB-Images-Text span {
padding: 0.5vW 2vW;
background-color: rgba(0,0,0,0.5);
}

.Artsdot-HomePage-DB-Image-Block:hover .Artsdot-HomePage-DB-Images-Text {
background-color: inherit;
}

.Artsdot-HomePage-DB-Image-Block:hover .Artsdot-HomePage-DB-Images-Text span {
background-color: orange;
}

.Artsdot-HomePage-DB-Images-Text-Topics span{

padding: 0.5vW 2vW;
background-color: rgba(0,0,0,0.5);

}

.Artsdot-HomePage-DB-Images-Text-Topics {

background-color: inherit;
left:0;
top: 45%;
width: 100%;
white-space: nowrap;
text-align:center;
color: #fff;
font-weight: bold;
font-size: 1vW;
padding: 0 1vW;
position: absolute;

}

.ArtsDot-Image_Block_FrameTopics-2:hover .Artsdot-HomePage-DB-Images-Text-Topics span {

background-color: orange;

}

/************************ Home Page Topics CSS ************************/