body{
    font-family: "Arial", sans-serif;
}
html{
    width: 100%;
}
hr.divider {
    max-width: 3.25rem;
    border-width: 0.2rem;
    border-color: #00A9E0;
}

hr.light {
    border-color: #fff;
}
.transparentbutton{
    border-color: transparent!important;
    background-color: transparent!important;
}
.transparentbutton::after{
    display: none!important;
}
.transparentbutton:hover,.transparentbutton:active,.transparentbutton:focus,.transparentbutton.show{
    border-color: transparent!important;
    background-color: transparent!important;
    box-shadow: transparent!important;
}
/*стилі для самоскладуваних дропдаун пунктів*/
.info-box__content {
    display: none;
}

.info-box {
    border: 1px solid black;
    border-radius: 5px;
}
.info-box__title{
    text-decoration: underline #78BE20;
    cursor: pointer;
}
/**/

.btn-xl {
    padding: 1.25rem 2.25rem;
    font-size: 0.85rem;
    font-weight: 700;
    text-transform: uppercase;
    border: none;
    border-radius: 10rem;
}

.page-section {
    padding: 8rem 0;
}

#mainNav {
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    background-color: #fff;
    transition: background-color 0.2s ease;
}
#mainNav .navbar-brand {
    font-weight: 700;
    color: #212529;
}
#mainNav .navbar-nav .nav-item .nav-link {
    color: #6c757d;
    font-weight: 700;
    font-size: 0.9rem;
    padding: 0.75rem 0;
}
#mainNav .navbar-nav .nav-item .nav-link:hover, #mainNav .navbar-nav .nav-item .nav-link:active {
    color: #00A9E0;
}
#mainNav .navbar-nav .nav-item .nav-link.active {
    color: #00A9E0!important;
}
.biglogo{
    width: 280px;
}
@media (max-width: 991px) {
    h1:hover{
        animation: none!important;
        -webkit-animation: none!important;
        -moz-animation: none!important;
    }
    .biglogo{
        width: 220px;
        padding: 5px;
    }
    .whiteimg{
        display: none!important;
    }
    .colorimg{
        display: block!important;
    }
    .navbar .btn a{
        color: black!important;
    }
    .navbar .btn a:hover{
        color: black!important;
    }
    .navbar .mr-auto .btn{
        font-size: 1rem;
    }
    /*
    .navbar .row .btn{
        font-size: 0.8rem;
    }*/
    .navbar-toggler-icon{
        background-image: url(../img/menu.png)!important;
    }
    .increase-plugin-ac,.decrease-plugin-ac{
        cursor: pointer;
    }
    @media (max-width: 330px) {
        .biglogo,.whiteimg{
            width: 200px;
            padding: 5px;
        }
        h1{
            font-size: 2.35rem!important;
        }
    }
}

@media (min-width: 992px) {
    #mainNav {
        box-shadow: none;
        background-color: transparent;
    }
    /*
    #mainNav img{
        filter: invert(99%) sepia(1%) saturate(1870%) hue-rotate(311deg) brightness(114%) contrast(100%);
    }
    */
    .form-inline img{
        filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(57deg) brightness(105%) contrast(104%);
    }
    #mainNav .navbar-brand {
        color: rgba(255, 255, 255, 0.7);
    }
    #mainNav .navbar-brand:hover {
        color: #fff;
    }
    #mainNav .navbar-nav .nav-item .nav-link {
        color: #ffffff;
        padding: 0 1rem;
    }
    #mainNav .navbar-nav .nav-item .nav-link:hover {
        color: #fff;
    }
    #mainNav .navbar-nav .nav-item:last-child .nav-link {
        padding-right: 0;
    }
    #mainNav.navbar-scrolled {
        box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
        background-color: #fff;
    }
    #mainNav.navbar-scrolled .navbar-brand {
        color: #212529;
    }
    #mainNav.navbar-scrolled .navbar-brand:hover {
        color: #00A9E0;
    }
    #mainNav.navbar-scrolled .navbar-nav .nav-item .nav-link {
        color: #212529;
    }
    #mainNav.navbar-scrolled .navbar-nav .nav-item .nav-link:hover {
        color: #00A9E0;
    }
    #mainNav.navbar-scrolled img{
        filter: none;
    }
}
/*кольори енери для синьої кнопки*/
.btn-outline-info{
    border-color: #00A9E0;
}
.btn-outline-info:hover,.btn-outline-info:active,.btn-outline-info:not(:disabled):not(.disabled):active{
    background-color: #00A9E0;
}
.btn-outline-info:not(:disabled):not(.disabled).active{
    background-color: #00A9E0;
    border-color: #00A9E0;
}
/*кінець кастомайз для кнопок*/
/*Заготовки для svg іконок */
.icon16{
    width: 16px;
    height: 16px;
}
.icon32{
    width: 32px;
    height: 32px;
}
.icon64{
    width: 64px;
    height: 64px;
}
.icon128{
    width: 128px;
    height: 128px;
}
header.masthead {
    padding-top: 10rem;
    padding-bottom: calc(10rem - 4.5rem);
    /*
    background: linear-gradient(to bottom, rgb(162 162 162 / 80%) 0%, rgb(70 70 70 / 80%) 100%), url(../img/bg-masthead.jpg);
    */
    /*
    background: linear-gradient(to bottom, rgb(87 199 255 / 64%) 0%, rgb(0 0 0 / 19%) 100%), url(../img/bg-masthead6.jpg);
    */
    /*
    background: linear-gradient(to bottom, rgb(252 253 253 / 20%) 0%, rgb(0 0 0 / 19%) 100%), url(../img/bg-masthead8.jpg);
    */
    background: url(../img/bg-masthead8.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-size: cover;
}
header.masthead.biz{
    background: url(../img/background.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-size: cover;
}
header.masthead h1 {
    font-size: 2.75rem;
    text-shadow: 2px 1px 8px black;
}
@media (min-width: 992px) {
    header.masthead {
        height: 100vh;
        min-height: 40rem;
        padding-top: 4.5rem;
        padding-bottom: 0;
        text-shadow: 2px 2px 14px black;
    }
    header.masthead p {
        font-size: 1.15rem;
    }
    header.masthead h1 {
        font-size: 4rem;
    }

}
@media (min-width: 1200px) {
    header.masthead h1 {
        font-size: 4.5rem;
    }

}

.text-white-75 {
    color: rgba(255, 255, 255, 0.75);
}
#about{
    background-color: #00A9E0;
}
/* scrollbar */
::-webkit-scrollbar {
    width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #00A9E0;
}
::-webkit-scrollbar-thumb:window-inactive {
    background: #00A9E0;
}
.text-black{
    color: black!important;
}

/* Underline From Center */
.ufc{
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    position: relative;
    overflow: hidden;
}
.ufc:before {
    content: "";
    position: absolute;
    z-index: -1;
    left: 51%;
    right: 51%;
    bottom: 0;
    background: #00A9E0;
    height: 4px;
    -webkit-transition-property: left, right;
    transition-property: left, right;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}
.ufc:hover:before, .ufc:focus:before, .ufc:active:before {
    left: 0;
    right: 0;
}
.ufc.active:before{
    left: 0;
    right: 0;
}
/*end of underline*/

/* Pulse */
@-webkit-keyframes hvr-pulse {
    25% {
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }
    75% {
        -webkit-transform: scale(0.9);
        transform: scale(0.9);
    }
}
@keyframes hvr-pulse {
    25% {
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }
    75% {
        -webkit-transform: scale(0.9);
        transform: scale(0.9);
    }
}
.hvr-pulse {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}
.hvr-pulse:hover, .hvr-pulse:focus, .hvr-pulse:active {
    -webkit-animation-name: hvr-pulse;
    animation-name: hvr-pulse;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}
/*end of pulse*/
@font-face {
    font-family: 'Trebuchet MS';
    src: url('../fonts/Trebuchet-BoldItalic.eot');
    src: local('Trebuchet MS Bold Italic'), local('Trebuchet-BoldItalic'),
    url('../fonts/Trebuchet-BoldItalic.eot?#iefix') format('embedded-opentype'),
    url('../fonts/Trebuchet-BoldItalic.woff') format('woff'),
    url('../fonts/Trebuchet-BoldItalic.ttf') format('truetype');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: 'Trebuchet MS';
    src: url('../fonts/TrebuchetMS-Bold.eot');
    src: local('Trebuchet MS Bold'), local('TrebuchetMS-Bold'),
    url('../fonts/TrebuchetMS-Bold.eot?#iefix') format('embedded-opentype'),
    url('../fonts/TrebuchetMS-Bold.woff') format('woff'),
    url('../fonts/TrebuchetMS-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Trebuchet MS';
    src: url('../fonts/TrebuchetMS-Italic.eot');
    src: local('Trebuchet MS Italic'), local('TrebuchetMS-Italic'),
    url('../fonts/TrebuchetMS-Italic.eot?#iefix') format('embedded-opentype'),
    url('../fonts/TrebuchetMS-Italic.woff') format('woff'),
    url('../fonts/TrebuchetMS-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Trebuchet MS';
    src: url('../fonts/TrebuchetMS.eot');
    src: local('Trebuchet MS'), local('TrebuchetMS'),
    url('../fonts/TrebuchetMS.eot?#iefix') format('embedded-opentype'),
    url('../fonts/TrebuchetMS.woff') format('woff'),
    url('../fonts/TrebuchetMS.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
#ran:hover{
    fill: black;
}
#ran:active{
    fill: green;
}
#tooltip {
    background: white;
    border: 1px solid black;
    border-radius: 2px;
    padding: 5px;
    font-size: 22px;
}
.mobscale{
    display: none!important;
}
.mobscale1{
    display: block;
}
.tooltip_invoice{
    font-size: 1.2rem;
    padding: 4px;
    border-radius: 3px;
    box-shadow: 0 0 15px rgb(0 0 0 / 55%);
}
/*адаптив під мобільну версію*/
@media screen and (max-width: 991px) {
    .navbar .increase-plugin-ac, .navbar .decrease-plugin-ac, .navbar .increase-plugin-ac1, .navbar .decrease-plugin-ac1{
        color: black!important;
        text-shadow: none!important;
    }
    .mobscale{
        display: block!important;
        text-shadow: none!important;
    }
    .mobscale1{
        display: none!important;
    }
    .arrows{
        display: none;
    }
    .burgermenu, .biggertext{
        font-size: 0.9rem!important;
    }
    header.masthead{
        background-position: right;
        background-position-y: 25px;
    }
    header.masthead.biz{
        background-position: right;
        background-position-y: 25px;
    }
    .tooltip_regions_svg{
        width: 100%;
        height: 100%;
        background-color: transparent!important;
        padding: 0!important;
    }
    .tooltip_regions_svg .text-center{
        max-height: 200px;
        position: absolute;
        width: 100%;
        top: 50%;
        box-shadow: 0 0 15px rgba(0,0,0,0.5);
    }
    .tooltip_invoice{
        width: 100%;
        height: 100%;
        background-color: transparent!important;
        padding: 0!important;
    }
    .tooltip_invoice .text-center{
        max-height: 250px;
        position: absolute;
        width: 100%;
        top: 40%;
        box-shadow: 0 0 15px rgba(0,0,0,0.5);
    }
    #navbarResponsive{
        overflow-y: scroll !important;
        max-height: 600px !important;
    }
    @media screen  and (max-height: 680px){
        #navbarResponsive{
            max-height: 500px !important;
        }
    }
}
/*ховер ефект для карти*/
#reg:hover{
    fill: #78BE20;
}
#bg,#bg1,#bg2,#bg3,#bg4,#bg5,#bg6,#bg7,#bg8,#bg9{
    color: white;
}
/*зменшений розмір шрифтів для бургер-меню, для ноутбучних екранів*/
@media screen  and (min-width: 993px) and (max-width: 1400px) {
    .burgermenu{
        font-size: 0.95rem!important;
    }
    .burgermenuhead{
        font-size: 1.2rem!important;
    }
}

.navbar .increase-plugin-ac, .navbar .decrease-plugin-ac,.navbar .increase-plugin-ac1,
.navbar .decrease-plugin-ac1, .navbar .btn a,.navbar input,.navbar input:focus, .navbar input::placeholder{
    color: white;
    text-shadow: 1px 2px 2px black;
}
.navbar-scrolled .increase-plugin-ac, .navbar-scrolled .decrease-plugin-ac,.navbar-scrolled .increase-plugin-ac1,
.navbar-scrolled .decrease-plugin-ac1, .navbar-scrolled .btn a,.navbar-scrolled input ,.navbar-scrolled input:focus,
.navbar-scrolled input::placeholder{
    color: black;
    text-shadow: none!important;
}
.navbar .whiteimg{
    display: block;
    transition: all 0.2s linear;
}
.navbar .colorimg{
    display: none;
}
.navbar-scrolled .whiteimg, .navbar-scrolled .arrows{
    display: none;
}
.navbar-scrolled .colorimg{
    display: block;
    transition: all 0.2s linear;
}
.support{
    position: fixed;
    z-index: 100;
    right: 40px;
    bottom: 40px;
    display: inline-block;
    width: 102px;
    height: 144px;
    border-radius: 5%;
    background-color: #00A9E0;
    box-shadow: 0 0 15px rgb(0 0 0 / 55%);
    transition: all .3s ease-in-out;
    color: white;
    font-size: 1.1rem;
}
.support:hover{
    background-color: #00A9E0;
    color: white;
    text-decoration: none;
}
.support img{
    width: 84px;
    height: 84px;
}
.underline{
    text-decoration: underline;
}
.dropdown-toggle::after{
    display: none;
}
.tooltip .show{
    background-color: white!important;
}
.biggertext{
    font-size: 1.2rem;
}
.burgermenu{
    text-decoration: none;
    font-size: 1.2rem;
    color: black;
}
.burgermenu:hover{
    text-decoration: none;
    color: black;
}
.burgermenuhead{
    color: #00A9E0;
}


.navbar-nav .ufc{
    /*letter-spacing: 6px;*/
    font-size: 20px!important;
    font-weight: bold!important;
}
.ufc.active{
    background-color: transparent;
    color: black;
}

/* стрілки на головній*/

.arrows {
    width: 60px;
    height: 75px;
    position: absolute;
    left: 50%;
    margin-left: -30px;
    bottom: 1px;
}

.arrows path {
    /*
    stroke: #ffffff;
    */
    stroke: #00a9e0;
    fill: transparent;
    stroke-width: 6px;
    animation: arrow 2s infinite;
    -webkit-animation: arrow 2s infinite;
}

@keyframes arrow
{
    0% {opacity:0}
    40% {opacity:1}
    80% {opacity:0}
    100% {opacity:0}
}

@-webkit-keyframes arrow /*Safari and Chrome*/
{
    0% {opacity:0}
    40% {opacity:1}
    80% {opacity:0}
    100% {opacity:0}
}

.arrows path.a1 {
    animation-delay:-1s;
    -webkit-animation-delay:-1s;
}

.arrows path.a2 {
    animation-delay:-0.5s;
    -webkit-animation-delay:-0.5s;
}

.arrows path.a3 {
    animation-delay:0s;
    -webkit-animation-delay:0s;
}

/*стрілки кінець*/
.hr-line {
    border-bottom: 1px rgba(0, 0, 0, 0.125) solid;
}
.meditext {
    font-size: 1.15rem;
    margin-bottom: 0.5rem;
    font-weight: 500;
    line-height: 1.2;
}
.contentbg{
    background-image: url(../img/background.jpg)!important;
   /* background-position: center;*/
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-size: cover;
}
.eneratext{
    color: #00a9e0;
}
.eneraborder{
    border-color: #00a9e0!important;
}
.greeneneratext, .greeneneratext:hover{
    color: #78BE20!important;
    animation: none;
    -webkit-animation: none;
    -moz-animation: none;
}
.tariffbigtext{
    font-size: 2.2rem;
}
.contentheader{
    margin-top: 130px;
}
.tooltip_regions_svg{
    font-size: 1.2rem;
    padding: 4px;
    border-radius: 3px;
    box-shadow: 0 0 15px rgb(0 0 0 / 55%);
}
.tabpoint{
    font-size: 1.2rem;
}

@media screen and (max-width: 991px) {
    .contentheader{
        margin-top: 120px;
    }
    .contentbg {
        color: white!important;
        background-attachment: fixed;
    }
    .contentbg .colorimg{
        display: none!important;
    }
    .contentbg .whiteimg{
        display: block!important;
    }
    .contentbg .increase-plugin-ac,.contentbg .decrease-plugin-ac,.contentbg .increase-plugin-ac1,
    .contentbg .decrease-plugin-ac1,.contentbg .btn a,.contentbg .navbar input,.contentbg input:focus,.contentbg input::placeholder
    {
        color: white!important;
    }
    .contentbg .navbar-toggler-icon{
        filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(
            57deg
        ) brightness(105%) contrast(104%);
    }
    .contentbg .navbar-collapse{
        background-image: none;
        background-color: #e8e8e8 !important;
    }
    .hrlinedesk{
        border-bottom: 1px rgba(0, 0, 0, 0.75) solid!important;
    }
    .media-body h2{
        font-size: 1.4rem;
    }
    .support{
        right: 15px;
        bottom: 15px;
    }
    .contentheader svg{
        width: 100%;
        height: 100%;
    }
}
@media screen and (max-width: 380px) {
    .media-body h2{
        font-size: 1.2rem;
    }
}