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

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {
	
.page {
	width: 100%;
}

}


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

 .page {
	height: 100%;
}	  
     
 .my_col_2_4{
  	
	-webkit-column-count:1;  
    -moz-column-count:1;  
    column-count:1;  
    
    -moz-column-gap: 1rem; /* Для Firefox */
    -webkit-column-gap: 1rem; /* Для Safari и Chrome */
    column-gap: 1rem;
}
       
 img.img_blog{
 	
 	width: 240px;
		
	}

	
}


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



.page {
	height: auto;
}	


/*для выравнивания меню*/

 ul#ulnav{
 	
 	
 /*	margin-top: 4px;*/
	/*border: 0px solid red;*/
	padding: 2px;
	text-align: center;
   	background: #000000;
	box-shadow: 0 12px 6px -6px rgba(0, 0, 0, 0.8);
	/*display: block;*/
     /* margin-left: 0;	
    margin-right: 0;*/


	}
	
	ul#ulnav > li {
		
	border-bottom:	1px solid #808080;
		
	}
	
	
/* для центрального квадрата*/

 .move-left_c_1{
	
	box-shadow: 0 10px 5px -5px rgba(0, 0, 0, 0.9);
    transform: translate(0%,-10%)scale(0.8, 0.8);
    -webkit-transform: translate(0%,-10%)scale(0.8, 0.8); 
    -o-transform: translate(0%,-10%)scale(0.8, 0.8); 
    -moz-transform: translate(0%,-10%)scale(0.8, 0.8); 
    -ms-transform: translate(0%,-10%)scale(0.8, 0.8);
}

 .sqr_center_1 {
   
    transition: all 2s ease-in-out;
    -webkit-transition: all 2s ease-in-out; 
    -moz-transition: all 2s ease-in-out; 
    -o-transition: all 2s ease-in-out; 
}



/* расстояние между словами */
.word-sp{
	
	word-spacing: normal;
	
}

/* расстояние между буквами */
.letter-sp{
	
	letter-spacing: normal;
	
}

/* расстояние между строками */
.line-he{
	
	line-height: 4em;
	
}

/* safari iphone*/
	 ul#myTab{
   
		display: -webkit-box;
		         -webkit-box-orient: horizontal;
		        -webkit-box-align: stretch; 
		         -webkit-box-pack: justify;
		         
}	 

}


/* Extra Small Devices, Phones */
@media only screen and (max-width : 480px) {
	
 
/* для центрального квадрата*/	
 .move-left_c_1{
		
	
	box-shadow: 0 8px 4px -4px rgba(0, 0, 0, 1); 
    transform: translate(0%,-15%)scale(0.7, 0.7);
    -webkit-transform: translate(0%,-15%)scale(0.7, 0.7); /** Chrome & Safari **/
    -o-transform: translate(0,-15%)scale(0.7, 0.7); /** Opera **/
    -moz-transform: translate(0,-15%)scale(0.7, 0.7); /** Firefox **/
    -ms-transform: translate(0%,-15%)scale(0.7, 0.7);
}

 .sqr_center_1 {
    /*position: absolute;*/
    transition: all 2s ease-in-out;
    -webkit-transition: all 2s ease-in-out; /** Chrome & Safari **/
    -moz-transition: all 2s ease-in-out; /** Firefox **/
    -o-transition: all 2s ease-in-out; /** Opera **/
}
	

}


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


}


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

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

}

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

/* для центрального квадрата*/	
	.sqr_center_1 {
    /*position: absolute;*/
    transition: all 2s ease-in-out;
    -webkit-transition: all 2s ease-in-out; /** Chrome & Safari **/
    -moz-transition: all 2s ease-in-out; /** Firefox **/
    -o-transition: all 2s ease-in-out; /** Opera **/
}

}

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

.navbar-collapse.collapse{
	display: -webkit-box;
	         -webkit-box-pack: center; 
	
     top: 13px;
	 border: 0px solid #FF00FF;
	 position: absolute;
	
}

.navbar-nav{
	
	 border: 0px solid #FFFFFF;
	 
}


li.nav-item{
	
	float: left;
}


.saf_row{
	display: -webkit-box;
	 -webkit-box-orient: horizontal;
	  
}

}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {
	
	
/*перемещение центрального квадрата 1й страницы вправо при увеличении ширины окна*/
	  
 .sqr_center_1 {
    
    transition: all 2s ease-in-out;
    -webkit-transition: all 2s ease-in-out; /** Chrome & Safari **/
    -moz-transition: all 2s ease-in-out; /** Firefox **/
    -o-transition: all 2s ease-in-out; /** Opera **/
}
	  	
.saf_col{
	display: -webkit-box;
	 -webkit-box-orient: horizontal;
	  -webkit-box-align: stretch;
	   -webkit-box-pack: center;
}
	
	.saf_col>div{
	
	width: 33.3%;
	
}
	
	
}

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

}