*{
	box-sizing:border-box;
	font-family: "arial","Microsoft YaHei", "微软雅黑", sans-serif;
}
/* 全局样式重置 */
body {
	height: 100vh;
	/*overflow: hidden;*/
	background-color: #f5f7fa;
	font-size: 16px; /* 整体字体增大 */
}
		
/*menu的样式*/


        /* 顶部导航栏样式 */
        .header {
            height: 60px; /* 导航栏高度增加 */
            background-color: #fff;
            border-bottom: 1px solid #e5e6eb;
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 0 8px;
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            z-index: 100;
        }

        .header-left, .header-right {
            display: flex;
            align-items: center;
        }

        .menu-toggle {
            display: none;
            margin-right: 8px;
            cursor: pointer;
            padding: 8px;
            font-size: 20px; /* 汉堡菜单图标增大 */
        }

        .logo {
            display: flex;
            align-items: center;
            margin-right: 20px;
        }

        .logo img {
            height: 32px; /* Logo增大 */
        }

        .nav-links {
            display: flex;
            list-style: none;
        }

        .nav-link {
            margin-right: 20px;
            position: relative;
        }

        .nav-link a {
            color: #4e5969;
            text-decoration: none;
            padding: 18px 0; /* 导航链接高度增加 */
            display: block;
            font-size: 16px; /* 导航文字增大 */
            transition: color 0.2s;
			box-sizing:border-box;
        }

        .nav-link a:hover {
            color: #1677ff;
        }

        .nav-link.active a {
            color: #1677ff;
            font-weight: 500;
        }

        .nav-link.active::after {
            content: '';
            position: absolute;
            bottom: 10px;
            left: 0;
            width: 100%;
            height: 2px;
            background-color: #1677ff;
        }

        .search-box {
            display: flex;
            align-items: center;
            background-color: #f2f3f5;
            border-radius: 4px;
            padding: 0 8px;
            margin-right: 16px;
            width: 240px; /* 搜索框宽度增加 */
            transition: width 0.3s;
        }

        .search-box:focus-within {
            width: 280px;
        }

        .search-box input {
            background: transparent;
            border: none;
            outline: none;
            padding: 10px; /* 搜索框内边距增加 */
            width: 100%;
            font-size: 16px; /* 搜索文字增大 */
        }

        .header-icon {
            color: #4e5969;
            margin-right: 16px;
            cursor: pointer;
            position: relative;
            padding: 8px;
            font-size: 20px; /* 头部图标增大 */
        }

        .header-icon:hover {
            color: #1677ff;
        }

        .notification-count {
            position: absolute;
            top: 2px;
            right: 2px;
            background-color: #ff4d4f;
            color: white;
            border-radius: 50%;
            width: 20px; /* 通知数字容器增大 */
            height: 20px;
            font-size: 12px; /* 通知数字增大 */
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .user-avatar {
            width: 30px; /* 用户头像增大 */
            height: 30px;
            border-radius: 50%;
            /*background-color: #1677ff;
            color: white;
            */
			color: #1677ff;
			display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            font-size: 20px; /* 头像文字增大 */
        }

        /* 用户下拉菜单 */
        .user-dropdown {
            position: absolute;
            top: 56px;
            right: 0px;
            width: 240px;
            background-color: #fff;
            border-radius: 4px;
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
            transform: translateY(-10px);
            opacity: 0;
            visibility: hidden;
            transition: transform 0.2s ease, opacity 0.2s ease, visibility 0.2s ease;
            z-index: 110;
        }

        .user-dropdown.active {
            transform: translateY(0);
            opacity: 1;
            visibility: visible;
        }

        .user-dropdown-header {
            padding: 16px;
            border-bottom: 1px solid #e5e6eb;
        }

        .user-dropdown-name {
            font-size: 16px;
            font-weight: 500;
            color: #1d2129;
        }

        .user-dropdown-email {
            font-size: 14px;
            color: #86909c;
            margin-top: 4px;
        }

        .user-dropdown-menu {
            list-style: none;
        }

        .user-dropdown-item {
            padding: 12px 16px;
            cursor: pointer;
            transition: background-color 0.2s;
        }

        .user-dropdown-item:hover {
            background-color: #f2f3f5;
        }

        .user-dropdown-item i {
            margin-right: 12px;
            width: 16px;
            text-align: center;
        }
		.user-dropdown ul,.user-dropdown li{
			padding-left:5px;
			padding-right:5px;
		}

        .user-dropdown-divider {
            height: 1px;
            background-color: #e5e6eb;
            margin: 4px 0;
        }

        /* 移动端下拉菜单按钮 */
        .mobile-menu-button {
            display: none;
            margin-right: 16px;
            cursor: pointer;
            padding: 8px;
            font-size: 20px;
        }

        /* 移动端下拉面板 */
        .mobile-dropdown-panel {
            position: fixed;
            top: 60px;
            left: 0; /* 修改为从左侧开始 */
            right: 0; /* 新增：延伸到右侧 */
            background-color: #fff;
            border-bottom: 1px solid #e5e6eb;
            box-shadow: 0 2px 5px rgba(0,0,0,0.1);
            transform: translateY(-100%);
            opacity: 0;
            visibility: hidden;
            transition: transform 0.3s ease, opacity 0.3s ease, visibility 0.3s ease;
            z-index: 95;
        }

        .mobile-dropdown-panel.active {
            transform: translateY(0);
            opacity: 1;
            visibility: visible;
        }
		.mobile-dropdown-panel ul,.mobile-dropdown-panel li{
			padding:5px;
		}
        .mobile-dropdown-menu {
            list-style: none;
            display: flex; /* 新增：使用flex布局 */
            flex-wrap: wrap; /* 新增：允许换行 */
        }

        .mobile-dropdown-item {
            border-bottom: 1px solid #e5e6eb;
            flex: 0 0 50%; /* 新增：每个项目占50%宽度 */
            max-width: 50%; /* 新增：最大宽度50% */
        }

        .mobile-dropdown-item:nth-child(odd) {
            border-right: 1px solid #e5e6eb; /* 新增：奇数项添加右侧边框 */
        }

        .mobile-dropdown-item:last-child,
        .mobile-dropdown-item:nth-last-child(2) {
            border-bottom: none; /* 新增：最后两行不显示底部边框 */
        }

        .mobile-dropdown-item a {
            display: flex; /* 新增：使用flex布局 */
            align-items: center; /* 新增：垂直居中 */
            padding: 14px 20px;
            color: #4e5969;
            text-decoration: none;
            font-size: 16px;
            transition: background-color 0.2s;
            min-height: 60px; /* 新增：确保菜单项有足够高度 */
        }

        .mobile-dropdown-item a:hover {
            background-color: #f2f3f5;
        }

        .mobile-dropdown-item.active a {
            background-color: #e6f4ff;
            color: #1677ff;
            font-weight: 500;
        }
		.mobile-dropdown-item i{
		margin-right:10px;
		}

        /* 侧边栏样式 */
        .sidebar-container {
            position: fixed;
            top: 60px; /* 侧边栏顶部位置调整 */
            bottom: 0;
            left: 0;
            z-index: 90;
            transition: all 0.3s ease;
        }

        .sidebar {
            width: 260px; /* 侧边栏宽度增加 */
            background-color: #fff;
            border-right: 1px solid #e5e6eb;
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            overflow-y: auto;
            box-shadow: 0 1px 2px rgba(0,0,0,0.05);
            transform: translateX(0);
            transition: transform 0.3s ease;
        }

        .sidebar-header {
            padding: 20px; /* 侧边栏头部内边距增加 */
            border-bottom: 1px solid #e5e6eb;
            background: linear-gradient(to right, #f0f5ff, #e6f4ff);
        }

        .sidebar-title {
            font-size: 18px; /* 侧边栏标题增大 */
            font-weight: 500;
            color: #1d2129;
        }

        .sidebar-menu {
            list-style: none;
        }

        .sidebar-item {
            position: relative;
        }

        .sidebar-item a {
            display: flex;
            align-items: center;
            padding: 14px 20px; /* 菜单项内边距增加 */
            color: #4e5969;
            text-decoration: none;
            font-size: 16px; /* 菜单项文字增大 */
            transition: all 0.2s;
        }

        .sidebar-item a:hover {
            background-color: #f2f3f5;
        }

        .sidebar-item.active a {
            background-color: #e6f4ff;
            color: #1677ff;
            font-weight: 500;
        }

        .sidebar-icon {
            margin-right: 12px; /* 图标与文字间距增加 */
            width: 20px; /* 图标宽度增加 */
            text-align: center;
        }

        .sidebar-toggle-link {
            justify-content: space-between;
        }

        .sidebar-toggle-link .menu-text {
            display: flex;
            align-items: center;
        }

        .sidebar-submenu {
            list-style: none;
            padding-left: 0;
            margin-left: 0;
            background-color: #fafafa;
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.3s ease, padding 0.3s ease;
        }

        .sidebar-submenu.active {
            max-height: 500px;
            padding: 10px 0; /* 子菜单内边距增加 */
        }

        .sidebar-subitem a {
            padding: 10px 20px 10px 52px; /* 子菜单项内边距调整 */
            font-size: 15px; /* 子菜单项文字大小 */
            border-radius: 0;
            transition: all 0.2s;
        }

        .sidebar-subitem a:hover {
            background-color: #e6f4ff;
        }
		.sidebar-subitem.active{
            background-color: #e6f4ff;
        }

        .sidebar-toggle {
            position: absolute;
            top: 50%;
            left: 260px; /* 按钮位置调整 */
            transform: translateY(-50%);
            width: 12px;
            height: 40px;
            background-color: #fff;
            border: 1px solid #e5e6eb;
            border-left: none;
            border-radius: 0 4px 4px 0;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            color: #4e5969;
            z-index: 10;
            box-shadow: 0 1px 2px rgba(0,0,0,0.05);
        }

        .sidebar.collapsed {
            transform: translateX(-260px);
        }

        .sidebar.collapsed + .main-content {
            margin-left: 0;
        }

        .sidebar-toggle.collapsed {
            left: 0;
            transform: translateY(-50%) translateX(0);
        }
		 .sidebar-container ul,.sidebar-container li{
			 margin:0px;
			 padding:0px;
		 }
        /* 主内容区域样式 */
        .main-content {
            margin-left: 260px;
            margin-top: 60px; /* 内容区域顶部位置调整 */
            padding: 5px; /* 内容区域内边距增加 */
            /*height: calc(100vh - 40px);*/
			overflow:auto;
            overflow-y: auto;
			overflow-x: auto;
            transition: margin-left 0.3s ease;
            font-size: 16px; /* 内容区域文字增大 */
        }

        .main-content.collapsed {
            margin-left: 0;
        }

        /* 遮罩层样式 */
        .overlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0,0,0,0.3);
            z-index: 80;
            opacity: 0;
            visibility: hidden;
            transition: opacity 0.3s ease, visibility 0.3s ease;
        }

        .overlay.active {
            opacity: 1;
            visibility: visible;
        }

        /* 响应式设计 */
        @media (max-width: 1024px) {
            .search-box {
                width: 200px;
            }
            
            .search-box:focus-within {
                width: 240px;
            }
        }

        @media (max-width: 768px) {
            .menu-toggle {
                display: block;
            }
            
            .sidebar {
                transform: translateX(-260px);
                z-index: 95;
                /* 新增：修改移动端侧边栏隐藏动画 */
                transform-origin: top left;
            }
            
            .sidebar.active {
                transform: translateX(0);
            }
            
            .sidebar.closing {
                transform: translate(-260px, -60px) scale(0.9);
                opacity: 0.8;
            }
            
            .sidebar-toggle {
                display: none;
            }
            
            .main-content {
                margin-left: 0;
            }
            
            .nav-links {
                display: none;
            }
            
            .search-box {
                width: 180px;
            }
            
            .search-box:focus-within {
                width: 220px;
            }
            
            /* 隐藏铃铛图标，显示下拉菜单按钮 */
            .header-icon.bell-icon {
                display: none;
            }
            
            .mobile-menu-button {
                display: block;
            }
        }

        @media (max-width: 576px) {
            .search-box {
                display: none;
            }
            
            .header-icon {
                margin-right: 12px;
            }
            
            /* 在超小屏幕上调整下拉菜单为单列 */
            .mobile-dropdown-item {
                flex: 0 0 100%;
                max-width: 100%;
                border-right: none !important;
            }
            
            .mobile-dropdown-item:not(:last-child) {
                border-bottom: 1px solid #e5e6eb;
            }
        }
/*menu的样式结束*/
h1{
	text-align:center;
}
h2{
	margin-top:30px;
	margin-bottom:10px;
	position:relative;
    border-left:6px solid #1e9fff;
	border-bottom:1px solid #1e9fff;
	padding-top:6px;
	padding-bottom:10px;
	padding-left:10px;
	color:#1e9fff;
	}
h2::after{
	content:'Mr.Deng课堂';
	font-size:8px;
	position:absolute;
	right:0;
	bottom:0px;
	color:#e2e2e2;
	font-weight:normal;
}
img{
	max-width:100%;
}
a{
	text-decoration:none;
	color:#000;
}
a:hover{
	/*text-decoration:underline;
	color:#000;
	*/
}
a:visted{
	text-decoration:underline;
	color:#000;
}
.mybox{
	display:block;
	margin-top:15px;
	border:1px solid #1e9fff;
	position:relative;
}
.mybox .mybox-content{
	padding:15px;
}
.mybox .mybox-content::after{
	content:'';
	display:block;
	clear:both;
}
.mybox .mybox-action{
	width:100%;
	border-top:1px solid #c2c2c2;
	background-color:#f2f2f2;
	position:relative;
	padding:5px;
}
.mybox .mybox-return{
	width:100%;
	border-top:1px solid #c2c2c2;
	min-height:40px;
	background-color:#f2f2f2;
	position:relative;
	padding:15px;
	font-size:18px;
}
.mybox .mybox-return::after{
	content:'return';
	font-size:8px;
	position:absolute;
	left:0;
	top:0px;
	color:#b2b2b2;
}

input[type="checkbox"]{
	display:inline-block;
	border: 1px solid #ccc;
	width: 16px;
	height: 16px;
	margin-right:10px;
}
blockquote{
	position:relative;
	border-left:6px solid #aaa;
	border-top:1px dashed #ccc;
	border-right:1px dashed #ccc;
	border-bottom:1px dashed #ccc;
	margin:10px 0px;
	font-size:16px;
	line-height:30px;
	padding:10px;
	background:#f2f2f2;
	overflow:hidden;
	overflow-x:auto;
	
}
blockquote::after{
	content:'Mr.Deng课堂';
	font-size:8px;
	position:absolute;
	right:0;
	bottom:-5px;
	color:#e2e2e2;
}
/*html5不支持，显示的标记*/
.myhtml5-del{
	float:right;
	color:red;
}
.myhtml5-del::after{	
	vertical-align: super;
	content:"DEL";
	font-size:60%;
	color:red;
}
/*html5新特性，显示的标记*/
.myhtml5-new{
	float:right;
	color:green;
}
.myhtml5-new::after{	
	vertical-align: super;
	content:"NEW";
	font-size:60%;
	color:green;
}
.mytable-box{
	overflow-x:auto;
}
.mytable-nowrap{
   /*table-layout:fixed;*/
}
.mytable-nowrap tbody tr td:nth-child(n){
	/*overflow:hidden;	
	text-overflow:ellipsis;
	*/
	white-space:nowrap;
}
.mytable{
	margin-top:10px;
	width:100%;
	color:#444;
	font-size:16px;
	border-collapse:collapse;  /*折叠边框*/
	background-color:#fff;
}
.mytable-even tbody tr:nth-child(even) {
  background-color: #e2e2e2;
}
.mytable thead{
	background-color:#d2d2d2;
	text-align:left;
}
.mytable td,.mytable th{
	border:1px solid #c2c2c2;
	overflow:hidden;
	padding:8px 5px;
}
.mytable tbody tr td:nth-child(n){
	text-align:left;
}
.mytable tbody tr:hover{
	background-color:#ccffff;
}
.mytable-lg {
  font-size:24px;
}
.mytable-md {
  font-size:20px;
}
.mytable-sm {
  font-size:16px;  /*默认*/
}
.mytable-xs {
  font-size:12px;
}
.mytable-mn {
  font-size:8px;
}

.mybtn{
	font-size:16px; /*默认sm尺寸*/
	padding:5px 15px;
	margin:5px;
	box-sizing:border-box;
	border-radius:3px;
	position:relative;
	border:none;
}
.mybtn:hover{
	filter:brightness(120%);
	cursor: pointer;
}
.mybtn[disabled]{
	background-color:#e2e2e2 !important;
	border:none !important;
	cursor:not-allowed;
}
.mybtn[class*="mybtn-bg-"]{
	color:#fff;
}
.mybtn-bg-blue{
   background-color:#1e9fff;
}
.mybtn-bg-green{
   background-color:#16b777;
}
.mybtn-bg-red{
   background-color:#ff5722;
}
.mybtn-bg-purple{
   background-color:#a233c6;
}
.mybtn-suit{
	width:100%;
}
.mybtn-add span::after {
  content: '»';
  font-size:30px;
  position: absolute;
  opacity: 0;
  top:3px;
  right: -20px;
  transition: 0.5s;
}
.mybtn-add:hover span:after {
  opacity: 1;
  right: 5px;
}
.mybtn-lg{
	font-size:24px;
	height:50px;
}
.mybtn-md{
	font-size:20px;
	height:40px;
}
.mybtn-sm{
	font-size:16px;
	height:35px;
}
.mybtn-xs{
	font-size:12px;
	height:30px;
}
.mybtn-mn{
	font-size:8px;	
	height:20px;
}
.mybtn-group{
	display:inline-block;
}
.mybtn-group button{
	margin:0px;
	float:left;
	margin-left:1px;
	border-radius:0px;
}
.mybtn-group button:nth-child(1){border-radius:3px 0px 0px 3px;}
.mybtn-group button:nth-last-child(1){border-radius:0px 3px 3px 0px;}
.mytext{
	display:block;
	box-sizing:border-box;
	width:100%;
	padding:8px 10px;
	font-size:16px;
	margin:5px 0px;
	border:1px solid 
#c2c2c2;
	background-color:
#fff;
	border-radius:3px;
}
.mytext:focus{
    outline:none;
}
.mytext-lg{
	font-size:24px;
}
.mytext-md{
	font-size:20px;
}
.mytext-sm{
	font-size:16px;
}
.mytext-xs{
	font-size:12px;
}
.mytext-mn{
	font-size:8px;
	padding:5px;
}
.mytext[class*="mytext-border-"]{
	background-color:
#fff;
}
.mytext-border-blue{
	border:1px solid #1e9fff;
}
.mytext-border-blue:focus{
    box-shadow:0px 0px 5px #1e9fff;
}
.mytext-border-green{
	border:1px solid #16b777;
}
.mytext-border-green:focus{
    box-shadow:0px 0px 5px #16b777;
}
.mytext-border-red{
	border:1px solid #ff5722;
}
.mytext-border-red:focus{
    box-shadow:0px 0px 5px #ff5722;
}
.mytext-border-purple{
	border:1px solid #a233c6;
}
.mytext-border-purple:focus{
    box-shadow:0px 0px 5px #a233c6;
}
.mycheckbox{
  border: 1px solid #ccc;
  width: 16px;
  height: 16px;
  margin-right:10px;
}
.mycheckbox:focus {
  filter:drop-shadow(0 0 5px #5b9dd9);
}
.mycheckbox-box-row{
  background-color:#f2f2f2;
 }
.mycheckbox-box-row label{
  display:block;
  border-bottom: 1px solid #ccc;
  line-height:35px;
  padding:5px 10px;
}
.mycheckbox-box-row label:hover{
  background-color:#fff;
  cursor:pointer;
}
.mycheckbox-box-card{
  background-color:#f2f2f2;
  padding:10px 15px 0px;
 }
.mycheckbox-box-card label{
  display:block;
  background-color:#fff;
  padding:5px 10px;
  margin-bottom:10px;
}
.mycheckbox-box-card label:hover{
  background-color:orange;
  cursor:pointer;
}
.mynotice{
	background-color:#ffffcc;
	padding:10px;
	border:1px solid #ff5722;
}
.mynotice-text{
	color:red;
	font-weight:bold;
	font-size:20px;
}
.mynotice-code{   /*code里的加高亮*/
	font-weight:bold;
	font-size:16px;
	border-bottom: 2px solid yellow; /* 2px宽，黄色的下划线 */
    padding-bottom: 1px; /
	
}
.myselect{
    box-sizing:border-box;
	width:100%;
	margin-top:5px;
	margin-bottom:5px;
	padding:10px 0px;
	font-size:16px;
	border-radius:3px;
	border:1px solid #c2c2c2;
}
.myselect:focus{
	outline:none;
}
.myselect-lg{
	font-size:24px;
}
.myselect-md{
	font-size:20px;
}
.myselect-sm{
	font-size:16px;
}
.myselect-xs{
	font-size:12px;
}
.myselect-mn{
	font-size:8px;
	padding:5px 0px;
}
.myselect[class*="myselect-border-"]{
	background-color:#fff;
}
.myselect-border-blue{
	border:1px solid #1e9fff;
}
.myselect-border-blue:focus{
    box-shadow:0px 0px 5px #1e9fff;
}
.myselect-border-green{
	border:1px solid #16b777;
}
.myselect-border-green:focus{
    box-shadow:0px 0px 5px #16b777;
}
.myselect-border-red{
	border:1px solid #ff5722;
}
.myselect-border-red:focus{
    box-shadow:0px 0px 5px #ff5722;
}
.myselect-border-purple{
	border:1px solid #a233c6;
}
.myselect-border-purple:focus{
    box-shadow:0px 0px 5px #a233c6;
}
.myselect-box{
  box-sizing:border-box;
  position: relative;
}
.myselect-box:focus-within i{
    color:#1e9fff;
}
.myselect-box select {
  padding-left:30px;
}
.myselect-box i{
	position:absolute;
	left:10px;
	top:16px;
	color:#999;
	font-size:20px;
}
.myradio{
  border: 1px solid 
#ccc;
  width: 20px;
  height: 20px;
}
.myradio:focus {
  filter:drop-shadow(0 0 5px 
#5b9dd9);
}
.myradio-box-row{
  background-color:
#f2f2f2;
 }
.myradio-box-row label{
  display:block;
  border-bottom: 1px solid 
#ccc;
  line-height:35px;
  padding:5px 10px;
}
.myradio-box-row label:hover{
  cursor:pointer;
  background-color:
#fff;
}
.myradio-box-card{
  background-color:
#f2f2f2;
  padding:10px 15px 0px;
 }
.myradio-box-card label{
  display:block;
  background-color:
#fff;
  padding:5px 10px;
  margin-bottom:10px;
}
.myradio-box-card label:hover{
  background-color:
orange;
  cursor:pointer;
}
/*弹性布局*/
.myrow{
		margin:0;
		padding:0px;
	}
.myrow-space1>div{padding:1px;}
.myrow-space2>div{padding:2px;}
.myrow-space3>div{padding:3px;}
.myrow-space4>div{padding:4px;}
.myrow-space5>div{padding:5px;}
.myrow-space6>div{padding:6px;}
.myrow-space7>div{padding:7px;}
.myrow-space8>div{padding:8px;}
.myrow-space9>div{padding:9px;}
.myrow-space10>div{padding:10px;}
.myrow-space11>div{padding:11px;}
.myrow-space12>div{padding:12px;}
.myrow-space13>div{padding:13px;}
.myrow-space14>div{padding:14px;}
.myrow-space15>div{padding:15px;}
.myrow-space16>div{padding:16px;}
.myrow-space17>div{padding:17px;}
.myrow-space18>div{padding:18px;}
.myrow-space19>div{padding:19px;}
.myrow-space20>div{padding:20px;}
	.myrow-item{
		background-color:#fff;
		padding:10px;
		overflow-x:hidden;
	}
	.myrow::after{
		content:'';
		display:block;
		clear:both;
	}	
	[class*="mycol-"] {
	    float: left;
	    padding: 15px;		
		
	}	
	@media screen and (max-width:576px)
	{
	.mycol-xs-1 {width: 8.33%;}
	.mycol-xs-2 {width: 16.66%;}
	.mycol-xs-3 {width: 25%;}
	.mycol-xs-4 {width: 33.33%;}
	.mycol-xs-5 {width: 41.66%;}
	.mycol-xs-6 {width: 50%;}
	.mycol-xs-7 {width: 58.33%;}
	.mycol-xs-8 {width: 66.66%;}
	.mycol-xs-9 {width: 75%;}
	.mycol-xs-10 {width: 83.33%;}
	.mycol-xs-11 {width: 91.66%;}
	.mycol-xs-12 {width: 100%;}
	}
	@media screen and (min-width:576px)
	{
	.mycol-sm-1 {width: 8.33%;}
	.mycol-sm-2 {width: 16.66%;}
	.mycol-sm-3 {width: 25%;}
	.mycol-sm-4 {width: 33.33%;}
	.mycol-sm-5 {width: 41.66%;}
	.mycol-sm-6 {width: 50%;}
	.mycol-sm-7 {width: 58.33%;}
	.mycol-sm-8 {width: 66.66%;}
	.mycol-sm-9 {width: 75%;}
	.mycol-sm-10 {width: 83.33%;}
	.mycol-sm-11 {width: 91.66%;}
	.mycol-sm-12 {width: 100%;}
	}
	@media screen and (min-width:768px)
	{
	.mycol-md-1 {width: 8.33%;}
	.mycol-md-2 {width: 16.66%;}
	.mycol-md-3 {width: 25%;}
	.mycol-md-4 {width: 33.33%;}
	.mycol-md-5 {width: 41.66%;}
	.mycol-md-6 {width: 50%;}
	.mycol-md-7 {width: 58.33%;}
	.mycol-md-8 {width: 66.66%;}
	.mycol-md-9 {width: 75%;}
	.mycol-md-10 {width: 83.33%;}
	.mycol-md-11 {width: 91.66%;}
	.mycol-md-12 {width: 100%;}
	}
	@media screen and (min-width:992px)
	{
	.mycol-lg-1 {width: 8.33%;}
	.mycol-lg-2 {width: 16.66%;}
	.mycol-lg-3 {width: 25%;}
	.mycol-lg-4 {width: 33.33%;}
	.mycol-lg-5 {width: 41.66%;}
	.mycol-lg-6 {width: 50%;}
	.mycol-lg-7 {width: 58.33%;}
	.mycol-lg-8 {width: 66.66%;}
	.mycol-lg-9 {width: 75%;}
	.mycol-lg-10 {width: 83.33%;}
	.mycol-lg-11 {width: 91.66%;}
	.mycol-lg-12 {width: 100%;}
	}