body { font-family: 'Open Sans', sans-serif; background:#eaedf2; color:#666; font-size:14px; } * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } p{ text-align: justify; text-justify: inter-word; } a{ -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; text-decoration:none; } .content-info a{ color:#22A7F0 } .content-info a:hover{ color:#000; } a img { border:0; } section img{ display:block; max-width:100%; height:auto; margin:25px 0 25px 0; border: 1px solid #000; margin-left: auto; margin-right: auto; } article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; } section{ position:relative; } h1, h2, h3, h4, h5, h6{ font-weight:400; } h1{ font-size:36px; margin:0 0 30px 0; } h2{ font-size:30px; margin:0 0 30px 0; } h3{ font-size:24px; margin:0 0 30px 0; } h4{ font-size:20px; margin:0 0 20px 0; } h5{ font-size:18px; margin:0 0 15px 0; } h6{ font-size:16px; margin:0 0 10px 0; } .container { padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto; width: 1200px; } .container:before, .container:after, .clearfix:before, .row:before, .clearfix:after, .row:after { display: table; content: " "; } .container:after, .clearfix:after, .row:after { clear: both; } .row { margin-right: -15px; margin-left: -15px; } .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11 { float: left; } .col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 { position: relative; min-height: 1px; padding-right: 15px; padding-left: 15px; } .col-lg-12 { width: 100%; } .col-lg-11 { width: 91.66666667%; } .col-lg-10 { width: 83.33333333%; } .col-lg-9 { width: 75%; } .col-lg-8 { width: 66.66666667%; } .col-lg-7 { width: 58.33333333%; } .col-lg-6 { width: 50%; } .col-lg-5 { width: 41.66666667%; } .col-lg-4 { width: 33.33333333%; } .col-lg-3 { width: 25%; } .col-lg-2 { width: 16.66666667%; } .col-lg-1 { width: 8.33333333%; } .center{ text-align:center; } .left{ text-align:left; } .right{ text-align:right; } .btn{ display:inline-block; width:160px; height:40px; line-height:38px; background:#3498db; color:#fff; font-weight:400; text-align:center; text-transform:uppercase; font-size:14px; border-bottom:2px solid #2a8bcc; } .btn:hover{ background:#2a8bcc } header{ margin:0 0 50px 0; padding:20px 0; background:#22A7F0 } .slogan{ color:#fff; font-weight:300; font-size:20px; line-height:34px; } #logo img{ display:block; margin:0 auto; height:70px; } section .container{ background:#fff; } .content-wrap{ padding:50px 0 } aside{ color:#fff; float:left; padding-left:15px; width:285px; } .fixed{ position:fixed; top:15px; } aside h4{ font-size:20px; font-weight:400; margin:0 0 30px 0; } .menu-box{ padding:20px; background:#34495e; } .menu-box ul{ margin:0; padding:0; } .menu-box li{ display:block; } .menu-box li a{ display:block; padding:15px 20px; margin-left: -20px; margin-right: -20px; color:#fff; border-bottom:1px solid #314559; } .menu-box li a:hover, .menu-box li a.current{ background:#2c3e50; } .menu-box li:last-child a{ border-bottom:0; } .content-info{ padding-right:15px; padding-left:315px; } .section-txt{ padding-bottom:15px; margin-bottom:30px; border-bottom:1px solid #dcdcdc; } .section-txt:last-child{ margin-bottom:0; padding-bottom:0; border-bottom:0; } .content-info h3{ font-size:24px; font-weight:400; color:#444; margin:0 0 30px 0; } .content-info p{ color:#666; line-height:24px; font-size:16px; font-weight:300; } .content-info ul{ margin:0 0 14px 0; } .content-info ul li{ line-height:24px; font-size:16px; font-weight:300; } .content-info iframe { width: 100%!important; height: 350px; border: 0!important; } .footer-area{ margin-top:50px; padding:60px 0; background:#222; font-size:16px; line-height:24px; color:#fff; font-weight:300; } .footer-area a{ color:#999; } .footer-area a:hover{ color:#eee } footer{ background:#111; padding:20px 0; font-weight:300; font-size:12px; } @media only screen and (max-width: 1200px) { .container{ width:970px; } .hidden-md{ display:none; } .col-md-12 { width: 100%; } .col-md-11 { width: 91.66666667%; } .col-md-10 { width: 83.33333333%; } .col-md-9 { width: 75%; } .col-md-8 { width: 66.66666667%; } .col-md-7 { width: 58.33333333%; } .col-md-6 { width: 50%; } .col-md-5 { width: 41.66666667%; } .col-md-4 { width: 33.33333333%; } .col-md-3 { width: 25%; } .col-md-2 { width: 16.66666667%; } .col-md-1 { width: 8.33333333%; } } @media only screen and (max-width: 992px){ .container{ width:750px; } .hidden-sm{ display:none; } .col-sm-12 { width: 100%; } .col-sm-11 { width: 91.66666667%; } .col-sm-10 { width: 83.33333333%; } .col-sm-9 { width: 75%; } .col-sm-8 { width: 66.66666667%; } .col-sm-7 { width: 58.33333333%; } .col-sm-6 { width: 50%; } .col-sm-5 { width: 41.66666667%; } .col-sm-4 { width: 33.33333333%; } .col-sm-3 { width: 25%; } .col-sm-2 { width: 16.66666667%; } .col-sm-1 { width: 8.33333333%; } .slogan { font-size: 16px; } } @media only screen and (max-width: 768px){ .container{ width:100%; } .hidden-xs{ display:none; } .col-xs-12 { width: 100%; } .col-xs-11 { width: 91.66666667%; } .col-xs-10 { width: 83.33333333%; } .col-xs-9 { width: 75%; } .col-xs-8 { width: 66.66666667%; } .col-xs-7 { width: 58.33333333%; } .col-xs-6 { width: 50%; } .col-xs-5 { width: 41.66666667%; } .col-xs-4 { width: 33.33333333%; } .col-xs-3 { width: 25%; } .col-xs-2 { width: 16.66666667%; } .col-xs-1 { width: 8.33333333%; } header{ margin-bottom:30px; } .content-wrap { padding: 30px 0; } .slogan{ text-align:center; line-height:22px; margin-bottom:15px; } #logo { text-align:center; margin-bottom:15px; } .btn{ display:block; margin:0 auto; } aside{ width:100%; float:none; padding:0 15px; margin-bottom:30px; } .content-info { padding-right: 15px; padding-left: 15px; } .content-info p, .content-info ul li{ font-size:14px; line-height:22px; } .content-info h3 { font-size: 20px; } h1{ font-size:32px; } h2{ font-size:26px; } h3{ font-size:20px; } h4{ font-size:18px; } h5{ font-size:16px; } h6{ font-size:14px; } .footer-area { margin-top: 30px; padding: 50px 0; font-size:14px; } }