/*-----------------------------------------------------------------------------------

	Theme Name: CircleZ HTML Edition
	Theme URI: http://themeforest.net/user/geceolurken?ref=geceolurken
	Version: 2.0.0
	Description: Optimized single page theme for personal, business and portfolio
	Author: Yigit Yigit Ce.
	Author URI: http://www.pulyavserdce.com
	License: GNU General Public License version 3.0
	License URI: http://www.gnu.org/licenses/gpl-3.0.html
	Tags: responsive, boostrap, personal, personal, business, minimal, unique, clean, single page, one page, circle

	
	Table of Contents
	1- Desktops
	2- Tablets (800x600)
	3- Tablets (600x800)
	4- Smartphones

/*-----------------------------------------------------------------------------------*/

	@charset "utf-8";

/*--------------------------------------------------------
	1.Desktops
--------------------------------------------------------*/

@media screen and (min-width:1001px) {

	.controller{width:942px;}
	.section-label{/*margin-top:0px;*/background-position:0px 0px;}
	#circle-menu{width:700px;height:700px;margin-left:121px;margin-right:121px;}
	#header ul li:nth-child(1) {margin-left:235px;top:390px;}
	#header ul li:nth-child(2) {margin-left:325px;top:440px;}
	#header ul li:nth-child(3) {margin-left:425px;top:460px;}
	#header ul li:nth-child(4) {margin-left:525px;top:440px;}
	#header ul li:nth-child(5) {margin-left:615px;top:390px;}
	.jcarousel-skin-tango .jcarousel-clip-horizontal{width:325px!important;height:325px;}
	.jcarousel-skin-tango .jcarousel-item-horizontal{margin:0px;}
	.jcarousel-skin-tango .jcarousel-item{width:325px;height:325px;}
	.carousel-width{}
	.jcarousel-skin-tango .jcarousel-next-horizontal{top:175px;right:-5px;}
	.jcarousel-skin-tango .jcarousel-prev-horizontal{top:225px;right:25px;}
	#gallery li{margin:5px;}
	.gallery-grid #gallery li{height:236px;width:236px;/*margin:5px 15px 10px 0;*/}
	#slides{width:700px;position:absolute;top:-198px;margin-left:122px;z-index:1000;}
	#slides .slides_container{width:700px;height:700px;}
	#slides .slides_container div.slide{width:700px;height:700px;}
	
}

/*--------------------------------------------------------
	2.Tablets (800x600)
--------------------------------------------------------*/

@media screen and (min-width:799px) and (max-width:1000px) {

	.controller{width:800px;}
	.section-label{/*margin-top:0px;*/background-position:-71px 0px;}
	
	#circle-menu{width:700px;height:700px;margin-left:50px;margin-right:50px;}
	#header ul li:nth-child(1){margin-left:164px;top:390px;}
	#header ul li:nth-child(2){margin-left:254px;top:440px;}
	#header ul li:nth-child(3){margin-left:354px;top:460px;}
	#header ul li:nth-child(4){margin-left:454px;top:440px;}
	#header ul li:nth-child(5){margin-left:544px;top:390px;}
	.jcarousel-skin-tango .jcarousel-clip-horizontal{width:250px!important;height:250px;}
	.jcarousel-skin-tango .jcarousel-item-horizontal{margin:0px;}
	.jcarousel-skin-tango .jcarousel-item{width:250px;height:250px;}
	.carousel-width{}
	.jcarousel-skin-tango .jcarousel-next-horizontal{top:175px;right:-5px;}
	.jcarousel-skin-tango .jcarousel-prev-horizontal{top:225px;right:25px;}
	#gallery li{margin:5px;}
	.gallery-grid #gallery li{height:206px;width:206px;/*margin:5px 15px 10px 0;*/}
	#slides{width:700px;position:absolute;top:-199px;margin-left:51px;z-index:1000;}
	#slides .slides_container{width:700px;height:700px;}
	#slides .slides_container div.slide{width:700px;height:700px;}
	
}

/*--------------------------------------------------------
	2.Tablets (600x800)
--------------------------------------------------------*/

@media screen and (min-width:482px) and (max-width:799px) {

	.controller{width:600px;}
	.section-label{margin-top:50px;background-position:-171px 0px;}
	#circle-menu{width:600px;height:600px;margin-left:0px;margin-right:0px;}
	#header ul li:nth-child(1){margin-left:64px;top:290px;}
	#header ul li:nth-child(2){margin-left:154px;top:340px;}
	#header ul li:nth-child(3){margin-left:254px;top:360px;}
	#header ul li:nth-child(4){margin-left:354px;top:340px;}
	#header ul li:nth-child(5){margin-left:444px;top:290px;}
	.jcarousel-skin-tango .jcarousel-clip-horizontal{width:175px!important;height:175px;}
	.jcarousel-skin-tango .jcarousel-item-horizontal{margin:0px;}
	.jcarousel-skin-tango .jcarousel-item{width:175px;height:175px;}
	.carousel-width{}
	.jcarousel-skin-tango .jcarousel-next-horizontal{top:100px;right:-5px;}
	.jcarousel-skin-tango .jcarousel-prev-horizontal{top:150px;right:25px;}
	#gallery li{margin:5px;}
	.gallery-grid #gallery li{height:216px;width:216px;/*margin:5px 15px 10px 0;*/}
	#slides{width:600px;position:absolute;top:-199px;margin-left:1px;z-index:1000;}
	#slides .slides_container{width:600px;height:600px;}
	#slides .slides_container div.slide{width:600px;height:600px;}
	.slider{width:600px;}
	
}


/*--------------------------------------------------------
	3.Smartphones
--------------------------------------------------------*/

@media screen and (min-width:0px) and (max-width:481px) {
	
	.controller{width:100%;}
	.section-label{}
	#home-page{min-height:420px;}
	#circle-menu{width:300px;height:300px;margin-left:auto;margin-right:auto;}
	#header ul li:nth-child(1){margin-left:-14px;top:190px;}
	#header ul li:nth-child(2){margin-left:36px;top:240px;}
	#header ul li:nth-child(3){margin-left:96px;top:260px;}
	#header ul li:nth-child(4){margin-left:156px;top:240px;}
	#header ul li:nth-child(5){margin-left:206px;top:190px;}
	.jcarousel-skin-tango .jcarousel-clip-horizontal{width:325px!important;height:325px;}
	.jcarousel-skin-tango .jcarousel-item-horizontal{margin:0px;}
	.jcarousel-skin-tango .jcarousel-item{width:325px;height:325px;}
	.carousel-width{}
	.jcarousel-skin-tango .jcarousel-next-horizontal{top:175px;right:-5px;}
	.jcarousel-skin-tango .jcarousel-prev-horizontal{top:225px;right:25px;}
	#gallery li{margin:5px;}
	.gallery-grid #gallery li{height:156px;width:156px;/*margin:5px 15px 10px 0;*/}
	#slides{width:300px;position:absolute;top:-49px;margin-left:1px;z-index:1000;}
	#slides .slides_container{width:300px;height:300px;}
	#slides .slides_container div.slide{width:300px;height:300px;}
	.slider{width:300px;}
	#flashtext{width: auto !important; background-size: 100% !important;}
	#flashtext div{width: 100% !important; top:10% !important; font-size: 14px; left: 0!important; }
	.home-logo
{
	display: block;
	width:50px !important; margin-left:21%; padding-top: 5%;
}

.row-fluid
{
	margin-top: 27% !important;
}

.row-fluid small
{
	text-align: center;
}
	
}



@media screen and (min-width:482px) and (max-width:757px) {
	
	.controller{width:100%;}
	.section-label{}
	#circle-menu{width:300px;margin-left:auto;margin-right:auto;}
	#header ul li:nth-child(1){margin-left:-14px;top:190px;}
	#header ul li:nth-child(2){margin-left:36px;top:240px;}
	#header ul li:nth-child(3){margin-left:96px;top:260px;}
	#header ul li:nth-child(4){margin-left:156px;top:240px;}
	#header ul li:nth-child(5){margin-left:206px;top:190px;}
	.jcarousel-skin-tango .jcarousel-clip-horizontal{width:325px!important;height:325px;}
	.jcarousel-skin-tango .jcarousel-item-horizontal{margin:0px;}
	.jcarousel-skin-tango .jcarousel-item{width:325px;height:325px;}
	.carousel-width{}
	.jcarousel-skin-tango .jcarousel-next-horizontal{top:175px;right:-5px;}
	.jcarousel-skin-tango .jcarousel-prev-horizontal{top:225px;right:25px;}
	#gallery li{margin:5px;}
	.gallery-grid #gallery li{height:156px;width:156px;/*margin:5px 15px 10px 0;*/}
	#slides{width:300px;position:absolute;top:-49px;margin-left:1px;z-index:1000;}
	#slides .slides_container{width:300px;height:300px;}
	#slides .slides_container div.slide{width:300px;height:300px;}
	.slider{width:300px;}
	#flashtext{width: auto !important; background-size: 100% !important;}
	#flashtext div{width: 100% !important; top:25% !important; font-size: 24px; left: 0!important; }
	.home-logo
{
	display: block;
	width:50px !important; margin-left:21%; padding-top: 5%;
}
	.brand, .logo
	{
		padding-top: 2% !important;
	}

.row-fluid
{
	margin-top:0%;
}

.row-fluid small
{
	text-align: center;
}
	
}



@media screen and (min-width:996px) and (max-width:1196px) {

	.bubble-box
	{
		margin-left: 70% !important;
	}

	.menu-row{position: static !important;}
	.navbar .nav > li > a{text-align: left;}
	.brand, .logo{display:block; margin:0 auto; padding-right: 2%; padding-left: 2%;}
	.section-label{background:none !important;}
	.container, .navbar-static-top .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container
	{
		width: 100% !important;
	}
	.navbar .btn-navbar{background-color: none; background:none !important;}
	#flashtext{width: auto !important; background-size: 100% !important;}
	#flashtext div{width: 100% !important; top:20% !important; font-size:24px; left: 0!important; }
	}




@media screen and (min-width:768px) and (max-width:995px) {

	.bubble-box
	{
		margin-left: 103% !important;
	}
	.menu-row{position: static !important;}
	.navbar .nav > li > a{text-align: left;}
	.div{display: none;}
	.brand, .logo{display:block; margin:0 auto; padding-right: 2%; padding-left: 2%;}
	.section-label{background:none !important;}
	.container, .navbar-static-top .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container
	{
		width: 100% !important;
	}
	.navbar .btn-navbar{background-color: none; background:none !important;}
	#flashtext{width: auto !important; background-size: 100% !important;}
	#flashtext div{width: 100% !important; top:10% !important; font-size:18px; left: 0!important; }

	}


	@media screen and (min-width:621px) and (max-width:767px) {

	.door div
	{
		float: none !important;
		display: block !important;
	}

	.bubble-box
	{
		margin: 0 auto;
		width: 100%;
		margin-top: 56%;
		margin-left: 15%;
	}

	.bubble-data
	{
		padding-left: 12%;
		padding-top: 10%;
	}

	.menu-row{position: static !important;}
	.navbar .nav > li > a{text-align: left;}
	.div{display: none;}
	.brand, .logo{display:block; margin:0 auto; padding-right: 2%; padding-left: 2%;}
	.section-label{background:none !important;}
	.container, .navbar-static-top .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container
	{
		width: 100% !important;
	}
	.navbar .btn-navbar{background-color: none; background:none !important;}
	#flashtext{width: auto !important; background-size: 100% !important;}

	}


	@media screen and (min-width:0px) and (max-width:620px) {

	.door
	{
		
		background: none !important;
		width: 100% !important;
	}

	.bubble-box
	{
		margin: 0 auto;
		width: 100%;
	}

	.bubble-data
	{
		padding-left:30%;
		padding-top: 11%;
	}
	#flashtext, .moving
	{
		width: 100% !important;
		height: 92px !important;

	}

	#flashtext{position: relative;}
	html,body{background-position: center !important; width: 100% !important;}
	.menu-row{position: static !important;}
	.navbar .nav > li > a{text-align: left;}
	.div{display: none;}
	.brand, .logo{width:70% !important; display:block; margin:0 auto; padding-right: 2%; padding-left: 2%;}
	.section-label{background:none !important;}
	.container, .navbar-static-top .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container
	{
		width: 100% !important;
	}
	.navbar .btn-navbar{background-color: none; background:none !important;}
	}