/* ----------------------------------------------------------------
	Custom CSS

	Add all your Custom Styled CSS here specifically for the home page
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
	homepage hero slider
-----------------------------------------------------------------*/

.swiper_wrapper .slider-caption h2 { font-size: 34px; font-family: Raleway,sans-serif; text-transform: none; letter-spacing: 0; padding-bottom: 30px; margin-bottom: 30px; }
.swiper_wrapper .slider-caption p { font-family: Lato,sans-serif; font-size: 16px; line-height: 26px; display: block!important; padding-right: 15px; padding-bottom: 25px; }
.swiper_wrapper .slider-caption p img { display: none!important; }
.swiper_wrapper .slider-caption a.button { display: inline-block!important; font-size: 16px; padding: 0 32px; text-transform: none; }
@media (min-width: 480px) {
	.swiper_wrapper .slider-caption h2 { font-size: 48px; padding-bottom: 30px; margin-bottom: 25px; }
	.swiper_wrapper .slider-caption p { font-size: 18px; line-height: 28px; padding-right: 35px; padding-bottom: 30px; }
	.swiper_wrapper .slider-caption p img { display: none!important; }
	.swiper_wrapper .slider-caption a.button { display: inline-block!important; }
}
@media (min-width: 768px) {
	.swiper_wrapper .slider-caption h2 { font-size: 48px; padding-bottom: 0; margin-bottom: 15px; }
	.swiper_wrapper .slider-caption p { font-size: 18px; line-height: 28px; padding-right: 10px; padding-bottom: 5px; }
	.swiper_wrapper .slider-caption p img { display: block!important; }
	.swiper_wrapper .slider-caption a.button { display: inline-block!important; }
}
@media (min-width: 992px) {
	.swiper_wrapper .slider-caption h2 { font-size: 60px; padding-bottom: 0; margin-bottom: 15px; }
	.swiper_wrapper .slider-caption p { font-size: 24px; line-height: 32px; padding-right: 15px; padding-bottom: 5px; }
	.swiper_wrapper .slider-caption p img { display: block!important; }
	.swiper_wrapper .slider-caption a.button { display: inline-block!important; }
}

/* ----------------------------------------------------------------
	promo bar (under slider)
-----------------------------------------------------------------*/
.promo.promo-light { background:#f5f6f9; }

/* ----------------------------------------------------------------
	Homepage: Customer list
-----------------------------------------------------------------*/
#custlist .container .row { margin: 0; padding: 10px 0; position: relative; }
#custlist .container .row .icon-angle { width: 48px; height: 72px; position: relative; background-color: transparent; padding-left: 15px; padding-right: 15px; }
#custlist .container .row .icon-angle-l { text-align: left; float: left; }
#custlist .container .row .icon-angle-r { text-align: right; float: right; }
#custlist .container .row .icon-angle a { width: 18px; height: 72px; color: #999999!important; }
#custlist .container .row .icon-angle a:hover { cursor: pointer; color: #393939!important; }
#custlist .container .row .icon-angle a i { font-size: 48px; width: 18px; height: 72px; }
#custlist .container .row .center { position: absolute; left: 50%; transform: translateX(-50%); width: 75%; }
#custcarousel_lightSlider { list-style: none outside none; padding-left: 0; margin-bottom: 0; }
#custcarousel_lightSlider li { display: block; float: left; margin-right: 6px; cursor: pointer; }
#custcarousel_lightSlider li div.cust-card { position: relative; display: inline-block; height: 75px; margin-left: 5px; margin-right: 5px; }
#custcarousel_lightSlider li div.cust-card.px-260 { width: 208px; img { width: 208px; height: 60px; } }
#custcarousel_lightSlider li div.cust-card.px-216 { width: 173px; img { width: 173px; height: 60px; } }
#custcarousel_lightSlider li div.cust-card.px-86 { width: 69px; img { width: 69px; height: 60px; } }
#custcarousel_lightSlider li div.cust-card img { position: absolute; top: 0; left: 0; }
#custcarousel_lightSlider li div.cust-card .img-top { display: none; z-index: 99; }
#custcarousel_lightSlider li div.cust-card:hover .img-top { display: inline; }
#custcarousel_lightSlider { list-style: none outside none; padding-left: 0; margin-bottom: 0; }
#custcarousel_lightSlider li { display: block; float: left; margin-right: 6px; cursor: pointer; }
.carousel_slider { background-color: #f5f6f9; }
.lSSlideOuter .lSPager { display: none!important; }
@media (min-width: 480px) {
	#custcarousel_lightSlider li div.cust-card.px-260 { width: 260px; img { width: 260px; height: 75px; } }
	#custcarousel_lightSlider li div.cust-card.px-216 { width: 216px; img { width: 216px; height: 75px; } }
	#custcarousel_lightSlider li div.cust-card.px-86 { width: 86px; img { width: 86px; height: 75px; } }
}
@media (min-width: 992px) {
	#custcarousel_lightSlider li div.cust-card.px-260 { width: 260px; img { width: 260px; height: 75px; } }
	#custcarousel_lightSlider li div.cust-card.px-216 { width: 216px; img { width: 216px; height: 75px; } }
	#custcarousel_lightSlider li div.cust-card.px-86 { width: 86px; img { width: 86px; height: 75px; } }
}

/* ----------------------------------------------------------------
	Homepage: why choose ASA Computers
-----------------------------------------------------------------*/
#whychoose { margin-bottom: 100px; }
#whychoose .container .row .lhs p { color: #2461e0; font-family: Lato,sans-serif; font-size: 22px; font-weight: 400; margin-bottom: 10px; }
#whychoose .container .row .lhs h3 { color: black; font-family: Raleway,sans-serif; font-size: 48px; font-weight: 700; }
#whychoose .container .row .rhs { height: 171px; border-left-style:solid; border-width: 1px;  border-color:#d5d6d9; position: relative; }
#whychoose .container .row .rhs .vertical-center { margin: 0; position: absolute; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); padding-left: 40px; }
#whychoose .container .row .rhs .vertical-center p { color: #6b6b6c; font-family: Lato,sans-serif; font-size: 18px; font-weight: 300; line-height: 32px; padding-top: 15px; }

/* ----------------------------------------------------------------
	Homepage: product portfolio grid
-----------------------------------------------------------------*/

#product_portfolio { width: 100%; margin-bottom: 100px; }
#pp_grid { display: grid; width: 285px; grid-template-columns: 100%; background-color: #fafafa; box-shadow: 1px 1px 40px 30px #fafafa; margin-left: auto; margin-right: auto; }
@media (min-width: 480px) {
	#pp_grid { width: 440px; }
}
@media (min-width: 768px) {
	#pp_grid { width: 720px; grid-template-columns: 50% 50%; }
}
@media (min-width: 992px) {
	#pp_grid { width: 940px; grid-template-columns: 33% 33% 33%; }
}
@media (min-width: 1200px) {
	#pp_grid { width: 1140px; grid-template-columns: 33% 33% 33%; }
}
#pp_center {
	margin-left: auto;
	margin-right: auto;
}
.pp-card { display: inline-grid; padding: 0; background-color: #fafafa; }
.pp-itm { background-color: white; margin: 5px; padding: 10px; border-bottom: 5px solid white; min-height: 368px; }
.pp-itm:hover { border-bottom: 5px solid #2461e0; overflow: hidden; }
.pp-itm .pp-hdr h3 { color: black; font-family: Raleway,sans-serif; font-size: 28px; font-weight: 700; }
.pp-itm .pp-txt p { color: #6b6b6c; font-family: Lato,sans-serif; font-size: 18px; font-weight: 300; line-height: 26px; }

/* ----------------------------------------------------------------
	Homepage: Liquid cooling
-----------------------------------------------------------------*/
#liquid { margin-bottom: 80px; width: 100%; }
#liquid .container .row img { float: right; z-index: -1; width: 713px; }
#liq_txt_cnt { margin-left: 0; }
#liquid .container .row p.blu_hdr { color: #2461e0; font-family: Lato,sans-serif; font-size: 22px; font-weight: 400; margin-top: 0; margin-bottom: 40px; }
#liquid .container .row h3 { color: black; font-family: Raleway,sans-serif; font-size: 48px; font-weight: 700; line-height: 1; margin-bottom: 40px; }
#liquid .container .row p { color: #6b6b6c; font-family: Lato,sans-serif; font-size: 18px; font-weight: 300; line-height: 26px; margin-bottom: 40px; }
#liquid .container .row div a span { text-transform: none; }
@media (min-width: 992px) {
	#liq_txt_cnt { margin-left: -50px; padding-left: 0; }
	#liquid .container .row p.blu_hdr { margin-top: 40px; }
}

/* ----------------------------------------------------------------
	Homepage: OEM Manufacturing
-----------------------------------------------------------------*/
#oem_mfg { background:#fff; margin-bottom: 70px; width: 100%; }
#oem_mfg .container .row { margin: 60px 0; }
#oem_mfg .container .row img { margin-top: 40px; }
#oem_mfg .container .row div p.blu_hdr { color: #2461e0; font-family: Lato,sans-serif; font-size: 22px; font-weight: 400; margin-top: 40px; }
#oem_mfg .container .row h3 { color: black; font-family: Raleway,sans-serif; font-size: 48px; font-weight: 700; line-height: 1; }
#oem_mfg .container .row div p { color: #6b6b6c; font-family: Lato,sans-serif; font-size: 18px; font-weight: 300; line-height: 26px; }
#oem_mfg .container .row div a span { text-transform: none; }
@media (min-width: 992px) {
	#oem_mfg .container .row div p.blu_hdr { margin-top: 0; }
}

/* ----------------------------------------------------------------
	Homepage: Data Center consultation and services
-----------------------------------------------------------------*/
#consult_service { background: #000; margin-bottom: 0; width: 100%; }
#consult_service .container .row { margin: 0;  }
#consult_cnt { padding-top: 50px; padding-bottom: 50px; }
#consult_service .container .row div p.blu_hdr { color: #2461e0; font-family: Lato,sans-serif; font-size: 22px; font-weight: 400; margin-top: 40px; }
#consult_service .container .row h3 { color: #fff; font-family: Raleway,sans-serif; font-size: 48px; font-weight: 700; line-height: 1; }
#consult_service .container .row div p { color: #fff; font-family: Lato,sans-serif; font-size: 18px; font-weight: 300; line-height: 26px; }
#consult_service .container .row div a span { text-transform: none; }
#consult_service .container .row .dc_img_cnt { padding-left: 0; padding-right: 0; }
#consult_service .container .row img { width: 100%; height: auto; }
@media (min-width: 992px) {
	/* bootstrap.css: .container width: 970px (override to take full screen, 992px) */
	#consult_service .container { width: 992px; margin-right: 0; padding-right: 0; }
	#consult_service .container .row .dc_img_cnt { height: 100%; }
	#consult_service .container .row img { width: auto; height: 687px; }
}
@media (min-width: 1200px) {
	/* bootstrap.css: .container width: 1170px (must specify, bootstrap.css overriden) */
	#consult_service .container { width: 1170px; margin-right: auto; margin-left: auto; padding-left: 15px; padding-right: 15px; }
	#consult_service .container .row .dc_img_cnt { margin-top: 0; }
}

/* ----------------------------------------------------------------
	Homepage: Partner list
-----------------------------------------------------------------*/
#partnerlist .container .row { margin: 0; padding: 10px 0; position: relative; }
#partnerlist .container .row .icon-angle { width: 48px; height: 72px; position: relative; background-color: transparent; padding-left: 15px; padding-right: 15px; }
#partnerlist .container .row .icon-angle-l { text-align: left; float: left; }
#partnerlist .container .row .icon-angle-r { text-align: right; float: right; }
#partnerlist .container .row .icon-angle a { width: 18px; height: 72px; color: #999999!important; }
#partnerlist .container .row .icon-angle a:hover { cursor: pointer; color: #393939!important; }
#partnerlist .container .row .icon-angle a i { font-size: 48px; width: 18px; height: 72px; }
#partnerlist .container .row .center { position: absolute; left: 50%; transform: translateX(-50%); width: 75%; height: 90px; }
#partcarousel_lightSlider { list-style: none outside none; padding-left: 0; margin-bottom: 0; }
#partcarousel_lightSlider li { display: block; float: left; margin-right: 6px; cursor: pointer; }
#partcarousel_lightSlider li div.part-card { position: relative; display: block; height: 82px; margin-left: auto; margin-right: auto; }
#partcarousel_lightSlider li div.part-card { width: 208px; img { width: 208px; } }
#partcarousel_lightSlider li div.part-card img {  }
#partcarousel_lightSlider { list-style: none outside none; padding-left: 0; margin-bottom: 0; }
#partcarousel_lightSlider li { display: block; float: left; margin-right: 6px; cursor: pointer; }
@media (min-width: 992px) {
	#partcarousel_lightSlider li div.part-card { width: 150px; img { width: 136px; } }
}
@media (min-width: 1200px) {
	#partcarousel_lightSlider li div.part-card { width: 300px; img { width: 275px; } }
}

/* ----------------------------------------------------------------
	Homepage: Announcements - Latest News
-----------------------------------------------------------------*/
#ann_ln { margin-bottom: 0; }
#ann_ln p.blu_hdr { color: #2461e0; font-family: Lato,sans-serif; font-size: 22px; font-weight: 400; }
#ann_ln h3 { color: black; font-family: Raleway,sans-serif; font-size: 48px; font-weight: 700; line-height: 1; margin-top: 0; margin-bottom: 60px; }
#ann_ln .container { height: 470px;  padding: 0; }
#ann_ln .container .row { margin: 0; padding: 10px 5px; position: relative; height: 558px; }
#ann_ln .container .row .center { position: absolute; left: 50%; transform: translateX(-50%); width: 70%; height: 558px; }
#ann_ln .container .row .center .carousel_slider { background-color: #ffffff!important; }
#ann_ln .container .row .icon-angle { width: 48px; height: 72px; position: relative; background-color: transparent; padding-left: 15px; padding-right: 15px; padding-top: 150px; }
#ann_ln .container .row .icon-angle-l { text-align: left; float: left; }
#ann_ln .container .row .icon-angle-r { text-align: right; float: right; }
#ann_ln .container .row .icon-angle a { width: 18px; height: 72px; color: #999999!important; }
#ann_ln .container .row .icon-angle a:hover { cursor: pointer; color: #393939!important; }
#ann_ln .container .row .icon-angle a i { font-size: 48px; width: 18px; height: 72px; }
#newscarousel_lightSlider li { display: block; float: left; margin-right: 6px; cursor: pointer; }
.ann-itm { text-align: center; border: solid 2px #f5f6f9; background-color: #ffffff; }
.ann-itm .ann-img { margin-left: auto; margin-right: auto; margin-bottom: 30px; }
.ann-itm .ann-dt p { color: #2461e0; font-family: Lato,sans-serif; font-size: 16px; font-weight: 400; line-height: 1; margin-bottom: 20px; padding: 0 10px; }
.ann-itm .ann-hdr { height: 100px; }
.ann-itm .ann-hdr h4 { color: black; font-family: Raleway,sans-serif; font-size: 22px; font-weight: 600; line-height: 1.4; margin-bottom: 20px; padding: 0 10px; }
.ann-itm .ann-txt { height: 150px; margin-bottom: 20px; padding: 0 10px; }
.ann-itm .ann-txt p { color: #6b6b6c; font-family: Lato,sans-serif; font-size: 16px; font-weight: 400; line-height: 1.4!important; }
.ann-itm .ann-more a p { color: #2461e0; font-family: Lato,sans-serif; font-size: 14px; font-weight: 400; line-height: 1; text-transform: uppercase; padding: 0 10px; }
@media (min-width: 480px) {
	#ann_ln .container { height: 520px; }
	#ann_ln .container .row { padding: 10px 15px; }
	#ann_ln .container .row .center { width: 75%; }
	#ann_ln .container .row .icon-angle { padding-top: 150px; }
	.ann-itm .ann-hdr { height: 70px; }
	.ann-itm .ann-txt { height: 100px; }
}
@media (min-width: 768px) {
	#ann_ln .container { height: 575px; }
	#ann_ln .container { padding: 0 15px; }
	#ann_ln .container .row .center { width: 65%; }
	#ann_ln .container .row .icon-angle { padding-top: 200px; }
	.ann-itm .ann-hdr { height: 70px; }
	.ann-itm .ann-txt { height: 100px; }
}
@media (min-width: 992px) {
	#ann_ln .container { height: 520px; }
	#ann_ln .container .row .center { width: 85%; }
	#ann_ln .container .row .icon-angle { padding-top: 160px; }
	.ann-itm { text-align: left; }
	.ann-itm .ann-hdr { height: 100px; }
	.ann-itm .ann-txt { height: 150px; }
}
@media (min-width: 1200px) {
	#ann_ln .container { height: 530px; }
	#ann_ln .container .row .center { width: 80%; }
	.ann-itm .ann-txt { height: 150px; }
}

/* ----------------------------------------------------------------
	Homepage: Contact us - Questions?
-----------------------------------------------------------------*/
#contact_q { background: #f5f6f9; margin-bottom: 0; padding-bottom: 50px; }
#topic { padding-left: 10px; padding-top: 5px; padding-bottom: 5px; width: 100%; }
#contact_q .container .row #q_lhs { padding-left: 40px; text-align: left; padding-top: 70px; }
#contact_q .container .row #q_lhs .q-itm div img { padding-right: 8px; padding-bottom: 10px; }
#contact_q .container .row #q_lhs .q-itm .q-hdr p { color: #2461e0; font-family: Lato,sans-serif; font-size: 22px; font-weight: 400; }
#contact_q .container .row #q_lhs .q-itm .q-hdr h3 { color: black; font-family: Raleway,sans-serif; font-size: 48px; font-weight: 700; line-height: 1; }
#contact_q .container .row #q_lhs .q-itm .q-txt p { color: #6b6b6c; font-family: Lato,sans-serif; font-size: 18px; font-weight: 300; line-height: 26px; }
#contact_q .container .row #q_lhs .q-itm span.q-addr { font-weight: 700; }
#contact_q .container .row #q_lhs .q-itm span.q-email { font-weight: 700; }
#contact_q .container .row #q_lhs .q-itm span.q-phone { font-weight: 700; }
#contact_q .container .row #q_rhs { padding-top: 70px; }
#contact_q .container .row #q_rhs div { margin: 0 57px; }
#home-iframe { width: 100%; height: 940px; }

@media (min-width: 480px) {
	#home-iframe { height: 840px; }
}
@media (min-width: 768px) {
	#home-iframe { height: 780px; }
}
@media (min-width: 992px) {
	#home-iframe { height: 800px; }
}
@media (min-width: 1200px) {
	#home-iframe { height: 780px; }
}