body {
    margin: 0;
    padding: 4px;
    background-color: #ffffff;
}

img {
    border: none;
    margin: 0px;
}

img.news {
    float: left;
    margin: 0px 8px 8px 0px;
}

a { text-decoration: none; }

table     { width: 100%; font-size: 14px; border: none; border-collapse: separate; border-spacing: 2px; }
th, td    { vertical-align: top; padding: 2px; }
tr.ttitle { background-color: #f0f0f0; }
tr.trow   { background-color: #f8f8f8; }

/* збільшення стрілок каруселі  */
.carousel-control-next-icon, .carousel-control-prev-icon {
    width: 50px;
    height: 50px;
}

/* оформлення елементів фотогалереї  */
.thumb img {
    -webkit-filter: grayscale(0);
    filter: none;
    border-radius: 5px;
    background-color: #fff;
    border: 1px solid #ddd;
    padding: 5px;
}

.thumb img:hover {
    -webkit-filter: grayscale(1);
    filter: grayscale(1);
}

.thumb {
    padding: 5px;
}

/* центрування елементів всередини col */
.col-centered {
    display:inline-block;
    float:none;
    /* reset the text-align */
    text-align:left;
    /* inline-block space fix */
    text-align: center;
}

div.mouse {
    border: 1px solid #d8d8d8;
    border-radius:5px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
}

div.mouse:hover {
    box-shadow:0 0 5px rgba(128,128,128,.5);
    -moz-box-shadow:0 0 5px rgba(128,128,128,.5);
    -webkit-box-shadow:0 0 5px rgba(128,128,128,.5);
}

.cube {
    position: absolute;
    top: 5px; left: 5px; width: 120px; height: 120px;
    padding: 8px; background-color: #ffffff;
    border: 2px #ffffff solid;
    cursor: pointer;

    border-radius:8px;
    -moz-border-radius:8px;
    -webkit-border-radius:8px;

    box-shadow:0 0 8px rgba(128,128,128,.5);
    -moz-box-shadow:0 0 8px rgba(128,128,128,.5);
    -webkit-box-shadow:0 0 8px rgba(128,128,128,.5);
}

.cube:hover {
    border: 2px #d0d0d0 solid;
}

.box_justify {
    text-align: justify;
    text-justify: inter-word;
}

/* круг */
.d1 {
    position: absolute;
    top: 5px; left: 5px;
    width: 24px;
    height: 24px;
    background: #000000;
    border-radius: 50%;
}

header {
    position: relative;
    height: 280px;
    background-image: linear-gradient(#EC5D59, #EC5D59);
    padding: 8px;
    margin: 0px;
    overflow: hidden;
}

header h1 {
    color: white;
    text-align: left;
    font-size: 24px;
    font-family: 'Comic Sans MS';
}

header svg {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 10vw;
    /* set height to pixels if you want angle to change with screen width */
}

.bottom {
    position: relative;
    height: 180px;
    background-image: linear-gradient(#333333, #333333);
    padding: 8px;
    margin: 0px;
    overflow: hidden;
}

.bottom svg {
    position: absolute;
    top: 0;
    width: 100%;
    height: 10vw;
    /* set height to pixels if you want angle to change with screen width */
}

div.box_grad {
padding: 8px;
/* For WebKit (Safari, Google Chrome etc) */
background: -webkit-gradient(linear, left top, left bottom, from(#F8F8F8), to(#FFFFFF));
/* For Mozilla/Gecko (Firefox etc) */
background: -moz-linear-gradient(top, #F8F8F8, #FFFFFF);
/* For Opera */
background: -o-linear-gradient(top, #F8F8F8, #FFFFFF);
/* For Internet Explorer */
filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr='#F8F8F8', endColorStr='#FFFFFF', gradientType='0')
}