/*==========  Desktop First Method  ==========*/

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {
	.heart {
		margin: 0px auto 35px;
		left: 0 !important;
	}
	.navbar-top {
		text-align: left;
	}
	.navbar-top .pull-right {
		float: unset !important;
	}
	#topmenu{ 
		margin-top: 5px;
	}
	#topmenu ul .phone {
		position: absolute;
		left: 50%;
		transform: translateX(-50%);
		margin: 0;
	}
	#topmenu ul .phone .visible-xs {
		display: block !important;
	}
	.menu-section nav {
		display: flex;
		justify-content: center;
		align-items: center;
		height: 100%;
	}
	.main{
		margin-top: 200px;
	}
	.main h2{
		font-size: 18px !important;
	}
	.main h1{
		font-size: 32px;
	}
    #topmenu ul li {
    margin-left: 30px;
    }
	.right img{
        margin-right: 0;
        margin-top: 25%;
	}
	#office-2 h3{
		margin-top: 50px;
		font-size: 36px;
	}
	#office-2 .offtext{
		font-size: 18px;
		margin-top: 10px;
	}
	#office-2 .head h4{
		font-size: 40px;
	}
	.head h5{
		font-size: 26px;
	}
	.head h6{
		font-size: 16px;
	}
	.vod{
		padding-bottom: 13px;
	}
	.block-2{
		font-size: 16px;
	}
	.block .graytext{
		display: none;
	}
	#office-2 h4{
		font-size: 30px;
	}
/*
	#office-2{
		height: 1244px;
	}
*/
	#office h2{
		margin-top: 10%;
	}
/*
	#office-2:before{
		height: 1244px;
	}
*/
	.left img{
		margin-left: 0px;
        margin-top: 25%;
	}
	#plan h2{
		margin-top: 10%;
	}
	#plan-2 .offtext{
		font-size: 22px;
	}
	#plan-2 h4{
		font-size: 30px;
	}
	#dark h4{
		font-size: 14px;
	}
	#dark img{
		margin-top: 40px;
	}
	.map p{
		margin-bottom: 35px;
	}
	#location h2{
		margin-top: 10%;
	}
    .flex-container {
        margin-top: 10%;
    }
	.headcust, .headcust:before {
		height: 380px !important;
	}
	#carousel-2 .item img{
		width: 100%;
		max-height: 500px;
		object-fit: cover;
    border-radius: 20px;
    margin-top: 15px;
    margin-bottom: 0px;
	}
	.carousel .item img {
		width: 100% !important;
		max-height: 500px;
		object-fit: cover;
    border-radius: 20px !important;
	}
	.newscustbot #block h2 {
		margin-top: 40px;
	}
}
@media only screen and (max-width : 960px) {
	.tab-content > .active {
	    overflow-x: scroll;	
	}
	.tab-content table {
		margin: 0px auto 0;
	}
	.nav-tabs > li{
		margin-bottom: 10px;
	}
}
@media only screen and (max-width : 800px) {

	#cont h2{
		margin-top: 7%;
	}
	#office h2{
		margin-top: 7%;
	}
	.right img{
		margin-right: 0px;
        margin-top: 50%;
	}
	.bc-2{
		margin-bottom: 20px;
	}
	.left img{
		margin-left: 0;
        margin-top: 50%;
	}
	.col-xs-12{
		padding-left: 10px;
		padding-right: 10px;
	}
	#office-2 h3{
		font-size: 32px;
	}

	#plan-2 h3{
		margin-top: 40px;
	}
	#carousel{
		margin-bottom: 0;
		margin-top: 20px;
	}
	#location h2{
		margin-top: 7%;
	}
    .vod, .bc {
    width: 27%;
    }
    .vod-2, .bc-2 {
    width: 27%;
    }
    .bc {
    padding-bottom: 31px;
    }
    .flex-container {
        margin-top: 10%;
    }
}

/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {
	 h2{
		font-size: 28px !important;
	}
	#rent h2, #rent h4 {
		font-size: 28px;
		margin-top: 40px;
	}
	#rent .opi {
		margin-bottom: 40px;
	}
	nav ul a {
		font-size: 24px;
	}
	#cont h2 {
		margin-top: 40px;
	}
	#brand{
		margin-left: 40px;
	}
	#topmenu{
		margin-right: 0px;
	}
	.main h1{
		font-size: 28px;
	}
	#office h2{
		margin-top: 3%;
	}
	.right img{
		margin-right: 0px;
        margin-top: 2%;
        float: none;
        display: block;
        margin: 0 auto;
        margin-bottom: 3%;
	}
	#office-2 h3{
		font-size: 32px;
	}
	#office-2 .head h4{
		font-size: 32px;
		margin-top: 20px;
	}
	.head h5{
		font-size: 22px;
	}
	.vod, .bc, .vod-2, .bc-2{
		margin-right: 0px;
		width: 40%;
	}
	.vod-2 .block {
		height: 80px;
	}
	.plus .block-2 {
		margin-top: 0px;
		height: 80px;
	}
	#office-2 #fadein-9 > .col-xs-12 {
padding: 30px 10px;
	}
	.head h6{
		font-size: 14px;
	}
	.bc img{
		margin-top: 26px;
		margin-bottom: 8px;
	}
	.bc{
		padding-bottom: 15px;
	}
	.block-2{
		font-size: 14px;
	}
	.head{
		margin-top: 30px;
	}
	#office-2 h4{
		font-size: 28px;
	}
	.left img{
		margin-left: 0;
        margin-top: 5%;
        margin-bottom: 5%;
	}
	#plan h2{
		margin-top: 3%;
	}
	#plan-2 h3{
		font-size: 32px;
		margin-top: 50px;
	}
	#plan-2 .offtext{
		font-size: 18px;
	}
	#dark img{
		margin-top: 20px;
	}
	#plan-2 h4{
		font-size: 28px;
		margin-top: 5px;
	}
	#dark h4{
		font-size: 14px;
	}
	#carousel{
		margin-bottom: 10px;
	}
	#location h2{
		margin-top: 5%;
	}
	#location-2 h3{
		margin-top: 50px;
		font-size: 32px;
	}
	.map p{
		font-size: 16px;
	}
	#office-2 .offtext{
		font-size: 16px;
	}
	.nav > li > a{
		padding: 15px 15px;
	}
}

@media only screen and (max-width : 640px) {

	.col-xs-12{
		padding-left: 10px;
		padding-right: 10px;
	}
	#topmenu ul .phone{
		font-size: 30px;
		display: inline-block;
	}
	#topmenu ul li{
		display: inline-block;
	}
	.nav-tabs > li{
		font-size: 16px;
	}
	.nav > li > a{
		padding: 15px 10px;
	}
	.tab-pane > table > tbody > tr > td{
		height: 110px;
		width: 110px;
	}
	.tab-content h4{
		padding-top: 25px;
		font-size: 18px;
	}
	.tab-content h5{
		font-size: 14px;
	}
	.tab-pane > table > tbody > tr > td > a{
		height: 110px;
		width: 110px;
	}
	.right{
		text-align: center;
	}
	.right img{
		margin-top: 5px;
		width: 60%;
		margin-bottom: 0;
        margin-bottom: 5%;
	}
	#office h2{
		margin-top: 30px;
	}
	.main h1{
		font-size: 24px;
	}
	#office-2 h3{
		font-size: 26px;
		margin-top: 30px;
	}
	.head h6{
		font-size: 12px;
	}
	.vod, .vod-2{
		margin-right: 0;
		margin-left: 0;
		width: 45%;
	}
	#office-2 h4{
		font-size: 24px;
	}
	.left{
		text-align: center;
	}
	.left img{
		margin-top: 30px;
		width: 60%;
		margin-bottom: 0;
	}
	#plan h2{
		margin-top: 20px;
	}
	#plan-2 h3{
		font-size: 26px;
		margin-top: 30px;
	}
	#plan-2 .offtext{
		font-size: 16px;
	}
	#plan-2 h4{
		margin-top: 10px;
	}
	#location h2{
		margin-top: 30px;
	}
	#location-2 h3{
		font-size: 26px;
		margin-top: 30px;
	}
}

@media only screen and (max-width : 600px){
	#carousel{
		margin-top: 40px;
		margin-bottom: 40px;
	}

    .cont .col-xs-offset-1 {
    margin-left: 0;
    }
    #cont h2 {
    margin-top: 5%;
    }
    .cont {
    color: #AAABB6;
    display: block;
	}
	.main h3 {
		margin-top: 60px;
	}
}

/* Extra Small Devices, Phones */
@media only screen and (max-width : 480px) {
	.cont .col-xs-offset-1 {
    margin-left: 0;
    }
    #cont h2 {
    margin-top: 5%;
    }
    .main h2{
		font-size: 14px !important;
	}
	.main h1{
		font-size: 18px;
	}
	.main h3{
		font-size: 24px;
	}
	.button-orange{
		width: 186px;
	}
	#office h2{
		margin-top: 25px;
		font-size: 33px;
	}
	#office p{
		font-size: 16px;
	}
	#office-2 h3{
		font-size: 22px;
		margin-top: 30px;
	}
	#office-2 .head h4{
		font-size: 26px;
		margin-top: 20px;
	}
	.vod, .vod-2{
		margin-right: 0;
		margin-left: 0;
		width: 45%;
	}
	#office-2 h4{
		margin-top: 40px;
	}
	.button-orange-2{
		width: 186px;
	}
	#plan h2{
		margin-top: 15px;
		font-size: 33px;
	}
	#plan p{
		font-size: 16px;
	}
	#plan-2 h3{
		font-size: 22px;
		margin-top: 30px;
	}
	#carousel{
		margin-top: 60px;
		margin-bottom: 40px;
	}
	#plan-2 h4{
		font-size: 24px;
	}
	#dark h4{
		font-size: 14px;
	}
	#location h2{
		margin-top: 25px;
		font-size: 33px;
	}
	#location p{
		font-size: 16px;
	}
	#location-2 h3{
		font-size: 22px;
		margin-bottom: 30px;
	}
	.map p{
		margin-bottom: 0;
		margin-top: 10px;
	}
	.desc h2{
		font-size: 26px;
	}
	.button-blue-3{
		width: 186px;
	}
	.desc h1{
		font-size: 38px;
	}
	#contacts h2{
		font-size: 14px;
	}
	#brand{
		margin-left: 30px;
	}
	#topmenu ul{
		margin-right: 15px;
	}
	.nav-tabs > li{
		font-size: 12px;
	}
	.nav > li > a{
		padding: 15px 5px;
	}
	.tab-pane > table > tbody > tr > td{
		height: 80px;
		width: 80px;
	}
	.tab-pane > table > tbody > tr > td > a{
		height: 80px;
		width: 80px;
	}
	.tab-content h4{
		padding-top: 25px;
		font-size: 16px;
	}
	.tab-content h5{
		font-size: 14px;
		margin-top: 10px;
	}
}

@media only screen and (max-width : 435px){
	.right img, .left img{
		width: 180px;
	}
	#topmenu ul .phone { 
		display: none !important;
	}
}

@media only screen and (max-width : 414px){
	.tab-pane > table > tbody > tr > td{
		height: 75px;
		width: 75px;
	}
	.tab-pane > table > tbody > tr > td > a{
		height: 75px;
		width: 75px;
	}
	.tab-content h4{
		font-size: 15px;
	}
	#topmenu ul .phone{
		font-size: 24px;
	}
	.right img{
		width: 180px;
	}
	#office-2 h4{
		margin-top: 20px;
	}
	#carousel{
		margin-bottom: 0;
	}
}

@media only screen and (max-width : 384px){
	#topmenu ul .phone{
		width: 170px;
		font-size: 18px;
	}
	#office h2{
		font-size: 28px;
	}
	#carousel{
		margin-top: 40px;
	}
	.left img{
		width: 180px;
	}
	.desc h2{
		font-size: 22px;
	}
	.nav-tabs > li{
		font-size: 12px;
		margin-bottom: 10px;
	}
	.nav > li > a{
		padding: 15px 5px;
	}
	.tab-pane > table > tbody > tr > td{
		height: 100px;
		width: 58px;
	}
	.tab-pane > table > tbody > tr > td > a{
		height: 100px;
		width: 58px;
	}
	.tab-content h4{
		padding-top: 15px;
		font-size: 12px;
	}
	.tab-content h5{
		font-size: 12px;
		margin-top: 0px;
	}
}

@media only screen and (max-width : 360px){
    .pull-left{
        margin-left: 30%;
    }
    #head:before {
        height: auto;
    }
    #head {
        height: auto;
    }
    .main {
    margin-top: 270px;
    }
    .pull-right {
    float: left;
    margin-top: 15%;
    margin-right: 23%;
    }
    #brand {
    margin-left: 31%;
    }

	.right img{
		width: 140px;
	}
	.left img{
		width: 140px;
	}
	.head{
		margin-top: 10px;
	}
	.desc h1{
		margin-top: 5%;
		font-size: 34px;
	}
    .cont {
    color: #AAABB6;
    display: block;
    }
    .logo {
    margin-left: -15px; 
    }
    .phone {
    }
}

/* Custom, iPhone Retina */
@media only screen and (max-width : 320px) {
    .main {
    margin-top: 240px;
    }
    .heart {
        margin-top: 25%;
    }
    #cont h2{
		margin-top: 50px;
	}
	.nav-tabs > li{
		font-size: 12px;
		margin-bottom: 10px;
	}
	.nav > li > a{
		padding: 15px 5px;
	}
	.tab-pane > table > tbody > tr > td{
		height: 100px;
		width: 58px;
	}
	.tab-pane > table > tbody > tr > td > a{
		height: 100px;
		width: 58px;
	}
	.tab-content h4{
		padding-top: 15px;
		font-size: 12px;
	}
	.tab-content h5{
		font-size: 12px;
		margin-top: 0px;
	}

	.button-orange{
		width: 156px;
	}
	.button-blue-3{
		width: 156px;
	}
	#office h2{
		margin-top: 20px;
	}
	#office-2 h4{
		font-size: 22px;
	}
	#brand{
		margin-left: 80px;
	}
	#topmenu ul .phone{
		margin-top: 50px;
		margin-right: 43px;
	}
	.right img{
		width: 160px;
		margin-top: 0;
	}
	#office-2 .head h4{
		font-size: 18px;
		margin-top: 70px;
	}
	.head h5{
		font-size: 18px;
	}
	.col-xs-12{
		padding-left: 5px;
		padding-right: 5px;
	}
	#office-2 h4{
		font-size: 20px;
		margin-top: 40px;
	}
	.left img{
		width: 160px;
		margin-top: 25px;
	}
	#carousel{
		margin-top: 20px;
		margin-bottom: 10px;
	}
	#location-2 p{
		font-size: 13px;
		margin-bottom: 0;
		margin-top: 15px;
	}
	.desc h1{
		font-size: 28px;
		margin-top: 120px;
	}
	.desc h2{
		line-height: 40px;
	}
    .cont {
    color: #AAABB6;
    display: block;
    }
}


/*==========  Mobile First Method  ==========*/

/* Custom, iPhone Retina */
@media only screen and (min-width : 320px) {

}

/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) {

}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {

}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {

}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {

}