Template:BIT/test/responsive/CSS

/* 1 --------- Variable and MIxins --------- */ @media (min-width: 1200px) {

 .container {
   min-width: 1200px;
   width: 1200px;
 }

} @media (max-width: 1199px) {

 .box-layout {
   overflow-x: hidden;
 }

 .about-us img,
 .facts-02 {
   max-width: 930px;
 }

 .promotion form input {
   width: 32%;
 }

 .course-category .category-items .item {
   width: 18.3%;
 }

 .announcement.announcement-02 .announcement-content h3 {
   font-size: 2.5em;
 }

 .course-items .item .item-details {
   padding: 15px;
 }

 .course-items .item .rating {
   font-size: 12px;
   margin-top: 3px;
 }

 .author-bio .author-contents .name {
   margin-bottom: .875em;
 }
 .author-bio .author-contents .name + span {
   display: inline-block;
   margin-bottom: 1rem;
 }

 .load-more {
   margin-top: 1em;
 }

 .course-reviews .progress {
   min-width: 60%;
 }

 .blog-posts article .entry-content .entry-title {
   font-size: 1.75em;
 }

 .wpcf7-form input {
   margin-right: 25px;
 }

 .events .event-title {
   font-size: 1.25em;
 }

 .event-single-contents .event-banner .timeTo figure {
   margin: .25em;
   padding: .25em;
 }

 .event-single-contents .event-banner .timeTo figure:before {
   right: -.325em;
 }

 .single-item-contents .item-gallery .nav-tabs a {
   max-width: 60px;
 }

 .single-item-contents .item-gallery .col-md-7 {
   padding-left: 15px;
 }

 aside .widget_instagram a {
   max-width: 60px;
 }

 .shop aside .widget_filter_color button {
   margin-right: 5px;
 }

 .footer-top article.media .entry-title {
   line-height: 18px;
   margin-bottom: 0;
 }

 .footer-top article.media .entry-meta {
   margin-top: .75em;
 }

} @media (max-width: 992px) {

 .banner-section .section-padding {
   padding: 7em 0;
 }
 .banner-section h2 {
   font-size: 3.5em;
 }
 .banner-section h3 {
   font-size: 3em;
 }
 .banner-section h4 {
   font-size: 2.5em;
 }
 .banner-section h5 {
   font-size: 2em;
 }
 .banner-section h6 {
   font-size: 1.4em;
 }

 .banner-btn {
   padding: 0 2.8125em;
 }

 .banner-section.banner-03 .item {
   padding: 1em;
 }

 .banner-section.banner-04 .section-padding {
   padding: 10em 0;
 }

 .section-padding {
   padding: 5em 0;
 }

 .top-content {
   margin-bottom: 2em;
 }
 .top-content p {
   font-size: 1em;
   line-height: 24px;
 }

 .section-title {
   font-size: 1.4em;
 }

 .course-search-form:before {
   width: 60px;
 }

 .course-search-form input[type="submit"] {
   width: 60px;
 }

 .promotion .timeTo figure {
   margin: .5em;
 }
 .promotion .timeTo figure:before {
   right: -.5em;
 }
 .promotion form input {
   width: 31.5%;
 }

 .course-category .category-items .item {
   width: 17.7%;
 }

 .popular-courses .top-content {
   margin-bottom: 1em;
 }
 .popular-courses .item {
   margin: 1em 0;
 }

 .facts .section-padding {
   padding: 5em 0;
 }
 .facts .item {
   margin: 1em 0;
 }

 .events .section-padding {
   padding-bottom: 3em;
 }
 .events .top-content {
   margin-bottom: 0;
 }
 .events .event-time {
   font-size: 15px;
   margin-right: 15px;
   max-width: 65px;
 }
 .events .event-time .date {
   font-size: 30px;
   line-height: 70px;
   margin-bottom: 10px;
 }

 .testimonial .testimonial-slider {
   padding: 0 10% 2em;
 }

 .features .section-padding {
   padding: 3.75em 0;
 }

 .recent-posts.recent-posts-02 .col-lg-5 {
   padding: 0 15px 1.5em !important;
 }

 .announcement.announcement-02 .announcement-content {
   padding: 0;
 }

 .miscellaneous .col-lg-4 {
   margin-top: 1.5em;
 }

 .page-name .section-padding {
   padding: 3em 0;
 }

 .filters .selectric-wrapper {
   margin-bottom: 1em;
 }

 .filters p {
   margin: 0;
 }

 .courses .course-items.list-view .details-bottom {
   margin-bottom: 0 !important;
 }

 .courses .course-title {
   font-size: 1.5em;
 }

 .courses .course-meta {
   margin-bottom: 1.75em;
 }

 .single-item-details,
 .course-single-details {
   margin-top: 1.5em;
 }

 .single-item-details .title,
 .course-single-details .title {
   margin: 1em 0 .5em;
 }

 .single-item-details p,
 .course-single-details p {
   margin: 1em 0;
 }

 .author-bio {
   margin-top: 1em 0 1.5em;
 }
 .author-bio .author-contents {
   display: block;
   margin-top: 1.4em;
 }
 .author-bio .author-contents .author-details {
   margin-left: 210px;
 }

 .single-item-details .title,
 .course-single-details .title {
   font-size: 1.125em;
 }

 .courses aside .info li,
 .events aside .widget ul li,
 .events aside .widget ol li {
   padding: .875em 1em;
 }

 .instructors .section-padding {
   padding: 4em 0;
 }
 .instructors .instructor {
   margin: 1em 0;
 }
 .instructors .pagination {
   margin-top: 2em;
 }

 .instructor-details .col-md-4.pr-5 {
   padding-right: 15px !important;
 }

 .instructor-taught .item {
   margin: 1em 0;
 }

 .instructor-taught .pagination {
   margin-top: 2em;
 }

 .pagination {
   margin-top: 3em;
 }

 .blog-posts article .entry-content .post-date {
   font-size: 15px;
   margin-right: 15px;
   max-width: 65px;
 }
 .blog-posts article .entry-content .post-date .date {
   font-size: 30px;
   line-height: 70px;
   margin-bottom: 10px;
 }
 .blog-posts article .entry-content .entry-title {
   font-size: 1.5em;
   margin-top: -5px;
 }

 .banner-section.banner-04,
 .announcement.announcement-02,
 .about-us img, .facts-02 {
   max-width: 100%;
 }

 .promotion form input[type="submit"] {
   font-size: .75em;
 }

 .contact .section-padding {
   padding: 3.75em 0;
 }

 .wpcf7-form .form-control,
 .comment-form .form-control {
   margin-right: 18px;
   margin-bottom: 1.4em;
 }

 .contact #googleMaps {
   height: 25em;
   margin: 3.625em 0 0.625em;
 }

 .events .event {
   margin: 1em 0;
 }

 .event-single-contents .event-banner .timeTo {
   font-size: 35px !important;
 }

 .event-single-contents .timeTo div {
   height: 35px !important;
   width: 28px !important;
 }

 .portfolio .portfolio-items {
   margin-top: 1.4em;
 }
 .portfolio .pagination {
   margin-top: 2.65em;
 }

 .single-works-content {
   padding-left: 0;
 }

 .related-works {
   margin-top: 3em;
 }

 .shop .pagination {
   margin-top: 2.25em;
 }

 .shop aside .ui-widget {
   margin-bottom: 20px;
 }

 .shop aside .widget_filter_price .btn {
   float: left !important;
   margin-top: 15px;
 }

 .shop aside .widget_filter_color button {
   margin-bottom: 5px;
 }

 .single-item-contents .item-gallery .nav-tabs a {
   max-width: 50px;
 }

 .average-rating {
   margin-bottom: 1em;
 }

 aside.sidebar {
   padding-left: 0 !important;
   padding-right: 0 !important;
 }

 aside .widget_instagram li {
   width: 33.3%;
   float: left;
 }
 aside .widget_instagram a {
   margin: 5px 10px 5px 0;
 }

 .footer-top .widget {
   padding-top: 0;
 }

 .footer-top .widget h1, .footer-top .widget h2, .footer-top .widget h3, .footer-top .widget h4, .footer-top .widget h5, .footer-top .widget h6 {
   margin: 0 0 30px;
 }

 .event-single-contents .event-banner .timeTo {
   font-size: 30px !important;
 }
 .event-single-contents .event-banner .timeTo figure {
   background-color: transparent;
   border: none;
   margin: 0 15px 10px 0;
   padding: 0;
 }
 .event-single-contents .event-banner .timeTo figure:before {
   display: none;
 }
 .event-single-contents .event-banner .timeTo figure div {
   height: 30px !important;
   width: 25px !important;
 }
 .event-single-contents .event-banner .timeTo figure ul {
   top: 0 !important;
 }

} @media (max-width: 767px) {

 .container {
   max-width: inherit;
   width: 100%;
 }

 input {
   height: 50px !important;
 }

 .banner-section .section-padding {
   padding: 4em 0;
 }
 .banner-section h2 {
   font-size: 2.5em;
 }
 .banner-section h3 {
   font-size: 2em;
 }
 .banner-section h4 {
   font-size: 1.875em;
 }
 .banner-section h5 {
   font-size: 1.125em;
 }
 .banner-section h6 {
   font-size: 1em;
 }
 .banner-section .row.mt-5.pt-4 {
   margin-top: 0 !important;
   padding-top: 0 !important;
 }

 .banner-section.banner-02 .banner-texts .course-search-form {
   max-width: inherit;
   width: 100%;
 }

 .banner-section.banner-04 .section-padding {
   padding: 7em 0;
 }

 .top-content div[class*="float"] {
   float: none !important;
 }

 .course-search-form:before {
   display: none;
 }
 .course-search-form input {
   padding: 12px 15px;
 }
 .course-search-form input[type="submit"] {
   display: none;
 }

 .promotion .title {
   font-size: 2.25em;
 }
 .promotion .sub-title {
   font-size: 1.25em;
 }
 .promotion .timeTo figure {
   background-color: transparent;
   border: none;
   margin: 0;
   padding: 0 10px;
 }
 .promotion .timeTo figure:before {
   display: none;
 }
 .promotion form input {
   max-width: inherit;
   margin: 0 0 10px !important;
   width: 100%;
 }

 .course-category .category-items .item {
   width: 44.75%;
 }

 .events div[class*="col"] {
   padding: 0 15px !important;
 }
 .events .event {
   display: inline-block;
   width: 100%;
 }
 .events .event-time {
   max-width: inherit;
   margin: 0 0 15px !important;
   text-align: left;
   width: 100%;
 }
 .events .event-time .date {
   background-color: transparent;
   display: inline-block;
   color: #0d47a1;
   font-size: 15px;
   line-height: 1;
   margin: 0;
   padding: 0;
   width: inherit;
 }
 .events .event-details {
   display: inline-block;
   -webkit-box-flex: 0;
       -ms-flex: none;
           flex: none;
   width: 100%;
 }

 .evant-page .events .event {
   max-width: 600px;
   margin-left: auto;
   margin-right: auto;
   display: block;
 }
 .evant-page .events .event .event-thumb img {
   width: 100%;
 }

 .testimonial .testimonial-slider {
   padding-left: 0;
   padding-right: 0;
 }
 .testimonial .testimonial-slider a[class*="control"] {
   display: none;
 }

 .subscribe form input {
   width: 100%;
 }
 .subscribe form input[type="submit"] {
   border-radius: 0;
   margin-top: 15px;
   width: inherit;
 }

 .course-category.category-01 .category-slider .owl-nav {
   left: inherit;
   right: 0;
   margin-top: -50px;
   max-width: 100px;
   top: 0;
 }
 .course-category.category-01 .category-slider .owl-nav button {
   margin: 0 0 0 10px !important;
 }
 .course-category.category-01 .category-slider .owl-dots {
   display: none;
 }

 .features .item {
   margin: 1em 0;
 }

 .top-courses .item .item-details .item-title {
   font-size: 1.125em;
   padding: 15px;
 }

 .courses .course-items.list-view .item .item-details {
   height: 185px;
 }

 .announcement h2 {
   font-size: 2.5em;
 }
 .announcement h3 {
   font-size: 2em;
 }
 .announcement h4 {
   font-size: 1.75em;
 }
 .announcement h5 {
   font-size: 1.25em;
 }
 .announcement h6 {
   font-size: 1em;
 }

 .events {
   position: relative;
   padding-bottom: 70px;
 }
 .events .top-content .right-content {
   position: absolute;
   bottom: 50px;
   left: 0;
   right: 0;
   text-align: center;
 }
 .events .section-title + p {
   padding-bottom: 15px;
 }
 .events .events-list li .event-time:before {
   right: 11px;
 }
 .events.black-bg .event-time .date {
   color: white;
 }
 .events.events-02 .events-list + a, .events.events-02 .btn {
   margin-bottom: 70px !important;
 }
 .events.events-02 .section-title {
   padding-top: 30px;
 }

 .popular-courses.no-slider {
   position: relative;
   padding-bottom: 70px;
 }
 .popular-courses.no-slider .top-content .right-content {
   position: absolute;
   bottom: 0px;
   left: 0;
   right: 0;
   text-align: center;
 }
 .popular-courses.no-slider.last-section .top-content .right-content {
   bottom: 100px;
 }

 .recent-posts .entry-thumbnail img {
   width: 100%;
 }

 .recent-posts.recent-posts-02 .section-padding {
   padding-top: 10px;
 }
 .recent-posts.recent-posts-02 .news-section {
   padding-top: 40px;
 }
 .recent-posts.recent-posts-02 .news-section article.post {
   padding-bottom: 20px;
 }
 .recent-posts.recent-posts-02 article .entry-thumbnail {
   float: none;
   margin: 0 0 1em !important;
   max-width: inherit;
 }

 .btn-container.mt-4.text-right {
   text-align: left !important;
 }

 .announcement .announcement-content .btn {
   padding: 1em 1.5em;
 }

 .miscellaneous .section-title {
   margin-top: 15px;
 }

 .courses aside.sidebar {
   margin-bottom: 2em;
 }

 .page-name .section-padding {
   padding: 1.5em 0;
 }

 .instructors div[class*="col"] {
   width: 50%;
 }

 .instructor-details .meta ul li,
 .instructor-details .meta ol li {
   margin: 1em 1em 0 0;
 }

 .blog-posts article .entry-content {
   display: inline-block;
   width: 100%;
 }
 .blog-posts article .entry-content .post-date {
   max-width: inherit;
   margin: 0 0 15px !important;
   text-align: left;
   width: 100%;
 }
 .blog-posts article .entry-content .post-date .date {
   background-color: transparent;
   display: inline-block;
   color: #0d47a1;
   font-size: 15px;
   line-height: 1;
   margin: 0;
   padding: 0;
   width: inherit;
 }
 .blog-posts article .entry-content .content-details {
   display: inline-block;
   -webkit-box-flex: 0;
       -ms-flex: none;
           flex: none;
   width: 100%;
 }
 .blog-posts article .entry-content .content-details .entry-title {
   font-size: 1.125em;
 }
 .blog-posts aside.sidebar {
   margin-top: 3em;
 }

 .blog-posts .format-link .entry-thumbnail a {
   padding: 2em 1em;
 }

 .share.dropdown.float-right {
   float: none !important;
 }

 .post-navigation article {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   margin-bottom: 2em;
 }
 .post-navigation article .entry-thumbnail {
   margin: 0 15px 15px 0;
 }
 .post-navigation .col-md-6:first-child article {
   margin-bottom: 1.5em;
 }
 .post-navigation .col-md-6:last-child article .entry-thumbnail {
   float: left;
   margin: 0 15px 15px 0;
 }
 .post-navigation .col-md-6:last-child article .entry-content {
   text-align: left;
 }

 .about-us img {
   margin-top: 0;
 }

 .about-us .col-md-6 {
   margin-top: 2em;
 }

 .event-single-contents .event-banner .overlay {
   padding: 4.5em 0;
 }

 .event-single-contents ul,
 .event-single-contents ol {
   padding: 0;
 }

 .event-single-contents div[class*="col"] {
   width: 50%;
 }

 .single-works-content {
   margin-top: 1.5em;
 }

 .shop aside.sidebar {
   margin-top: 3em;
 }
 .shop .single-item-contents .item-title {
   margin-top: 1em;
 }
 .shop .related-products {
   margin-top: 1em;
 }

 .faq aside.sidebar {
   margin-bottom: 3em;
 }

 aside .widget_popular_post .entry-title,
 aside .widget_popular_items .item-title {
   margin-top: 10px !important;
 }

 aside .widget_instagram li {
   width: inherit;
   float: none;
 }

 footer div[class*="col"]:last-child .widget {
   margin-bottom: 0;
 }
 footer .footer-bottom {
   padding: 1em 0;
   text-align: center;
 }
 footer .footer-bottom [class*="float"] {
   float: none !important;
 }
 footer .footer-bottom .menu {
   margin-top: 1em;
 }

 .banner-btn {
   padding: 0 2.8125em;
 }

 .site-footer .widget {
   padding-bottom: 15px;
 }
 .site-footer .widget_recnt_news {
   padding-bottom: 40px;
 }
 .site-footer .widget_nav_menu .menu {
   margin-bottom: 0;
 }

 .facts .col-lg-3.col-md-6 {
   width: 50%;
 }

 .widget .entry-content {
   display: initial !important;
 }

 .shop aside .widget_filter_price .btn {
   float: right !important;
 }

 .announcement-02 {
   text-align: center;
 }
 .announcement-02 .btn-container.text-right {
   text-align: center !important;
 }

} @media (max-width: 600px) {

 .facts .col-lg-3.col-md-6 {
   width: 100%;
 }

 .popular-courses .item {
   padding-left: 5px;
   padding-right: 5px;
 }

} @media (max-width: 567px) and (orientation: portrait) {

 .top-courses div[class*="col"] {
   -webkit-box-flex: 0;
       -ms-flex: none;
           flex: none;
   max-width: inherit;
   width: 100%;
 }

 .comments .comment-list .comment-body {
   display: inline-block;
   width: 100%;
 }
 .comments .comment-list .comment-body .comment-content {
   display: inline-block;
   -webkit-box-flex: 0;
       -ms-flex: none;
           flex: none;
   margin-top: 15px;
   width: 100%;
 }

 .comments .children {
   padding-left: 0;
 }

 .wpcf7-form input,
 .comment-form input {
   max-width: inherit;
   width: 100%;
 }

 .portfolio .item {
   width: 50%;
 }

 .single-item-details .nav-tabs a,
 .course-single-details .nav-tabs a {
   overflow: hidden;
   width: 70px;
   z-index: 0;
   position: relative;
 }
 .single-item-details .nav-tabs a:after,
 .course-single-details .nav-tabs a:after {
   content: "...";
   background: white;
   z-index: 1;
   position: absolute;
   right: 0;
   top: 0;
   bottom: 0;
   line-height: 30px;
   padding-left: 2px;
 }

 .single-item-details .nav-tabs a.active,
 .course-single-details .nav-tabs a.active {
   overflow: visible;
   width: inherit;
 }
 .single-item-details .nav-tabs a.active:after,
 .course-single-details .nav-tabs a.active:after {
   display: none;
 }

} @media (max-width: 480px) {

 .author-bio {
   margin-bottom: 30px;
 }
 .author-bio .author-avatar {
   text-align: center;
 }
 .author-bio .author-contents .author-details {
   clear: both;
   display: inline-block;
   -webkit-box-flex: 0;
       -ms-flex: none;
           flex: none;
   margin-top: 1em;
   width: 100%;
   margin-left: 0;
 }

} @media (max-width: 413px) and (orientation: portrait) {

 .course-reviews .progress {
   min-width: 45%;
 }

} @media (max-width: 320px) {

 .event-single-contents div[class*="col"] {
   width: 100%;
 }

 .portfolio .item {
   width: 100%;
 }

} /*# sourceMappingURL=responsive.css.map */