/*ROLL-UP---------------------------------------------------------------*/

@charset "UTF-8";
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,300&subset=latin,cyrillic);
*, ::after, ::before {
    box-sizing: border-box;
}
/*html, body {
    height: 100%;
    margin:0;
    padding:0;
}
body {
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
}*/
/* demo контейнер */
.Rollup {
    padding: 0 5px;
}
/* скрываем чекбоксы и блоки с содержанием */
.hide,
.hide + label ~ div {
    display: none;
    /*height: 135px;*/
}
/* вид текста label */
.hide + label {
    margin: 0;
    padding: 0;
    cursor: pointer;
    display: inline-block;
}
/* вид текста label при активном переключателе */
.hide:checked + label {
    border-bottom: 0;
}
/* когда чекбокс активен показываем блоки с содержанием  */
.hide:checked + label + div {
    display: block;
    background: #efefef;
    /*-moz-box-shadow: inset 3px 3px 10px #7d8e8f;
    -webkit-box-shadow: inset 3px 3px 10px #7d8e8f;
    box-shadow: inset 3px 3px 10px #7d8e8f;*?
    /* чуточку анимации при появлении */
    /*padding-top: 10px;*/
    -webkit-animation:fade ease-in 0.5s;
    -moz-animation:fade ease-in 0.5s;
    animation:fade ease-in 0.5s;
}
/* анимация при появлении скрытых блоков */
@-moz-keyframes fade {
    from { opacity: 0; }
    to { opacity: 1 }
}
@-webkit-keyframes fade {
    from { opacity: 0; }
    to { opacity: 1 }
}
@keyframes fade {
    from { opacity: 0; }
    to { opacity: 1 }
}
.hide + label:before {
    content: "\002B";
    display: block;
    float: left;
    font-size: 14px;
    font-weight: bold;
    height: 16px;
    line-height: 16px;
    margin: 3px 5px;
    text-align: center;
    width: 16px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}
.hide:checked + label:before {
    content: "\2212";
}

/* Стрелки*/

.arrow {
    border: solid black;
    border-width: 0 3px 3px 0;
    display: inline-block;
    padding: 10px;
}

.arrow-right {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
}

.arrow-left {
    transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
}

.arrow-up {
    transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
}

.arrow-down {
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}

.test1 {

}

/* Обвести в кружок */

.numberCircle {
    border: 0.1em solid #800;
    border-radius: 50%;
}

.fullCircle {
    border: 1px solid #000;
    border-radius: 50%;
}