
/* Slider */

.carousel1 > 
input[type=radio]:nth-child(4):checked ~ .carousel1__next > label:nth-child(1), .carousel1 > 
input[type=radio]:nth-child(4):checked ~ .carousel1__prev > label:nth-child(3), .carousel1 > 
input[type=radio]:nth-child(3):checked ~ .carousel1__next > label:nth-child(4), .carousel1 > 
input[type=radio]:nth-child(3):checked ~ .carousel1__prev > label:nth-child(2), .carousel1 > 
input[type=radio]:nth-child(2):checked ~ .carousel1__next > label:nth-child(3), .carousel1 > 
input[type=radio]:nth-child(2):checked ~ .carousel1__prev > label:nth-child(1), .carousel1 > 
input[type=radio]:nth-child(1):checked ~ .carousel1__next > label:nth-child(2), .carousel1 > 
input[type=radio]:nth-child(1):checked ~ .carousel1__prev > label:nth-child(4) { opacity: 1 !important; z-index: 3;}

.carousel2 > 
input[type=radio]:nth-child(4):checked ~ .carousel2__next > label:nth-child(1), .carousel2 > 
input[type=radio]:nth-child(4):checked ~ .carousel2__prev > label:nth-child(3), .carousel2 > 
input[type=radio]:nth-child(3):checked ~ .carousel2__next > label:nth-child(4), .carousel2 > 
input[type=radio]:nth-child(3):checked ~ .carousel2__prev > label:nth-child(2), .carousel2 > 
input[type=radio]:nth-child(2):checked ~ .carousel2__next > label:nth-child(3), .carousel2 > 
input[type=radio]:nth-child(2):checked ~ .carousel2__prev > label:nth-child(1), .carousel2 > 
input[type=radio]:nth-child(1):checked ~ .carousel2__next > label:nth-child(2), .carousel2 > 
input[type=radio]:nth-child(1):checked ~ .carousel2__prev > label:nth-child(4) { opacity: 1 !important; z-index: 3;}

.carousel3 > 
input[type=radio]:nth-child(4):checked ~ .carousel3__next > label:nth-child(1), .carousel3 > 
input[type=radio]:nth-child(4):checked ~ .carousel3__prev > label:nth-child(3), .carousel3 > 
input[type=radio]:nth-child(3):checked ~ .carousel3__next > label:nth-child(4), .carousel3 > 
input[type=radio]:nth-child(3):checked ~ .carousel3__prev > label:nth-child(2), .carousel3 > 
input[type=radio]:nth-child(2):checked ~ .carousel3__next > label:nth-child(3), .carousel3 > 
input[type=radio]:nth-child(2):checked ~ .carousel3__prev > label:nth-child(1), .carousel3 > 
input[type=radio]:nth-child(1):checked ~ .carousel3__next > label:nth-child(2), .carousel3 > 
input[type=radio]:nth-child(1):checked ~ .carousel3__prev > label:nth-child(4) { opacity: 1 !important; z-index: 3;}

.carousel4 > 
input[type=radio]:nth-child(4):checked ~ .carousel4__next > label:nth-child(1), .carousel4 > 
input[type=radio]:nth-child(4):checked ~ .carousel4__prev > label:nth-child(3), .carousel4 > 
input[type=radio]:nth-child(3):checked ~ .carousel4__next > label:nth-child(4), .carousel4 > 
input[type=radio]:nth-child(3):checked ~ .carousel4__prev > label:nth-child(2), .carousel4 > 
input[type=radio]:nth-child(2):checked ~ .carousel4__next > label:nth-child(3), .carousel4 > 
input[type=radio]:nth-child(2):checked ~ .carousel4__prev > label:nth-child(1), .carousel4 > 
input[type=radio]:nth-child(1):checked ~ .carousel4__next > label:nth-child(2), .carousel4 > 
input[type=radio]:nth-child(1):checked ~ .carousel4__prev > label:nth-child(4) { opacity: 1 !important; z-index: 3;}

.carousel5 > 
input[type=radio]:nth-child(4):checked ~ .carousel5__next > label:nth-child(1), .carousel5 > 
input[type=radio]:nth-child(4):checked ~ .carousel5__prev > label:nth-child(3), .carousel5 > 
input[type=radio]:nth-child(3):checked ~ .carousel5__next > label:nth-child(4), .carousel5 > 
input[type=radio]:nth-child(3):checked ~ .carousel5__prev > label:nth-child(2), .carousel5 > 
input[type=radio]:nth-child(2):checked ~ .carousel5__next > label:nth-child(3), .carousel5 > 
input[type=radio]:nth-child(2):checked ~ .carousel5__prev > label:nth-child(1), .carousel5 > 
input[type=radio]:nth-child(1):checked ~ .carousel5__next > label:nth-child(2), .carousel5 > 
input[type=radio]:nth-child(1):checked ~ .carousel5__prev > label:nth-child(4) { opacity: 1 !important; z-index: 3;}

.carousel6 > 
input[type=radio]:nth-child(4):checked ~ .carousel6__next > label:nth-child(1), .carousel6 > 
input[type=radio]:nth-child(4):checked ~ .carousel6__prev > label:nth-child(3), .carousel6 > 
input[type=radio]:nth-child(3):checked ~ .carousel6__next > label:nth-child(4), .carousel6 > 
input[type=radio]:nth-child(3):checked ~ .carousel6__prev > label:nth-child(2), .carousel6 > 
input[type=radio]:nth-child(2):checked ~ .carousel6__next > label:nth-child(3), .carousel6 > 
input[type=radio]:nth-child(2):checked ~ .carousel6__prev > label:nth-child(1), .carousel6 > 
input[type=radio]:nth-child(1):checked ~ .carousel6__next > label:nth-child(2), .carousel6 > 
input[type=radio]:nth-child(1):checked ~ .carousel6__prev > label:nth-child(4) { opacity: 1 !important; z-index: 3;}

.carousel7 > 
input[type=radio]:nth-child(4):checked ~ .carousel7__next > label:nth-child(1), .carousel7 > 
input[type=radio]:nth-child(4):checked ~ .carousel7__prev > label:nth-child(3), .carousel7 > 
input[type=radio]:nth-child(3):checked ~ .carousel7__next > label:nth-child(4), .carousel7 > 
input[type=radio]:nth-child(3):checked ~ .carousel7__prev > label:nth-child(2), .carousel7 > 
input[type=radio]:nth-child(2):checked ~ .carousel7__next > label:nth-child(3), .carousel7 > 
input[type=radio]:nth-child(2):checked ~ .carousel7__prev > label:nth-child(1), .carousel7 > 
input[type=radio]:nth-child(1):checked ~ .carousel7__next > label:nth-child(2), .carousel7 > 
input[type=radio]:nth-child(1):checked ~ .carousel7__prev > label:nth-child(4) { opacity: 1 !important; z-index: 3;}

*,
*:before,
*:after { box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;}
body { background: #fcfcfc; margin: 0;}

.container1 { width: 100%; min-width: 100%; margin: 50px auto;}
.carousel1 { width: 100%; position: relative; overflow: hidden;}
.carousel1 > input[type=radio] { position: absolute; left: 0; opacity: 0; top: 0;}
.carousel1 > input[type=radio]:checked ~ .carousel1__items .carousel1__item,
.carousel1 > input[type=radio]:checked ~ .carousel1__prev > label,
.carousel1 > input[type=radio]:checked ~ .carousel1__next > label { opacity: 0;}
.carousel1 > input[type=radio]:nth-child(1):checked ~ .carousel1__items .carousel1__item:nth-child(1) { opacity: 1;}
.carousel1 > input[type=radio]:nth-child(1):checked ~ .carousel1__nav > label:nth-child(1) { background: #ccc; cursor: default; pointer-events: none;}
.carousel1 > input[type=radio]:nth-child(2):checked ~ .carousel1__items .carousel1__item:nth-child(2) { opacity: 1;}
.carousel1 > input[type=radio]:nth-child(2):checked ~ .carousel1__nav > label:nth-child(2) { background: #ccc; cursor: default; pointer-events: none;}
.carousel1 > input[type=radio]:nth-child(3):checked ~ .carousel1__items .carousel1__item:nth-child(3) { opacity: 1;}
.carousel1 > input[type=radio]:nth-child(3):checked ~ .carousel1__nav > label:nth-child(3) { background: #ccc; cursor: default; pointer-events: none;}
.carousel1 > input[type=radio]:nth-child(4):checked ~ .carousel1__items .carousel1__item:nth-child(4) { opacity: 1;}
.carousel1 > input[type=radio]:nth-child(4):checked ~ .carousel1__nav > label:nth-child(4) { background: #ccc; cursor: default; pointer-events: none;}
.carousel1__items { margin: 0; padding: 0; list-style-type: none; width: 100%; height: 520px; position: relative;}
.carousel1__item { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; transition: opacity 2s; -webkit-transition: opacity 2s;}
.carousel1__item img { width: 100%; vertical-align: middle;}
.carousel1__prev > label, .carousel1__next > label { border: 1px solid #fff; border-radius: 50%; cursor: pointer; display: block; width: 30px; height: 30px; position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); transition: all 0.3s ease; -webkit-transition: all 0.3s ease; opacity: 0; z-index: 2;}
.carousel1__prev > label:hover, .carousel1__prev > label:focus, .carousel1__next > label:hover, .carousel1__next > label:focus { opacity: 0.5 !important;}
.carousel1__prev > label:before, .carousel1__prev > label:after, .carousel1__next > label:before, .carousel1__next > label:after { content: ""; position: absolute; width: inherit; height: inherit;}
.carousel1__prev > label:before, .carousel1__next > label:before { background: linear-gradient(to top, #fff 0%, #fff 10%, rgba(51, 51, 51, 0) 10%), linear-gradient(to left, #fff 0%, #fff 10%, rgba(51, 51, 51, 0) 10%); width: 60%; height: 60%; top: 20%;}
.carousel1__prev > label { left: 2%;}
.carousel1__prev > label:before { left: 35%; top: 20%; transform: rotate(135deg); -webkit-transform: rotate(135deg);}
.carousel1__next > label { right: 2%;}
.carousel1__next > label:before { left: 10%; transform: rotate(315deg); -webkit-transform: rotate(315deg);}
.carousel1__nav { position: absolute; bottom: 3%; left: 0; text-align: center; width: 100%; z-index: 3;}
.carousel1__nav > label { border: 1px solid #fff; display: inline-block; border-radius: 50%; cursor: pointer; margin: 0 0.125%; width: 10px; height: 10px;}

.container2 { width: 100%; min-width: 100%; margin: 50px auto;}
.carousel2 { width: 100%; position: relative; overflow: hidden;}
.carousel2 > input[type=radio] { position: absolute; left: 0; opacity: 0; top: 0;}
.carousel2 > input[type=radio]:checked ~ .carousel2__items .carousel2__item,
.carousel2 > input[type=radio]:checked ~ .carousel2__prev > label,
.carousel2 > input[type=radio]:checked ~ .carousel2__next > label { opacity: 0;}
.carousel2 > input[type=radio]:nth-child(1):checked ~ .carousel2__items .carousel2__item:nth-child(1) { opacity: 1;}
.carousel2 > input[type=radio]:nth-child(1):checked ~ .carousel2__nav > label:nth-child(1) { background: #ccc; cursor: default; pointer-events: none;}
.carousel2 > input[type=radio]:nth-child(2):checked ~ .carousel2__items .carousel2__item:nth-child(2) { opacity: 1;}
.carousel2 > input[type=radio]:nth-child(2):checked ~ .carousel2__nav > label:nth-child(2) { background: #ccc; cursor: default; pointer-events: none;}
.carousel2 > input[type=radio]:nth-child(3):checked ~ .carousel2__items .carousel2__item:nth-child(3) { opacity: 1;}
.carousel2 > input[type=radio]:nth-child(3):checked ~ .carousel2__nav > label:nth-child(3) { background: #ccc; cursor: default; pointer-events: none;}
.carousel2 > input[type=radio]:nth-child(4):checked ~ .carousel2__items .carousel2__item:nth-child(4) { opacity: 1;}
.carousel2 > input[type=radio]:nth-child(4):checked ~ .carousel2__nav > label:nth-child(4) { background: #ccc; cursor: default; pointer-events: none;}
.carousel2__items { margin: 0; padding: 0; list-style-type: none; width: 100%; height: 520px; position: relative;}
.carousel2__item { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; transition: opacity 2s; -webkit-transition: opacity 2s;}
.carousel2__item img { width: 100%; vertical-align: middle;}
.carousel2__prev > label, .carousel2__next > label { border: 1px solid #fff; border-radius: 50%; cursor: pointer; display: block; width: 30px; height: 30px; position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); transition: all 0.3s ease; -webkit-transition: all 0.3s ease; opacity: 0; z-index: 2;}
.carousel2__prev > label:hover, .carousel2__prev > label:focus, .carousel2__next > label:hover, .carousel2__next > label:focus { opacity: 0.5 !important;}
.carousel2__prev > label:before, .carousel2__prev > label:after, .carousel2__next > label:before, .carousel2__next > label:after { content: ""; position: absolute; width: inherit; height: inherit;}
.carousel2__prev > label:before, .carousel2__next > label:before { background: linear-gradient(to top, #fff 0%, #fff 10%, rgba(51, 51, 51, 0) 10%), linear-gradient(to left, #fff 0%, #fff 10%, rgba(51, 51, 51, 0) 10%); width: 60%; height: 60%; top: 20%;}
.carousel2__prev > label { left: 2%;}
.carousel2__prev > label:before { left: 35%; top: 20%; transform: rotate(135deg); -webkit-transform: rotate(135deg);}
.carousel2__next > label { right: 2%;}
.carousel2__next > label:before { left: 10%; transform: rotate(315deg); -webkit-transform: rotate(315deg);}
.carousel2__nav { position: absolute; bottom: 3%; left: 0; text-align: center; width: 100%; z-index: 3;}
.carousel2__nav > label { border: 1px solid #fff; display: inline-block; border-radius: 50%; cursor: pointer; margin: 0 0.125%; width: 10px; height: 10px;}

.container3 { width: 100%; min-width: 100%; margin: 50px auto;}
.carousel3 { width: 100%; position: relative; overflow: hidden;}
.carousel3 > input[type=radio] { position: absolute; left: 0; opacity: 0; top: 0;}
.carousel3 > input[type=radio]:checked ~ .carousel3__items .carousel3__item,
.carousel3 > input[type=radio]:checked ~ .carousel3__prev > label,
.carousel3 > input[type=radio]:checked ~ .carousel3__next > label { opacity: 0;}
.carousel3 > input[type=radio]:nth-child(1):checked ~ .carousel3__items .carousel3__item:nth-child(1) { opacity: 1;}
.carousel3 > input[type=radio]:nth-child(1):checked ~ .carousel3__nav > label:nth-child(1) { background: #ccc; cursor: default; pointer-events: none;}
.carousel3 > input[type=radio]:nth-child(2):checked ~ .carousel3__items .carousel3__item:nth-child(2) { opacity: 1;}
.carousel3 > input[type=radio]:nth-child(2):checked ~ .carousel3__nav > label:nth-child(2) { background: #ccc; cursor: default; pointer-events: none;}
.carousel3 > input[type=radio]:nth-child(3):checked ~ .carousel3__items .carousel3__item:nth-child(3) { opacity: 1;}
.carousel3 > input[type=radio]:nth-child(3):checked ~ .carousel3__nav > label:nth-child(3) { background: #ccc; cursor: default; pointer-events: none;}
.carousel3 > input[type=radio]:nth-child(4):checked ~ .carousel3__items .carousel3__item:nth-child(4) { opacity: 1;}
.carousel3 > input[type=radio]:nth-child(4):checked ~ .carousel3__nav > label:nth-child(4) { background: #ccc; cursor: default; pointer-events: none;}
.carousel3__items { margin: 0; padding: 0; list-style-type: none; width: 100%; height: 520px; position: relative;}
.carousel3__item { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; transition: opacity 2s; -webkit-transition: opacity 2s;}
.carousel3__item img { width: 100%; vertical-align: middle;}
.carousel3__prev > label, .carousel3__next > label { border: 1px solid #fff; border-radius: 50%; cursor: pointer; display: block; width: 30px; height: 30px; position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); transition: all 0.3s ease; -webkit-transition: all 0.3s ease; opacity: 0; z-index: 2;}
.carousel3__prev > label:hover, .carousel3__prev > label:focus, .carousel3__next > label:hover, .carousel3__next > label:focus { opacity: 0.5 !important;}
.carousel3__prev > label:before, .carousel3__prev > label:after, .carousel3__next > label:before, .carousel3__next > label:after { content: ""; position: absolute; width: inherit; height: inherit;}
.carousel3__prev > label:before, .carousel3__next > label:before { background: linear-gradient(to top, #fff 0%, #fff 10%, rgba(51, 51, 51, 0) 10%), linear-gradient(to left, #fff 0%, #fff 10%, rgba(51, 51, 51, 0) 10%); width: 60%; height: 60%; top: 20%;}
.carousel3__prev > label { left: 2%;}
.carousel3__prev > label:before { left: 35%; top: 20%; transform: rotate(135deg); -webkit-transform: rotate(135deg);}
.carousel3__next > label { right: 2%;}
.carousel3__next > label:before { left: 10%; transform: rotate(315deg); -webkit-transform: rotate(315deg);}
.carousel3__nav { position: absolute; bottom: 3%; left: 0; text-align: center; width: 100%; z-index: 3;}
.carousel3__nav > label { border: 1px solid #fff; display: inline-block; border-radius: 50%; cursor: pointer; margin: 0 0.125%; width: 10px; height: 10px;}

.container4 { width: 100%; min-width: 100%; margin: 50px auto;}
.carousel4 { width: 100%; position: relative; overflow: hidden;}
.carousel4 > input[type=radio] { position: absolute; left: 0; opacity: 0; top: 0;}
.carousel4 > input[type=radio]:checked ~ .carousel4__items .carousel4__item,
.carousel4 > input[type=radio]:checked ~ .carousel4__prev > label,
.carousel4 > input[type=radio]:checked ~ .carousel4__next > label { opacity: 0;}
.carousel4 > input[type=radio]:nth-child(1):checked ~ .carousel4__items .carousel4__item:nth-child(1) { opacity: 1;}
.carousel4 > input[type=radio]:nth-child(1):checked ~ .carousel4__nav > label:nth-child(1) { background: #ccc; cursor: default; pointer-events: none;}
.carousel4 > input[type=radio]:nth-child(2):checked ~ .carousel4__items .carousel4__item:nth-child(2) { opacity: 1;}
.carousel4 > input[type=radio]:nth-child(2):checked ~ .carousel4__nav > label:nth-child(2) { background: #ccc; cursor: default; pointer-events: none;}
.carousel4 > input[type=radio]:nth-child(3):checked ~ .carousel4__items .carousel4__item:nth-child(3) { opacity: 1;}
.carousel4 > input[type=radio]:nth-child(3):checked ~ .carousel4__nav > label:nth-child(3) { background: #ccc; cursor: default; pointer-events: none;}
.carousel4 > input[type=radio]:nth-child(4):checked ~ .carousel4__items .carousel4__item:nth-child(4) { opacity: 1;}
.carousel4 > input[type=radio]:nth-child(4):checked ~ .carousel4__nav > label:nth-child(4) { background: #ccc; cursor: default; pointer-events: none;}
.carousel4__items { margin: 0; padding: 0; list-style-type: none; width: 100%; height: 520px; position: relative;}
.carousel4__item { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; transition: opacity 2s; -webkit-transition: opacity 2s;}
.carousel4__item img { width: 100%; vertical-align: middle;}
.carousel4__prev > label, .carousel4__next > label { border: 1px solid #fff; border-radius: 50%; cursor: pointer; display: block; width: 30px; height: 30px; position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); transition: all 0.3s ease; -webkit-transition: all 0.3s ease; opacity: 0; z-index: 2;}
.carousel4__prev > label:hover, .carousel4__prev > label:focus, .carousel4__next > label:hover, .carousel4__next > label:focus { opacity: 0.5 !important;}
.carousel4__prev > label:before, .carousel4__prev > label:after, .carousel4__next > label:before, .carousel4__next > label:after { content: ""; position: absolute; width: inherit; height: inherit;}
.carousel4__prev > label:before, .carousel4__next > label:before { background: linear-gradient(to top, #fff 0%, #fff 10%, rgba(51, 51, 51, 0) 10%), linear-gradient(to left, #fff 0%, #fff 10%, rgba(51, 51, 51, 0) 10%); width: 60%; height: 60%; top: 20%;}
.carousel4__prev > label { left: 2%;}
.carousel4__prev > label:before { left: 35%; top: 20%; transform: rotate(135deg); -webkit-transform: rotate(135deg);}
.carousel4__next > label { right: 2%;}
.carousel4__next > label:before { left: 10%; transform: rotate(315deg); -webkit-transform: rotate(315deg);}
.carousel4__nav { position: absolute; bottom: 3%; left: 0; text-align: center; width: 100%; z-index: 3;}
.carousel4__nav > label { border: 1px solid #fff; display: inline-block; border-radius: 50%; cursor: pointer; margin: 0 0.125%; width: 10px; height: 10px;}

.container5 { width: 100%; min-width: 100%; margin: 50px auto;}
.carousel5 { width: 100%; position: relative; overflow: hidden;}
.carousel5 > input[type=radio] { position: absolute; left: 0; opacity: 0; top: 0;}
.carousel5 > input[type=radio]:checked ~ .carousel5__items .carousel5__item,
.carousel5 > input[type=radio]:checked ~ .carousel5__prev > label,
.carousel5 > input[type=radio]:checked ~ .carousel5__next > label { opacity: 0;}
.carousel5 > input[type=radio]:nth-child(1):checked ~ .carousel5__items .carousel5__item:nth-child(1) { opacity: 1;}
.carousel5 > input[type=radio]:nth-child(1):checked ~ .carousel5__nav > label:nth-child(1) { background: #ccc; cursor: default; pointer-events: none;}
.carousel5 > input[type=radio]:nth-child(2):checked ~ .carousel5__items .carousel5__item:nth-child(2) { opacity: 1;}
.carousel5 > input[type=radio]:nth-child(2):checked ~ .carousel5__nav > label:nth-child(2) { background: #ccc; cursor: default; pointer-events: none;}
.carousel5 > input[type=radio]:nth-child(3):checked ~ .carousel5__items .carousel5__item:nth-child(3) { opacity: 1;}
.carousel5 > input[type=radio]:nth-child(3):checked ~ .carousel5__nav > label:nth-child(3) { background: #ccc; cursor: default; pointer-events: none;}
.carousel5 > input[type=radio]:nth-child(4):checked ~ .carousel5__items .carousel5__item:nth-child(4) { opacity: 1;}
.carousel5 > input[type=radio]:nth-child(4):checked ~ .carousel5__nav > label:nth-child(4) { background: #ccc; cursor: default; pointer-events: none;}
.carousel5__items { margin: 0; padding: 0; list-style-type: none; width: 100%; height: 520px; position: relative;}
.carousel5__item { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; transition: opacity 2s; -webkit-transition: opacity 2s;}
.carousel5__item img { width: 100%; vertical-align: middle;}
.carousel5__prev > label, .carousel5__next > label { border: 1px solid #fff; border-radius: 50%; cursor: pointer; display: block; width: 30px; height: 30px; position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); transition: all 0.3s ease; -webkit-transition: all 0.3s ease; opacity: 0; z-index: 2;}
.carousel5__prev > label:hover, .carousel5__prev > label:focus, .carousel5__next > label:hover, .carousel5__next > label:focus { opacity: 0.5 !important;}
.carousel5__prev > label:before, .carousel5__prev > label:after, .carousel5__next > label:before, .carousel5__next > label:after { content: ""; position: absolute; width: inherit; height: inherit;}
.carousel5__prev > label:before, .carousel5__next > label:before { background: linear-gradient(to top, #fff 0%, #fff 10%, rgba(51, 51, 51, 0) 10%), linear-gradient(to left, #fff 0%, #fff 10%, rgba(51, 51, 51, 0) 10%); width: 60%; height: 60%; top: 20%;}
.carousel5__prev > label { left: 2%;}
.carousel5__prev > label:before { left: 35%; top: 20%; transform: rotate(135deg); -webkit-transform: rotate(135deg);}
.carousel5__next > label { right: 2%;}
.carousel5__next > label:before { left: 10%; transform: rotate(315deg); -webkit-transform: rotate(315deg);}
.carousel5__nav { position: absolute; bottom: 3%; left: 0; text-align: center; width: 100%; z-index: 3;}
.carousel5__nav > label { border: 1px solid #fff; display: inline-block; border-radius: 50%; cursor: pointer; margin: 0 0.125%; width: 10px; height: 10px;}

.container6 { width: 100%; min-width: 100%; margin: 50px auto;}
.carousel6 { width: 100%; position: relative; overflow: hidden;}
.carousel6 > input[type=radio] { position: absolute; left: 0; opacity: 0; top: 0;}
.carousel6 > input[type=radio]:checked ~ .carousel6__items .carousel6__item,
.carousel6 > input[type=radio]:checked ~ .carousel6__prev > label,
.carousel6 > input[type=radio]:checked ~ .carousel6__next > label { opacity: 0;}
.carousel6 > input[type=radio]:nth-child(1):checked ~ .carousel6__items .carousel6__item:nth-child(1) { opacity: 1;}
.carousel6 > input[type=radio]:nth-child(1):checked ~ .carousel6__nav > label:nth-child(1) { background: #ccc; cursor: default; pointer-events: none;}
.carousel6 > input[type=radio]:nth-child(2):checked ~ .carousel6__items .carousel6__item:nth-child(2) { opacity: 1;}
.carousel6 > input[type=radio]:nth-child(2):checked ~ .carousel6__nav > label:nth-child(2) { background: #ccc; cursor: default; pointer-events: none;}
.carousel6 > input[type=radio]:nth-child(3):checked ~ .carousel6__items .carousel6__item:nth-child(3) { opacity: 1;}
.carousel6 > input[type=radio]:nth-child(3):checked ~ .carousel6__nav > label:nth-child(3) { background: #ccc; cursor: default; pointer-events: none;}
.carousel6 > input[type=radio]:nth-child(4):checked ~ .carousel6__items .carousel6__item:nth-child(4) { opacity: 1;}
.carousel6 > input[type=radio]:nth-child(4):checked ~ .carousel6__nav > label:nth-child(4) { background: #ccc; cursor: default; pointer-events: none;}
.carousel6__items { margin: 0; padding: 0; list-style-type: none; width: 100%; height: 520px; position: relative;}
.carousel6__item { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; transition: opacity 2s; -webkit-transition: opacity 2s;}
.carousel6__item img { width: 100%; vertical-align: middle;}
.carousel6__prev > label, .carousel6__next > label { border: 1px solid #fff; border-radius: 50%; cursor: pointer; display: block; width: 30px; height: 30px; position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); transition: all 0.3s ease; -webkit-transition: all 0.3s ease; opacity: 0; z-index: 2;}
.carousel6__prev > label:hover, .carousel6__prev > label:focus, .carousel6__next > label:hover, .carousel6__next > label:focus { opacity: 0.5 !important;}
.carousel6__prev > label:before, .carousel6__prev > label:after, .carousel6__next > label:before, .carousel6__next > label:after { content: ""; position: absolute; width: inherit; height: inherit;}
.carousel6__prev > label:before, .carousel6__next > label:before { background: linear-gradient(to top, #fff 0%, #fff 10%, rgba(51, 51, 51, 0) 10%), linear-gradient(to left, #fff 0%, #fff 10%, rgba(51, 51, 51, 0) 10%); width: 60%; height: 60%; top: 20%;}
.carousel6__prev > label { left: 2%;}
.carousel6__prev > label:before { left: 35%; top: 20%; transform: rotate(135deg); -webkit-transform: rotate(135deg);}
.carousel6__next > label { right: 2%;}
.carousel6__next > label:before { left: 10%; transform: rotate(315deg); -webkit-transform: rotate(315deg);}
.carousel6__nav { position: absolute; bottom: 3%; left: 0; text-align: center; width: 100%; z-index: 3;}
.carousel6__nav > label { border: 1px solid #fff; display: inline-block; border-radius: 50%; cursor: pointer; margin: 0 0.125%; width: 10px; height: 10px;}

.container7 { width: 100%; min-width: 100%; margin: 50px auto;}
.carousel7 { width: 100%; position: relative; overflow: hidden;}
.carousel7 > input[type=radio] { position: absolute; left: 0; opacity: 0; top: 0;}
.carousel7 > input[type=radio]:checked ~ .carousel7__items .carousel7__item,
.carousel7 > input[type=radio]:checked ~ .carousel7__prev > label,
.carousel7 > input[type=radio]:checked ~ .carousel7__next > label { opacity: 0;}
.carousel7 > input[type=radio]:nth-child(1):checked ~ .carousel7__items .carousel7__item:nth-child(1) { opacity: 1;}
.carousel7 > input[type=radio]:nth-child(1):checked ~ .carousel7__nav > label:nth-child(1) { background: #ccc; cursor: default; pointer-events: none;}
.carousel7 > input[type=radio]:nth-child(2):checked ~ .carousel7__items .carousel7__item:nth-child(2) { opacity: 1;}
.carousel7 > input[type=radio]:nth-child(2):checked ~ .carousel7__nav > label:nth-child(2) { background: #ccc; cursor: default; pointer-events: none;}
.carousel7 > input[type=radio]:nth-child(3):checked ~ .carousel7__items .carousel7__item:nth-child(3) { opacity: 1;}
.carousel7 > input[type=radio]:nth-child(3):checked ~ .carousel7__nav > label:nth-child(3) { background: #ccc; cursor: default; pointer-events: none;}
.carousel7 > input[type=radio]:nth-child(4):checked ~ .carousel7__items .carousel7__item:nth-child(4) { opacity: 1;}
.carousel7 > input[type=radio]:nth-child(4):checked ~ .carousel7__nav > label:nth-child(4) { background: #ccc; cursor: default; pointer-events: none;}
.carousel7__items { margin: 0; padding: 0; list-style-type: none; width: 100%; height: 520px; position: relative;}
.carousel7__item { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; transition: opacity 2s; -webkit-transition: opacity 2s;}
.carousel7__item img { width: 100%; vertical-align: middle;}
.carousel7__prev > label, .carousel5__next > label { border: 1px solid #fff; border-radius: 50%; cursor: pointer; display: block; width: 30px; height: 30px; position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); transition: all 0.3s ease; -webkit-transition: all 0.3s ease; opacity: 0; z-index: 2;}
.carousel7__prev > label:hover, .carousel7__prev > label:focus, .carousel7__next > label:hover, .carousel7__next > label:focus { opacity: 0.5 !important;}
.carousel7__prev > label:before, .carousel7__prev > label:after, .carousel7__next > label:before, .carousel7__next > label:after { content: ""; position: absolute; width: inherit; height: inherit;}
.carousel7__prev > label:before, .carousel7__next > label:before { background: linear-gradient(to top, #fff 0%, #fff 10%, rgba(51, 51, 51, 0) 10%), linear-gradient(to left, #fff 0%, #fff 10%, rgba(51, 51, 51, 0) 10%); width: 60%; height: 60%; top: 20%;}
.carousel7__prev > label { left: 2%;}
.carousel7__prev > label:before { left: 35%; top: 20%; transform: rotate(135deg); -webkit-transform: rotate(135deg);}
.carousel7__next > label { right: 2%;}
.carousel7__next > label:before { left: 10%; transform: rotate(315deg); -webkit-transform: rotate(315deg);}
.carousel7__nav { position: absolute; bottom: 3%; left: 0; text-align: center; width: 100%; z-index: 3;}
.carousel7__nav > label { border: 1px solid #fff; display: inline-block; border-radius: 50%; cursor: pointer; margin: 0 0.125%; width: 10px; height: 10px;}
