@media screen and (max-width:1920px){
@charset "utf-8";
/*Style the Images*/
ul.img-list { list-style-type: none;margin: 0; padding: 0;text-align: center;}
ul.img-list li {display: inline-block; height: 160px; margin: 10px 1px 10px 0; position: relative;width: 160px;}
/*Place the text over the images*/
span.text-content { background: rgba(0,0,0,0.5);color: white;cursor: pointer;display: table;height: 40px;left: 0;position: absolute; top: 0; width: 160px;}
span.text-content span { display: table-cell;text-align: center; vertical-align: middle;}
/*Show the text on hover*/
span.text-content {background: rgba(0,0,0,0.5); color: white;cursor: pointer;display: table;height: 40px; left: 0; position: absolute; top: 0; width: 160px;opacity: 0;}
ul.img-list li:hover span.text-content {opacity: 1;}
/*Add the animation*/
span.text-content {background: #73C3E6;color: white;cursor: pointer;display: table;height: 40px; left: 0;position: absolute;top: 0;width: 160px;opacity: 0;}
ul.img-list li:hover span.text-content {opacity: 1;}
span.text-content { background: #2ab1eb;color: white;cursor: pointer;
 /*display: table;*/height: 40px;left: 0;position: absolute; top: 120px; width: 160px; opacity: 0; -webkit-transition: opacity 500ms;-moz-transition: opacity 500ms; -o-transition: opacity 500ms; transition: opacity 500ms;}
}

@media screen and (max-width:1680px){
@charset "utf-8";
/*Style the Images*/
ul.img-list { list-style-type: none;margin: 0; padding: 0;text-align: center;}
ul.img-list li {display: inline-block; height: 160px; margin: 10px 1px 10px 0; position: relative;width: 160px;}
/*Place the text over the images*/
span.text-content { background: rgba(0,0,0,0.5);color: white;cursor: pointer;display: table;height: 40px;left: 0;position: absolute; top: 0; width: 160px;}
span.text-content span { display: table-cell;text-align: center; vertical-align: middle;}
/*Show the text on hover*/
span.text-content {background: rgba(0,0,0,0.5); color: white;cursor: pointer;display: table;height: 40px; left: 0; position: absolute; top: 0; width: 160px;opacity: 0;}
ul.img-list li:hover span.text-content {opacity: 1;}
/*Add the animation*/
span.text-content {background: #73C3E6;color: white;cursor: pointer;display: table;height: 40px; left: 0;position: absolute;top: 0;width: 160px;opacity: 0;}
ul.img-list li:hover span.text-content {opacity: 1;}
span.text-content { background: #2ab1eb;color: white;cursor: pointer;
 /*display: table;*/height: 40px;left: 0;position: absolute; top: 120px; width: 160px; opacity: 0; -webkit-transition: opacity 500ms;-moz-transition: opacity 500ms; -o-transition: opacity 500ms; transition: opacity 500ms;}
}

@media screen and (max-width:1440px){
@charset "utf-8";
/*Style the Images*/
ul.img-list { list-style-type: none;margin: 0; padding: 0;text-align: center;}
ul.img-list li {display: inline-block; height: 160px; margin: 10px 1px 10px 0; position: relative;width: 160px;}
/*Place the text over the images*/
span.text-content { background: rgba(0,0,0,0.5);color: white;cursor: pointer;display: table;height: 40px;left: 0;position: absolute; top: 0; width: 160px;}
span.text-content span { display: table-cell;text-align: center; vertical-align: middle;}
/*Show the text on hover*/
span.text-content {background: rgba(0,0,0,0.5); color: white;cursor: pointer;display: table;height: 40px; left: 0; position: absolute; top: 0; width: 160px;opacity: 0;}
ul.img-list li:hover span.text-content {opacity: 1;}
/*Add the animation*/
span.text-content {background: #73C3E6;color: white;cursor: pointer;display: table;height: 40px; left: 0;position: absolute;top: 0;width: 160px;opacity: 0;}
ul.img-list li:hover span.text-content {opacity: 1;}
span.text-content { background: #2ab1eb;color: white;cursor: pointer;
 /*display: table;*/height: 40px;left: 0;position: absolute; top: 120px; width: 160px; opacity: 0; -webkit-transition: opacity 500ms;-moz-transition: opacity 500ms; -o-transition: opacity 500ms; transition: opacity 500ms;}
}


@media screen and (max-width:1366px){
@charset "utf-8";
/*Style the Images*/
ul.img-list { list-style-type: none;margin: 0; padding: 0;text-align: center;}
ul.img-list li {display: inline-block; height: 160px; margin: 10px 1px 10px 0; position: relative;width: 160px;}
/*Place the text over the images*/
span.text-content { background: rgba(0,0,0,0.5);color: white;cursor: pointer;display: table;height: 40px;left: 0;position: absolute; top: 0; width: 160px;}
span.text-content span { display: table-cell;text-align: center; vertical-align: middle;}
/*Show the text on hover*/
span.text-content {background: rgba(0,0,0,0.5); color: white;cursor: pointer;display: table;height: 40px; left: 0; position: absolute; top: 0; width: 160px;opacity: 0;}
ul.img-list li:hover span.text-content {opacity: 1;}
/*Add the animation*/
span.text-content {background: #73C3E6;color: white;cursor: pointer;display: table;height: 40px; left: 0;position: absolute;top: 0;width: 160px;opacity: 0;}
ul.img-list li:hover span.text-content {opacity: 1;}
span.text-content { background: #2ab1eb;color: white;cursor: pointer;
 /*display: table;*/height: 40px;left: 0;position: absolute; top: 120px; width: 160px; opacity: 0; -webkit-transition: opacity 500ms;-moz-transition: opacity 500ms; -o-transition: opacity 500ms; transition: opacity 500ms;}
}
@media screen and (max-width:1280px){
@charset "utf-8";
/*Style the Images*/
ul.img-list { list-style-type: none;margin: 0; padding: 0;text-align: center;}
ul.img-list li {display: inline-block; height: 160px; margin: 10px -25px 10px 0; position: relative;width: 160px;}
/*Place the text over the images*/
span.text-content { background: rgba(0,0,0,0.5);color: white;cursor: pointer;display: table;height: 40px;left: 0;position: absolute; top: 0; width: 160px;}
span.text-content span { display: table-cell;text-align: center; vertical-align: middle;}
/*Show the text on hover*/
span.text-content {background: rgba(0,0,0,0.5); color: white;cursor: pointer;display: table;height: 40px; left: 0; position: absolute; top: 0; width: 160px;opacity: 0;}
ul.img-list li:hover span.text-content {opacity: 1;}
/*Add the animation*/
span.text-content {background: #73C3E6;color: white;cursor: pointer;display: table;height: 40px; left: 0;position: absolute;top: 0;width: 160px;opacity: 0;}
ul.img-list li:hover span.text-content {opacity: 1;}
span.text-content { background: #2ab1eb;color: white;cursor: pointer;
 /*display: table;*/height: 40px;left: 0;position: absolute; top: 120px; width: 160px; opacity: 0; -webkit-transition: opacity 500ms;-moz-transition: opacity 500ms; -o-transition: opacity 500ms; transition: opacity 500ms;}
}
@media screen and (max-width:1024px){
@charset "utf-8";
/*Style the Images*/
ul.img-list { list-style-type: none;margin: 0; padding: 0;text-align: center;}
ul.img-list li {display: inline-block; height: 160px; margin: 10px 1px 10px 0; position: relative;width: 160px;}
/*Place the text over the images*/
span.text-content { background: rgba(0,0,0,0.5);color: white;cursor: pointer;display: table;height: 40px;left: 0;position: absolute; top: 0; width: 160px;}
span.text-content span { display: table-cell;text-align: center; vertical-align: middle;}
/*Show the text on hover*/
span.text-content {background: rgba(0,0,0,0.5); color: white;cursor: pointer;display: table;height: 40px; left: 0; position: absolute; top: 0; width: 160px;opacity: 0;}
ul.img-list li:hover span.text-content {opacity: 1;}
/*Add the animation*/
span.text-content {background: #73C3E6;color: white;cursor: pointer;display: table;height: 40px; left: 0;position: absolute;top: 0;width: 160px;opacity: 0;}
ul.img-list li:hover span.text-content {opacity: 1;}
span.text-content { background: #2ab1eb;color: white;cursor: pointer;
 /*display: table;*/height: 40px;left: 0;position: absolute; top: 120px; width: 160px; opacity: 0; -webkit-transition: opacity 500ms;-moz-transition: opacity 500ms; -o-transition: opacity 500ms; transition: opacity 500ms;}
}
@media screen and (max-width:980px){
@charset "utf-8";
/*Style the Images*/
ul.img-list { list-style-type: none;margin: 0; padding: 0;text-align: center;}
ul.img-list li {display: inline-block; height: 130px; margin: 5px 1px 5px 0; position: relative;width: 130px;}
/*Place the text over the images*/
span.text-content { background: rgba(0,0,0,0.5);color: white;cursor: pointer;display: table;height: 10px;left: 0;position: absolute; top: 0; width: 130px;}
span.text-content span { display: table-cell;text-align: center; vertical-align: middle;}
/*Show the text on hover*/
span.text-content {background: rgba(0,0,0,0.5); color: white;cursor: pointer;display: table;height: 10px; left: 0; position: absolute; top: 0; width: 130px;opacity: 0;}
ul.img-list li:hover span.text-content {opacity: 1;}
/*Add the animation*/
span.text-content {background: #73C3E6;color: white;cursor: pointer;display: table;height: 10px; left: 0;position: absolute;top: 0;width: 130px;opacity: 0;}
ul.img-list li:hover span.text-content {opacity: 1;}
span.text-content { background: #2ab1eb;color: white;cursor: pointer;
 /*display: table;*/height: 40px;left: 0;position: absolute; top: 120px; width: 130px; opacity: 0; -webkit-transition: opacity 500ms;-moz-transition: opacity 500ms; -o-transition: opacity 500ms; transition: opacity 500ms;}
}
@media screen and (max-width:800px){
}
@media screen and (max-width:768px){
}
@media screen and (max-width:320px){
}
@media screen and (max-width:280px){
}



