::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: var(--main-bg-color); }
::-webkit-scrollbar-thumb { background: #f1f1f161; }
::-webkit-scrollbar-thumb:hover { background: var(--main-active-color);  }
body { padding: 0; margin: 0; width: 100%; height: 100%; font-family: Arial, Helvetica, sans-serif; }
.page-item.active .page-link { background-color: var(--main-active-color); border-color: var(--main-active-color); }
h1 { font-size: 2em; margin-top: 100px; }
h2 { background-color: var(--main-bg-color); width: 100%; font-size: 1.5em; padding: 7px; border-radius: 4px; color: white; text-transform: uppercase; }
h3 { border-bottom: 2px solid var(--main-bg-color); margin-top: 60px; font-size: 1.8em;}
.row .bg-section { padding: 2rem; border-radius: 5px; }
hr { background-color: var(--main-bg-color); width: 50%; height: 1px; border: none; }
.pagination > li > a { color: white; background-color: none; }
footer { margin-top: 50px; }
li.navig{ background-color: var(--main-bg-color); max-height: 40px; min-width: 300px; }
li.navig:hover { background-color: var(--main-active-color); }
.btn_color { background-color: var(--main-active-color); }
#blink {
    animation-name: blinky; animation-duration: 1s; animation-iteration-count: infinite;  
    -webkit-animation-name: blinky; -webkit-animation-duration: 1s; -webkit-animation-iteration-count: infinite;  
    -moz-animation-name: blinky; -moz-animation-duration: 1s; -moz-animation-iteration-count: infinite;
    -o-animation-name: blinky; -o-animation-duration: 1s; -o-animation-iteration-count: infinite;
    -ms-animation-name: blinky; -ms-animation-duration: 1s; -ms-animation-iteration-count: infinite;
}
@keyframes blinky { from {opacity: 1;} to {opacity: 0;} }
@-webkit-keyframes blinky { from {opacity: 1;} to {opacity: 0;} }
@-moz-keyframes blinky { from {opacity: 1;} to {opacity: 0;} }
@-o-keyframes blinky { from {opacity: 1;} to {opacity: 0;} }
@-ms-keyframes blinky { from {opacity: 1;} to {opacity: 0;} }

@media screen and (max-width: 1200px) {
    h1 { font-size: 1.8em; margin-top: 20px; }
    h2 { font-size: 1.3em; }
    h3 { font-size: 1.3em; margin-top: 40px; }
    nav.navbar-expand-xl { position: inherit !important; }
}

@media screen and (max-width: 769px) {
    h1 { font-size: 1.3em; margin-top: 15px; }
    h2 { font-size: 0.8rem; }
    h3 { margin-top: 30px; }
    nav.navbar-expand-xl { position: inherit !important; }
    ul.pagination { display: block; }
    li.navig { margin-bottom: 10px; }
}

@media all and (min-width: 992px) {
	.dropdown-menu li{ position: relative; 	}
	.nav-item .submenu{ 
		display: none;
		position: absolute;
		left:100%; top:-7px;
	}
	.nav-item .submenu-left{ 
		right:100%; left:auto;
	}
	.dropdown-menu > li:hover{ background-color: #f1f1f1 }
	.dropdown-menu > li:hover > .submenu{ display: block; }
}	
/* ============ desktop view .end// ============ */

/* ============ small devices ============ */
@media (max-width: 991px) {
  .dropdown-menu .dropdown-menu{
      margin-left:0.7rem; margin-right:0.7rem; margin-bottom: .5rem;
  }
}