* { margin: 0px; padding: 0px; box-sizing: border-box; -webkit-box-sizing: border-box; } html, body { font-family: "Times New Roman", Times, serif; font-size: 14px; line-height: 20px; color: $primary-color1; } input, select, textarea { font-family: "Times New Roman", Times, serif; font-size: 12px; line-height: 12px; color: $primary-color2; border: 0; } body { background: $secondry-color2; -webkit-font-smoothing: antialiased;-webkit-font-smoothing:antialiased; -webkit-text-size-adjust:100%; } img { border: 0px; display: block; max-width: 100%; } a, input { outline: none; } .clear { clear: both; height: 0px; overflow: hidden; } h1,h2,h3,h4,h5,h6 { font-weight: normal; } a { display: block; text-decoration: none; transition: all 0.4s; -webkit-transition: all 0.4s; } a { &:hover { opacity: 0.7; } } input[type='submit'] { transition: all 0.4s; -webkit-transition: all 0.4s; cursor: pointer; } input, select, textarea, button { -webkit-appearance: none; border-radius: 0; -webkit-border-radius: 0; } /* Global */ .centering { padding: 0px 15px; max-width: 1200px; margin: 0 auto; } .centering2 { padding: 0px 15px; max-width: 1040px; margin: 0 auto; } /* section */ #section { position: relative; display: block; width: 100%; min-height: 100%; } /* page wrap */ #page-wrap { margin: 0 auto; width: 100%; } .box-model #page-wrap { max-width: $boxWidth; } .box-model #header-wrap { width: 100%; left: 0; } /* content */ #content-wrap { padding-top: 154px; width: 100%; } /* center */ #center-wrap { width: 100%; } /* footer wrap */ #footer-wrap { width: 100%; background: url('../images/footer_bg.jpg') repeat-x top center; } ul { list-style-type: none; } p { font-family: "Times New Roman", Times, serif; font-size: 12px; line-height: 20px; color: $white-color; letter-spacing: 0.01em; margin-bottom: 10px; } .btn { padding: 3px 10px 6px; display: inline-block; border: 2px solid $white-color; border-radius: 5px; -webkit-border-radius: 5px; color: $white-color; font-size: 12px; line-height: 12px; min-width: 123px; background-color: $primary-color2; &:hover { background-color: $secondry-color1; opacity: 1; } } .black-bg { padding: 25px 0 23px; width: 100%; position: absolute; top: 0; left: 0; overflow: hidden; background-color: rgba(40,33,31,0.8); h2 { font-size: 24px; line-height: 24px; color: $white-color; text-align: center; letter-spacing: 0.01em; text-transform: uppercase; } } input[type='text'], textarea { padding: 5px 10px; width: 100%; height: 30px; border-radius: 5px; -webkit-border-radius: 5px; } textarea { resize: none; } /*css for stiky header*/ .sticky { position: fixed; width: 100%; z-index: 999; box-shadow: 0 0px 3px rgba(0,0,0,0.6); -webkit-box-shadow: 0 0px 3px rgba(0,0,0,0.6); &#header-wrap { padding: 0; height: 60px; .logo { width: 62px; height: 48px; margin-left: -31px; top: 5px; } } } .mm-slideout { position: relative; &:after { position: absolute; content: ''; left: -64px; top: 20px; width: 52px; height: 52px; z-index: 99999; display: block; transition: all 0.4s; -webkit-transition: all 0.4s; cursor: pointer; background: url('../images/mobile_icon4.jpg') no-repeat left top; } } @media only screen and (max-width: 1199px) { .sticky { &#header-wrap { .logo { margin-left: -71px; } } } } @media only screen and (max-width: 1023px) { #content-wrap { padding-top: 113px; } .sticky { &#header-wrap { .logo { margin-left: -32px; } } } } /* All Mobile Sizes (devices and browser) */ @media only screen and (max-width: 767px) { .sticky { &#header-wrap { height: 57px; .logo { width: 56px; height: 44px; margin-left: -28px; } } } } /*mobile menu*/ html.mm-opening .mm-slideout { transform: translate3d(256px, 0px, 0px); -webkit-transform: translate3d(256px, 0px, 0px); } /*.mm-menu .mm-listview > li.mm-selected > a:not(.mm-next), .mm-menu .mm-listview > li.mm-selected > span { background: url('../images/submenu_arrow.png') no-repeat 95% center; }*/ .mm-menu .mm-listview > li.mm-selected > a:not(.mm-next), .mm-menu .mm-listview > li.mm-selected > span { /*position: relative;*/ background-color: $primary-color2; opacity: 1; } .mm-menu .mm-listview > li.mm-selected > a:not(.mm-next):after, .mm-menu .mm-listview > li.mm-selected > span:after { content: none; }