@charset "utf-8";
/* CSS Document */

.stepcarousel{
position: relative; /*leave this value alone*/
overflow: scroll; /*leave this value alone*/
height:217px; margin:0 auto; /*Height should enough to fit largest content's height*/
}
 
.stepcarousel .belt{
position: absolute; /*leave this value alone*/
left: 0;
top: 0;
}
 
.stepcarousel .panel{
float: left; /*leave this value alone*/
overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
margin: 10px 0px 30px 0px; /*margin around each panel*/
width:379px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
background-color:#fff;
position:relative;
 height:217px;

}
 
.stepcarousel .panel img{
position: relative;
margin:0px auto;
left:0;
right:0;
bottom:0; height:217px; max-width:379px; width:100%;
top:0;
}
 
 .stepcarousel .panel p{ font-size: 13px;
line-height: 18px;
color: #000;
margin: 0px;
padding: 0px;
text-align: center;}
 
 
 /* #galleryc{
width:100%;
height:150px;
border: 10px solid darkred;
}
 
#galleryc .panel{
height:150px;
font: bold 28px Arial;
text-align: center;
background-color: green;
color: #000;
}
 
p.samplebuttons{
width: 90%;
text-align: center;
}
 
p.samplebuttons a{
color: #2e6ab1;
padding: 1px 2px;
margin-right: 3px;
text-decoration: none;
}
  */
  
@media (min-width:992px) and (max-width:1200px){
.stepcarousel .panel{
float: left; /*leave this value alone*/
overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
margin: 10px 0px 30px 0px; /*margin around each panel*/
/* width:414px; */ /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
background-color:#fff;
/* height:107px; */
  }
  
 .stepcarousel .panel img{
position: relative;
margin:0px auto;
left:0;
right:0;
bottom:0;
top:0;
} 
    
}
 
@media (min-width:300px) and (max-width:990px){
.stepcarousel{

}	
		
.stepcarousel .panel{
float: left; /*leave this value alone*/
overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
margin: 10px 0px 10px 0px; /*margin around each panel*/
/*width:232px; Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
background-color:#fff;
/* height:107px; */

}
 
.stepcarousel .panel img{
position: relative;
margin:0px auto;
left:0;
right:0;
bottom:0;
top:0;
}
}