html {
height: 100%;
}
body {
padding: 0px;
margin: 0px;
width: 100%;
font-family: 'Open Sans';
font-size: 15px;
line-height: 28px;
color: #222;
height: 100%;
background-color: #f8f8f9;
overflow-x: hidden;
}
P {
margin: 20px 0px;
}
UL {
margin: 0px;
padding: 0px 0px 0px 20px;
}
UL LI {
padding: 0px 0px 0px 0px;
background: url('/images/arrow.png') left center no-repeat;
}
A {
/*
color: #8e4a00;
color: #ad760a;
color: #00adbd;
color: #0095e5;
*/
color: #004767;
transition: all 0.3s linear;
text-decoration: none;
}
A:hover,
A:focus {
/*
color: #349933;
color: #046996;
*/
color: #095c81;
transition: all 0.3s linear;
text-decoration: none;
}
A.a-opacity {
transition: all 0.2s linear;
}
A.a-opacity:hover {
opacity: 0.9;
transition: all 0.2s linear;
}
IMG.hoveropacity:hover {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
filter: alpha(opacity=80);
-moz-opacity: 0.8;
-khtml-opacity: 0.8;
opacity: 0.8;
}
.container {
position: relative;
max-width: 1200px;
margin: 0px auto;
padding: 0px;
}
.container_ext {
padding: 50px 0px;
}
@media (max-width: 768px) {
.container {
padding-left: 15px;
padding-right: 15px;
}
}
.cHeaderCompact {
background-color: #131718;
height: 70px;
color: #fff;
}
.cHeaderCompactFixed {
width: 100%;
position: fixed;
top: 0px;
z-index: 100;
}
.cHeaderCompactOnlyScroll .cHeaderCompact {
display: none;
}
.cHeaderCompactOnlyScroll .cHeaderCompactFixed {
display: block;
}
.cHeaderCompact .chBlock1 {
font-size: 25px;
font-weight: bold;
margin-left: 20px;
margin-top: 20px;
}
.cHeaderCompact .chBlock1 A,
.cHeaderCompact .chBlock1 A:hover {
color: #fff;
}
.cHeaderCompact .chBlock1 SPAN {
color: #ff5448;
}
.cHeaderCompact .chbQr {
display: inline-block;
margin-right: 20px;
}
.cHeaderCompact .chbQr IMG {
width: 50px;
}
.cHeaderCompact .chbName {
display: inline-block;
margin-top: 20px;
margin-right: 20px;
}
.cHeaderCompact .chbLogout {
display: inline-block;
font-size: 12px;
margin-right: 20px;
}
.cHeaderCompact .chbLogout A {
color: #999;
}
.cHeaderCompact .chBlock2 {
display: inline-block;
width: 50px;
height: 50px;
margin-right: 20px;
}
.cHeaderCompact .chBlock2 IMG {
border: 3px solid #727271;
width: 50px;
height: 50px;
border-radius: 25px;
}
@media screen and (max-width: 768px){
.cHeaderCompact .chbName {
display: none;
}
}
@media screen and (max-width: 400px){
.cHeaderCompact .chbLogout {
display: none;
}
}
.profileTabBox {
padding-bottom: 40px;
}
.profileForm {
}
.profileForm .pfRow {
padding-top: 10px;
padding-bottom: 10px;
}
.profileForm .pfRow:hover {
background-color: #ededf1;
}
.profileForm .pfTitle {
}
.profileForm .pfTitleHint {
font-size: 13px;
line-height: 15px;
font-style: italic;
}
.profileForm .pfInput {
}
.profileForm .pfError {
display: block;
margin-top: 5px;
}
.profileForm .pfPhoto {
float: left;
width: 50px;
/*height: 50px;*/
margin-right: 20px;
margin-top: 15px;
}
.profileForm .pfPhoto IMG {
border: 3px solid #727271;
width: 50px;
height: 50px;
border-radius: 25px;
}
.profileForm .pfPhoto2 {
float: left;
width: 50px;
margin-right: 20px;
margin-top: 15px;
}
.profileForm .pfPhoto2 IMG {
border: 3px solid #727271;
width: 50px;
height: 50px;
border-radius: 5px;
}
@media only screen and (max-width: 768px) {
.profileForm .pfRow {
border-top: 1px solid #eee;
padding-top: 5px;
padding-bottom: 5px;
}
.profileForm .pfTitle {
border: 0px solid blue;
font-size: 13px;
line-height: 15px;
padding-bottom: 2px;
}
.profileForm .pfInput {
border: 0px solid green;
}
.profileForm .pfInput .form-control {
font-size: 13px;
line-height: 15px;
padding-top: 0px;
padding-bottom: 0px;
}
.profileForm .pfInput INPUT {
height: 24px;
}
}
.stndButton1 {
display: block;
color: #fff;
background-color: #ff3745;
border-radius: 10px;
text-align: center;
padding: 10px 20px;
}
.stndButton1:hover {
color: #fff;
background-color: #b6141f;
}
.stndButton2 {
display: inline-block;
color: #fff;
background-color: #ff3745;
border-radius: 20px;
text-align: center;
padding: 5px 20px;
}
.stndButton2:hover {
color: #fff;
opacity: 0.9;
}
.profileComment {
border: 1px solid #dfdfe0;
padding: 20px;
font-size: 13px;
line-height: 20px;
}
.profileTabs {
margin: 50px 0px 0px 0px;
padding: 0px 0px 50px 0px;
}
.profileTabs .pfTabItem {
display: block;
float: left;
width: 100px;
text-align: center;
border: 0px solid red;
outline: 0;
}
.profileTabs .pfTabItemActive {
color: #ff3745;
}
.profileTabs .pfTabItem:hover {
color: #ff3745;
}
.profileTabs .pfTabItem .pfIcon {
height: 50px;
border: 0px solid red;
}
.profileTabs .pfTabItem .pfIcon SPAN {
font-size: 30px;
}
.profileTabs .pfTabItem .pfName {
height: 60px;
line-height: 20px;
font-size: 13px;
}
.profileTabs .pfMenuOpen {
display: none;
}
.profileTabs .pfMenuOpen A {
width: 100%;
}
@media only screen and (max-width: 500px) {
.profileTabs .pfTabItem {
width: 33%;
}
}
@media only screen and (max-width: 768px) {
.profileTabs {
margin-top: 20px;
padding-bottom: 20px;
}
.profileTabs .pfTabItem {
display: none;
}
.profileTabs .pfMenuOpen {
display: block;
}
.pfMenuOpenShow .pfMenuOpen {
display: none;
}
.pfMenuOpenShow .pfTabItem {
display: block;
}
}
.customList {
}
.customListItem {
display: inline-block;
width: 25%;
min-width: 200px;
vertical-align: top;
margin: 0;
padding: 0;
/*
Remove the spaces.
The reason you get the spaces is because, well, you have spaces between the elements.
Tricks choice:
1.
2.
3. Negative margin
You can scoot the elements back into place with negative 4px of margin (may need to be adjusted based on font size of parent). Apparently this is problematic in older IE (6 & 7), but if you don't care about those browsers at least you can keep the code formatting clean.
margin-right: -4px;
*/
margin-right: -4px;
}
.customListItemCol3 {
width: 33%;
}
.customListItemCol5 {
width: 20%;
}
@media only screen and (max-width: 768px) {
.customListItem {
width: 100%;
}
/*
.headerMenuSmall {
display: block;
}
.headerMenu {
display: none;
}
*/
}
.pointItem {
display: block;
background-color: #fff;
border: 1px solid #eee;
padding: 20px 10px;
margin: 10px;
color: #222;
}
.pointItem:hover {
color: #333;
}
.pointItem .piImg {
text-align: center;
font-size: 40px;
color: #f6373c;
}
.pointItem .piImg IMG {
max-height: 60px;
height: 100%;
/*background-color: #0294c9;*/
}
.pointItem:hover .piImg {
color: #095c81;
}
.pointItem:hover .piImg IMG {
/*background-color: #006083;*/
transition: all 0.3s linear;
transform: scale(1.05);
opacity: 0.8;
}
.pointItem .piTitle {
text-align: center;
font-weight: bold;
margin-top: 20px;
margin-bottom: 10px;
line-height: 20px;
min-height: 40px;
}
.pointItem:hover .piTitle {
color: #006083;
}
.pointItem .piText {
text-align: center;
line-height: 20px;
min-height: 90px;
}
@media only screen and (max-width: 768px) {
.pointItem {
padding: 10px;
}
.pointItem .piTitle {
margin-top: 5px;
margin-bottom: 5px;
line-height: 15px;
min-height: 10px;
}
.pointItem .piText {
min-height: 10px;
}
}
/*********************/
.cHeaderMain {
height: 500px;
background: url('/images/immys/bg1.jpg') center center no-repeat;
background-position: cover;
}
.cHeaderMain .chBlock3 {
margin-top: 20px;
text-align: right;
}
.cHeaderMain .chBlock4 {
display: inline-block;
color: #fff;
font-size: 30px;
font-weight: bold;
line-height: 40px;
padding: 10px 20px;
background-color: #000;
margin-top: 250px;
}
.menuMain {
background-color: #000000;
color: #fff;
margin-top: 20px;
padding: 10px 20px;
}
.menuMain A {
color: #fff;
}
.menuMain A:hover {
color: #eee;
}
.menuMain .chBlock1 {
font-size: 25px;
font-weight: bold;
}
.menuMain .chBlock1 SPAN {
color: #ff5448;
}
.menuMain .chBlock2 {
}
.menuMain .chBlock2 A {
margin: 0px 10px;
}
.menuMain .chBlock2 A:hover {
color: #ff5448;
}
@media screen and (max-width: 768px){
.cHeaderMain .chBlock3 {
text-align: center;
}
.menuMain .chBlock1 {
text-align: center;
}
.menuMain .chBlock2 {
text-align: center;
}
.menuMain .chBlock2 A {
white-space: nowrap;
}
}
.indexItem {
display: block;
border: 0px solid red;
}
.indexItem .iiTitle {
font-size: 25px;
line-height: 30px;
padding: 0px 25px;
color: #000;
}
.indexItem .iiText {
padding: 0px 25px;
color: #7c8185;
font-size: 13px;
line-height: 16px;
min-height: 60px;
}
.indexItem IMG {
width: 100%;
}
.footerMain {
background-color: #ffffff;
}
.footerMain .fBlock1 {
display: inline-block;
color: #fff;
font-size: 25px;
font-weight: bold;
background-color: #000;
padding: 10px 20px;
}
.footerMain .fBlock1 SPAN {
color: #ff5448;
}
.footerMain .fBlock2 {
line-height: 20px;
text-align: center;
}
.footerMain .fBlock2 A {
}
.footerMain .sSocItems {
padding: 0px 0px 0px 0px;
text-align: center;
}
.footerMain .sSocItems A {
display: inline-block;
/*float: left;*/
width: 36px;
height: 36px;
border-radius: 18px;
line-height: 36px;
text-align: center;
color: #fff;
font-size: 15px;
background-color: #566c9b;
vertical-align: top;
margin: 0px 10px;
}
.footerMain .sSocItems A:hover {
transform: scale(-1, 1);
transition: all 0.5s linear;
}
.footerMain .sSocItems A.sColor1 {
background-color: #414f91;
}
.footerMain .sSocItems A.sColor2 {
background-color: #4aa2d7;
}
.footerMain .sSocItems A.sColor3 {
background-color: #221d21;
}
@media screen and (max-width: 768px){
.footerMain .fBlock1 {
margin-bottom: 20px;
}
.footerMain .sSocItems {
margin-bottom: 20px;
}
.footerMain .fBlock2 {
margin-bottom: 20px;
}
}
.profileBtnScroll {
display: none;
position: fixed;
bottom: 10px;
right: 10px;
left: 10px;
z-index: 1000;
}
.profileBtnScroll .stndButton1 {
width: 100%;
padding: 0px 10px;
font-size: 10px;
}
.profileBtnScrollVisible {
}
@media screen and (max-width: 768px){
.profileBtnScrollVisible {
display: block;
}
}