Gecko [ myeducation.co.th ]

Name	Size	Permission
_banner.scss	1.64 KB	-rwxr-xr-x
_blog.scss	16.97 KB	-rwxr-xr-x
_button.scss	4.21 KB	-rwxr-xr-x
_contact.scss	4.01 KB	-rwxr-xr-x
_counter.scss	627 B	-rwxr-xr-x
_feature.scss	3.84 KB	-rwxr-xr-x
_footer.scss	3.27 KB	-rwxr-xr-x
_header.scss	7.88 KB	-rwxr-xr-x
_portfolio.scss	14.81 KB	-rwxr-xr-x
_predefin.scss	5.23 KB	-rwxr-xr-x
_service.scss	10.25 KB	-rwxr-xr-x
_slider.scss	6.93 KB	-rwxr-xr-x
_team.scss	7.47 KB	-rwxr-xr-x
_variables.scss	857 B	-rwxr-xr-x
style.scss	2.86 KB	-rwxr-xr-x

Code Editor : _header.scss

/* Header area css
============================================================================================ */
.main_header_area{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    z-index: 25;
    & + section,& + div,& + .row{ 
        margin-top: 152px;
    }
	&.navbar_fixed{
		.main_menu_area{
			position: fixed;
			width: 100%;
			top: -70px;
			left: 0;
			right: 0;
			background: #fff;  
			transform: translateY(70px);
			transition: transform 500ms ease, background 500ms ease;
			-webkit-transition: transform 500ms ease, background 500ms ease;
			box-shadow: 0px 3px 16px 0px rgba(0, 0, 0, 0.1);
			z-index: 999;
			.navbar.navbar-default{
				.nav.navbar-nav.navbar-right{
					li{
						a{
							color: $dip;
						}
						&.active{
							a{
								color: $baseColor;
							}
						}
					}
				}
			}
		}
	}
}
.header_top_area{
    background: #1e2126;
    .pull-left{
        a{
            font-size: 13px;
            font-family: $open;
            color: $dw;
            line-height: 50px;
            margin-right: 60px;
            position: relative;
            display: inline-block;
            &:before{
                content: "";
                background: #333;
                width: 1px;
                position: absolute;
                left: -30px;
                top: -1px;
                height: 100%;
            }
            i{
                font-size: 20px;
                color: $dw;
                padding-right: 10px;
            }
            &:first-child{
                margin-left: 40px;
                &:before{
                    left: -40px;
                }
            }
            &:last-child{
                margin-right: 0px;
                &:after{
                    content: "";
                    background: #333;
                    width: 1px;
                    position: absolute;
                    right: -30px;
                    top: -1px;
                    height: 100%;
                }
            }
        }
    }
}
.header_social{
    li{
        display: inline-block;
        margin-right: 20px;
        a{
            font-size: 14px;
            color: $dw;
            line-height: 50px;
            @include transition;
        }
        &:last-child{
            margin-right: 0px;
        }
        &:hover{
            a{
                color: #00aced;
            }
        }
    }
}

.main_menu_area{
    background: #fff;
	z-index: 30;
    .navbar.navbar-default{
        background: transparent;
        margin-bottom: 0px;
        border: none;
        .navbar-header{
            .navbar-brand{
                line-height: 97px;
                display: inline-block;
                padding: 0px;
                img{
                    line-height: 40px;
                    display: inline-block;
					& + img{
						display: none;
					}
                }
            }
        }    
        .nav.navbar-nav.navbar-right{
            li{
                margin-right: 28px;
                a{
                    padding: 0px;
                    font-size: 14px;
                    font-family: $mon;
                    font-weight: bold;
                    text-transform: uppercase;
                    color: $dip;
                    line-height: 100px;
                    @include transition;
                    background: transparent;
                }
                &.icon_search{
                    margin-right: 0px;
                    a{
                        position: relative;
                        &:before{
                            content: "02";
                            background: $baseColor;
                            height: 20px;
                            width: 20px;
                            border-radius: 50%;
                            color: #fff;
                            font-size: 10px;
                            position: absolute;
                            right: -14px;
                            top: 40%;
                            line-height: 21px;
                            transform: translateY(-50%);
                            font-weight: normal;
                            text-align: center;
                        }
                    }
                }
                &:hover, &.active{
                    a{
                        color: $baseColor;
                    }
                }
                &.submenu{
                    position: relative;
                    .dropdown-menu{
                        @media (min-width: 992px){
                            position: absolute;
                            top: 100%;
                            left: -40px;
                            min-width: 232px;
                            background: #eeeeee;
                            text-align: left;
                            opacity: 0;
                            transition: all 300ms ease-in;
                            visibility: hidden;
							display: block;
							padding: 0px;
							border: none;
							border-radius: 0px;
                        }
                        &:before{
                            content: "";
                            width: 0;
                            height: 0;
                            border-style: solid;
                            border-width: 10px 10px 0 10px;
                            border-color: #eeeeee transparent transparent transparent;
                            position: absolute;
                            right: 24px;
                            top: 45px;
                            z-index: 3;
                            opacity: 0;
                            transition: all 400ms linear;
                        }
                        li{
                            display: block;
                            float: none;
                            margin-right: 0px;
                            border-bottom: 1px solid #cbcbcb;
                            a{
                                line-height: 45px;
                                color: #494848;
                                font-family: $mon;
                                font-weight: normal;
                                font-size: 16px;
                                padding: 0px 30px;
                                text-transform: capitalize;
                                @include transition;
                                display: block;
                            }
                            &:last-child{
                                border-bottom: none;
                            }
                            &:hover{
                                a{
                                    background: $baseColor;
                                    color: #fff;
                                }
                            }    
                        }
                    }
                    &:hover{
                        .dropdown-menu{
                            @media (min-width: 992px){
                                left: 0px;
                                visibility: visible;
                                opacity: 1;
                            }
                        }
                    }
                }
            }
        }
    }
}
.transparent_menu{
    .main_menu_area{
        background: transparent;
        .navbar.navbar-default{
            border-bottom: 1px solid rgba(186, 186, 186, .40);
            border-radius: 0px;
            .nav.navbar-nav.navbar-right{
                li{
                    a{
                        color: #fff;
                    }
                    &:hover, &.active{
                       > a{
                            color: $baseColor;
                        }
                    }
                }
            }
        }
    }
    & + section,& + div,& + .row{ 
        margin-top: 0px;
    }
}
/* End Header area css
============================================================================================ */

${this.title}

Code Editor : _header.scss