@charset "utf-8";
:root { --blue-1:#1faae2;
 --blue-2:#115ad5;
 --blue-3:#1799cc;
 --grey-0:#f7f7f7;
 --grey-1:#454545;
 --grey-2:#313131;
 --grey-3:#d7d5d5;
 --grey-4:#EDEDED;
 --red-1:#f71c1f;
 --red-2:#d3181b;
 --green-1:#6fc30e;
 --green-2:#60aa0b;
}
@font-face { font-family: 'GothamLight'; src: url(../fonts/Gotham-Light.otf) format('opentype'), url(../fonts/Gotham-Light.ttf) format('truetype'); font-weight: normal; font-style: normal; font-display: swap; }
@font-face { font-family: 'GothamBook'; src: url(../fonts/Gotham-Book.otf) format('opentype'), url(../fonts/Gotham-Book.ttf) format('truetype'); font-weight: normal; font-style: normal; font-display: swap; }
@font-face { font-family: 'GothamMedium'; src: url(../fonts/Gotham-Medium.otf) format('opentype'), url(../fonts/Gotham-Medium.ttf) format('truetype'); font-weight: normal; font-style: normal; font-display: swap; }
@font-face { font-family: 'GothamBold'; src: url(../fonts/Gotham-Bold.otf) format('opentype'), url(../fonts/Gotham-Bold.ttf) format('truetype'); font-weight: normal; font-style: normal; font-display: swap; }
/* @font-face {
	font-family: 'GothamBook';
	src: url('../fonts/Gotham-Book.eot') format('embedded-opentype'),  url('../fonts/Gotham-Book.woff') format('woff'), url('../fonts/Gotham-Book.ttf')  format('truetype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'GothamLight';
	src: url('../fonts/Gotham-Light.eot') format('embedded-opentype'),  url('../fonts/Gotham-Light.woff') format('woff'), url('../fonts/Gotham-Light.ttf')  format('truetype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'GothamBold';
	src: url('../fonts/Gotham-Bold.eot') format('embedded-opentype'),  url('../fonts/Gotham-Bold.woff') format('woff'), url('../fonts/Gotham-Bold.ttf')  format('truetype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
} */
html { scroll-behavior: unset !important; }
*, p, body { margin: 0px; padding: 0px; }
body { margin: 0px; padding: 0px; overflow: hidden; overflow-y: auto; font-family: 'GothamBook'; font-weight: 400; font-size: 16px; line-height: 1.3; }
p { font-size: 19px; }
.object-fit-cover { object-fit: cover; }
/*=============================================
					BACK TO TOP
===============================================*/
#to-top { opacity: 0; filter: alpha(opacity=0); position: fixed; right: -59px; width: 40px; z-index: 9; display: block; top: unset; bottom: 25px; font-size: 11px; color: #fcae17; text-align: center; padding: 10px 0 7px 0; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; text-decoration: none; height: 100px; }
#to-top > svg { fill: #fcae17; stroke: #fcae17; width: 30px; transform: translateY(20px); transition: all 0.3s; }
#to-top:hover > svg { transform: translateY(0px); transition: all 0.3s; }
#to-top.on { right: 15px; opacity: 0.9; filter: alpha(opacity=90); -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
#to-top.off { right: -59px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
#to-top:hover { opacity: 1; filter: alpha(opacity=100); }
#to-top i { font-size: 14px; }
/*=============================================
					Common
===============================================*/

.font-gotham-light { font-family: 'GothamLight'; }
.font-gotham-book { font-family: 'GothamBook'; }
.font-gotham-medium { font-family: 'GothamMedium'; }
.font-gotham-bold { font-family: 'GothamBold'; }
.page-title-1 { font-family: 'GothamBold'; font-size: 35px; line-height: 1; color: var(--bs-black); }
.page-content { padding-block: 30px; background: var(--grey-0); }
.bg-black-1, .bg-red-1, .bg-green-1, .bg-grey-1 { transition: all 0.3s; }
.bg-grey-1 { background: var(--grey-1) !important; }
.bg-red-1 { background: var(--red-1) !important; }
.bg-green-1 { background: var(--green-1) !important; }
.bg-black-1:hover { background: var(--grey-1) !important; }
.bg-grey-1:hover { background: var(--grey-2) !important; }
.bg-red-1:hover { background: var(--red-2) !important; }
.bg-green-1:hover { background: var(--green-2) !important; }
.footer-title-1 { font-size: 20px; font-family: 'GothamBold'; }
.title-2, .page-title-2 { font-size: 40px; line-height: 1; font-weight: 600; }
.page-title-3 { font-size: 20px; line-height: 1; font-family: 'GothamBold'; }
.subtitle-1 { font-size: 14px; line-height: 1; }
/*=============================================
					Header
===============================================*/
.header { padding: 30px 45px; }
.logo { max-width: 180px; }
.header-link-1 { font-size: 20px; line-height: 1; text-decoration: none; color: var(--bs-black); transition: all 0.3s; padding: 10px 25px; }
.header-link-1:hover { text-decoration: underline; transition: all 0.3s; }
.black-btn-pill-1 { text-decoration: none; border: none; background: var(--bs-black); font-size: 20px; color: #fff; border-radius: 15px; overflow: hidden; padding: 18px 50px; line-height: 1; transition: all 0.3s; text-align: center; }
.black-btn-pill-1:hover { background: var(--blue-1); transition: all 0.3s; }

.cp-black-btn-pill-1{ 
	background: var(--bs-black);
	border-radius: 15px;
	border: none;
	text-decoration: none;
	color: #ffffff;
	padding: 19px 50px 18px 50px;
	display: table;
	text-align: center;
	font-size: 20px;
	transition: all 0.3s;
	cursor: pointer;line-height: 1;
}
.cp-black-btn-pill-1:hover{ 
	background: var(--blue-1); transition: all 0.3s;
}

.blue-btn-pill-1 { text-decoration: none; border: none; background: var(--blue-1); font-size: 20px; color: #fff; border-radius: 15px; overflow: hidden; padding: 18px 50px; line-height: 1; transition: all 0.3s; text-align: center; }
.blue-btn-pill-1:hover { background: var(--blue-3); transition: all 0.3s; }

.cp-blue-btn-pill-1{ 
	background: var(--blue-1);
	border-radius: 15px;
	border: none;
	text-decoration: none;
	color: #ffffff;
	padding: 19px 50px 18px 50px;
	display: table;
	text-align: center;
	font-size: 20px;
	transition: all 0.3s;
	cursor: pointer;line-height: 1;
}
.cp-blue-btn-pill-1:hover{ 
	background: var(--blue-3); transition: all 0.3s;
}

.red-btn-pill-1 { text-decoration: none; border: none; background: var(--red-1); font-size: 20px; color: #fff; border-radius: 15px; overflow: hidden; padding: 18px 50px; line-height: 1; transition: all 0.3s; text-align: center; }
.red-btn-pill-1:hover { background: var(--red-2); transition: all 0.3s; }

.cp-red-btn-pill-1{ 
	background: var(--red-1);
	border-radius: 15px;
	border: none;
	text-decoration: none;
	color: #ffffff;
	padding: 19px 50px 18px 50px;
	display: table;
	text-align: center;
	font-size: 20px;
	transition: all 0.3s;
	cursor: pointer;line-height: 1;
}
.cp-red-btn-pill-1:hover{ 
	background: var(--red-2); transition: all 0.3s;
}

.header-extra-btns-holder { border-left: solid 2px var(--bs-black); padding-left: 25px; }
.mobile-nav { position: fixed; bottom: 0; left: 0; width: 100%; background: #fff; box-shadow: 0px -5px 15px 0px rgba(0,0,0,0.3); z-index: 9; }
.mobile-nav .header-link-1 { display: flex; flex-wrap: wrap; flex-direction: column; justify-content: center; align-items: center; align-content: center; font-size: 13px; text-transform: uppercase; flex-basis: 25%; flex-grow: 1; color: rgba(0,0,0,0.7); }
.mobile-nav .header-link-1 > i { font-size: 17px; margin-bottom: 8px; }
.mobile-nav .header-link-1.active { color: var(--blue-2) !important; transition: all 0.3s; }
/*=============================================
					Screens page
===============================================*/
.search-input-group-1 { background: #fff; border-radius: 15px; overflow: hidden; border: solid 2px var(--blue-1); flex-basis: 0; flex-grow: 1; margin-right: 10px; }
.search-input-group-1-text { background: transparent; border: none !important; font-size: 20px; line-height: 1; border-radius: 0px !important; padding-left: 15px; padding-right: 0px; }
.search-input-1 { box-shadow: none !important; outline: none !important; border: none !important; padding-block: 13px; font-size: 17px; }
.screens-search-reset-btn { background: var(--blue-1); border-radius: 15px; overflow: hidden; text-decoration: none; border: none; height: 56px; width: 56px; display: inline-flex; align-items: center; justify-content: center; color: var(--bs-white); font-size: 22px; line-height: 1; flex-basis: 56px; flex-grow: 0; transition: all 0.3s; }
.screens-search-reset-btn:hover { background: var(--red-1); transition: all 0.3s; }
.screens-page-right-header-holder-col { padding-inline: 5px; }
.screens-page-right-header-holder { margin-inline: -5px; }
.screen-title-1 { font-family: 'GothamBold'; font-size: 17px; height: 41px; }
.screen-title-2 { font-family: 'GothamBold'; font-size: 20px; }
.screen-poster-holder { max-width: 220px; height:392px; position:relative; }
.screen-poster-holder.img-loading img{ width: 70px !important; height: 70px !important; object-position: unset !important; position: absolute; transform: translate(-50%,-50%); left:50%; top:50%;}
.screen-mac-address { font-size: 22px; }
.screen-input-check { position: absolute; top: 0; left: 0; width: 100%; height: 100%; cursor: pointer; opacity: 0; z-index: 0; }
.screen-holder-inner { position: relative; z-index: 1; cursor: pointer; }
.screen-holder-inner::after { content: "Selected"; position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: rgba(0,0,0,0.4); border: solid 3px var(--blue-1); color: #fff; font-size: 45px; letter-spacing: 2px; opacity: 0; visibility: hidden; transition: all 0.3s; }
.screen-input-check:checked + .screen-holder-inner::after { opacity: 1; visibility: visible; transition: all 0.3s; }
.reboot-modal-btns-holder { max-width: 450px; }
.pagination .page-item:last-child .page-link, .pagination .page-item:first-child .page-link { border-radius: 0px !important; }
.pagination .active > .page-link, .pagination .page-link.active { z-index: 3; color: var(--bs-pagination-active-color); background-color: var(--bs-black); border-color: var(--bs-black); }
.pagination .page-link { font-size: 18px; color: var(--bs-black); font-family: 'GothamBold'; width: 45px; height: 45px; display: flex; align-items: center; justify-content: center; border: solid 2px var(--grey-3); }
.reboot-notification-holder {border: solid 2px var(--blue-1);border-radius: 15px;overflow: hidden;padding: 10px 15px;background: var(--grey-4);}
.rn-title-1{font-family: 'GothamBold';font-size: 22px;}

.has-custom-dropdown {position: relative;}
.header-dropdown-1 {font-family: 'GothamLight';color: #000;font-size: 21px;line-height: 1;background: transparent;-moz-appearance: none;-webkit-appearance: none;appearance: none;border: solid 2px var(--blue-1) !important;padding: 20px 50px 20px 20px;border-radius: 15px;font-weight: 600;}
.header-dropdown-1 + .select2.select2-container {z-index: 1;}
.select2-container .select2-selection--single {height: 56px;padding: 10px;font-family: 'GothamLight';font-size: 20px;line-height: 1;border: solid 2px var(--blue-1);border-radius: 10px;}
.header-dropdown-1 + .select2 .select2-selection--single {border-radius: 15px;background: transparent;transition: all 0.2s;}
.select2-container .select2-selection--single .select2-selection__rendered {line-height: 34px;}
.header-dropdown-1 + .select2 .select2-selection__rendered {padding-right: 100px;color: #000;font-size: 18px;font-weight: 600;}
.has-custom-dropdown::after {position: absolute;width: 25px;height: 15px;content: "";right: 25px;top: 0;bottom: 0;	margin: auto 0px;
	background: url(../images/chevron-down-black-1.png) no-repeat center center / 100%;	z-index: 0;}
.bpackaging-header-dropdown-1 + .select2 .select2-selection__arrow {display: none;}