/* 
    Document    : moodycrab
    Created on  : 08-04-2014, 09:22:16
    Author      : Mr. Truong Khuong
    Phone       : 0985 747 240
    Email       : Khuongxuantruong@gmail.com
    Skype       : Khuongxuantruong
*/
@font-face {
    font-family: missiongothiclight;
    src: url("font/missiongothiclight.ttf"); /* EOT for IE */
}
@font-face {
    font-family: missiongothicregular;
    src: url("font/missiongothicregular.ttf"); /* TTF for CSS3 */
}

@font-face {
    font-family: seguisb;
    src: url("font/seguisb.ttf"); /* TTF for CSS3 */
}
@font-face {
    font-family: AGENCYB;
    src: url("font/AGENCYB.TTF"); /* TTF for CSS3 */
}
a,a:hover{color: inherit}
body{background:#f5f5f5;color: #58585b;border:15px solid #fff}
.navbar-toggle{border: 1px solid #ebebeb;margin-right:0}
.navbar-toggle .icon-bar{background: #333;}
.input-group-addon{padding: 6px 20px;background-color: inherit;}
::-webkit-scrollbar-track:hover{-webkit-box-shadow:inset 0 0 1px #000}
::-webkit-scrollbar-thumb:hover{-background:#1b1b1b}
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-track{border-left-color:#434343;background:#333;-webkit-box-shadow:inset 0 0 1px #434343}
::-webkit-scrollbar-thumb{border-left-color:#8e8e8e;background:#555}
.clear {clear: both;}
.btn{border: 0}
.nailthumb{position:relative}
.nailthumb-figure{position:relative;width:100%;padding-bottom:56%;height: 0;overflow: hidden}
.nailthumb-container{position:absolute;width:100%;height:100%;background:url(../../images/process.gif) no-repeat center;overflow:hidden}
.nailthumb-mark{position:absolute;width:100%;height:100%;background:rgba(255,255,255,.3);top:-100%;transition: all .5s ease-in-out; -moz-transition: all .5s ease-in-out; -webkit-transition: all .5s ease-in-out;}
.nailthumb:hover .nailthumb-mark{top:0%}
.nailthumb .nailthumb-figure{padding-bottom: 75%}
.nailthumb .nailthumb-figure.square{padding-bottom: 100%}
.nailthumb .nailthumb-figure img{width: 100%;height: 100%;position: absolute;}
.nailthumb .nailthumb-figure img.lazy{width: auto;height: auto}
.logo{position: absolute;left: 50%;top: 50px;margin-left: -140px;width: 240px;} 
.slogan{font-size: 50px;font-family: 'AGENCYB';line-height: 72px;text-align: center;font-weight: bold;padding: 60px;}
.square-item{padding-top: 5px;padding-bottom: 5px;padding-left:5px;padding-right:5px}
.square-item .nailthumb{padding:10px}
.work-item{padding: 30px 0;}
.work-item>div{ text-align: center}
.work-item>div .nailthumb{max-width: 250px;margin: 0 auto;padding: 10px;border: 1px solid #e3e3e3;box-shadow: 0 0 10px #e3e3e3}
.work-item h3{text-align: center;font-family: 'missiongothicregular';font-size: 24px;line-height: 68px;margin: 0;padding: 0}
.work-item button{border-radius: 0;font-family: 'missiongothicregular';font-size: 18px;}
.pro-btn{min-width: 135px;margin-top: 40px;padding-top: 135px;background: url(images/ico1.png) no-repeat top center;text-align: center;font-family: 'missiongothiclight';font-size: 24px;line-height: 56px;padding-bottom: 28px;}
.let-btn{min-width: 135px;margin-top: 40px;padding-top: 135px;background: url(images/ico2.png) no-repeat top center;text-align: center;font-family: 'missiongothiclight';font-size: 24px;line-height: 56px;}
.con-btn{min-width: 135px;margin-top: 40px;padding-top: 135px;background: url(images/ico3.png) no-repeat top center;text-align: center;font-family: 'missiongothiclight';font-size: 24px;line-height: 56px;}
.btl{background:url(images/btl.png) no-repeat  top left}
.btr{background:url(images/btr.png) no-repeat  top right}
.bbl{background:url(images/bbl.png) no-repeat  bottom left}
.bbr{background:url(images/bbr.png) no-repeat  bottom right}
.foot h3{font-family:'missiongothicregular';font-size:24px;line-height:72px}
.foot p{line-height:46px;padding:0;margin:0;font-family: 'missiongothiclight';font-size: 24px;}
.form-contact>div{padding-top:5px;padding-bottom:5px}
.foot .form-contact *,input.form-control,textarea.form-control{border-radius:0}
input.form-control,textarea.form-control{height: 36px;
font-family: 'missiongothiclight';
font-size: 18px;}
.foot input,input{height:36px;font-family: 'missiongothiclight';font-size: 18px;}
.foot .btn,.btn{height:36px;font-family: 'missiongothiclight';font-size: 18px;padding-left: 20px;padding-right: 20px;background-color: #58585b;color: #fff;border-radius: 0}
.foot .btn.btn-danger,.btn.btn-danger{background: #f33e38}
.foot textarea,textarea{height:82px;font-family: 'missiongothiclight';font-size: 18px;}
.foot p span{color:#ee4034;padding-right:12px;float:left;}
.copyright{text-align:center;line-height:100px;font-family: 'missiongothiclight';font-size: 21px;}
.notice {
font-family: 'missiongothiclight';
font-size: 18px;
text-align: center;
display: block;
max-width: 820px;
margin: 0 auto;
white-space: pre-wrap;
white-space: -moz-pre-wrap;
white-space: -pre-wrap;
white-space: -o-pre-wrap;
word-wrap: break-word;
}.about-title{font-family: 'missiongothiclight';font-size: 40px;text-align: center;line-height: 40px;padding: 60px 0}
.about-item{padding-bottom: 20px;min-height: 480px}
.about-item>div .nailthumb{max-width: 136px;margin: 0 auto;padding: 0px;}
.about-item h3{text-align: center;font-family: 'missiongothicregular';font-size: 24px;line-height: 40px;margin: 0;padding: 0;color:#ee4034;padding: 20px;}
.about-item p{text-align: center;font-size: 18px;font-family: 'missiongothiclight'}
.about-item button{border-radius: 0;font-family: 'missiongothicregular';font-size: 18px;background-color: #a4c3c5;color: #fff;margin: 12px 0}
.project-content{padding-left: 0%;font-size: 18px;font-family: 'missiongothiclight';}
.project-image{padding-right: 10%;position: relative;font-size: 18px;
font-family: 'missiongothiclight';
text-align: center;
line-height: 32px; }
.project-image img{width: 100%}
.project-title{font-size: 24px;font-family: 'missiongothiclight';}
.map img{width: 100%;border: 1px solid #ccc}
.socials img{margin-right: 20px;margin-top: 20px;cursor:pointer}
.note-image{font-size: 18px;font-family: 'missiongothiclight';text-align: center;line-height: 32px;padding: 20px 0;}
.note-image span{color: #ee4034}
.nav-item{padding-bottom: 60px;padding-top: 60px}
.nav-item>div .nailthumb{max-width: 136px;margin: 0 auto;padding: 0px;}
.nav-item h3{text-align: center;font-family: 'missiongothicregular';font-size: 24px;line-height: 40px;margin: 0;padding: 0;padding: 20px 0 12px 0;}
.five-cols .nav-item h3{color: #ee4034}
.nav-item h4{text-align: center;font-weight: normal;margin: 0;font-size: 16px;font-family: 'missiongothicregular';}
.nav-item p{text-align: center;font-size: 18px;font-family: 'missiongothiclight'}
.nav-item a:hover{text-decoration:none}
.project-planner .btn.btn-block{background: #b3b3b3;height: 36px;height: 50px;margin-bottom: 20px}
.project-planner .btn.btn-block.active{background:#08A01A;color:#fff}
.project-planner .btn.btn-block.btn-danger{background: #c73329;height: 36px;height: 50px;margin-bottom: 20px}
div.erb,.formErrorContent{margin:0;padding:0;color:red}
input.erb,textarea.erb{border-color:red}
.container{width:auto !important;max-width:1280px}
@media (min-width: 768px){
    
    
    .navbar-nav>li>a{
        padding: 0;padding-top: 28px;text-align: center;color: #58585b;line-height: 56px;border-bottom: 1px solid #b3b3b3;
        font-family: 'missiongothiclight';font-size: 24px;
    }
    .bs-docs-nav .navbar-nav>li.active>a,.bs-docs-nav .navbar-nav>li>a:hover, .bs-docs-nav .navbar-nav>.active>a:hover, .nav .open > a:hover{
        background-color: #f33e38;border-bottom: 1px solid #f33e38;color: #fff;
    }
    .navbar-nav.navbar-right:last-child {
        margin-right: 0px;
    }
}
@media (max-width: 767px){
    
    
    .navbar-nav>li{
        width: auto
    }
    .navbar-nav.navbar-right>li{
        width: auto
    }
}

@media (min-width: 992px){
	.navbar-nav>li{
        width: 168px;margin-right: 30px;padding: 0px 8px 14px 8px;
    }
    .navbar-nav.navbar-right>li{
        width: 168px;margin-right: 0;margin-left: 30px
    }
    .five-cols .col-md-3 {
        width: 20%;
    }
	.work-padding{padding-bottom:120px}
}

@media (max-width: 991px){
    .project-image{padding-right: 0%}
	.navbar-nav>li{
        width: 132px;margin-right: 8px;padding: 0px 8px 14px 8px;
    }
    .navbar-nav.navbar-right>li{
        width: 132px;margin-right: 0;margin-left: 8px
    }
	.logo {
margin-left: -80px;
width: 160px;
	}
	.slogan{font-size: 30px;line-height: 50px;padding: 40px;}
	.nav-item{padding-top:15px;padding-bottom:15px;}
	.work-padding{padding-bottom:20px}
}
@media (min-width: 1280px){
	body{}
	.navbar-nav>li{
        padding: 0px 8px 14px 8px;
    }
	body{border: 25px solid #fff;}
    .navbar-nav.navbar-right>li{
        margin-left: 50px
    }
	.navbar-nav>li>a {
	padding-top: 55px;
    }
}