.modalwindow {position: absolute; background-color: #ffffff; left: 50%; top: 50%; width: 200px; height: 200px; margin-left: -100px; margin-top: -100px;  z-index: 100; overflow: hidden; transition: 0.1s; border-radius: 5px; border: 2px solid #ffffff; box-shadow: 0 0 30px rgba(0,0,0,0.75); box-sizing: border-box; }

.modalwindow input {margin: 5px; text-align: center; }

#preview {position: relative; background-color: #ffffff; width: 100%; height: 120px; text-align: center; overflow: hidden; box-sizing: border-box; }
.previewimage {position: relative; display: inline-block; background-color: #ffffff; width: 100px; height: 100px; border: 2px solid #3399cc; box-sizing: border-box; margin: 5px; padding: 3px; border-radius: 3px; }
.previewimage img { position: absolute; margin: auto; left: 0; top: 0; bottom: 0; right: 0;}


#close {position: absolute; width: 20px; height: 20px; top: 0px; right: 0px; z-index: 102; }

#next {position: absolute; width: 25px; height: 100px; top: 50%; margin: -50px 0px 0px 0px; right: -25px; z-index: 102; transition: 0.5s; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0;}
#prev {position: absolute; width: 25px; height: 100px; top: 50%; margin: -50px 0px 0px 0px; left: -25px; z-index: 102; transition: 0.5s; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0;}

.modalwindow:hover #next {position: absolute; width: 25px; height: 100px; top: 50%; margin: -50px 0px 0px 0px; right: 0px; z-index: 102; transition: 0.5s; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100); -moz-opacity: 1; -khtml-opacity: 1; opacity: 1;}
.modalwindow:hover #prev {position: absolute; width: 25px; height: 100px; top: 50%; margin: -50px 0px 0px 0px; left: 0px; z-index: 102; transition: 0.5s; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100); -moz-opacity: 1; -khtml-opacity: 1; opacity: 1;}

.modalwindow a {color: #ffffff; font-size: 20px; text-decoration: none; text-shadow: 1px 1px 2px black;}
.modalwindow a:hover { text-decoration: none; }

.modalwindow a.small {COLOR: #ff0000; font-weight: normal; font-size: 13px; text-decoration: none; border-bottom: 1px dotted #ff0000; text-shadow: none;}
.modalwindow a.small:hover { border-bottom: 0px none #ff0000; }



.gray50 {position: absolute; top: 0px; width: 100%; height: 100%; z-index: 10;}
body>.gray50 {position: fixed; background-image: url(images/gray50.png); background-position: 0px 0px; background-repeat: repeat;}

div.listbannermain {overflow: hidden; position: relative;  width: 730px; height: 300px; background-position: 0% 0%;  background-repeat: no-repeat; margin: 0px; border-radius: 5px;  margin: 0px auto 15px auto; -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3); -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3); box-shadow:0 1px 4px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3); box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3);
}        
 
.listbannermain:before,
.listbannermain:after {
    content:"";
    position:absolute;
    z-index:-2;
}
 

div.linkbanner {overflow: hidden; position: absolute;  width: 730px; height: 300px; top: 0px; left: 0px; z-index: 10}
div.listbanner {overflow: hidden; position: absolute;  width: 730px; height: 300px; top: 0px; left: 0px; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0;  transition: 1s; border-radius: 5px;}
div.listbannera {overflow: hidden; position: absolute;  width: 730px; height: 300px; top: 0px; left: 0px; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100); -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; transition: 1s; border-radius: 5px;}

div.listbannermain div.arrowleft {width: 25px; height: 100px; top: 100px; left: -25px; position: absolute; z-index: 3; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0;   transition: 0.5s;}
div.listbannermain:hover div.arrowleft {width: 25px; height: 100px; top: 100px; left: 0px; position: absolute; z-index: 30; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100); -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; transition: 0.5s;}

div.listbannermain div.arrowright {width: 25px; height: 100px; top: 100px; right: -25px; position: absolute; z-index: 3; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0;   transition: 0.5s;}
div.listbannermain:hover div.arrowright {width: 25px; height: 100px; top: 100px; right: 0px; position: absolute; z-index: 30; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100); -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; transition: 0.5s;}


div.listbannerleft {overflow: hidden; position: relative;  width: 165px; height: 200px; background-position: 0% 0%;  background-repeat: no-repeat; margin: 0px; margin: 0px auto 10px auto; border-radius: 5px;}        


div.linkbannerleft {overflow: hidden; position: absolute;  width: 165px; height: 200px; top: 0px; left: 0px; z-index: 10; border-radius: 5px;}
div.listbanner2 {overflow: hidden; position: absolute;  width: 165px; height: 200px; top: 0px; left: 0px; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0;  transition: 1s; border-radius: 5px;}
div.listbanner2a {overflow: hidden; position: absolute;  width: 165px; height: 200px; top: 0px; left: 0px; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100); -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; transition: 1s; border-radius: 5px;}

div.listbannerleft div.arrowleft {width: 25px; height: 100px; top: 50px; left: -25px; position: absolute; z-index: 3; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0;   transition: 0.5s;}
div.listbannerleft:hover div.arrowleft {width: 25px; height: 100px; top: 50px; left: 0px; position: absolute; z-index: 30; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100); -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; transition: 0.5s;}

div.listbannerleft div.arrowright {width: 25px; height: 100px; top: 50px; right: -25px; position: absolute; z-index: 3; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0;   transition: 0.5s;}
div.listbannerleft:hover div.arrowright {width: 25px; height: 100px; top: 50px; right: 0px; position: absolute; z-index: 30; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100); -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; transition: 0.5s;}


div.cardimagebox {overflow: hidden; width: 70px; height: 70px; text-align: center; position:relative;  border-radius: 3px; margin: 2px; border: 1px solid #d0d0d0; }
div.cardimagebox:hover {border: 1px solid #2583c3; }

div.cardimagebox img { position: absolute; margin: auto; left: 0; top: 0; bottom: 0; right: 0;}