body { position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; margin: 0; -ms-overflow-style: scrollbar; font-family: Microsoft JhengHei, Arial !important; } /* #LiAdvertising{ position:fixed; z-index: 2001; width:400px; max-width:100%; top:50%; left:50%; margin-left: -200px; margin-top: -285px; display:none; } #LiAdvertising .closeicon{ width:50px; position:absolute; right:0; margin:5px; cursor:pointer; }*/ #LiFullbg{ position:fixed; width:100%; height:100%; background:url(../img/fullbg.png); z-index:2000; display:none; } #LiFullbg .loading{ width:50px; height:50px; position:absolute; left:50%; top:50%; margin-top:-50px; margin-left:-25px; } @font-face { font-family: 'Glyphicons Halflings'; src: url('../fonts/glyphicons-halflings-regular.eot'); src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons-halflingsregular') format('svg'); } #LiLogoutForm{ display:none; } .PopUpformSection { margin: 50px auto 0 auto; max-width: 340px; } .FBSignIn { width: 100%; padding: 12px 15px; background-color: #344e86; border: 0px; color: #fff; text-decoration: none; text-align: left; font-size: 16px; margin-bottom: 10px; } .FBSignIn a, .FBSignIn a:hover { text-decoration: none; color: #fff; } .FBSignIn:hover { background-color: #224799; } .FBSignIn img, .GoogleSignIn img { width: 25px; height: auto; margin-right: 10px; } .GoogleSignIn { width: 100%; padding: 12px 15px; background-color: #f1f1f1; border: 1px solid #eaeaea; color: #de4b39; text-decoration: none; text-align: left; font-size: 16px; } .GoogleSignIn a, .GoogleSignIn a:hover { text-decoration: none; color: #de4b39; } .GoogleSignIn:hover { background-color: #e3e3e3; } .OR { text-align: center; padding: 10px; font-size: 12px; color: #d0d0d0; } .SignUpSubmit { width: 100%; padding: 12px; background-color: #4789cf; text-decoration: none; color: #fff; border: 0; font-size: 18px; } .AgreeTerms { text-align: center; line-height: 150%; font-size: 14px; } .AgreeTerms a, .AgreeTerms a:hover, .modal-footer a, .modal-footer a:hover { text-decoration: none; } .ForgotPW { width: 100%; background-color: #fff; text-align: center; } #LogInFooter { font-size: 14px; line-height: 180%; } .BeginSTD, .BeginTutor { border-radius: 5px; border: 1px; display: inline-block; cursor: pointer; color: #ffffff; font-size: 16px; padding: 15px; width: 250px; text-decoration: none; margin: 0 20px 40px 20px; } .BeginSTD { background-color: #1bbc9b; } .BeginTutor { background-color: #3399db; } .BeginSTD:hover, .BeginTutor:hover { text-decoration: none; color: #fff; } .BeginSTD:hover { background-color: #089074; } .BeginTutor:hover { background-color: #045c97; } .SearchBox { margin: 0 auto; background-color: rgba(255, 255, 255, 0.6); width: 400px; padding: 10px 5px; border-radius: 5px; border: 1px; } .SearchBox input { width: 85%; padding: 10px; color: #a9a9a9; box-sizing: border-box; border-top-left-radius: 5px; border-bottom-left-radius: 5px; border: 1px; } .searchBT { margin-left: -5px; background-color: #c11c2c; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border: 1px; display: inline-block; cursor: pointer; color: #ffffff; font-family: Arial; font-size: 14px; padding: 11px 15px; text-decoration: none; } .HowItWorks { margin: 30px 0; font-family: "Microsoft Yahei"; } #IntroParagh { text-align: center; color: #333333; } .BigTitle { font-size: 36px; font-weight: bold; } .redThickBorder hr { width: 35px; border: none; height: 7px; color: #c11c2c; background-color: #c11c2c; margin: 15px auto 0 auto; } .IntroContent { margin: 15px auto 20px auto; line-height: 160%; width: 70%; font-size: 16px; } .StudentVersion { width: 100%; text-align: right; } #PhoneImg img { width: 100%; height: auto; } .HIWHead { padding-right: 10px; font-size: 22px; font-weight: bold; padding-bottom: 5px; border-bottom: 0; margin-bottom: 10px; } .STRow, .TTRow { min-height: 100px; float: left; width: 100%; margin: 10px 0; } .HIWText, .HIWImg { float: left; } .HIWText { width: 75%; padding: 0 10px 0 0; font-size: 16px; } .HIWImg { width: 25%; } .HIWImg img { max-width: 80px; width: 100%; height: auto; } h11 { font-size: 22px; font-weight: bold; } @media (max-width: 1199px) { #PhoneImgSection { display: none; } } @media ( max-width: 767px ) { #PhoneImgSection { display: none; } .StudentVersion { text-align: left; } .HIWImg { float: left; } .HIWText { float: right; } .HIWHead { border-bottom: 2px solid #c11c2c; } } #LearnSection { width: 100%; height: auto; padding: 50px 0; background: url(../img/home/SectionIIBK.jpg); background-size: cover; } #LearnOption { margin: 20px 0; } .Title img { margin-top: -5px; } .Title { font-size: 22px; color: #454545; } .MusicOption { margin: 30px 0; } .hovereffect { width: 100%; height: 100%; float: left; overflow: hidden; position: relative; text-align: center; cursor: default; background: #c11c2c; } .hovereffect .overlay { width: 100%; height: 100%; position: absolute; overflow: hidden; top: 0; left: 0; padding: 50px 20px; } .hovereffect img { display: block; position: relative; max-width: none; width: calc(100% + 20px); -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); -webkit-backface-visibility: hidden; backface-visibility: hidden; } .hovereffect:hover img { opacity: 0.4; filter: alpha(opacity=40); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .hovereffect h2 { text-transform: uppercase; color: #fff; text-align: center; position: relative; font-size: 20px; overflow: hidden; padding: 1em 0; background-color: transparent; text-shadow: 2px 2px 2px #1d1d1d; } .hovereffect h2:after { position: absolute; bottom: 0; left: 0; width: 100%; height: 2px; background: #fff; content: ''; -webkit-transition: -webkit-transform 0.35s; transition: transform 0.35s; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } .hovereffect:hover h2:after { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .hovereffect a, .hovereffect p { color: #FFF; opacity: 0; filter: alpha(opacity=0); -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } .hovereffect:hover a, .hovereffect:hover p { opacity: 1; filter: alpha(opacity=100); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .overlay a:hover { font-size: 14px; color: #fff; text-decoration: none; } .MusicTitle a { opacity: 1; } @media (min-width: 500px) and (max-width: 767px ) { .MusicTitle h2 { font-size: 36px; opacity: 1; } } @media (min-width: 767px) and (max-width: 992px ) { .carousel-control { visibility: visible; } .carousel-inner .active.left { left: -50%; } .carousel-inner .next { left: 50%; } .carousel-inner .prev { left: -50%; } .active > div { display: none; } .active > div:first-child { display: block; } .active > div:first-child + div { display: block; } } @media (min-width: 992px ) { .carousel-inner .active.left { left: -25%; } .carousel-inner .next { left: 25%; } .carousel-inner .prev { left: -25%; } } .RecommendSection { width: 100%; height: auto; padding: 50px 0; background: url(../img/home/SectionIIIBK.jpg); background-size: cover; } .PopulatCourse { margin-top: 25px; width: 100%; background-color: #fff; line-height: 140%; text-align: center; border: 1px solid #dddddd; } .PopulatCourse img { width: 100%; height: auto; } .PopulatCourse hr { width: 90%; display: block; height: 2px; border: 0; border-top: 2px solid #272727; } .RecommendTutor { font-size: 16px; line-height: 150%; } .MoreBTN { background-color: #c11c2c; display: inline-block; cursor: pointer; color: #ffffff; font-size: 14px; width: 100%; padding: 10px 30px; text-decoration: none; margin-top: 20px; } .MoreBTN:hover { background-color: #8e0311; text-decoration: none; color: #fff; } .BackToTop { font-size: 14px; width: 150px; background-color: #c11c2c; padding: 8px 16px; color: #fff; border-top-left-radius: 8px; border-top-right-radius: 8px; } .footer { background-color: #272727; color: #fff; padding: 30px 0; } .FTDescription, .FTEmailSub, .FTDirectLink, .ContactInfo { padding: 10px; text-align: left; height: auto; min-height: 200px; } .locationIcon, .locationaddress { float: left; } .locationaddress { width: 94%; padding-left: 10px; font-size: 12px; } .FTTitle { text-align: left; font-size: 16px; color: #fff; font-weight: bold; } .EmailInputBox input { margin-top: 5px; width: 100%; padding: 8px; color: #797979; background-color: #000000; border: 1px; } .EmailSubBT { margin-top: 20px; color: #ffffff; font-size: 14px; background: #c11c2c; padding: 5px 10px 5px 10px; text-decoration: none; border: 0; } .EmailSubBT:hover { background: #8e0311; text-decoration: none; } .Links { line-height: 200%; } .detail { margin: 10px 0 10px 0; font-size: 12px; color: #fff; width: 100%; float: left; } .FooterBlack { background-color: #000000; color: #fff; padding: 10px; } .CopyRight { float: left; font-size: 12px; } .SocialMedia { word-spacing: 20px; float: right; } .SocialMedia img { height: 15px; width: auto; } @media (max-width: 767px) { .BookBT { width: 100%; margin-bottom: 50px; } } /* ========================================= Tutor Sign Up =========================================== */ .formSection { width: 100%; margin-top: 90px; height: auto; background-image: url('../img/signup/signupBG.jpg'); background-size: cover; background-repeat: none; background-position: center center; font-family: "Microsoft Yahei"; } .SignUpNotice { width: 100%; padding: 10px 0; background-color: #c0e2f3; text-align: center; font-size: 14px; font-weight: 300; } .AllSteps { width: 100%; margin-top: 110px; height: auto; text-align: center; text-decoration: none; } .AllSteps a:hover { text-decoration: none; } .StepTitle { color: #000000; font-size: 16px; margin: 0px 20px; } #LinkUnderline { color: #c11c2c; border-bottom: 2px solid #c11c2c; padding-bottom: 5px; } .TutorForm { margin: 30px auto 50px auto; max-width: 800px; height: auto; padding: 20px; background-color: #fff; box-shadow: 0 2px 8px 1px #9e9e9e; } .FormHeading { float: left; width: 100%; text-align: center; font-size: 22px; color: #000000; margin: 10px 0 30px 0; } .AddPhoto { float: left; width: 100%; margin: 10px 0 30px 0; } .BoxTitle { margin: 2px 0; font-size: 16px; font-weight: bold; } .ProfileImg { margin-right: 50px; float: left; } .ProfileImg img { width: 100px; height: auto; border: 1px solid #9e9e9e; } .InsertPic { float: left; margin-top: 35px; } .HalfLeft, .HalfRight { float: left; width: 48%; margin: 15px 0; padding: 0; } .HalfLeft { margin-right: 4%; } .ContainThreeDiv { float: left; width: 100%; margin-right: 15px 0; } .textareaStyle { width: 100%; height: 150px; padding: 5px; resize: none; } .InputDataII { float: left; margin: 15px 0; width: 30%; margin-right: 3%; } .InputDataIII { float: left; text-align: left; margin: 15px 0; width: 100%; } .inputFill { margin: 5px 0; width: 100%; padding: 5px 10px; font-size: 14px; border-radius: 3px; border: 1px solid #c0c0c0; } .BirthMonth, .BirthYear, .Region, .Expreience { margin: 5px 0; padding: 5px; } .BirthYear { margin-left: 15px; } .Region, .Expreience { width: 100%; } #uploadSectionBTN { background-color: #c11c2c; border: 0; font-size: 16px; color: #fff; padding: 2px 5px; width: 25px; } .InstrumentExpSection { float: left; width: 100%; } .uploadSection, .InstrumentExpSection { margin: 10px 0 5px 0; } .submitBTN { padding: 10px; width: 100%; color: #fff; background-color: #c11c2c; border: 0px; } .HongKongArea { margin: 15px 0; } .HongKongArea > .nav > li > a { position: relative; color: #000000; display: block; padding: 10px 15px; border: 1px solid #c0c0c0; border-radius: 3px; } .HongKongArea > .nav > li > a:focus, .HongKongArea > .nav > li > a:hover { text-decoration: none; background-color: #fff; border: 1px solid #000000; } .dropdown-menu.multi-column { width: 100%; } .InputDataIII .dropdown-menu, .HalfRight .dropdown-menu, .ExpectAges .dropdown-menu { width: 100%; } .dropdown-menu.multi-column .dropdown-menu { display: block !important; position: static !important; margin: 0 !important; border: none !important; box-shadow: none !important; } .InstrumentExp { float: left; margin-right: 4%; width: 150px; } .Expection { position: relative; float: left; width: 100%; } .ExpectAges { float: left; width: 100%; margin: 15px 0; padding: 0; } .TabSection { margin: 20px 0 50px 0; width: 100%; float: left; } #myTab { margin-top: 10px; } .tab-content { padding: 15px 0; } .ChargeTable { float: left; margin: 20px 0; width: 100%; display: inline; } .inputPrice { width: 80%; padding: 5px 10px; border-radius: 3px; border: 1px solid #c0c0c0; } .AdditionalCharge { float: left; margin: 15px 0; width: 100%; } .ChargeArea { float: left; margin-right: 4%; margin-top: 5px; width: 135px; } .inputCharge { float: right; width: 70px; padding: 3px 10px; border-radius: 3px; border: 1px solid #c0c0c0; } .VerifyHeading { float: left; font-size: 16px; } .SocialNetwork { float: left; margin: 10px 0; width: 100%; padding: 10px; background-color: #ededed; } .SocialSet { float: left; width: 100%; background-color: #fff; padding: 10px; } .SocialSet img { width: auto; height: 25px; margin-right: 8px; } .SocialLeft, .SocialRight { float: left; width: 48%; } .SocialLeft { font-size: 16px; margin-right: 4%; } .SocialSend { padding: 8px 20px; color: #fff; background-color: #a9a9a9; border: 1px; border-radius: 3px; } .SocialSend:hover { background-color: #c11c2c; } /* ========================================= Category =========================================== */ .Categoryheader { background-repeat: none; background-attachment: scroll; background-position: center center; -webkit-background-size: cover; -moz-background-size: cover; background-size: cover; -o-background-size: cover; text-align: center; color: #fff; background-image: url(../img/tutor/PianoBK.jpg); height: 35%; min-height: 300px; } .BannerBigFont { margin-top: 140px; font-size: 36px; font-weight: bold; color: #fff; letter-spacing: 0px; } .weFound { margin-top: 26px; font-size: 16px; color: #fff; font-weight: bold; } .GreyBackground { background-color: #f7f8f9; width: 100%; height: auto; padding: 30px 0; } #Sorting2 { background-color: #fff; padding: 15px; border: 1px solid #dddddd; margin-bottom:10px; } #Sorting2 .line{ margin-top:20px; margin-bottom:15px; border-top:1px solid #eeeeec; border-bottom:1px solid #f8cecf; } #Sorting2 .tutormateBTN{ width:100%; padding: 10px 16px; background-color: #214f9d; border: 0px; font-size: 14px; color: #fff; line-height: 100%; } #Sorting { background-color: #fff; padding: 15px; border: 1px solid #dddddd; } h12 { font-size: 15px; font-weight: bold; } .SelectBox { width: 100%; margin: 5px 0; padding: 8px; border-radius: 3px; } .SelectBox option { color: #525252; } #Sorting hr { color: #ffcfcf; background-color: #ffcfcf; height: 1px; margin: 5px 0 12px 0; } .rangeBar { margin: 10px 0; } .searchable-container label.btn-default.active { background-color: #d80000; color: #FFF; border: 1px solid #d80000; } .searchable-container label.btn-default { width: 100%; border: 1px solid #efefef; margin: 3px; background-color: #efefef; color: #b5b5b5; } .searchable-container .btn-group { width: 100% } .searchable-container .btn span.glyphicon { opacity: 0; } .searchable-container .btn.active span.glyphicon { opacity: 1; } #TickIcon { float: left; margin-top: 9px; } .ResetFilter button { background-color: #fff; color: #d80000; border: 0px; } .Tutor { margin-bottom: 25px; width: 100%; background-color: #fff; line-height: 180%; height: auto; font-weight: normal; border: 1px solid #dddddd; } .Tutor img { width: 100%; height: auto; } .CategoryTutorName { width: 100%; background-color: #000; padding: 5px 10px; color: #fff; } .TutorInfo { padding: 8px 10px 16px 10px; } .TutorDescription { height: 34px; line-height: 120%; margin: 5px 0; } .TutorInfo hr { margin: 6px 0; } .Uni, .experience { line-height: 120%; font-size: 12px; } .CategoryBackToTop { background-color: #f7f8f9; } /* ========================================= Profile =========================================== */ .ProfileContent { background-color: #f7f8f9; width: 100%; height: auto; padding: 30px 0; margin-top: 90px; } .Profilecontainer { width: 900px; margin: 0 auto; } .Profile { padding: 20px; background-color: #fff; border: 1px solid #dddddd; text-align: center; margin-bottom: 20px; } #ProfileImg img { width: 200px; height: 200px; } .ProfileInfo { width: 100%; padding-left: 20px; text-align: left; } .TutorName { font-size: 30px; } .TutorIntro { font-size: 18px; margin: 10px 0; } .ProfileDetail { margin: 10px 0; font-size: 12px; line-height: 160%; } .ContactTutorBTN { padding: 10px 16px; background-color: #c11c2c; border: 0px; font-size: 16px; color: #fff; line-height: 100%; } .PayTutorBTN{ margin-left:10px; padding: 5px 9px; background-color: #090; border: 0px; font-size: 12px; color: #fff; line-height: 100%; margin-bottom:5px; } .PayTutorBTN2,.PayTutorBTN3,.PayTutorBTN4{ width:100%; padding: 5px 9px; background-color: #415cb4; border: 0px; font-size: 12px; color: #fff; line-height: 100%; margin-bottom:5px; } .PayTutorBTN3, .PayTutorBTN4{ text-align:center; background:#d3373f; cursor:pointer; margin-bottom:0px; } .ProfileSection { float: left; background-color: #fff; border: 1px solid #dddddd; padding: 20px; width: 100%; margin-bottom: 20px; font-size: 14px; } .ProfileSectionTitle { font-size: 15px; color: #808080; } .AboutMeMessage { font-size: 14px; color: #000000; text-align: justify; } .ProfileTable { font-size: 13px; } .TutorSubjects { float: left; width: 100%; margin: 5px 0; } .Subject { float: left; width: 40%; text-align: left; } .SubjectLevel { float: left; width: 60%; padding-left: 20px; } .ReviewStar { margin: 5px 0; font-size: 20px; } #RedStar { color: #c11c2c; } .CommentSection { width: 100%; background-color: #f5f5f5; padding: 10px 15px; border: 1px solid #dddddd; margin-bottom: 20px; border-radius: 3px; -moz-box-shadow: inset 0 0 8px #dddddd; -webkit-box-shadow: inset 0 0 8px #dddddd; box-shadow: inset 0 0 8px #dddddd; } .comment, .commentdate, .SectionContent { width: 100%; text-align: justify; line-height: 200%; } .commentdate { font-size: 12px; } .SectionContent { width: 100%; text-align: justify; line-height: 160%; padding-top: 5px; } .SectionContent img { height: 40px; width: auto; margin-right: 10px; } .VerifySection { width: 100%; text-align: justify; line-height: 200%; padding-top: 5px; } .VerifyIcon { float: left; width: 15%; text-align: left; } .VerifyIcon img { height: 20px; width: auto; } .VerifyTitle { padding-top: 1px; float: left; width: 85%; text-align: left; } .Links a{ color:#fff; } /* ========================================= Responsive =========================================== */ @media screen and (max-width: 900px) { .ProfileInfo { padding-left: 50px; } } @media screen and (max-width: 1000px) { .Profilecontainer { width: 90%; } } @media screen and (max-width: 767px) { .intro-heading { padding-top: 20%; } .SearchBox { width: 90%; } .SearchBox input { width: 86%; } #TabAlign { margin: 60px -15px 20px 0px; width: 100%; } .CopyRight, .SocialMedia { width: 100%; text-align: center; margin: 10px 0; } .header { height: 40%; } .HalfLeft, .HalfRight { float: left; width: 100%; margin: 15px 0; padding: 0; } .HalfLeft { margin-right: 0%; } .InputDataII { float: left; margin: 15px 0; width: 100%; margin-right: 0%; } .InstrumentExp { margin: 5px 0; margin-right: 0%; width: 100%; } .inputPrice { width: 100%; } .ProfileInfo { padding-left: 0px; text-align: center; margin: 20px 0; } .ContactTutorBTN { width: 100%; } .BannerBigFont { font-size: 28px; font-weight: bold; color: #fff; letter-spacing: 0px; } .ProfileContent { margin-top: 80px; } } @media screen and (max-width: 380px) { .SearchBox { width: 90%; } .SearchBox input { width: 80%; } .direction { margin-top: 100px; font-size: 12px; color: #fff; font-weight: bold; } .BannerBigFont { font-size: 20px; font-weight: bold; color: #fff; letter-spacing: 0px; } .weFound { margin-top: 20px; font-size: 20px; color: #fff; font-weight: bold; } } @media (min-width: 767px) and (max-width: 1199px ) { .SuggestImg { width: 100%; } .SuggestImg img { width: 100%; height: 120px; } .PopUpformSection { width: 100%; } } @media ( max-width: 767px ) { .SignUpNotice { margin-top: -20px; } .PopUpformSection { width: 90%; } .BeginSTD, .BeginTutor { width: 90%; margin: 0 10px 20px 10px; } .Guarantee { display: none; } } .JobPostSection{ width: 100%; height: auto; padding: 50px 0; background: url(../img/home/SectionIIIBK.jpg); background-size: cover; } .job_detail{ position: absolute; bottom: 0; left: 0; text-align: center; width: 100%; } #back-to-top{ cursor: pointer; } /* override bootstrap */ /*@media (min-width: 1200px) { .navbar-header { float: left } } @media (min-width: 1200px) { .navbar-toggle { display: none } } @media (min-width: 1200px) { .navbar-collapse { width: auto; border-top: 0; -webkit-box-shadow: none; box-shadow: none } .navbar-collapse.collapse { display: block !important; height: auto !important; padding-bottom: 0; overflow: visible !important } .navbar-collapse.in { overflow-y: visible } .navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse, .navbar-static-top .navbar-collapse { padding-right: 0; padding-left: 0 } }*/ body{ padding-right: 0 !important; } .italic { font-style: italic; } .bold { font-weight: bold; } .underline { text-decoration: underline; } .course_payment_box,.course_payment_box2,.course_payment_box3,#course_payment_box{ width: 270px; background: #fff; position:fixed; border: 1px solid #ddd; left:50%; top:50%; margin-top: -120px; margin-left: -125px; display:none; z-index:2001; } #share_email{ position:fixed; left:50%; top:50%; width:500px; margin-left: -250px; margin-top: -200px; z-index:3000; display:none; } #course_payment_box{ /*width:500px; margin-left: -250px; margin-top: -190px;*/ width:340px; margin-left: -170px; margin-top: -190px; } #course_payment_box textarea{ width:100%; height:100px; } .course_payment_box .header,.course_payment_box2 .header,.course_payment_box3 .header{ text-align:center; font-weight:bolder; margin-bottom:5px; } .course_payment_box input[type='text'],.course_payment_box2 input[type='text'],.course_payment_box3 input[type='text'],#course_payment_box input[type='text'],#share_email input[type='text']{ width:100%; margin-bottom:5px; height:30px; } .course_payment_box select[name='instrument_id'],.course_payment_box2 select[name='instrument_id'],.course_payment_box3 select[name='instrument_id']{ width:100%; height:30px; margin-bottom:5px; } .panel-body{ background:#f5f5f5; }