/* Tiny Carousel */
#slider1 { height: 1%; overflow: hidden; padding: 0 0 10px; margin-bottom: 20px;}
#slider1 .viewport { float: left; width: 880px; height: 420px; overflow: hidden; position: relative; z-index: 1; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.3), 0 6px 20px 0 rgba(0, 0, 0, 0.29);}
#slider1 .buttons {
    background: #6397ff;
    border-radius: 35px;
    display: block;
    margin: 182px 10px 8px 12px; /* top - right - bottom - left */
    float: left;
    width: 35px;
    height: 35px;
    position: relative;
    color: #fff;
    font-weight: bold;
    text-align: center;
    line-height: 35px;
    text-decoration: none;
    font-size: 22px;
	z-index: 100;
}
#slider1 .next {
    margin: 182px 0 0 778px;
}
#slider1 .buttons:hover {
    color: #fff;
    background: #3378ad;
}
#slider1 .disable { visibility: hidden; }
#slider1 .overview { list-style: none; position: absolute; padding: 0; margin: 0; width: 600px; left: 0; top: 0; }
#slider1 .overview li { float: left; margin: 0 20px 0 0; padding: 1px; height: 420px; border: 0px solid #dcdcdc; width: 880px; }
.carousel_image {
   width: 866px;
   height: 408px;
   border: 6px solid #fff;
}

@media only screen and (min-width: 1025px) and (max-width: 1399px) {
#slider1 .viewport { float: left; width: 698px; height: 333px; overflow: hidden; position: relative; z-index: 1; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.3), 0 6px 20px 0 rgba(0, 0, 0, 0.29);}
#slider1 .buttons {
    background: #6397ff;
    border-radius: 35px;
    display: block;
    margin: 148px 10px 8px 12px; /* top - right - bottom - left */
    float: left;
    width: 35px;
    height: 35px;
    position: relative;
    color: #fff;
    font-weight: bold;
    text-align: center;
    line-height: 35px;
    text-decoration: none;
    font-size: 22px;
	z-index: 100;
}
#slider1 .next {
    margin: 148px 0 0 596px;
}
#slider1 .buttons:hover {
    color: #fff;
    background: #3378ad;
}
#slider1 .disable { visibility: hidden; }
#slider1 .overview { list-style: none; position: absolute; padding: 0; margin: 0; width: 600px; left: 0; top: 0; }
#slider1 .overview li { float: left; margin: 0 20px 0 0; padding: 1px; height: 333px; border: 0px solid #dcdcdc; width: 698px; }
.carousel_image {
   width: 684px;
   height: 321px;
   border: 6px solid #fff;
}

/* for the #slideshow div */
#slideshow {
 float: left;
 width: 698px;
}
}

@media only screen and (min-width: 960px) and (max-width: 1024px) {
#slider1 .viewport { float: left; width: 680px; height: 324px; overflow: hidden; position: relative; z-index: 1; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.3), 0 6px 20px 0 rgba(0, 0, 0, 0.29);}
#slider1 .buttons {
    background: #6397ff;
    border-radius: 35px;
    display: block;
    margin: 148px 10px 8px 12px; /* top - right - bottom - left */
    float: left;
    width: 35px;
    height: 35px;
    position: relative;
    color: #fff;
    font-weight: bold;
    text-align: center;
    line-height: 35px;
    text-decoration: none;
    font-size: 22px;
	z-index: 100;
}
#slider1 .next {
    margin: 148px 0 0 578px;
}
#slider1 .buttons:hover {
    color: #fff;
    background: #3378ad;
}
#slider1 .disable { visibility: hidden; }
#slider1 .overview { list-style: none; position: absolute; padding: 0; margin: 0; width: 600px; left: 0; top: 0; }
#slider1 .overview li { float: left; margin: 0 20px 0 0; padding: 1px; height: 324px; border: 0px solid #dcdcdc; width: 680px; }
.carousel_image {
   width: 656px;
   height: 309px;
   border: 6px solid #fff;
}

/* for the #slideshow div */
#slideshow {
 float: left;
 width: 680px;
}
}


@media only screen and (min-width: 681px) and (max-width: 959px) {
#slider1 .viewport { float: left; width: 494px; height: 236px; overflow: hidden; position: relative; z-index: 1; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.3), 0 6px 20px 0 rgba(0, 0, 0, 0.29);}
#slider1 .buttons {
    background: #6397ff;
    border-radius: 35px;
    display: block;
    margin: 98px 10px 8px 12px; /* top - right - bottom - left */
    float: left;
    width: 35px;
    height: 35px;
    position: relative;
    color: #fff;
    font-weight: bold;
    text-align: center;
    line-height: 35px;
    text-decoration: none;
    font-size: 22px;
	z-index: 100;
}
#slider1 .next {
    margin: 98px 0 0 392px;
}
#slider1 .buttons:hover {
    color: #fff;
    background: #3378ad;
}
#slider1 .disable { visibility: hidden; }
#slider1 .overview { list-style: none; position: absolute; padding: 0; margin: 0; width: 600px; left: 0; top: 0; }
#slider1 .overview li { float: left; margin: 0 20px 0 0; padding: 1px; height: 236px; border: 0px solid #dcdcdc; width: 494px; }
.carousel_image {
   width: 482px;
   height: 224px;
   border: 6px solid #fff;
}

/* for the #slideshow div */
#slideshow {
 float: left;
 width: 494px;
}
}


@media only screen and (min-width: 1px) and (max-width: 680px) {
#slideshow {
   display: none;
}
#slider1 .viewport {
   display: none;
}
#slider1 { 
   display: none;
}
}