/*common css*/

*{
	margin: 0;
	padding: 0;
	
	font-size: 16px;
	line-height: 26px;
	
}
body{
	min-width: 320px !important;
	background-color: #fff;
}
	/*custom fonts*/
		

	/*fonts class*/
		.font-montserrat{
			font-family: 'Montserrat', sans-serif;
		}
		.font-opensans{
			font-family: 'Open Sans', sans-serif;
		}
	
	/*font size*/
		.font-8, .font-8 a, .font-8 p, p.font-8{
			font-size: 8px !important;
		}
		.font-10, .font-10 a, .font-10 p, p.font-10{
			font-size: 10px !important;
		}
		.font-12, .font-12 a, .font-12 p, p.font-12{
			font-size: 12px !important;
		}
		.font-14, .font-14 a, .font-14 p, p.font-14{
			font-size: 14px !important;
		}
		.font-18, .font-18 a, .font-18 p, p.font-18{
			font-size: 18px !important;
		}
		.font-20, .font-20 a, .font-20 p, p.font-20{
			font-size: 20px !important;
		}
		.font-22, .font-22 a, .font-22 p, p.font-22{
			font-size: 22px !important;
		}
		.font-24, .font-24 a, .font-24 p, p.font-24{
			font-size: 24px !important;
		}
		.font-28, .font-28 a, .font-28 p, p.font-28{
			font-size: 28px !important;
		}
		.font-32, .font-32 a, .font-32 p, p.font-32{
			font-size: 32px !important;
		}
		.font-42, .font-42 a, .font-42 p, p.font-42{
			font-size: 42px !important;
		}
		.font-48, .font-48 a, .font-48 p, p.font-48{
			font-size: 48px !important;
		}
	
	
	/*font line height*/
		.line-height-32{
			line-height: 32px !important;
		}
		.line-height-38{
			line-height: 38px !important;
		}
		.line-height-48{
			line-height: 48px !important;
		}
	
	/*letter spacing*/
		.letter-spacing{
			letter-spacing: 2px !important;
		}
		
	/*color class*/
		.color-zo-blue, .color-zo-blue p, p .color-zo-blue, .color-zo-blue a, a .color-zo-blue, th.color-zo-blue{
			color: #0C3C96 !important;
		}
		.color-zo-green, .color-zo-green p, p .color-zo-green, .color-zo-green a, a .color-zo-green, th.color-zo-green{
			color: #27AC69 !important;
		}
		.color-white, .color-white p, p .color-white, .color-white a, a .color-white, th.color-white{
			color: #fff !important;
		}
		.color-red, .color-red p, p .color-red, .color-red a, a .color-red{
			color: #dd241b !important;
		}
		.color-blue, .color-blue p, p .color-blue, .color-blue a, a .color-blue{
			color: #314a5b !important;
		}
		.color-pink, .color-pink p, p .color-pink, .color-pink a, a .color-pink{
			color: #fa5c65 !important;
		}
		.color-lite-blue, .color-lite-blue p, p .color-lite-blue, .color-lite-blue a, a .color-lite-blue{
			color: #9aa0ab !important;
		}
		.color-lite-dark{
			color: #e7e7e7 !important;
		}
		.color-gray{
			color: #767c7e !important;
		}
		.color-black, .color-black a, .color-black p{
			color: #000 !important;
		}
		
	/*background color class*/
		.bkg-zo-blue{
			background: #0C3C96;
		}
		.bkg-zo-green{
			background: #27AC69;
		}
		.bkg-gray{
			background: #e7e7e7;
		}
		.bkg-white{
			background: #fff;
		}
		.bkg-black{
			background: #000;
		}
		.bkg-yellow{
			background-color: #fde52c;
		}
		.bkg-blue{
			background-color: #283891;
		}
		.bkg-lite-dark{
			background-color: #1a1a1a;
		}
		.bkg-dark-blue{
			background-color: #002e5b;
		}
		
	/*border color class*/
		.border-lite-blue {
			border-color: #9aa0ab !important;
		}
		
	/*hr slyle*/
		hr.no-margin{
			margin-top: 0 !important;
			margin-bottom: 0 !important;
		}
		hr.hr-margin-top-20{
			margin-top: 25px !important;
		}
		hr.hr-margin-25-35{
			margin-top: 25px !important;
			margin-bottom: 35px !important;
		}
		.hr-2x{
			border-top: 2px solid #e7e7e7 !important;
		}
		.hr-1x-black{
			border-top: 1px solid #9aa0ab !important;
		}
		.hr-1x-gray{
			border-top: 1px solid #3a3b3f !important;
		}
		.hr-3x-style{
			margin-bottom: 20px !important;
			border-top: 3px solid #ce242c;
		}
		.hr-width-75{
			width: 75% !important;
		}
		.hr-width-50{
			width: 50% !important;
		}
		
	/*link style & class*/
		a{
			text-decoration: none !important;
		}
		a:hover{
			text-decoration: none !important;
		}
		.hover a:hover{
			color: #2d5da9 !important;
		}
		
	/*list style & class*/
		ul>li{
			list-style: none;
		}
		ul.have-style>li {
			list-style-type: inherit !important;
		}
		
		
	/*margin class*/
		.margin-bottom-20{
			margin-bottom: 20px !important;
		}
		.margin-top-25{
			margin-top: 25px !important;
		}
		.margin-auto {
			margin-left: auto !important;
			margin-right: auto !important;
		}
		
	/*border style*/
		.border-bottom{
			border-bottom: 1px solid #1953b0 !important;
		}
	
	/*box shadow*/
		.div-box-shaddow{
			margin: 15px;
			border-radius: 5px;
			background-color: #474545;
			box-shadow: 10px 10px 5px #111d30;
		}
		
	/*opacity*/
		.opacity8-zo-blue {
			background: rgba(12,60,150, 0.8);
		}
		.opacity8-zo-green {
			background: rgba(39,172,105, 0.8);
		}
		.opacity-5{
			opacity: 0.5 !important;
		}
		.no-opacity{
			opacity: 1 !important;
		}
		.white-opecity {
			background: rgba(255,255,255, 0.7);
		}
		.bkg-opc-dark {
			background: rgba(0,0,0, 0.5);
		}
		.bkg-opc-light-blue {
			background: rgba(233,235,242, 0.6);
		}
		
	
	/*help*/
		
		.star{
			color: red;
		}
		.help-block, .help-block-any {
			font-size: 10px !important;
		}
		
	/*bkg-position*/
		.bkg-position{
			background-position: center center;
			background-size: cover;
			background-repeat: no-repeat;
			transition: all .3s ease-out .3s;
		}
		.bkg-position-top{
			background-position: center top !important;
		}
		.bkg-position-bottom{
			background-position: center bottom !important;
		}
		.bkg-position-bottom-right{
			background-position: bottom right !important;
		}
		.bkg-position-bottom-left{
			background-position: bottom left !important;
		}
		.bkg-position-top-left{
			background-position: top left !important;
		}
		.bkg-position-center-left{
			background-position: center left !important;
		}
		
	/*button*/
		.btn{
			border-radius: 0 !important;
		}
		.btn-outline-zo-blue {
			color: #fff;
			background-color: #0c3c96;
			background-image: none;
			border-color: #0c3c96;
		}
		.btn-outline-zo-blue:hover {
			color: #0c3c96;
			background-color: #fff;
			background-image: none;
			border-color: #0c3c96;
		}
		.btn-outline-zo-green {
			color: #fff;
			background-color: #27ac69;
			background-image: none;
			border-color: #27ac69;
		}
		.btn-outline-zo-green:hover {
			color: #27ac69 !important;
			background-color: #fff;
			background-image: none;
			border-color: #27ac69;
		}
		.btn-outline-white {
			color: #fff;
			background-color: transparent;
			background-image: none;
			border-color: #fff;
		}
		.btn-outline-white:hover {
			color: #27ac69;
			background-color: transparent;
			background-image: none;
			border-color: #27ac69;
		}
		.btn-outline-pink {
			color: #fff;
			background-color: #fa5c65;
			background-image: none;
			border-color: #fa5c65;
		}
		.btn-outline-black {
			color: #fff;
			background-color: #000;
			background-image: none;
			border-color: #fa5c65;
		}
		
	/*paragrap title*/
		.p-title{
			font-size: 32px;
			font-weight: bold;
			line-height: 38px !important;
		}
		@media all and (max-width:992px) { 
			.p-title{
				font-size: 28px;
				line-height: 32px !important;
			}
		}
		@media all and (max-width:767px) { 
			.p-title{
				font-size: 22px;
			}
		}
		
	.div-height{
		height: 700px !important;
	}
	@media all and (max-width:992px) { 
		.div-height{
    		height: 500px !important;
    	}
	}
	@media all and (max-width:767px) { 
		.div-height{
    		height: 400px !important;
    	}
	}
	
	.invalid-feedback {
		display: block !important;
	}
	
	.contact-btn-num {
		display: none;
	}
	
/*common css end*/


/*header*/
	#main-content>header.header_scroll_bkg{
		background-color: rgba(255,255,255,.9) !important;
		transition: all .3s ease-out .3s;
	}
	#logo>img.logo{
		height: 65px;
		transition: all .3s ease-out .3s;
	}
	#main-content>header.header_scroll_bkg #logo>img.logo{
		height: 50px;
		transition: all .3s ease-out .3s;
	}
	.navbar-light .navbar-nav .active > .nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show > .nav-link {
		color: #27AC69 !important;
	}
	.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover {
		color: #27AC69 !important;
	}
	.navbar-toggler {
		color: rgba(39,172,105,.9) !important;
		border-color: rgba(39,172,105,.9)!important;
	}
	.navbar-light .navbar-toggler {
		color: rgba(39,172,105,.9) !important;
		border-color: rgba(9,172,105,.9)!important;
		border-radius: 0px !important;
	}
	
	.navbar>.show>.navbar-nav>li>a, .navbar>.show>.navbar-nav>li.show>.show>a{
		
	}
	
	/*hover nav dropdown*/
	
	@media all and (min-width:1200px) { 
		#header_login{
			padding-left: 25px;
		}
	}
	
	@media all and (min-width: 992px){
		
		.dropdown-menu {
			padding: .5rem 0;
			margin: 0px !important;
			background-color: rgba(255,255,255,1);
			border: 1px solid rgba(0,0,0,.15);
			border-radius: 0px !important;
			transition: visibility 0s, opacity 0.3s linear;
		}
		.dropdown:hover .dropdown-menu {
			display: block;
		}
		.nav-link {
			padding-bottom: 0px !important;
		}
	}
	
	@media all and (max-width:1200px) { 
		#navigation>li>a{
			font-size: 15px;
		}
	}
	
	@media all and (max-width:991px) { 
		#logo>img.logo{
			height: 40px;
		}
		#main-content>header.header_scroll_bkg #logo>img.logo{
			height: 40px;
		}
		#main-content>header{
			background-color: rgba(255,255,255,.9) !important;
			transition: all .3s ease-out .3s;
		}
	}
	
	@media all and (max-width:767px) { 
		
		.navbar>.show>.navbar-nav, .navbar>.show>.navbar-nav .dropdown-menu{
			
		}
	}
	@media all and (max-width:600px) { 
	
	}
	
	@media all and (max-width:375px) { 
		#logo>img.logo{
			height: 30px;
		}
		#main-content>header.header_scroll_bkg #logo>img.logo{
			height: 30px;
		}
	}
	
	
	

	
/*home*/
	.home-sec1{
		background-image: url(https://zoitsupport.ca/images/background/zo-it-support-windows-server-bkg5.jpg);
	}
	.home-sec1-content{
		transition: all .3s ease-out .3s;
	}
	.home-sec1-content .details{
		padding-top: 200px;
		Padding-left: 100px;
		Padding-bottom: 100px;
		transition: all .3s ease-out .3s;
	}
	.home-sec1-content .details .title{
		font-size: 40px;
		font-weight: 700;
		line-height: 58px;
		transition: all .3s ease-out .3s;
	}
	.home-sec1-content .details .title>span{
		font-size: 30px;
		font-weight: 300;
		line-height: 58px;
		transition: all .3s ease-out .3s;
	}
	.home-sec1-content .details .sub-title{
		font-size: 28px;
		font-weight: 300;
		line-height: 38px;
		transition: all .3s ease-out .3s;
	}
	
	.home-sec3{
		background-image: url(https://zoitsupport.ca/images/background/zo-it-support-retail-network-rack-bkg7.jpg);
	}
	.home-sec3 p.features{
		font-size: 32px;
		font-weight: 900;
		line-height: 48px;
		transition: all .3s ease-out .3s;
	}
	.features-box{
		background-color: rgba(255,255,255,.9) !important;
		margin: 5px;
	}
	.features-box:hover{
		background-color: rgba(39,172,105,.9) !important;
	}
	.features-box:hover .home-sec3-contents>p.features-title, .features-box:hover .home-sec3-contents>p.features-p1{
		color: #fff !important;
	}
	.industries-title{
		font-size: 32px;
		font-weight: 900;
		line-height: 48px;
		transition: all .3s ease-out .3s;
	}
	.industries-name{
		font-weight: bold;
	}
	.home-sec5-p1{
		font-size: 32px;
		font-weight: 700;
		line-height: 48px;
	}
	.home-sec6-p1{
		font-size: 24px;
		font-weight: 200;
		line-height: 48px;
	}
	.benefites-box{
		
	}
	.home-sec5-contents p{
		
	}
	
	.home-services-div h2{
		text-align: center;
		font-size: 32px;
		font-weight: 200;
		line-height: 48px;
	}
	.home-services-div .service{
		background-color: #0C3C96;
		padding: 10px;
		color: #ffffff;
	}
	.home-services-div .service h4{
		text-align: center;
		padding: 15px 0;
	}
	
	@media all and (max-width:1199px) { 
		.home-sec1-content .details .title{
    		font-weight: 600;
    	}
	}
	@media all and (min-width:992px) { 
		
	}
	
	@media all and (max-width:992px) { 
		.home-sec1-content .details{
			padding-top: 100px;
			Padding-left: 50px;
			Padding-bottom: 50px;
		}
		.home-sec1-content .details .title{
			font-size: 30px;
			line-height: 50px;
		}
		.home-sec1-content .details .title>span{
    		font-size: 28px;
    		line-height: 58px;
    	}
		.home-sec1-content .details .sub-title{
			font-size: 26px;
			line-height: 38px;
		}
	}
	@media all and (max-width:767px) { 
	    .home-sec1-content .details{
    		Padding-left: 50px;
    	}
	    .home-sec1-content .details .title{
			font-size: 24px;
			font-weight: bold;
			line-height: 38px;
		}
		.home-sec1-content .details .title>span{
    		font-size: 16px;
    		line-height: 38px;
    	}
		.home-sec1-content .details .sub-title{
			font-size: 16px;
			line-height: 28px;
		}
		.contact-btn-txt {
    		display: none;
    	}
    	.contact-btn-num {
    		display: block;
    	}
	}
	@media all and (max-width:420px) { 
		.home-sec1-content .details{
			padding-top: 80px;
			Padding-left: 25px;
			Padding-bottom: 50px;
		}
		
		.industries-title{
			font-size: 28px;
			font-weight: 700;
			line-height: 38px;
		}
		.industries-name{
			font-size: 14px;
			font-weight: bold;
		}
	}
	
/*common page style*/
	.page-title{
		transition: all .3s ease-out .3s;
		padding-top: 100px;
		
	}
	.page-title>p.title{
		font-size: 32px;
		line-height: 58px;
		font-weight: bold;
	}
	
/*why-us*/
	.about-sec3-p1{
		font-size: 32px;
		font-weight: 700;
		line-height: 42px;
	}


/*contact*/
	.contact-sec1{
		
	}
	
	
/*footer*/
	.footer{
		padding: 50px 0;
	}
	.footer-sec1 table>tr>th{
		
	}

