

/*============== Custom Media ==================*/

@media (max-width:1300px ) {
		.container{overflow:hidden;}
}

@media (max-width:1200px ) {
.container { width: 95%; }
ul.menu>li a{font-size: 13px;padding: 10px 12px 10px 9px;}
}

@media (max-width:1040px ) {
#testimonial { height: auto; }
#testimonial .owl-nav { display: none; }
#blogs .overlay, #memories .overlay{padding: 55px 25px;}
.topHeader #navClone,.topHeader #navActual{width:71%;}
.phone:before,.location:before,.mail:before{left: 123px;}
ul.menu>li a{font-size: 13px;padding: 10px 10px 10px 9px;}
}

@media (max-width:900px ) {
ul.menu > li.hide_on_desktop{display:block;}
ul.menu > li.hide_on_mobiles{display:none;}
#debugging { background: #D0482B; }
#debugging .cols p, #optimization .cols p { padding: 0 10px; }
.cols { margin: 15px 0; }
#optimization { background: transparent; }
.cols img { width: auto; }
.leftContent div { width: auto; }
.leftContent h4 { width: 120px; position: relative; left: 41%; display: block; }
#skills h2 { width: 48%; }
div#debugging h2, div#testimonial h2 { width: 54%; }
div#optimization h2 { width: 63%; }
#about .leftContent { width: 100%; }
#about .leftContent div { width: 100%; }
#about .leftContent h4 { display: block; }
.bottom_footer h2, form.mailing { display: none !important; ; }
.bottom_footer { display: inline-block; height: auto; background: #000; text-align: center; padding: 20px 0 5px }
.top-footer{margin:0;}
ul.social-links { padding: 10px 0; position: static; width: auto; margin: 0; text-align: center; display: inline-block; }
.phone:before, .location:before, .mail:before { display: none; }
div#debugging h2, div#testimonial h2, #work h2, #contact h2 { width: auto; }
.row.title-page h2:after { display: none; }
div#memories,div#contact { display: none;}
.topHeader .logo a{padding: 1px 13px 4px 9px;}
.topHeader #navClone,.topHeader #navActual{width:77%;}
ul.menu > li a{padding: 10px 7px 10px 10px;}
.mobile-footer {color: #fff;text-align: center;display: block;background: #000;width:100%;}
.mobile-footer p {line-height: 28px;}
.mobile-footer a{color:#fff;}
}

@media (max-width:720px ){
.topHeader ul.menu,body.fixed ul.menu{top:44px;}
.topHeader.clone,a#backtotop,.topHeader .logo {display:none;} 
body.fixed .topHeader.clone.down{display: block;}
body.fixed .mobile-menu { color: #000; }
body.fixed .topHeader #navClone,body.fixed .topHeader #navActual{padding: 5px 0 9px;}
.mobile-menu { display: inline-block; text-transform: uppercase; text-align: left; color: #fff; font-size: 20px; }
.topHeader .container { padding: 0 }
.first {background-size: 100%;padding: 10px 0;height: 195px;background-repeat: no-repeat;}
.first .first-section {top: 22%;}
ul.menu {display: block;padding: 10px 2px;width: 100%;position: absolute;background: #F2F2F2 none repeat scroll 0% 0%;z-index: 9999999;top: 170px;left: -483px;transition: 0.3s linear;line-height: 34px;opacity: 0;}
ul.menu>li { float: none; }
ul.menu>li a { color: #000; }
.topHeader #navClone,.topHeader #navActual{float:left;padding:5px 0;}
.first .first-section h1 {margin-top: 10px;margin-bottom: 5px;font-size: 24px;}
.first .first-section .resume {margin: 10px 0 10px 0;}
.first .first-section p {font-size: 14px;line-height: 19px;}
.first .first-section .resume a {padding: 8px 7px 10px 34px;font-size: 12px;}
.first .first-section .resume a::before {left: 11px;top: 7px;background-size: 77%;}
#testimonial .desc{padding: 44px 23px;}
#testimonial{display:inline-flex;}
}

@media (max-width:640px ) {

.navbar { margin-bottom: 0; }
.navbar .logo { display: inline-block; padding: 3px 6px 4px 2px; width: auto; }
.navbar-toggle { top: 20px; }
.navbar-nav { background: #29101C; position: absolute; width: 100%; }
.navbar-nav > li > a { font-size: 12px; padding-bottom: 4px; }
.navbar-fixed-top { position: relative; background: #2b101c !important; }
.navbar .logo { margin: 11px 0 8px 8px; }
div#optimization h2 { width: 75%; }
div#about h2 { width: 45%; }
#blogs .overlay, #memories .overlay { padding: 25px 15px; }
.row.title-page h2 { width: auto; }
#work .owl-nav .owl-next, #work .owl-nav .owl-prev{top: 160px;}
}

@media (max-width:480px ) {
.navbar .logo a { font-size: 20px; }
.navbar-brand { padding: 9px 9px; height: auto; }
.navbar-toggle { margin-top: 3px; top: 15px; }
.first { background-size: 100%; padding: 15px 0; height: 160px; }
.first .first-section h1 { font-size: 20px; margin-top: 8px; margin-bottom: 4px; }
.first .first-section p { font-size: 14px; line-height: 21px; }
.first .first-section .resume a { font-size: 12px; padding: 10px 11px 11px 34px; }
.first .first-section .resume { margin-top: 13px; margin-bottom: 20px; }
.first .first-section .resume a::before { left: 14px; top: 11px; background-size: 65%; }
.row.title-page h2 { width: 100% !important; font-size: 28px;line-height: 32px;}
.leftContent h4 { left: 32%; }
.cols img { width: 100%; }
.blogs .cols { margin: 0; }
.desc { padding: 40px 20px; }
#skills .functional-area.even, #skills .functional-area.odd { padding-right: 0; padding-left: 0 }
.first .first-section .resume,.functional-area.even::after, .functional-area.odd::after  { display: none; }
#about .leftContent img {width: 100%;}
}

@media (max-width:380px ) {
.functional-area.even, .functional-area.odd { padding: 0; }
.overlay { padding: 10px; top: 18px; }
}
