/* 1 Reset Css #res 2 Font Face #face 3 Inputs #input 4 Global Styles #glob 5 Wrappers #wrap 6 Custom CSS #custom 7 Media Query #media */ /*================================= 1 Reset Css ( #res ) =================================*/ html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}body{line-height:1}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}nav ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}a{text-decoration:none;outline:0;margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent;color:#006db7;transition:all 0.5s ease 0s;}ins{background-color:#ff9;color:#000;text-decoration:none}mark{background-color:#ff9;color:#000;font-style:italic;font-weight:700}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ababab;margin:50px auto; padding:0} img {-ms-interpolation-mode: bicubic; border: 0; height: auto; vertical-align: middle; transition:all 0.5s ease 0s;} .ie8 img {height: auto; width: auto\9;} .ie8 img.size-large {max-width: 60%; width: auto;} :hover{transition:all 0.5s ease 0s;} ul{list-style:none; margin:0; padding:0;} li{list-style:none;} #wp-toolbar ul:after{content:none} .last_li , .last{margin-right:0 !important; padding-right:0 !important} .first_li, .first{margin-left:0 !important; padding-left:0 !important} .clearfix:after , ul:after , ol:after , .full_row:after {content:"";display:block;clear:both;visibility:hidden;line-height:0;height:0}html[xmlns] .clearfix{display:block}* html .clearfix{height:1%} /*================================= 2 Font Face ( #face ) =================================*/ /* TypoGraphy */ /* font-family: 'Bobbin'; font-family: 'Trend-Sans-Four'; font-family: 'ANGEL-TEARS'; */ @font-face { font-family: 'Trend-Sans-Four'; src: url('../fonts/TrendSansFour.woff2') format('woff2'), url('../fonts/TrendSansFour.woff') format('woff'); font-weight: 500; font-style: normal; font-display: swap; } @font-face { font-family: 'Bobbin'; src: url('../fonts/Bobbin-Bold.woff2') format('woff2'), url('../fonts/Bobbin-Bold.woff') format('woff'); font-weight: bold; font-style: normal; font-display: swap; } @font-face { font-family: 'ANGEL-TEARS'; src: url('../fonts/ANGELTEARS-trial.woff2') format('woff2'), url('../fonts/ANGELTEARS-trial.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'Bobbin'; src: url('../fonts/Bobbin-Regular.woff2') format('woff2'), url('../fonts/Bobbin-Regular.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap; } /*================================= 3 Inputs ( #input ) =================================*/ input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance:none; margin:0;} ::-webkit-input-placeholder {color:#343434; font-style:normal;} :-moz-placeholder {color:#343434; font-style:normal;} ::-moz-placeholder {color:#343434; font-style:normal;} :-ms-input-placeholder {color: #343434; font-style:normal;} button::-moz-focus-inner {border: 0} :focus {outline:none;} ::-moz-focus-inner {border:0;} input[type=number] {-moz-appearance:textfield} input[type=number]::-webkit-outer-spin-button, input[type=number]::-webkit-inner-spin-button {-webkit-appearance: none; margin: 0} input[type=submit]{padding:12px 20px; background:red; font-weight:normal; color:#fff; display:block; margin:0 auto} input[type=submit]:hover{color: #EF3B42 !important;} input[type=submit] , input[type=button]{cursor:pointer; border:0} input:focus{outline:none;} body textarea{resize:none; height:270px; font-size: 16px;font-style:italic; color:#656565; line-height:31px; padding: 10px 5px 0 10px; border-color:#b7b7b7; } input[type="text"], input[type="tel"], input[type="password"], input[type="date"], input[type="email"], input[type="number"], textarea{background:#f8f7f7; border: 1px solid #d6d5d2; border-radius:0; color: #343434; font-size: 21px; font-weight: 400; line-height: 26px; width:100%; height:50px; padding:5px 15px; box-shadow:none; -webkit-appearance:none} input[type="text"]:focus, input[type="tel"]:focus, input[type="password"]:focus, input[type="date"]:focus, input[type="email"]:focus, input[type="number"]:focus, textarea:focus { background:#eee !important; box-shadow: 0 1px 1px rgb(0 0 0 / 8%) inset, 0 0 8px rgb(102 175 233 / 60%);} form label{color: #006db7; font-size: 16px; display: block; font-weight: 900; margin-bottom:10px; text-transform:uppercase} .form_row{padding-bottom:25px} .form_row.msg_row{padding-bottom:10px} .form_row.submitrow{padding-bottom:0} input:required{box-shadow:none} /*input:required:focus{background-color: rgba(223, 73, 73, 0.2); border: 1px solid #df4949; box-shadow:none} */ *{-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;} /*================================= 4 Global Styles (#glob) =================================*/ /* Gobal #GAB */ .x:before {position:absolute; content:''} /* Vertical Middle */ .x:before /*Parent Before*/ {content: ''; display: inline-block; height: 100%; vertical-align: middle; margin-right: -0.25em} .x /* Child class */ {display: inline-block; vertical-align: middle} /* HR Rules */ hr{} /* Image Alignment */ .alignnone , a img.alignnone {margin: 5px 0 50px} .aligncenter, div.aligncenter {display: block; margin: 5px auto 60px auto} .alignright , a img.alignright{float:right; margin: 5px 0 60px 60px} .alignleft , a img.alignleft {float: left; margin: 5px 60px 60px 0} a img.aligncenter {display: block; margin-left: auto; margin-right: auto} h1 , h2 , h3 , h4 , h5 , h6{} h1{} h2{} h3{} h4{} h5{} h6{} p , .content_row ul li, .content_row ol li{font-size: 24px; text-align: justify; text-transform: uppercase; line-height: 47px; color: #534741 !important; margin-bottom: 35px;} p:last-child{margin-bottom:0} p.intro{color: #666; font-size: 24px; font-weight: 300; line-height: 34px; margin-bottom:20px} p a{color:#006db7; font-weight:bold} p strong{font-weight:900} p em{font-style:italic} p a:hover{text-decoration:underline} .content_row ul , .content_row ol{padding-bottom:35px} .content_row ul li, .content_row ol li{margin-bottom:5px; position:relative; color:#343434} .content_row ul li{padding-left:40px} .content_row ul li:before { content: "•"; font-weight: bold; left: 0; position: absolute; } .content_row ol{counter-reset: section} .content_row ol li{padding-left:40px} .content_row ol > li:before { content:counter(section, decimal) "."; counter-increment:section; padding-right:5px; position:absolute; left:0} a:focus, a:hover{outline:none; text-decoration:none;} .visible_tab{display:none} /* ================================= 5 Wrappers #wrap ================================= */ body{background:#333; font-family: 'Bobbin'; line-height: 1; color:#343434} .container{max-width:1170px; width:100%} .small_container{max-width:850px; margin:0 auto; float:none} .site_full{max-width:1920px; margin:0 auto; position:relative; padding: 0 15px;} /* ================================= 6 Custom CSS #custome ================================= */ h1{ } h2{ font-size: 55px; line-height: 65px; color: #ec3d47; font-weight: 700; } h2.h2{ font-size: 160px; line-height: 100px; font-weight: 700; font-family: 'ANGEL-TEARS'; margin-bottom: 30px; } h3{ font-size: 108px; line-height: 108px; font-family: 'Trend-Sans-Four'; color: #fff; margin-bottom: 30px; } header.sticky .logo a img{ max-width: 180px; } .about_band,.who_we_are_band,.the_kc_brands_band,.did_you_know_band,.contact_band { background-image: url(../images/body_img.jpg); background-size: cover; background-position: center; } img{ max-width: 100%; } header{ padding: 30px 0; position: fixed; top: 0; width: 100%; left: 0; z-index: 999; transition: all 0.5s ease 0s !important; } header ul li{ display: inline-block; } header .row{ align-items: center; } header .header_menu{ text-align: right; } header .header_menu ul li{ margin: 0 2px; } header .header_menu ul li a{ font-size: 20px; line-height: 26px; color: #fff; padding: 10px 12px; border: 1px solid transparent; border-radius: 5px; text-transform: uppercase; letter-spacing: 0.01em; display: inline-block;} header .header_menu ul li.active a{ background-color:transparent; border-color: #fff; color:#EF3B42; } header .header_menu ul li.active a:hover{ background-color:#EF3B42 ; border-color: #fff; color: #fff; } header .header_menu ul li a:hover{ background-color:#EF3B42 ; border-color: #fff; } header .logo a{ display: inline-block; } header .logo a img{ display: inline-block; max-width: 100%; } header.sticky{ padding: 15px 0; background-color: #000;; } .error404 header{background-color: #000;} .error404 header .header_menu ul li.active a{ color: #fff; border: 1px solid #EF3B42;} .mo_menu { position: fixed; top: 0; left: 0; background-color: transparent; width: 100%; padding: 5px 15px; display: none; z-index: 999; transition: all 0.5s ease 0s; } .mo_menu.sticky{ background-color: #000; } .mo_menu img{ max-width: 160px; } .mo_menu ul{ display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; align-items: center;} .mo_menu ul li{ -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .mo_menu ul li:last-child{ text-align: right; } .mo_menu ul li a{ font-size: 17px; line-height: 17px; color: #fff; font-weight: 700; text-transform: uppercase; color: #fff; } .mm-menu { background: #000; } .mm-listview > li > a, .mm-listview > li > span{ font-size: 16px; line-height: 24px; } .mm-navbar .mm-title{ font-size: 16px; line-height: 20px; padding-left: 45px; } .mm-btn.mm-prev , .mm-btn.mm-next{ background-color: transparent !important; } .mo-menu i{ margin-left: 5px; transition: all 0.5s ease 0s; } .mm-opened .mo_menu i.fa-bars:before{ content: "\f061" !important; } header .header_menu ul li a.active { color: #EF3B42 !important; background-color: transparent; border: 1px solid #f5f5f5;} .space{ padding: 100px 0; } iframe{ width: 100%; } .title_img{ text-align: center; margin-bottom: 40px; } .title_img img{ max-width: 700px; max-height: 250px } .parallax_band{text-align: center;background-position: center;background-size: cover;background-repeat: no-repeat;} .parallax_band h2{ color: #fff; } .parallax_band h3{ margin-bottom: 0; } .team_member_list{ margin-top: 60px; } .team_member_list ul{ display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-right: -15px; margin-left: -15px; } .team_member_list ul li{ -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; padding: 0 15px; } .team_member_list a{ display: inline-block; width: 100%; } .who_we_are_wrapper .who_we_are_content{ display: none; } .the_kc_brands_list{ margin-top: 60px; } .the_kc_brands_list ul{ display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-right: -15px; margin-left: -15px; } .the_kc_brands_list ul li{ -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; padding: 0 15px; } .the_kc_brands_list a{ display: inline-block; width: 100%; } .the_kc_brands_band .the_kc_brands_content{ display: none; } /*Homepage css*/ .home .about_bottom_image { text-align: center; margin-top: 25px;} .contact_content p{margin-bottom: 0; line-height: 47px; text-align: center; font-size: 24px; color: red !important;} .contact_content address{ line-height: 47px; text-align: center; position: relative; font-size: 24px;} .contact_band address:before{content: '\f3c5'; font-family: "Font Awesome 5 Brands" , "Font Awesome 5 free"; font-weight: 700; display: block; font-size: 61px; line-height: 61px;color: #ea3b45;margin-bottom: 10px;} .contact_band p a {color: #534741;font-weight: 400;} .wpcf7-form input[type="text"], input[type="tel"], input[type="password"], input[type="date"], input[type="email"], input[type="number"], textarea{background: none repeat scroll 0 0 #fff;border: medium none;border-radius: 1px;color: #696969;font-size: 16px; font-weight: 400; height: 50px;outline: 0 none;padding: 5px 5px 5px 10px;transition: background 0.25s ease-in-out 0s;width: 100%;max-width: 555px;} .wpcf7-form{text-align: center; margin-top: 15px;} .wpcf7-form-control {font-family: 'Open Sans', sans-serif;} .wpcf7-form input[type="submit"]{color: #3b3f50;margin: 15px 0 15px 25px;padding: 12px 5px;width: 100%;max-width: 555px;font-size: 16px;margin: 0 auto;} .form-group input[type="submit"]{background-color: #e2e2e2 !important;border: 1px solid #000 !important;} .wpcf7 form .wpcf7-response-output{max-width: 555px;margin: 0 auto;} .contact_band {padding-bottom: 0;} footer {background: rgba(0, 0, 0, 1) url(../images/footer-bg.jpg) no-repeat scroll 0 0 !important;} footer .footer_logo{opacity: 1;top: 0px;}footer img.custom-logo{ margin-bottom: 30px; padding-top: 30px;} footer .footer_band .row{margin-top: 40px;}.social_media li a {height: 44px;width: 44px;background-color: #f8f9fa;border-radius: 50px;padding: 5px; display: flex;align-items: center;justify-content: center;font-size: 20px;color: #000; }.social_media ul{display: flex;}.social_media li{margin: 0 10px;} .footer_band{ text-align: center;} footer .footer_band .col-md-3{border-left: 1px solid #ec3d47;} footer .footer_band .col-md-4{border-left: 1px solid #ec3d47;} .social_media, .footer_menu {height: 100%;align-items: center;display: flex;justify-content: center;} footer .footer_menu li a{color: #fff;letter-spacing: 1px;font-size: 15px;}footer .footer_menu li{margin-bottom: 10px;} footer .footer_menu li a:hover{color: #ef4142;} footer .copyright p {color: #fff !important; font-family: "Helvetica Neue",Helvetica,Arial,sans-serif !important; font-size: 14px; text-transform: none !important;margin: 0 0 0 35px; text-align: left;padding: 0;line-height: 36px;} .copyright .textwidget{ display: inline-block; } .copyright .textwidget img{ max-width: 80px;margin: 0px 10px;float: right; } .copyright .textwidget p a{color: #fff; text-decoration: none;} .the_kc_brands_band .bottom_image{text-align: center;margin-top: 140px;} .did_you_know_content h2{text-align: center; font-weight: 400;} div.pp_woocommerce .pp_close:before {content: "\f00d" !important;font-family: "Font Awesome 5 Brands" , "Font Awesome 5 free" !important;font-weight: 700;font-size: 14px;} div.pp_woocommerce .pp_loaderIcon:before{background: url(../images/loader.svg) center center/cover !important;} .maphilighted{ margin: 0 auto !important;} #img_mapped_one{ text-align: center;} .cow_map .bottom_image img{ display: block;text-align: center;margin: 40px auto 0;} .cow_map {margin-top: 70px;} .social_media li a:hover{color: black;background-color: red;} .angle_text{ font-family: 'ANGEL-TEARS' !important; } .trend_text{ font-family: 'Trend-Sans-Four'; } .did_you_know_band .row{ margin-bottom: 30px; } .did_you_know_band .row h2{ font-size: 50px; font-weight: 400; text-align: right; } .page_title_band{padding:15px 0;background-color: #fff;} .title_band{ padding-top: 230px;background-color: #fff;} .title_band h1{font-size: 20px;color: #000;padding-bottom: 5px;font-size: 89px;line-height: 95px;} .page-not-found a{ border-radius: 4px; background-color: #EF3B42; color: #fff; font-size: 20px;border: 1px solid #EF3B42;} .page-not-found a:hover{background-color: #000;color: #fff;} .single_band{padding: 60px 0;} .error404 {background-color: #fff;} footer{ display: inline-block; width: 100%; } .copyright{ padding: 30px 0; } .cow_map img{ max-width: 100%; } .swipe{ display: none; } /* ================================= 7 Media Query #media ================================= */ /********************************* Mobile Potrait #MP ********************************/ @media screen and (max-width: 320px) and (orientation: portrait) {} /********************************* Mobile Potrait ********************************/ @media screen and (max-width: 480px) and (orientation: portrait) {} /********************************* Mobile landscape ********************************/ @media screen and (max-width: 480px) and (orientation: landscape) {} /* ================================= Common For All mobile definitions #mx ================================= */ @media all and (max-width: 767px) { .main_header{ display: none; } .mo_menu{ display: block; } html * {max-height:1000000px} .x {display:none} h1{font-size:28px; line-height:normal} h2{font-size:30px;line-height: 42px;} h3{font-size:45px;line-height: 78px;} h4{font-size:18px} p, .content_row ul li, .content_row ol li{font-size:18px; line-height:24px} p.intro{font-size:20px; line-height:30px} .space{padding: 60px 0;} .title_img img {max-width: 340px;} .home .about_bottom_image{ margin-top: 40px;max-width: 300px;} .the_kc_brands_band .bottom_image{ margin-top: 40px;} .who_we_are_band .team_member_list ul li{ flex: 0 0 100%; max-width: 100%;padding: 15px;text-align: center;} .who_we_are_band .team_member_list ul li img {max-width: 250px;} .the_kc_brands_band .the_kc_brands_list ul li{ flex: 0 0 100%; max-width: 100%;padding: 15px;text-align: center;} .the_kc_brands_band .the_kc_brands_list ul li img{max-width: 200px;} footer .footer_band .social_media ul{padding-bottom: 30px;} .did_you_know_band .row h2{text-align: center;font-size: 30px;} button.aicon_link{ top: 78px; } .cow_map .container{ padding: 0; } .swipe{ display: block; text-align: center; } #img_mapped_one , #img_mapped_one .maphilighted{ overflow: auto; } .accessibility-location-right .accessability_container{ transition: all 0.5s ease 0s; } .accessibility-location-right.mfp-zoom-out-cur .accessability_container{ z-index: 1; } /* Image Alignment */ .alignnone , a img.alignnone , .aligncenter, div.aligncenter , .alignright , a img.alignright , .alignleft , a img.alignleft{margin: 30px auto; float:none} } /********************************* ipad portrait #ip ********************************/ @media only screen and (min-width : 768px) and (max-width: 1024px) { .main_header{ display: none; } .mo_menu{ display: block; } button.aicon_link{ top: 78px; } .swipe{ display: block; text-align: center; } #img_mapped_one , #img_mapped_one .maphilighted{ overflow: auto; } .accessibility-location-right .accessability_container{ transition: all 0.5s ease 0s; } .accessibility-location-right.mfp-zoom-out-cur .accessability_container{ z-index: 1; } h3 { font-size: 88px; } .did_you_know_band .row h2 { font-size: 40px; line-height: 50px; } .hidden-tab {display:none} /* Image Alignment */ .alignnone , a img.alignnone , .aligncenter, div.aligncenter , .alignright , a img.alignright , .alignleft , a img.alignleft{margin: 30px auto; float:none} .visible_tab{display:block !important} .trend_text{ font-family: 'Trend-Sans-Four'; } } /********************************* ipad landscape #il ********************************/ @media only screen and (min-width : 1001px) and (max-width: 1024px) { } @media only screen and (min-width : 1025px) and (max-width: 1100px) { } /* ================================= Small Computer #Sc ================================= */ @media only screen and (min-width : 1300px) { .first_col , .first_li{padding-left:0 !important; margin-left:0 !important} .trend_text{ font-family: 'Trend-Sans-Four'; } .last_col , .last_li{padding-right:0 !important; margin-right:0 !important} } /* ================================= Large Computer #lc ================================= */ @media screen and (min-width: 1450px) {} /* IE10 Only CSs */ @media screen and (min-width:0\0) {} /* ie10, ie11+ */ @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {}