/*Over - Multi-Concept Web App UI Kit Mobile Template*/


/*Table of Content
-------
fonts
general
button
navbar
sidebar
slider
welcome
features
counter
latest-news
testimonial
courses
teacher
event
portfolio
team
blog
blog single
collapse
calendar
card
list
pagination
table
tabs
about
settings
pricing table
form
sign in
sign up
contact us
page not found
*/


/*font*/

@import url('https://fonts.googleapis.com/css?family=Roboto:400,500,700,900');

/*general*/

body {
    font-family: 'Roboto', sans-serif;
    color: #888;
    font-size: 13px;
    background: #fff;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    line-height: 110%;
    margin: 0;
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
    color: #333;
}

h1 {
    font-size: 30px;
}

h2 {
    font-size: 26px;
}

h3 {
    font-size: 22px;
}

h4 {
    font-size: 18px;
}

h5 {
    font-size: 16px;
}

h6 {
    font-size: 14px;
}

p {
    margin: 8px 0;
}

a {
    color: #333;
}

a:hover {
    color: #333;
}

a.link-color {
    color: #7dbc6c;
}

a.link-color:hover {
    color: #7dbc6c;
}

img {
    display: block;
}

.segments {
    padding: 35px 0;
}

.segments-page {
    padding: 70px 0 25px;
}

.section-title {
    margin-bottom: 20px;
    text-align: center;
}

.section-title h3 {
    letter-spacing: 1px;
    font-weight: 500;
    font-size: 20px;
}

.section-title .line {
    background: linear-gradient(to right, rgba(255, 255, 255, 255), rgb(0, 178, 169), rgba(255, 255, 255, 255));
    width: 24%;
    height: 2px;
    margin: 0 auto;
    margin-top: 5px;
}

.section-title.title-left {
    text-align: left;
}

.section-title.title-left .line {
    background: linear-gradient(to right, rgb(0, 178, 169), rgba(255, 255, 255, 255));
    width: 24%;
    height: 2px;
    margin: 0;
    margin-top: 5px;
}

.pages-title {
    padding-bottom: 15px;
    text-align: center;
    margin-bottom: 10px;
    margin-top: 10px;
}

.pages-title h3 {
    text-transform: uppercase;
    font-size: 18px;
}

.pages-title .line {
    width: 26px;
    height: 2px;
    background: #7dbc6c;
    margin: 0 auto;
    margin-top: 0px;
    margin-top: 8px;
}

.text-bold {
    font-weight: bold;
    font-size: 14px;
}

.date {
    color: #666;
    font-size: 13px;
    margin-top: 5px;
}

.date i {
    margin-right: 5px;
    color: #7dbc6c;
}

.bg-second {
    background-color: #f7f7f7;
}


/*button default*/

.button {
    background-color: #7dbc6c;
    color: #fff;
    border: 0;
    padding: 3px 8px;
    border-radius: 2px;
    cursor: pointer;
    font-size: 12px;
    box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1);
    margin-top: 10px;
}

.button-full {
    width: 100%;
    background-color: #7dbc6c;
    color: #fff;
    border: 0;
    padding: 7px 16px;
    border-radius: 2px;
    cursor: pointer;
    font-size: 13px;
}

.button i,
.button-full i {
    margin-right: 6px;
}

.button:focus {
    background-color: #7dbc6c;
}


/*button variants*/

.button-white {
    background-color: #fff;
    color: #333;
}

.button-black {
    background-color: #000;
}

.floating-button {
    width: 45px;
    height: 45px;
    border-radius: 50%;
}

.section-title.button-page {
    text-align: left;
}


/*navbar*/

.navbar {
    padding: 15px 0 11px;
    box-shadow: 0 0 6px rgba(140, 132, 132, 0.41);
    background-color: #7dbc6c;
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
    right: 0;
    z-index: 99;
}

.navbar a {
    color: #fff;
}

.navbar i {
    font-size: 16px;
    margin-top: 3px;
}

.navbar .content-center {
    text-align: center;
}

.navbar .content-center h1 {
    font-size: 24px;
    padding: 0;
    margin: 0;
    font-weight: 900;
    letter-spacing: 1px;
    color: #fff;
}

.navbar .content-center h1 span {
    color: #7dbc6c;
}

.navbar .content-right {
    text-align: right;
}

.navbar .row {
    margin-bottom: 0;
}


/*sidebar*/

.sidebar-panel .side-nav {
    width: 260px;
    height: 100%;
}

.sidebar-panel .side-nav .user-view {
    padding: 70px 20px 20px;
    text-align: center;
    background: rgba(0, 0, 0, 0.61);
}

.sidebar-panel .side-nav .user-view>img {
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
    margin: 0 auto;
}

.sidebar-panel .side-nav .user-view span {
    margin-top: 12px;
    display: block;
}

.sidebar-panel .side-nav .user-view .background img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.sidebar-panel .side-nav li>a:hover {
    background: transparent;
}

.sidebar-panel .side-nav li>a {
    padding: 0 16px;
    font-weight: 500;
}

.sidebar-panel .side-nav li a i {
    margin-right: 1rem;
    width: auto;
    font-size: 15px;
    color: rgba(0, 0, 0, 0.87);
}

.sidebar-panel .side-nav li a>i {
    width: 30px;
    font-size: 16px;
}

.sidebar-panel .collapsible {
    border: 0;
}

.sidebar-panel .side-nav .collapsible-header {
    display: block;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.87);
    font-weight: 500;
    overflow: hidden;
}

.sidebar-panel .side-nav .collapsible-header:hover {
    background: transparent;
}

.sidebar-panel .side-nav .collapsible-header>i {
    font-size: 16px;
    width: 30px;
    text-align: left;
}

.sidebar-panel .side-nav .collapsible-header span i {
    float: right;
    margin: 0;
    width: auto;
    font-size: 15px;
}

.sidebar-panel .side-nav .active .collapsible-header span i {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}

.sidebar-panel .side-nav .collapsible-body li a {
    padding: 0 23.5px 0 61px;
}

.sidebar-panel .side-nav li.active {
    background: transparent;
}


/*sidebar search*/

.sidebar-search .collapsible {
    padding: 15px
}

.sidebar-search .form input[type="search"] {
    width: calc(100% - 55px);
    height: 33px;
    border-radius: 2px;
    border: 1px solid #ccc;
    margin-bottom: 0;
    padding: 0 5px;
    float: left;
}

.sidebar-search .clear {
    clear: both;
}

.sidebar-search .form input[type="search"]:focus {
    border-bottom: 1px solid #ccc;
    box-shadow: none;
}

.sidebar-search .side-nav li>a {
    padding: 0;
    height: 32px;
}

.sidebar-search .button {
    float: right;
    width: 37px;
    height: 35px;
    padding: 7px 12px;
    text-align: center;
    line-height: 12px;
    border-radius: 2px;
    box-shadow: none;
}

.sidebar-search .button:focus {
    background-color: #f44336;
}

.sidebar-search h5 {
    margin-top: 20px;
    margin-bottom: 4px;
    color: #aaa;
    font-size: 14px;
}


/*slide*/

.slide {
    height: 230px;
    margin-top: 50px;
}

.slide .slide-content {
    height: 230px;
    background: #fff;
}

.slide .slide-content .mask {
    background-color: rgba(0, 0, 0, 0.30);
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.slide .slide-content .mask2 {
    background-color: rgba(0, 0, 0, 0.61);
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.slide .slide-content img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.slide .slide-content .caption {
    position: absolute;
    top: 24%;
    left: 0;
    right: 0;
    padding: 15px;
    text-align: center;
}

.slide .slide-content .caption h2 {
    font-size: 22px;
}

.slide .slide-content .caption h2,
.slide .slide-content .caption p {
    color: #fff;
}

.slide .slide-content .caption button {
    padding: 3px 8px;
    font-size: 12px;
    margin-top: 5px;
}

.slide .owl-theme .owl-nav.disabled+.owl-dots {
    position: relative;
    top: -35px;
    margin-bottom: -36px;
}

.slide .owl-theme .owl-dots .owl-dot span {
    width: 10px;
    height: 5px;
    border-radius: 2px;
    transition: .3s ease;
    background-color: #fff;
    margin: 0 7px;
}

.slide .owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
    background-color: #7dbc6c;
}


/*welcome*/

.welcome h3 span {
    color: #7dbc6c;
}

.welcome .section-title {
    margin-bottom: 15px;
}

.welcome .content {
    text-align: center;
}


/*features*/

.features .content {
    padding: 15px;
    border: 1px solid #ddd;
    text-align: center;
    border-radius: 2px;
}

.features .content i {
    font-size: 30px;
    color: #7dbc6c;
    margin-bottom: 10px;
}

.features .content h5 {
    text-align: left;
    margin-bottom: 10px;
    font-size: 15px;
}

.features .row:last-child {
    margin-bottom: 0;
}

.features2 .content {
    text-align: left;
}


/*counter*/

.counter {
    background: url(../images/bg-banner.jpg);
    background-size: cover;
}

.counter .row {
    margin-bottom: 0;
}

.counter .content {
    text-align: center;
    background: rgba(255, 255, 255, 0.14);
    padding: 11px 0;
    border-radius: 2px;
}

.counter .content h3 {
    font-size: 24px;
    margin-bottom: 5px;
    color: #fff;
}

.counter .content h5 {
    font-weight: 400;
    font-size: 16px;
    color: #fff;
}


/*latest news*/

.latest-news .content h5 {
    margin-bottom: 5px;
}

.latest-news .content img {
    width: 100%;
    border-radius: 2px;
}

.latest-news .content ul {
    padding: 0;
    margin: 0;
    margin-bottom: 10px;
}

.latest-news .content ul li {
    list-style: none;
    display: inline-block;
    margin-right: 14px;
    color: #666;
}

.latest-news .content ul li:last-child {
    margin-right: 0;
}

.latest-news .content ul li i {
    margin-right: 5px;
    color: #7dbc6c;
}

.latest-news .row:last-child {
    margin-bottom: 0;
}

.latest-news .content h5 {
    margin-top: 15px;
    margin-bottom: 5px;
}


/*testimonial*/

.testimonial-section {
    background: url(../images/bg-banner.jpg);
}

.testimonial .content {
    color: #fff;
    background: rgba(0, 0, 0, 0.2);
    padding: 10px;
    display: inline-block;
}

.testimonial .content .post {
    background: transparent;
    text-align: right;
    border: 0;
}

.testimonial .content .post span {
    color: #ddd;
    position: absolute;
    top: 32px;
    left: 22px;
    font-size: 40px;
    transform: scaleY(-1);
}

.testimonial .content .post p {
    background: #fff;
    padding: 15px;
    padding-bottom: 28px;
    z-index: 1;
    position: relative;
    top: 23px;
    margin-top: -23px;
    border-radius: 2px;
    color: #666;
}

.testimonial .content .title {
    color: #fff;
    overflow: hidden;
    position: relative;
    top: 22px;
}

.testimonial .content .title h5 {
    color: #fff;
}

.testimonial .content .title p {
    margin: 2px 0 8px;
}

.testimonial .content img {
    width: 66px !important;
    height: auto;
    border-radius: 50%;
    border: 4px solid #6b535d;
    float: left;
    margin-right: 10px;
    position: relative;
    z-index: 2;
}

.testimonial.owl-theme .owl-dots .owl-dot span {
    width: 10px;
    height: 5px;
    border-radius: 2px;
    transition: .3s ease;
    background-color: #fff;
    margin: 0 7px;
}

.owl-theme .owl-dots .owl-dot.active span {
    background: #7dbc6c;
    width: 16px;
}


/*courses*/

.courses .row:last-child {
    margin-bottom: 0;
}

.courses .content img {
    width: 100%;
    display: block;
    border-radius: 2px;
}

.courses .content h5 {
    margin-top: 15px;
}

.courses .content ul {
    padding: 0;
    margin: 0;
}

.courses .content ul li {
    list-style: none;
    display: inline-block;
}

.courses .content ul li i {
    font-size: 12px;
    color: #f9be14;
    position: relative;
    top: 5px;
}

.courses .content ul .price {
    background: #7dbc6c;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    line-height: 24px;
    text-align: center;
    padding: 1px 14px;
    float: right;
}

.courses .content p {
    display: inline-block;
}


/*teacher*/

.teacher .content img {
    width: 60px;
    border-radius: 50%;
    border: 3px solid #fff;
    position: relative;
    top: 28px;
    left: 5px;
    margin-top: -28px;
}

.teacher .content .text {
    background: url(../images/bg-text.jpg);
    padding: 15px;
    border-radius: 2px;
    color: #fff;
}

.teacher .content .text h5 {
    color: #fff;
    position: relative;
    top: -2px;
    left: 42%;
    display: inline-block;
}

.teacher .content .text p {
    margin: 4px 0 0;
}


/*event*/

.event .content img {
    width: 100%;
    border-radius: 2px;
}

.event .content h5 {
    margin-top: 15px;
}

.event .content h5 span {
    color: #7dbc6c;
}

.event .content .date i {
    color: #7dbc6c;
}

.event .content a i {
    margin-left: 3px;
}


/*portfolio*/

.portfolio .row {
    margin: 0;
}

.portfolio .row .col {
    padding: 1px;
}

.portfolio .contents .text {
    padding: 13px 10px;
}

.portfolio .contents .text h4 span {
    float: right;
}

.portfolio .contents img {
    width: 100%;
    display: block;
}

.portfolio .contents h4 {
    font-weight: 400;
    font-size: 16px;
    margin-bottom: 11px;
}

.portfolio .portfolio-menu {
    text-align: center;
    margin-bottom: 18px;
}

.portfolio .portfolio-menu ul {
    padding: 0;
    margin: 0;
}

.portfolio .portfolio-menu ul li {
    list-style: none;
    display: inline-block;
    margin: 0 5px;
    padding: 0 10px 3px;
    color: #555;
    border-bottom: 2px solid #333;
    cursor: pointer;
    font-size: 13px;
}

.portfolio .portfolio-menu ul .active {
    border-color: #7dbc6c;
    color: #333;
}


/*team*/

.team .section-title h3 {
    top: -8px;
}

.team .section-title .line {
    margin-top: 1px;
}

.team .row:last-child {
    margin-bottom: 0;
}

.team .contents {
    background-color: #fff;
    box-shadow: 0 0 30px rgba(224, 224, 224, 0.3);
}

.team .contents .text {
    padding: 13px 10px;
}

.team .contents .text h4 span {
    float: right;
}

.team .contents img {
    width: 100%;
    display: block;
}

.team .contents h4 {
    font-weight: 400;
    font-size: 16px;
    margin-bottom: 8px;
}

.team .contents .social-link ul {
    padding: 0;
    margin: 0;
}

.team .contents .social-link ul li {
    list-style: none;
    display: inline-block;
    margin-right: 8px;
}

.team .contents .social-link ul li:last-child {
    margin-right: 0;
}

.team-pages .contents {
    background-color: #fff;
}

.team-pages .contents .text {
    padding: 13px 10px;
}

.team-pages .contents .text h4 span {
    float: right;
}

.team-pages .contents .text p {
    padding: 0;
    margin: 0;
}

.team-pages .contents img {
    width: 100%;
}

.team-pages .contents h4 {
    font-weight: 400;
    font-size: 16px;
    margin-bottom: 10px;
}


/*blog*/

.blog .contents {
    background: #ffffff;
    margin-bottom: 30px;
}

.blog .contents img {
    width: 100%;
}

.blog .contents .text {
    padding: 15px 0 0;
}

.blog .contents .text i {
    margin-right: 8px;
}

.blog .pagination ul {
    margin-bottom: 0;
}


/*blog single*/

.blog-single .contents {
    background: #ffffff;
    margin-bottom: 20px;
}

.blog-single .contents img {
    width: 100%;
}

.blog-single .contents .text {
    padding: 15px 0 0;
}

.blog-single .contents .text i {
    margin-right: 8px;
}

.blog-single .share-button h6 {
    margin-bottom: 10px;
}

.blog-single .share-button {
    padding: 17px 0;
    background-color: #fff;
    margin-bottom: 20px;
    padding-top: 0;
}

.blog-single .share-button ul {
    padding: 0;
    margin: 0;
}

.blog-single .share-button ul li {
    list-style: none;
    display: inline-block;
    margin-right: 10px;
}

.blog-single .share-button ul li:last-child {
    margin-right: 0;
}

.blog-single .share-button ul li a i {
    font-size: 16px;
    width: 30px;
    height: 30px;
    border-radius: 2px;
    line-height: 30px;
    color: #fff;
    padding: 0 8px;
}

.blog-single .share-button ul li a .fa-facebook {
    background: #3b5999;
}

.blog-single .share-button ul li a .fa-twitter {
    background: #55acee;
}

.blog-single .share-button ul li a .fa-instagram {
    background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
}

.blog-single .share-button ul li a .fa-google {
    background: #dd4b39;
}

.blog-single .author {
    margin-bottom: 20px;
    padding: 20px 0;
    border-width: 1px 0;
    border-color: #ddd;
    border-style: solid;
}

.blog-single .author .image img {
    width: 60px;
    float: left;
    margin-right: 10px;
}

.blog-single .author .text {
    overflow: hidden;
}

.blog-single .author .text .social-link ul {
    padding: 0;
    margin: 0;
}

.blog-single .author .text .social-link ul li {
    list-style: none;
    display: inline-block;
    margin-right: 10px;
}

.blog-single .author .text .social-link ul li:last-child {
    margin-right: 0;
}

.blog-single .author .text .social-link ul li a {
    color: #666;
}

.blog-single .blog-comment {
    margin-top: 20px;
    margin-bottom: 20px;
}

.blog-single .blog-comment h5 {
    margin-bottom: 15px;
}

.blog-single .blog-comment .image img {
    float: left;
    width: 40px;
    margin-right: 10px;
}

.blog-single .blog-comment .text {
    overflow: hidden;
}

.blog-single .blog-comment .text .comment {
    color: #333;
    font-size: 14px;
}

.blog-single .blog-comment .reply {
    margin-left: 50px;
    margin-top: 10px;
}

.blog-single .blog-comment .collapsible {
    box-shadow: none;
    border: 0;
}

.blog-single .blog-comment .collapsible .collapsible-header {
    padding: 0;
    background-color: transparent;
    border: 0;
    color: #666;
}

.blog-single .blog-comment .collapsible .collapsible-header i {
    vertical-align: middle;
    margin-right: 0;
    font-size: 20px;
}

.blog-single .blog-comment .collapsible .collapsible-body {
    border: 0;
    padding: 0;
    margin-top: 10px;
}

.blog-single .blog-comment .collapsible .collapsible-body .image img {
    width: 30px;
}

.blog-single .blog-comment .content .text .date {
    margin-bottom: 0;
}

.blog-single .blog-comment .content .text .date i {
    margin: 0 8px;
    font-size: 6px;
    vertical-align: middle;
    color: #999;
}

.blog-single .comment-post {
    margin-top: 20px;
}

.blog-single .comment-post .button {
    margin-bottom: 0;
}

.blog-single .comment-post .comment-title {
    margin-bottom: 15px;
}


/*collapse*/

.collapse .collapsible-header i {
    margin-top: 4px;
    font-size: 1rem;
    margin-right: 0;
}

.collapse .collapse .collapsible-body {
    background-color: #fff;
    padding: 1rem;
}


/*calendar*/

.calendar-head {
    text-align: center;
    background: #7dbc6c;
    color: #fff;
    padding: 15px 0;
    margin-bottom: 20px;
}

.calendar-head i {
    cursor: pointer;
}

.calendar-head h5 {
    color: #fff;
}

.calendar-head .row {
    margin-bottom: 0;
}

.calendar th,
.calendar td {
    text-align: center;
}

.calendar .active {
    background: #7dbc6c;
    color: #fff;
}

.calendar table {
    background: #fff;
}


/*card*/

.card .card-content {
    padding: 13px 15px;
}

.card .card-content h5 {
    margin-bottom: 8px;
}

.card .card-content i {
    font-size: 17px;
    cursor: pointer;
}

.card .card-reveal {
    padding: 13px 15px;
}

.card .card-title {
    font-size: 16px;
}

.card .card-reveal i {
    font-size: 17px;
    position: relative;
    top: 0;
}


/*list*/

.list .contents {
    padding: 15px;
    background-color: #fff;
    margin-bottom: 20px;
    border: 1px solid #ddd;
}

.list-img {
    float: left;
    margin-right: 10px;
}

.list-img img {
    width: 60px;
    height: auto;
    border-radius: 50%;
}

.list-text {
    overflow: hidden;
}


/*pagination*/

.pagination .prev i,
.pagination .next i {
    font-size: 22px;
}

.pagination li.disabled a {
    color: #fff;
    background: #7dbc6c;
}

.pagination li.prev a {
    background-color: transparent;
    color: #999;
    padding-left: 0;
    cursor: default;
}


/*pagination variants*/

.basic-pagination ul li {
    margin-right: 6px;
    background-color: #fff;
}

.basic-pagination ul li:last-child {
    margin-right: 6px;
}

.pagination-circle ul li {
    margin-right: 6px;
}

.pagination-circle ul li:last-child {
    margin-right: 0;
}

.pagination-circle ul li a {
    border-radius: 50%;
    background-color: #fff;
}

.section-title.pagination-page {
    text-align: left;
}


/*table*/

.table-contents {
    background: #fff;
    padding: 0 15px 15px;
}


/*tabs*/

.contents-tabs img {
    width: 100%;
    margin-top: 20px;
}

.contents-tabs h4 {
    margin-top: 10px;
}

.tabs .tab a {
    color: #7dbc6c;
}

.tabs .tab a:hover {
    color: #7dbc6c;
}

.tabs .tab a.active {
    color: #7dbc6c;
}

.tabs .indicator {
    background-color: #7dbc6c;
}


/*about*/

.about .content img {
    width: 100%;
}

.about .content h3 {
    margin: 10px 0 5px;
}

.about .social-link {
    border-top: 1px solid #ddd;
    padding-top: 11px;
    margin-bottom: 13px;
}

.about .social-link i {
    margin-right: 5px;
}


/*settings*/

.settings .profile-photo .contents {
    margin-bottom: 14px;
    border-radius: 0.28571429rem;
}

.settings .profile-photo span {
    display: block;
    margin-bottom: 5px;
    color: rgba(0, 0, 0, .87);
    font-size: .92857143em;
    font-weight: 700;
}

.settings .profile-photo img {
    width: 80px;
    height: 80px;
}

.settings .profile-banner .contents {
    margin-bottom: 14px;
    border-radius: 0.28571429rem;
}

.settings .no-mb {
    margin-bottom: 0;
    margin-top: 20px;
}

.settings .profile-banner span {
    display: block;
    margin-bottom: 5px;
    color: rgba(0, 0, 0, .87);
    font-size: .92857143em;
    font-weight: 700;
}

.settings .profile-banner img {
    width: 100%;
}

.settings .button {
    margin-bottom: 15px;
}

.settings input[type="file"]:focus {
    border-color: transparent !important;
}


/*pricing table*/

.pricing-table .row:last-child {
    margin-bottom: 0;
}

.pricing-table .contents {
    padding: 15px 15px 20px;
    background: #fff;
    border: 1px solid #ddd;
}

.pricing-table .contents h4 {
    color: #7dbc6c;
    margin-top: 5px;
}

.pricing-table .contents h4 span {
    font-size: 14px;
    color: #333;
}


/*comment-form*/

.comment-form {
    padding: 0;
}

.comment-form h4 {
    margin-bottom: 15px;
}


/*form*/

form label.active {
    color: #7dbc6c !important;
}

form input {
    border: 1px solid #ccc !important;
    height: 2.5rem !important;
    padding: 0 10px !important;
    box-sizing: border-box !important;
}

form input[type="file"] {
    border: 0 !important;
    padding: 0 !important;
    display: block;
}

form textarea {
    border: 1px solid #ccc !important;
    padding: 10px;
    box-sizing: border-box !important;
    height: 7rem !important;
    font-size: 1rem;
}

form input:focus {
    border: 1px solid #7dbc6c !important;
    box-shadow: none !important;
}

form textarea:focus {
    border: 1px solid #7dbc6c !important;
    box-shadow: none !important;
}

form select {
    border: 1px solid #ccc;
    background-color: transparent;
    border-radius: 0;
    margin-bottom: 20px;
}

form .button {
    margin-top: 20px;
    text-align: center;
}

::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    color: #555;
}

::-moz-placeholder {
    /* Firefox 19+ */
    color: #555;
}

:-ms-input-placeholder {
    /* IE 10+ */
    color: #555;
}

:-moz-placeholder {
    /* Firefox 18- */
    color: #555;
}


/*sign in*/

.sign-in .social-login {
    margin-top: 20px;
}

.sign-in .social-login h5 {
    text-align: center;
    margin-bottom: 10px;
    font-weight: 400;
}

.sign-in .button-facebook {
    background-color: #3b5999;
    box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1);
}

.sign-in .button-twitter {
    background-color: #55acee;
    box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1);
}

.sign-in .button-linkedin {
    background-color: #0077B5;
    box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1);
}

.sign-in .button-google {
    background-color: #dd4b39;
    box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1);
}

.sign-in .signin-contents form .button {
    margin-top: 0;
}


/*sign up*/

.sign-up .social-login {
    margin-top: 20px;
}

.sign-up .social-login h5 {
    text-align: center;
    margin-bottom: 10px;
    font-weight: 400;
}

.sign-up .button-facebook {
    background-color: #3b5999;
    box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1);
}

.sign-up .button-twitter {
    background-color: #55acee;
    box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1);
}

.sign-up .button-linkedin {
    background-color: #0077B5;
    box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1);
}

.sign-up .button-google {
    background-color: #dd4b39;
    box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1);
}

.sign-up .signup-contents form .button {
    margin-top: 0;
}


/*contact*/

.contact .contact-contents form textarea {
    margin-bottom: 0;
}

.contact .contact-contents .button {
    margin-bottom: 15px;
}


/*page not found*/

.page-not-found {
    text-align: center;
    padding: 15px;
    background-color: #fff;
}

.page-not-found a {
    color: #333;
}

.page-not-found h2 {
    font-size: 120px;
}

.page-not-found h4 {
    font-size: 30px;
    margin-bottom: 18px;
}

.page-not-found ul {
    padding: 0;
    margin: 0;
}

.page-not-found ul li {
    list-style: none;
    display: inline-block;
    margin: 0 6px;
}

.page-not-found ul li a i {
    margin-right: 3px;
}


/*footer*/

footer {
    padding: 20px 0 8px;
    text-align: center;
}

footer img {
    margin-bottom: 20px;
}

footer ul {
    padding: 0;
    margin: 0;
    border-bottom: 1px solid #ddd;
    padding-bottom: 20px;
    margin-bottom: 18px;
}

footer ul li {
    display: inline-block;
    margin: 2px 4px;
}

footer ul li a i {
    width: 35px;
    height: 35px;
    line-height: 32px !important;
    border-radius: 2px;
    color: #555;
    border: 2px solid #999;
}