@import url('https://fonts.googleapis.com/css2?family=Source+Sans+3:wght@300;400;500;600;700;800&display=swap');
@import url('https://web.archive.org/web/20221130165952cs_/https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@300;400;600;700;900&display=swap');

body{ font-family: 'Source Sans Pro', sans-serif; }
h1,h2,h3,h4,h5,h6{ font-family: 'Source Sans Pro', sans-serif; }
p, a{  font-family: 'Source Sans Pro', sans-serif; }
.bg-darkblue{ background-color: #3284b6; }
.bg-blue{ background-color: #56c5cb; }
.bg-lightgrey{ background-color: #f6f7fc; }
.bg-white{ background-color: #fff; }
.text-darkblue { color: #3284b6; }
.bg-black{ background-color: #333; }
.fontsize10px { font-size: 10px; }
.fontsize11px { font-size: 11px; }
.fontsize12px { font-size: 12px; }
.fontsize13px { font-size: 13px; }
.fontsize14px { font-size: 14px; }
.fontsize15px { font-size: 15px; }
.fontsize16px { font-size: 16px; }
.fontsize17px { font-size: 17px; }
.fontsize18px { font-size: 18px; }
.fontsize19px { font-size: 19px; }
.fontsize20px { font-size: 20px; }
.fontsize21px { font-size: 21px; }
.fontsize22px { font-size: 22px; }
.fontsize23px { font-size: 23px; }
.fontsize24px { font-size: 24px; }
.fontsize25px { font-size: 25px; }
.fontsize26px { font-size: 26px; }
.fontsize27px { font-size: 27px; }
.fontsize28px { font-size: 28px; }
.fontsize29px { font-size: 29px; }
.fontsize30px { font-size: 30px; }
.font-weight500{ font-weight: 500; }
.font-weight600{ font-weight: 600; }
.font-weight700{ font-weight: 700; }
.font-weight800{ font-weight: 800; }
.pt-6{ padding-top: 3.5rem; }
.pt-7{ padding-top: 4.0rem; }
.pt-8{ padding-top: 4.5rem; }
.pb-6{ padding-bottom: 3.5rem; }
.pb-7{ padding-bottom: 4.0rem; }
.pb-8{ padding-bottom: 4.5rem; }
.h-100vh{ height: 93vh; }
.outline-none { outline: none; box-shadow: 0px 0px; }
.border-radius8px { border-radius: 8px 8px; }
.border-radius10px{ border-radius: 10px 10px; }
.before-nav-border li:last-child:before {
    content: "";
    position: absolute;
    left: -9px;
    right: 0;
    width: 1px;
    height: 19px;
    background: rgb(255 255 255 / 43%);
    top: 4px;
}
.bg-banner { 
	background-image: url('/web/20221130165952im_/http://c-computing.com/images/shape.png');
	background-size: 100%;
	background-repeat: no-repeat;
	background-color: #144562;
 }
 .rtl .bg-banner{  background-image: url('/web/20221130165952im_/http://c-computing.com/images/shape-arabic.png'); }
.navbar-nav li.nav-item a {  padding: 10px 16px !important; text-decoration:none; }
.input-type {
    border: 1px solid #e7e7e7;
    padding: 9px 15px;
    outline: none;
    box-shadow: 0px 0px;
    font-size: 15px;
    border-radius: 4px 4px;
}
.textarea-field{ 
	 border: 1px solid #e7e7e7;
    padding: 9px 15px;
    outline: none;
    box-shadow: 0px 0px;
    font-size: 15px;
    border-radius: 4px 4px;
    height: 120px;
    resize: none;
 }
.bg-before-img:before {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    background-image: url(/web/20221130165952im_/http://c-computing.com/images/blog-04.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    opacity: 0.2;
    width: 100%;
    height: 100%;
    background-attachment: fixed;
}
.banner-hd {
    font-size: 4vmax;
    line-height: 1;
}
.hovernav:hover, .hovernav:active, .hovernav:focus{  background-color: #000; }
.services-box {  height: 478px; }
.text-justify { text-align: justify; }
.animation-duration1s{ animation-duration: 1s !important; }
.animation-duration2s{ animation-duration: 2s !important; }
.animation-duration3s{ animation-duration: 3s !important; }
.animation-duration4s{ animation-duration: 4s !important; }
body.rtl {  direction: rtl; }
.rtl .before-nav-border li:last-child:before {
    right: -9px;
}
.rtl .services-box { height: 100%; }
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.btn:hover, .btn:active, .btn:focus{ background-color: #000; }





@media only screen and (max-width : 1205px) {
 .services-box h3 {
    font-size: 16px;
    line-height: 1.6;
}
}



@media only screen and (max-width : 1024px) {
 .services-box h3 {
    font-size: 14px;
    line-height: 1.6;
}
.services-box p { font-size: 12px; }
.h-100vh {  height: 42vh; }
}



/* Extra Small Devices, Phones */ 
@media only screen and (max-width : 640px) {
.services-box, .rtl .services-box  {  height: auto; }
.bg-banner {  background: #3284b6; height: auto; }
.navbar .navbar-toggler {
    border: 0px;
    box-shadow: 0px 0px;
    outline: none;
    color: #3284b6;
}
nav.navbar ul.navbar-nav {  padding: 0px; }
}