/*region fonts*/
/*region Vazir*/
@font-face {
font-family: Vazirmatn;
src: url('../fonts/vazir/webfonts/1.woff2') format('woff2');
font-weight: 100;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: Vazirmatn;
src: url('../fonts/vazir/webfonts/2.woff2') format('woff2');
font-weight: 300;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: Vazirmatn;
src: url('../fonts/vazir/webfonts/3.woff2') format('woff2');
font-weight: 400;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: Vazirmatn;
src: url('../fonts/vazir/webfonts/4.woff2') format('woff2');
font-weight: 500;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: Vazirmatn;
src: url('../fonts/vazir/webfonts/5.woff2') format('woff2');
font-weight: 600;
font-style: normal;
font-display: swap;
}
/*endregion Vazir*/
/*region Sahel*/
@font-face {
font-family: Sahel;
src: url('../fonts/sahel/Farsi-Digits/Sahel-Light-FD.woff2') format('woff2');
font-weight: 300;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: Sahel;
src: url('../fonts/sahel/Farsi-Digits/Sahel-FD.woff2') format('woff2');
font-weight: 400;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: Sahel;
src: url('../fonts/sahel/Farsi-Digits/Sahel-SemiBold-FD.woff2') format('woff2');
font-weight: 600;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: Sahel;
src: url('../fonts/sahel/Farsi-Digits/Sahel-Bold-FD.woff2') format('woff2');
font-weight: 700;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: Sahel;
src: url('../fonts/sahel/Farsi-Digits/Sahel-Black-FD.woff2') format('woff2');
font-weight: 900;
font-style: normal;
font-display: swap;
}
/*endregion Sahel*/
/*region Sans*/
@font-face {
font-family: Sans;
src: url('../fonts/Sans/Sans.woff') format('woff');
font-weight: 300;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: Sans;
src: url('../fonts/Sans/Sans.eot') format('eot');
font-weight: 300;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: Sans;
src: url('../fonts/Sans/Sans.ttf') format('ttf');
font-weight: 300;
font-style: normal;
font-display: swap;
}
/*endregion Sahel*/
/*region Yekan*/
@font-face {
font-family: 'YJ';
src: url('../fonts/webyekan/Yekan.eot?#') format('eot'), /* IE6–8 */ url('../fonts/webyekan/Yekan.woff') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/ url('../fonts/webyekan/Yekan.ttf') format('truetype'); /* Saf3—5, Chrome4+, FF3.5, Opera 10+ */
}
@font-face {
font-family: 'NYJ';
src: url('../fonts/webyekan/yekannumbers-regular.eot?#') format('eot'), /* IE6–8 */ url('../fonts/webyekan/yekannumbers-regular.woff') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/ url('../fonts/webyekan/yekannumbers-regular.ttf') format('truetype'); /* Saf3—5, Chrome4+, FF3.5, Opera 10+ */
}
/*endregion Yekan*/
/*region Anjoman*/
@font-face {
font-family: anjoman;
src: url('../fonts/anjoman/woff2/AnjomanMaxFN-Thin.woff2') format('woff2');
font-weight: 100;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: anjoman;
src: url('../fonts/anjoman/woff2/AnjomanMaxFN-CnLight.woff2') format('woff2');
font-weight: 300;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: anjoman;
src: url('../fonts/anjoman/woff2/AnjomanMaxFN-Cn.woff2') format('woff2');
font-weight: 400;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: anjoman;
src: url('../fonts/anjoman/woff2/AnjomanMaxFN-CnMedium.woff2') format('woff2');
font-weight: 500;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: anjoman;
src: url('../fonts/anjoman/woff2/AnjomanMaxFN-Bold.woff2') format('woff2');
font-weight: 600;
font-style: normal;
font-display: swap;
}
/*endregion Anjoman*/
/*endregion fonts*/
/*region variables*/
:root {
--ms-color-hell: #fbfbfb;
--ms-color-hell-2: #f3f3f3;
--ms-color-hell-3: #00adff14;
--ms-color-hell-4: #ebf3ff;
--ms-color-hell-5: #eadfff;
--ms-color-hell-6: #92d1ff;
--ms-color-hell-7: #bee3ff;
--ms-color-dark: #333;
--ms-color-dark-2: #232323;
--ms-color-gray: #4d4d4d;
--ms-color-gray-2: #969795;
--ms-color-white: #fff;
--ms-color-black: #000;
/*--ms-color-Primary: #007ec5;*/
--ms-color-Primary: #004dbb;
--ms-color-Primary-2: #526291;
--ms-color-Primary-3: #0095ff1c;
--ms-color-Primary-4: #2666fa;
--ms-color-secondary: #5ea0c5;
--ms-color-success: #22b803;
--ms-color-success-2: #54b93f;
--ms-color-warning: #ff0;
--ms-color-danger: #b80322;
--ms-color-orange-1: orange;
--ms-color-orange-2: #ffa50040;
--youtube-clr-1: #FF0000;
--telegram-clr-1: #229ED9;
--instagram-clr-1: #405DE6;
--instagram-clr-2: #5B51D8;
--instagram-clr-3: #833AB4;
--instagram-clr-4: #C13584;
--instagram-clr-5: #E1306C;
--instagram-clr-6: #FD1D1D;
--instagram-clr-7: #F56040;
--instagram-clr-8: #F77737;
--instagram-clr-9: #FCAF45;
--instagram-clr-10: #FFDC80;
--twitter-clr-1: #1DA1F2;
--facebook-clr-1: #4267B2;
--linkedin-clr-1: #0e76a8;
--whatsapp-clr-1: #25D366;
--aparat-clr-1: #ea1d5d;
--igap-clr-1: #6eb556;
--igap-clr-2: #c7d657;
--soroush-clr-1: #2e7d9b;
--bale-clr-1: #4ce9b4;
--bale-clr-2: #2d3075;
--eitaa-clr-1: #fc770d;
}
/*endregion variables*/
/*region general*/
* {
margin: 0;
padding: 0;
font-family: Vazirmatn, Tahoma;
box-sizing: border-box;
}
.row {
margin: 0;
padding: 0;
}
p {
margin: 0;
}
a {
text-decoration: none;
color: var(--ms-color-dark);
}
a:hover {
text-decoration: none;
color: var(--ms-color-dark);
}
ul {
list-style-type: none;
margin: 0;
padding: 0;
}
input:focus {
outline: none !important;
box-shadow: none !important;
}
select:focus {
outline: none !important;
box-shadow: none !important;
}
.ms-form-select {
border: 1px solid #f3f3f3;
outline: none;
padding: 10px;
border-radius: 14px;
}
.ms-form-control {
border: 1px solid #f3f3f3;
outline: none;
padding: 10px;
border-radius: 14px;
}
.ms-form-group {
border-right: 5px solid #007ec5;
padding: 0 10px;
}
body {
position: relative;
background-image: url("../images/pattern/pattern9.png");
background-repeat: repeat;
font-family: Vazirmatn, Tahoma;
/*background-color: var(--ms-color-hell-4);*/
}
@keyframes color-change-1 {
0% {
color: var(--ms-color-dark);
}
50% {
color: var(--ms-color-dark-2);
}
100% {
color: var(--ms-color-gray);
}
}
.fw-container {
width: 100%;
}
.box-shadow-none {
box-shadow: none !important;
}
.page-item a {
color: var(--ms-color-black);
}
.page-item a.active {
color: var(--ms-color-Primary);
}
/*endregion general*/
/*region margins*/
.mt-50 {
margin-top: 50px;
}
.mt-80 {
margin-top: 80px;
}
.mb-80 {
margin-bottom: 80px;
}
.mt-100 {
margin-top: 100px;
}
.mt-120 {
margin-top: 120px;
}
.mt-180 {
margin-top: 180px;
}
/*endregion margins*/
/*region buttons*/
/*region Button 1*/
.button-1 {
background: var(--ms-color-secondary);
color: var(--ms-color-white);
cursor: pointer;
font-weight: 600;
outline: none;
padding: 1px 14px;
text-align: center;
border-radius: 3px;
border: 2px solid var(--ms-color-secondary);
}
.button-1:hover {
background: var(--ms-color-secondary);
color: var(--ms-color-white);
outline: none;
border: 2px solid var(--ms-color-secondary);
}
/*endregion Button 1*/
/*region Button 1 outline*/
.button-1-outline {
background: transparent;
color: var(--ms-color-secondary);
cursor: pointer;
font-weight: 600;
outline: none;
padding: 1px 14px;
text-align: center;
border-radius: 3px;
border: 2px solid var(--ms-color-secondary);
}
.button-1-outline:hover {
background: var(--ms-color-secondary);
color: var(--ms-color-white);
outline: none;
border: 2px solid var(--ms-color-secondary);
}
/*endregion Button 1*/
/*region Button 2*/
.button-2 {
background: var(--ms-color-gray);
color: var(--ms-color-white);
cursor: pointer;
font-weight: 600;
outline: none;
padding: 4px 14px;
text-align: center;
border-radius: 3px;
border: 2px solid var(--ms-color-gray);
}
.button-2:hover {
background: var(--ms-color-gray);
color: var(--ms-color-white);
outline: none;
border: 2px solid var(--ms-color-gray);
}
/*endregion Button 2*/
/*region Button 2 outline*/
.button-2-outline {
background: transparent;
color: var(--ms-color-gray);
cursor: pointer;
font-weight: 600;
outline: none;
padding: 4px 14px;
text-align: center;
border-radius: 3px;
border: 2px solid var(--ms-color-gray);
transition: 0.6s;
}
.button-2-outline:hover {
background: var(--ms-color-gray);
color: var(--ms-color-white);
outline: none;
border: 2px solid var(--ms-color-gray);
}
/*endregion Button 2 outline*/
/*region Button 3*/
.button-3 {
background: var(--ms-color-Primary);
color: var(--ms-color-white);
cursor: pointer;
font-weight: 600;
outline: none;
padding: 4px 14px;
text-align: center;
border-radius: 3px;
border: 2px solid var(--ms-color-Primary);
}
.button-3:hover {
background: var(--ms-color-Primary);
color: var(--ms-color-white);
outline: none;
border: 2px solid var(--ms-color-Primary);
}
/*endregion Button 3*/
/*region Button 3 outline*/
.button-3-outline {
background: transparent;
color: var(--ms-color-Primary);
cursor: pointer;
font-weight: 600;
outline: none;
padding: 4px 14px;
text-align: center;
border-radius: 3px;
border: 2px solid var(--ms-color-Primary);
transition: 0.6s;
}
.button-3-outline:hover {
background: var(--ms-color-Primary);
color: var(--ms-color-white);
outline: none;
border: 2px solid var(--ms-color-Primary);
}
/*endregion Button 3 outline*/
/*region Button 4*/
.button-4 {
background: var(--ms-color-hell-2);
color: var(--ms-color-dark);
cursor: pointer;
font-weight: 600;
outline: none;
padding: 5px 14px;
text-align: center;
border-radius: 3px;
border: 1px solid var(--ms-color-hell-3);
}
.button-4:hover {
background: var(--ms-color-hell-2);
color: var(--ms-color-black);
outline: none;
border: 1px solid var(--ms-color-hell-3);
}
/*endregion Button 4*/
/*region Button 4 outline*/
.button-4-outline {
background: transparent;
color: var(--ms-color-black);
cursor: pointer;
font-weight: 600;
outline: none;
padding: 4px 14px;
text-align: center;
border-radius: 3px;
border: 2px solid var(--ms-color-black);
transition: 0.6s;
}
.button-4-outline:hover {
background: var(--ms-color-black);
color: var(--ms-color-white);
outline: none;
border: 2px solid var(--ms-color-black);
}
/*endregion Button 4 outline*/
/*region Button 5*/
.button-5 {
background: var(--ms-color-Primary-3);
color: var(--ms-color-dark);
cursor: pointer;
font-weight: 600;
outline: none;
padding: 1px 14px;
text-align: center;
border-radius: 3px;
border: 1px solid var(--ms-color-Primary-3);
}
.button-5:hover {
background: var(--ms-color-Primary-3);
color: var(--ms-color-black);
outline: none;
border: 1px solid var(--ms-color-Primary-3);
}
/*endregion Button 5*/
/*region Button 5 outline*/
.button-5-outline {
background: transparent;
color: var(--ms-color-dark);
cursor: pointer;
font-weight: 600;
outline: none;
padding: 4px 14px;
text-align: center;
border-radius: 3px;
border: 2px solid var(--ms-color-dark);
transition: 0.6s;
}
.button-5-outline:hover {
background: var(--ms-color-Primary-3);
color: var(--ms-color-dark);
outline: none;
border: 2px solid var(--ms-color-dark);
}
/*endregion Button 5 outline*/
/*region Button 6*/
.button-6 {
background: var(--ms-color-success);
color: var(--ms-color-white);
cursor: pointer;
font-weight: 600;
outline: none;
padding: 5px 14px;
text-align: center;
border-radius: 3px;
border: 1px solid var(--ms-color-success);
}
.button-6:hover {
background: var(--ms-color-success);
color: var(--ms-color-white);
outline: none;
border: 1px solid var(--ms-color-success);
}
/*endregion Button 6*/
/*region Button 6 outline*/
.button-6-outline {
background: transparent;
color: var(--ms-color-success);
cursor: pointer;
font-weight: 600;
outline: none;
padding: 4px 14px;
text-align: center;
border-radius: 3px;
border: 2px solid var(--ms-color-success);
transition: 0.6s;
}
.button-6-outline:hover {
background: var(--ms-color-success);
color: var(--ms-color-white);
outline: none;
border: 2px solid var(--ms-color-success);
}
/*endregion Button 6 outline*/
/*region Button 7*/
.button-7 {
background: linear-gradient(to right, #d808e8, #453cf7);
color: var(--ms-color-white);
cursor: pointer;
font-weight: 300;
outline: none;
padding: 3px 18px;
text-align: center;
border-radius: 14px;
border: none;
font-size: 0.9rem;
}
.button-7:hover {
background: linear-gradient(to right, #d808e8, #453cf7);
color: var(--ms-color-white);
outline: none;
border: none;
}
/*endregion Button 7*/
/*region Button 8*/
.button-8 {
background: var(--ms-color-Primary-4);
color: var(--ms-color-white);
cursor: pointer;
font-weight: 300;
outline: none;
padding: 3px 18px;
text-align: center;
border-radius: 2px;
border: none;
font-size: 0.9rem;
}
.button-8:hover {
background: var(--ms-color-Primary-4);
color: var(--ms-color-white);
outline: none;
border: none;
}
/*endregion Button 8*/
/*region Button 9*/
.button-9 {
border-width: 3px;
border-style: solid;
border-image: linear-gradient(to right, var(--ms-color-success), var(--ms-color-Primary-4)) 1;
/*background: ;*/
color: var(--ms-color-gray);
padding: 6px;
outline: none;
transition: 0.3s;
/*color: linear-gradient(to right, var(--ms-color-success), var(--ms-color-Primary-4)) 1;*/
}
.button-9:hover {
background: linear-gradient(to right, var(--ms-color-success), var(--ms-color-Primary-4));
color: var(--ms-color-white);
outline: none;
}
/*endregion Button 9*/
/*region Button 10*/
.button-10 {
background: var(--ms-color-orange-1);
color: var(--ms-color-white);
cursor: pointer;
font-weight: 600;
outline: none;
padding: 5px 14px;
text-align: center;
border-radius: 3px;
border: 1px solid var(--ms-color-orange-1);
}
.button-10:hover {
background: var(--ms-color-orange-1);
color: var(--ms-color-white);
outline: none;
border: 1px solid var(--ms-color-orange-1);
}
/*endregion Button 10*/
.button-more-video {
font-size: 1.1rem;
}
.button-transparent {
border: none;
background: transparent;
}
.button-radius-bottom {
border-radius: 0 0 13px 13px;
font-size: 0.8rem;
}
.sm-btn {
padding: 2px 5px;
font-size: 13px;
font-weight: 400;
}
/*endregion buttons*/
/*region borders*/
.border-end-gray {
border-left: 1px solid #e3e3e3;
}
/*endregion borders*/
/*region tags*/
.tag {
color: var(--ms-color-white) !important;
font-size: 0.8rem;
padding: 2px 5px;
border-radius: 5px;
}
.tag-orange {
background: var(--ms-color-orange-1);
color: var(--ms-color-white) !important;
font-size: 0.8rem;
padding: 2px 5px;
border-radius: 5px;
}
.tag-green {
background: var(--ms-color-success);
color: var(--ms-color-white) !important;
font-size: 0.8rem;
padding: 2px 5px;
border-radius: 5px;
}
.tag-blue {
background: var(--ms-color-Primary);
color: var(--ms-color-white) !important;
font-size: 0.8rem;
padding: 2px 5px;
border-radius: 5px;
}
.tag-red {
background: var(--ms-color-danger);
color: var(--ms-color-white) !important;
font-size: 0.8rem;
padding: 2px 5px;
border-radius: 5px;
}
.tag-dark {
background: var(--ms-color-dark);
color: var(--ms-color-white) !important;
font-size: 0.8rem;
padding: 2px 5px;
border-radius: 5px;
}
/*endregion tags*/
/*region HEADER*/
header {
position: sticky;
z-index: 999;
left: 0;
right: 0;
top: 0;
background-color: var(--ms-color-hell-2);
/*background-image: url("../images/pattern/pattern9.png");*/
}
/*region top header*/
header .top-header {
padding: 8px 0;
color: var(--ms-color-gray);
}
/*endregion top header*/
/*region basket*/
.basket-icon img {
width: 26px;
}
.basket-icon {
position: relative;
cursor: pointer;
background-color: var(--ms-color-Primary);
padding: 7px 10px;
border-radius: 8px;
}
.basket-icon .basket-qty {
position: absolute;
top: 16px;
right: 14px;
/*border: 1px solid var(--ms-color-danger);*/
border-radius: 50%;
width: 17px;
height: 17px;
text-align: center;
font-size: 12px;
padding: 0;
color: var(--ms-color-white);
}
/*endregion basket*/
/*region number box*/
.number-box {
display: flex;
background-color: var(--ms-color-hell);
border: 2px solid var(--ms-color-Primary);
padding: 6px 10px;
border-radius: 8px;
width: max-content;
}
header .number {
font-weight: 500;
color: var(--ms-color-dark);
display: flex;
align-items: center;
align-content: center;
margin-left: 8px;
/*letter-spacing: 2px;*/
/*animation: color-change-1 10s infinite;*/
}
header .phone-icon {
width: 20px;
height: 20px;
display: flex;
align-items: center;
align-content: center;
}
/*endregion number box*/
/*region header logo*/
.header-right-logo {
width: 110px;
}
.header-left-mobile-logo {
width: 50px;
}
/*endregion header logo*/
/*region search-box*/
.search-box {
justify-content: center;
}
.search-form {
position: relative;
max-width: 500px;
margin: 0 auto;
}
.search-form button {
position: absolute;
top: 0;
left: 0;
height: 42px;
background: var(--ms-color-Primary);
border-radius: 10px 0 0 10px;
color: var(--ms-color-white);
}
.search-form button:hover {
color: var(--ms-color-white);
background: var(--ms-color-Primary);
}
.search-form input {
height: 42px;
border-radius: 10px;
/*overflow: hidden;*/
background-color: var(--ms-color-hell);
border: none;
font-size: 13px;
}
.search-form input::placeholder {
color: var(--ms-color-gray);
}
.search-form input:focus {
background-color: var(--ms-color-hell-2);
}
/*endregion search-box*/
/*region login and register button*/
.login-btn, .register-btn {
font-weight: 600;
}
/*endregion login and register button*/
/*region username button*/
.username-btn {
font-weight: 400;
/*animation: color-change-1 10s infinite;*/
color: var(--ms-color-dark);
display: flex;
align-items: center;
}
/*endregion username button*/
/*region navbar menu*/
.dropdown-item {
padding: 8px;
/*white-space: normal;*/
/*display: flex;*/
/*align-items: center;*/
/*border-bottom: 1px solid var(--ms-color-hell-2);*/
}
.dropdown-item:hover,
.dropdown-item:focus {
background-color: #d0efff;
}
.dropdown-menu {
padding: 0;
}
.dropdown-menu li {
position: relative;
/*padding: 8px;*/
display: flex;
align-items: center;
border-bottom: 1px solid var(--ms-color-hell-2);
}
.dropdown-menu li:last-child {
border-bottom: none;
}
.dropdown-menu .dropdown-submenu {
display: none;
position: absolute;
right: 100%;
top: -7px;
}
.dropdown-menu .dropdown-submenu-left {
right: auto;
left: 100%;
}
.dropdown-menu > li:hover > .dropdown-submenu {
display: block;
}
.navbar {
background-color: var(--ms-color-Primary);
/*--bs-navbar-toggler-icon-bg: url('data:image/svg+xml,');*/
}
.navbar .nav-link {
color: var(--ms-color-white) !important;
font-weight: 400;
}
/*.navbar .nav-link:hover {*/
/* */
/*}*/
.navbar-collapse {
justify-content: center;
}
/*endregion navbar menu*/
/*endregion HEADER*/
/*region main-slider*/
.main-slider {
border-radius: 10px;
overflow: hidden;
display: flex;
justify-content: center;
height: 450px;
/*height: max-content;*/
width: 100%;
}
.main-slider .slider-swiper {
width: 100%;
}
.main-slider .slider-swiper .swiper-wrapper .swiper-slide {
text-align: center;
font-size: 18px;
background: var(--ms-color-white);
/* Center slide text vertically */
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
}
/*.main-slider .slider-swiper .swiper-wrapper .swiper-slide::after{*/
/* content: "";*/
/* background: linear-gradient(180deg, #666666, transparent);*/
/* width: 100%;*/
/* height: 100%;*/
/* top: 0;*/
/* right: 0;*/
/* left: 0;*/
/* opacity: 0.5;*/
/* position: absolute;*/
/*}*/
.main-slider .slider-swiper .swiper-wrapper .swiper-slide img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
opacity: 1;
}
.main-slider .slider-swiper .swiper-wrapper .swiper-slide .overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
/*background: rgba(0, 0, 0, 0.4);*/
/* background: rgb(240, 196, 196);*/
/*background: var(--overlay-color);*/
background: linear-gradient(to bottom, rgb(85 85 85) 0%, rgb(118 118 118 / 0%) 15%, rgba(0, 0, 0, 0) 100%);
mix-blend-mode: overlay;
}
.main-slider .slider-swiper .swiper-wrapper .swiper-slide .text {
position: relative;
z-index: 10;
}
.main-slider .slider-swiper .swiper-wrapper .swiper-slide .text h3 {
font-size: 2em;
font-weight: 700;
line-height: 1.5em;
color: var(--ms-color-hell);
margin: 20px 0;
}
.main-slider .slider-swiper .swiper-wrapper .swiper-slide .text p {
font-size: 1.1em;
font-weight: 400;
max-width: 600px;
color: var(--ms-color-hell);
}
.main-slider .slider-swiper .swiper-wrapper .swiper-slide .text a {
display: inline-block;
font-size: 1em;
font-weight: 700;
background: transparent;
border-radius: 10px;
border: 1px solid var(--ms-color-hell);
padding: 10px 30px;
color: var(--ms-color-hell);
margin-top: 10px;
transition: 0.2s;
}
.main-slider .slider-swiper .swiper-wrapper .swiper-slide .text a:hover {
background: var(--ms-color-secondary);
border: 1px solid var(--ms-color-secondary);
}
.swiper-pagination-bullet-active {
background: var(--ms-color-secondary);
}
.swiper-button-next, .swiper-button-prev {
color: var(--ms-color-secondary);
}
/*endregion main-slider*/
/*region course methods*/
.course-method {
padding: 10px;
border-radius: 15px;
width: 100%;
background: #f3f3f3;
border: 4px solid #f1f1f1;
transition: all 0.5s;
}
.course-method img {
width: 80px;
}
.course-method p {
font-weight: 900;
font-size: 1.2rem;
}
.course-method:hover {
/*border-bottom: 4px solid #464646;*/
transform: translate(0px, -3px);
}
.course-subject-title {
color: var(--ms-color-Primary);
font-weight: 600;
}
/*endregion course methods*/
/*region category-slider*/
.category-slider {
border-radius: 10px;
overflow: hidden;
display: flex;
justify-content: center;
/*height: 150px;*/
height: max-content;
width: 100%;
}
.category-slider .slider-swiper {
width: 100%;
padding: 10px
}
.category-slider .slider-swiper .swiper-wrapper .swiper-slide {
text-align: center;
background: #fff;
/* Center slide text vertically */
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: flex-start;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
flex-direction: column;
background: var(--ms-color-hell-3);
padding: 20px;
border: 1px solid rgb(198 222 235);
border-radius: 20px;
transition: .3s;
}
.category-slider .slider-swiper .swiper-wrapper .swiper-slide:hover {
box-shadow: 0 0 10px 1px var(--ms-color-Primary);
}
.category-slider .slider-swiper .swiper-wrapper .swiper-slide img {
width: 50%;
}
.swiper-pagination-bullet-active {
background: var(--ms-color-secondary);
}
.swiper-button-next, .swiper-button-prev {
color: var(--ms-color-secondary);
;
}
.category-slider-title {
font-size: 1.5rem;
font-weight: 700;
}
.category-slider p {
margin-top: 20px;
overflow-wrap: anywhere;
}
/*endregion category-slider*/
/*region join us*/
.join-us {
background-color: var(--ms-color-hell-2);
position: relative;
width: 100%;
height: 220px;
margin-top: 160px;
}
.join-us img {
position: absolute;
width: 500px;
top: -100px;
right: 50%;
transform: translate(50%, 0%);
}
/*endregion join us*/
/*region course-slider*/
.not-exist-course {
background: #007ec524;
padding: 10px;
text-align: center;
border-radius: 6px;
color: var(--ms-color-gray);
}
.course-slider {
overflow: hidden;
display: flex;
justify-content: center;
height: max-content;
width: 100%;
box-shadow: 0 1px 6px 1px #eee;
padding: 12px;
background: var(--ms-color-white);
}
.course-slider .slider-swiper {
width: 100%;
}
.course-box {
text-align: center;
background: var(--ms-color-white);
/* Center slide text vertically */
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: flex-start;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
flex-direction: column;
background: var(--ms-color-hell);
padding: 10px;
border: 1px solid #f3f3f3;
overflow: hidden;
}
.course-box img {
width: 100%;
transition: 0.5s;
height: 234px;
object-fit: contain;
}
/*.course-box img:hover {*/
/* transform: scale(1.1);*/
/*}*/
.swiper-pagination-bullet-active {
background: var(--ms-color-secondary);
}
.swiper-button-next, .swiper-button-prev {
color: var(--ms-color-secondary);
}
.course-slider-title {
font-size: 1.5rem;
font-weight: 700;
}
.course-box .text-header {
font-size: 0.7rem;
width: 100%;
margin-top: 25px;
font-weight: 600;
color: var(--ms-color-secondary);
}
.course-box .text-main {
margin-top: 25px;
width: 100%;
}
.course-box .text-main h1 {
height: 58px;
line-height: 1.8rem;
font-size: 1rem;
font-weight: 700;
color: var(--ms-color-dark);
}
.course-box .text-main span {
font-size: 0.7rem;
font-weight: 600;
color: var(--ms-color-gray-2);
}
.course-box .text-footer {
padding-top: 10px;
margin-top: 15px;
width: 100%;
border-top: 1px dashed var(--ms-color-gray-2);
}
.course-box .text-footer .old-price {
font-size: 0.8rem;
font-weight: 600;
color: var(--ms-color-danger);
text-decoration: line-through;
min-height: 21px;
}
.course-box .text-footer .old-price small {
font-size: 0.8rem;
font-weight: 600;
color: var(--ms-color-danger);
text-decoration: none !important;
}
.course-box .text-footer .price {
font-size: 1.1rem;
font-weight: 600;
color: var(--ms-color-dark);
}
.course-box .text-footer .price small {
font-size: 0.8rem;
font-weight: 600;
color: var(--ms-color-dark);
}
.button-add-to-card {
width: 100%;
display: block;
padding: 5px;
}
.course-slider-tabs {
justify-content: center;
}
/*.course-slider-tabs .nav-link{*/
/* background: linear-gradient(2deg, #e9ffec, #d9ead8);*/
/* color: black;*/
/* margin-bottom: 10px;*/
/* border-radius: 0;*/
/* border: none;*/
/*}*/
/*.course-slider-tabs .nav-link:first-child{*/
/* border-radius: 0 20px 20px 0;*/
/*}*/
/*.course-slider-tabs .nav-link:last-child{*/
/* border-radius: 20px 0 0 20px;*/
/*}*/
/*.course-slider-tabs .nav-link:focus,*/
/*.course-slider-tabs .nav-link:active{*/
/* background: linear-gradient(2deg, #00c10f, #67ff55);*/
/* color: white;*/
/*}*/
.course-slider-tabs .nav-link {
/*background: linear-gradient(2deg, #aeecff, #91eef7);*/
background: var(--ms-color-white);
color: black;
margin-bottom: 10px;
border-radius: 20px;
/*border: none;*/
margin-left: 10px;
border: 1px solid var(--ms-color-hell-2);
}
/*.course-slider-tabs .nav-link:first-child{*/
/* border-radius: 0 20px 20px 0;*/
/*}*/
/*.course-slider-tabs .nav-link:last-child{*/
/* border-radius: 20px 0 0 20px;*/
/*}*/
.course-slider-tabs .nav-link:focus,
.course-slider-tabs .nav-link:active,
.course-slider-tabs .nav-link.active {
/*background: linear-gradient(2deg, #00c9ff, #0095ff);*/
background: var(--ms-color-Primary);
color: white;
border: none;
}
/*endregion course-slider*/
/*region consultation request*/
.consultation-request {
text-align: center;
justify-content: center;
margin-top: 80px;
background-color: var(--ms-color-dark);
color: var(--ms-color-white);
padding: 40px 20px;
}
.consultation-request input {
border-radius: 5px;
}
.consultation-request p {
color: var(--ms-color-white);
font-weight: 600;
font-size: 0.9rem;
}
.consultation-request h2 {
color: var(--ms-color-white);
font-weight: 700;
}
.button-consultation-request {
padding: 5px 12px;
}
/*endregion consultation request*/
/*region video*/
.video {
background-color: var(--ms-color-dark);
/*background-image: url("../images/pattern/pattern5.jpg");*/
/*background: url('../images/pattern/footer-pattern.png') repeat 0 0 var(--ms-color-dark);*/
padding: 20px;
margin-top: 80px;
/*background-attachment: fixed;*/
/*background-repeat: repeat;*/
/*background-size: contain;*/
position: relative;
}
/*.video::after {*/
/* content: "";*/
/* background: linear-gradient(180deg, transparent, #000);*/
/* width: 100%;*/
/* height: 100%;*/
/* top: 0;*/
/* right: 0;*/
/* left: 0;*/
/* opacity: 0.5;*/
/* position: absolute;*/
/*}*/
.video h2 {
color: var(--ms-color-white);
font-weight: 700;
}
.video .video-box div {
border-radius: 8px;
overflow: hidden;
}
/*endregion video*/
/*region book-slider*/
.book-slider {
overflow: hidden;
display: flex;
justify-content: center;
height: max-content;
width: 100%;
box-shadow: 0 1px 6px 1px #eee;
padding: 12px;
background: var(--ms-color-white);
}
.book-slider .slider-swiper {
width: 100%;
}
.book-box {
text-align: center;
background: var(--ms-color-white);
/* Center slide text vertically */
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: flex-start;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
flex-direction: column;
background: var(--ms-color-hell);
padding: 10px;
border: 1px solid #f3f3f3;
overflow: hidden;
border-radius: 24px;
height: 560px;
}
.book-box img {
width: 100%;
height: 350px;
object-fit: cover;
transition: 0.5s;
border-radius: 20px 20px 0 0;
}
.book-slider-title {
font-size: 1.5rem;
font-weight: 700;
}
.book-box .text-header {
font-size: 0.7rem;
width: 100%;
margin-top: 25px;
font-weight: 600;
color: var(--ms-color-secondary);
}
.book-box .text-main {
margin-top: 25px;
width: 100%;
}
.book-box .text-main h1 {
height: 55px;
line-height: 1.5rem;
font-size: 0.85rem;
font-weight: 600;
color: var(--ms-color-dark);
}
.book-box .text-main span {
font-size: 0.7rem;
font-weight: 600;
color: var(--ms-color-gray-2);
}
.book-box .text-footer {
padding-top: 5px;
margin-top: 15px;
width: 100%;
border-top: 1px dashed var(--ms-color-gray-2);
}
.book-box .text-footer div:first-child {
height: 20px;
}
.book-box .text-footer .old-price {
font-size: 0.8rem;
font-weight: 600;
color: var(--ms-color-danger);
text-decoration: line-through;
}
.book-box .text-footer .old-price small {
font-size: 0.7rem;
font-weight: 600;
color: var(--ms-color-danger);
text-decoration: none !important;
}
.book-box .text-footer .price {
font-size: 1rem;
font-weight: 600;
color: var(--ms-color-dark);
}
.book-box .text-footer .price small {
font-size: 0.7rem;
font-weight: 600;
color: var(--ms-color-dark);
margin-right: 4px;
}
.button-add-to-card {
width: 100%;
display: block;
padding: 5px;
}
/*endregion course-slider*/
/*region customer-slider*/
.customer-slider {
border-radius: 10px;
overflow: hidden;
display: flex;
justify-content: center;
height: max-content;
width: 100%;
}
.customer-slider .slider-swiper {
width: 100%;
}
.customer-slider .slider-swiper .swiper-wrapper .swiper-slide {
text-align: center;
background: #fff;
/* Center slide text vertically */
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
flex-direction: column;
/*background: var(--ms-color-hell-2);*/
padding: 20px;
}
.customer-slider .slider-swiper .swiper-wrapper .swiper-slide img {
width: 80%;
}
.swiper-pagination-bullet-active {
background: var(--ms-color-secondary);
}
.swiper-button-next, .swiper-button-prev {
color: var(--ms-color-secondary);
;
}
.customer-slider-title {
font-size: 1.5rem;
font-weight: 700;
}
/*endregion customer-slider*/
/*region statistic-info*/
.statistic-info {
margin-top: 80px;
background-color: var(--ms-color-hell-2);
padding: 40px 20px;
}
.statistic-info-box {
padding: 10px;
}
.statistic-info-box img {
width: 50px;
}
.statistic-info-box p {
color: var(--ms-color-gray);
font-weight: 600;
font-size: 0.9rem;
margin-top: 10px;
}
/*endregion consultation request*/
/*region blog-slider*/
.blog-slider {
overflow: hidden;
display: flex;
justify-content: center;
/*height: 410px;*/
height: max-content;
width: 100%;
box-shadow: 0 1px 6px 1px #eee;
padding: 12px;
background: var(--ms-color-white);
}
.blog-slider .slider-swiper {
width: 100%;
}
.blog-slider .slider-swiper .swiper-wrapper .swiper-slide {
text-align: center;
background: var(--ms-color-white);
/* Center slide text vertically */
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: flex-start;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
flex-direction: column;
background: var(--ms-color-hell);
padding: 20px;
}
.blog-slider .slider-swiper .swiper-wrapper .swiper-slide img {
width: 100%;
height: 200px;
object-fit: cover;
}
.swiper-pagination-bullet-active {
background: var(--ms-color-secondary);
}
.swiper-button-next, .swiper-button-prev {
color: var(--ms-color-secondary);
;
}
.blog-slider-title {
font-size: 1.5rem;
font-weight: 700;
}
.blog-slider .text-header {
font-size: 0.7rem;
width: 100%;
margin-top: 25px;
font-weight: 600;
color: var(--ms-color-danger);
}
.blog-slider .text-main {
margin-top: 25px;
width: 100%;
}
.blog-slider .text-main h1 {
height: 58px;
line-height: 1.8rem;
font-size: 1rem;
font-weight: 700;
color: var(--ms-color-dark);
}
.blog-slider .text-footer {
padding-top: 10px;
margin-top: 15px;
width: 100%;
}
/*endregion blog-slider*/
/*region license*/
.license-slider {
overflow: hidden;
display: flex;
justify-content: center;
height: max-content;
width: 100%;
box-shadow: 0 1px 6px 1px #eee;
padding: 12px;
background: var(--ms-color-white);
}
.license-slider .slider-swiper {
width: 100%;
}
.license-slider .slider-swiper .swiper-wrapper .swiper-slide {
text-align: center;
background: var(--ms-color-white);
/* Center slide text vertically */
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
flex-direction: column;
background: var(--ms-color-hell);
padding: 20px;
}
.license-slider .slider-swiper .swiper-wrapper .swiper-slide img {
width: 100%;
}
.license-slider-title {
font-size: 1.5rem;
font-weight: 700;
}
.license-slider .license-box {
overflow: hidden;
}
.license-slider .license-box .box-header {
overflow: hidden;
transition: 0.5s;
position: relative;
}
.license-slider .license-box .box-header img {
width: 100%;
transition: 1s;
}
.license-slider .license-box .box-header p {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 2;
text-align: center;
font-size: 1.5rem;
display: none;
color: var(--ms-color-white);
width: 100%;
background-color: var(--ms-color-dark);
mix-blend-mode: hard-light;
padding: 10px 3px;
}
.license-slider .license-box .box-header:hover img {
opacity: 0.9;
transform: scale(1.1);
}
.license-slider .license-box .box-header:hover p {
display: block;
}
/*endregion license*/
/*region FOOTER*/
footer {
background-color: var(--ms-color-dark);
padding: 50px;
width: 100%;
height: max-content;
margin-top: 100px;
color: var(--ms-color-hell);
font-size: 0.9rem;
}
.footer-logo {
width: 100px;
}
footer h4 {
font-size: 1.1rem;
}
.footer-links li {
margin-top: 10px;
}
.footer-links li a {
color: var(--ms-color-hell);
transition: 0.5s;
}
.footer-links li:hover a {
color: var(--ms-color-Primary);
}
footer .email-register {
border-radius: 0;
width: 100%;
position: relative;
}
footer .email-register input {
border-radius: 0 !important;
padding-left: 80px;
text-align: right;
height: 100%;
}
footer .button-email-register {
padding: 5px 15px;
border-radius: 0;
position: absolute;
left: 0;
top: 0;
height: 100%;
}
/*region social media*/
.social-media {
display: flex;
flex-wrap: wrap;
gap: 7px;
}
.social-media-icon {
width: 20px;
height: 20px;
}
/*endregion social media*/
/*region symbol-slider*/
.symbols-slider {
overflow: hidden;
display: flex;
justify-content: center;
height: max-content;
width: 100%;
padding: 12px;
}
.symbols-slider .slider-swiper {
width: 100%;
}
.symbols-slider .slider-swiper .swiper-wrapper .swiper-slide {
text-align: center;
/* Center slide text vertically */
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: flex-start;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
flex-direction: column;
padding: 20px;
}
.symbols-slider .slider-swiper .swiper-wrapper .swiper-slide img {
width: 100%;
}
/*endregion symbol*/
/*region footer fix-menu*/
.fix-menu-footer {
background: var(--ms-color-dark-2);
padding: 14px;
position: fixed;
bottom: 0;
left: 0;
right: 0;
z-index: 999;
mix-blend-mode: hard-light;
}
.fix-menu-footer a {
color: var(--ms-color-hell);
font-weight: 300;
font-size: 1rem;
}
/*endregion footer fix-menu*/
/*endregion FOOTER*/
/*region site map*/
.site-map {
background-image: url(../images/background/4654.jpg);
/* background-attachment: fixed; */
background-size: cover;
padding: 20px;
height: 100px;
position: relative;
display: flex;
align-items: center;
background-repeat: no-repeat;
}
.site-map::before {
content: "";
background: linear-gradient(180deg, #666666, #2a2a2a);
width: 100%;
height: 100%;
top: 0;
right: 0;
left: 0;
opacity: 0.1;
position: absolute;
}
.site-map a {
color: var(--ms-color-black);
font-weight: 400;
font-size: 16px;
z-index: 3;
}
.site-map svg {
color: var(--ms-color-black);
font-weight: 600;
font-size: 18px;
z-index: 3;
}
/*endregion site map*/
/*region ms box*/
.ms-box {
background: var(--ms-color-white);
box-shadow: 0 0 2px 2px var(--ms-color-hell-2);
padding: 10px;
display: flex;
justify-content: center;
align-items: center;
height: max-content;
flex-direction: column;
}
.ms-box-title {
font-size: 1.2rem;
color: var(--ms-color-dark);
border-bottom: 1px solid var(--ms-color-hell-2);
padding: 10px;
width: 100%;
}
/*endregion ms box*/
/*region range slider*/
.noUi-target, .noUi-target * {
-webkit-touch-callout: none;
-webkit-user-select: none;
-ms-touch-action: none;
touch-action: none;
-ms-user-select: none;
-moz-user-select: none;
user-select: none;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.noUi-target {
position: relative;
direction: ltr;
}
.noUi-base {
width: 100%;
height: 100%;
position: relative;
z-index: 1;
/* Fix 401 */
}
.noUi-origin {
position: absolute;
right: 0;
top: 0;
left: 0;
bottom: 0;
}
.noUi-handle {
position: relative;
z-index: 1;
}
.noUi-stacking .noUi-handle {
z-index: 10;
}
.noUi-state-tap .noUi-origin {
-webkit-transition: left 0.3s, top .3s;
transition: left 0.3s, top .3s;
}
.noUi-state-drag * {
cursor: inherit !important;
}
.noUi-base, .noUi-handle {
/*-webkit-transform: translate3d(0, 0, 0);*/
transform: translate3d(0, 0, 0);
}
.noUi-horizontal {
height: 4px;
}
.noUi-horizontal .noUi-handle {
width: 18px;
height: 18px;
border-radius: 50%;
left: -7px;
top: -7px;
background-color: #345DBB;
}
.noUi-background {
background: #D6D7D9;
}
.noUi-connect {
background: #345DBB;
-webkit-transition: background 450ms;
transition: background 450ms;
}
.noUi-origin {
border-radius: 2px;
}
.noUi-target {
border-radius: 2px;
}
.noUi-target.noUi-connect {
}
.noUi-draggable {
cursor: w-resize;
}
.noUi-vertical .noUi-draggable {
cursor: n-resize;
}
.noUi-handle {
cursor: default;
-webkit-box-sizing: content-box !important;
-moz-box-sizing: content-box !important;
box-sizing: content-box !important;
}
.noUi-handle:active {
/*border: 8px solid #345DBB;*/
border: 8px solid rgba(53, 93, 187, 0.38);
-webkit-background-clip: padding-box;
background-clip: padding-box;
left: -14px;
top: -14px;
}
[disabled].noUi-connect, [disabled] .noUi-connect {
background: #B8B8B8;
}
[disabled].noUi-origin, [disabled] .noUi-handle {
cursor: not-allowed;
}
.caption {
font-size: 10px !important;
}
.slider-range-value2 {
font-size: 10px !important;
}
/*endregion range slider*/
/*region main-search-form*/
.main-search-form {
width: 100%;
position: relative;
}
.main-search-form button {
position: absolute;
left: 0;
top: 0;
display: flex;
align-items: center;
height: 100%;
padding: 10px;
}
.main-search-form button svg,
.main-search-form input::placeholder {
color: var(--ms-color-gray-2)
}
.consultation-request input,
.consultation-request input::placeholder,
.consultation-request select {
color: var(--ms-color-gray);
}
/*endregion main-search-form*/
/*region category vertical menu*/
.first-level-item {
margin-top: 4px;
}
.first-level-item button a {
/*background: var(--ms-color-hell-4);*/
width: 100%;
display: block;
/*padding: 8px 10px;*/
color: var(--ms-color-dark);
font-weight: 600;
}
.second-level {
/*margin-right: 2rem;*/
}
.second-level-item {
padding: 8px 12px;
/*background: #fbfbfb;*/
margin: 4px 0;
}
.second-level-item a {
color: var(--ms-color-gray-2);
display: block;
}
/*endregion category vertical menu*/
/*region vertical menu accordion*/
.vertical-menu.accordion .accordion-item {
/*margin: 10px 0;*/
border: none;
}
.vertical-menu.accordion .accordion-button {
/*font-weight: 600;*/
/*font-size: 18px;*/
background-color: var(--ms-color-hell-2);
/*color: var(--ms-color-white);*/
}
.vertical-menu.accordion .accordion-button:focus {
border: none !important;
box-shadow: none !important;
}
.vertical-menu.accordion .accordion-button:after {
background-image: url("data:image/svg+xml,") !important;
}
.vertical-menu.accordion .accordion-body {
padding: 5px 15px;
}
.no-after::after {
content: none;
}
/*endregion vertical menu accordion*/
/*region course-info*/
.course-info-wrapper {
overflow-y: scroll;
display: block;
height: 99%;
/*width: 100%;*/
box-shadow: 0 1px 6px 1px #eee;
padding: 4px 25px;
background: var(--ms-color-white);
}
.course-info-wrapper .course-info-box {
overflow: hidden;
display: block;
width: 100%;
margin: 15px 0;
border-bottom: 1px solid #eee;
padding: 15px 15px;
background: var(--ms-color-hell-3);
border-radius: 15px 0 15px 0;
}
.course-info-wrapper .course-info-box > *:nth-child(1),
.course-info-wrapper .course-info-box > *:nth-child(2) {
color: var(--ms-color-gray);
}
.course-info-wrapper .course-info-box > *:nth-child(3) {
color: var(--ms-color-black);
font-weight: 600;
}
.course-info-wrapper .course-info-box > *:nth-child(5) {
color: var(--ms-color-black);
font-weight: 600;
}
/*endregion course-info*/
/*region text-box*/
.text-box {
/*text-align: center;*/
background: var(--ms-color-hell-2);
/*background-image: url("../images/background/bg333.png");*/
background-size: cover;
background-repeat: no-repeat;
/*background-position: left;*/
padding: 30px;
border-radius: 20px;
/*margin: 20px 0;*/
/*box-shadow: inset -10px -10px 15px rgba(255, 255, 255, 0.5),*/
/*inset 10px 10px 15px rgba(70, 70, 70, 0.12);*/
/*box-shadow: -10px -10px 15px rgba(255,255,255,0.5),*/
/*10px 10px 15px rgba(70,70,70,0.12);*/
box-shadow: -10px -10px 15px rgba(255, 255, 255, 0.5), 10px 10px 15px rgba(70, 70, 70, 0.12), inset -10px -10px 15px rgba(255, 255, 255, 0.5), inset 10px 10px 15px rgba(70, 70, 70, 0.12);
border-style: double;
border-width: 5px;
border-color: var(--ms-color-white);
/*border-image: linear-gradient(to right, #49494b, #868686) 1;*/
line-height: 2rem;
}
.lh-custom {
line-height: 2rem;
}
/*.text-box::after{*/
/* content: "";*/
/* opacity: 0.3;*/
/* position: absolute;*/
/* top: 0;*/
/* left: 0;*/
/* width: 100%;*/
/* height: 100%;*/
/* background: #eee;*/
/*}*/
.text-box h5 {
color: var(--ms-color-Primary);
font-weight: 600;
}
.text-box p.justify {
line-height: 2rem;
text-align: justify;
}
.text-box p.no-justify {
line-height: 2rem;
text-align: right;
}
.text-box ul {
list-style: inside;
text-align: right;
}
/*endregion text-box*/
/*region Course Subject*/
.course-subjects .accordion-item {
margin: 10px 0;
border: none;
}
.course-subjects .accordion-button {
font-weight: 600;
font-size: 18px;
background-color: var(--ms-color-Primary);
color: var(--ms-color-white);
/*background-image: url("../images/background/8856.jpg");*/
/*background-position: left;*/
/*background-size: contain;*/
/*background-repeat: no-repeat;*/
}
.course-subjects .accordion-button:focus {
border: none !important;
box-shadow: none !important;
}
.course-subjects .accordion-button:after {
background-image: url("data:image/svg+xml,") !important;
}
.course-subjects .accordion-body-inner {
/*background: var(--ms-color-hell-4);*/
padding: 10px;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: var(--ms-color-hell-2);
/*border-image: linear-gradient(to right, #ffffff,#bce7ff, white) 1;*/
border-right-width: 4px;
border-right-style: solid;
border-right-color: #4bbeff;
margin: 10px 0;
}
.course-subjects .episode-link:hover {
color: var(--ms-color-success);
}
.course-subjects .course-tag.free {
padding: 2px 5px;
background: var(--ms-color-success);
color: var(--ms-color-white);
border-radius: 4px;
font-size: 0.8rem;
}
.course-subjects .course-tag.non-free {
padding: 2px 5px;
background: var(--ms-color-gray-2);
color: var(--ms-color-white);
border-radius: 4px;
font-size: 0.8rem;
}
/*endregion Course Subject*/
/*region Educational Calendar*/
.educational-calendar {
margin: 60px 20px 20px 20px;
}
.educational-calendar h5 {
font-weight: 600;
}
.educational-calendar .calendar-box {
border: 4px double var(--ms-color-success);
border-radius: 20px;
padding: 10px;
text-align: center;
background-color: var(--ms-color-hell);
/*background-image: url("../images/background/calendar3.png");*/
/*background-position: left;*/
/*background-size: contain;*/
/*background-repeat: no-repeat;*/
}
.educational-calendar .calendar-box p {
color: var(--ms-color-success);
}
.educational-calendar .calendar-box p:last-child {
margin: 0;
}
.calendar-img {
width: 50px;
}
/*endregion Educational Calendar*/
/*region Poll*/
.poll {
margin: 60px 20px 20px 20px;
}
.poll h5 {
font-weight: bold;
}
/*.poll h5:before,*/
/*.poll h5:after {*/
/* content:" ";*/
/* display: block;*/
/* height: 2px;*/
/* width: 130px;*/
/* position: absolute;*/
/* top: 50%;*/
/* left: 0;*/
/* background: red;*/
/*}*/
.poll .poll-box {
/*background: var(--ms-color-hell-3);*/
padding: 15px;
border-radius: 15px;
/*border: 1px solid var(--ms-color-Primary);*/
border-bottom-width: 2px;
border-bottom-style: solid;
border-image: linear-gradient(to right, var(--ms-color-hell-2), var(--ms-color-gray-2), var(--ms-color-hell-2)) 1;
}
/*endregion Poll*/
/*region exam*/
.exam {
margin: 60px 20px 20px 20px;
}
.exam h5 {
font-weight: bold;
}
.exam .exam-box {
/*background: var(--ms-color-hell-3);*/
padding: 15px;
border-radius: 15px;
/*border: 1px solid var(--ms-color-Primary);*/
border-bottom-width: 2px;
border-bottom-style: solid;
border-image: linear-gradient(to right, var(--ms-color-hell-2), var(--ms-color-gray-2), var(--ms-color-hell-2)) 1;
}
/*endregion exam*/
/*region Write Opinion*/
.write-opinion {
margin: 60px 20px 20px 20px;
}
.write-opinion h5 {
font-weight: bold;
}
.write-opinion textarea {
width: 50%;
border-radius: 15px;
/*border: 1px solid var(--ms-color-hell-2);*/
border: 1px solid #007ec5;
background: var(--ms-color-hell);
padding: 20px;
outline: none;
}
/*endregion Write Opinion*/
/*region Read Opinion*/
.read-opinion {
margin: 60px 20px 20px 20px;
justify-content: center;
}
.read-opinion h5, h6 {
font-weight: bold;
}
.read-opinion span.comment-date {
font-size: 12px;
color: var(--ms-color-gray);
}
.read-opinion p {
color: var(--ms-color-gray);
text-align: justify;
}
.read-opinion .comment {
border-bottom-width: 1px;
border-bottom-style: dotted;
border-image: linear-gradient(to right, var(--ms-color-hell-2), var(--ms-color-hell-4), var(--ms-color-hell-2)) 1;
margin-bottom: 30px;
padding: 20px 0;
}
.read-opinion .comment .user-photo {
border-radius: 50%;
width: 80%;
}
.read-opinion > div:last-child .comment {
border-bottom: none;
margin-bottom: 0;
}
/*endregion Read Opinion*/
/*region book detail*/
.book-img {
width: 100%;
box-shadow: -5px 5px 8px var(--ms-color-gray-2);
}
.book-title {
margin-bottom: 0;
}
.book-writer {
font-size: 0.7rem;
color: var(--ms-color-gray-2);
margin-bottom: 10px;
border-bottom: 1px solid #eee;
}
.book-category span {
background: var(--ms-color-danger);
padding: 1px 5px;
color: var(--ms-color-white);
border-radius: 3px;
}
.book-language,
.book-category,
.book-page-qty,
.book-isbn,
.book-file-type,
.book-size,
.book-bye-qty {
font-size: 0.8rem;
color: var(--ms-color-gray);
margin-top: 10px;
}
.prices {
margin: 20px 0;
}
.book-price {
font-size: 1.3rem;
color: var(--ms-color-danger);
font-weight: 600;
}
.book-price-old {
color: var(--ms-color-gray-2);
text-decoration: line-through;
font-size: 0.9rem;
}
.book-description {
padding: 20px;
line-height: 2rem;
text-align: right;
font-size: 0.9rem;
}
.book-file-link {
padding: 20px;
line-height: 2rem;
text-align: right;
font-size: 0.9rem;
}
.book-file-link span {
border-right: 4px solid var(--ms-color-Primary-2);
border-left: 4px solid var(--ms-color-Primary-2);
padding: 3px 10px;
/* border-bottom: 2px solid #eee; */
border-radius: 12px;
}
/*endregion book detail*/
/*region profile-box-1*/
.profile-box-1 {
background: #f1faff;
/*background: url(../images/pattern/pattern9.png);*/
position: relative;
border-radius: 60px;
padding: 20px 15px 12px 15px;
border: 4px solid var(--ms-color-orange-1);
box-shadow: 0 0 6px 2px var(--ms-color-gray-2);
transition: 0.3s;
overflow: hidden;
}
.profile-box-1 .profile-img {
width: 100%;
border-radius: 30px;
border: 4px double #ffdfa5;
object-fit: cover;
transition: 0.3s;
}
.profile-box-1 h5 {
color: var(--ms-color-black);
font-size: 1rem;
}
.profile-box-1 small {
color: var(--ms-color-gray-2);
}
.profile-box-1 .social-box {
}
.profile-box-1 .social-box img {
width: 100%;
}
.profile-box-1 .social-box > div {
padding: 4px 6px;
border-radius: 5px;
background: rgba(255, 255, 255, 0.31);
}
.profile-box-1:hover {
transform: translate(0, -2px);
box-shadow: 0 0 8px 3px var(--ms-color-gray-2);
}
.profile-box-1:hover .profile-img {
border-color: #ffdfa5;
border-style: solid;
}
/*endregion profile-box-1*/
/*region profile-slider*/
.profile-box-1 .profile-social-slider {
border-radius: 20px;
overflow: hidden;
display: flex;
justify-content: center;
height: max-content;
/*width: 100%;*/
background: #ffdfa5;
padding: 8px 12px;
}
.profile-box-1 .profile-social-slider .slider-swiper {
width: 100%;
}
/*endregion profile-slider*/
/*region profile-box-3*/
.profile-box-3 {
background: #f1faff;
/*background: url("../images/pattern/pattern9.png");*/
position: relative;
border-radius: 60px;
padding: 20px 15px 12px 15px;
border: 6px solid var(--ms-color-Primary);
box-shadow: 0 0 6px 2px var(--ms-color-gray-2);
transition: 0.3s;
overflow: hidden;
}
.profile-box-3 .profile-img {
width: 100%;
border-radius: 30px;
object-fit: cover;
transition: 0.3s;
border: 4px double #9edcff;
height: 240px;
}
.profile-box-3 h5 {
color: var(--ms-color-black);
font-size: 1rem;
}
.profile-box-3 small {
color: var(--ms-color-gray-2);
}
.profile-box-3 .social-box {
}
.profile-box-3 .social-box img {
width: 100%;
}
.profile-box-3 .social-box > div {
padding: 4px 6px;
border-radius: 5px;
background: rgba(255, 255, 255, 0.31);
}
.profile-box-3:hover {
transform: translate(0, -2px);
box-shadow: 0 0 8px 3px var(--ms-color-gray-2);
}
.profile-box-3:hover .profile-img {
border-color: #9edcff;
border-style: solid;
}
.profile-box-3 .profile-social-slider {
border-radius: 20px;
overflow: hidden;
display: flex;
justify-content: center;
height: max-content;
/*width: 100%;*/
background: #9edcff;
padding: 8px 12px;
}
.profile-box-3 .profile-social-slider .slider-swiper {
width: 100%;
}
/*endregion profile-box-3*/
/*region profile-box-2*/
.profile-box-2 {
background: var(--ms-color-hell-3);
/*background: url("../images/pattern/pattern9.png");*/
position: relative;
border-radius: 19px;
padding: 20px 15px;
/* border-right: 2px solid var(--ms-color-Primary); */
box-shadow: 0 0 6px 2px var(--ms-color-hell-2);
transition: 0.5s;
border-bottom: 8px solid var(--ms-color-Primary);
height: 292px;
}
.profile-box-2 .profile-img {
width: 100px;
border-radius: 30px;
height: 100px;
border: 4px double var(--ms-color-Primary);
object-fit: cover;
transition: 0.5s;
padding: 8px;
}
.profile-box-2 h5 {
color: var(--ms-color-black);
}
.profile-box-2 small {
color: var(--ms-color-gray-2);
}
.profile-box-2:hover {
transform: translate(0, -5px);
}
.profile-box-2:hover .profile-img {
border-width: 4px;
border-style: solid;
border-color: var(--ms-color-Primary);
}
/*endregion profile-box-1*/
/*region teacher detail*/
.ms-box-black {
background-color: var(--ms-color-Primary);
padding: 10px;
height: 200px;
background-image: url("../images/pattern/bubble2.png");
/*background-size: cover;*/
background-repeat: repeat;
background-position: left;
border-radius: 35px 35px 0 0;
}
.img-relative-container {
position: relative;
/*width: 180px;*/
height: 180px;
}
.ms-box-black img {
/*position: absolute;*/
/*bottom: -100px;*/
/*right: 0;*/
width: 100%;
object-fit: cover;
height: 100%;
border-width: 5px;
border-style: solid;
border-color: var(--ms-color-white);
border-radius: 40px 0;
}
.ms-box-black .teacher-name,
.ms-box-black .teacher-phone {
margin: 10px 0;
color: var(--ms-color-white);
font-size: 1.5rem;
font-weight: 500;
}
.teacher-information {
border-right: 4px solid var(--ms-color-Primary);
padding-right: 20px;
}
.teacher-information > .info-item {
margin: 10px 0;
color: var(--ms-color-gray-2);
font-size: 0.9rem;
}
.teacher-information > .field-of-job {
line-height: 2rem;
}
.teacher-information > .info-item span {
color: var(--ms-color-dark);
}
.teacher-information .social-box {
display: flex;
margin-right: 5px;
gap: 5px;
flex-wrap: wrap;
}
.teacher-information .social-item {
width: 35px;
height: 35px;
padding: 8px;
border-radius: 50%;
background-color: rgb(96 96 96 / 90%);
}
.teacher-information .social-item.youtube:hover {
background-color: var(--youtube-clr-1);
}
.teacher-information .social-item.instagram:hover {
background: linear-gradient(200deg, var(--instagram-clr-1), var(--instagram-clr-2), var(--instagram-clr-3), var(--instagram-clr-4), var(--instagram-clr-5), var(--instagram-clr-6), var(--instagram-clr-7), var(--instagram-clr-8), var(--instagram-clr-9), var(--instagram-clr-10));
}
.teacher-information .social-item.linkedin:hover {
background-color: var(--linkedin-clr-1);
}
.teacher-information .social-item.whatsapp:hover {
background-color: var(--whatsapp-clr-1);
}
.teacher-information .social-item.facebook:hover {
background-color: var(--facebook-clr-1);
}
.teacher-information .social-item.twitter:hover {
background-color: var(--twitter-clr-1);
}
.teacher-information .social-item.telegram:hover {
background-color: var(--telegram-clr-1);
}
.teacher-information .social-item.aparat:hover {
background-color: var(--aparat-clr-1);
}
.teacher-information .social-item.bale:hover {
background: linear-gradient(200deg, var(--bale-clr-1), var(--bale-clr-2));
}
.teacher-information .social-item.eitaa:hover {
background-color: var(--eitaa-clr-1);
}
.teacher-information .social-item.igap:hover {
background: linear-gradient(45deg, var(--igap-clr-1), var(--igap-clr-2));
}
.teacher-information .social-item.soroush:hover {
background-color: var(--soroush-clr-1);
}
.teacher-information .social-item img {
width: 100%;
}
.teacher-information .resume a {
color: var(--ms-color-white);
}
.teacher-information .accordion-item {
margin: 10px 0;
border: none;
}
.teacher-other-info .accordion-button {
font-weight: 600;
font-size: 18px;
background-color: var(--ms-color-hell-2);
color: var(--ms-color-black);
/*background-image: url("../images/background/8856.jpg");*/
/*background-position: left;*/
/*background-size: contain;*/
/*background-repeat: no-repeat;*/
}
.teacher-other-info .accordion-button:focus {
border: none !important;
box-shadow: none !important;
}
.teacher-other-info .accordion-button:after {
background-image: url("data:image/svg+xml,") !important;
}
.teacher-other-info .accordion-body-inner {
/*background: var(--ms-color-hell-4);*/
padding: 10px;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: var(--ms-color-hell-2);
/*border-image: linear-gradient(to right, #ffffff,#bce7ff, white) 1;*/
border-right-width: 4px;
border-right-style: solid;
border-right-color: var(--ms-color-orange-1);
margin: 10px 0;
}
/*endregion teacher detail*/
/*region video-list*/
.video-list .video-box {
border-radius: 20px;
overflow: hidden;
padding: 0 0 20px 0;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15), 0 2px 2px rgba(0, 0, 0, 0.15), 0 4px 4px rgba(0, 0, 0, 0.15), 0 8px 8px rgba(0, 0, 0, 0.15);
border-bottom: 4px solid var(--ms-color-danger);
transition: 0.2s;
}
.video-list .video-box:hover {
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.11), 0 2px 2px rgba(0, 0, 0, 0.11), 0 4px 4px rgba(0, 0, 0, 0.11), 0 6px 6px rgba(0, 0, 0, 0.11), 0 14px 9px rgba(0, 0, 0, 0.11), 0 0 7px rgba(0, 0, 0, 0.11);
/*transform: translate(0px, -1px);*/
/*background: var(--ms-color-hell-2);*/
}
.video-list .video-box .video-title {
display: inline-block;
color: var(--ms-color-gray-2);
margin-top: 15px;
margin-right: 10px;
margin-left: 10px;
font-size: 14px;
font-weight: normal;
transition: 0.3s;
}
.video-list .video-box:hover .video-title {
color: var(--ms-color-danger);
margin-right: 20px;
margin-left: 20px;
}
/*endregion video-list*/
/*region kardani-karshenasi-register*/
.previous.active {
background-color: var(--ms-color-Primary);
color: var(--ms-color-white);
}
.next.active {
background-color: var(--ms-color-Primary);
color: var(--ms-color-white);
}
.kardani-register label,
.kardani-register input,
.kardani-register p,
.kardani-register span,
.kardani-register button,
.kardani-register a,
.kardani-register select {
font-size: 14px;
}
.kardani-register .title {
font-weight: bold;
}
.karshenasi-register label,
.karshenasi-register input,
.karshenasi-register p,
.karshenasi-register span,
.karshenasi-register button,
.karshenasi-register a,
.karshenasi-register select {
font-size: 14px;
}
.karshenasi-register .title {
font-weight: bold;
}
.font-size-12 {
font-size: 12px !important;
}
.form-title {
color: var(--ms-color-black)
}
.form-title strong {
color: var(--ms-color-danger);
text-decoration: underline;
}
.kardani-register-tabs {
justify-content: center;
}
.kardani-register-tabs .nav-link {
/*background: linear-gradient(2deg, #aeecff, #91eef7);*/
background: #cdcdcda6;
color: black;
margin-bottom: 10px;
border-radius: 10px;
/*border: none;*/
margin-left: 10px;
border: 1px solid var(--ms-color-hell-2);
font-size: 18px;
font-weight: bold;
}
.kardani-register-tabs .nav-link:focus,
.kardani-register-tabs .nav-link:active,
.kardani-register-tabs .nav-link.active {
/*background: linear-gradient(2deg, #00c9ff, #0095ff);*/
background: var(--ms-color-orange-1);
color: white;
border: none;
}
.priority-row {
display: none;
}
.alert-dismissible .btn-close {
padding: 0.6rem 0.8rem !important;
}
/*endregion kardani-karshenasi-register*/
/*region site rules*/
.site-rules .accordion-item {
margin-bottom: 20px;
border-radius: 16px;
overflow: hidden;
border: 1px solid #dee2e6;
}
.site-rules .accordion-button {
font-weight: 600;
font-size: 18px;
background-color: var(--ms-color-white);
color: var(--ms-color-black);
}
.site-rules .accordion-button:focus {
border: none !important;
box-shadow: none !important;
}
.site-rules .accordion-button:after {
background-image: url("data:image/svg+xml,") !important;
}
.site-rules .accordion-body-inner {
/*background: var(--ms-color-hell-4);*/
padding: 10px;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: var(--ms-color-hell-2);
/*border-image: linear-gradient(to right, #ffffff,#bce7ff, white) 1;*/
border-right-width: 4px;
border-right-style: solid;
border-right-color: var(--ms-color-Primary);
margin: 10px 0;
}
.site-rules p {
line-height: 2rem;
font-weight: 300;
}
.site-rules-img-container {
width: 100%;
}
.site-rules-img-container img {
width: 100%;
}
.site-rules .accordion-body {
position: relative;
}
/*region Button download*/
.button-download {
background: var(--ms-color-Primary);
color: var(--ms-color-white);
cursor: pointer;
font-weight: 400;
font-size: 14px;
outline: none;
padding: 5px 14px;
text-align: center;
border: none;
border-radius: 20px 20px 0 0;
position: absolute;
bottom: -50px;
right: 50%;
transform: translate(50%, 0);
transition: 0.7s;
}
.button-download:hover {
background: var(--ms-color-Primary);
color: var(--ms-color-white);
outline: none;
border: none;
}
.site-rules .accordion-body:hover .button-download {
bottom: 0;
}
/*endregion Button download*/
/*endregion site rules*/
/*region faq*/
.site-faq .accordion-item {
margin-bottom: 20px;
border-radius: 16px;
overflow: hidden;
border: 1px solid #dee2e6;
}
.site-faq .accordion-button {
font-weight: 600;
font-size: 18px;
background-color: var(--ms-color-white);
color: var(--ms-color-black);
}
.site-faq .accordion-button:focus {
border: none !important;
box-shadow: none !important;
}
.site-faq .accordion-button:after {
background-image: url("data:image/svg+xml,") !important;
}
.site-faq .accordion-body-inner {
/*background: var(--ms-color-hell-4);*/
padding: 10px;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: var(--ms-color-hell-2);
/*border-image: linear-gradient(to right, #ffffff,#bce7ff, white) 1;*/
border-right-width: 4px;
border-right-style: solid;
border-right-color: var(--ms-color-success);
margin: 10px 0;
}
.site-faq p {
line-height: 2rem;
font-weight: 300;
}
.faq-img-container {
width: 100%;
}
.faq-img-container img {
width: 100%;
}
/*endregion faq*/
/*region instruction*/
.instruction .accordion-item {
margin-bottom: 20px;
border-radius: 16px;
overflow: hidden;
border: 1px solid #dee2e6;
}
.instruction .accordion-button {
font-weight: 600;
font-size: 18px;
background-color: var(--ms-color-white);
color: var(--ms-color-black);
}
.instruction .accordion-button:focus {
border: none !important;
box-shadow: none !important;
}
.instruction .accordion-button:after {
background-image: url("data:image/svg+xml,") !important;
}
.instruction .accordion-body-inner {
/*background: var(--ms-color-hell-4);*/
padding: 10px;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: var(--ms-color-hell-2);
/*border-image: linear-gradient(to right, #ffffff,#bce7ff, white) 1;*/
border-right-width: 4px;
border-right-style: solid;
border-right-color: var(--ms-color-orange-1);
margin: 10px 0;
}
.instruction p {
line-height: 2rem;
font-weight: 300;
}
.instruction-img-container {
width: 100%;
}
.instruction-img-container img {
width: 100%;
}
.instruction .accordion-body {
position: relative;
}
/*region Button download 2*/
.button-download-2 {
background: var(--ms-color-orange-1);
color: var(--ms-color-white);
cursor: pointer;
font-weight: 400;
font-size: 14px;
outline: none;
padding: 5px 14px;
text-align: center;
border: none;
border-radius: 20px 20px 0 0;
position: absolute;
bottom: -50px;
right: 50%;
transform: translate(50%, 0);
transition: 0.7s;
}
.button-download-2:hover {
background: var(--ms-color-orange-1);
color: var(--ms-color-white);
outline: none;
border: none;
}
.instruction .accordion-body:hover .button-download-2 {
bottom: 0;
}
/*endregion Button download 2*/
/*endregion instruction*/
/*region request counseling*/
.request-counseling label,
.request-counseling input,
.request-counseling p,
.request-counseling span,
.request-counseling button,
.request-counseling a,
.request-counseling select {
font-size: 14px;
}
.request-counseling {
position: relative;
overflow: hidden;
z-index: 0;
/*padding: 0;*/
}
.request-counseling .title {
font-weight: bold;
}
.hr-1 {
color: #c5c5c5;
}
/*.request-counseling:after{*/
/* content: '';*/
/* width: 600px;*/
/* height: 600px;*/
/* background-color: red;*/
/* transform: skew(160deg);*/
/* position: absolute;*/
/* left: -100px;*/
/* z-index: -1;*/
/*}*/
/*.request-counseling .title-bg{*/
/* width: 100px;*/
/* position: absolute;*/
/* top: 30px;*/
/* right: 0;*/
/*}*/
.request-counseling .form-title {
/*border-bottom-width: 1px;*/
/*border-bottom-style: solid;*/
/*border-image: linear-gradient(to right, white, #ffecec, white) 1;*/
/*border: 1px solid var(--ms-color-hell-2);*/
/*border-radius: 0 0 10px 10px;*/
/*display: inline-block;*/
}
.request-counseling-img-container {
width: 100%;
border-right: 1px solid var(--ms-color-hell-2);
height: 100%;
display: flex;
align-items: center;
justify-content: center;
/*background-image: url("../images/pattern/bubble2.png");*/
/*background-repeat: repeat;*/
/*background-size: contain;*/
}
.request-counseling-img-container img {
width: 100%;
}
/*endregion request counseling*/
/*region about us*/
.about-us {
padding-bottom: 50px;
}
.about-us .title {
display: inline-block;
padding: 10px 20px;
border-bottom: 4px solid var(--ms-color-Primary);
color: var(--ms-color-black);
}
.about-us .text {
padding: 0 20px;
color: var(--ms-color-gray);
font-weight: 400;
line-height: 2rem;
text-align: justify;
}
.about-us .about-us-img img {
width: 100%;
}
.about-us .box-1 {
width: 90%;
background: var(--ms-color-hell-2);
padding: 15px;
text-align: center;
border-radius: 40px 40px 0 0;
height: 255px;
overflow: hidden;
box-shadow: 0 2px 4px 2px #dbdbdb;
margin: auto;
}
.about-us p {
line-height: 2.1rem;
padding: 0 40px;
}
.about-us .box-1 p {
line-height: 1.5rem;
font-size: 0.9rem;
color: #767676;
}
.about-us .box-1 .icon {
background: var(--ms-color-white);
border-radius: 50%;
padding: 10px;
width: 80px;
height: 80px;
display: flex;
justify-content: center;
align-items: center;
margin: 0 auto 20px auto;
}
.about-us .box-1 .icon svg {
font-size: 2rem;
color: var(--ms-color-Primary)
}
.about-us .video-box {
padding: 10px;
box-shadow: 0 0 10px 5px #eee;
}
.about-us .video-box a {
display: inline-block;
margin-top: 15px
}
.about-us .nav-link div {
/*background: linear-gradient(2deg, #aeecff, #91eef7);*/
background: var(--ms-color-white);
color: black;
margin-bottom: 10px;
border-radius: 20px;
/*border: none;*/
/*margin-left: 10px;*/
border: 1px solid var(--ms-color-hell-2);
width: 100%;
font-size: 14px;
padding: 4px 14px;
}
.about-us .nav-link:focus,
.about-us .nav-link:active,
.about-us .nav-link.active {
/*background: linear-gradient(2deg, #00c9ff, #0095ff);*/
/*background: var(--ms-color-Primary);*/
color: var(--ms-color-Primary);
border: none;
}
.about-us .nav-link:focus div,
.about-us .nav-link:active div,
.about-us .nav-link.active div {
color: var(--ms-color-Primary);
font-weight: bold;
}
.about-us .nav-link:hover {
/*background: var(--ms-color-hell-2);*/
}
.about-us .nav-link.active:hover {
/*background: var(--ms-color-Primary);*/
}
.about-us .nav-item {
/*background: var(--ms-color-orange-1);*/
text-align: center;
/*margin: 5px;*/
cursor: pointer;
}
.about-us .nav-item img {
width: 80px;
height: 80px;
object-fit: cover;
margin-bottom: 10px;
border-radius: 50%;
}
.about-us .nav-tabs {
border-bottom: none;
}
/*endregion about us*/
/*region contact us*/
.contact-us {
padding-bottom: 50px;
}
.contact-us .title {
display: inline-block;
padding: 10px 20px;
border-bottom: 4px solid var(--ms-color-orange-1);
color: var(--ms-color-black);
}
.contact-us .text {
padding: 10px 20px;
color: var(--ms-color-gray);
font-weight: 400;
line-height: 2rem;
text-align: justify;
}
.contact-us .contact-us-img img {
width: 100%;
}
.contact-us .box-1 {
width: 90%;
background: var(--ms-color-hell-2);
padding: 15px;
text-align: center;
border-radius: 40px 40px 0 0;
height: 255px;
overflow: hidden;
box-shadow: 0 2px 4px 2px #dbdbdb;
margin: auto;
}
.contact-us .box-1 p {
line-height: 1.5rem;
font-size: 0.9rem;
color: #767676;
}
.contact-us .box-1 .icon {
background: var(--ms-color-white);
border-radius: 50%;
padding: 10px;
width: 80px;
height: 80px;
display: flex;
justify-content: center;
align-items: center;
margin: 0 auto 20px auto;
}
.contact-us .box-1 .icon svg {
font-size: 2rem;
color: var(--ms-color-orange-1)
}
.contact-us .nav-link div {
/*background: linear-gradient(2deg, #aeecff, #91eef7);*/
background: var(--ms-color-white);
color: black;
margin-bottom: 10px;
border-radius: 20px;
/*border: none;*/
/*margin-left: 10px;*/
border: 1px solid var(--ms-color-hell-2);
width: 100%;
font-size: 14px;
padding: 4px 14px;
}
.contact-us .nav-link:focus,
.contact-us .nav-link:active,
.contact-us .nav-link.active {
/*background: linear-gradient(2deg, #00c9ff, #0095ff);*/
/*background: var(--ms-color-hell-2);*/
color: var(--ms-color-orange-1);
border: none;
}
.contact-us .nav-link:focus div,
.contact-us .nav-link:active div,
.contact-us .nav-link.active div {
color: var(--ms-color-orange-1);
font-weight: bold;
}
.contact-us .nav-link:hover {
/*background: var(--ms-color-hell-2);*/
}
.contact-us .nav-link.active:hover {
/*background: var(--ms-color-orange-1);*/
}
.contact-us .nav-item {
/*background: var(--ms-color-orange-1);*/
text-align: center;
/*margin: 5px;*/
cursor: pointer;
}
.contact-us .nav-item img {
width: 80px;
height: 80px;
object-fit: cover;
margin-bottom: 10px;
border-radius: 50%;
}
.contact-us .nav-item svg {
font-size: 40px;
background: #f2f2f3;
padding: 20px;
border-radius: 50%;
margin-bottom: 7px;
}
.contact-us .nav-tabs {
border-bottom: none;
}
/*endregion contact us*/
/*region work with us*/
input#file-input {
display: none;
}
input#file-input + label {
background-color: #4d8cf2;
padding: 8px;
color: #fff;
border: 2px solid #9ec3ff;
border-radius: 9px;
margin-left: 20px;
}
input#file-input + label:hover {
background-color: #3b73ce;
border-color: #729fe7;
cursor: pointer;
}
/*endregion work with us*/
/*region photo-list*/
.photo-list {
background-image: url("../images/pattern/photo3.png");
background-repeat: repeat;
border: 1px solid var(--ms-color-hell-2);
}
.photo-list .photo-box {
border-radius: 20px;
overflow: hidden;
padding: 0 0 20px 0;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15), 0 2px 2px rgba(0, 0, 0, 0.15), 0 4px 4px rgba(0, 0, 0, 0.15), 0 8px 8px rgba(0, 0, 0, 0.15);
border-bottom: 4px solid var(--ms-color-gray);
transition: 0.2s;
background: var(--ms-color-white);
/*height: 228px;*/
}
.photo-list .photo-box:hover {
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.11), 0 2px 2px rgba(0, 0, 0, 0.11), 0 4px 4px rgba(0, 0, 0, 0.11), 0 6px 6px rgba(0, 0, 0, 0.11), 0 14px 9px rgba(0, 0, 0, 0.11), 0 0 7px rgba(0, 0, 0, 0.11);
}
.photo-list .photo-box .photo-title {
display: inline-block;
color: #000;
/*margin-top: 8px;
margin-right: 10px;
margin-left: 10px;*/
font-size: 14px;
font-weight: normal;
transition: 0.3s;
line-height: 1.2rem;
text-align: center;
margin: 9px;
}
.photo-list .photo-box:hover .photo-title {
color: var(--ms-color-black);
margin-right: 20px;
margin-left: 20px;
}
.photo-list .photo-box img {
/* width: 100%; */
height: 160px;
/* object-fit: cover; */
transition: 0.6s;
}
.photo-list .photo-box:hover img {
transform: scale(1.1);
}
.photo-list .photo-box a {
display: block;
text-align: center;
overflow: hidden;
}
/*endregion photo-list*/
/*region photo detail*/
.photo-detail .img-container {
width: 100%;
height: 100%;
/*border-left: 4px solid var(--ms-color-Primary);*/
/*padding-left: 20px;*/
}
.photo-detail img {
width: 100%;
box-shadow: 1px 1px 5px silver;
}
.photo-detail p {
line-height: 2rem;
text-align: justify;
border-right: 4px solid var(--ms-color-Primary);
padding-right: 20px;
color: var(--ms-color-gray-2);
}
.photo-detail p span {
color: var(--ms-color-dark);
}
/*endregion photo detail*/
/*region related links*/
.related-link-list .related-link .img-container {
width: 100%;
height: 100px;
text-align: center;
display: flex;
justify-content: center;
align-items: center;
}
.related-link-list .related-link {
text-align: center;
padding: 20px;
background: #fff;
box-shadow: 0 5px 15px rgba(0, 0, 0, .1);
border-radius: 4px;
position: relative;
overflow: hidden;
}
.related-link-list .related-link::before {
content: "";
/*background: var(--ms-color-hell-6);*/
background: linear-gradient(to bottom, var(--ms-color-hell-7), var(--ms-color-hell-6));
position: absolute;
left: 0;
bottom: 0;
border-radius: 50% 50% 0 0;
width: 100%;
height: 0;
z-index: 0;
transition: 0.8s;
}
.related-link-list .related-link:hover::before {
height: 180%;
}
.related-link-list .related-link img {
width: 25%;
z-index: 1;
}
.related-link-list .related-link h6 {
z-index: 1;
position: sticky;
margin-top: 20px;
}
.related-link-list .related-link .seeLinkBtn {
display: inline-block;
padding: 6px 10px;
background: #fff;
text-decoration: none;
color: #000;
font-weight: 500;
font-size: 13px;
margin-top: 20px;
box-shadow: 0 5px 5px rgba(0, 0, 0, .1);
border-radius: 4px;
z-index: 1;
position: sticky;
}
/*endregion related links*/
/*region blog-box*/
.blog-box {
text-align: center;
background: var(--ms-color-white);
/* Center slide text vertically */
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: flex-start;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
flex-direction: column;
background: var(--ms-color-hell);
padding: 20px;
}
.blog-box img {
width: 100%;
height: 200px;
object-fit: cover;
}
.blog-box .text-header {
font-size: 0.7rem;
width: 100%;
margin-top: 25px;
font-weight: 600;
color: var(--ms-color-danger);
}
.blog-box .text-main {
margin-top: 25px;
width: 100%;
}
.blog-box .text-main h1 {
height: 58px;
line-height: 1.8rem;
font-size: 1rem;
font-weight: 700;
color: var(--ms-color-dark);
}
.blog-box .text-footer {
padding-top: 10px;
margin-top: 15px;
width: 100%;
}
.blog-category a.active {
color: var(--ms-color-Primary);
}
.read-more-btn {
font-weight: 400 !important;
font-size: 14px !important;
padding: 2px 10px !important;
}
/*endregion blog-box*/
/*region blog detail*/
.writer-image {
width: 40px;
height: 40px;
border-radius: 50%;
margin-left: 5px;
}
.writer-name {
color: var(--ms-color-dark);
font-size: 14px;
}
.blog-date {
color: var(--ms-color-gray-2);
font-size: 14px;
}
.blog-category {
color: var(--ms-color-gray-2);
font-size: 14px;
}
.blog-image {
width: 100%;
}
.blog-text {
text-align: justify;
line-height: 2rem;
}
/*endregion blog detail*/
/*region basket*/
.basket-thumbnail {
width: 100px;
}
.basket-table tr {
vertical-align: middle;
}
.sum-price {
background-color: var(--ms-color-hell-2);
text-align: center;
font-size: 20px;
padding: 20px;
}
/*endregion basket*/
/*region gallery category*/
.gallery-category-list .gallery-category-box {
overflow: hidden;
/*padding: 0 0 20px 0;*/
padding: 20px;
transition: 0.2s;
text-align: center;
border: 1px solid #f5f5f5;
}
.gallery-category-list .gallery-category-box img {
width: 80%;
}
.gallery-category-title {
margin-top: 15px;
}
.gallery-category-list .gallery-category-box .photo-qty {
font-size: 0.8rem;
color: var(--ms-color-gray-2);
}
.gallery-category-list .gallery-category-box:hover {
/*box-shadow: rgba(255,237,210,0.8) 0px 12px 30px 0px;*/
box-shadow: rgb(191 216 255 / 80%) 0px 12px 30px 0px;
/*background-color: rgba(255,237,210,1);*/
background-color: var(--ms-color-hell-4);
transition: background 0.5s, border 0.5s, border-radius 0.5s, box-shadow 0.5s;
/*box-shadow: rgba(253,221,226,0.8) 0px 12px 30px 0px;*/
/*background-color: rgba(253,221,226,1);*/
/*transition: background 0.5s, border 0.5s, border-radius 0.5s, box-shadow 0.5s;*/
}
/*endregion gallery category*/
.course-poster {
height: 360px;
/*width: 100%;*/
object-fit: cover;
}
.red-text {
color: red;
}
.register-btn:hover {
color: #004dbb;
}
.login-btn:hover {
color: #004dbb;
}
.course-code-wrapper{
display: flex;
gap:5px;
}
.course-code {
direction: ltr;
display: inline-block;
font-weight: bold;
}