/* body { line-height: 25px; font-size: 16px; font-family: "Roboto", sans-serif; font-weight: 400px; color: #7b838a; } */ h1, h2, h3, h4, h5, h6 { font-family: "Rubik", sans-serif; font-weight: 500; color: #002347; } .list { list-style: none; margin: 10px 25px; padding-bottom: 15px; } a { text-decoration: none; transition: all 0.3s ease-in-out; } a:hover, a:focus { text-decoration: none; outline: none; } @media (min-width: 992px) { .fl_left { width: 70%; } } @media (min-width: 992px) { .fl_right { width: 30%; } } .w { margin: 0 auto; width: 1200px; } .br { background: url(../images/bg5.png); background-size: 100% 100%; background-repeat: no-repeat; } .fl_left { float: left; padding-right: 15px; width: 830px; margin-left: 175px; } .fl_right { float: left; padding-top: 50px; /* background-color: #000; */ width: 350px; position: sticky; top: 60px; } /* blog_right_sidebar */ .fl_right .blog_right_sidebar { background: #f1f9ff; padding: 30px; } @media (max-width: 991px) { .fl_right .blog_right_sidebar { margin-top: 80px; margin-left: 20px; } } .fl_right .blog_right_sidebar .widget_title { font-size: 18px; line-height: 25px; background: #002347; text-align: center; color: #fff; padding: 8px 0px; margin-bottom: 30px; } .blog_right_sidebar .search_widget .input-group .form-control { font-size: 14px; line-height: 29px; border: 0px; width: 100%; font-weight: 300; color: #fff; padding-left: 20px; border-radius: 45px; z-index: 0; background: #002347; } .blog_right_sidebar .search_widget .input-group .form-control.placeholder, .blog_right_sidebar .search_widget .input-group .form-control:-moz-placeholder, .blog_right_sidebar .search_widget .input-group .form-control::-moz-placeholder, .blog_right_sidebar .search_widget .input-group .form-control::-webkit-input-placeholder { color: #fff; } .blog_right_sidebar .search_widget .input-group .form-control:focus { box-shadow: none; } .blog_right_sidebar .search_widget .input-group .btn-default { position: absolute; right: 20px; background: transparent; border: 0px; box-shadow: none; font-size: 14px; color: #fff; padding: 0px; top: 50%; transform: translateY(-50%); z-index: 1; } .blog_right_sidebar .author_widget { text-align: center; } .blog_right_sidebar .author_widget h4 { font-size: 18px; line-height: 20px; color: #002347; margin-bottom: 5px; margin-top: 30px; } .blog_right_sidebar .author_widget p { margin-bottom: 0px; } .blog_right_sidebar .author_widget .social_icon { padding: 7px 0px 15px; } .blog_right_sidebar .author_widget .social_icon a { font-size: 14px; color: #002347; transition: all 0.2s linear; } .blog_right_sidebar .author_widget .social_icon a+a { margin-left: 20px; margin-left: 20px; } .blog_right_sidebar .author_widget .social_icon a:hover { color: #fdc632; } .blog_right_sidebar .post_category_widget .cat_list li { border-bottom: 2px dotted #eee; transition: all 0.3s ease 0s; padding-bottom: 12px; } .blog_right_sidebar .post_category_widget .cat_list li a { font-size: 14px; line-height: 20px; color: #777; } .blog_right_sidebar .post_category_widget .cat_list li a p { margin-bottom: 0px; } .blog_right_sidebar .post_category_widget .cat_list li+li { padding-top: 15px; } .blog_right_sidebar .post_category_widget .cat_list li:hover { border-color: #fdc632; } .blog_right_sidebar .post_category_widget .cat_list li:hover a { color: #fdc632; } .blog_right_sidebar .newsletter_widget { text-align: center; } .blog_right_sidebar .newsletter_widget .form-group { margin-bottom: 8px; } .blog_right_sidebar .newsletter_widget .input-group-prepend { margin-right: -1px; } .blog_right_sidebar .newsletter_widget .input-group-text { background: #fff; border-radius: 0px; vertical-align: top; font-size: 12px; line-height: 36px; padding: 0px 0px 0px 15px; border: 1px solid #eeeeee; border-right: 0px; } .blog_right_sidebar .newsletter_widget .form-control { font-size: 12px; line-height: 24px; color: #cccccc; border: 1px solid #eeeeee; border-left: 0px; border-radius: 0px; } .blog_right_sidebar .newsletter_widget .form-control.placeholder { color: #cccccc; } .blog_right_sidebar .newsletter_widget .form-control:-moz-placeholder { color: #cccccc; } .blog_right_sidebar .newsletter_widget .form-control::-moz-placeholder { color: #cccccc; } .blog_right_sidebar .newsletter_widget .form-control::-webkit-input-placeholder { color: #cccccc; } .blog_right_sidebar .newsletter_widget .form-control:focus { outline: none; box-shadow: none; } .blog_right_sidebar .newsletter_widget .bbtns { background: #fdc632; color: #fff; font-size: 12px; line-height: 38px; display: inline-block; font-weight: 500; padding: 0px 24px 0px 24px; border-radius: 0; } .blog_right_sidebar .newsletter_widget .text-bottom { font-size: 12px; } .blog_right_sidebar .tag_cloud_widget ul li { display: inline-block; } .blog_right_sidebar .tag_cloud_widget ul li a { display: inline-block; border: 1px solid #eee; background: #fff; padding: 0px 13px; margin-bottom: 8px; transition: all 0.3s ease 0s; color: #002347; font-size: 12px; } .blog_right_sidebar .tag_cloud_widget ul li a:hover { background: #fdc632; color: #fff; } .blog_right_sidebar .br { width: 100%; height: 1px; background: #eeeeee; margin: 30px 0px; } /* blog_right_sidebar */ /*pd_post_widget */ .pd_post_widget_list { list-style: none; margin: 17px -6px; } .fl_right .blog_right_sidebar .pd_post_widget .wiiuii-suiji-main span { color: #fff; } .fl_right .blog_right_sidebar .pd_post_widget .wiiuii-suiji-main { background-size: cover; background-repeat: no-repeat; background-position: center center; cursor: pointer; height: 316px; width: 100%; border-radius: var(--main-radius); position: relative } .fl_right .blog_right_sidebar .pd_post_widget .wiiuii-suiji-header { display: flex; justify-content: space-between } .fl_right .blog_right_sidebar .pd_post_widget .xingyu-dt-ty { line-height: 45px; padding: 20px; display: flex; flex-direction: column } .fl_right .blog_right_sidebar .pd_post_widget .xingyu-dt-day { font-size: 60px; font-weight: 700; color: #fff } .fl_right .blog_right_sidebar .pd_post_widget .xingyu-sj-date span { font-size: 16px; font-weight: 700; color: #fff } .fl_right .blog_right_sidebar .pd_post_widget .xingyu-sjzt-ty span { line-height: 25px; height: 245px; writing-mode: vertical-rl; padding: 15px; color: #fff; font-size: 15px } .fl_right .blog_right_sidebar .pd_post_widget .xingyu-sj-qhbtn { position: absolute; bottom: 30px; padding: 10px } .fl_right .blog_right_sidebar .pd_post_widget .xingyu-sj-qhbtn>span>i { font-size: 16px } .fl_right .blog_right_sidebar .pd_post_widget .xingyu-sj-qhbtn span:hover { color: #f44336 } .fl_right .blog_right_sidebar .pd_post_widget .xingyu-sjtitle-ty { position: absolute; bottom: 0; text-align: center; left: 0; right: 0; bottom: 0; padding: 5px } /*pd_post_widget */ .footer-nav-bottom { float: left; } .section_gap { padding: 130px 0; } .section_gap_top { padding-top: 40px; } /* Main Title Area css ============================================================================================ */ .onebigbox { position: relative; margin: 20px 0px; } .main_title { /* position: absolute; */ text-align: center; border-left: 8px solid #4e969cd6; margin-top: 20px; } .biaoti { font-family: "楷体"; /* position: absolute; */ color: #42696c; font-size: 35px; font-weight: bold; } .main_searchbox { position: absolute; right: -940px; /* 距原位置左方0 */ bottom: 8px; /* 距原位置下方0 */ box-sizing: border-box; } .main_searchbox .bar1 { background: #A3D0C3; } .main_searchbox .bar1 form { position: relative; width: 250px; } .main_searchbox .bar1 input, .main_searchbox .bar1 button { border: none; outline: none; } .main_searchbox .bar1 input { border: 2px solid #0a0f12; border-radius: 5px; color: #161516; width: 100%; height: 35px; padding-left: 13px; } .main_searchbox .bar1 button { top: 0; right: 0; background: #4d7b9e; border-radius: 0 5px 5px 0; height: 35px; width: 42px; cursor: pointer; position: absolute; } .main_searchbox .bar1 button:before { content: "\e64c"; font-family: "iconfont" !important; font-size: 16px; color: #f8f8f8; } /* End Main Title Area css ============================================================================================ */ /* Banner =========================================================================================== */ #divout { position: relative; } .imgdiv img { width: 100%; height: 550px; margin: 0 auto; } .imgdiv { /* width: 1535px; height: 500px; */ display: none; } .dotdiv { text-align: center; position: absolute; width: 100%; bottom: 14px; } .dot { width: 16px; height: 16px; display: inline-block; background: #bbbbbb; border-radius: 10px; margin: 0 12px; } .title { font-size: 18px; color: #f2f2f2; position: absolute; text-align: center; font-weight: 700; width: 100%; bottom: 10px; } .active { background-color: #717171; } /* #arrow { position: absolute; top: 50%; margin-top: -30px; width: 100%; opacity: .3; transition: opacity 2s; } #divout:hover #arrow { opacity: .9; } #arrow img { cursor: pointer; } .imgdiv { animation: fade 1.5s; } */ @keyframes fade { from { opacity: .3; } to { opacity: 1; } } @media (min-width:576px) { .imgdiv img { -ms-flex: 0 0 100%; flex: 0 0 100%; max-height: 100%; } } .carousel-control-prev, .carousel-control-next { position: absolute; top: 0; bottom: 0; z-index: 1; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; width: 15%; color: #fff; text-align: center; opacity: 1.5; transition: opacity 0.15s ease; } @media (prefers-reduced-motion: reduce) { .carousel-control-prev, .carousel-control-next { transition: none; } } .carousel-control-prev:hover, .carousel-control-prev:focus, .carousel-control-next:hover, .carousel-control-next:focus { color: #fff; text-decoration: none; outline: 0; opacity: 0.9; } .carousel-control-prev { left: 0; } .carousel-control-next { right: 0; } .carousel-control-prev-icon, .carousel-control-next-icon { display: inline-block; width: 20px; height: 20px; background: no-repeat 50% / 100% 100%; } .carousel-control-prev-icon { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M5.25 0l-4 4 4 4 1.5-1.5L4.25 4l2.5-2.5L5.25 0z'/%3e%3c/svg%3e"); } .carousel-control-next-icon { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M2.75 0l-1.5 1.5L3.75 4l-2.5 2.5L2.75 8l4-4-4-4z'/%3e%3c/svg%3e"); } /* Banner ============================================================================================ */ /* Start Features Area css ============================================================================================ */ .feature_area { margin-top: 20px; } /* End Features Area css ============================================================================================ */ /* Start Popular Courses Area css ============================================================================================ */ .popular_courses { -ms-flex-pack: center !important; justify-content: center !important; display: -ms-flexbox; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-right: -15px; margin-left: -15px; } .single_course { background-color: #fff; height: 162px; margin-top: 21px; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .owl-carousel { padding-bottom: 20px; } .single_course .course_content_img { float: left; height: 180px; width: 130px; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .single_course .course_content { float: right; margin: 5px 21px; position: relative; width: 85%; height: 154px; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .single_course .course_content h4 { font-size: 20px; font-weight: 500; margin-top: 15px; } .single_course .course_content h4 a { color: #002347; } .single_course .course_content p { margin: 0; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; } .single_course:hover { box-shadow: 0px 10px 30px rgba(0, 35, 71, 0.1); } .single_course:hover .course_content { background: #fff; } .single_course:hover h4 a { color: #fdc632; } /* End Popular Courses Area css ============================================================================================ */ /* 诗词 ============================================================================================ */ .single-poetry, .single-trainer { margin-top: 25px; } .single-poetry .meta-text, .single-trainer .meta-text { height: 200px; padding: 20px 18px; box-shadow: 0px 0px 30px rgba(153, 153, 153, 0.13); background: #ffffff; } .single-trainer .meta-text p { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; } .single-poetry .meta-text p { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .single-poetry .meta-text h4, .single-trainer .meta-text h4 { font-size: 20px; margin-bottom: 0px; } .single-poetry .meta-text a, .single-trainer .meta-text a { font-size: 14px; margin: 0 10px; color: #cccccc; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .single-poetry .meta-text a:hover, .single-trainer .meta-text a:hover { color: #fdc632; } .single-poetry:hover .meta-text, .single-trainer:hover .meta-text { box-shadow: 0px 10px 30px rgba(0, 35, 71, 0.15); } h3 { font-size: 24px; } h4 { font-size: 18px; } .single-textarea { display: block; width: 100%; line-height: 40px; border: none; outline: none; background: #f9f9ff; padding: 0 20px; height: 100px; resize: none; } .single-textarea:focus { outline: none; }