@font-face {
  src: url("../fonts/akrobatBold.otf");
  font-family: "akrobatBold"; }
@font-face {
  src: url("../fonts/sportsWorldRegular.otf");
  font-family: "sportsWorldRegular"; }
@font-face {
  src: url("../fonts/helveticaNeueCyrRoman.otf");
  font-family: "helveticaNeueCyrRoman"; }
@font-face {
  src: url("../fonts/proximaNovaBold.ttf");
  font-family: "proximaNovaBold"; }
@font-face {
  src: url("../fonts/proximaNovaSemibold.otf");
  font-family: "proximaNovaSemibold"; }
@font-face {
  src: url("../fonts/a_AlgeriusNr.TTF");
  font-family: "a_AlgeriusNr"; }
@font-face {
  src: url("../fonts/a_AlternaCmD.TTF");
  font-family: "a_AlternaCmD"; }
@font-face {
  src: url("../fonts/a_AlternaSw.TTF");
  font-family: "a_AlternaSw"; }
@font-face {
  src: url("../fonts/a_AlternaTitulB.TTF");
  font-family: "a_AlternaTitulB"; }
@font-face {
  src: url("../fonts/a_AntiqueTitulGr.TTF");
  font-family: "a_AntiqueTitulGr"; }
@font-face {
  src: url("../fonts/a_AssuanBrk.TTF");
  font-family: "a_AssuanBrk"; }
@font-face {
  src: url("../fonts/a_AvanteCpsL.TTF");
  font-family: "a_AvanteCpsL"; }
@font-face {
  src: url("../fonts/a_BentTitulDcFr.TTF");
  font-family: "a_BentTitulDcFr"; }
@font-face {
  src: url("../fonts/a_BighausTitul.TTF");
  font-family: "a_BighausTitul"; }
@font-face {
  src: url("../fonts/a_BighausTitulBrkHil.TTF");
  font-family: "a_BighausTitulBrkHil"; }
@font-face {
  src: url("../fonts/a_BighausTitulOtlDr.TTF");
  font-family: "a_BighausTitulOtlDr"; }
@font-face {
  src: url("../fonts/a_BosaNovaCp.TTF");
  font-family: "a_BosaNovaCp"; }
@font-face {
  src: url("../fonts/a_BosaNovaDcFr.TTF");
  font-family: "a_BosaNovaDcFr"; }
@font-face {
  src: url("../fonts/a_BosaNovaOtl.TTF");
  font-family: "a_BosaNovaOtl"; }
@font-face {
  src: url("../fonts/a_BraggaOtl.TTF");
  font-family: "a_BraggaOtl"; }
@font-face {
  src: url("../fonts/a_BraggaOtlSh.TTF");
  font-family: "a_BraggaOtlSh"; }
@font-face {
  src: url("../fonts/a_BraggaStrip.TTF");
  font-family: "a_BraggaStrip"; }
@font-face {
  src: url("../fonts/a_BraggaTitul.TTF");
  font-family: "a_BraggaTitul"; }
@font-face {
  src: url("../fonts/a_Bremen.TTF");
  font-family: "a_Bremen"; }
@font-face {
  src: url("../fonts/a_BremenCaps.TTF");
  font-family: "a_BremenCaps"; }
@font-face {
  src: url("../fonts/a_BremenCapsNr.TTF");
  font-family: "a_BremenCapsNr"; }
@font-face {
  src: url("../fonts/a_BremenDcFr.TTF");
  font-family: "a_BremenDcFr"; }
@font-face {
  src: url("../fonts/a_CampusGrav.TTF");
  font-family: "a_CampusGrav"; }
@font-face {
  src: url("../fonts/a_CampusMarine.TTF");
  font-family: "a_CampusMarine"; }
@font-face {
  src: url("../fonts/a_CampusOtl.TTF");
  font-family: "a_CampusOtl"; }
@font-face {
  src: url("../fonts/a_CampusPrLy.TTF");
  font-family: "a_CampusPrLy"; }
@font-face {
  src: url("../fonts/a_CampusPrsp.TTF");
  font-family: "a_CampusPrsp"; }
@font-face {
  src: url("../fonts/a_CampusStrip.TTF");
  font-family: "a_CampusStrip"; }
@font-face {
  src: url("../fonts/a_ConceptoTit.TTF");
  font-family: "a_ConceptoTit"; }
@font-face {
  src: url("../fonts/a_ConceptoTitulNrFy.TTF");
  font-family: "a_ConceptoTitulNrFy"; }
@font-face {
  src: url("../fonts/acquestscript.ttf");
  font-family: "acquestscript"; }
@font-face {
  src: url("../fonts/AdineKirnberg.ttf");
  font-family: "AdineKirnberg"; }
@font-face {
  src: url("../fonts/a_DiscoSerif.TTF");
  font-family: "a_DiscoSerif"; }
@font-face {
  src: url("../fonts/a_DiscoSerifDbl.TTF");
  font-family: "a_DiscoSerifDbl"; }
@font-face {
  src: url("../fonts/Advokat_Modern.ttf");
  font-family: "Advokat_Modern"; }
@font-face {
  src: url("../fonts/a_Empirial.TTF");
  font-family: "a_Empirial"; }
@font-face {
  src: url("../fonts/a_EmpirialCmDn.TTF");
  font-family: "a_EmpirialCmDn"; }
@font-face {
  src: url("../fonts/agatha-modern.ttf");
  font-family: "agatha-modern"; }
@font-face {
  src: url("../fonts/a_GildiaLnBk.TTF");
  font-family: "a_GildiaLnBk"; }
@font-face {
  src: url("../fonts/a_GlobusLnBk.TTF");
  font-family: "a_GlobusLnBk"; }
@font-face {
  src: url("../fonts/a_GlobusOblique.TTF");
  font-family: "a_GlobusOblique"; }
@font-face {
  src: url("../fonts/a_Groto.TTF");
  font-family: "a_Groto"; }
@font-face {
  src: url("../fonts/a_GrotoGr.TTF");
  font-family: "a_GrotoGr"; }
@font-face {
  src: url("../fonts/akrobatBold.otf");
  font-family: "akrobatBold"; }
@font-face {
  src: url("../fonts/aksent.Ttf");
  font-family: "aksent"; }
@font-face {
  src: url("../fonts/a_LatinoTitulBr.TTF");
  font-family: "a_LatinoTitulBr"; }
@font-face {
  src: url("../fonts/a_LCDNova3DCmObl.TTF");
  font-family: "a_LCDNova3DCmObl"; }
@font-face {
  src: url("../fonts/a_LCDNovaObl.TTF");
  font-family: "a_LCDNovaObl"; }
@font-face {
  src: url("../fonts/AleksandraC.otf");
  font-family: "AleksandraC"; }
@font-face {
  src: url("../fonts/Alexandra_Script.ttf");
  font-family: "Alexandra_Script"; }
@font-face {
  src: url("../fonts/AlexandraZeferinoOne.ttf");
  font-family: "AlexandraZeferinoOne"; }
@font-face {
  src: url("../fonts/algerius.Ttf");
  font-family: "algerius"; }
@font-face {
  src: url("../fonts/AllegroScript.otf");
  font-family: "AllegroScript"; }
@font-face {
  src: url("../fonts/a_MachinaOrtoDgStr.TTF");
  font-family: "a_MachinaOrtoDgStr"; }
@font-face {
  src: url("../fonts/a_MachinaOrtoSht.TTF");
  font-family: "a_MachinaOrtoSht"; }
@font-face {
  src: url("../fonts/a_MachinaOrtoSls.TTF");
  font-family: "a_MachinaOrtoSls"; }
@font-face {
  src: url("../fonts/Amadeus.ttf");
  font-family: "Amadeus"; }
@font-face {
  src: url("../fonts/a_ModernoDcFr.TTF");
  font-family: "a_ModernoDcFr"; }
@font-face {
  src: url("../fonts/AndantinoScript.ttf");
  font-family: "AndantinoScript"; }
@font-face {
  src: url("../fonts/Annabelle.ttf");
  font-family: "Annabelle"; }
@font-face {
  src: url("../fonts/a_PlakatTitulHlStr.TTF");
  font-family: "a_PlakatTitulHlStr"; }
@font-face {
  src: url("../fonts/Aquarelle.ttf");
  font-family: "Aquarelle"; }
@font-face {
  src: url("../fonts/arabic.TTF");
  font-family: "arabic"; }
@font-face {
  src: url("../fonts/Archive.otf");
  font-family: "Archive"; }
@font-face {
  src: url("../fonts/AriadnaScript.ttf");
  font-family: "AriadnaScript"; }
@font-face {
  src: url("../fonts/Ariston.ttf");
  font-family: "Ariston"; }
@font-face {
  src: url("../fonts/a_RombyGr.TTF");
  font-family: "a_RombyGr"; }
@font-face {
  src: url("../fonts/a_RombyOtl.TTF");
  font-family: "a_RombyOtl"; }
@font-face {
  src: url("../fonts/a_RombyRndOtl.TTF");
  font-family: "a_RombyRndOtl"; }
@font-face {
  src: url("../fonts/Arsenal-Bold.otf");
  font-family: "Arsenal-Bold"; }
@font-face {
  src: url("../fonts/arthurgothic.ttf");
  font-family: "arthurgothic"; }
@font-face {
  src: url("../fonts/artnouv.ttf");
  font-family: "artnouv"; }
@font-face {
  src: url("../fonts/a_SeriferTitul.TTF");
  font-family: "a_SeriferTitul"; }
@font-face {
  src: url("../fonts/a_Simpler2Otl.TTF");
  font-family: "a_Simpler2Otl"; }
@font-face {
  src: url("../fonts/a_SimplerBrk.TTF");
  font-family: "a_SimplerBrk"; }
@font-face {
  src: url("../fonts/a_SimplerClg.TTF");
  font-family: "a_SimplerClg"; }
@font-face {
  src: url("../fonts/a_SimplerFnt.TTF");
  font-family: "a_SimplerFnt"; }
@font-face {
  src: url("../fonts/a_SimplerGr.TTF");
  font-family: "a_SimplerGr"; }
@font-face {
  src: url("../fonts/a_StamperBrk.TTF");
  font-family: "a_StamperBrk"; }
@font-face {
  src: url("../fonts/astra.Ttf");
  font-family: "astra"; }
@font-face {
  src: url("../fonts/AuroraScript.ttf");
  font-family: "AuroraScript"; }
@font-face {
  src: url("../fonts/AvalonMedium.ttf");
  font-family: "AvalonMedium"; }
@font-face {
  src: url("../fonts/BadScript.ttf");
  font-family: "BadScript"; }
@font-face {
  src: url("../fonts/bagira.ttf");
  font-family: "bagira"; }
@font-face {
  src: url("../fonts/BananaBrick.otf");
  font-family: "BananaBrick"; }
@font-face {
  src: url("../fonts/beastim.TTF");
  font-family: "beastim"; }
@font-face {
  src: url("../fonts/beastvs.TTF");
  font-family: "beastvs"; }
@font-face {
  src: url("../fonts/bedrockc.ttf");
  font-family: "bedrockc"; }
@font-face {
  src: url("../fonts/beresta.TTF");
  font-family: "beresta"; }
@font-face {
  src: url("../fonts/BetinaScriptCTT.TTF");
  font-family: "BetinaScriptCTT"; }
@font-face {
  src: url("../fonts/BetinaScriptExtraCTT.TTF");
  font-family: "BetinaScriptExtraCTT"; }
@font-face {
  src: url("../fonts/bickhamscr2.ttf");
  font-family: "bickhamscr2"; }
@font-face {
  src: url("../fonts/Bickham_Script_One.ttf");
  font-family: "Bickham_Script_One"; }
@font-face {
  src: url("../fonts/BikhamCyrScript.ttf");
  font-family: "BikhamCyrScript"; }
@font-face {
  src: url("../fonts/birch.ttf");
  font-family: "birch"; }
@font-face {
  src: url("../fonts/blaze.TTF");
  font-family: "blaze"; }
@font-face {
  src: url("../fonts/bmspiralcapcyr.ttf");
  font-family: "bmspiralcapcyr"; }
@font-face {
  src: url("../fonts/BoleroScript.ttf");
  font-family: "BoleroScript"; }
@font-face {
  src: url("../fonts/bonzai.ttf");
  font-family: "bonzai"; }
@font-face {
  src: url("../fonts/boyarsky.ttf");
  font-family: "boyarsky"; }
@font-face {
  src: url("../fonts/brag.Ttf");
  font-family: "brag"; }
@font-face {
  src: url("../fonts/Brava.otf");
  font-family: "Brava"; }
@font-face {
  src: url("../fonts/burlak.TTF");
  font-family: "burlak"; }
@font-face {
  src: url("../fonts/butter.ttf");
  font-family: "butter"; }
@font-face {
  src: url("../fonts/calligraph.TTF");
  font-family: "calligraph"; }
@font-face {
  src: url("../fonts/CalligraphiaOne.ttf");
  font-family: "CalligraphiaOne"; }
@font-face {
  src: url("../fonts/camp.TTF");
  font-family: "camp"; }
@font-face {
  src: url("../fonts/Carolina.ttf");
  font-family: "Carolina"; }
@font-face {
  src: url("../fonts/Casper_R.ttf");
  font-family: "Casper_R"; }
@font-face {
  src: url("../fonts/Cassandra.ttf");
  font-family: "Cassandra"; }
@font-face {
  src: url("../fonts/CeremoniousOne.ttf");
  font-family: "CeremoniousOne"; }
@font-face {
  src: url("../fonts/CeremoniousTwo.ttf");
  font-family: "CeremoniousTwo"; }
@font-face {
  src: url("../fonts/Champagnecyr.ttf");
  font-family: "Champagnecyr"; }
@font-face {
  src: url("../fonts/ChinaCyr.ttf");
  font-family: "ChinaCyr"; }
@font-face {
  src: url("../fonts/clip.ttf");
  font-family: "clip"; }
@font-face {
  src: url("../fonts/Comfortaa-Regular.ttf");
  font-family: "Comfortaa-Regular"; }
@font-face {
  src: url("../fonts/Connetable.ttf");
  font-family: "Connetable"; }
@font-face {
  src: url("../fonts/ConyRegular.otf");
  font-family: "ConyRegular"; }
@font-face {
  src: url("../fonts/CopyistThin.ttf");
  font-family: "CopyistThin"; }
@font-face {
  src: url("../fonts/Corinthia.ttf");
  font-family: "Corinthia"; }
@font-face {
  src: url("../fonts/corona.TTF");
  font-family: "corona"; }
@font-face {
  src: url("../fonts/Coronet.ttf");
  font-family: "Coronet"; }
@font-face {
  src: url("../fonts/crackman.TTF");
  font-family: "crackman"; }

/*TITLE*/

.constructor-title-container {
    width: 100%;
    background: url(../img/constructor-title-bg.png) no-repeat;
    background-size: contain;
    background-position-x: center;
    margin-top: 100px;
}

.constructor-title-container h1 {
    display: block;
    text-align: center;
    font-size: 40px;
    color: #3E3E3E;
    text-transform: uppercase;
    font-family: 'sportsWorldRegular';
}

.constructor-first-title {
    display: block;
    text-align: center;
    font-size: 23px;
    color: #FA413D;
    text-transform: uppercase;
    font-family: 'akrobatBold';
}

.constructor-second-title {
	display: block;
    text-align: center;
    font-size: 40px;
    color: #3E3E3E;
    text-transform: uppercase;
    font-family: 'sportsWorldRegular';
}

.constructor-second-title:after {
	content: '';
    display: block;
    background-color: #3E3E3E;
    height: 2px;
    width: 65px;
    margin: 40px auto 0 auto;
}

/*CONTRUCTOR*/

.constrructor-container {
	position: relative;
	margin-top: 100px;
    border-bottom: 1px solid black;
}

/* CONSTRUCTOR LEFT */

.constructor-left-area {
	float: left;
	width: 285px;
	padding-bottom: 60px;
}

.constructor-leftbar-toogle:hover {
	background-color: #787878;
	color: #fff;
	cursor: pointer;
}

.constructor-leftbar-toogle {
	float: left;
	display: block;
	width: 95px;
	padding: 10px 0;
	color: #787878;
	font-size: 17px;
	text-decoration: none;
	font-family: 'helveticaNeueCyrRoman';
	text-align: center;
	border-bottom: 1px solid #787878;
}

.constructor-leftbar-toogle.current-toogle:hover {
	background-color: #191919;
	color: #fff;
}

.constructor-leftbar-toogle.current-toogle {
	background-color: #191919;
	color: #fff;
	border-bottom: 1px solid #191919;
}

.constructor-leftbar-select-container {
	padding-top: 20px;
	padding-bottom: 20px;
}

#constructor-leftbar-select {
	width: 100%;
  border-radius: 10px;
  padding: 5px 10px;
  font-size: 16px;
  font-family: 'helveticaNeueCyrRoman';
  color: #787878;
  outline: none;
}

.constructor-products-list {
	width: 100%;
	border: 2px solid #191919;
	padding: 13px 0px;
	overflow-y: scroll;
	height: 325px;
}

.leftarea-product-image-container:frist-child, .leftarea-product-image-container:nth-child(3n + 1) {
	margin-left: 0px;
}

.leftarea-product-image-container:hover .leftarea-product-image{
	cursor: pointer;
	border: 1px solid #2E6DA4;
}

.leftarea-product-image-container:hover > .left-area-product-name{
	display: block;
}

.leftarea-product-image-container.current:hover .leftarea-product-image{
	cursor: default;
}

.leftarea-product-image-container.current .leftarea-product-image{
	border: 1px solid #2E6DA4;
}

.leftarea-product-image-container {
	float: left;
	width: 70px;
	height: 90px;
	margin-left: 13px;
	margin-bottom: 13px;
	position: relative;
}

.leftarea-product-image {
	width: 70px;
	border: 1px solid #C0C0C0;
}

.left-area-product-name {
	position: absolute;
	display: none;
  width: inherit;
  text-align: center;
  background-color: #fff;
  font-family: 'proximaNovaSemibold';
  font-size: 14px;
  z-index: 1;
}

.constructor-product-color-container {
	margin-top: 30px;
}

.constructor-product-meta-title {
	color: #363636;
	font-size: 18px;
	font-family: 'proximaNovaBold';
	text-transform: uppercase;
}

.constructor-product-colors {
	margin-top: 15px;
}

.constructor-product-color {
	float: left;
	width: 18px;
	height: 18px;
	border-radius: 10px;
	border: 1px solid #B6B6B6;
	margin-left: 10px;
	cursor: pointer;
}

.current-color {
	border: 1px solid #000;
	-webkit-box-shadow: 0px 0px 15px -2px rgba(53, 50, 50, 0.75);
	-moz-box-shadow: 0px 0px 15px -2px rgba(53, 50, 50, 0.75);
	box-shadow: 0px 0px 15px -2px rgba(53, 50, 50, 0.75);
}

.constructor-product-color-value {
	display: block;
	margin-top: 15px;
	font-size: 16px;
	color: #555;
	font-family: 'proximaNovaSemibold';
}

.constructor-product-size-container {
	margin-top: 20px;
}

.constructor-product-sizes {
	margin-top: 15px;
}

.constructor-product-size {
	font-family: 'proximaNovaBold';
	display: inline-block;
	margin-left: 10px;
	text-align: center;
	font-size: 25px;
	color: #ADADAD;
	cursor: pointer;
}

.current-size {
	color: #3D3C3C;
} 

.constructor-product-count-container {
	margin-top: 15px;
}

.constructor-count-container {
	margin-top: 10px;
}

.constructor-center-area {
	float: left;
	width: 540px;
	margin-left: 10px;
	position: relative;
}

#constructor-error {
	display: block;
    text-align: center;
    font-family: 'proximaNovaBold';
    font-size: 16px;
    color: #000;
    border: 1px solid #eea236;
    padding: 5px 10px;
    margin-bottom: 20px;
    visibility: hidden;
}

.constructor-canvas-area {
    position: relative;
}

.canvas-bg-container {
	  height: 510px;
}

#canvas-bg-image {
    max-height: 510px;
    margin: 0 auto;
    min-height: 150px;
    max-width: 510px;
    display: inline-block;
    min-width: 100px;
    vertical-align: middle;
}

.canvas-main-container {
	position: absolute;
    top: 0;
    margin: 0 auto;
    width: 100%;
}

.canvas-container {
	border: 1px solid black;
}

#constructor-canvas {
	margin: 0 auto;
}

.constructor-right-area {
	float: left;
	width: 280px;
	margin-left: 10px;
}

#delete-layer:disabled:hover {
	background-color: #D9534F;
}

#delete-layer:hover {
	background-color: #C9302C;
}

#delete-layer {
	background-color: #D9534F;
	border: 1px solid #AC2925;
}

#x-align-layer:disabled:hover, #y-align-layer:disabled:hover {
	background-color: #337AB7;
}

#x-align-layer:hover, #y-align-layer:hover {
	background-color: #5BC0DE;
}

#x-align-layer, #y-align-layer {
	background-color: #337AB7;
	border: 1px solid #2E6DA4;
}

.canvas-control:disabled {
	cursor: default;
	opacity: 0.7;
}

.canvas-controls-contaner {
	margin-top: 30px;
}

.canvas-control {
	color: #fff;
    border-radius: 5px;
    padding: 5px 10px;
    margin-left: 10px;
    font-family: 'proximaNovaSemibold';
    font-size: 16px;
    display: inline-block;
    border: 0px;
    outline: none;
    cursor: pointer;
}


.right-main-button:first-child {
	margin-top: 0px;
}

.right-main-button:hover {
	background-color: #191919;
}

.right-main-button {
	display: block;
	background-color: #929292;
	font-size: 18px;
	text-align: center;
	font-family: 'proximaNovaSemibold';
	color: #fff;
	margin-top: 20px;
	padding: 20px 0;
	cursor: pointer;
}

.constructor-product-sides-container {
	margin-top: 40px;
}

.constructor-product-side:first-child, .constructor-product-side:nth-child(2n + 1){
	  margin-left: 0px;
}

.constructor-product-side:hover .product-side-image-container{
    border: 1px solid #2E6DA4
}

.constructor-product-side {
    float: left;
    width: 130px;
    margin-left: 20px;
    cursor: pointer;
}

.additional-sides .constructor-product-side{
    margin-top: 30px;
}

.constructor-product-side.current:hover .product-side-image-container {
    border: 1px solid #eea236;
}

.constructor-product-side.current .product-side-image-container {
    cursor: default;
    border: 1px solid #eea236;
}

.product-side-title {
    font-family: 'helveticaNeueCyrRoman';
    text-align: center;
    font-size: 16px;
    color: #787878;
    display: block;
}

.product-side-image-container {
	margin-top: 20px;
	width: 128px;
	border: 1px solid #C0C0C0;
	height: 163px;
}

.product-side-image {
	width: 126px;
}

.constructor-price-container {
	margin-top: 40px;
}

.constructor-price-title {
	color: #363636;
	font-size: 24px;
	font-family: 'proximaNovaBold';
	text-transform: uppercase;
}

.constructor-price-value {
	color: #EB4441;
	font-size: 28px;
	font-family: 'proximaNovaBold';
	text-transform: uppercase;
	padding-left: 10px;
}

.right-buy-button:hover {
	background-color: #929292;
}

.right-buy-button {
	display: block;
	background-color: #191919;
	font-size: 22px;
	text-align: center;
	font-family: 'proximaNovaSemibold';
	color: #fff;
	margin-top: 15px;
	padding: 20px 0;
	cursor: pointer;
	text-transform: uppercase;
}

.add-image-title {
	display: block;
	color: #929292;
	font-size: 14px;
	font-family: 'helveticaNeueCyrRoman';
	margin-top: 20px;
}

.add-image-title button:hover {
	text-decoration: underline;
}

.add-image-title button{
	color: #F47A78;
    cursor: pointer;
    outline: none;
    border: none;
    background-color: inherit;
    padding: 0;
}

.image-rules-list {
    display: block;
    margin-top: 30px;
    padding: 10px 8px 15px 25px;
    background-color: #E5E5E5;
}

.image-rules-list > li {
    color: #6C6C6C;
    font-size: 14px;
    font-family: 'helveticaNeueCyrRoman';
    padding-top: 10px;
}

.add-text-btn:hover {
	background-color: #191919;
}

.add-text-btn {
    font-size: 20px;
    color: #fff;
    font-family: 'proximaNovaSemibold';
    text-align: center;
    display: block;
    padding: 15px 0;
    margin-top: 20px;
    cursor: pointer;
    background-color: #929292;
    margin-bottom: 20px;
}

#constructor-text {
	margin-top: 10px;
    display: block;
   /*  background-color: #E5E5E5; */
    padding: 6px 12px;
    font-size: 14px;
    font-family: 'helveticaNeueCyrRoman';
    color: #000;
    border: 2px solid #CECECE;
    resize: vertical;
    width: 260px;
    line-height: 1.42857143;
    margin-bottom: 20px;
}

.constructor-text-options {
	margin-top: 10px;
}

#constructor-text-font-family:not(:disabled) {
    color: #000;
    cursor: pointer;
}

#constructor-text-font-family {
    border: 0;
    width: 230px;
    background-color: #E5E5E5;
    font-size: 16px;
    padding: 5px 10px;
    outline: none;
    margin-bottom: 20px;
}

#text-color:disabled {
  cursor: default;
}

#text-color {
    border-radius: 10px;
    width: 100px;
    height: 30px;
    cursor: pointer;
    outline: none;
    padding: 2px 10px;
}

/*LOADER*/

  0% {
    width: 0;
    height: 0;
    opacity: 0;
    margin: 0 0 0 0;
  }
  33% {
    width: 44%;
    height: 44%;
    margin: -22% 0 0 -22%;
    opacity: 1;
  }
  100% {
    width: 88%;
    height: 88%;
    margin: -44% 0 0 -44%;
    opacity: 0;
  }
}
@-moz-keyframes uil-ripple {
  0% {
    width: 0;
    height: 0;
    opacity: 0;
    margin: 0 0 0 0;
  }
  33% {
    width: 44%;
    height: 44%;
    margin: -22% 0 0 -22%;
    opacity: 1;
  }
  100% {
    width: 88%;
    height: 88%;
    margin: -44% 0 0 -44%;
    opacity: 0;
  }
}
@-webkit-keyframes uil-ripple {
  0% {
    width: 0;
    height: 0;
    opacity: 0;
    margin: 0 0 0 0;
  }
  33% {
    width: 44%;
    height: 44%;
    margin: -22% 0 0 -22%;
    opacity: 1;
  }
  100% {
    width: 88%;
    height: 88%;
    margin: -44% 0 0 -44%;
    opacity: 0;
  }
}
@-o-keyframes uil-ripple {
  0% {
    width: 0;
    height: 0;
    opacity: 0;
    margin: 0 0 0 0;
  }
  33% {
    width: 44%;
    height: 44%;
    margin: -22% 0 0 -22%;
    opacity: 1;
  }
  100% {
    width: 88%;
    height: 88%;
    margin: -44% 0 0 -44%;
    opacity: 0;
  }
}
@keyframes uil-ripple {
  0% {
    width: 0;
    height: 0;
    opacity: 0;
    margin: 0 0 0 0;
  }
  33% {
    width: 44%;
    height: 44%;
    margin: -22% 0 0 -22%;
    opacity: 1;
  }
  100% {
    width: 88%;
    height: 88%;
    margin: -44% 0 0 -44%;
    opacity: 0;
  }
}
.uil-ripple-css {
    background: none;
    position: relative;
    width: 200px;
    margin: 100px auto 0 auto;
    height: 200px;
}
.uil-ripple-css div {
  position: absolute;
  top: 50%;
  left: 50%;
  margin: 0;
  width: 0;
  height: 0;
  opacity: 0;
  border-radius: 50%;
  border-width: 12px;
  border-style: solid;
  -webkit-animation: uil-ripple 2s ease-out infinite;
  animation: uil-ripple 2s ease-out infinite;
}
.uil-ripple-css div:nth-of-type(1) {
  border-color: #afafb7;
  -webkit-animation-delay: -1s;
  animation-delay: -1s;
}
.uil-ripple-css div:nth-of-type(2) {
  border-color: #5cffd6;
}

#constructor-loader {
    display: none;
    position: absolute;
    z-index:  100;
    background-color: rgba(255, 255, 255, 0.8);
    width: 100%;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

.loader-img {
    display: block;
    width: 256px;
    margin: 0 auto;
    animation: rot 1s linear infinite;
}

@keyframes rot {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@-webkit-keyframes rot {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

#loader-text {
    display: block;
    text-align: center;
    font-size: 40px;
    color: #3E3E3E;
    text-transform: uppercase;
    font-family: 'sportsWorldRegular';
    margin-top: 30px;
    white-space: pre-wrap;
}

#success-modal {
    position: absolute;
    display: none;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    top: 0px;
    left: 0px;
    z-index: 9999;
}

.success-modal-container {
    width: 700px;
    margin: 0 auto;
    position: relative;
    border-radius: 3px;
    top: calc((100% - 160px)/2);
    top: -webkit-calc((100% - 160px)/2);
    top: -o-calc((100% - 160px)/2);
    top: -moz-calc((100% - 160px)/2);
}

.success-modal-title {
    background-color: #181818;
    padding: 10px 0;
}

.success-modal-title-text {
    display: block;
    float: left;
    width: 500px;
    margin-left: 20px;
    font-size: 20px;
    font-family: 'akrobatBold';
}

.success-modal-title-icon-container:hover {
    opacity: 1;
}

.success-modal-title-icon-container {
    float: right;
    width: 20px;
    opacity: 0.7;
    cursor: pointer;
    margin-right: 30px;
    margin-top: 2px;
}

.success-modal-title-icon {
    width: 20px;   
}

.success-modal-content {
    padding: 30px;
    background-color: #fff;
    border: 1px solid #999;
    border: 1px solid rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
    box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
    background-clip: padding-box;
    outline: 0;
}

.success-modal-link:hover {
    color: #fff;
    background-color: #363636;
}

.success-modal-link:visited:not(:hover) {
    color: #363636;
}

.success-modal-link {
    display: inline-block;
    color: #363636;
    font-size: 18px;
    font-family: 'proximaNovaBold';
    cursor: pointer;
    border: 1px solid #363636;
    padding: 10px;
    text-decoration: none;
    transition: .3s all ease-in;
}

.success-modal-left {
    float: left;
    margin-left: 100px;
}

.success-modal-right {
    float: right;
    margin-right: 120px;
}

.current-category {
    width: 1000px;
    margin: 20px auto 0 auto;
    padding-bottom: 40px;
}

#category-title {
    display: block;
    text-align: center;
    font-size: 40px;
    color: #3E3E3E;
    text-transform: uppercase;
    font-family: 'sportsWorldRegular';
}

#category-info {
    text-align: center;
    font-size: 21px;
    color: #787878;
    text-transform: uppercase;
    font-family: 'akrobatBold';
    display: block;
}

.tshirt-icon {
    width: 110px;
    display: block;
    margin: 0 auto;
}

.ad-item:first-child, .ad-element:nth-child(3n + 1) {
    margin-left: 10px;
}

.ad-elements-container {
    width: 100%;
    margin-top: 30px;
    padding-bottom: 40px;
}

.ad-element {
    display: block;
    float: left;
    width: 340px;
    margin-left: 50px;
}

.ad-element-icon {
    display: block;
    float: left;
    width: 64px;
}

.ad-element-info {
    display: block;
    float: left;
    width: 240px;
    margin-left: 30px;
}

.ad-element-info h2 {
    text-align: left;
    font-family: "sportsWorldRegular";
    font-size: 20px;
    color: #373737;
    text-transform: uppercase;
}

.ad-element-info span {
    display: block;
    margin-top: 15px;
    font-family: "proximaNovaLight";
    font-size: 15px;
    color: #404040;
    line-height: 1.5em;
}
@media (max-width: 767px){
.constructor-title-container, .constructor-second-title{
	font-size: 35px;
}
.current-category, .constructor-left-area{
	width: 100%;
}
.constructor-leftbar-toogle{
	width: 33%;
}
.constrructor-container{
	margin-top: 20px;
	border-bottom: unset;
}
.constructor-left-area{
	padding-bottom: 2px;
}
#canvas-bg-image {
    max-height: 510px;
    width:320px;
    min-height: 150px;
    max-width: 510px;
    min-width: 100px;
    
}
.constructor-center-area{
	width:100%;
	margin-left:unset;
}
.canvas-bg-container{
	height: auto;
}
.tshirt-icon{
	margin-top: 30px;
}
.ad-element-info{
	width: 65%;
}
.ad-element{
	margin-left: unset;
}
.success-modal-container{
	width: 95%;
}
.success-modal-title-text{
	width:75%;
}
.success-modal-right, .success-modal-left{
	margin: unset;
}
#delete-layer, #x-align-layer, #y-align-layer{
	margin-bottom: 5px;
}
.constructor-right-area{
	width: 100%;
}
.additional-sides .constructor-product-side{
	margin-top: 23px;
}
.constructor-product-side{
	margin-left: 10px;
}
.constructor-product-side:nth-child(2n){
	margin-right: 10px;
}
.right-main-button{
	padding: 10px 0;
	width: 45%;
	min-width: 250px;
	float: left;
	margin-top: 5px;
	margin-right: 5px;
}
.right-main-button:first-child{
	margin-top: 5px;
}
#constructor-error{
	margin-bottom: 2px;
}
.constructor-product-size-container, .constructor-product-color-container, .constructor-product-sizes{
	margin-top:2px;
}
.constructor-product-size-container span:nth-child(1){
	float:left;
}
.constructor-product-size{
	margin-top: -5px;
}
.constructor-price-title{
	font-size: 22px;
}
.current-category{
	padding-bottom: 10px;
}
.ad-elements-container{
	margin-top: 5px;
}
}