/*
// Medium devices (tablets, 768px and up)
============================================================*/
@media (min-width: 768px) and (max-width: 991.98px) {
    .mainbanner_content p {
        width: 71%;
    }

    .section_title_1 {
        width: 100%; /* AAT was 75% */
    }

    .profile_img.personal_video .iconround:before {
        left: 6px;
        width: 80px;
        height: 80px;
    }

    .profile_img.personal_video a {
        width: 50px;
        height: 50px;
        line-height: 53px;
        left: 46px;
    }

    .personal_video .video-popup i:before {
        font-size: 20px;
    }

    .profile_img.personal_video .loader {
        left: 17%;
    }

    .about_myskill h2 {
        font-size: 30px;
    }

    .counter h3 {
        font-size: 15px;
    }

    .blog_item {
        margin-bottom: 30px;
    }
    /* AAT */
    .counter-bg{
    background-size:auto;
    }
    .responsive-padding-bottom{
        padding-bottom: 33px;
    }
}

/*
// Small devices (landscape phones, 576px and up)
============================================================*/
@media (min-width: 576px) and (max-width: 767.98px) {
    .mainbanner_content p {
        width: 100%;
    }

    .section_title_1 {
        width: 100%;
    }

    .profile_img.personal_video .loader {
        left: 15%;
    }

    .counter,
    .blog_item {
        margin-bottom: 30px;
    }

    .filters ul li {
        margin: 5px 10px
    }

    .profile_img.personal_video .iconround:before {
        width: 130px;
        height: 130px;
        left: 20px;
    }

    .profile_img.personal_video a {
        width: 90px;
        height: 90px;
        line-height: 100px;
        left: 84px;
    }

    .profile_img.personal_video .loader {
        left: 16%;
    }

    .skill-progress {
        margin-top: 20px;
    }

    .contact_message {
        margin-top: 50px;
    }
     /* AAT */
    .counter-bg{
    background-size:auto;
    }
}

/*
// Extra small devices (portrait phones, less than 576px)
============================================================*/
@media (max-width: 575.98px) {
    /* AAT */
    .counter-bg{
    background-size:auto;
    }
    .mainbanner_content{
    width:77%;
    padding: 20px 25px;
    }
    
    .mainbanner_content h1 {
        font-size: 26px;
        line-height: 34px;
    }

    .counter,
    .blog_item {
        margin-bottom: 30px;
    }

    .banner_title {
        font-size: 20px;
    }

    .mainbanner_content p {
        font-size: 14px;
        letter-spacing: 1px;
        line-height: 21px;
        width: 100%;
    }

    .section_title_1 {
        width: 100%;
        font-size: 14px;
    }

    .section_title_1 .title {
        font-size: 24px;
        line-height: 36px;
    }

    .skill-progress {
        margin-top: 20px;
    }

    .profile_img.personal_video .iconround:before {
        width: 100px;
        height: 100px;
        left: 7px;
    }

    .profile_img.personal_video a {
        width: 70px;
        height: 70px;
        line-height: 80px;
        left: 57px;
    }

    .profile_img.personal_video .loader {
        left: 17%
    }

    .about_myskill h2 {
        font-size: 24px;
    }
    .responsive-padding-bottom{ /* AAT */
        padding-bottom: 33px;
    }
}


/* Normal desktop :1200px. */
@media (min-width: 1200px) and (max-width: 1500px) {
	#main_banner { 
		height: 100%; 
	}
.mainbanner_content {
		position: relative;
		z-index: 11;
		vertical-align: middle;/* 
		margin-left: 53px !important; */
		margin-top: 80px;
		padding-right: 80px;/* AAT */
	}
}


/* Normal desktop :992px. */
@media (min-width: 992px) and (max-width: 1200px) {
#main_banner { 
		height: 100%; 
	}
.mainbanner_content {
		position: relative;
		z-index: 11;
		vertical-align: middle;
		margin-left: 53px !important;
		margin-top: 80px;
	}

}

 
/* Tablet desktop :768px. */
@media (min-width: 768px) and (max-width: 991px) {
#main_banner { 
		height: 100%; 
	}
.mainbanner_content {
		position: relative;
		z-index: 11;
		vertical-align: middle;
		margin-left: 53px !important;
		margin-top: 80px;
	}
.navbar-brand span {
		letter-spacing: 0px;
		font-size: 28px;
		font-weight: 500;
		color: #32C5FE;
		margin-left: 15px;
		position: absolute;
		font-family: 'Rubik', sans-serif;
		top: 5px;
		left: 127px;
	}
.navbar-light .navbar-toggler {
		color: #fff aliceblue !important;
		border-color: rgba(0,0,0,.1);
		background: #fff;
		margin-right: 19px;
		margin-top: 7px;
	}
.nav-scroll .navbar-light .navbar-brand {
		color: #000a2d;
		margin-top: 10px;
	}
.nav-scroll .navbar-brand span { 
		margin-top: 10px;
	}
h1.title4 {
		color: #32C5FE;
		font-family: 'Oswald', sans-serif;
		font-size: 18px;
		font-weight: 600;
		margin-left: 19px;
	}
.color_black {
		color: #1e232d;
		margin-left: 19px; 
	}
.myself p {
		font-size: 18px;
		line-height: 34.2px;
		color: #6e7797;
		font-weight: 400;
		font-family: 'Rubik', sans-serif;
		margin-bottom: 13px;
		/* margin-left: 19px; */ /* AAT */
		margin-left: 0px;
	}
.personal_info {
		margin-left: 19px;
	}
span.sub_title {
		color: #1e232d;
		font-weight: 700;
		font-size: 40px;
		line-height: 35px;
		letter-spacing: 0px;
		font-family: 'Rubik', sans-serif;
	}
}

 
/* small mobile :320px. */
@media (max-width: 767px) {
 #main_banner { 
		height: 100%; 
	}
.mainbanner_content {
		position: relative;
		z-index: 11;
		vertical-align: middle;
		margin-left: 41px !important;  /* AAT was 53px */
		margin-top: 80px;
	}
	
.cd-words-static b{
    white-space: normal; /* AAT */
    }
.profile_img{
    margin-bottom:25px; /* AAT */
}
.main-nav{ /* AAT make main nav always white on small phones */
    / * background: #fff !important; */
}
.cd-words-wrapper b {
		display: inline-block;
		position: absolute;
		white-space: nowrap;
		left: 0;
		font-weight: 700;
		top: 0;
		color: #32C5FE;
		font-size: 44px;
		text-transform: uppercase;
		margin-top: 10px;
	}
span.banner_title {
		font-size: 40.7px;
		letter-spacing: 0px;
		font-family: 'Oswald', sans-serif;
		color: #fff !important; 
	}
	.navbar-brand span {
		letter-spacing: 0px;
		font-size: 28px;
		font-weight: 500;
		color: #32C5FE;
		margin-left: 15px;
		position: absolute;
		font-family: 'Rubik', sans-serif;
		top: 5px;
		left: 127px;
	}
.navbar-light .navbar-toggler {
		color: #fff aliceblue !important;
		border-color: rgba(0,0,0,.1);
		background: #fff;
		margin-right: 19px;
		margin-top: 7px;
	}
.nav-scroll .navbar-light .navbar-brand {
		color: #000a2d;
		margin-top: 10px;
	}
.nav-scroll .navbar-brand span { 
		margin-top: 10px;
	}
.btn {
		padding: 13px 27px;
		font-size: 14px;
		font-family: 'Rubik', sans-serif;
		font-weight: 500;
		letter-spacing: 0px;
		text-transform: capitalize;
		color: #fff;
		line-height: 22.85px;
		margin-right: 13px;
		border-radius: 0px;
		margin-left: 1px;
		margin-bottom: 12px;
	}
span.sub_title {
		color: #1e232d;
		font-weight: 700;
		font-size: 22px; /* AAT was 40px */
		line-height: 27px;
		letter-spacing: 0px;
		font-family: 'Rubik', sans-serif;
	}
.client_img img {
		width: 100px !important;
		height: auto;
		border-radius: 8px;
		position: absolute;
		top: -39px;
		left: 31%;
		margin-bottom: 20px;
	}
.social_media_2 ul li {
		float: left;
		padding-right: 19px;
		font-size: 19px;
		border-bottom: 1px solid rgba(255, 255, 255, 0.08);
		padding-bottom: 30px;
	}
.navbar-brand {
		font-family: 'Rubik', sans-serif;
		text-transform: uppercase;
		letter-spacing: 0px;
		font-size: 28px;
		font-weight: 500;
		margin-left: 68px;
	}
.navbar-brand span {
		letter-spacing: 0px;
		font-size: 28px;
		font-weight: 500;
		color: #32C5FE;
		margin-left: 15px;
		position: absolute;
		font-family: 'Rubik', sans-serif;
		top: 5px;
		left: 110px;
	}
}
 
/* Large Mobile :480px. */
@media only screen and (min-width: 480px) and (max-width: 767px) {
.container {width:450px}
 #main_banner { 
		height: 100%; 
	}
.mainbanner_content {
		position: relative;
		z-index: 11;
		vertical-align: middle;
		margin-left: 53px !important;
		margin-top: 80px;
	}
.cd-words-wrapper b {
		display: inline-block;
		position: absolute;
		white-space: nowrap;
		left: 0;
		font-weight: 700;
		top: 0;
		color: #32C5FE;
		font-size: 44px;
		text-transform: uppercase;
		margin-top: 10px;
	}
span.banner_title {
		font-size: 40.7px;
		letter-spacing: 0px;
		font-family: 'Oswald', sans-serif;
		color: #fff !important; 
	}
	.navbar-brand span {
		letter-spacing: 0px;
		font-size: 28px;
		font-weight: 500;
		color: #32C5FE;
		margin-left: 15px;
		position: absolute;
		font-family: 'Rubik', sans-serif;
		top: 5px;
		left: 127px;
	}
.navbar-light .navbar-toggler {
		color: #fff aliceblue !important;
		border-color: rgba(0,0,0,.1);
		background: #fff;
		margin-right: 19px;
		margin-top: 7px;
	}
.nav-scroll .navbar-light .navbar-brand {
		color: #000a2d;
		margin-top: 10px;
	}
.nav-scroll .navbar-brand span { 
		margin-top: 10px;
	}
}