/* Theme 64 Full HD Panel, Title, Leadership Section Front Page, and Staffs ******************** */ /* ------------------------------------------ Panel Grid ------------------------------------------ */ /* Panel Percent Grid */ .BG-frontpage-container:after { display: table; content: ""; line-height: 0; clear: both; } .frontpage-wrapper-row:after { display: table; content: ""; line-height: 0; clear: both; } .frontpage-container-1col { float: left; margin: 0; padding: 0; width: 33.33%; } .frontpage-container-1col-TM3col { float: left; margin: 0; padding: 0; width: 33.33%; } .frontpage-container-2col { float: left; margin: 0; padding: 0; width: 66.66%; } .frontpage-container-3col { clear: both; margin: 0; padding: 0; width: 100%; } /* END Panel Percent Grid */ /* ------------------------------------------ END Panel Grid ------------------------------------------ */ /* Leadership Section Front Page */ .Leadership-Section { margin: 8px; background: #FFFFFF; border-radius: 3px; box-shadow: 0 0 5px #dddddd; overflow: hidden; } .Leadership-Section:after { content: ""; clear: both; display: block; } .Leadership-Section .Leadership-Picture { float:left; width:30%; } .Leadership-Section .Leadership-Picture .Leadership-Thumb { margin: 0 auto; padding: 8px; overflow: hidden; } .Leadership-Section .Leadership-Picture .Leadership-Thumb img { padding: 9px; width: 90%; border-radius: 3px; box-shadow: inset 0 0 9px 1px #dddddd; overflow: hidden; } .Leadership-Section .Leadership-Detail { float: left; width:70%; } .Leadership-Section .Leadership-Detail .Leadership-Position, .Leadership-Section .Leadership-Detail .Leadership-Slogan { margin: 0 8px; padding: 8px 0; } .Leadership-Section .Leadership-Detail .Leadership-Name, .Leadership-Section .Leadership-Detail .Leadership-Position, .Leadership-Section .Leadership-Detail .Leadership-Slogan { line-height: 150%; } .Leadership-Section .Leadership-Detail .Leadership-Name { margin: 8px 8px 0 8px; padding: 8px 5px 5px 0; font-size:125%; font-weight:bold; color: #333333; border-bottom: 3px solid #3FB6AA; } .Leadership-Section .Leadership-Detail .Leadership-Position { font-size: 110%; } .Leadership-Section .Leadership-Detail .Leadership-Slogan { color: #666666; font-size: 90%; padding-bottom: 8px !important; } /* --- .frontpage-container-1col-TM3col --- */ .frontpage-container-1col-TM3col .Leadership-Section .Leadership-Picture, .frontpage-container-1col-TM3col .Leadership-Section .Leadership-Detail { float: none; width: 100%; } .frontpage-container-1col-TM3col .Leadership-Section .Leadership-Picture .Leadership-Thumb { width: 50%; } .frontpage-container-1col-TM3col .Leadership-Section .Leadership-Detail .Leadership-Name, .frontpage-container-1col-TM3col .Leadership-Section .Leadership-Detail .Leadership-Position, .frontpage-container-1col-TM3col .Leadership-Section .Leadership-Detail .Leadership-Slogan { padding: 2px 0; text-align: center; } .frontpage-container-1col-TM3col .Leadership-Section .Leadership-Detail .Leadership-Name { font-size: 110%; border: none; } .frontpage-container-1col-TM3col .Leadership-Section .Leadership-Detail .Leadership-Position { font-size: 100%; } /* END Leadership Section Front Page */ /* HighLight Botton New Frontpage */ .highlight-btn-container { margin: 0; display: flex; flex-flow: row; justify-content: center; } .highlight-btn-container:before, .highlight-btn-container:after, .highlight-btn-item:after { display: table; content: ""; line-height: 0; clear: both; } .highlight-btn-item { background: #FFFFFF; margin: 20px; padding: 18px 5px; /* border-radius: 3px; */ box-shadow: 0 0 5px #DDD; overflow: hidden; } .highlight-btn-item:hover { background: #0A3D5D; cursor: pointer; } .highlight-btn-icon { float: left; margin-left: 10px; width: 122px; /* width: 100px; */ /* border-radius: 3px; box-shadow: 0 0 1px 1px #FFF; */ overflow: hidden; } .highlight-btn-txt { float: left; padding: 0 0 1px 8px; /* width: 71%; */ width: 69%; font-size: 135%; font-weight: bold; color: #333333; } .highlight-btn-desp { float: left; padding: 4px 0 2px 8px; /* width: 71%; */ width: 69%; max-height: 38px; font-size: 95%; color: #333333; overflow: hidden; } .highlight-btn-item:hover .highlight-btn-txt, .highlight-btn-item:hover .highlight-btn-desp { color: #FFFFFF; } .highlight-btn-txt a, .highlight-btn-txt a:visited { color: #333333; } .highlight-btn-item:hover .highlight-btn-txt a, .highlight-btn-txt a:hover { color: #FFFFFF; } .highlight-btn-item-service { background: #96c699; } .highlight-btn-item-education { background: #337ab7; } .highlight-btn-item-research { background: #3FB6AA; } .frontpage-container-1col-TM3col .highlight-btn-container { flex-flow: column; } .frontpage-container-3col .highlight-btn-item { float: left; width: 30.87%; margin: 20px; } /* .frontpage-container-3col .highlight-btn-item:first-child { margin: 8px 8px 8px 3px; } .frontpage-container-3col .highlight-btn-item:last-child { margin: 8px 3px 8px 8px; } */ .frontpage-container-3col .highlight-btn-txt, .frontpage-container-3col .highlight-btn-desp { width: 69%; /* width: 70%; */ } /* END HighLight Botton New Frontpage */ /* HighLight Botton small New Frontpage */ .highlight-btn-small-container { margin: 0 5px 0 5px; } .highlight-btn-small-container:before, .highlight-btn-small-container:after, .highlight-btn-small-item:after { display: table; content: ""; line-height: 0; clear: both; } .highlight-btn-small-item { background: #FFFFFF; margin: 5px 0; padding: 6px 5px; border-radius: 3px; box-shadow: 0 0 5px #DDD; } .highlight-btn-small-item:hover { background: slategrey; cursor: pointer; } .highlight-btn-small-icon { float: left; margin-left: 2px; width: 40px; border-radius: 3px; box-shadow: 0 0 1px 1px #FFF; overflow: hidden; } .highlight-btn-small-txt { display: table-cell; vertical-align: middle; padding: 6px 0 3px 8px; width: 82%; height: 30px; font-size: 115%; font-weight: bold; color: #333333; } .highlight-btn-small-item:hover .highlight-btn-small-txt { color: #FFFFFF; } .highlight-btn-small-txt a, .highlight-btn-small-txt a:visited { color: #333333; } .highlight-btn-small-item:hover .highlight-btn-txtghlight-btn-small-txt a, a.highlight-btn-small-txt a:hover { color: #FFFFFF; } /* END HighLight Botton small New Frontpage */ /* ------------------------------------------ Header Title ------------------------------------------ */ /* Header Title */ .HeadTitle-more { padding: 5px 5px 0 10px; background: #FFFFFF; border-bottom: 1px solid #efefef; overflow: hidden; border-radius: 0px 0px 9px 9px; box-shadow: 0 2px 5px #CCC; } .HeadTitle-more .HeadTitle-text { font-size: 200%; line-height: 200%; font-weight: bold; color: #666; text-shadow: 1px 1px 2px #ccc; } .HeadTitle-more .HeadTitle-text a, .HeadTitle-more .HeadTitle-text a:visited { color: darkcyan; } .HeadTitle-more .HeadTitle-text a:hover { color: coral; } /* END Header Title */ /* ------------------------------------------ END Header Title ------------------------------------------ */ /* ------------------------------------------ Title ------------------------------------------ */ /* Title Style */ .titlestyle1-resp { margin: 5px 0; padding: 5px 0; font-size: 150%; font-weight: bold; color: #88AC2E; text-shadow: 1px 1px 1px #FFF; border-bottom: 2px solid #3FB6AA; } .titlestyle2-resp { margin: 5px; padding: 5px; font-size: 125%; text-align: center; line-height: 110%; font-weight: bold; color: #FFF; border-radius: 6px 6px 0 0; background: #3FB6AA; } /* END Title Style */ /* Title BoxStyle */ .Title-boxStyle { margin: 8px; border-color: #ccc; border-bottom:3px solid; padding:8px 0 0 0; } .Title-boxStyle span.TboxStyle { background-color: #ccc; border-radius:3px 9px 0 0; color:#ffffff; display: inline-block; padding:10px 30px 6px 12px; font-size: 125%; } /* END Title BoxStyle */ /* Front Title Style */ .FrontTitle, .FrontTitleL, .FrontTitleR { margin: .5em 0 0 0; font-size: 145%; line-height: 150%; font-weight: bold; overflow: hidden; } .FrontTitle span.FT-Line, .FrontTitleL span.FT-Line, .FrontTitleR span.FT-Line { position: relative; } .FrontTitle span.FT-Line:before, .FrontTitleL span.FT-Line:before, .FrontTitleR span.FT-Line:before { right: 100%; margin-right: .5em; } .FrontTitle span.FT-Line:after, .FrontTitleL span.FT-Line:after, .FrontTitleR span.FT-Line:after { left: 100%; margin-left: .5em; } .FrontTitle span.FT-Line:before, .FrontTitle span.FT-Line:after, .FrontTitleL span.FT-Line:before, .FrontTitleL span.FT-Line:after, .FrontTitleR span.FT-Line:before, .FrontTitleR span.FT-Line:after { content: ""; position: absolute; top: 42%; height: 0; border-top: 3px solid #CCC; border-bottom: 3px solid #CCC; width: 200em; border-radius: 10px; } .FrontTitle { padding: 0.75em 0; text-align: center; } .FrontTitleL { padding: 0.75em 0 0.75em 1.5em; text-align: left; } .FrontTitleR { padding: 0.75em 1.75em 0.75em 0; text-align: right; } :after, :before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .FrontTitle span.FT-Line, .FrontTitle span > a, .FrontTitleL span.FT-Line, .FrontTitleL span > a, .FrontTitleR span.FT-Line, .FrontTitleR span > a { color: #666; } .FrontTitle-lBlue span.FT-Line:before, .FrontTitle-lBlue span.FT-Line:after { border-color: #004370; } .FrontTitle-lBlue span.FT-Line, .FrontTitle-lBlue span > a { color: #004370; } .FrontTitle-lLBlue span.FT-Line:before, .FrontTitle-lLBlue span.FT-Line:after { border-color: #9dc6d8; } .FrontTitle-lLBlue span.FT-Line, .FrontTitle-lLBlue span > a { color: steelblue; } .FrontTitle-lLGreen span.FT-Line:before, .FrontTitle-lLGreen span.FT-Line:after { border-color: #7dd0b6; } .FrontTitle-lLGreen span.FT-Line, .FrontTitle-lLGreen span > a { color: darkcyan; } .FrontTitle-lLSeaGreen span.FT-Line:before, .FrontTitle-lLSeaGreen span.FT-Line:after { border-color: lightseagreen; } .FrontTitle-lLSeaGreen span.FT-Line, .FrontTitle-lLSeaGreen span > a { color: lightseagreen; } .FrontTitle-lOrange span.FT-Line:before, .FrontTitle-lOrange span.FT-Line:after { border-color: #F69256; } .FrontTitle-lOrange span.FT-Line, .FrontTitle-lOrange span > a { color: #F69256; } .FrontTitle-lLPink span.FT-Line:before, .FrontTitle-lLPink span.FT-Line:after { border-color: #E38690; } .FrontTitle-lLPink span.FT-Line, .FrontTitle-lLPink span > a { color: #E38690; } .FrontTitle-lYellow span.FT-Line:before, .FrontTitle-lYellow span.FT-Line:after { border-color: #ead96b; } .FrontTitle-lYellow span.FT-Line, .FrontTitle-lYellow span > a { color: goldenrod; } /* END Front Title Style */ /* ------------------------------------------ END Title ------------------------------------------ */ /* ------------------------------------------ Staffs ------------------------------------------ */ /* Staff Style */ .staff-style { margin: 0; padding: 0; } .one-col { margin: 10px 5px; width: 98%; text-align: center; } .two-col { float: left; margin: 10px 5px; width: 48%; text-align: center; } .tree-col { float: left; margin: 10px 5px; width: 31.5%; text-align: center; } .staff-style-img { margin: 5px auto; } .staff-style-img img { padding: 2px; border: 2px solid #ccc; border-radius: 10px; width: 150px; box-shadow: 2px 2px 5px #ccc; } .img-border-green img { border-color: #5CA038; } .img-border-sb_blue img { border-color: #00B3CA; } .img-border-tr_orange img { border-color: #F69256; } .img-border-pink_st img { border-color: #E38690; } .img-border-lc_green img { border-color: #7dd0b6; } .img-border-blue_aq img { border-color: #9dc6d8; } .img-border-blue img { border-color: #004370; } .img-border-yellow img { border-color: #ead96b; } .staff-style-name, .staff-style-position { margin: 2px; padding: 0 5px; color: #666; } .staff-style-name { font-size: 105%; font-weight: bold; } .staff-style-position { font-size: 95%; } /* END Staff Style */ /* Staff Style Column */ .staff-style-col-wrapper { margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; } .staff-style-col-container { margin: 0; padding: 0; } .staff-style-col-wrapper:after, .staff-style-col-container:after { display: table; content: ""; line-height: 0; clear: both; } .staff-style-col-item { float: left; margin: 15px; width: 18%; text-align: center; } .staff-style-col-img { margin: 10px auto; } .staff-style-col-img img { padding: 2px; width: 55%; border: 2px solid #ccc; border-radius: 9px; box-shadow: 2px 2px 5px #ccc; } .img-border-green img { border-color: #5CA038; } .img-border-sb_blue img { border-color: #00B3CA; } .img-border-tr_orange img { border-color: #F69256; } .img-border-pink_st img { border-color: #E38690; } .img-border-lc_green img { border-color: #7dd0b6; } .img-border-blue_aq img { border-color: #9dc6d8; } .img-border-blue img { border-color: #004370; } .img-border-yellow img { border-color: #ead96b; } .staff-style-col-name, .staff-style-col-position { margin: 2px; padding: 0 5px; color: #666; } .staff-style-col-name { font-size: 105%; font-weight: bold; } .staff-style-col-position { font-size: 95%; } .span9 .staff-style-col-item { width: 25%; } /* END Staff Style Column */ /* ------------------------------------------ END Staffs -------------------------------------- */ /* ------------------------------------------ Reference ------------------------------------------ */ /* Contact Reference */ .Ref-Container { margin: 10px 0; padding: 10px 0 8px 0; } .Ref-Container:after { display: table; content: ""; line-height: 0; clear: both; } .Ref-Container .Ref-Section-Desp { float: right; max-width: 80%; text-align: right; text-shadow: 0 0 3px #FFFFFF; } .Ref-Container .Ref-Section-Desp p { margin: 5px 0; } .Ref-Container .Ref-Section-Logo { float: right; width: 150px; height: 75px; } .Ref-Container .Ref-Section-Logo:hover { cursor: pointer; } .AtRama-Ref > .Ref-Section-Logo { background: url(/sites/default/files/public/img/icon/AtRama-Logo.png) no-repeat; background-size: cover; } .AtRama-Ref { background:-webkit-linear-gradient(right, #FFFFFF, #f9f7f1, #eae2cb); } .RAMA-CH-Ref > .Ref-Section-Logo { background: url(/sites/default/files/public/img/icon/RamaChannel-Logo.png) no-repeat; background-size: cover; } .RAMA-CH-Ref { background:-webkit-linear-gradient(right, #FFFFFF, #F5F5F5, lightblue); } /* END Contact Reference */ /* ------------------------------------------ END Reference ------------------------------------------ */ @media only screen and (min-width: 1680px) {} @media only screen and (min-width: 1441px) and (max-width: 1680px) { /* HighLight Botton New Frontpage */ .highlight-btn-icon { width: 6.96vw; /* width: 6.3vw; */ } /* END HighLight Botton New Frontpage */ /* Staff Style Column */ .span9 .staff-style-col-item { width: 22%; } .span9 .staff-style-col-img img { width: 60%; } /* END Staff Style Column */ } @media only screen and (min-width: 1281px) and (max-width: 1440px) { /* HighLight Botton New Frontpage */ .highlight-btn-icon { width: 6.2vw; } /* END HighLight Botton New Frontpage */ /* Staff Style Column */ .staff-style-col-item { width: 22%; } .staff-style-col-img img { width: 55%; } .span9 .staff-style-col-item { width: 30%; } .span9 .staff-style-col-img img { width: 60%; } /* END Staff Style Column */ } @media only screen and (min-width: 1025px) and (max-width: 1280px) { /* HighLight Botton New Frontpage */ .highlight-btn-icon { width: 5.4vw; } /* END HighLight Botton New Frontpage */ /* Staff Style Column */ .staff-style-col-item { width: 22%; } .staff-style-col-img img { width: 60%; } .span9 .staff-style-col-item { width: 29%; } .span9 .staff-style-col-img img { width: 60%; } /* END Staff Style Column */ } @media only screen and (min-width: 769px) and (max-width: 1024px) { /* HighLight Botton New Frontpage */ .highlight-btn-icon { width: 4.6vw; } /* END HighLight Botton New Frontpage */ /* Staff Style Column */ .staff-style-col-item { width: 30%; } .staff-style-col-img img { width: 55%; } .span9 .staff-style-col-item { width: 29%; } .span9 .staff-style-col-img img { width: 70%; } /* END Staff Style Column */ } @media only screen and (min-width: 1200px) { } @media (max-width: 1199px) { } @media only screen and (min-width: 769px) and (max-width: 1024px) { } @media only screen and (min-width: 769px) and (max-width: 823px) {} @media only screen and (min-width: 769px) and (max-width: 979px) { /* HighLight Botton New Frontpage */ .highlight-btn-item { margin: 8px; } .highlight-btn-icon { width: 50px; } .highlight-btn-txt, .highlight-btn-desp { width: 68%; } .highlight-btn-txt { padding: 0 0 3px 8px; font-size: 115%; } .highlight-btn-desp {padding: 0 0 2px 8px; font-size: 90%; } .frontpage-container-3col .highlight-btn-item { width: 30.12%; height: 50px; } .frontpage-container-3col .highlight-btn-icon { width: 50px; } .frontpage-container-3col .highlight-btn-txt, .frontpage-container-3col .highlight-btn-desp { width: 68%; } .frontpage-container-3col .highlight-btn-txt { padding: 0 0 3px 8px; font-size: 115%; } .frontpage-container-3col .highlight-btn-desp {padding: 0 0 2px 8px; font-size: 90%; } /* END HighLight Botton New Frontpage */ } @media (max-width: 768px) { } @media only screen and (min-width: 481px) and (max-width: 768px) { /* ------------------------------------------ Panel Grid ------------------------------------------ */ /* Panel Percent Grid */ .frontpage-container-1col-TM3col, .frontpage-container-2col { float: none; width: 100%; } /* END Panel Percent Grid */ /* Staff Style Column */ .staff-style-col-item { width: 29%; } .staff-style-col-img img { width: 60%; } .span9 .staff-style-col-item { width: 29%; } .span9 .staff-style-col-img img { width: 70%; } /* END Staff Style Column */ /* ------------------------------------------ END Panel Grid ------------------------------------------ */ /* Leadership Section Front Page */ .frontpage-container-1col-TM3col .Leadership-Section .Leadership-Picture { float: left; width: 30%; } .frontpage-container-1col-TM3col .Leadership-Section .Leadership-Detail { float: left; width: 70%; } .frontpage-container-1col-TM3col .Leadership-Section .Leadership-Picture .Leadership-Thumb { width: auto; } .frontpage-container-1col-TM3col .Leadership-Section .Leadership-Detail .Leadership-Position, .frontpage-container-1col-TM3col .Leadership-Section .Leadership-Detail .Leadership-Slogan { padding: 8px 0; text-align: left; } .frontpage-container-1col-TM3col .Leadership-Section .Leadership-Detail .Leadership-Name { padding: 8px 5px 5px 0; font-size:125%; border-bottom: 3px solid #3FB6AA; text-align: left; } .frontpage-container-1col-TM3col .Leadership-Section .Leadership-Detail .Leadership-Position { font-size: 110%; } /* END Leadership Section Front Page */ /* HighLight Botton New Frontpage */ .highlight-btn-container { display: flex; flex-flow: row; justify-content: center; } .highlight-btn-item { float: left; margin: 10px; width: 28.5%; } .highlight-btn-icon { width: 6.5vw; } .highlight-btn-txt { font-size: 115%; } .highlight-btn-txt, .highlight-btn-desp { width: 61%; } .frontpage-container-1col-TM3col .highlight-btn-container { flex-flow: row; } .frontpage-container-3col .highlight-btn-item, .frontpage-container-3col .highlight-btn-item:first-child, .frontpage-container-3col .highlight-btn-item:last-child { margin: 4px; width: 30.75%; height: 68px; } .frontpage-container-3col .highlight-btn-txt, .frontpage-container-3col .highlight-btn-desp { width: 61%; } /* END HighLight Botton New Frontpage */ /* HighLight Botton small New Frontpage */ .highlight-btn-small-item { float: left; margin: 4px; width: 30.6%; } .highlight-btn-small-txt { font-size: 100%; } .highlight-btn-small-txt { width: 61%; } /* END HighLight Botton small New Frontpage */ /* ------------------------------------------ Header Title ------------------------------------------ */ /* Header Title */ .HeadTitle-more { margin: 0 -10px; padding: 10px 5px 0 10px; } .HeadTitle-more .HeadTitle-text { font-size: 175%; line-height: 175%; } /* END Header Title */ /* ------------------------------------------ END Header Title ------------------------------------------ */ /* ------------------------------------------ Staffs -------------------------------------- */ /* Staff Style */ .tree-col { height: 275px; } /* END Staff Style */ /* ------------------------------------------ END Staffs -------------------------------------- */ } @media only screen and (min-width: 668px) and (max-width: 768px) { } @media only screen and (min-width: 481px) and (max-width: 667px) { /* HighLight Botton New Frontpage */ .highlight-btn-item { width: 29.95%; height: 60px; } .highlight-btn-icon { width: 50px; } .highlight-btn-txt { padding: 0 0 3px 8px; font-size: 100%; } .highlight-btn-desp { padding: 0 0 2px 8px; font-size: 90%; } .highlight-btn-txt, .highlight-btn-desp { width: 57%; } .frontpage-container-3col .highlight-btn-item, .frontpage-container-3col .highlight-btn-item:first-child, .frontpage-container-3col .highlight-btn-item:last-child { width: 29.95%; height: 60px; }.highlight-btn-icon { width: 50px; } .frontpage-container-3col .highlight-btn-txt { padding: 0 0 3px 8px; font-size: 100%; } .frontpage-container-3col .highlight-btn-desp { padding: 0 0 2px 8px; font-size: 90%; } .frontpage-container-3col .highlight-btn-txt, .frontpage-container-3col .highlight-btn-desp { width: 57%; } /* END HighLight Botton New Frontpage */ /* HighLight Botton small New Frontpage */ .highlight-btn-small-item { width: 46.62%; } .highlight-btn-small-txt { width: 57%; font-size: 100%; } /* END HighLight Botton small New Frontpage */ } @media only screen and (max-width: 480px) { /* ------------------------------------------ Panel Grid ------------------------------------------ */ /* Panel Percent Grid */ .frontpage-container-1col, .frontpage-container-1col-TM3col, .frontpage-container-2col { float: none; width: 100%; } /* END Panel Percent Grid */ /* ------------------------------------------ END Panel Grid ------------------------------------------ */ /* Leadership Section Front Page */ .Leadership-Section .Leadership-Picture, .Leadership-Section .Leadership-Detail, .frontpage-container-1col-TM3col .Leadership-Section .Leadership-Picture, .frontpage-container-1col-TM3col .Leadership-Section .Leadership-Detail { float: none; width: 100%; } .Leadership-Section .Leadership-Picture .Leadership-Thumb, .frontpage-container-1col-TM3col .Leadership-Section .Leadership-Picture .Leadership-Thumb { width: 42%; } .Leadership-Section .Leadership-Detail .Leadership-Name, .Leadership-Section .Leadership-Detail .Leadership-Position, .frontpage-container-1col-TM3col .Leadership-Section .Leadership-Detail .Leadership-Name, .frontpage-container-1col-TM3col .Leadership-Section .Leadership-Detail .Leadership-Position { padding: 2px 0; text-align: center; } .Leadership-Section .Leadership-Detail .Leadership-Name, .frontpage-container-1col-TM3col .Leadership-Section .Leadership-Detail .Leadership-Name { border-bottom: none; font-size: 110%; } .Leadership-Section .Leadership-Detail .Leadership-Position, .frontpage-container-1col-TM3col .Leadership-Section .Leadership-Detail .Leadership-Position { font-size: 100%; } .Leadership-Section .Leadership-Slogan, .frontpage-container-1col-TM3col .Leadership-Section .Leadership-Slogan { padding: 2px 0 5px 2px; text-align: center; } /* END Leadership Section Front Page */ /* HighLight Botton New Frontpage */ .highlight-btn-item { margin: 10px 8px; } .highlight-btn-icon { margin-left: 15px; width: 65px; } .highlight-btn-txt, .highlight-btn-desp { width: 68%; padding: 4px 0 2px 20px; } .frontpage-container-3col .highlight-btn-container { flex-flow: column; } .frontpage-container-3col .highlight-btn-item, .frontpage-container-3col .highlight-btn-item:first-child, .frontpage-container-3col .highlight-btn-item:last-child { float: none; width: inherit; margin: 10px 8px; } .frontpage-container-3col .highlight-btn-icon { margin-left: 15px; } .frontpage-container-3col .highlight-btn-txt, .frontpage-container-3col .highlight-btn-desp { width: 68%; padding: 4px 0 2px 20px; } /* END HighLight Botton New Frontpage */ /* ------------------------------------------ Header Title ------------------------------------------ */ /* Header Title */ .HeadTitle-more { margin: 0 -10px; padding: 10px 5px 0 10px; } .HeadTitle-more .HeadTitle-text { font-size: 150%; line-height: 150%; } /* END Header Title */ /* ------------------------------------------ END Header Title ------------------------------------------ */ /* ------------------------------------------ Title ------------------------------------------ */ /* Title BoxStyle */ .Title-boxStyle { margin: 8px 3px 8px 8px; } .Title-boxStyle span.TboxStyle { display: block; text-align: center; border-radius:9px 9px 0 0; padding:10px 12px 6px 12px; } /* END Title BoxStyle */ /* ------------------------------------------ END Title ------------------------------------------ */ /* ------------------------------------------ Staffs -------------------------------------- */ /* Staff Style */ .one-col, .two-col, .tree-col { float: none; width: 99%; } .staff-style-img img { width: 200px; } /* END Staff Style */ /* Staff Style Column */ .staff-style-col-item, .span9 .staff-style-col-item { float: none; width: 99%; } .staff-style-col-img img { width: 200px; } /* END Staff Style Column */ /* ------------------------------------------ END Staffs -------------------------------------- */ /* ------------------------------------------ Reference ------------------------------------------ */ /* Contact Reference */ .Ref-Container .Ref-Section-Desp { float: none; width: 100%; max-width: 100%; text-align: center; } .Ref-Container .Ref-Section-Logo { float: none; margin: 5px auto; } .AtRama-Ref { background:-webkit-linear-gradient(top, #FFFFFF, #f9f7f1, #eae2cb); } .RAMA-CH-Ref { background:-webkit-linear-gradient(top, #FFFFFF, #F5F5F5, lightblue); } /* END Contact Reference */ /* ------------------------------------------ END Reference ------------------------------------------ */ } @media only screen and (max-width: 360px) { /* HighLight Botton New Frontpage */ .highlight-btn-txt, .highlight-btn-desp { width: 63%; } .frontpage-container-3col .highlight-btn-txt, .frontpage-container-3col .highlight-btn-desp { width: 63%; } /* END HighLight Botton New Frontpage */ }