/*-----------------------------------------------
Project:            Teaser/Coming Soon/Landing Page Theme
Designed by:        mWm - мала WEB мануфактура 
------------------------------------------------*/


	html,body {
		font-family: 'Josefin Sans', sans-serif;
		font-weight: 400;
		font-size:13px;
		height:100%;
		width:100%;
		color:#999999;
		background-color: black;
	}
	
	body {
		overflow-x:hidden
	}
	
	html, body, div, h1, h2, h3, h4, h5, h6, p, em, strong, ul, li, form {
		border: 0;
		margin: 0;
		outline: 0;
		padding: 0;
		vertical-align: baseline;
	}
	
	header {
		display: block;
	}
	
	b, strong {
		font-weight: 700;
	}
	
	i {
		font-style: italic;
	}
	
	ul {
		list-style: none;
		margin: 0 0 24px 20px;
         list-style: disc;
	}
	
	li > ul {
		margin: 0 0 0 20px;
	}
	
	button,	input {
		line-height: normal;
	}
	
	input, textarea {
		background-image: -webkit-linear-gradient(hsla(0,0%,100%,0), hsla(0,0%,100%,0));
	}
	
	button, html input[type="button"], input[type="reset"], input[type="submit"] {
		cursor: pointer;
	}
	
	textarea {
		overflow: auto;
		vertical-align: top;
	}
	
	h1, h4, h6 {
		font-weight: 300;
		font-family: 'Josefin Sans', sans-serif;
		color:#fff;
		margin-bottom:10px;
	}
	
	h1 {
		font-size:48px;
		line-height: 54px;
	}
	
	h4 {
		font-size:24px;
		line-height: 30px;	
	}
	
    h6 {
		font-size:14px;
		line-height: 18px;
	}
	
	p {
		font-size:13px;
		margin-bottom:20px;
		line-height:20px;
        color:rgba(255,255,255,0.6)
	}
	 
    i {
		color:#fff;
	}

    a:hover, a:active, a:focus {
	  outline: 0;
	  color: rgba(255,255,255,0.6);
	}
	
	a {
        text-decoration: none;
        transform: translate3d(0, 0, 0);
        -webkit-transition: all .5s ease-in-out;
        -moz-transition: all .5s ease-in-out;
        -ms-transition: all .5s ease-in-out;
        -o-transition: all .5s ease-in-out;
        transition: all .5s ease-in-out;
    }
	
	a {
		color: #fff;
		outline: 0;
	}
	
	a:hover {
		text-decoration:none;
	}
	
	.one_half {
        width: 48%;
		float: left;
		margin-bottom: 20px;
		margin-right: 4%;
		position: relative;
	}

	.last {
		margin-right:0px!important;
	}
	
	.mask {
		background-color:#FFF;
		width:100%;
		height:100%;
		position:fixed;
		z-index:100000;
	}
	
	#loader {
		background:url(images/loader.gif) center center no-repeat;
		height: 2px;
		width: 140px;
		left: 50%;
		top: 50%;
		position: absolute;
		margin: -1px 0 0 -70px;
	}

	.content-center {
		box-sizing: border-box;
		display: table;
		height: 100%;
		padding: 0 7%;
		text-align: center;
		width: 100%;
	}

    .main {
        position:fixed;
        right:0;
        left:50%;
        width:50%;
        z-index:1;
        margin-bottom:0; 
    }

    .content-vertical-center-right {
        margin: 0;
        position: absolute;            
        top: 50%;
        transform: translate(0, -50%);
        transform: translate3d(0, -50%, 0);
        -webkit-transform: translate(0, -50%);
        -moz-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        -o-transform: translate(0, -50%);
        width: 85%;
        left: 2%;
    }

	.button {
		font-size:13px;
		text-transform:uppercase;
		line-height:13px;
		padding:11px 20px;
		display:inline-block;
		letter-spacing:1px;
        background-color: #000;
		color:#fff;
        border:#fff 1px solid;
	}
	
	.button:hover {
		opacity:0.6;
		color:#fff;
	}
	
	.icon-round-box {
		padding:60px 20px 20px;
		margin-top:300px;
		text-align:center;
        border:solid 2px rgba( 255, 255, 255, 0.2 );
	}
	
	.box-icon {
		width:120px;
		height:120px;
		text-align:center;
		background-color:rgba( 0, 0, 0, 0.4 );
        border-radius: 100%;
		left:50%;
		position:absolute;
		margin-left:-60px;
		margin-top:-120px;
	}

    .box-icon-square {
		text-align:center;
		left:50%;
		position:absolute;
        top:240px;
		margin-left:-120px;
		margin-top:-120px;
	}


	#contact-formular {
		text-align:center!important;
	}
	
	input[type="text"], textarea {
		font-family: 'Josefin Sans', sans-serif;
		font-size: 13px;
		height: 40px;
        padding:  10px 3%;
		width: 100%;
		border-radius:0px;
		margin-bottom:20px;
		border:0;
		-webkit-transition: all .3s ease-in-out;
        -moz-transition: all .3s ease-in-out;
        -ms-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
		box-sizing: border-box;
        color: #fff;
		background:rgba( 0, 0, 0, 0.4 );
	}
	
	#contact-formular textarea {
		height:160px;
		resize:none;
	}
	
	input[type="submit"]	{
		color:#fff;
		font-family: 'Josefin Sans', sans-serif;
		font-size: 13px;
		text-transform:uppercase;
		padding:10px 30px;
		line-height:14px;
		cursor:pointer;
        transform: translate3d(0, 0, 0);
		-webkit-transition: all .5s ease-in-out;
        -moz-transition: all .5s ease-in-out;
        -ms-transition: all .5s ease-in-out;
        -o-transition: all .5s ease-in-out;
        transition: all .5s ease-in-out;
		text-align:center;
		letter-spacing:1px;
	}	
	
	.error_message {		
		text-align:center;		
		margin-bottom:30px;
		font-size:13px;		
		color:#e93735;		
		font-weight:bold;
        background:rgba( 0, 0, 0, 0.4 );
	}
	
	#success_page {		
		text-align:center;		
	}	
	
	#success_page p {		
		color:#fff;		
		margin-top:20px;		
	}
	
	#message fieldset {		
		border:none;		
	}
	
	 input[type=text]:focus,  textarea:focus,  input[type=email]:focus {
		background-color: #000;
	}
	





    /*  Landing slider  */

    #slider {
		height: 100%;
		position: relative;
		width: 100%;
        background-size:cover;
		overflow:hidden;
	}

    .mWm-slider-fullscreen.flexslider {
		margin:0;
        z-index:0;
	}
	
	.mWm-slider-fullscreen.flexslider .slides > li {
		display: none; 
		-webkit-backface-visibility: hidden;
	}
		
	.mWm-slider-fullscreen.flexslider, .mWm-slider-fullscreen.flexslider .flex-viewport, .mWm-slider-fullscreen.flexslider .slides li {
		width:100%;
		height:100%!important; 
		margin:0;
		padding:0; 
	}
		
	.mWm-slider-fullscreen.flexslider .slides {
		height:100%!important;
		transition-delay: 1s;
        -webkit-transition-delay: 1s;
		-moz-transition-delay: 1s;
	}

    .mWm-slider-fullscreen.flexslider .mWm-slider-title {
		display: table;
		height: 100%;
		margin-left: 7%;
		position: relative;
		top: 0px;
        width: 40%;
		z-index: 0;
	}

    .mWm-slider-fullscreen.flexslider .mWm-slider-title h1 {
		font-family: 'Josefin Sans', sans-serif;
        font-weight: 300;
        font-size:66px;
        color: #fff;
	}

    .mWm-slider-fullscreen.flexslider .mWm-slider-title p {
        text-transform: uppercase;
        color: rgba(235, 241, 239, 0.7);
    }

    .mWm-slider-fullscreen.flexslider .mWm-slider-title-content {
		display: table-cell;
		padding-top:100px;
		padding-bottom:100px;
        color: rgba(255, 255, 255, 0.5);
	}

    .mWm-slider-fullscreen.flexslider .mWm-slider-title-content.top-left {
		text-align:left;
		vertical-align:top;
	}
	
	.mWm-slider-fullscreen.flexslider .mWm-slider-title-content.center-left {
		text-align:left;
		vertical-align:middle;
	}

    .mWm-slider-fullscreen.flexslider .mWm-slider-title-content.bottom-left {
		text-align:left;
		vertical-align:bottom;
	}

    span-regular {
        color: #000;
    }
    
    span-large {
        font-family: 'Tangerine', sans-serif;
        font-size:106px;
        color: #000;
    }


    .social-icon-group {
        width: 50px;
        height: 50px;
        position: relative;
        overflow: hidden;
        list-style:none;
		display:inline-block;
        margin-left: -2px;
    }

    .social-icon-group i {
        line-height:50px;
        color: #f2f2f2;
        font-size: 18px;
    }

    .social-icon, .social-icon2 {
        height: 50px;
        width: 50px;
        left:50%;
        margin-left:-25px;
        text-align:center;
        position: absolute;
        display:block;
        background-color: #1f1f1f;
        -webkit-transition: all .3s ease-in-out;
        -moz-transition: all .3s ease-in-out;
        -ms-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

    .social-icon {
        top: 0;
    }
    
    .social-icon2 {
        top: 50px;
    }
    
    .social-icon-group:hover .social-icon {
        top: -50px;
    }

    .social-icon-group:hover .social-icon2 {
        top: 0px;
    }

    .animated2 {
        -webkit-animation-duration: 1s;
        animation-duration: 1s;
        -webkit-animation-fill-mode: both;
        animation-fill-mode: both;
    }

    .animated3 {
        -webkit-animation-duration: 2s;
        animation-duration: 2s;
        -webkit-animation-fill-mode: both;
        animation-fill-mode: both;
    }

    .animated4 {
        -webkit-animation-duration: 3s;
        animation-duration: 3s;
        -webkit-animation-fill-mode: both;
        animation-fill-mode: both;
    }

     .mWm-slide {
        position: absolute;
        top: 0;
        z-index: 0;
        width:100%;
        height:100%!important; 
        margin:0;
        padding:0;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
        background-position:center center;
        -webkit-animation: zoom 20s infinite alternate;
        animation: zoom 20s infinite alternate;
    }


    @-webkit-keyframes zoom {
        from {
          -webkit-transform: scale(1,1);
          opacity: 0.5;
        }
        to {
          -webkit-transform: scale(1.15,1.15);
          opacity: 0.5;
        }
    }

    @keyframes zoom {
        from {
          transform: scale(1,1);
          opacity: 0.5;
       }
       to {
          transform: scale(1.15,1.15);
          opacity: 0.5;
       }
    }

    .animated {
        -webkit-animation-duration: 2s;
        animation-duration: 2s;
        animation-timing-function: ease-in-out;
    }

    @-webkit-keyframes fadeInDown {
      0% {
        opacity: 0;
        -webkit-transform: translateY(-30px);
        transform: translateY(-30px);
      }

      100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
      }
    }

    @keyframes fadeInDown {
      0% {
        opacity: 0;
        -webkit-transform: translateY(-30px);
        -ms-transform: translateY(-30px);
        transform: translateY(-30px);
      }

      100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
      }
    }

    .fadeInDown {
      -webkit-animation-name: fadeInDown;
      animation-name: fadeInDown;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
    }

    @-webkit-keyframes fadeOutDown {
      0% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
      }

      100% {
        opacity: 0;
        -webkit-transform: translateY(40px);
        transform: translateY(40px);
      }
    }

    @keyframes fadeOutDown {
      0% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
      }

      100% {
        opacity: 0;
        -webkit-transform: translateY(40px);
        -ms-transform: translateY(40px);
        transform: translateY(40px);
      }
    }

    .fadeOutDown {
      -webkit-animation-name: fadeOutDown;
      animation-name: fadeOutDown;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
    }


    @-webkit-keyframes rotateOut {
      0% {
        -webkit-transform-origin: center center;
        transform-origin: center center;
        -webkit-transform: rotate(0);
        transform: rotate(0);
        opacity: 1;
      }

      100% {
        -webkit-transform-origin: center center;
        transform-origin: center center;
        -webkit-transform: rotate(200deg);
        transform: rotate(200deg);
        opacity: 0;
      }
    }

    @keyframes rotateOut {
      0% {
        -webkit-transform-origin: center center;
        -ms-transform-origin: center center;
        transform-origin: center center;
        -webkit-transform: rotate(0);
        -ms-transform: rotate(0);
        transform: rotate(0);
        opacity: 1;
      }

      100% {
        -webkit-transform-origin: center center;
        -ms-transform-origin: center center;
        transform-origin: center center;
        -webkit-transform: rotate(200deg);
        -ms-transform: rotate(200deg);
        transform: rotate(200deg);
        opacity: 0;
      }
    }

    .rotateOut {
      -webkit-animation-name: rotateOut;
      animation-name: rotateOut;
    }

    @-webkit-keyframes rotateInDownLeft {
      0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg);
        opacity: 0;
      }

      100% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate(0);
        transform: rotate(0);
        opacity: 1;
      }
    }

    @keyframes rotateInDownLeft {
      0% {
        -webkit-transform-origin: left bottom;
        -ms-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate(-90deg);
        -ms-transform: rotate(-90deg);
        transform: rotate(-90deg);
        opacity: 0;
      }

      100% {
        -webkit-transform-origin: left bottom;
        -ms-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate(0);
        -ms-transform: rotate(0);
        transform: rotate(0);
        opacity: 1;
      }
    }

    .rotateInDownLeft {
      -webkit-animation-name: rotateInDownLeft;
      animation-name: rotateInDownLeft;
    }





/*Colorpicker*/


.colorpicker-wrapper {
    position: fixed; 
    left: -200px; 
    top: 20px; 
    width: 200px; 
    background: #222;
    opacity: 0.9;
    z-index: 9999; 
    text-align: left; 
}

.select-icon {
    position: absolute; 
    top: 0; 
    right: -40px; 
    background: transparent;
}

.select-icon i {
    display: block; 
    padding: 10px; 
    cursor: pointer; 
    font-size: 24px;
}

.colorpicker-wrapper .select-icon i {
    color: #fff !important;
}

.cp-wrapper {
    padding: 12px;
}

.cp-wrapper h4 {
    color: #fff;
    font-size: 18px;
    padding-left: 10px;
}

.cp-select-list li {
    display: block; 
    float: left; 
    margin: 0 5px 6px;
}

.cp-select-list li:last-child {
    padding-bottom: 12px;
}

.cp-select-list li a {
    display:block; 
    width: 120px; 
    height: 120px;
}

.cp-select-list li a img {
    opacity: 1;
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
}

.cp-select-list li a:hover img  {
    opacity: 0.7;
}

.img-responsive {
    display: block;
}

.img-responsive img {
    width: 100%;
    height: auto;
    display: block;
}



.socials {
    text-align: center;
}

.social-icon-group-cp {
    width: 50px;
    height: 50px;
    position: relative;
    overflow: hidden;
    list-style:none;
    display:inline-block;
    margin-left: 2px;
    float: none;
}


.social-icon-group-cp i {
    line-height:50px;
    color: #f2f2f2;
    font-size: 18px;
}

.social-icon-cp {
    height: 50px;
    width: 50px;
    top:0;
    left:50%;
    margin-left:-25px;
    text-align:center;
    position: absolute;
    display:block;

    background-color: rgba(105, 209, 250, 0.1);
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.social-icon2-cp {
    height: 50px;
    width: 50px;
    top: -50px;
    left:50%;
    margin-left:-25px;
    text-align:center;
    position: absolute;
    display:block;

    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.social-icon-group-cp:hover .social-icon-cp {
    top: 50px;
}

.social-icon-group-cp:hover .social-icon2-cp {
    top: 0px;
}


#mWm-logo img {
    width: 90%;
    height: auto;
    display: block;
    margin:auto;
    margin-top:15px;
    transform: translate3d(0, 0, 0);
    opacity: 1;
    transition:all 0.5s ease 0s;
    -moz-transition:all 0.5s ease 0s;
    -webkit-transition:all 0.5s ease 0s;
    -ms-transition:all 0.5s ease 0s;
    -o-transition:all 0.5s ease 0s;
}

#mWm-logo img:hover {
    opacity: 0.5;
}






@media only screen and (max-width: 1024px) {	
	
    .one_half {
    	width: 100%;
        margin-bottom: 20px;
		margin-right: 0%;
	}	

    .content-vertical-center-right {
        width: 86%;
        left: 7%;
        right: 7%;
    }
    
    .mWm-slider-fullscreen.flexslider .mWm-slider-title {
		margin-left: 7%;
		margin-right: 7%;
        width: 86%;
	}
    
   .mWm-slider-fullscreen.flexslider .mWm-slider-title-content.top-left, .mWm-slider-fullscreen.flexslider .mWm-slider-title-content.bottom-left, .mWm-slider-fullscreen.flexslider .mWm-slider-title-content.center-left {
       vertical-align:middle;
       text-align: center;
	}
    
    #slider {
		background-color:#000;
        overflow:inherit;
	}
    
    .main {
        position:relative;
        right:0;
        left:0; 
        width: 100%;
    }
    
    .content-center.main {
       background-image:url(images/back.jpg);
    }
    

}

@media only screen and (max-height: 581px) and (max-height: 750px) {
    
    .main {
        height: 130%;
    }

}

@media only screen and (min-height: 481px) and (max-height: 580px) {
    
    .main {
        height: 140%;
    }

}

@media only screen and (max-height: 480px) {
    
    .main {
        height: 220%;
    }

}