body {margin:0px; padding:0px; font-size:16px; font-family:arial; color:#111; background:#fff;}
* {box-sizing:border-box; line-height:150%;}
h1, h2, h3, h4, h5, h6, p, i, u {margin:0px; padding:0px; width:auto;}
span {margin:0px; padding:0px;}
input, select, textarea  {margin:0px; border-radius:0px; -moz-border-radius:0px; -webkit-border-radius:0px; border:0px; padding:10px; line-height:auto;}
span.error {color:#f24e4e;}
span.success {color:#90a035;}
hr {width:100%; height:0px; background:transparent; color:transparent; line-height:0px; display:block; border:0px; border-bottom:1px dotted #aaa;}
a {text-decoration:none;}
a:hover {text-decoration:none;}
img {border:0px;}
.img {background-position:center; background-repeat:no-repeat; background-size:cover; transition:all 0.3s;}

/* Colors: #2b51aa; #111; #888; #fff */
/* Font size: 36px, 22px, 16px / banner: 48px, 18px / menu:14px; */

#menu {float:left; width:100%; background:transparent; padding:30px 0; min-width:1200px; position:fixed; z-index:60;  transition:all 0.3s;}
#desprenoi {float:left; width:100%; min-width:1200px; padding:100px 0; background:#eee;}
#video-b {float:left; width:100%; min-width:1200px; background:#2b51aa; height:700px; overflow:hidden; text-align:center; }
#webdesign {float:left; width:100%; min-width:1200px; background:#fff; padding:100px 0;}
#gazduire {float:left; width:100%; min-width:1200px; padding:70px 0; background-image:url('images/backround.jpg'); background-size:cover; background-position:center; color:#fff;}
#colors {float:left; width:100%; min-width:1200px;}
#seo {float:left; width:100%; min-width:1200px; padding:100px 0;  background:#eee;}
#socialmedia {float:left; width:100%; min-width:1200px;  padding:70px 0 0 0;  background:#305099; color:#fff;}
#statistici {float:left; width:100%; min-width:1200px; padding:100px 0; background:#fff;}
#mentenanta {float:left; width:100%; min-width:1200px; padding:70px 0 90px 0; background-image:url('images/background2.jpg'); background-size:cover; background-position:center; }
#cereoferta {float:left; width:100%; min-width:1200px; padding:100px 0; background-image:url('images/background3.jpg'); background-size:cover; background-position:center; border-bottom:10px solid #2b51aa;}
#portofoliu {float:left; width:100%; min-width:1200px; border-top:2px solid #2b51aa; background:#eff3f6; text-align:center;}
.limit {margin:0 auto; width:1200px; min-width:1200px;}
.anchors {float:left; width:100%; min-width:1200px;}



#logo {width:208px; height:46px;  background:url('images/logo.png') no-repeat top center; float:left; background-size:208px;}


#zone1 {float:right;}
#zone1 a {float:left; font-size:14px;  padding:10px 0; text-transform:uppercase; margin-right:20px; font-weight:bold; color:#fff;  }
#zone1 a:last-child {margin-right:0px;}
#zone1 a:hover {border-bottom:2px solid #fff; padding-bottom:8px; }

#zone11 {position:fixed; right:0px; top:0px; bottom:0px; height:100%; background:#fff; width:200px; padding:20px; z-index:80; overflow-y:visible!important;}
#zone11 {float:right; display:none;}
#zone11 a {float:left; font-size:14px;  padding:10px 0; text-transform:uppercase; margin-right:20px; font-weight:bold; color:#333;  }
#zone11 a:last-child {margin-right:0px;}
#zone11 a.close {display:none;}
#zone11 a:hover {border-bottom:2px solid #fff; padding-bottom:8px; }
#zone11 a.border {display:none; cursor:pointer;}
#zone11 img {float:left; width:100%;}
#menu.fixed #zone11 a {color:#111;}
#menu.fixed #zone11 a:hover {color:#2b51aa; padding-bottom:10px; border-bottom:0px; }

#menu a.border {float:right; font-size:14px;  padding:10px; text-transform:uppercase; margin-left:20px; font-weight:bold; color:#fff; border:2px solid #fff;  transition:all 0.3s;}
#menu a.border:hover {background:#fff; color:#2b51aa;}
a.menutoggle {display:none; float:right; margin-left:20px; border-top:2px solid #fff;  border-bottom:2px solid #fff; color:#fff; cursor:pointer; font-weight:bold; padding:0 0 3px 0; width:25px; height:23px; margin-top:10px; letter-spacing:-3px; overflow:hidden!important; line-height:100%;}


#menu.fixed {background:#fff; padding:20px 0; box-shadow:0 0 15px rgba(0,0,0,0.3); -moz-box-shadow:0 0 15px rgba(0,0,0,0.3); -webkit-box-shadow:0 0 15px rgba(0,0,0,0.3);}
#menu.fixed #logo {width:208px; height:46px;  background:url('images/logo.png') no-repeat bottom center; float:left; position:relative; top:2px; background-size:208px;}
#menu.fixed #zone1 a {color:#111;}
#menu.fixed #zone1 a:hover {color:#2b51aa; padding-bottom:10px; border-bottom:0px; }
#menu.fixed a.border {border:2px solid #2b51aa; padding:10px;  transition:all 0.3s; color:#2b51aa!important;}
#menu.fixed a.border:hover {background:#2b51aa; color:#fff!important; border-bottom:2px solid #2b51aa!important;}
#menu.fixed a.menutoggle {display:none; border-top:2px solid #2b51aa;  border-bottom:2px solid #2b51aa; color:#2b51aa; }




video {object-fit: cover; height: 100%; width:100%; position:relative; margin-top:-564px; line-height:100%;}
#zone2 {float:left; width:100%; height:564px; padding-top:136px; position:relative; z-index:40; color:#fff; text-align:left;}
#zone2 table table {transition:all 0.3s;}
#zone2 table table:hover {transform: scale(1.1);}


#desprenoi table {transition:all 0.6s;}
#desprenoi table:hover {box-shadow:0 0 20px rgba(0,0,0,0.2); -moz-box-shadow:0 0 20px rgba(0,0,0,0.2); -webkit-box-shadow:0 0 20px rgba(0,0,0,0.2);}

#portofoliu table td {height:110px!important;}

#red, #green, #blue, #yellow {float:left; width:25%; height:6px; line-height:1px;}
#red {background:#ed402f;} #green {background:#2da951;} #blue {background:#4082fa;} #yellow {background:#fcbd00;}


h2#worktitle { border-bottom: 40px solid #2b51aa; border-left: 20px solid transparent;  border-right: 20px solid transparent; height: 0px; padding:0 20px;  color:#fff; font-size:24px; display:inline-block; }
.anchors.wrk {position:relative; margin-top:-40px;}


#footer {float:left; width:calc(100% - 650px)!important; width:-webkit-calc(100% - 650px)!important; width:-moz-calc(100% - 650px)!important;}
#footer table img, #footer table span {transition:all 0.3s;}
#footer table:hover img, #footer table:hover span {transform: scale(1.2);}


#contactform {float:right; width:500px;}
#contactform .row {float:left; width:50%; padding-right:10px;}
#contactform .row:nth-child(even) {padding-right:0px;}
#contactform strong {float:left; width:100%; }
#contactform .row2 {float:left; width:100%;}
#contactform textarea {float:left; width:100%; border:1px solid #ddd; background:#fff; margin-bottom:20px; height:150px;}
#contactform input {width:100%; border:1px solid #ddd; background:#fff; margin-bottom:20px; float:left; }
#contactform button {width:auto; color:#fff; background:#2b51aa; border:1px solid #2b51aa;float:left;   padding:10px 15px; cursor:pointer; transition:all 0.3s; width:auto;}
#contactform button:hover {padding:14px 21px; position:relative; margin-top:-8px; }

#desprenoi table:nth-child(2), #desprenoi table:nth-child(4), #desprenoi table:nth-child(6) {width:20px!important;}

@media(max-width:1600px)
{
video {width: auto!important; }
}

@media(max-width:1240px)
{
	#menu, #desprenoi, #webdesign, #gazduire, #colors, #seo, #socialmedia, #statistici, #mentenanta, #cereoferta, #zone2, .anchors {width:100%; min-width:100%; padding-left: 20px!important; padding-right:20px!important;}
	#video-b, #portofoliu {width:100%; min-width:100%; }
	.limit {margin:0 auto; width:100%; min-width:100%;}
	#desprenoi table:nth-child(2), #desprenoi table:nth-child(4), #desprenoi table:nth-child(6) {width:15px!important;}
}


@media(max-width:1239px)
{

	#desprenoi table:nth-child(1), #desprenoi table:nth-child(3) {width:calc(50% - 10px)!important; width:-webkit-calc(50% - 10px)!important; width:-moz-calc(50% - 10px)!important;}
	#desprenoi table:nth-child(2), #desprenoi table:nth-child(6) {width:20px!important;}
	#desprenoi table:nth-child(4) {width:100%!important; height:20px!important;}
	#desprenoi table:nth-child(5), #desprenoi table:nth-child(7) {width:calc(50% - 10px)!important; width:-webkit-calc(50% - 10px)!important; width:-moz-calc(50% - 10px)!important;}
	}


@media(max-width:1140px)
{
	a.menutoggle, #menu.fixed a.menutoggle {display:initial!important;}
	#zone1 {display:none!important;}
	#zone11 a.border, #zone1 a.close {display:initial; }
	#zone11 a.border  {width:auto!important; float:left; margin:20px 0 0 0; color:#2b51aa; border:1px solid #2b51aa!important; color:#2b51aa!important;}
	#zone11 a.close {width:auto; padding:6px 10px!important; border:1px solid #ddd!important; margin:0 0  20px 0!important; color:#888; background:#eee; float:right; display:initial!important; cursor:pointer;}
	#zone11 a.close:hover {background:#2b51aa; border:1px solid #2b51aa!important; color:#fff!important;}
	#zone11 a {float:left; width:100%; border-bottom:1px dotted #ccc;}
	#zone11 a:hover {border-bottom:1px dotted #ccc!important;}
	

}

@media(max-width:1060px)
{
	#video-b {height:1020px!important;}
	#zone2 {text-align:center!important; height:auto!important; float:left; width:100%; height:944px; padding-top:136px; position:relative; z-index:40; color:#fff;}
	video {object-fit: cover; height: 1216px; position:relative; margin-top:-1216px; line-height:100%;}

	#zone2 img {max-width:100%!important;}
	#zone2 table, #zone2 table tr, #zone2 table td {width:100%!important; float:left!important; text-align:center!important; clear:both;}
	#zone2 table table {width:auto!important; display:inline-block!important; text-align:center!important; float:none!important;}

	#desprenoi table:nth-child(1), #desprenoi table:nth-child(3), #desprenoi table:nth-child(5), #desprenoi table:nth-child(7) {float:left!important; width:100%!important	;}
	#desprenoi table:nth-child(2), #desprenoi table:nth-child(4), #desprenoi table:nth-child(6) {width:100%!important; height:20px!important; float:left!important;}
	
	#webdesign {text-align:center!important;}
	#webdesign img {max-width:100%!important; height:auto!important}
	#webdesign table, #webdesign table tr, #webdesign table td {width:100%!important; float:left!important; text-align:center!important; }
	#webdesign table table {width:auto!important; display:inline-block!important; text-align:center!important; float:none!important;}
	#webdesign table table td, #webdesign table table tr {width:auto!important; float:none!important; }
	
	
	#gazduire {text-align:center!important;}
	#gazduire img {max-width:100%!important; height:auto!important}
	#gazduire table, #gazduire table tr, #gazduire table td {width:100%!important; float:left!important; text-align:center!important; }
	
	#seo {text-align:center!important;}
	#seo img {max-width:100%!important; height:auto!important}
	#seo table, #seo table tr, #seo table td {width:100%!important; float:left!important; text-align:center!important; }
	#seo table table img { max-width:100%!important;}
	
	#socialmedia {text-align:center!important; padding-bottom:70px;}
	#socialmedia img {max-width:100%!important; height:auto!important}
	#socialmedia table, #socialmedia table tr, #socialmedia table td {width:100%!important; float:left!important; text-align:center!important; }
	
	#statistici {text-align:center!important;}
	#statistici img {max-width:100%!important; height:auto!important}
	#statistici table, #statistici table tr, #statistici table td {width:100%!important; float:left!important; text-align:center!important; }
	#statistici table table img { max-width:100%!important;}
	
	#mentenanta {text-align:center!important;}
	#mentenanta img {max-width:100%!important; height:auto!important}
	#mentenanta table, #mentenanta table tr, #mentenanta table td {width:100%!important; float:left!important; text-align:center!important; }
	
	#portofoliu table, #portofoliu table tr {width:100%!important; float:left!important; text-align:center!important; }
	#portofoliu table td {float:left!important; width:50%!important; border:1px solid #eff3f6!important; height:100px;}
	
	#footer {float:left; width:100%!important; text-align:center;}
	#footer table {width:auto!important; display:inline-block!important; text-align:center!important; float:none!important;}
	
	#contactform {float:left; width:100%; margin-top:80px;}
}

@media(max-width:1015px)
{
	#video-b {height:1080px!important;}
	

@media(max-width:650px)
{
	#video-b {height:1110px!important;}
}	
	
@media(max-width:539px)
{
	#video-b {height:1000px!important;}
	#zone2 img {width:100%!important; height:auto!important;}
}	
	
@media(max-width:500px)
{
	#video-b {height:990px!important;}
	#zone2 img {width:100%!important; height:auto!important;}
}	
	
@media(max-width:530px)
{
	#portofoliu table td {float:left!important; width:100%!important; border:1px solid #eff3f6!important; height:100px;}
}

@media(max-width:459px)
{
#video-b {height:1030px!important;}
 .border.topbut {display:none!important;}
 #zone2 table table:nth-child(2) {display:none;}
 #zone2 table, #zone2 table td, #zone2 table tr, #zone2 table table, #zone2 table table tr, #zone2 table table td, #zone2 table table tbody {float:left!important; width:100%!important;}
}







