@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css");
@import 'https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap';



:root {

  /*
    --bs-gray-100: rgba(0,0,0,0.05);
    --bs-gray-200: rgba(0,0,0,0.1);
    --bs-gray-300: rgba(0,0,0,0.15);
    --bs-gray-400: rgba(0,0,0,0.20);
    --bs-gray-500: rgba(0,0,0,0.25);
    --bs-gray-600: rgba(0,0,0,0.30);
    --bs-gray-700: rgba(0,0,0,0.35);
    --bs-gray-800: rgba(0,0,0,0.40);
    --bs-gray-900: rgba(0,0,0,0.45);
    --bs-gray-1000: rgba(0,0,0,0.50);
    --bs-gray-1100: rgba(0,0,0,0.50);

  */

    --bs-gray-100: #f9f9f9;
    --bs-gray-200: #f1f1f4;
    --bs-gray-300: #dbdfe9;
    --bs-gray-400: #c4cada;
    --bs-gray-500: #99a1b7;
    --bs-gray-600: #78829d;
    --bs-gray-700: #4b5675;
    --bs-gray-800: #252f4a;
    --bs-gray-900: #071437;
    --bs-emphasis-color: #4b5675;

    --bs-brand: #ff6f1e;
    --bs-brand-active: #f15700;
    --bs-brand-light: #fff5ef;
    --bs-brand-clarity: rgba(255, 111, 30, .2);
    --bs-brand-inverse: #fff;
    --bs-primary: #1b84ff;
    --bs-primary-active: #056ee9;
    --bs-primary-light: #eff6ff;
    --bs-primary-clarity: rgba(27, 132, 255, .2);
    --bs-primary-inverse: #fff;
    --bs-success: #17c653;
    --bs-success-active: #04b440;
    --bs-success-light: #eafff1;
    --bs-success-clarity: rgba(23, 198, 83, .2);
    --bs-success-inverse: #fff;
    --bs-info: #7239ea;
    --bs-info-active: #5014d0;
    --bs-info-light: #f8f5ff;
    --bs-info-clarity: rgba(114, 57, 234, .2);
    --bs-info-inverse: #fff;
    --bs-danger: #f8285a;
    --bs-danger-active: #d81a48;
    --bs-danger-light: #ffeef3;
    --bs-danger-clarity: rgba(248, 40, 90, .2);
    --bs-danger-inverse: #fff;
    --bs-warning: #f6b100;
    --bs-warning-active: #dfa000;
    --bs-warning-light: #fff8dd;
    --bs-warning-clarity: rgba(246, 177, 0, .2);
    --bs-warning-inverse: #fff;
    --bs-dark: #1e2129;
    --bs-dark-active: #111318;
    --bs-dark-light: #f9f9f9;
    --bs-dark-clarity: rgba(30, 33, 41, .2);
    --bs-dark-inverse: #fff;
    --bs-light: #fff;
    --bs-light-active: #fcfcfc;
    --bs-light-light: #fff;
    --bs-light-clarity: hsla(0, 0%, 100%, .2);
    --bs-light-inverse: #4b5675;
    --bs-secondary: #f9f9f9;
    --bs-secondary-active: #f9f9f9;
    --bs-secondary-light: #f9f9f9;
    --bs-secondary-clarity: hsla(0, 0%, 98%, .2);
    --bs-secondary-inverse: #4b5675;
    --bs-default-box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, .09);
    --bs-light-box-shadow: 0px 3px 4px 0px rgba(0, 0, 0, .03);
    --bs-primary-box-shadow: 0px 4px 12px 0px rgba(40, 132, 239, .35);
    --bs-success-box-shadow: 0px 4px 12px 0px rgba(53, 189, 100, .35);
    --bs-danger-box-shadow: 0px 4px 12px 0px rgba(241, 65, 108, .35);
    --bs-info-box-shadow: 0px 4px 12px 0px rgba(114, 57, 234, .35);
    --bs-warning-box-shadow: 0px 4px 12px 0px rgba(246, 192, 0, .35);
    --bs-dark-box-shadow: 0px 4px 12px 0px rgba(37, 47, 74, .35);
    --bs-card-background-color: #fff;
    --bs-tooltip-background-color: #0f1014;
    --bs-popover-background-color: #fff;
    --bs-modal-background-color: #fff;
    --bs-drawer-background-color: #fff;
    --bs-dropdown-background-color: #fff;
    --bs-backdrop-background-color: rgba(0, 0, 0, .8);
    --bs-table-head-background-color: var(--bs-light-active);
    --bs-card-border: 1px solid var(--bs-gray-300);
    --bs-table-border: 1px solid var(--bs-gray-200);
    --bs-dropdown-border: 1px solid var(--bs-gray-200);
    --bs-popover-border: 1px solid var(--bs-gray-200);
    --bs-tooltip-border: 0;
    --bs-card-box-shadow: 0px 3px 4px 0px rgba(0, 0, 0, .03);
    --bs-tooltip-box-shadow: 0px 3px 4px 0px rgba(0, 0, 0, .03);
    --bs-popover-box-shadow: 0px 3px 4px 0px rgba(0, 0, 0, .03);
    --bs-modal-box-shadow: 0px 10px 14px 0px rgba(15, 42, 81, .03);
    --bs-drawer-box-shadow: 0px 3px 4px 0px rgba(0, 0, 0, .03);
    --bs-dropdown-box-shadow: 0px 7px 18px 0px rgba(0, 0, 0, .09);
    --bs-input-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .1);
    --bs-card-border-radius: .75rem;
    --bs-input-border-radius: .375rem;
    --bs-btn-border-radius: .375rem;
    --bs-text-sm: .800rem;
    --bs-text-md: 1rem;
    --bs-text-lg: 1.2rem;

    --bs-p-0: 0 !important;
    --bs-p-1: 0.25rem !important;
    --bs-p-2: 0.5rem !important;
    --bs-p-3: 1rem !important;
    --bs-p-4: 1.5rem !important;
    --bs-p-5: 3rem !important;

    --bs-fs-1: calc(1.375rem + 1.5vw) !important;
    --bs-fs-2: calc(1.325rem + 0.9vw) !important;
    --bs-fs-3: calc(1.3rem + 0.6vw) !important;
    --bs-fs-4: calc(1.275rem + 0.3vw) !important;
    --bs-fs-5: 1.25rem !important;
    --bs-fs-6: 1rem !important;

    --bs-body-color: #4b5675;

}




body
{
	padding:50px 0px 50px 0px;
	margin-top: 0px;
    background: #F6F6F9;
    color: var(--bs-gray-700)!important;
    font-size: var(--bs-text-md)!important;
  	font-family: Inter, system-ui, sans-serif!important;
}



code
{
	letter-spacing: auto;
}


/* width */
::-webkit-scrollbar {
  width: 3px;
}

/* Track */
::-webkit-scrollbar-track {
  background: none;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #888;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #555;
}





.header
{
	width: 100%;
	position: fixed;
	z-index: 50;
	top: 0px;
	background: #fff;
	box-shadow: var(--bs-card-box-shadow);
	border-bottom:var(--bs-card-border);
	overflow: hidden;
}






/*bootstrap*/


.rounded
{
    overflow: hidden;
}

.card
{
  box-shadow: 0px 3px 4px 0px rgba(0, 0, 0, .03)!important;
  border:var(--bs-card-border)!important;
  border-radius: var(--bs-card-border-radius);
  color: var(--bs-gray-700)!important;
font-size: var(--bs-text-md)!important;
  
}

.card-header
{
  background: var(--bs-gray-100);
  border-bottom:var(--bs-card-border);
}


.list-group-item
{
  border-bottom:var(--bs-card-border);
}


.nav-tabs .nav-link
{
  border-top-left-radius: var(--bs-card-border-radius);
  border-top-right-radius: var(--bs-card-border-radius);
  border-botton-left-radius: none;
   border-botton-right-radius: none;
}


.bg-primary
{
  background: var(--bs-primary-light)!important;
}

.bg-secondary
{
  background: var(--bs-secondary-light)!important;
}

.bg-success,
{
   background: var(--bs-success-light)!important;
}

.bg-danger
{
  background: var(--bs-danger-light)!important;
}

.bg-warning
{
  background: var(--bs-warning-light)!important;
}

.bg-info
{
  background: var(--bs-info-light)!important;
}

.bg-light
{
  background: var(--bs-gray-100)!important;
}

.bg-dark
{
  background: var(--bs-gray-300)!important;
}



.border-primary
{
  border-color: var(--bs-primary)!important;
}

.border-secondary
{
  border-color: var(--bs-secondary)!important;
}

.border-success
{
   border-color: var(--bs-success)!important;
}

.border-danger
{
  border-color: var(--bs-danger)!important;
}

.border-warning
{
  border-color: var(--bs-warning)!important;
}

.border-info
{
  border-color: var(--bs-info)!important;
}

.border-light
{
  border-color: var(--bs-gray-200)!important;
}

.border-dark
{
  border-color: var(--bs-gray-400)!important;
}




.btn
{
  border-radius: var(--bs-btn-border-radius)
}



.btn-primary {
    color: #fff;
    background-color: var(--bs-primary);
    border-color:  var(--bs-primary);
}


.btn-primary.active, .btn-primary:active, .btn-primary:focus, .btn-primary:hover {
    background-color: var(--bs-primary-active);
    border-color:  var(--bs-primary-active);
    box-shadow: var(--bs-primary-box-shadow);
}


.btn-secondary {
    color: var(--bs-gray-700);
    border-color: var(--bs-gray-200);
    background-color: var(--bs-secondary);
}

.btn-secondary.active, .btn-secondary:active, .btn-secondary:focus, .btn-secondary:hover {
    border-color: var(--bs-gray-300);
    background-color: var(--bs-secondary-active);
    box-shadow: var(--bs-default-box-shadow);
    color: var(--bs-gray-800);
}


.btn-light {
    color: var(--bs-gray-700)!important;
    border-color: var(--bs-gray-300)!important;
    background-color: var(--bs-light)!important;
    border-width: 1px!important;
}


.btn-light.active, .btn-light:active, .btn-light:focus, .btn-light:hover {
    border-color: var(--bs-gray-300);
    background-color: var(--bs-light-active);
    box-shadow: var(--bs-default-box-shadow);
    color: var(--bs-gray-800);
}


.btn-success {
    color: #fff;
    background-color: var(--bs-success);
    border-color: var(--bs-success);
}

.btn-success.active, .btn-success:active, .btn-success:focus, .btn-success:hover {
    background-color: var(--bs-success-active);
    box-shadow: var(--bs-success-box-shadow);
    border-color: var(--bs-success-active);
}


.btn-info {
    color: #fff;
    background-color: var(--bs-info);
    border-color: var(--bs-info);
}

.btn-info.active, .btn-info:active, .btn-info:focus, .btn-info:hover {
    background-color: var(--bs-info-active);
    box-shadow: var(--bs-info-box-shadow);
    border-color: var(--bs-info-active);
    color: #fff;
}


.btn-danger {
    color: #fff;
    background-color: var(--bs-danger);
    border-color: var(--bs-danger);
}


.btn-danger.active, .btn-danger:active, .btn-danger:focus, .btn-danger:hover {
    background-color: var(--bs-danger-active);
    box-shadow: var(--bs-danger-box-shadow);
    border-color: var(--bs-danger-active);
}


.btn-warning {
    color: #fff;
    background-color: var(--bs-warning);
    border-color: var(--bs-warning);
}

.btn-warning.active, .btn-warning:active, .btn-warning:focus, .btn-warning:hover {
    color: #fff;
    background-color: var(--bs-warning-active);
    box-shadow: var(--bs-warning-box-shadow);
    border-color: var(--bs-warning-active);
}

.btn-dark {
    color: #fff;
    background-color: var(--bs-dark);
}


.btn-dark.active, .btn-dark:active, .btn-dark:focus, .btn-dark:hover {
    background-color: var(--bs-dark-active);
    box-shadow: var(--bs-dark-box-shadow);
}







.header .btn
{
	margin: 5px;
}

.header>div>.row
{
	height: 50px;
	overflow: hidden;
}


.header .well 
{
	padding: 5px;
}

.header p
{
	margin: 0px;
}


.sub_header
{



	color: #fff;
	width: 100%;
	left: 0px;
	position: fixed;
	top: 48px;
	z-index: 20;
	padding: 0px 5px;
	overflow: hidden;
	transition: 0.5s;
	border-bottom: var(--bs-card-border);
}

.sub_header .well
{
	margin-top: 5px;
}

.sub_header_hide
{
	top: 0px;
	transition: 0.5s;

}


.content_center
{
		max-width: 780px;
	margin: 0px auto;
}






.footer
{
	width: 100%;
    position: fixed;
    z-index: 50;
    left: 0px;
    bottom: 0px;
    background: #fff;
    box-shadow: var(--bs-card-box-shadow);
    border-top: var(--bs-card-border);
    overflow: hidden;
    height: 50px;
    -webkit-box-shadow: 0px -3px 5px 0px rgba(0,0,0,0.03);
-moz-box-shadow: 0px -3px 5px 0px rgba(0,0,0,0.03);
box-shadow: 0px -3px 5px 0px rgba(0,0,0,0.03);


}



.page-header
{
	text-align: center;
	text-transform: uppercase;
	font-size: var(--bs-text-lg);
    padding: 10px;
    margin: 10px 0px;
}




.k2CategoriesListBlock ul
{
	padding-left: 30px!important;
	list-style: none;

}




.k2CategoriesListBlock ul a
{
	display: block;
	text-decoration: none;
	font-weight: normal!important;
	margin-left: -10px;
	padding: 10px 5px;
	transition: 0.5s;
color: #56595E;
}

.k2CategoriesListBlock ul a:hover
{
	transition: 0.5s;
	padding-left: 20px;
}

.k2CategoriesListBlock ul a:after
{
	content: "";
	display: block;
	position: absolute;
	border-bottom: 1px solid rgba(209, 213, 218, 0.5);
	width: 15px;
	height: 1px;
	margin-left: -25px;
	margin-top: -10px;
}

.k2CategoriesListBlock ul
{
	padding: 0px;
	margin: 0px;
}


.k2CategoriesListBlock ul
{
	border-left: 1px solid rgba(209, 213, 218, 0.5);
}

.k2CategoriesListBlock .catCounter
{
	color: #858C91;
}


.k2CategoriesListBlock .activeCategory>a:after
{
	border-bottom: 2px solid #fff;
	margin-top: -12px;
}





.button 
{
	margin: 10px;
	padding: 8px 15px;
	text-align: center;
	  text-decoration: none;
	  -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    display: inline-block;
}


.button i
{
	width: 28px;
	height: 18px;
	overflow: hidden;
	display: inline-block;
	vertical-align: middle;
	margin-right: 5px;
	font-size: 17px;
}



.button.gold
{  	
    background: #FFDA78;
    border: 3px solid #BFAA73;
    color: #32363a;
    text-transform: uppercase;
    -webkit-box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.4);
    -moz-box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.4);
    box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.4);
    cursor: pointer;
}


.button.blue
{  	
    background: #59a4df;
    border: 3px solid #4a789d;
    color: #fff;
    text-transform: uppercase;
    -webkit-box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.4);
    -moz-box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.4);
    box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.4);
    cursor: pointer;
}

.button.green
{  	
    background: #a2c638;
    border: 3px solid #5a6d22;
    color: #32363a;
    text-transform: uppercase;
   -webkit-box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.4);
    -moz-box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.4);
    box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.4);
    cursor: pointer;
}


/*k2 search*/

.k2SearchBlockForm
{
    position: relative;
    min-width: 45px;
}

.k2SearchBlockForm input[type="text"]
{

	color: #343642;
	padding: 6px;

    position: absolute;
    border-radius: var(--bs-border-radius);
    color: var(--bs-gray-700) !important;
    border: 1px solid var(--bs-gray-300) ;
    background: var(--bs-light) !important;
    border-width: 1px !important;
    right: 0px;
    top: -7px;
    overflow: hidden;
    width: 200px;
    color: #fff!important;
    width: 45px;
}

.k2SearchBlockForm input[type="text"].active
{

    color: #343642!important;
}





.k2SearchBlockForm .fa-solid
{
    position: absolute;
    display: block;
    right: 15px;
    top: 4px;
    cursor: pointer;
}





/*komento*/



/*bootstrap*/
h1
{
	font-size: 17px;	
}


h2
{
	font-size: 16px;	
}

h3,h4,h5
{
	font-size: 15px;	
}


.modal-header
{
    padding: 0px;
    text-align: left;
    display: block;
    height: 50px;
    box-shadow: var(--bs-card-box-shadow)!important;
    z-index: 9;
}

.modal-header .nav
{
    margin-top: 5px;
}


.modal-header .modal-close
{
    margin-top: 5px;
}

.modal-header .nav li
{
    margin-right: 5px;
}

.modal-header .nav-link
{
    color: var(--bs-gray-700);
}


.modal-body
{
    background: #F6F6F9;
}

.modal-footer
{
    justify-content: flex-start!important;
    padding: 0px;
    background: #fff;
    box-shadow: var(--bs-card-box-shadow)!important;
    border-top: var(--bs-card-border)!importan;
  
}



.login_form_modal .modal-body
{
    font-size: var(--bs-text-md) !important;
}

.login_form_modal .modal-body .content_center
{
    display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5px;
}

.login_form_modal .modal-body .page-header
{
    font-size: var(--bs-text-sm);
}


#profile 
{
    
    display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5px;
}




.article_media_block 
{
    overflow: hidden;
    height: 300px;
    position: relative;
    margin: .25rem;
    border-radius: var(--bs-border-radius);
}

.article_media_block .wrap_link
{
   display: flex;
   justify-content: center;
   text-decoration: none;
   width: 100%;
    height: 300px;
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 9;

}

.article_media_block .wrap_link i
{
    padding-left: 10px;
    margin-top: 3px;
    border-left: 1px solid rgba(255, 255, 255, 0.5);
    font-size: 20px;
    margin-left: 10px;
}



.article_media_block .plyr
{
    height: 300px;
}




.article_media_block .image img
{
    width: 100%;

} 


.article_media_block .image_gallery
{
    display: flex;
}

.article_media_block .image_gallery .main_image
{
    overflow: hidden;
    border-radius: var(--bs-card-border-radius);
    height: 300px;
    width: 80%;
    min-width: 200px;
    margin-right: 5px;
}

.article_media_block .image_gallery .main_image img
{
    min-height: 100%;
    width: 110%;
}

.article_media_block .image_gallery .rest_images
{
    width: 20%;
}

.article_media_block .image_gallery .rest_image
{
    height: 148px;
    overflow: hidden;
    border-radius: var(--bs-card-border-radius);
    margin-bottom: 5px;
}


.article_media_block .image_gallery .rest_images img
{
    height: 100%;
}


.article_media_block  video[poster]{

display: none;
}

.article_media_block  .plyr__poster
{
    background-size: 100%!important;
}



#talk_room
{
    width: 100%;
    height: 100vh;
    border: none;
}

#room_frame .modal-body
{
    padding: 0px;
}



.well .custom.myprojectmain .desc .text
{
    height: 140px;
    overflow: hidden;
    position: relative;
}

.well .custom.myprojectmain .desc .text:after
{
    content: "...";
    position: absolute;
    bottom: -6px;
}

.well .custom.myprojectmain .desc .btn
{
    position: absolute;
    bottom: 8px;
}



.well .mod-list-profil
{

  border-left: 1px solid rgba(209, 213, 218, 0.5);

}

.well .mod-list-profil li
{
    display: block;
}

.well .mod-list-profil a {
  display: block;
  text-decoration: none;
  font-weight: normal !important;
  margin-left: -10px;
  padding: 10px 5px;
  transition: 0.5s;
  color: #56595E;
}


.well .mod-list-profil a::after {
  content: "";
  display: block;
  position: absolute;
  border-bottom: 1px solid rgba(209, 213, 218, 0.5);
  width: 15px;
  height: 1px;
  margin-left: -25px;
  margin-top: -10px;
}

