Documente Academic
Documente Profesional
Documente Cultură
Proiect de an.
Tema: Proectarea si elaborarea aplicatiei WEB "HI TECH". Administrarea
aplicatiei WEB.
Autor:
Student anul III
grupa CIB-201 FR
Burcovschi Dorin
Verificat de:
Lector universitar
Prisacaru Anatolie
Chisinau 2023
Cuprins.
Introducere
Capitolul 1 (partea teoretica)
Capitolul 2 (partea aplicativa)
Concluzii
Referinte Bibliografice
Anexe
Introducere.
Într-o lume tot mai digitalizată, companiile de programare joacă un rol esențial în
dezvoltarea soluțiilor tehnologice pentru a satisface nevoile clienților lor. În acest
context, un site web bine conceput poate fi o componentă vitală a strategiei de
marketing a unei companii de programare, oferind o prezentare detaliată a serviciilor
oferite și a portofoliului de proiecte finalizate cu succes. În acest proiect, vom explora
elementele esențiale ale unui site web de succes și vom elabora un site web atractiv
și funcțional pentru o companie de programare. Vom lua în considerare aspecte
precum design-ul, navigarea, conținutul și funcționalitatea site-ului pentru a crea o
experiență pozitivă pentru utilizatorii săi și pentru a promova afacerea companiei.
Tema elaborării unui site web pentru o companie de programare este foarte actuală
și importantă în ziua de azi, dat fiind faptul că tehnologia informației și comunicațiilor
joacă un rol tot mai important în afaceri și în viața cotidiană.
În ultimii ani, pandemia de COVID-19 a accelerat procesul de digitalizare, iar afacerile
au fost nevoite să își adapteze strategiile și să își dezvolte prezența online. Acest
lucru a dus la o cerere crescândă pentru servicii IT și de programare, iar companiile
din această industrie au devenit tot mai importante și mai solicitate.
De asemenea, o prezență online bine dezvoltată este esențială pentru succesul unei
companii de programare. Un site web atrăgător și funcțional poate fi un instrument
valoros de marketing, putând ajuta compania să atragă noi clienți și să își consolideze
relația cu clienții existenți. În plus, un site web bine dezvoltat poate îmbunătăți
eficiența și productivitatea companiei, permițându-i să comunice mai eficient cu
clienții săi și să își gestioneze mai bine operațiunile.
Există mai multe motive pentru care am ales tema elaborării unui site web pentru o
companie de programare ca subiect pentru proiectul meu de an.
În primul rând, industria IT și de programare este în plină dezvoltare, iar cererea
pentru astfel de servicii este în continuă creștere. Această temă poate oferi ocazia de
a învăța abilități practice în dezvoltarea site-urilor web și în utilizarea instrumentelor
și tehnologiilor necesare pentru aceasta. Aceste abilități sunt esențiale în domeniul
tehnologiei informației și pot fi utile pentru cariera mea viitoare.
În al doilea rând, elaborarea unui site web pentru o companie de programare poate
ajuta să înțeleag mai bine cum funcționează o companie de programare și cum poate
fi promovată aceasta în mediul online. Astfel, pot dobândi o înțelegere mai profundă
a industriei IT și a tehnologiilor care o susțin.
În plus, acest proiect poate fi util și pentru compania de programare pentru care se
dezvoltă site-ul web. Eu pot să ofer o perspectivă nouă și creativă asupra designului și
funcționalității site-ului web, ajutând astfel compania să se diferențieze de
concurență și să atragă noi clienți.
În concluzie, elaborarea unui site web pentru o companie de programare poate fi o
alegere motivantă și benefică, deoarece poate oferi abilități practice în domeniul IT și
de programare, poate ajuta să înțeleg mai bine industria și poate oferi oportunitatea
de a oferi o contribuție valoroasă unei companii reale.
În concluzie, elaborarea unui site web pentru o companie de programare este o temă
foarte actuală și importantă în ziua de azi, având în vedere rolul tot mai important pe
care tehnologia îl joacă în afaceri și în viața de zi cu zi. Un site web bine dezvoltat
poate fi un instrument valoros de marketing și poate ajuta compania să își
îmbunătățească performanța financiară și operațională.
Capitoliul 1: Partea teoretica
Analiza profunda a temei proiectului
Tema proiectului de a elabora un site web pentru o companie de programare este una importantă în
contextul actual, dat fiind faptul că site-urile web sunt o parte esențială a identității și prezenței
online a companiilor din toate domeniile, inclusiv al programării.
În concluzie, elaborarea unui site web pentru o companie de programare este un proiect important
și complex care implică o mulțime de aspecte tehnice și de design. Este important să se ia în
considerare obiectivele și audiența companiei de programare, să se aleagă platforma tehnologică
potrivită și să se ia în considerare designul și experiența utilizatorului pentru a crea un site web
eficient și atractiv. De asemenea, optimizarea pentru motoarele de căutare și promovarea online
sunt esențiale pentru a asigura o prezență online eficientă a companiei.
În primul rând, se poate examina concurența existentă în domeniu, pentru a înțelege cum și-au
dezvoltat companiile de programare prezența online. Se poate verifica site-ul web al concurenților și
se pot analiza caracteristicile acestuia, inclusiv designul, structura informațională, funcționalitățile și
experiența utilizatorului. De asemenea, se poate analiza și strategia de marketing online a acestora,
pentru a înțelege cum își promovează serviciile și produsele.
În al doilea rând, se poate examina tendințele actuale din domeniul elaborării de site-uri web pentru
companii de programare. Se pot examina noile tehnologii, limbaje de programare și framework-uri
care sunt utilizate în prezent și care sunt considerate cele mai eficiente pentru crearea de site-uri
web. De asemenea, se pot analiza tendințele de design și de experiență utilizatorului, pentru a vedea
cum evoluează acestea și pentru a putea oferi o experiență mai bună utilizatorilor.
În al treilea rând, se poate examina nevoia și cererea pentru servicii de elaborare de site-uri web
pentru companii de programare. Se poate analiza cererea pentru astfel de servicii, precum și nevoile
companiilor de programare în ceea ce privește prezența lor online. Aceste informații pot ajuta la
identificarea oportunităților și a nevoilor de piață care ar putea fi satisfăcute prin dezvoltarea unui
site web pentru o companie de programare.
În final, o analiză comparativă a situației existente în domeniul elaborării de site-uri web pentru
companii de programare poate oferi informații valoroase despre ce funcționează și ce nu
funcționează în prezent în acest domeniu. Aceste informații pot ajuta la dezvoltarea unei strategii
eficiente pentru dezvoltarea și promovarea unui site web pentru o companie de programare, pentru
a asigura o prezență online eficientă și o experiență bună pentru utilizatori.
• Dezvoltarea unui design atractiv și profesionist pentru site-ul web, care să ofere o primă
impresie pozitivă utilizatorilor și să reflecte valoarea și experiența companiei de programare.
• Crearea unei structuri informaționale clare și ușor de navigat pe site-ul web, care să ofere
informații relevante și să ajute utilizatorii să găsească rapid ce caută.
• Integrarea de funcționalități avansate pe site-ul web, cum ar fi un sistem de căutare eficient,
o formă de contact sau un sistem de programare online, care să faciliteze interacțiunea
utilizatorilor cu compania de programare.
• Asigurarea compatibilității site-ului web cu diferite dispozitive și platforme, pentru a oferi o
experiență uniformă utilizatorilor, indiferent de dispozitivul sau platforma folosită.
• Crearea unui conținut relevant și de calitate pe site-ul web, care să ofere informații utile și să
susțină poziționarea companiei de programare ca o autoritate în domeniul său.
• Asigurarea optimizării site-ului web pentru motoarele de căutare, pentru a crește
vizibilitatea companiei de programare și a atrage trafic organic către site-ul web.
• Integrarea unui sistem de analiză a traficului și comportamentului utilizatorilor pe site-ul
web, pentru a evalua eficacitatea site-ului web și a identifica oportunități de îmbunătățire.
Prin atingerea acestor obiective, proiectul de elaborare a unui site web predestinat unei companii de
programare poate contribui la creșterea prezenței online a companiei și la atragerea de noi clienți și
oportunități de afaceri.
Selectia si analiza surselor teoretice pentru proiect
Selecția și analiza surselor teoretice este o etapă importantă în elaborarea oricărui proiect de an,
deoarece asigură o bază solidă și actuală pentru cercetarea și dezvoltarea proiectului. În cazul
proiectului de elaborare a unui site web pentru o companie de programare, sursele teoretice pot
include:
• Cărți și manuale de programare web: Aceste surse pot oferi informații relevante despre
tehnicile și metodele de programare web, cum ar fi HTML, CSS, JavaScript și PHP, și pot oferi
o perspectivă generală asupra dezvoltării unui site web.
• Studii de caz și exemple de site-uri web pentru companii de programare: Aceste surse pot
oferi exemple concrete și inspirație pentru design-ul și structura site-ului web, și pot oferi o
perspectivă asupra strategiilor de marketing online utilizate de companii de programare.
• Ghiduri și tutoriale pentru optimizarea site-ului web pentru motoarele de căutare: Aceste
surse pot oferi informații relevante despre optimizarea site-ului web pentru motoarele de
căutare, cum ar fi utilizarea cuvintelor cheie, meta-descrierilor și a altor elemente de
optimizare.
• Studii de piață și cercetări de marketing în domeniul companiilor de programare: Aceste
surse pot oferi o perspectivă asupra pieței de software și servicii IT și pot oferi informații
relevante despre tendințele și nevoile actuale ale consumatorilor.
• Articole de specialitate și bloguri de autoritate în domeniul programării web și marketingului
online: Aceste surse pot oferi informații actualizate și relevante despre noile tendințe și
tehnologii din domeniul programării web și marketingului online.
Pentru a realiza integrarea acestor contribuții teoretice, trebuie să se organizeze unitățile tematice în
funcție de subiecte și să se identifice principalele puncte de vedere, argumente și teorii relevante
pentru fiecare subiect. De asemenea, este important să se raporteze critic și independent la aceste
contribuții teoretice, pentru a putea oferi o perspectivă personală și argumentată asupra subiectului.
În ceea ce privește subiectul proiectului de elaborare a unui site web pentru o companie de
programare, unitățile tematice ar putea include:
• Tehnici și metode de programare web: În această unitate tematică ar putea fi incluse
contribuțiile teoretice referitoare la limbajele de programare web, cum ar fi HTML, CSS,
JavaScript și PHP, și tehnici și metodologii de dezvoltare a site-urilor web.
• Design-ul și structura site-ului web: Această unitate tematică ar putea cuprinde contribuțiile
teoretice referitoare la design-ul și structura site-ului web, cum ar fi elementele de design,
utilizarea culorilor, tipografiilor și a layout-ului, precum și structurarea conținutului pe site.
• Marketing online și optimizarea site-ului web pentru motoarele de căutare: În această
unitate tematică ar putea fi incluse contribuțiile teoretice referitoare la strategiile de
marketing online utilizate de companii de programare și tehnici de optimizare a site-ului web
pentru motoarele de căutare, cum ar fi utilizarea cuvintelor cheie, meta-descrierilor și a altor
elemente de optimizare.
• Tendințe și oportunități în domeniul companiilor de programare: Această unitate tematică ar
putea cuprinde contribuțiile teoretice referitoare la tendințele actuale și oportunitățile din
domeniul companiilor de programare, precum și cercetări de piață și analize de tendințe în
domeniu.
• Cercetări și studii de caz în domeniul programării web și marketingului online: În această
unitate tematică ar putea fi incluse contribuțiile teoretice referitoare la cercetările și studiile
de caz relevante pentru subiectul proiectului, precum și analize ale acestora și a criticilor
acestora.
Pentru a se raporta critic și independent la aceste contribuții teoretice, este important să se evalueze
argumentele și teoriile prezentate și să se identifice punctele forte și punctele slabe ale acestora. De
asemenea, este important să se identifice posibilele limite ale acestor contribuții teoretice și să se
exploreze alternative sau abordări noi. Această abordare critică și independentă este esențială
pentru a obține o perspectivă mai amplă și echilibrată asupra subiectului studiat și pentru a putea
oferi soluții și recomandări adecvate în cadrul proiectului.
În plus, integrarea acestor contribuții teoretice ar trebui să se facă cu grijă, astfel încât să se evite
plagiatul și să se respecte drepturile de autor. Este important să se utilizeze surse credibile și să se
citeze corect și complet toate sursele folosite în proiect.
Tema elaborării unui site web pentru o companie de programare se încadrează în domeniul
tehnologiei informației și al dezvoltării web. Există o mulțime de literatură de specialitate disponibilă
pe aceste subiecte, iar în continuare vom realiza o analiză profundă a câtorva dintre cele mai
relevante surse pentru acest proiect.
• "Web Development with Node and Express" de Ethan Brown - Această carte este o sursă
excelentă pentru elevii care doresc să își îmbunătățească cunoștințele în programarea web.
Cartea se concentrează pe utilizarea Node.js și Express pentru crearea de site-uri web și
oferă o perspectivă cuprinzătoare asupra procesului de dezvoltare a site-urilor web. Aceasta
include subiecte precum gestionarea cererilor și răspunsurilor HTTP, gestionarea bazelor de
date, utilizarea șabloanelor și multe altele.
• "Learning Web Design" de Jennifer Niederst Robbins - Această carte este o resursă utilă
pentru elevii care doresc să învețe cum să creeze site-uri web. Cartea acoperă subiecte
precum structura HTML, stilizarea cu CSS și utilizarea JavaScript pentru interacțiunea cu
utilizatorii. Aceasta oferă o perspectivă comprehensivă asupra dezvoltării web și poate fi
utilă pentru începători în domeniul programării web.
• "The Principles of Beautiful Web Design" de Jason Beaird și James George - Această carte se
concentrează pe designul site-urilor web și oferă o perspectivă asupra esteticii și designului
vizual. Cartea acoperă subiecte precum tipografia, culoarea, compoziția și utilizarea spațiului.
Aceasta poate fi utilă pentru elevii care doresc să înțeleagă mai bine cum să creeze site-uri
web atractive și funcționale.
• "Don't Make Me Think" de Steve Krug - Această carte este o sursă excelentă pentru elevii
care doresc să înțeleagă cum să creeze site-uri web ușor de utilizat și ușor de navigat. Cartea
se concentrează pe utilizarea principiilor de design UX și pe asigurarea unei experiențe bune
pentru utilizatorii site-ului web. Aceasta poate fi utilă pentru elevii care doresc să își
îmbunătățească abilitățile în designul experienței utilizatorului.
<html lang="en">
<head>
<meta charset="utf-8">
<title>HiTech</title>
<!-- Responsive-->
<link rel="stylesheet"
href="https://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/fontawesome.css">
<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/jquery.fancybox.min.css"
media="screen">
<!--[if lt IE 9]>
</head>
<div class="loader_bg">
</div>
<div class="wrapper">
<div class="sidebar">
<nav id="sidebar">
<div id="dismiss">
</div>
</ul>
</nav>
</div>
<div id="content">
<header>
<div class="header">
<div class="container-fluid">
<div class="row">
<div class="full">
<div class="center-desk">
<div class="logo">
</div>
</div>
</div>
</div>
<ul class="btn">
</button>
</li>
</ul>
</div>
</div>
</div>
</div>
</header>
<ol class="carousel-indicators">
</ol>
<div class="carousel-inner">
<div class="carousel-caption">
<div class="row">
<div class="text-bg">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis </p>
<a class="read_more" href="#">Read more</a>
</div>
</div>
<div class="images_box">
<figure><img src="images/img2.png"></figure>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="carousel-item">
<div class="carousel-caption">
<div class="row">
<div class="text-bg">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis </p>
</div>
</div>
<figure><img src="images/img2.png"></figure>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="carousel-item">
<div class="container-fluid">
<div class="row">
<div class="text-bg">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis </p>
<a class="read_more" href="#">Read more</a>
</div>
</div>
<div class="images_box">
<figure><img src="images/img2.png"></figure>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</a>
<a class="carousel-control-next" href="#myCarousel" role="button" data-slide="next">
</a>
</div>
<div class="container-fluid">
<div class="col-md-5">
<div class="about_img">
</div>
</div>
<div class="col-md-7">
<div class="titlepage">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation
ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit </p>
</div>
</div>
</div>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="titlepage">
</div>
</div>
</div>
</div>
<div class="choose_bg">
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="row">
<ul class="easy">
<li><a href="#">Ratinaready</a></li>
</ul>
</div>
<div class="choose_box">
<h3> Ad Minim</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in
reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat
cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="container-fluid">
<div class="col-md-7">
<div class="titlepage">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation
ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit </p>
</div>
</div>
<div class="col-md-5">
<div class="work_img">
</div>
</div>
</div>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="titlepage">
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="row">
</div>
<div class="col-md-12">
</div>
<div class="col-md-12">
</div>
<div class="col-md-12">
</div>
<div class="col-md-12">
<button class="send_btn">Send</button>
</div>
</div>
</form>
</div>
<div class="col-md-6">
<div id="map"></div>
</div>
</div>
</div>
</div>
<!-- end request -->
<footer>
<div class="footer">
<div class="container">
<div class="row">
<div class="row">
<div class="address">
<h3>Address </h3>
</div>
<ul class="location_icon">
<li>It is a long established fact that a reader will be distracted by the readable
content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-
orless normal distribution of letters, </li>
</ul>
</div>
<div class="address">
<h3>Links</h3>
<ul class="Menu_footer">
</ul>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-5 col-sm-6">
<div class="address">
<h3>Follow Us</h3>
</div>
<ul class="social_icon">
</ul>
</div>
<div class="address">
<h3>Newsletter </h3>
</div>
<form class="bottom_form">
<button class="sub_btn">subscribe</button>
</form>
</div>
</div>
</div>
</div>
</div>
<div class="copyright">
<div class="container">
<div class="row">
<div class="col-md-12">
<p>Copyright 2023 All Right Reserved By <a href="#">Burcovschi Dorin</a></p>
</div>
</div>
</div>
</div>
</div>
</footer>
</div>
<div class="overlay"></div>
<script src="js/jquery.min.js"></script>
<script src="js/popper.min.js"></script>
<script src="js/bootstrap.bundle.min.js"></script>
<script src="js/jquery-3.0.0.min.js"></script>
<script src="js/jquery.mCustomScrollbar.concat.min.js"></script>
<script src="js/custom.js"></script>
<script type="text/javascript">
$(document).ready(function() { $
("#sidebar").mCustomScrollbar({ them
e: "minimal"
});
$('#sidebar').removeClass('active');
$('.overlay').removeClass('active');
});
$('#sidebarCollapse').on('click', function() {
$('#sidebar').addClass('active');
$('.overlay').addClass('active');
$('.collapse.in').toggleClass('in');
$('a[aria-expanded=true]').attr('aria-expanded', 'false');
});
});
</script>
<script>
$(document).ready(function() {
(".fancybox").fancybox({ o
penEffect: "none",
closeEffect: "none"
});
$(".zoom").hover(function() {
$(this).addClass('transition');
}, function() {
$(this).removeClass('transition');
});
});
</script>
<script>
// This example adds a marker to indicate the position of Bondi Beach in Sydney,
// Australia.
google.maps.Map(document.getElementById('map'), {
zoom: 11,
center: { lat:
40.645037, lng:
-73.880224
},
});
var image = 'images/maps-and-flags.png';
position: {
lat: 40.645037,
lng: -73.880224
},
map: map,
icon: image
});
</script>
<script
src="https://maps.googleapis.com/maps/api/js?key=AIzaSyA8eaHt9Dh5H57Zh0xVTqxVdBFCvFMqFj
Q&callback=initMap"></script>
</body>
</html>
@import url('https://fonts.googleapis.com/css?family=Rajdhani:300,400,500,600,700');
@import
url('https://fonts.googleapis.com/css?family=Poppins:100,100i,200,200i,300,300i,400,400i,500,500i,
600,600i,700,700i,800,800i,900,900i');
@import
url('https://fonts.googleapis.com/css?family=Raleway:100,400,600,700,900&display=swap');
@import url(animate.min.css);
@import url(normalize.css);
@import url(icomoon.css);
@import url(font-awesome.min.css);
@import url(meanmenu.css);
@import url(owl.carousel.min.css);
@import url(swiper.min.css);
@import url(slick.css);
@import url(jquery.fancybox.min.css);
@import url(jquery-ui.css);
@import url(nice-select.css);
*{ box-sizing: border-box !
important;
html { scroll-behavior:
smooth;
.3s ease-in-out;
h1,
{ letter-spacing: 0;
font-weight: normal;
position: relative;
padding: 0 0 10px 0;
font-weight: normal;
line-height: normal;
color: #111111;
margin: 0
h1 { font-size:
24px;
h2 { font-size:
22px;
}
h3 { font-size:
18px;
h4 { font-size:
16px
h5 { font-size:
14px
h6 { font-size:
13px
*,
*::after,
*::before {
-webkit-box-sizing: border-box; -
border-box;
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a
decoration: none!important;
opacity: 1
}
button:focus
{ outline: none;
ul,
li,
ol { margin:
0px; padding:
0px; list-style:
none;
p{ margin: 0px;
font-weight: 500;
font-size: 15px;
line-height: 24px;
a{ color: #222222;
text-decoration: none;
important;
.3s ease-in-out;
}
img { max-width:
100%; height:
auto;
:focus
{ outline: 0;
.lead { font-size:
18px; line-height:
30px; color:
#767676;
margin: 0;
padding: 0;
.navbar-form input
{ border: none !
important;
}
.badge { font-
weight: 500;
blockquote { margin:
20px 0 20px;
padding: 30px;
button {
border: 0;
margin: 0;
padding: 0;
cursor: pointer;
.full { float:
left; width:
100%;
.layout_padding { padding-
90px;
.light_silver
{ background: #f9f9f9;
}
.theme_bg
{ background:
#38c8a8;
.margin_top_30 { margin-
.full {
width: 100%;
float: left;
margin: 0;
padding: 0;
.loader_bg { position:
fixed; z-index:
9999999;
background: #fff;
width: 100%;
height: 100%;
.loader { height:
100%; width:
100%; position:
absolute;
left: 0; top: 0;
items: center;
.loader img
{ width: 280px;
/*-- menu_sitbar--*/
.menu_sitbar {
height: 100vh;
background: #0808ff;
padding: 33px;
0, 0.2);
#sidebar.active {
left: 0;
#dismiss { width:
35px; height:
35px; line-height:
34px; text-align:
center;
background: #000;
position: absolute;
10px; cursor:
pointer;
#dismiss:hover
{ background: #35bff8;
color: #fff;
ease-in-out;
}
.overlay.active
{ display: block;
opacity: 1;
#sidebarCollapse
{ background:
transparent; padding: 0;
border: none;
#sidebar .sidebar-header
{ padding: 20px;
background: #0808ff;
#sidebar ul.components
{ padding: 55px 0;
#sidebar ul p
{ color: #fff;
padding: 10px;
#sidebar ul li a
font-size: 1.3em;
weight: 500;
}
#sidebar ul li a:hover
{ color: #fff;
background: #35bff8;
#sidebar ul li.active>a,
a[aria-expanded="true"] {
#35bff8;
a[data-toggle="collapse"]
{ position: relative;
.dropdown-toggle::after
20px; transform:
translateY(-50%);
ul ul a {
#6d7fcc;
ul.CTAs
{ padding:
20px;
}
ul.CTAs a { text-align:
bottom: 5px;
a.download
{ background: #fff;
color: #7386D5;
a.article,
a.article:hover { background:
important;
/*--end menu_sitbar--*/
ul.btn
{ float:
right;
ul.btn li { display:
inline-block;
padding: 0 25px;
}
ul.btn li a
{ color: #fff;
font-size: 16px;
0;
.down_btn { padding-
left: 50px;
.down_btn a { background-
size: 17px;
.down_btn a:hover
background: #000;
.header::after { background:
left: 0; }
.header { width:
100%; background:
#11aeef; padding:
transform: uppercase;
height: 40px;
.banner_main
{ background: #11aeef;
right; width:
100%; max-width:
431px;
padding-top: 50px;
weight: bold;
.text-bg p { font-size:
25px; padding-bottom:
50px; font-weight:
500;
.text-bg .read_more
.text-bg .read_more:hover
{ background: #000;
.images_box figure
{ margin: 0px;
}
{ width: 100%;
.carousel-indicators li {
background: #000;
8px; border-radius:
10px;
.carousel-indicators
{ bottom: 45px;
.carousel-caption
{ position: inherit;
.carousel-control-
next, .carousel-control-prev {
display: none;
.titlepage { text-align:
center; padding-
bottom: 60px;
}
.titlepage h2 { font-
#382d3c; line-
height: 55px;
padding: 0;
.d_flex { display:
flex; align-items:
center; flex-wrap:
wrap;
.blu { color:
#0eadef;
.read_more {
}
.read_more:hover
{ background: #00aeef;
.about
{ background:
#fafafa; padding:
90px 0;
.about .titlepage
{ text-align: left;
padding: 0; max-
width: 669px;
width: 100%;
float: left;
bottom: 40px;
.about .titlepage p
{ color: #010a05;
bottom: 50px;
float: right;
.about_img figure
{ margin: 0;
{ width: 100%;
.blu2 { color:
#3a3aff; font-
weight: bold;
.choose_bg { background:
url(../images/why.jpg); padding:
120px 0;
}
.choose .choose_box {
background: #fff;
text-align: center;
align: center;
.choose .choose_box h3 {
font-weight: 500;
padding-bottom: 10px;
padding-top: 15px;
.choose .choose_box p
.padding_right0 { padding-
right: 0;
.padding_left0 {
padding-left: 0;
ul.easy li a { font-size:
line-height: 36px;
margin-bottom: 35px;
display: block;
bottom: 0;
color: #fff;
ul.easy li a:hover
{ background: #060505;
color: #fff;
.work
{ background:
#ffffff; padding:
90px 0;
.work .titlepage
{ text-align: left;
padding: 0; max-
width: 648px;
right;
40px;
.work .titlepage p
{ color: #010a05;
bottom: 50px;
.work_img { padding-
right: 30px;
.work_img figure {
margin: 0;
}
.work_img figure img
{ width: 100%;
.request
{ background:
0px;
}
.request .titlepage { text-
align: left;
.white
{ color:
#fff; }
.main_form .contactus {
border-radius: 35px;
margin-bottom: 30px;
60px; background:
weight: normal;
border: inherit;
.main_form .textarea
padding-top: 63px;
margin-bottom: 30px;
font-
size: 18px; weight:
normal;
radius: 20px;
.main_form .send_btn {
font-size: 17px;
background-color: #fff;
auto;
.main_form .send_btn:hover
{ background-color: #191e20;
#fff;
#request *::placeholder {
1;
#map {
padding-
height: 425px;
22.25%; padding-top:
30px;
position: relative;
.footer { background:
#212120; padding-
center;
.footer .titlepage
{ text-align: left;
padding-bottom: 0px;
font-
.footer .titlepage h2
{ color: #fff;
.footer .address h3
height: 35px;
weight: 500;
padding-
bottom: 20px;
text-align: left;
ul.location_icon li
{ font-size: 17px;
text-align: left;
padding-right: 40px;
ul.Menu_footer li
{ display: block;
color: #3e7f21;
position: relative;
ul.Menu_footer li:before {
radius: 20px;
background: #fff;
margin-top: 9px;
left: 0; }
font-
ul.Menu_footer li a
{ display: block;
17px;
align: left;
ul.Menu_footer li a:hover {
color: #0eadef;
ul.social_icon li
{ display: block;
padding-bottom: 11px;
ul.social_icon li a {
font-size: 18px;
inherit;
ul.social_icon li a:hover {
color: #0eadef;
ul.social_icon li a i
{ background: #fff;
font-
padding-
22px;
border-radius: 30px;
-33px;
ul.social_icon li a i:hover {
color: #0eadef;
.bottom_form h3 {
font-weight: 600;
font-size: 20px;
text-align: left;
color: #fff;
padding-bottom: 15px;
.bottom_form .enter {
border: inherit;
font-
width: 100%; height:
53px; background:
font-size: 17px;
border-radius: 10px;
margin-bottom: 25px;
.sub_btn { size:
19px;
font-
transition: ease-in all 0.5s;
background-color: #0192c8;
transform: uppercase;
border-radius: 10px;
shadow: inherit;
.sub_btn:hover
{ background-color:
.copyright { margin-
25px 0; background:
#0192c8;
.copyright p { color:
line-height: 22px;
font-
text-align: center;
weight: normal;
.copyright a {
color: #fff; }
.copyright a:hover
{ color: #212120;